Vize

Référence des composables

Toutes les entrées de @vizejs/composable : contrat d'exécution (SSR, hydratation, nettoyage, cibles) et API, générés depuis les sources (en anglais).

async

Entry Exports Summary
abort-signal anyAbortSignal, timeoutAbortSignal, deadlineAbortSignal Create a signal that aborts when the first input signal aborts.
async-resource useAsyncResource Create a scoped, abortable asynchronous resource with latest-result-wins state.
retry-async retryAsync Execute an operation with bounded, abortable retries and deterministic delay policy.
use-async-queue useAsyncQueue Run async tasks one after another, each receiving the previous result.
use-async-state useAsyncState Reactive state for an async producer.
use-web-locks useWebLocks Coordinate work across tabs and workers with the Web Locks API.

capability

Entry Exports Summary
capability availableCapability, unavailableCapability, isCapabilityAvailable, isCapabilityUnavailable Create an available capability supplied directly by the current runtime.
use-contact-picker useContactPicker Let the user share contacts with the Contact Picker API.
use-payment-request usePaymentRequest Collect payments with a typed Payment Request API wrapper.
use-permission usePermission Observe a browser permission reactively.
use-screen-details useScreenDetails, placeWindow, snapshotScreen Snapshot a ScreenDetailed into a plain object.
use-supported useSupported Hydration-stable feature detection.
use-web-authn useWebAuthn, encodeBase64Url, decodeBase64Url, parseCreationOptionsFromJSON, parseRequestOptionsFromJSON, serializeRegistrationCredential, serializeAuthenticationCredential Encode bytes as unpadded base64url.

dom

Entry Exports Summary
active-element useActiveElement Track the focused element of a document.
animate useAnimate Drive the Web Animations API reactively with typed keyframes.
element-bounding useElementBounding Track an element's getBoundingClientRect() reactively.
element-by-point useElementByPoint Track the element(s) under a client coordinate.
element-ref useElementRef Capture a template element through a function ref.
element-target isElementNode, resolveElement, resolveElements Whether a value is a DOM element node.
focus useFocus, useFocusWithin Track and control focus of a single element.
infinite-scroll useInfiniteScroll Load more content when a scroll container reaches an edge.
intersection-observer useIntersectionObserver, useElementVisibility Observe the intersection of reactive elements with a root.
mutation-observer useMutationObserver Observe DOM mutations of reactive elements.
parent-element useParentElement Track the parent element of a reactive element target.
resize-observer useResizeObserver, useElementSize Observe size changes of one or more reactive elements.
scroll useScroll, useWindowScroll Track the scroll offset, edges, and direction of an element or window.
scroll-lock useScrollLock Lock scrolling of a single element by toggling overflow: hidden.
text-selection useTextSelection Track the document text selection.
textarea-autosize useTextareaAutosize Grow a textarea to fit its content.
use-css-var useCssVar Read and write a CSS custom property reactively.
use-document-title useDocumentTitle Bind the document title to reactive state.
use-favicon useFavicon Bind the page favicon to reactive state.
use-script-tag useScriptTag Inject a <script> tag and track its loading state.
use-style-tag useStyleTag Inject a reactive <style> element.
use-view-transition useViewTransition Animate DOM updates with the View Transition API.
use-visual-viewport useVisualViewport Track the visual viewport and on-screen keyboard.
virtual-list useVirtualList Render only the visible slice of a long list (fixed or variable item sizes).
window-size useWindowSize Track the window size reactively.

events

Entry Exports Summary
create-event-hook createEventHook Create a small, strongly typed event emitter.
document-visibility useDocumentVisibility Observe document visibility without touching browser globals during module evaluation.
event-listener useEventListener Attach an event listener to a reactive target and clean it up with the current reactive scope.
on-click-outside onClickOutside Call a handler when the user clicks (or focuses an iframe) outside an element.
page-leave usePageLeave Detect when the mouse leaves the page (for exit-intent UI).
use-drop-zone matchesAccept, useDropZone Test a file against accept-attribute style patterns.

i18n

