Component used for the root node. Either a string to use a HTML element or a component. |
A string of all className you want applied to the component. |
Pin the sidebar to one color scheme whatever the page uses, so a dark navigation column can sit on a light page. |
The initial open state of an uncontrolled sidebar — read once on mount. |
Make sidebar narrow. |
Callback fired when the component requests to be hidden. |
Callback fired when the sidebar enters or leaves the viewport — the sidebar is off-canvas on narrow screens, so this reports whether it is on screen, not the show state. |
Callback fired when the component requests to be shown. |
Callback fired when the sidebar requests an open-state change — a close gesture (the mobile backdrop click, an outside click or a nav link selection on mobile) or, in uncontrolled mode, any internal toggle. In controlled mode update show yourself, or the sidebar stays as it is. |
Event emitted after visibility of component changed. Use onInViewportChange instead — it reports the viewport, not the show state, and both fire while onVisibleChange is set. |
Set sidebar to overlaid variant. |
Components placement, there’s no default placement. |
Place sidebar in non-static positions. |
Control the open state. When set, the sidebar renders what show says and close gestures — the mobile backdrop click, an outside click or a nav link selection on mobile — only call onShowChange; nothing closes until the parent flips the prop. |
Size the component small, large, or extra large. |
Expand narrowed sidebar on hover. |
Toggle the visibility of sidebar component. Use defaultShow / show / onShowChange instead — visible is ignored when either of them is set. |