Hooks

Reactberry exports its hooks from the package root. They are client-only; call them from components marked "use client".

Import#

import { useHover, useClickOutside, useLocalStorage } from "@reactberry/system";

useSidebar and SidebarProvider are exported from @reactberry/system/providers.

Hook reference#

Interaction#

• useHover — hover state for one element.
• useClickOutside — call a handler on clicks or taps outside an element.
• useKeyboardShortcuts — Cmd/Ctrl shortcuts for composer-style screens.
• useEnterSubmit — submit a form with Enter from a textarea.
• useHoverList() — returns { hoveredIndex, getHoverProps(index) }; spread getHoverProps(i) onto each item.
• useKeypress(key, callback) — calls callback when key (for example "Escape") is pressed.

Text and input#

• useAutosizeTextArea — grow a textarea with its content.
• useAnimatedText — reveal text character by character, for streamed responses.
• useCopyToClipboard — copy text and show a temporary "copied" state.

Storage and environment#

• useLocalStorage — state backed by localStorage.
• useStandaloneMode — whether the app runs as an installed PWA.
• useBreakpoint(bp) / useShowOnBreakpoint(bp) — true when the viewport is at or above bp, or exactly at bp. Requires BreakpointProvider above the component. Breakpoints: _ (below xs), xs 32rem, sm 48rem, md 64rem, lg 80rem, xl 96rem.
• useOverlay(isOpen = true) — returns { mounted, isStandalone } for SSR-safe overlay mounting.
• useReducedMotion() — true when the user prefers reduced motion.
• useTouchDevice() — true when touch is the primary input.

Floating panels#

• useDraggableResizable — the move and resize engine behind DraggableResizableModal.