StickyStackProvider

Overview

Hosts the framework-owned sticky chrome stack for a layout. Place it around the scrolling region (inside the layout's main content area, wrapping <RouterView>); the window remains the scroll container, so this component introduces no overflow. It renders an ordered stack of independently-revealing sticky bars pinned to the top and bottom of the viewport, establishes the useStickyStack context so the active view can teleport chrome into either zone (via StickyChrome), and publishes the visible top-stack height as --vueda-sticky-stack-top for descendants (such as a sticky grid header) to offset against.

The page title goes in the top slot (plain composition); it is the always-pinned first bar of the top stack, and the view's chrome (filters, form actions) stacks below it, each revealing on its own schedule. Each bar's sticky offset is the cumulative height of the visible bars between it and the viewport edge, so hiding one bar compacts the rest with no offsets crossing the layout boundary.

Theme entry: StickyStackProvider

Props

Name	Type	Required	Default	Description
themeOverride	String|Object|Array		null	A partial theme object merged with the component's default theme; accepts a class string, class array, or theme object.
class	import('vue').HTMLAttributes['class']		undefined	Additional CSS classes to apply to the root element.

Slots

Name	Scoped	Description
top		Pinned top chrome placed by the integrator, typically the page title. The always-visible first bar of the top stack.
default		Scrolling page content, typically the router view.
bottom		Pinned bottom chrome placed by the integrator, the bottom-most bar of the bottom stack.

Full slot reference

Source

client/lib/shell/sticky/StickyStackProvider.vue