use/useScrollReveal

Overview

Tracks scroll direction against a scroll target (the window or a scrollable container) and derives a hidden flag for page chrome that should slide out of view while the user reads and return on intent. The reveal strategy is selectable per consumer so a single scroll model can drive different tiers of sticky chrome: a submit bar that should return the moment scrolling pauses, a space-reclaiming toolbar that should stay hidden until a deliberate scroll up, or a footer that never hides. Extracted from StickyBar so the sticky-stack zones can reuse the same logic with a different reveal behavior per zone.

Methods

• revealHidden - Resolve whether chrome should be hidden, given a reveal strategy and the current scroll signals.
• useScrollReveal - Derive a reactive hidden flag from scroll direction for hide-on-scroll page chrome.

Types

ScrollRevealContext

ScrollRevealOptions

ScrollRevealState

ScrollRevealStrategy

always: never hides. hidden stays false regardless of scroll position.

• scroll-up: hides once the element's original position has scrolled out of view and stays hidden until the user scrolls up. No idle reveal, so it does not pop back when the user pauses to read; suited to the space-reclaiming toolbar tier.
• scroll-up-or-idle: like scroll-up, but also reveals after scrolling pauses for idleDelay milliseconds. Suited to a submit / action bar the user should be able to return to quickly.

A reveal that resolves to a boolean instead of one of these strings hands visibility control back to the caller entirely: true means revealed (hidden is false), false means hidden. Pass a boolean ref/getter (typically a computed) to drive show/hide from the view's own logic; in that mode scroll position is ignored.

ScrollRevealStrategy = "always" | "scroll-up" | "scroll-up-or-idle"

Source

client/lib/use/useScrollReveal.js:1