Z
Zyeon-AI/zyeon-ui-components
useAsyncuse-asyncA one-call async state machine with last-call-wins race protection, AbortSignal cancellation and unmount-safe resolves.
useBatteryuse-batteryReads battery level, charging state and time remaining from the Battery Status API, with a four-way support status and a low-power flag that fails open when no reading is available.
useBroadcastChanneluse-broadcast-channelBroadcasts messages between same-origin tabs over BroadcastChannel, with SSR-safe capability detection, an optional local echo and structured-clone diagnostics.
useClickOutsideuse-click-outsideA hook that runs a handler when a pointer interaction lands outside one or more referenced elements.
useClipboardPasteuse-clipboard-pasteCatches pasted images, files and rich text — page-wide or scoped to a ref — draining clipboardData synchronously, gating files through accept/maxFiles with an itemised rejection list, plus an optional permission-checked active read.
useControllableStateuse-controllable-stateA useState-shaped hook that lets one component serve both controlled (value/onChange) and uncontrolled (defaultValue) callers, with a stable setter and prop-accurate updaters.
useCookieuse-cookieA cookie-as-state hook with typed attributes, cross-instance sync, an SSR-safe default snapshot, and writes that refuse instead of silently vanishing over the 4 KB cap.
useCopyToClipboarduse-copy-to-clipboardA clipboard-copy hook with a timed copied state and a non-throwing error channel.
useCountdownuse-countdownA duration-based countdown state machine with start/pause/reset controls and a once-only onComplete callback.
useDebounceValueuse-debounce-valueA generic hook that returns a value only after it has stopped changing for a delay, with no flash on first render.
useDocumentTitleuse-document-titleSets document.title for as long as a component is mounted and restores the pre-mount title on unmount.
useDragDropFilesuse-drag-drop-filesTurns any element into a file drop zone through props to spread — a dragenter/dragleave depth counter nested children cannot flicker, an honest drag-time validity preview, dropped folders walked into relative paths, and every refusal itemised with a typed reason.
useDragScrolluse-drag-scrollGrab-to-scroll any overflow container with pointer drags — momentum glide, grabbing cursor, and click suppression so dragging over a card never fires its onClick.
useEventListeneruse-event-listenerA type-safe window/document/element event listener hook with a latest-ref handler — zero rebinds on handler change, never stale.
useEventSourceuse-event-sourceSubscribe to a Server-Sent Events stream with a four-state connection machine, capped exponential-backoff reconnects, named-event subscriptions and callbacks that never re-open the stream.
useEyeDropperuse-eye-dropperThe screen eyedropper as a hook: open() resolves to a typed outcome — picked, canceled, unsupported or failed — instead of throwing, with hydration-safe support detection, a one-pick-at-a-time guard, and an AbortSignal that unmount fires for you.
useFocusTrapuse-focus-trapA hook that keeps keyboard focus inside a container: moves focus in, cycles Tab both ways, only the innermost trap reacts, and focus returns to the trigger on release.
useFocusWithinuse-focus-withinA callback-ref hook that reports whether focus is inside a subtree — no flicker when focus moves between children, and it still flips off when the focused node is removed.
useFormPersistuse-form-persistA form-draft hook that debounces values into a versioned storage envelope, offers the draft it finds at mount instead of hydrating it, and clears the key on a successful submit.
useFpsuse-fpsA frame-rate probe that reports rolling fps over a sliding window of requestAnimationFrame timestamps, counts jank frames, and pauses instead of reporting zero while the tab is hidden.
useFullscreenuse-fullscreenA hook that requests/exits native fullscreen on a single element via a callback ref, keeping a fullscreen boolean in sync (including Esc) through useSyncExternalStore.
useGeolocationuse-geolocationReads or continuously watches the browser's geolocation behind an explicit request()/stop() pair, with hydration-safe capability detection, a queried permission state, and separate denied / timeout / position-unavailable / unsupported outcomes.
useHashuse-hashAn SSR-safe hook that reads and writes the URL hash as shareable UI state, writing through pushState/replaceState and broadcasting to every instance on the page.
useHoveruse-hoverA callback-ref hover hook that exposes a hovered boolean via pointerenter/pointerleave, for hover-driven side effects like prefetching — not for CSS-replaceable visual hover styling.
useIdleuse-idleFlips a boolean idle state after a period with no pointer, keyboard, wheel, or touch activity, with a throttled reset and SSR-safe cleanup.
useIndexedDbuse-indexed-dbAn async IndexedDB-backed store hook: loading state, versioned upgrades, blocked-deadlock handling, quota errors, key-range queries and cross-tab invalidation.
useIntersectionObserveruse-intersection-observerA callback-ref hook reporting whether an element is intersecting its viewport, with an optional one-shot reveal-once mode.
useIntervaluse-intervalA declarative setInterval hook with a nullable delay, an always-fresh callback, and pause/resume controls.
useKeyboardShortcutuse-keyboard-shortcutA hook that binds human-readable key combos like mod+k to a handler, with platform-aware modifiers and an input-focus guard.
useListuse-listArray state with every mutation you keep hand-writing — push, insertAt, move, swap and keyed upsert, all batch-safe, out-of-range-safe, and reference-stable.
useLocalStorageuse-local-storageAn SSR-safe localStorage-backed state hook, kept in sync across same-tab instances and other tabs.
useLocaleuse-localeAn SSR-safe locale snapshot — resolved tag, IANA time zone, region, direction, first day of week, numbering system and hour cycle — plus memoised Intl formatters for date, time, number, currency and relative time.
useLongPressuse-long-pressA press-and-hold gesture hook returning spreadable pointer/keyboard handlers plus isPressing and 0–1 progress — pointer-captured, cancels past a move tolerance, works with held Space/Enter.
useMapuse-mapMap-shaped React state: set, setAll, remove, replace and reset over a real Map, with any key type, copy-on-write updates, no-op bail-outs and a never-changing actions object.
useMediaQueryuse-media-queryAn SSR-safe hook that subscribes to a CSS media query and returns whether it currently matches.
useMediaRecorderuse-media-recorderMediaRecorder as a hook — start / pause / resume / stop, a live duration that excludes paused stretches, a container negotiated against what the browser really supports, permission and unsupported as first-class states, and every track stopped on unmount so the recording indicator goes out.
useMousePositionuse-mouse-positionA hook that tracks pointer position, optionally relative to an element, with clamped 0..1 normalized coordinates.
useMutationObserveruse-mutation-observerA callback-ref hook that watches DOM changes with MutationObserver — filtered attributes, rAF-batched records, and a disconnect/write/observe guard against self-feeding loops.
useMutationQueueuse-mutation-queueA durable offline write queue: enqueue with an optimistic id that doubles as an idempotency key, persist it so a reload keeps the work, drain in order when the connection returns, and park a poisoned write instead of letting it block the rest.
useNetworkInfouse-network-infoA useSyncExternalStore hook that reports connection quality rather than reachability — effectiveType, downlink, rtt and saveData normalised to nullable fields, plus one coarse quality label.
useNotificationuse-notificationSends desktop notifications behind a gesture-gated requestPermission() that never throws, keeps the permission state live via the Permissions API, registers each notification by tag so close(tag) works, and skips notifications while the page is visible.
useOnlineuse-onlineAn SSR-safe hook that tracks the browser's online/offline status via useSyncExternalStore.
useOptimisticuse-optimisticKeyed optimistic updates for plain props and event handlers: props always reclaim a stale overlay so counters cannot drift, sync throws become rejections, repeat clicks on a pending key are refused, out-of-order resolves lose, and failures roll back with a readable error.
usePageVisibilityuse-page-visibilitySubscribes to page visibility via useSyncExternalStore so polling, timers and video pause when the tab is hidden, with onVisible/onHidden callbacks and the away duration.
usePaginationuse-paginationHeadless pagination state — clamped page, page count, item range, client-side slice() and the ellipsis page sequence, controlled or uncontrolled.
usePermissionuse-permissionSubscribes to navigator.permissions for one name or a whole panel of them — query only, never request — folding Firefox's rejections, Safari's gaps, unknown names and insecure origins into one honest unsupported state with a reason, plus change-event updates and a manual query().
usePolluse-pollA polling hook that pauses in hidden tabs, catches up on return, skips a tick while a request is still in flight, and backs off through a dynamic interval.
usePrefersReducedMotionuse-prefers-reduced-motionAn SSR-safe hook that reports whether the user has asked the system to reduce motion, and updates live when the OS setting changes.
usePrevioususe-previousA hook that returns the value from one render ago, via render-time state adjustment instead of a ref+effect.
useQueryParamuse-query-paramAn SSR-safe hook that keeps a piece of state in a URL query parameter, with typed codecs, defaults kept out of the link, replace-by-default history and every instance on the page in sync.
useRafuse-rafA requestAnimationFrame loop hook that hands every frame a delta/elapsed payload, with start/stop controls, an fps cap and automatic hidden-tab suspension.
useResizeObserveruse-resize-observerA callback-ref hook that measures an element's own size with ResizeObserver — selectable box model, rAF-batched or debounced commits, and no resize-loop errors.
useRetryuse-retryA retry loop for one async call: exponential backoff with full jitter, a shouldRetry predicate, a live countdown to the next attempt, and cancellation that clears every timer.
useRovingTabindexuse-roving-tabindexA roving-tabindex hook that gives a control group one Tab stop and arrow-key navigation inside it — horizontal / vertical / grid lanes, disabled-item skipping, loop or stop, Home/End and typeahead.
useScriptuse-scriptAn on-demand external script loader hook that reports idle, loading, ready or error and keeps exactly one deduped tag per src across every caller.
useScrollDirectionuse-scroll-directionA scroll-direction hook that only re-renders on up/down flips, with a displacement threshold to ignore jitter.
useScrollLockuse-scroll-lockA controlled body-scroll lock hook with scrollbar-width compensation and a reentrant lock counter for multiple simultaneous callers.
useSelectionuse-selectionA list multi-selection state machine with Shift range, platform-aware cmd/ctrl toggle, tri-state select-all flags, and automatic pruning when items change.
useSessionStorageuse-session-storageAn SSR-safe sessionStorage-backed state hook, kept in sync across same-tab instances only.
useSounduse-soundA pooled Audio hook for short UI sounds — preloaded voices so fast triggers overlap instead of cutting each other off, a page-wide mute and master volume, every refusal named, and every element released on unmount.
useSpeechRecognitionuse-speech-recognitionSpeech-to-text on the Web Speech API: prefixed-constructor detection, interim vs settled transcripts, a continuous mode that re-arms itself after the engine's silence timeout yet always stops on stop(), and errors split into benign / recoverable / blocked.
useStepuse-stepA step machine for multi-step flows — async can-go-next gates with a pending flag, visited/completed sets, loop, and clamping when steps change.
useSwipeuse-swipeA Pointer Events swipe hook with axis/direction locking, distance-or-velocity commit and live follow-the-finger deltas — spread its props, animate the offset yourself.
useTextToSpeechuse-text-to-speechThe browser speech engine as a hook — speak/pause/resume/cancel, a voice list that survives the async voiceschanged population, word boundary events mapped back into your own string, and a cancel on unmount so navigation never leaves a voice talking.
useThrottleValueuse-throttle-valueA generic hook that throttles a fast-changing value with leading + trailing emission, ticking at most once per interval.
useTimeoutuse-timeoutA declarative one-shot setTimeout hook with a latest-ref callback, a null-to-pause delay, and reset/clear controls.
useToggleuse-toggleA boolean-state hook with a fixed toggle/setTrue/setFalse/set action set that keeps a stable reference across renders.
useUndoRedouse-undo-redoA state container with linear undo/redo history — keystroke coalescing, forced breakpoints, a bounded stack, and stable callbacks.
useVibrateuse-vibrateA Vibration API hook that plays a normalized haptic pattern from a user gesture, names every refusal instead of failing silently, honours a page-wide haptics mute, and cancels the pattern it owns on unmount.
useVisualViewportuse-visual-viewportA hook that tracks the visual viewport — size, offsets and pinch scale — and derives the keyboard occlusion so a bottom bar can sit above the on-screen keyboard.
useWakeLockuse-wake-lockKeeps the screen awake for the length of a task and re-acquires the wake lock the browser silently takes away whenever the tab is hidden, with gesture-safe requests and distinguishable refusal errors.
useWebShareuse-web-shareOpens the native share sheet with typed outcomes — a cancelled sheet is dismissed rather than an error, files are gated behind canShare, and the fallback reports its own success or failure.
useWebSocketuse-websocketOne WebSocket as a hook: a four-state connection machine, jittered backoff reconnects gated by a shouldReconnect predicate, an ordered outbound queue that covers the outage, JSON with a raw escape hatch, and a heartbeat that catches sockets that are open but dead.
useWindowSizeuse-window-sizeA hook that tracks the viewport size with per-frame or debounced commits and an explicit not-ready state before hydration.
useWorkeruse-workerRun a pure function off the main thread: the function is stringified into a Blob worker, every call is a promise matched back by id so out-of-order completions land on the right caller, transferables move in both directions, task errors reject without replacing the worker, and everything is terminated on unmount.