Skip to main content

Upstream Hook Exports

These exports exist so business projects can import common hooks through @vef-framework-react/hooks instead of managing several third-party entry points directly.

Wrapped Media and Environment Hooks​

VEF wraps these Mantine hooks to normalize the getInitialValueInEffect behavior (default false, so the initial value is read on mount rather than deferred to an effect):

HookSignatureDescription
useMediaQuery(query: string, initialValue?: boolean, options?: { getInitialValueInEffect?: boolean }) => booleanMatches a CSS media query.
useColorScheme(initialValue?: "light" | "dark", options?: { getInitialValueInEffect?: boolean }) => "light" | "dark"Reads the OS-level prefers-color-scheme.
useReducedMotion(initialValue?: boolean, options?: { getInitialValueInEffect?: boolean }) => booleanReads the OS-level prefers-reduced-motion.
useElementSize<T extends HTMLElement>(options?: ResizeObserverOptions) => { ref: RefCallback<T | null>; width: number; height: number }Tracks an element's size via ResizeObserver; VEF defaults box: "border-box".

Mantine Re-Exports​

Passed through as-is from @mantine/hooks:

  • useDebouncedCallback
  • useDebouncedState
  • useDebouncedValue
  • useDidUpdate
  • useDocumentTitle
  • useEventListener
  • useFocusTrap
  • useFullscreenDocument
  • useIntersection
  • useInterval
  • useIsFirstRender
  • useIsomorphicEffect
  • useMergedRef
  • useMounted
  • useMutationObserverTarget
  • usePrevious
  • useResizeObserver
  • useTimeout
  • useWindowEvent
  • assignRef — not a hook; a ref-assignment helper used alongside mergeRefs
  • getHotkeyHandler — not a hook; builds a keydown handler from a hotkey list
  • mergeRefs — not a hook; combines multiple refs into one callback ref

Official docs: Mantine Hooks

Hotkey Exports​

Passed through as-is from react-hotkeys-hook:

  • HotkeysProvider
  • useHotkeys
  • useHotkeysContext
  • useRecordHotkeys
  • HotkeyCallback — type of the callback passed to useHotkeys
  • HotkeysOptions — the hook's options type (react-hotkeys-hook's Options, renamed)

Official docs: react-hotkeys-hook