Entry Exports Summary
i18n defineMessages, defineLocale, defineI18n, useI18n Declare typed message catalogs for several locales.
icu-message parseMessage, createMessageFormatter, formatMessage Parse an ICU MessageFormat string into an AST.
locale useLocale Create reactive locale metadata and platform-native formatter factories.
preferred-languages usePreferredLanguages Track the user's preferred languages (navigator.languages).
use-builtin-ai useLanguageDetector, useSummarizer, useTranslator Translate text on-device with Chrome's built-in Translator API.
use-date-format formatDate, useDateFormat Format a date with a token pattern or Intl.DateTimeFormat options.
use-date-time-format useDateTimeFormat Format dates and times reactively with Intl.DateTimeFormat.
use-display-names useDisplayNames Localized names of languages, regions, scripts, currencies, calendars, and date-time fields (Intl.DisplayNames): "JP" → "Japan", "ja" → "日本語" in Japanese, "EUR" → "Euro".
use-list-format useListFormat Join strings into a locale-aware list with Intl.ListFormat ("a, b, and c", "a、b、c", "a, b or c").
use-number-format useNumberFormat Format numbers reactively with Intl.NumberFormat.
use-plural-rules usePluralRules Choose and render a message by CLDR plural category (Intl.PluralRules).
use-relative-time-format selectRelativeTimeUnit, useRelativeTimeFormat Pick the largest unit that expresses a millisecond difference as a non-zero rounded amount: seconds below a minute, minutes below an hour, hours below a day, days below a week, weeks below a month, months below a year, and years otherwise (Gregorian average month/year lengths).
use-segmenter useSegmenter Split text into graphemes, words, or sentences with Intl.Segmenter.
use-sorted-locale useSortedLocale Sort strings locale-aware with Intl.Collator.
use-time-ago formatTimeAgo, useTimeAgo Format the distance between two instants as a localized relative phrase.

input

Entry Exports Summary
draggable useDraggable Make an element draggable with Pointer Events.
element-hover useElementHover Track whether the pointer hovers an element.
magic-keys DEFAULT_KEY_ALIASES, normalizeKeyName, useMagicKeys, useKeyPressed Default aliases resolved before matching combos.
mouse useMouse Track the mouse (and optionally touch) position.
mouse-in-element useMouseInElement Track the pointer position relative to an element.
on-key-stroke onKeyStroke, onKeyDown, onKeyUp Run a handler when matching keys are pressed.
on-long-press onLongPress Call a handler when an element is pressed and held.
on-start-typing isTypingKeystroke, onStartTyping Whether a keyboard event would type a printable character.
pinch usePinch Recognize two-pointer pinch/rotate gestures on an element.
pointer usePointer, toPointerKind Track the latest pointer (mouse, touch, or pen) state.
pointer-lock PointerLockError, usePointerLock Error thrown when pointer lock cannot be acquired or released.
swipe swipeDirection, useSwipe, usePointerSwipe Classify a displacement into a SwipeDirection.
use-gamepad useGamepad, mapGamepad, snapshotGamepad, standardGamepadButtons, standardGamepadAxes Button indices of the W3C "standard" gamepad mapping.
use-user-activation useUserActivation Track sticky and transient user activation with the User Activation API.

lifecycle

Entry Exports Summary
disposal-scope DISPOSAL_ERROR_CODE, DisposalError, createDisposalScope Stable error code reported when one or more owned cleanups fail.
scope tryOnScopeDispose Register cleanup in the active reactive scope when one exists.
use-mounted useMounted Whether the calling component has mounted.

media

Entry Exports Summary
breakpoints breakpointsTailwind, breakpointsBootstrapV5, useBreakpoints, toPixels Tailwind CSS default breakpoints.
color-mode useColorMode, useDark Reactive color mode with persistence and DOM application.
device-pixel-ratio useDevicePixelRatio Track window.devicePixelRatio (zoom and moving between displays).
media-query useMediaQuery, useReducedMotion Evaluate a reactive media query without requiring browser globals.
preferences usePreferredDark, usePreferredColorScheme, usePreferredContrast, usePreferredReducedTransparency Whether the user prefers a dark color scheme.
use-barcode-detector useBarcodeDetector Detect barcodes and QR codes with the Barcode Detection API.
use-display-media useDisplayMedia Capture a screen, window, or tab with getDisplayMedia.
use-image useImage Preload an image and track its loading state.
use-media-controls useMediaControls Two-way reactive controls for a <video> or <audio> element.
use-object-url useObjectUrl Create a reactive object URL for a Blob, File, or MediaSource.
use-speech-recognition useSpeechRecognition Transcribe speech with the Web Speech API.
use-speech-synthesis useSpeechSynthesis Speak text with the Web Speech API.
use-user-media useMediaStream, useUserMedia Manage the lifecycle of a media stream from any asynchronous source.

networking

Entry Exports Summary
network useNetwork, useOnline Track connectivity and connection quality.
use-broadcast-channel useBroadcastChannel Exchange typed messages with other tabs, windows, and workers of the same origin through the Broadcast Channel API.
use-event-source useEventSource Reactive Server-Sent Events stream with typed, per-event decoding.
use-fetch useFetch Fetch typed data with a custom parse decoder.
use-push-subscription usePushSubscription Manage a Web Push subscription.
use-service-worker useServiceWorker Register a service worker and follow its update lifecycle.
use-websocket useWebSocket Open a WebSocket with raw payloads.

