react-hook-toolkit 4.0.0 → 5.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,36 +1,289 @@
1
-
2
- **react-hook-toolkit** package offers a comprehensive set of hooks to simplify React development. It includes hooks for managing state, handling API requests, optimizing performance, and improving user interactions. Key features include data fetching, form handling, local storage management, debouncing/throttling, window size tracking, event listeners, and more. These hooks are designed to enhance productivity by providing reusable, easy-to-use solutions for common tasks.
3
-
4
- **Note : This lightweight and type-safe package is written in TypeScript and offers full support for all hooks across all modern browsers.**
5
-
6
- ### Installation
7
-
8
- Install the package:
9
-
10
- ```bash
11
- npm install react-hook-toolkit
12
- # or
13
- pnpm add react-hook-toolkit
14
- ```
15
-
16
- ### **Authors**
17
-
18
- ![NPM](https://img.shields.io/badge/Author-React_Developers-red)   ![npm](https://img.shields.io/npm/v/react-hook-toolkit?color=1C939D)   ![npm](https://img.shields.io/npm/dt/react-hook-toolkit)   ![NPM](https://img.shields.io/npm/l/react-hook-toolkit)   ![NPM Unpacked Size](https://img.shields.io/npm/unpacked-size/react-hook-toolkit)
19
-
20
- ### **Browser Support**
21
-
22
- | ![Firefox](https://raw.githubusercontent.com/alrra/browser-logos/main/src/firefox/firefox_48x48.png) | ![Chrome](https://raw.githubusercontent.com/alrra/browser-logos/main/src/chrome/chrome_48x48.png) | ![Safari](https://raw.githubusercontent.com/alrra/browser-logos/main/src/safari/safari_48x48.png) | ![Opera](https://raw.githubusercontent.com/alrra/browser-logos/main/src/opera/opera_48x48.png) | ![Edge](https://raw.githubusercontent.com/alrra/browser-logos/main/src/edge/edge_48x48.png)
23
- | ------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- |
24
- | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ |
25
-
26
-
27
- ### **Documentation**
28
-
29
- Comprehensive documentation with step-by-step guides, practical examples, and easy-to-follow explanations to help you quickly understand and use all custom hooks effectively.
30
-
31
- 👉 https://react-hook-toolkit.netlify.app
32
-
33
-
34
- **License**
35
-
36
- [MIT](https://docs.npmjs.com/policies/npm-license) © (2022-2024)
1
+
2
+ **react-hook-toolkit** package offers a comprehensive set of hooks to simplify React development. It includes hooks for managing state, handling API requests, optimizing performance, and improving user interactions. Key features include data fetching, form handling, local storage management, debouncing/throttling, window size tracking, event listeners, and more. These hooks are designed to enhance productivity by providing reusable, easy-to-use solutions for common tasks.
3
+
4
+ **Note : This lightweight and type-safe package is written in TypeScript and offers full support for all hooks across all modern browsers.**
5
+
6
+ ### Installation
7
+
8
+ Install the package:
9
+
10
+ ```bash
11
+ npm install react-hook-toolkit
12
+ # or
13
+ pnpm add react-hook-toolkit
14
+ ```
15
+
16
+ ### **Authors**
17
+
18
+ ![NPM](https://img.shields.io/badge/Author-React_Developers-red)   ![npm](https://img.shields.io/npm/v/react-hook-toolkit?color=1C939D)   ![npm](https://img.shields.io/npm/dt/react-hook-toolkit)   ![NPM](https://img.shields.io/npm/l/react-hook-toolkit)   ![NPM Unpacked Size](https://img.shields.io/npm/unpacked-size/react-hook-toolkit)
19
+
20
+ ### **Browser Support**
21
+
22
+ | ![Firefox](https://raw.githubusercontent.com/alrra/browser-logos/main/src/firefox/firefox_48x48.png) | ![Chrome](https://raw.githubusercontent.com/alrra/browser-logos/main/src/chrome/chrome_48x48.png) | ![Safari](https://raw.githubusercontent.com/alrra/browser-logos/main/src/safari/safari_48x48.png) | ![Opera](https://raw.githubusercontent.com/alrra/browser-logos/main/src/opera/opera_48x48.png) | ![Edge](https://raw.githubusercontent.com/alrra/browser-logos/main/src/edge/edge_48x48.png)
23
+ | ------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- |
24
+ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ |
25
+
26
+
27
+ ### **Documentation**
28
+
29
+ Comprehensive documentation with step-by-step guides, practical examples, and easy-to-follow explanations to help you quickly understand and use all custom hooks effectively.
30
+
31
+ 👉 https://react-hook-toolkit.netlify.app
32
+
33
+
34
+ ---
35
+
36
+ ## Available Hooks
37
+
38
+ ### 🔄 State & Data Management
39
+
40
+ | Hook | Description |
41
+ |------|-------------|
42
+ | `useToggle` | Boolean toggle with a stable flip function |
43
+ | `useBoolean` | Boolean with explicit `setTrue` / `setFalse` / `toggle` / `set` |
44
+ | `usePrevious` | Returns the value from the previous render |
45
+ | `useArray` | Array state with push, removeByIndex, clear helpers |
46
+ | `useList` | Array state with rich set/push/removeAt/insertAt/updateAt/clear actions |
47
+ | `useCounter` | Numeric counter with min/max/step bounds and increment/decrement/reset/set |
48
+ | `useMap` | Map data structure as React state with get/set/delete/clear |
49
+ | `useSet` | Set data structure as React state with add/delete/toggle/clear |
50
+ | `useQueue` | FIFO queue with enqueue/dequeue/peek/clear |
51
+ | `useStack` | LIFO stack with push/pop/peek/clear |
52
+ | `useUndo` | Simple undo/redo state stack |
53
+ | `useHistoryState` | Full undo/redo history with past, present, and future arrays |
54
+ | `useHistory` | push/replace/goBack/goForward wrappers around the History API |
55
+ | `useStateWithCallback` | setState that fires a callback after the update is applied |
56
+ | `useMergeState` | Object state with partial merge (like class component setState) |
57
+ | `useResetState` | useState augmented with a reset() that restores the initial value |
58
+ | `useSyncedState` | State synced across browser tabs/windows via BroadcastChannel |
59
+ | `useDerivedState` | Memoized value computed from a source with explicit transform |
60
+ | `usePatch` | Object state with a patch() method for one-level deep partial updates |
61
+ | `usePersistedState` | useState synced to localStorage |
62
+ | `useSafeState` | Suppresses state updates after component unmount |
63
+ | `useRafState` | Batches state updates via requestAnimationFrame |
64
+ | `useForceUpdate` | Returns a function that forces a component re-render |
65
+ | `useGenericReducer` | Factory for creating typed reducers |
66
+
67
+ ### 🌐 Fetching & API
68
+
69
+ | Hook | Description |
70
+ |------|-------------|
71
+ | `useAsync` | Runs an async function on mount, tracks status/value/error |
72
+ | `useAsyncCallback` | Imperative async wrapper — isPending/data/error/reset; does not auto-run |
73
+ | `useRequest` | Fetches JSON from a URL, returns `{ data, loading, error }` |
74
+ | `useRequestRetry` | Like `useRequest` with automatic retry on failure |
75
+ | `useAbortFetch` | Fetch with AbortController — auto-cancels on unmount or URL change |
76
+ | `useLazyFetch` | Fetch triggered manually (not on mount) |
77
+ | `usePolling` | Repeatedly calls an async fetcher on a fixed interval |
78
+ | `useOptimisticUpdate` | Applies an optimistic value immediately, rolls back on error |
79
+ | `useInfiniteScroll` | Loads paginated data as the user scrolls to the bottom |
80
+ | `useWebSocket` | Connects to a WebSocket and exposes data/send/isConnected |
81
+
82
+ ### ⏱ Timing & Async
83
+
84
+ | Hook | Description |
85
+ |------|-------------|
86
+ | `useDebounce` | Debounced copy of a value |
87
+ | `useDebouncedValue` | Alias for `useDebounce` |
88
+ | `useDebouncedCallback` | Debounced callback function |
89
+ | `useDebouncedState` | State that only updates after the setter hasn't been called for N ms |
90
+ | `useThrottle` | Throttled copy of a value |
91
+ | `useDelay` | Delays propagation of a value by a fixed time |
92
+ | `useInterval` | Runs a callback on a repeating interval |
93
+ | `useTimeout` | Runs a callback once after a delay |
94
+ | `useTimer` | Countdown timer that decrements every second |
95
+ | `useCountUp` | Animates a number from 0 up to a target |
96
+ | `useCountDown` | Animates a number from a start value down to 0 |
97
+ | `useClock` | Returns a live `Date` updated every N milliseconds |
98
+ | `useStopwatch` | Start/stop/reset/lap elapsed-time stopwatch in milliseconds |
99
+ | `useAnimationFrame` | Calls a callback on every rAF frame; returns start/stop/isRunning |
100
+ | `useIdleCallback` | Schedules a callback with requestIdleCallback (setTimeout fallback) |
101
+ | `useAsyncEffect` | useEffect wrapper that accepts an async function with cancellation guard |
102
+
103
+ ### 💾 Browser Storage
104
+
105
+ | Hook | Description |
106
+ |------|-------------|
107
+ | `useLocalStorage` | Reads/writes a localStorage key as state |
108
+ | `useSessionStorage` | Reads/writes a sessionStorage key as state |
109
+ | `useCookie` | Reads, writes, and deletes a browser cookie |
110
+ | `useIndexedDB` | Reads all records from an IndexedDB object store |
111
+ | `usePersistedForm` | Form state that auto-saves to localStorage |
112
+ | `usePersistedState` | Generic state synced to localStorage |
113
+
114
+ ### 📐 DOM & Layout
115
+
116
+ | Hook | Description |
117
+ |------|-------------|
118
+ | `useWindowSize` | Reactive window width and height |
119
+ | `useResizeObserver` | Observes size changes on a ref'd element |
120
+ | `useMeasure` | Full bounding rect of a ref'd element, updates on resize |
121
+ | `useRect` | Reactive bounding DOMRect via ResizeObserver + scroll — returns `[ref, rect]` |
122
+ | `useScrollPosition` | Current page scroll X/Y |
123
+ | `useScrollDirection` | Whether the user is scrolling `'up'` or `'down'` |
124
+ | `useScrollLock` | Locks/unlocks `document.body` overflow |
125
+ | `useLockBodyScroll` | Locks body scroll and compensates for scrollbar width |
126
+ | `useScrollToTop` | Returns `[isVisible, scrollToTop]` — shows button after threshold |
127
+ | `useScrollIntoView` | Returns ref + function that scrolls the element into the viewport |
128
+ | `useScrollThreshold` | Returns true when page (or element) has scrolled past a pixel offset |
129
+ | `useMousePosition` | Current mouse X/Y relative to the viewport |
130
+ | `useIntersectionObserver` | Tracks whether a ref'd element is visible in the viewport |
131
+ | `useInView` | Convenience `[ref, inView]` wrapper over IntersectionObserver; supports `once` |
132
+ | `useMutationObserver` | Observes DOM mutations on a ref'd element |
133
+ | `useGridLayout` | Tracks CSS grid column and row count of a ref'd element |
134
+ | `useVirtualList` | Windowed (virtual) list — only renders visible items |
135
+ | `useFocusTrap` | Traps keyboard Tab focus within a container (for modals/dialogs) |
136
+ | `useEventListener` | Attaches a single event listener to an element or window |
137
+ | `useEventListeners` | Attaches an event listener with a stable handler ref |
138
+ | `useScript` | Dynamically loads an external script and reports its status |
139
+ | `useCss` | Injects a CSS string into the document head |
140
+ | `useImageLoader` | Tracks loaded/error state of an image src |
141
+ | `useTitle` | Reactively sets `document.title`; optionally restores it on unmount |
142
+ | `useFavicon` | Dynamically updates the page favicon href |
143
+
144
+ ### 🎨 UI & Interaction
145
+
146
+ | Hook | Description |
147
+ |------|-------------|
148
+ | `useDarkMode` | Tracks and toggles dark mode preference |
149
+ | `useTheme` | light/dark/system theme with localStorage persistence and `data-theme` attribute |
150
+ | `useBreakpoint` | Named breakpoint (`xs`/`sm`/`md`/`lg`/`xl`/`2xl`) from window width |
151
+ | `useMediaQuery` | Returns true when a CSS media query matches |
152
+ | `useReducedMotion` | Returns true when the user prefers reduced motion |
153
+ | `useRipple` | Material-style ripple effect — returns ripple entries and onMouseDown handler |
154
+ | `useToast` | Toast notification state manager with auto-dismiss |
155
+ | `useModal` | Modal open/close state with body scroll lock |
156
+ | `useContextMenu` | Right-click context menu position state |
157
+ | `useHover` | Tracks hover via mouseenter/mouseleave, returns `[ref, isHovered]` |
158
+ | `useHoverDirty` | Tracks hover via mouseover/mouseout on a ref'd element |
159
+ | `useFocus` | Tracks focus state of a ref'd element with programmatic focus/blur |
160
+ | `useClickAway` | Calls a handler when a click occurs outside a ref'd element |
161
+ | `useLongPress` | Fires a callback after a sustained press (mouse or touch) |
162
+ | `useTouch` | Tracks touchstart/touchmove/touchend coordinates on an element |
163
+ | `useSwiping` | Detects swipe gestures (left/right/up/down) with directional callbacks |
164
+ | `usePointers` | Handles all pointer events and tracks active pointers by pointerId |
165
+ | `useDragAndDrop` | Container + draggable item props with `onDrop(from, to)` callback |
166
+ | `useDragReorder` | Drag-and-drop list reordering |
167
+ | `useFileDropArea` | File drag-drop + input handling with type/size validation |
168
+ | `useSelection` | Returns currently selected text and its bounding DOMRect |
169
+
170
+ ### ⌨️ Input & Forms
171
+
172
+ | Hook | Description |
173
+ |------|-------------|
174
+ | `useInput` | Controlled input state with value/onChange/reset and spread-ready `bind` |
175
+ | `useCheckbox` | Controlled checkbox state with toggle and spread-ready `bind` |
176
+ | `useForm` | Basic form values + per-field validation |
177
+ | `useSmartForm` | Form with auto-save to localStorage and dirty tracking |
178
+ | `useFormSubmit` | Wraps an async submit handler with isSubmitting/submitError |
179
+ | `useFormWizard` | Multi-step form wizard with per-step validation |
180
+ | `useFieldArray` | Dynamic field arrays with append/remove/update |
181
+ | `useCrossFieldValidation` | Cross-field validation returning per-field errors |
182
+ | `useValidation` | Standalone field validation with an array of validator functions |
183
+ | `useSearch` | Search query state with filtered results and optional debounce |
184
+ | `useFilter` | Filters an array by a predicate function |
185
+ | `useSort` | Sorts an array by key with direction toggling |
186
+ | `useAutocomplete` | Suggestions list with keyboard navigation (Up/Down/Enter/Escape) |
187
+
188
+ ### 🧭 Navigation & Routing
189
+
190
+ | Hook | Description |
191
+ |------|-------------|
192
+ | `useRouter` | Minimal client-side router with pathname, searchParams, and navigate |
193
+ | `useNavigationState` | Tracks pathname/search/state from pushState/popstate |
194
+ | `useHistoryState` | Undo/redo state with full history (past/present/future) |
195
+ | `useMenuNavigation` | Flattens nested menu data and handles path-based selection |
196
+ | `useHash` | Reads and writes the URL hash fragment as state |
197
+ | `useQueryParams` | Reads and writes URL search parameters reactively |
198
+ | `useParams` | Extracts named dynamic route parameters from the current URL path |
199
+ | `usePagination` | Client-side pagination: page, pageSize, totalPages, offset, next/prev/goTo |
200
+
201
+ ### 🔐 Auth & Permissions
202
+
203
+ | Hook | Description |
204
+ |------|-------------|
205
+ | `usePermission` | Queries the Permissions API for a descriptor |
206
+
207
+ ### 📡 Browser & Device
208
+
209
+ | Hook | Description |
210
+ |------|-------------|
211
+ | `useBattery` | Battery level, charging state, and charge/discharge times |
212
+ | `useGeoLocation` | Current geolocation position |
213
+ | `useOnlineStatus` | Whether the browser is online |
214
+ | `useNetwork` | Network info: effectiveType, downlink, rtt, saveData |
215
+ | `useNetworkState` | Full NetworkInformation API with `since` timestamp |
216
+ | `useOrientation` | Device screen orientation type/angle with isPortrait/isLandscape |
217
+ | `usePreferredLanguage` | Navigator language and languages list |
218
+ | `useIdle` | Detects user inactivity after a configurable timeout |
219
+ | `usePageVisibility` | Returns true when the current browser tab is visible |
220
+ | `useBrowser` | Full browser controls: navigate, reload, fullscreen, clipboard, share, and more |
221
+ | `useFullscreen` | Fullscreen API for a ref'd element with enter/exit/toggle |
222
+ | `useMediaDevices` | getUserMedia access + device enumeration for camera and microphone |
223
+ | `useAudioAnalyser` | Real-time audio frequency and time-domain data via AnalyserNode |
224
+ | `useScreenCapture` | Screen/window/tab capture via getDisplayMedia |
225
+ | `useGamepad` | Polls Gamepad API state on every rAF frame |
226
+ | `useNotification` | Web Notifications API — request permission and show notifications |
227
+ | `useVibration` | Vibration API — trigger device vibration with a pattern |
228
+ | `useWakeLock` | Screen Wake Lock API — prevents screen from sleeping |
229
+ | `useShareSheet` | Web Share API — triggers the native OS share sheet |
230
+ | `useMotion` | Device motion sensor (acceleration, rotation rate) |
231
+ | `useWorker` | Runs a function in a Web Worker background thread |
232
+
233
+ ### 🗣 Speech & Audio
234
+
235
+ | Hook | Description |
236
+ |------|-------------|
237
+ | `useSpeech` | Text-to-speech via the SpeechSynthesis API (declarative) |
238
+ | `useSpeak` | Text-to-speech with imperative speak/stop/pause/resume controls |
239
+ | `useVoice` | Speech recognition with command matching, history, wake word, and shortcuts |
240
+ | `useSound` | HTML audio player with play/pause/stop/setVolume controls |
241
+
242
+ ### 🔁 Lifecycle & Utilities
243
+
244
+ | Hook | Description |
245
+ |------|-------------|
246
+ | `useIsMounted` | Returns true after the component mounts |
247
+ | `useIsFirstRender` | Returns true only on the very first render |
248
+ | `useUnmountedRef` | Ref that becomes true after the component unmounts |
249
+ | `useUpdateEffect` | Like useEffect but skips the first (mount) run |
250
+ | `useIsomorphicEffect` | useLayoutEffect on the browser, useEffect on the server (SSR-safe) |
251
+ | `useBeforeUnload` | Prompts the user before leaving the page |
252
+ | `usePageLeave` | Fires a callback when the mouse leaves the page |
253
+ | `useVisibilityChange` | Returns true when the browser tab is visible |
254
+ | `useLatest` | Ref that always holds the most recent value — avoids stale closures |
255
+ | `useEventCallback` | Stable callback ref — safe for event listeners without re-subscribing |
256
+ | `useStableCallback` | Semantic alias for useEventCallback |
257
+ | `useConstant` | Evaluates an initializer once and never recomputes it |
258
+ | `useComputed` | Memoized derived value — semantic alias for useMemo |
259
+ | `useDeepCompareEffect` | useEffect with deep equality dep comparison |
260
+ | `useDeepCompareMemo` | useMemo with deep equality dep comparison |
261
+ | `useShallowEqual` | Returns the previous (stable) reference when value is shallowly equal |
262
+ | `useStepper` | Step wizard with next/back/reset/goto and isFirstStep/isLastStep |
263
+ | `useRecentSearch` | Persists and manages a recent-searches list in localStorage |
264
+ | `useEventEmitter` | In-component pub/sub: on/off/emit/once/clear |
265
+ | `useClipboard` | Copy text to the clipboard with a copied state |
266
+ | `useScrollIntoView` | Returns ref + scrollIntoView() function |
267
+
268
+ ### 🛠 Context & Optimization
269
+
270
+ | Hook | Description |
271
+ |------|-------------|
272
+ | `createOptimizedContext` | Creates a context with a selector-based hook to avoid unnecessary re-renders |
273
+ | `useDrawer` | Consumes the DrawerContext (open/close/state) |
274
+
275
+ ### 🐛 Developer Tools
276
+
277
+ | Hook | Description |
278
+ |------|-------------|
279
+ | `useWhyDidYouUpdate` | Logs which props/state changed to trigger the last render (dev only) |
280
+ | `useLogger` | Logs a label and values on every render (dev only) |
281
+ | `useRenderCount` | Returns the number of times the component has rendered |
282
+ | `useErrorBoundary` | Imperative showBoundary(error) to surface errors to the nearest ErrorBoundary |
283
+ | `useReducerLogger` | Wraps useReducer to log every action and state change (dev only) |
284
+
285
+ ---
286
+
287
+ **License**
288
+
289
+ [MIT](https://docs.npmjs.com/policies/npm-license) © (2022-2024)
@@ -0,0 +1,190 @@
1
+ import { MutableRefObject } from 'react';
2
+ interface UseCounterOptions {
3
+ min?: number;
4
+ max?: number;
5
+ step?: number;
6
+ }
7
+ interface UseCounterReturn {
8
+ count: number;
9
+ increment: () => void;
10
+ decrement: () => void;
11
+ reset: () => void;
12
+ set: (value: number) => void;
13
+ }
14
+ /**
15
+ * Manages a numeric counter with optional min/max bounds and a configurable step.
16
+ */
17
+ export declare function useCounter(initialValue?: number, options?: UseCounterOptions): UseCounterReturn;
18
+ interface UseMapReturn<K, V> {
19
+ map: Map<K, V>;
20
+ set: (key: K, value: V) => void;
21
+ get: (key: K) => V | undefined;
22
+ has: (key: K) => boolean;
23
+ delete: (key: K) => void;
24
+ clear: () => void;
25
+ size: number;
26
+ }
27
+ /**
28
+ * Manages a Map data structure as React state with stable action methods.
29
+ */
30
+ export declare function useMap<K, V>(initialEntries?: Iterable<[K, V]>): UseMapReturn<K, V>;
31
+ interface UseSetReturn<T> {
32
+ set: Set<T>;
33
+ add: (value: T) => void;
34
+ has: (value: T) => boolean;
35
+ delete: (value: T) => void;
36
+ toggle: (value: T) => void;
37
+ clear: () => void;
38
+ size: number;
39
+ }
40
+ /**
41
+ * Manages a Set data structure as React state with stable action methods.
42
+ */
43
+ export declare function useSet<T>(initialValues?: Iterable<T>): UseSetReturn<T>;
44
+ interface UseQueueReturn<T> {
45
+ queue: T[];
46
+ enqueue: (item: T) => void;
47
+ dequeue: () => T | undefined;
48
+ peek: () => T | undefined;
49
+ clear: () => void;
50
+ size: number;
51
+ isEmpty: boolean;
52
+ }
53
+ /**
54
+ * Manages a FIFO queue as React state.
55
+ */
56
+ export declare function useQueue<T>(initialItems?: T[]): UseQueueReturn<T>;
57
+ interface UseStackReturn<T> {
58
+ stack: T[];
59
+ push: (item: T) => void;
60
+ pop: () => T | undefined;
61
+ peek: () => T | undefined;
62
+ clear: () => void;
63
+ size: number;
64
+ isEmpty: boolean;
65
+ }
66
+ /**
67
+ * Manages a LIFO stack as React state.
68
+ */
69
+ export declare function useStack<T>(initialItems?: T[]): UseStackReturn<T>;
70
+ interface UseFocusReturn {
71
+ ref: MutableRefObject<HTMLElement | null>;
72
+ isFocused: boolean;
73
+ focus: () => void;
74
+ blur: () => void;
75
+ }
76
+ /**
77
+ * Tracks focus state of a DOM element via a ref.
78
+ */
79
+ export declare function useFocus(): UseFocusReturn;
80
+ /**
81
+ * Tracks whether a DOM element is being hovered via a ref.
82
+ * Returns a [ref, isHovered] tuple.
83
+ */
84
+ export declare function useHover<T extends HTMLElement = HTMLElement>(): [MutableRefObject<T | null>, boolean];
85
+ interface UseIntersectionObserverOptions extends IntersectionObserverInit {
86
+ freezeOnceVisible?: boolean;
87
+ }
88
+ /**
89
+ * Observes whether a ref'd element is intersecting the viewport (or a given root).
90
+ * When freezeOnceVisible is true the entry is frozen after first intersection.
91
+ */
92
+ export declare function useIntersectionObserver(elementRef: MutableRefObject<Element | null>, options?: UseIntersectionObserverOptions): IntersectionObserverEntry | undefined;
93
+ interface DOMRect {
94
+ x: number;
95
+ y: number;
96
+ width: number;
97
+ height: number;
98
+ top: number;
99
+ right: number;
100
+ bottom: number;
101
+ left: number;
102
+ }
103
+ interface UseMeasureReturn {
104
+ ref: MutableRefObject<HTMLElement | null>;
105
+ rect: DOMRect;
106
+ }
107
+ /**
108
+ * Measures the bounding rect of a DOM element, updating on resize.
109
+ */
110
+ export declare function useMeasure(): UseMeasureReturn;
111
+ interface NetworkState {
112
+ isOnline: boolean;
113
+ effectiveType: string | null;
114
+ downlink: number | null;
115
+ rtt: number | null;
116
+ saveData: boolean | null;
117
+ type: string | null;
118
+ }
119
+ /**
120
+ * Returns detailed network connection information including online status,
121
+ * effective connection type, downlink speed, and RTT.
122
+ */
123
+ export declare function useNetwork(): NetworkState;
124
+ /**
125
+ * Reads and writes the URL hash (fragment) as state.
126
+ * Returns [hash, setHash] where hash does not include the leading '#'.
127
+ */
128
+ export declare function useHash(): [string, (hash: string) => void];
129
+ /**
130
+ * Returns a ref that always holds the most recent value.
131
+ * Useful for reading the latest prop/state inside a callback without
132
+ * adding it to the dependency array.
133
+ */
134
+ export declare function useLatest<T>(value: T): MutableRefObject<T>;
135
+ /**
136
+ * Returns a stable callback reference that always delegates to the latest
137
+ * version of the provided function. Safe to pass to event listeners without
138
+ * causing unnecessary re-subscriptions.
139
+ */
140
+ export declare function useEventCallback<T extends (...args: any[]) => any>(fn: T): T;
141
+ /**
142
+ * A drop-in replacement for useState that suppresses state updates after the
143
+ * component has unmounted, preventing "Can't perform a React state update on an
144
+ * unmounted component" warnings.
145
+ */
146
+ export declare function useSafeState<T>(initialState: T | (() => T)): [T, React.Dispatch<React.SetStateAction<T>>];
147
+ /**
148
+ * Identical to useState but batches updates via requestAnimationFrame,
149
+ * reducing the number of renders for rapidly changing values (e.g. mouse
150
+ * position, scroll events).
151
+ */
152
+ export declare function useRafState<T>(initialState: T | (() => T)): [T, React.Dispatch<React.SetStateAction<T>>];
153
+ interface UseTitleOptions {
154
+ restoreOnUnmount?: boolean;
155
+ }
156
+ /**
157
+ * Sets the document title reactively. Optionally restores the previous title
158
+ * on unmount.
159
+ */
160
+ export declare function useTitle(title: string, options?: UseTitleOptions): void;
161
+ /**
162
+ * Dynamically updates the page favicon by href. Useful for notifications or
163
+ * theme changes (e.g. switching between light/dark favicon).
164
+ */
165
+ export declare function useFavicon(href: string): void;
166
+ /**
167
+ * Debug hook that logs which prop/state changes triggered the last render.
168
+ * Only active in development; no-ops in production.
169
+ * Pass a label and the component's props/state object.
170
+ */
171
+ export declare function useWhyDidYouUpdate(name: string, props: Record<string, any>): void;
172
+ interface UseFullscreenReturn {
173
+ ref: MutableRefObject<HTMLElement | null>;
174
+ isFullscreen: boolean;
175
+ enter: () => Promise<void>;
176
+ exit: () => Promise<void>;
177
+ toggle: () => Promise<void>;
178
+ isSupported: boolean;
179
+ }
180
+ /**
181
+ * Manages the Fullscreen API for a specific element (or the whole document when
182
+ * no ref target is provided). Tracks fullscreen state reactively.
183
+ */
184
+ export declare function useFullscreen(): UseFullscreenReturn;
185
+ /**
186
+ * Logs the component name and any values passed on every render.
187
+ * Only logs in development mode.
188
+ */
189
+ export declare function useLogger(name: string, ...values: any[]): void;
190
+ export {};