other

Entry Exports Summary
resolver VIZE_COMPOSABLE_PACKAGE, VizeComposableResolver, createVizeComposableDeclarations, listVizeComposableImports, readComposableLockfile, vizeComposableImports Package that owns the resolvable exports.
timeout-scheduler — Single-shot timer host used by the debounced and throttled state utilities. Implement this interface to integrate a deterministic test clock, a native runtime timer, or an application-owned scheduler. Handles are opaque: the utilities only hand them back to TimeoutScheduler.clearTimeout. This module declares types only and contributes no runtime code.
watch-source — Shared source and callback typing for the watch helpers (watchDebounced, watchThrottled, watchPausable, watchIgnorable, watchOnce, whenever). The helpers accept the same sources as Vue's watch: a ref, a getter, a reactive object, or a tuple of those. This module declares types only and contributes no runtime code.

performance

Entry Exports Summary
fps useFps Measure the rendering frame rate with requestAnimationFrame.
use-memoize useMemoize Cache a function's results per argument list.
use-performance-observer usePerformanceObserver Observe performance entries with callbacks typed by entry type.
use-web-vitals WEB_VITALS_THRESHOLDS, rateMetric, useWebVitals Standard [good, poor] thresholds: values up to the first bound are "good", values above the second are "poor".
use-worker-fn createWorkerFnScript, useWorkerFn Build the worker script for fn.

reactivity

Entry Exports Summary
computed-async computedAsync Computed value backed by an async evaluator.
computed-with-control computedWithControl Computed value whose dependencies are declared explicitly.
reactify reactify Turn a plain function into one that accepts refs/getters and returns a computed result.
ref-auto-reset refAutoReset Writable ref that falls back to a default value afterMs milliseconds after each write.
ref-default refDefault View a nullable ref through a default value.
sync-ref syncRef Keep two refs in sync, optionally converting between their types.
to-reactive toReactive Reactive object view over a ref that holds an object.
until until Await a reactive source reaching a condition.
use-v-model useVModel, useVModels Two-way binding helper for a component prop.
watch-ignorable watchIgnorable Watch sources like Vue's watch, with a way to make changes the callback should not see.
watch-once watchOnce Watch sources like Vue's watch, delivering exactly one change and then stopping.
watch-pausable watchPausable Watch sources like Vue's watch, with pause and resume.
whenever whenever Run a callback whenever a source becomes (or changes while) truthy.

sensors

Entry Exports Summary
device-motion useDeviceMotion Track device acceleration and rotation rate.
device-orientation useDeviceOrientation, requestMotionPermission Track device orientation angles.
geolocation useGeolocation Watch the device position with the Geolocation API.

state

Entry Exports Summary
create-global-state createGlobalState Lift a state factory into application-wide state shared by every caller.
create-injection-state createInjectionState Create a typed provide/inject pair around a composable, for component subtrees that share request-local state.
create-shared-composable createSharedComposable Share one instance of a composable between all simultaneously mounted callers, reference-counted by their effect scopes.
math useClamp, useRound, useProjection Number kept inside [min, max].
standard-schema formatSchemaPath, isStandardSchema, validateStandardSchema Whether a value implements the Standard Schema v1 protocol.
use-array useArrayFilter, useArrayMap, useArrayFind, useArrayReduce, useArraySome, useArrayEvery, useArrayUnique Reactive Array.prototype.filter.
use-confirm-dialog useConfirmDialog Promise-based confirm dialog state machine (idle → revealed → idle), independent of any dialog markup.
use-counter useCounter Create a clamped counter whose every transition stays inside [min, max].
use-cycle-list useCycleList Cycle through a list with wrap-around navigation.
use-field useField A standalone validated field, independent of any form.
use-form useForm Fully typed form state with validation, field arrays, and submission.
use-form-field-props formFieldId, toFormFieldErrors, useFormErrorSummaryFields, useFormFieldProps Derive the default control id for a path.
use-history useHistory Record bounded undo/redo history over the writes of a ref.
use-id-generator useIdGenerator Create an SSR-stable id factory for one component.
use-machine useMachine Finite state machine with typed states, events, and targets.
use-map useMap Create a reactive Map with typed helpers.
use-offset-pagination useOffsetPagination Offset-based pagination state.
use-previous usePrevious Track the value a reactive source held before its latest change.
use-queue useQueue Create a typed reactive FIFO queue.
use-route-query queryParsers, oneOf, useRouteQuery, useRouteParams Built-in QueryParsers.
use-selection useSelection Generic single- or multi-select state for lists, tables, and grids.
use-set useSet Create a reactive Set with typed helpers.
use-sorted useSorted Sorted copy of a reactive array; the source is never mutated.
use-stack useStack Create a typed reactive LIFO stack.
use-stepper useStepper Linear multi-step flow (wizards, onboarding, checkout) with typed step names.
use-toggle useToggle Create owned boolean state with an inverting control.
use-url-hash useUrlHash Track the URL fragment as a typed value decoded by parse.
use-url-search-params parseSearchParams, searchParam, serializeSearchParams, useUrlSearchParams Built-in typed codecs for useUrlSearchParams schemas.

storage

Entry Exports Summary
use-cookie COOKIE_ADAPTER_KEY, parseCookieHeader, provideCookieAdapter, serializeCookie, useCookie Parse a Cookie request header (or document.cookie) into name/value pairs.
use-file-system-access useFileSystemAccess Open, edit, and save local files with the File System Access API.
use-indexed-db createIndexedDBKeyval, useIndexedDB Create a small promise-based key-value store on one IndexedDB object store.
use-storage inferStorageSerializerKind, storageSerializers, useLocalStorage, useSessionStorage, useStorage Typed built-in serializers, usable directly as the serializer option.
use-storage-estimate usePersistentStorage, useStorageEstimate Track the origin's storage usage and quota with navigator.storage.estimate().

system

Entry Exports Summary
battery useBattery Track the device battery with the Battery Status API.
idle DEFAULT_IDLE_EVENTS, useIdle Default activity events.
screen-orientation useScreenOrientation Track the screen orientation.
use-bluetooth useBluetooth Connect to Bluetooth Low Energy devices with the Web Bluetooth API.
use-clipboard useClipboard Permission-aware clipboard access with a legacy copy fallback.
use-compression-stream compress, decompress, decompressText, useCompressionStream Compress data with the Compression Streams API.
use-eye-dropper useEyeDropper Pick a color from anywhere on screen with the EyeDropper API.
use-file-dialog useFileDialog Open the native file picker without rendering an input.
use-fullscreen useFullscreen Enter, exit, and observe fullscreen for an element.
use-hid useHID Talk to human-interface devices with the WebHID API.
use-navigation-api useNavigationApi Reactive access to the Navigation API (window.navigation).
use-notification useWebNotification Show typed Web Notifications with permission handling.
use-serial useSerial Talk to serial devices with the Web Serial API.
use-share useShare Share text, links, and files through the platform share sheet.
use-usb useUSB Talk to USB devices with the WebUSB API.
use-vibrate useVibrate Drive the Vibration API with validated, optionally repeating patterns.
use-wake-lock useWakeLock Keep the screen awake with the Screen Wake Lock API.
use-web-midi useWebMIDI Access MIDI devices with the Web MIDI API.

timing

Entry Exports Summary
ref-debounced refDebounced Readonly ref that follows source after it stayed quiet for waitMs.
retry-delay calculateRetryDelay Calculate a bounded exponential-backoff delay for a one-based retry.
temporal Temporal, TemporalIntl, useTemporalNow, useTemporalZonedDateTime Creates a pauseable Temporal clock whose timer follows the current Vue effect scope.
transition TransitionPresets, useTransition, cubicBezier Named cubic Bézier easing presets (the classic easings.net set).
use-countdown useCountdown Count down from a number of ticks to zero.
use-debounced useDebounced Create a readonly debounced view of a reactive source.
use-interval useIntervalFn, useInterval Call a function on a fixed, pausable interval.
use-now useTimestamp, useNow Reactive Unix timestamp in milliseconds.
use-raf-fn useRafFn Run a callback on every animation frame, with pause/resume controls and an optional frame-rate cap.
use-request-idle-callback idle, useRequestIdleCallback Run a callback in the next idle period with requestIdleCallback.
use-scheduler-post-task useSchedulerPostTask Post prioritized tasks with the Prioritized Task Scheduling API.
use-throttled useThrottled Create a readonly throttled view of a reactive source.
use-timeout useTimeoutFn, useTimeout Call a function once after a delay, with restart and cancel controls.
watch-debounced watchDebounced Watch sources like Vue's watch, but run the callback only after the sources stayed quiet for debounce milliseconds.
watch-throttled watchThrottled Watch sources like Vue's watch, but run the callback at most once per cooldown window.

Released under the MIT License.

Copyright © 2024-2026 ubugeeei