@alessiofrittoli/react-hooks 4.0.0 → 4.1.1

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
@@ -58,6 +58,7 @@
58
58
  - [`useIsPortrait`](#useisportrait)
59
59
  - [`useIsTouchDevice`](#useistouchdevice)
60
60
  - [`useMediaQuery`](#usemediaquery)
61
+ - [`usePreventContextMenu`](#usepreventcontextmenu)
61
62
  - [`useDocumentVisibility`](#usedocumentvisibility)
62
63
  - [`useWakeLock`](#usewakelock)
63
64
  - [DOM API](#dom-api)
@@ -131,19 +132,20 @@ export default config;
131
132
 
132
133
  #### Updates in the latest release 🎉
133
134
 
134
- - Improved `useConnection` hook. It now returns
135
- [`NetworkInformation`](https://github.com/alessiofrittoli/web-utils?tab=readme-ov-file#network-information) when available.
136
- See [API Reference](#useconnection) for more info.
137
- - Improved `useEventListener` hook types. It now supports `EventTarget` as listener targets.
138
- See [API Reference](#useeventlistener) for more info.
135
+ - Added `usePreventContextMenu` hook. See [API Reference](#usepreventcontextmenu) for more info.
139
136
 
140
137
  ---
141
138
 
142
139
  Old updates
143
140
 
144
- - Added `useDocumentVisibility`. See [API Reference](#usedocumentvisibility) for more info.
145
- - Added `useWakeLock`. See [API Reference](#usewakelock) for more info.
146
- - Added `useDeferCallback`. See [API Reference](#usedefercallback) for more info.
141
+ - Improved `useConnection` hook. It now returns
142
+ [`NetworkInformation`](https://github.com/alessiofrittoli/web-utils?tab=readme-ov-file#network-information) when available.
143
+ See [API Reference](#useconnection) for more info.
144
+ - Improved `useEventListener` hook types. It now supports `EventTarget` as listener targets.
145
+ See [API Reference](#useeventlistener) for more info.
146
+ - Added `useDocumentVisibility` hook. See [API Reference](#usedocumentvisibility) for more info.
147
+ - Added `useWakeLock` hook. See [API Reference](#usewakelock) for more info.
148
+ - Added `useDeferCallback` hook. See [API Reference](#usedefercallback) for more info.
147
149
 
148
150
  ---
149
151
 
@@ -578,17 +580,17 @@ Attach a new Event listener to the `Window`, `Document`, `MediaQueryList` or an
578
580
 
579
581
  <summary style="cursor:pointer">Custom events</summary>
580
582
 
581
- | Parameter | Type | Description |
582
- | ------------------- | --------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
583
- | `type` | `K\|K[]` | The custom event name or an array of event names. |
584
- | | | ⚠️ Please, make sure to memoize the event names array with `useMemo` |
585
- | | | or declare that array outside your Component/hook in order to avoid infinite loops when a React state changes. |
586
- | `options` | `CustomEventListenerOptions<T, K>` | An object defining init options. |
587
- | `options.target` | `Document\|HTMLElement\|null\|React.RefObject<Document\|HTMLElement\|null>` | (Optional) The target where the listener get attached to. If not set, the listener will get attached to the `Window` object. |
588
- | `options.listener` | `( event: T[ K ] ) => void` | The Event listener. |
589
- | `options.onLoad` | `() => void` | A custom callback executed before event listener get attached. |
590
- | `options.onCleanUp` | `() => void` | A custom callback executed after event listener get removed. |
591
- | `options.options` | `ListenerOptions` | Specifies characteristics about the event listener. See [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#options). |
583
+ | Parameter | Type | Description |
584
+ | ------------------- | ---------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
585
+ | `type` | `K\|K[]` | The custom event name or an array of event names. |
586
+ | | | ⚠️ Please, make sure to memoize the event names array with `useMemo` |
587
+ | | | or declare that array outside your Component/hook in order to avoid infinite loops when a React state changes. |
588
+ | `options` | `CustomEventListenerOptions<T, K>` | An object defining init options. |
589
+ | `options.target` | `Document\|EventTarget\|HTMLElement\|null\|React.RefObject<Document\|HTMLElement\|null>` | (Optional) The target where the listener get attached to. If not set, the listener will get attached to the `Window` object. |
590
+ | `options.listener` | `( event: T[ K ] ) => void` | The Event listener. |
591
+ | `options.onLoad` | `() => void` | A custom callback executed before event listener get attached. |
592
+ | `options.onCleanUp` | `() => void` | A custom callback executed after event listener get removed. |
593
+ | `options.options` | `ListenerOptions` | Specifies characteristics about the event listener. See [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#options). |
592
594
 
593
595
  </details>
594
596
 
@@ -899,6 +901,40 @@ useMediaQuery("(prefers-color-scheme: dark)", {
899
901
 
900
902
  ---
901
903
 
904
+ ##### `usePreventContextMenu`
905
+
906
+ Prevents the context menu from appearing on a specified target element.
907
+
908
+ <details>
909
+
910
+ <summary style="cursor:pointer">Parameters</summary>
911
+
912
+ | Parameter | Type | Default | Description |
913
+ | --------- | ----------------------------------------------------------- | -------- | ------------------------------------------------------------------------------------- |
914
+ | `target` | `EventListenerTarget\|React.RefObject<EventListenerTarget>` | `window` | The target element or a `React.RefObject` where the context menu should be prevented. |
915
+ | | | | If not provided, the listener will be attached to the top `window`. |
916
+
917
+ </details>
918
+
919
+ ---
920
+
921
+ <details>
922
+
923
+ <summary style="cursor:pointer">Examples</summary>
924
+
925
+ ```tsx
926
+ // Prevent context menu on the entire top window.
927
+ usePreventContextMenu();
928
+
929
+ // Prevent context menu on a specific target.
930
+ const ref = useRef<HTMLDivElement>(null);
931
+ usePreventContextMenu(ref);
932
+ ```
933
+
934
+ </details>
935
+
936
+ ---
937
+
902
938
  ##### `useDocumentVisibility`
903
939
 
904
940
  Track the visibility state of the document (i.e., whether the page is visible or hidden).
package/dist/index.d.mts CHANGED
@@ -149,7 +149,7 @@ declare function useDocumentVisibility(otpions: StateDisabledUseDocumentVisibili
149
149
  */
150
150
  declare function useDocumentVisibility(otpions?: UseDocumentVisibilityOptions): boolean;
151
151
 
152
- type EventListenerTarget = (Document | HTMLElement | EventTarget | null | undefined);
152
+ type EventListenerTarget = (Window | Document | HTMLElement | EventTarget | null | undefined);
153
153
  /**
154
154
  * Specifies characteristics about the event listener.
155
155
  *
@@ -258,6 +258,11 @@ interface CommonListenerOptions {
258
258
  options?: ListenerOptions;
259
259
  }
260
260
  interface WindowListenerOptions<K extends keyof WindowEventMap> extends CommonListenerOptions {
261
+ /**
262
+ * Optionally defines a `Window` context.
263
+ *
264
+ */
265
+ target?: Window;
261
266
  /**
262
267
  * The Window Event listener.
263
268
  *
@@ -312,7 +317,7 @@ interface MediaQueryListenerOptions extends CommonListenerOptions {
312
317
  */
313
318
  listener: MediaQueryChangeListener;
314
319
  }
315
- interface CustomEventListenerOptions<T extends Record<string, Event>, K extends keyof T = keyof T> extends CommonListenerOptions {
320
+ interface CustomEventListenerOptions<T extends Record<string, U>, K extends keyof T = keyof T, U extends Event = Event> extends CommonListenerOptions {
316
321
  /**
317
322
  * The target where the listener get attached to.
318
323
  *
@@ -564,7 +569,7 @@ declare function useEventListener(type: 'change', options: MediaQueryListenerOpt
564
569
  * }, [] )
565
570
  *```
566
571
  */
567
- declare function useEventListener<T extends Record<string, Event>, K extends keyof T = keyof T>(type: K | K[], options: CustomEventListenerOptions<T, K>): void;
572
+ declare function useEventListener<T extends Record<string, U>, K extends keyof T = keyof T, U extends Event = Event>(type: K | K[], options: CustomEventListenerOptions<T, K>): void;
568
573
 
569
574
  /**
570
575
  * Check if device is portrait oriented.
@@ -643,6 +648,27 @@ declare function useMediaQuery(query: string, options?: UseMediaQueryStateOption
643
648
  */
644
649
  declare function useMediaQuery(query: string, options?: UseMediaQueryOptions): void;
645
650
 
651
+ /**
652
+ * Prevents the context menu from appearing on a specified target element.
653
+ *
654
+ * @param target The target element or `React.RefObject` where the context menu should be prevented.
655
+ * If not provided, the listener will be attached to the top window.
656
+ *
657
+ * @example
658
+ * ```ts
659
+ * // Prevent context menu on the entire top window.
660
+ * usePreventContextMenu();
661
+ * ```
662
+ *
663
+ * @example
664
+ * ```ts
665
+ * // Prevent context menu on a specific target.
666
+ * const ref = useRef<HTMLDivElement>(null);
667
+ * usePreventContextMenu(ref);
668
+ * ```
669
+ */
670
+ declare const usePreventContextMenu: (target?: EventListenerTarget | React.RefObject<EventListenerTarget>) => void;
671
+
646
672
  /**
647
673
  * Defines a callback executed when a screen Wake Lock request fails.
648
674
  *
@@ -1534,4 +1560,4 @@ declare function useTimeout<T extends readonly unknown[]>(callback: TimerHandler
1534
1560
  */
1535
1561
  declare const useLightTimeout: <T extends readonly unknown[]>(callback: TimerHandler<T>, options?: BasicTimerOptions<T>) => void;
1536
1562
 
1537
- export { type AddEventListenerOptions, type BasicTimerOptions, type ChangeHandler, type CommonListenerOptions, type CustomEventListenerOptions, type DocumentEventListener, type DocumentListenerOptions, type ElementEventListener, type ElementListenerOptions, type EventListenerTarget, type EventTargetListenerOptions, type GroupSelectHandler, type InputState, type InputType, type IntersectionState, type IsSelectedHandler, type ListenerOptions, type MarginType, type MarginValue, type MediaQueryChangeListener, type MediaQueryEventListener, type MediaQueryListenerOptions, type OnChangeHandler, type OnIntersectHandler, type OnIntersectStateHandler, type OnWakeLockRequestError, type ParseValueHandler, type ResetSelectionHandler, type SelectAllHandler, type SelectHandler, type SetSelectionHandler, type SetValue, type StartTimer, type StateDisabledUseDocumentVisibilityOptions, type StateTimerOptions, type StateTimerReturnType, type StopTimer, type TimerHandler, type TimerId, type TimerOptions, type TimerReturnType, type UseDarkModeOptions, type UseDarkModeOutput, type UseDocumentVisibilityOptions, type UseInViewOptions, type UseInViewReturnType, type UseInputOptions, type UseInputOutput, type UseIntervalWhenVisibleReturnType, type UseIntervalWhenVisibleStateReturnType, type UseMediaQueryOptions, type UseMediaQueryStateOptions, type UseSelectionReturnType, type UseWakeLock, type UseWakeLockBase, type UseWakeLockOptions, type ValidateValueHandler, type Value, type VisibilityChangeHandler, type WindowEventListener, type WindowListenerOptions, useConnection, useDarkMode, useDebounce, useDeferCallback, useDocumentVisibility, useEffectOnce, useEventListener, useFocusTrap, useInView, useInput, useInterval, useIntervalWhenVisible, useIsClient, useIsFirstRender, useIsPortrait, useIsTouchDevice, useLightInterval, useLightTimeout, useLocalStorage, useMediaQuery, usePagination, useScrollBlock, useSelection, useSessionStorage, useStorage, useTimeout, useUpdateEffect, useWakeLock };
1563
+ export { type AddEventListenerOptions, type BasicTimerOptions, type ChangeHandler, type CommonListenerOptions, type CustomEventListenerOptions, type DocumentEventListener, type DocumentListenerOptions, type ElementEventListener, type ElementListenerOptions, type EventListenerTarget, type EventTargetListenerOptions, type GroupSelectHandler, type InputState, type InputType, type IntersectionState, type IsSelectedHandler, type ListenerOptions, type MarginType, type MarginValue, type MediaQueryChangeListener, type MediaQueryEventListener, type MediaQueryListenerOptions, type OnChangeHandler, type OnIntersectHandler, type OnIntersectStateHandler, type OnWakeLockRequestError, type ParseValueHandler, type ResetSelectionHandler, type SelectAllHandler, type SelectHandler, type SetSelectionHandler, type SetValue, type StartTimer, type StateDisabledUseDocumentVisibilityOptions, type StateTimerOptions, type StateTimerReturnType, type StopTimer, type TimerHandler, type TimerId, type TimerOptions, type TimerReturnType, type UseDarkModeOptions, type UseDarkModeOutput, type UseDocumentVisibilityOptions, type UseInViewOptions, type UseInViewReturnType, type UseInputOptions, type UseInputOutput, type UseIntervalWhenVisibleReturnType, type UseIntervalWhenVisibleStateReturnType, type UseMediaQueryOptions, type UseMediaQueryStateOptions, type UseSelectionReturnType, type UseWakeLock, type UseWakeLockBase, type UseWakeLockOptions, type ValidateValueHandler, type Value, type VisibilityChangeHandler, type WindowEventListener, type WindowListenerOptions, useConnection, useDarkMode, useDebounce, useDeferCallback, useDocumentVisibility, useEffectOnce, useEventListener, useFocusTrap, useInView, useInput, useInterval, useIntervalWhenVisible, useIsClient, useIsFirstRender, useIsPortrait, useIsTouchDevice, useLightInterval, useLightTimeout, useLocalStorage, useMediaQuery, usePagination, usePreventContextMenu, useScrollBlock, useSelection, useSessionStorage, useStorage, useTimeout, useUpdateEffect, useWakeLock };
package/dist/index.d.ts CHANGED
@@ -149,7 +149,7 @@ declare function useDocumentVisibility(otpions: StateDisabledUseDocumentVisibili
149
149
  */
150
150
  declare function useDocumentVisibility(otpions?: UseDocumentVisibilityOptions): boolean;
151
151
 
152
- type EventListenerTarget = (Document | HTMLElement | EventTarget | null | undefined);
152
+ type EventListenerTarget = (Window | Document | HTMLElement | EventTarget | null | undefined);
153
153
  /**
154
154
  * Specifies characteristics about the event listener.
155
155
  *
@@ -258,6 +258,11 @@ interface CommonListenerOptions {
258
258
  options?: ListenerOptions;
259
259
  }
260
260
  interface WindowListenerOptions<K extends keyof WindowEventMap> extends CommonListenerOptions {
261
+ /**
262
+ * Optionally defines a `Window` context.
263
+ *
264
+ */
265
+ target?: Window;
261
266
  /**
262
267
  * The Window Event listener.
263
268
  *
@@ -312,7 +317,7 @@ interface MediaQueryListenerOptions extends CommonListenerOptions {
312
317
  */
313
318
  listener: MediaQueryChangeListener;
314
319
  }
315
- interface CustomEventListenerOptions<T extends Record<string, Event>, K extends keyof T = keyof T> extends CommonListenerOptions {
320
+ interface CustomEventListenerOptions<T extends Record<string, U>, K extends keyof T = keyof T, U extends Event = Event> extends CommonListenerOptions {
316
321
  /**
317
322
  * The target where the listener get attached to.
318
323
  *
@@ -564,7 +569,7 @@ declare function useEventListener(type: 'change', options: MediaQueryListenerOpt
564
569
  * }, [] )
565
570
  *```
566
571
  */
567
- declare function useEventListener<T extends Record<string, Event>, K extends keyof T = keyof T>(type: K | K[], options: CustomEventListenerOptions<T, K>): void;
572
+ declare function useEventListener<T extends Record<string, U>, K extends keyof T = keyof T, U extends Event = Event>(type: K | K[], options: CustomEventListenerOptions<T, K>): void;
568
573
 
569
574
  /**
570
575
  * Check if device is portrait oriented.
@@ -643,6 +648,27 @@ declare function useMediaQuery(query: string, options?: UseMediaQueryStateOption
643
648
  */
644
649
  declare function useMediaQuery(query: string, options?: UseMediaQueryOptions): void;
645
650
 
651
+ /**
652
+ * Prevents the context menu from appearing on a specified target element.
653
+ *
654
+ * @param target The target element or `React.RefObject` where the context menu should be prevented.
655
+ * If not provided, the listener will be attached to the top window.
656
+ *
657
+ * @example
658
+ * ```ts
659
+ * // Prevent context menu on the entire top window.
660
+ * usePreventContextMenu();
661
+ * ```
662
+ *
663
+ * @example
664
+ * ```ts
665
+ * // Prevent context menu on a specific target.
666
+ * const ref = useRef<HTMLDivElement>(null);
667
+ * usePreventContextMenu(ref);
668
+ * ```
669
+ */
670
+ declare const usePreventContextMenu: (target?: EventListenerTarget | React.RefObject<EventListenerTarget>) => void;
671
+
646
672
  /**
647
673
  * Defines a callback executed when a screen Wake Lock request fails.
648
674
  *
@@ -1534,4 +1560,4 @@ declare function useTimeout<T extends readonly unknown[]>(callback: TimerHandler
1534
1560
  */
1535
1561
  declare const useLightTimeout: <T extends readonly unknown[]>(callback: TimerHandler<T>, options?: BasicTimerOptions<T>) => void;
1536
1562
 
1537
- export { type AddEventListenerOptions, type BasicTimerOptions, type ChangeHandler, type CommonListenerOptions, type CustomEventListenerOptions, type DocumentEventListener, type DocumentListenerOptions, type ElementEventListener, type ElementListenerOptions, type EventListenerTarget, type EventTargetListenerOptions, type GroupSelectHandler, type InputState, type InputType, type IntersectionState, type IsSelectedHandler, type ListenerOptions, type MarginType, type MarginValue, type MediaQueryChangeListener, type MediaQueryEventListener, type MediaQueryListenerOptions, type OnChangeHandler, type OnIntersectHandler, type OnIntersectStateHandler, type OnWakeLockRequestError, type ParseValueHandler, type ResetSelectionHandler, type SelectAllHandler, type SelectHandler, type SetSelectionHandler, type SetValue, type StartTimer, type StateDisabledUseDocumentVisibilityOptions, type StateTimerOptions, type StateTimerReturnType, type StopTimer, type TimerHandler, type TimerId, type TimerOptions, type TimerReturnType, type UseDarkModeOptions, type UseDarkModeOutput, type UseDocumentVisibilityOptions, type UseInViewOptions, type UseInViewReturnType, type UseInputOptions, type UseInputOutput, type UseIntervalWhenVisibleReturnType, type UseIntervalWhenVisibleStateReturnType, type UseMediaQueryOptions, type UseMediaQueryStateOptions, type UseSelectionReturnType, type UseWakeLock, type UseWakeLockBase, type UseWakeLockOptions, type ValidateValueHandler, type Value, type VisibilityChangeHandler, type WindowEventListener, type WindowListenerOptions, useConnection, useDarkMode, useDebounce, useDeferCallback, useDocumentVisibility, useEffectOnce, useEventListener, useFocusTrap, useInView, useInput, useInterval, useIntervalWhenVisible, useIsClient, useIsFirstRender, useIsPortrait, useIsTouchDevice, useLightInterval, useLightTimeout, useLocalStorage, useMediaQuery, usePagination, useScrollBlock, useSelection, useSessionStorage, useStorage, useTimeout, useUpdateEffect, useWakeLock };
1563
+ export { type AddEventListenerOptions, type BasicTimerOptions, type ChangeHandler, type CommonListenerOptions, type CustomEventListenerOptions, type DocumentEventListener, type DocumentListenerOptions, type ElementEventListener, type ElementListenerOptions, type EventListenerTarget, type EventTargetListenerOptions, type GroupSelectHandler, type InputState, type InputType, type IntersectionState, type IsSelectedHandler, type ListenerOptions, type MarginType, type MarginValue, type MediaQueryChangeListener, type MediaQueryEventListener, type MediaQueryListenerOptions, type OnChangeHandler, type OnIntersectHandler, type OnIntersectStateHandler, type OnWakeLockRequestError, type ParseValueHandler, type ResetSelectionHandler, type SelectAllHandler, type SelectHandler, type SetSelectionHandler, type SetValue, type StartTimer, type StateDisabledUseDocumentVisibilityOptions, type StateTimerOptions, type StateTimerReturnType, type StopTimer, type TimerHandler, type TimerId, type TimerOptions, type TimerReturnType, type UseDarkModeOptions, type UseDarkModeOutput, type UseDocumentVisibilityOptions, type UseInViewOptions, type UseInViewReturnType, type UseInputOptions, type UseInputOutput, type UseIntervalWhenVisibleReturnType, type UseIntervalWhenVisibleStateReturnType, type UseMediaQueryOptions, type UseMediaQueryStateOptions, type UseSelectionReturnType, type UseWakeLock, type UseWakeLockBase, type UseWakeLockOptions, type ValidateValueHandler, type Value, type VisibilityChangeHandler, type WindowEventListener, type WindowListenerOptions, useConnection, useDarkMode, useDebounce, useDeferCallback, useDocumentVisibility, useEffectOnce, useEventListener, useFocusTrap, useInView, useInput, useInterval, useIntervalWhenVisible, useIsClient, useIsFirstRender, useIsPortrait, useIsTouchDevice, useLightInterval, useLightTimeout, useLocalStorage, useMediaQuery, usePagination, usePreventContextMenu, useScrollBlock, useSelection, useSessionStorage, useStorage, useTimeout, useUpdateEffect, useWakeLock };
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _react = require('react');var _webutils = require('@alessiofrittoli/web-utils');var I=(e,n,r="local")=>{let t=_react.useCallback.call(void 0, ()=>_nullishCoalesce((r==="local"?_webutils.LocalStorage:_webutils.SessionStorage).get(e), () => (n)),[r,e,n]),[i,a]=_react.useState.call(void 0, n),s=_react.useCallback.call(void 0, o=>{a(c=>{let p=o instanceof Function?o(c):o;return(typeof window<"u"&&r==="local"?_webutils.LocalStorage:_webutils.SessionStorage).set(e,p),p})},[r,e]);return _react.useEffect.call(void 0, ()=>{a(t())},[t]),[i,s]};var j=(e,n)=>I(e,n,"local");var ct=(e,n)=>I(e,n,"session");var ae={onLine:!0},ce=["online","offline"],ft= exports.useConnection =()=>{let[e,n]=_react.useState.call(void 0, ae),r=_react.useCallback.call(void 0, ()=>{n(_webutils.getConnection.call(void 0, ))},[]);return w("change",{target:e.network,listener:r,onLoad:r}),w(ce,{listener:r}),e};var V=()=>{let e=_react.useRef.call(void 0, !0);return e.current?(e.current=!1,!0):e.current};var L=(e,n)=>{let r=V();_react.useEffect.call(void 0, ()=>{if(!r)return e()},n)};var H=e=>typeof e=="string"?_webutils.isEmpty.call(void 0, e):!e,U={value:"",isTouched:!1,isValid:!0},B=(e,n)=>{switch(n.type){case"TOUCHED":return{...e,isTouched:!0};case"CHANGE":return{...e,value:n.value};case"BLUR":return{...e,value:e.value,isTouched:!H(_nullishCoalesce(e.value, () => ("")))};case"RESET":return U}};var Ht=(e={})=>{let{inputRef:n}=e,{initialValue:r}=e,{touchTimeout:t=600}=e,{validate:i,parse:a}=e,{onChange:s}=e,[o,c]=_react.useReducer.call(void 0, B,{...U,value:r}),p=_react.useMemo.call(void 0, ()=>a?a(o.value):o.value,[o.value,a]),u=_react.useMemo.call(void 0, ()=>typeof i=="function"?i(p):!0,[p,i]),{isTouched:l}=o,d=H(p),f=!u&&l||!!r&&!u;L(()=>{let T=setTimeout(()=>{H(p)||c({type:"TOUCHED"})},t);return()=>clearTimeout(T)},[p,t]);let y=_react.useCallback.call(void 0, T=>{let{target:x}=T,{type:v}=x,k=v==="checkbox"?x.checked:x.value;c({type:"CHANGE",value:k}),_optionalChain([s, 'optionalCall', _2 => _2(a?a(k):k)])},[s,a]),S=_react.useCallback.call(void 0, ()=>{c({type:"BLUR"})},[]),g=_react.useCallback.call(void 0, ()=>{c({type:"TOUCHED"})},[]),E=_react.useCallback.call(void 0, T=>{c({type:"CHANGE",value:T})},[]),O=_react.useCallback.call(void 0, ()=>{_optionalChain([n, 'optionalAccess', _3 => _3.current, 'optionalAccess', _4 => _4.focus, 'call', _5 => _5()])},[n]),D=_react.useCallback.call(void 0, ()=>{c({type:"RESET"})},[]);return{value:p,isTouched:l,isValid:u,isEmpty:d,hasError:f,changeHandler:y,blurHandler:S,setValue:E,submit:g,focus:O,reset:D}};var Ut=(e,n)=>_react.useCallback.call(void 0, _webutils.deferCallback.call(void 0, e),n);var R=e=>{let n=V();_react.useEffect.call(void 0, ()=>{if(n)return e()},[])};var G=()=>{let[e,n]=_react.useState.call(void 0, !1);return _react.useEffect.call(void 0, ()=>n(!0),[]),e};var _mathutils = require('@alessiofrittoli/math-utils');var Gt=(e={})=>_react.useMemo.call(void 0, ()=>_mathutils.paginate.call(void 0, e),[e]);var Xt=(e,n=[])=>{let[r,t]=_react.useState.call(void 0, n),i=r.length>0,a=u=>r.includes(u),s=_react.useCallback.call(void 0, u=>t(l=>{let d=new Set(l);return d.has(u)?d.delete(u):d.add(u),Array.from(d.values())}),[]),o=_react.useCallback.call(void 0, u=>{t(l=>{if(l.length===0)return[u];let d=[...e],f=d.indexOf(l.at(0)),y=d.indexOf(u);if(f>y){let S=[...d].reverse(),g=S.indexOf(l.at(0)),E=S.indexOf(u);return S.slice(g,E+1)}return d.slice(f,y+1)})},[e]),c=_react.useCallback.call(void 0, ()=>{t(e)},[e]),p=_react.useCallback.call(void 0, u=>t(u?n:[]),[n]);return{selection:r,hasSelection:i,isSelected:a,setSelection:t,select:s,groupSelect:o,selectAll:c,resetSelection:p}};function M(e,n={}){let{updateState:r=!0,onChange:t}=n,[i,a]=_react.useState.call(void 0, _webutils.getMediaMatches.call(void 0, e)),s=_react.useCallback.call(void 0, ()=>{let o=_webutils.getMediaMatches.call(void 0, e);r&&a(o),_optionalChain([t, 'optionalCall', _6 => _6(o)])},[e,r,t]);if(_react.useEffect.call(void 0, ()=>{let o=window.matchMedia(e),{matches:c}=o;return r&&a(c),_optionalChain([t, 'optionalCall', _7 => _7(c)]),o.addEventListener("change",s),()=>{o.removeEventListener("change",s)}},[e,r,t,s]),!!r)return i}var un=(e={})=>{let n=G(),r=M("(prefers-color-scheme: dark)"),{initial:t=r,docClassNames:i=[]}=e,[a,s]=j("dark-mode",t),o=_nullishCoalesce(a, () => (r)),[c,p]=i,u=_react.useRef.call(void 0, {light:"",dark:""});return L(()=>{s(r)},[r,s]),_react.useEffect.call(void 0, ()=>{c&&document.documentElement.classList.toggle(c,o),p&&document.documentElement.classList.toggle(p,!o)},[o,c,p]),_react.useEffect.call(void 0, ()=>{document.head.querySelectorAll('meta[name="theme-color"]').forEach(l=>{let d=l.getAttribute("media"),f=l.getAttribute("content");if(f){if(!d||d==="(prefers-color-scheme: light)"){u.current.light=f;return}u.current.dark=f}})},[]),L(()=>{let l=u.current.dark,d=u.current.light;a&&!l||!a&&!d||document.head.querySelectorAll('meta[name="theme-color"]').forEach(f=>{f.setAttribute("content",a?l:d)})},[a]),{isDarkMode:n?o:!1,isDarkOS:n?r:!1,toggleDarkMode:_react.useCallback.call(void 0, ()=>s(l=>!l),[s]),enableDarkMode:_react.useCallback.call(void 0, ()=>s(!0),[s]),disableDarkMode:_react.useCallback.call(void 0, ()=>s(!1),[s])}};function J(e={}){let{updateState:n=!0,onVisibilityChange:r}=e,[t,i]=_react.useState.call(void 0, !1),a=_react.useCallback.call(void 0, ()=>{let s=!document.hidden;n&&i(s),_optionalChain([r, 'optionalCall', _8 => _8(s)])},[n,r]);if(R(()=>{n&&i(!document.hidden)}),_react.useEffect.call(void 0, ()=>(document.addEventListener("visibilitychange",a),()=>document.removeEventListener("visibilitychange",a)),[a]),n)return t}function w(e,n){let{target:r,query:t,options:i,listener:a,onLoad:s,onCleanUp:o}=n;_react.useEffect.call(void 0, ()=>{let c=Array.isArray(e)?e:[e],p=_nullishCoalesce((t?window.matchMedia(t):r&&"current"in r?r.current:r), () => (window));if(p.addEventListener)return _optionalChain([s, 'optionalCall', _9 => _9()]),c.map(u=>{p.addEventListener(u,a,i)}),()=>{c.map(u=>{p.removeEventListener(u,a,i)}),_optionalChain([o, 'optionalCall', _10 => _10()])}},[e,r,t,i,a,s,o])}var gn=()=>M(_webutils.portraitMediaQuery);var Mn=()=>M("(pointer: coarse)");var Rn=(e={})=>{let{onMount:n=!0,onError:r}=e,[t,i]=_react.useState.call(void 0, null),a=_react.useRef.call(void 0, n),s=t&&!t.released||!1,o=_react.useCallback.call(void 0, async l=>!t||t.released?navigator.wakeLock.request("screen").then(d=>{i(d),_optionalChain([l, 'optionalCall', _11 => _11()])}).catch(r||console.error):t,[t,r]),c=_react.useCallback.call(void 0, async()=>_optionalChain([t, 'optionalAccess', _12 => _12.release, 'call', _13 => _13()]),[t]),p=_react.useCallback.call(void 0, async()=>{o(()=>{a.current=!0})},[o]),u=_react.useCallback.call(void 0, async()=>{a.current=!1,c()},[c]);return J({updateState:!1,onVisibilityChange:_react.useCallback.call(void 0, l=>{if(l&&!s&&a.current)return o();if(!l)return c()},[s,o,c])}),R(()=>{s||!n||o()}),_react.useEffect.call(void 0, ()=>{if(!t)return;let l=()=>{t.released&&i(null)};return t.addEventListener("release",l),()=>{t.removeEventListener("release",l),!t.released&&t.release()}},[t]),{wakeLock:t,enabled:s,requestWakeLock:p,releaseWakeLock:u}};var Ke=["input","select","textarea","button","[href]",'[tabindex]:not([tabindex="-1"])'].join(", "),Un= exports.useFocusTrap =e=>{let n=_react.useMemo.call(void 0, ()=>_optionalChain([e, 'optionalAccess', _14 => _14.current]),[e]),[r,t]=_react.useState.call(void 0, !1),i=_react.useRef.call(void 0, null),a=_react.useCallback.call(void 0, o=>{i.current=document.activeElement;let c=o||n||!1;if(c)return t(c)},[n]),s=_react.useCallback.call(void 0, ()=>{_optionalChain([i, 'access', _15 => _15.current, 'optionalAccess', _16 => _16.focus, 'call', _17 => _17()]),t(!1)},[]);return _react.useEffect.call(void 0, ()=>{if(!r)return;let o=c=>{if(c.key!=="Tab")return;let p=Array.from(r.querySelectorAll(Ke)),u=p.at(0),l=p.at(-1);if(!c.shiftKey){document.activeElement===l&&(c.preventDefault(),_optionalChain([u, 'optionalAccess', _18 => _18.focus, 'call', _19 => _19()]));return}document.activeElement===u&&(c.preventDefault(),_optionalChain([l, 'optionalAccess', _20 => _20.focus, 'call', _21 => _21()]))};return document.addEventListener("keydown",o),()=>{document.removeEventListener("keydown",o)}},[r]),[a,s]};var Qn=(e,n={})=>{let{initial:r=!1,once:t,amount:i,margin:a,root:s,enable:o=!0}=n,{onEnter:c,onExit:p,onIntersect:u}=n,l=_react.useRef.call(void 0, !0),[d,f]=_react.useState.call(void 0, r),[y,S]=_react.useState.call(void 0, o),g=_react.useRef.call(void 0, null),E=_react.useRef.call(void 0, !1),O=_react.useMemo.call(void 0, ()=>{if(!y||typeof IntersectionObserver>"u")return;let D=i==="all"?1:i==="some"?.5:i;try{return new IntersectionObserver(async([T],x)=>{if(!T)return;let v=T.isIntersecting;try{if(E.current=!v&&!!g.current,v&&c&&await c({entry:T,observer:x}),E.current&&p&&await p({entry:T,observer:x}),u&&(v||!v&&g.current!=null)){let k={isEntering:v,isExiting:E.current};await u({entry:T,observer:x,...k})}if(g.current=v,!l.current)return;f(v)}catch(k){console.error(k)}v&&t&&x.disconnect()},{root:s||void 0,rootMargin:a,threshold:D})}catch(T){console.error(T)}},[s,a,i,t,y,c,p,u]);return _react.useEffect.call(void 0, ()=>{if(l.current=!0,!(!y||!e.current||!O))return O.observe(e.current),()=>{l.current=!1,O.disconnect()}},[e,O,y]),{inView:d,enabled:y,observer:O,isExiting:E.current,setInView:f,setEnabled:S}};var jn=e=>{let n=_react.useMemo.call(void 0, ()=>_optionalChain([e, 'optionalAccess', _22 => _22.current]),[e]),r=_react.useCallback.call(void 0, ()=>_webutils.blockScroll.call(void 0, n||void 0),[n]),t=_react.useCallback.call(void 0, ()=>_webutils.restoreScroll.call(void 0, n||void 0),[n]);return[r,t]};var ee=(e,n={})=>{let{delay:r=1,args:t}=n;_react.useEffect.call(void 0, ()=>{let i=setTimeout(e,r,...t||[]);return()=>clearTimeout(i)},[r,t,e])};var Yn=(e,n=500)=>{let[r,t]=_react.useState.call(void 0, e),i=_react.useMemo.call(void 0, ()=>[e],[e]);return ee(t,{delay:n,args:i}),r};function te(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=_react.useRef.call(void 0, void 0),[c,p]=_react.useState.call(void 0, i),u=_react.useCallback.call(void 0, ()=>o.current?(clearInterval(o.current),o.current=void 0,!0):!1,[]),l=_react.useCallback.call(void 0, ()=>{let f=u();return a&&(t?e(...t):e()),o.current=setInterval(e,r,...t||[]),!f&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=_react.useCallback.call(void 0, ()=>{u()&&s&&p(!1)},[s,u]);return _react.useEffect.call(void 0, ()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}var sr=(e,n={})=>{let{delay:r=1,args:t}=n;_react.useEffect.call(void 0, ()=>{let i=setInterval(e,r,...t||[]);return()=>clearInterval(i)},[r,t,e])};function lr(e,n={}){let{autoplay:r=!0}=n,t=te(e,{autoplay:!1,...n}),{start:i,stop:a}=t,s=_react.useCallback.call(void 0, ()=>document.hidden?a():i(),[i,a]),o=_react.useCallback.call(void 0, ()=>{if(document.addEventListener("visibilitychange",s),!document.hidden)return i()},[i,s]),c=_react.useCallback.call(void 0, ()=>{a(),document.removeEventListener("visibilitychange",s)},[a,s]);return _react.useEffect.call(void 0, ()=>(r&&o(),()=>c()),[r,o,c]),{...t,start:o,stop:c}}function fr(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=_react.useRef.call(void 0, void 0),[c,p]=_react.useState.call(void 0, i),u=_react.useCallback.call(void 0, ()=>o.current?(clearTimeout(o.current),o.current=void 0,!0):!1,[]),l=_react.useCallback.call(void 0, ()=>{let f=u();return a&&(t?_optionalChain([e, 'optionalCall', _23 => _23(...t)]):_optionalChain([e, 'optionalCall', _24 => _24()])),o.current=setTimeout(()=>{if(o.current=void 0,s&&p(!1),t)return _optionalChain([e, 'optionalCall', _25 => _25(...t)]);_optionalChain([e, 'optionalCall', _26 => _26()])},r),!f&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=_react.useCallback.call(void 0, ()=>{u()&&s&&p(!1)},[s,u]);return _react.useEffect.call(void 0, ()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}exports.useConnection = ft; exports.useDarkMode = un; exports.useDebounce = Yn; exports.useDeferCallback = Ut; exports.useDocumentVisibility = J; exports.useEffectOnce = R; exports.useEventListener = w; exports.useFocusTrap = Un; exports.useInView = Qn; exports.useInput = Ht; exports.useInterval = te; exports.useIntervalWhenVisible = lr; exports.useIsClient = G; exports.useIsFirstRender = V; exports.useIsPortrait = gn; exports.useIsTouchDevice = Mn; exports.useLightInterval = sr; exports.useLightTimeout = ee; exports.useLocalStorage = j; exports.useMediaQuery = M; exports.usePagination = Gt; exports.useScrollBlock = jn; exports.useSelection = Xt; exports.useSessionStorage = ct; exports.useStorage = I; exports.useTimeout = fr; exports.useUpdateEffect = L; exports.useWakeLock = Rn;
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _react = require('react');var _webutils = require('@alessiofrittoli/web-utils');var V=(e,n,r="local")=>{let t=_react.useCallback.call(void 0, ()=>_nullishCoalesce((r==="local"?_webutils.LocalStorage:_webutils.SessionStorage).get(e), () => (n)),[r,e,n]),[i,a]=_react.useState.call(void 0, n),s=_react.useCallback.call(void 0, o=>{a(c=>{let p=o instanceof Function?o(c):o;return(typeof window<"u"&&r==="local"?_webutils.LocalStorage:_webutils.SessionStorage).set(e,p),p})},[r,e]);return _react.useEffect.call(void 0, ()=>{a(t())},[t]),[i,s]};var j=(e,n)=>V(e,n,"local");var ut=(e,n)=>V(e,n,"session");var ae={onLine:!0},ce=["online","offline"],Tt= exports.useConnection =()=>{let[e,n]=_react.useState.call(void 0, ae),r=_react.useCallback.call(void 0, ()=>{n(_webutils.getConnection.call(void 0, ))},[]);return M("change",{target:e.network,listener:r,onLoad:r}),M(ce,{listener:r}),e};var H=()=>{let e=_react.useRef.call(void 0, !0);return e.current?(e.current=!1,!0):e.current};var h=(e,n)=>{let r=H();_react.useEffect.call(void 0, ()=>{if(!r)return e()},n)};var R=e=>typeof e=="string"?_webutils.isEmpty.call(void 0, e):!e,U={value:"",isTouched:!1,isValid:!0},B=(e,n)=>{switch(n.type){case"TOUCHED":return{...e,isTouched:!0};case"CHANGE":return{...e,value:n.value};case"BLUR":return{...e,value:e.value,isTouched:!R(_nullishCoalesce(e.value, () => ("")))};case"RESET":return U}};var Rt=(e={})=>{let{inputRef:n}=e,{initialValue:r}=e,{touchTimeout:t=600}=e,{validate:i,parse:a}=e,{onChange:s}=e,[o,c]=_react.useReducer.call(void 0, B,{...U,value:r}),p=_react.useMemo.call(void 0, ()=>a?a(o.value):o.value,[o.value,a]),u=_react.useMemo.call(void 0, ()=>typeof i=="function"?i(p):!0,[p,i]),{isTouched:l}=o,d=R(p),f=!u&&l||!!r&&!u;h(()=>{let T=setTimeout(()=>{R(p)||c({type:"TOUCHED"})},t);return()=>clearTimeout(T)},[p,t]);let y=_react.useCallback.call(void 0, T=>{let{target:x}=T,{type:v}=x,b=v==="checkbox"?x.checked:x.value;c({type:"CHANGE",value:b}),_optionalChain([s, 'optionalCall', _2 => _2(a?a(b):b)])},[s,a]),S=_react.useCallback.call(void 0, ()=>{c({type:"BLUR"})},[]),g=_react.useCallback.call(void 0, ()=>{c({type:"TOUCHED"})},[]),E=_react.useCallback.call(void 0, T=>{c({type:"CHANGE",value:T})},[]),O=_react.useCallback.call(void 0, ()=>{_optionalChain([n, 'optionalAccess', _3 => _3.current, 'optionalAccess', _4 => _4.focus, 'call', _5 => _5()])},[n]),w=_react.useCallback.call(void 0, ()=>{c({type:"RESET"})},[]);return{value:p,isTouched:l,isValid:u,isEmpty:d,hasError:f,changeHandler:y,blurHandler:S,setValue:E,submit:g,focus:O,reset:w}};var Wt=(e,n)=>_react.useCallback.call(void 0, _webutils.deferCallback.call(void 0, e),n);var C=e=>{let n=H();_react.useEffect.call(void 0, ()=>{if(n)return e()},[])};var G=()=>{let[e,n]=_react.useState.call(void 0, !1);return _react.useEffect.call(void 0, ()=>n(!0),[]),e};var _mathutils = require('@alessiofrittoli/math-utils');var _t=(e={})=>_react.useMemo.call(void 0, ()=>_mathutils.paginate.call(void 0, e),[e]);var Yt=(e,n=[])=>{let[r,t]=_react.useState.call(void 0, n),i=r.length>0,a=u=>r.includes(u),s=_react.useCallback.call(void 0, u=>t(l=>{let d=new Set(l);return d.has(u)?d.delete(u):d.add(u),Array.from(d.values())}),[]),o=_react.useCallback.call(void 0, u=>{t(l=>{if(l.length===0)return[u];let d=[...e],f=d.indexOf(l.at(0)),y=d.indexOf(u);if(f>y){let S=[...d].reverse(),g=S.indexOf(l.at(0)),E=S.indexOf(u);return S.slice(g,E+1)}return d.slice(f,y+1)})},[e]),c=_react.useCallback.call(void 0, ()=>{t(e)},[e]),p=_react.useCallback.call(void 0, u=>t(u?n:[]),[n]);return{selection:r,hasSelection:i,isSelected:a,setSelection:t,select:s,groupSelect:o,selectAll:c,resetSelection:p}};function L(e,n={}){let{updateState:r=!0,onChange:t}=n,[i,a]=_react.useState.call(void 0, _webutils.getMediaMatches.call(void 0, e)),s=_react.useCallback.call(void 0, ()=>{let o=_webutils.getMediaMatches.call(void 0, e);r&&a(o),_optionalChain([t, 'optionalCall', _6 => _6(o)])},[e,r,t]);if(_react.useEffect.call(void 0, ()=>{let o=window.matchMedia(e),{matches:c}=o;return r&&a(c),_optionalChain([t, 'optionalCall', _7 => _7(c)]),o.addEventListener("change",s),()=>{o.removeEventListener("change",s)}},[e,r,t,s]),!!r)return i}var ln=(e={})=>{let n=G(),r=L("(prefers-color-scheme: dark)"),{initial:t=r,docClassNames:i=[]}=e,[a,s]=j("dark-mode",t),o=_nullishCoalesce(a, () => (r)),[c,p]=i,u=_react.useRef.call(void 0, {light:"",dark:""});return h(()=>{s(r)},[r,s]),_react.useEffect.call(void 0, ()=>{c&&document.documentElement.classList.toggle(c,o),p&&document.documentElement.classList.toggle(p,!o)},[o,c,p]),_react.useEffect.call(void 0, ()=>{document.head.querySelectorAll('meta[name="theme-color"]').forEach(l=>{let d=l.getAttribute("media"),f=l.getAttribute("content");if(f){if(!d||d==="(prefers-color-scheme: light)"){u.current.light=f;return}u.current.dark=f}})},[]),h(()=>{let l=u.current.dark,d=u.current.light;a&&!l||!a&&!d||document.head.querySelectorAll('meta[name="theme-color"]').forEach(f=>{f.setAttribute("content",a?l:d)})},[a]),{isDarkMode:n?o:!1,isDarkOS:n?r:!1,toggleDarkMode:_react.useCallback.call(void 0, ()=>s(l=>!l),[s]),enableDarkMode:_react.useCallback.call(void 0, ()=>s(!0),[s]),disableDarkMode:_react.useCallback.call(void 0, ()=>s(!1),[s])}};function J(e={}){let{updateState:n=!0,onVisibilityChange:r}=e,[t,i]=_react.useState.call(void 0, !1),a=_react.useCallback.call(void 0, ()=>{let s=!document.hidden;n&&i(s),_optionalChain([r, 'optionalCall', _8 => _8(s)])},[n,r]);if(C(()=>{n&&i(!document.hidden)}),_react.useEffect.call(void 0, ()=>(document.addEventListener("visibilitychange",a),()=>document.removeEventListener("visibilitychange",a)),[a]),n)return t}function M(e,n){let{target:r,query:t,options:i,listener:a,onLoad:s,onCleanUp:o}=n;_react.useEffect.call(void 0, ()=>{let c=Array.isArray(e)?e:[e],p=_nullishCoalesce((t?window.matchMedia(t):r&&"current"in r?r.current:r), () => (window));if(p.addEventListener)return _optionalChain([s, 'optionalCall', _9 => _9()]),c.map(u=>{p.addEventListener(u,a,i)}),()=>{c.map(u=>{p.removeEventListener(u,a,i)}),_optionalChain([o, 'optionalCall', _10 => _10()])}},[e,r,t,i,a,s,o])}var On=()=>L(_webutils.portraitMediaQuery);var Mn=()=>L("(pointer: coarse)");var Rn=e=>{M("contextmenu",{target:e,listener:_react.useCallback.call(void 0, n=>{n.preventDefault()},[])})};var Kn=(e={})=>{let{onMount:n=!0,onError:r}=e,[t,i]=_react.useState.call(void 0, null),a=_react.useRef.call(void 0, n),s=t&&!t.released||!1,o=_react.useCallback.call(void 0, async l=>!t||t.released?navigator.wakeLock.request("screen").then(d=>{i(d),_optionalChain([l, 'optionalCall', _11 => _11()])}).catch(r||console.error):t,[t,r]),c=_react.useCallback.call(void 0, async()=>_optionalChain([t, 'optionalAccess', _12 => _12.release, 'call', _13 => _13()]),[t]),p=_react.useCallback.call(void 0, async()=>{o(()=>{a.current=!0})},[o]),u=_react.useCallback.call(void 0, async()=>{a.current=!1,c()},[c]);return J({updateState:!1,onVisibilityChange:_react.useCallback.call(void 0, l=>{if(l&&!s&&a.current)return o();if(!l)return c()},[s,o,c])}),C(()=>{s||!n||o()}),_react.useEffect.call(void 0, ()=>{if(!t)return;let l=()=>{t.released&&i(null)};return t.addEventListener("release",l),()=>{t.removeEventListener("release",l),!t.released&&t.release()}},[t]),{wakeLock:t,enabled:s,requestWakeLock:p,releaseWakeLock:u}};var Ae=["input","select","textarea","button","[href]",'[tabindex]:not([tabindex="-1"])'].join(", "),Pn= exports.useFocusTrap =e=>{let n=_react.useMemo.call(void 0, ()=>_optionalChain([e, 'optionalAccess', _14 => _14.current]),[e]),[r,t]=_react.useState.call(void 0, !1),i=_react.useRef.call(void 0, null),a=_react.useCallback.call(void 0, o=>{i.current=document.activeElement;let c=o||n||!1;if(c)return t(c)},[n]),s=_react.useCallback.call(void 0, ()=>{_optionalChain([i, 'access', _15 => _15.current, 'optionalAccess', _16 => _16.focus, 'call', _17 => _17()]),t(!1)},[]);return _react.useEffect.call(void 0, ()=>{if(!r)return;let o=c=>{if(c.key!=="Tab")return;let p=Array.from(r.querySelectorAll(Ae)),u=p.at(0),l=p.at(-1);if(!c.shiftKey){document.activeElement===l&&(c.preventDefault(),_optionalChain([u, 'optionalAccess', _18 => _18.focus, 'call', _19 => _19()]));return}document.activeElement===u&&(c.preventDefault(),_optionalChain([l, 'optionalAccess', _20 => _20.focus, 'call', _21 => _21()]))};return document.addEventListener("keydown",o),()=>{document.removeEventListener("keydown",o)}},[r]),[a,s]};var Bn=(e,n={})=>{let{initial:r=!1,once:t,amount:i,margin:a,root:s,enable:o=!0}=n,{onEnter:c,onExit:p,onIntersect:u}=n,l=_react.useRef.call(void 0, !0),[d,f]=_react.useState.call(void 0, r),[y,S]=_react.useState.call(void 0, o),g=_react.useRef.call(void 0, null),E=_react.useRef.call(void 0, !1),O=_react.useMemo.call(void 0, ()=>{if(!y||typeof IntersectionObserver>"u")return;let w=i==="all"?1:i==="some"?.5:i;try{return new IntersectionObserver(async([T],x)=>{if(!T)return;let v=T.isIntersecting;try{if(E.current=!v&&!!g.current,v&&c&&await c({entry:T,observer:x}),E.current&&p&&await p({entry:T,observer:x}),u&&(v||!v&&g.current!=null)){let b={isEntering:v,isExiting:E.current};await u({entry:T,observer:x,...b})}if(g.current=v,!l.current)return;f(v)}catch(b){console.error(b)}v&&t&&x.disconnect()},{root:s||void 0,rootMargin:a,threshold:w})}catch(T){console.error(T)}},[s,a,i,t,y,c,p,u]);return _react.useEffect.call(void 0, ()=>{if(l.current=!0,!(!y||!e.current||!O))return O.observe(e.current),()=>{l.current=!1,O.disconnect()}},[e,O,y]),{inView:d,enabled:y,observer:O,isExiting:E.current,setInView:f,setEnabled:S}};var Jn=e=>{let n=_react.useMemo.call(void 0, ()=>_optionalChain([e, 'optionalAccess', _22 => _22.current]),[e]),r=_react.useCallback.call(void 0, ()=>_webutils.blockScroll.call(void 0, n||void 0),[n]),t=_react.useCallback.call(void 0, ()=>_webutils.restoreScroll.call(void 0, n||void 0),[n]);return[r,t]};var ee=(e,n={})=>{let{delay:r=1,args:t}=n;_react.useEffect.call(void 0, ()=>{let i=setTimeout(e,r,...t||[]);return()=>clearTimeout(i)},[r,t,e])};var or=(e,n=500)=>{let[r,t]=_react.useState.call(void 0, e),i=_react.useMemo.call(void 0, ()=>[e],[e]);return ee(t,{delay:n,args:i}),r};function te(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=_react.useRef.call(void 0, void 0),[c,p]=_react.useState.call(void 0, i),u=_react.useCallback.call(void 0, ()=>o.current?(clearInterval(o.current),o.current=void 0,!0):!1,[]),l=_react.useCallback.call(void 0, ()=>{let f=u();return a&&(t?e(...t):e()),o.current=setInterval(e,r,...t||[]),!f&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=_react.useCallback.call(void 0, ()=>{u()&&s&&p(!1)},[s,u]);return _react.useEffect.call(void 0, ()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}var pr=(e,n={})=>{let{delay:r=1,args:t}=n;_react.useEffect.call(void 0, ()=>{let i=setInterval(e,r,...t||[]);return()=>clearInterval(i)},[r,t,e])};function yr(e,n={}){let{autoplay:r=!0}=n,t=te(e,{autoplay:!1,...n}),{start:i,stop:a}=t,s=_react.useCallback.call(void 0, ()=>document.hidden?a():i(),[i,a]),o=_react.useCallback.call(void 0, ()=>{if(document.addEventListener("visibilitychange",s),!document.hidden)return i()},[i,s]),c=_react.useCallback.call(void 0, ()=>{a(),document.removeEventListener("visibilitychange",s)},[a,s]);return _react.useEffect.call(void 0, ()=>(r&&o(),()=>c()),[r,o,c]),{...t,start:o,stop:c}}function Sr(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=_react.useRef.call(void 0, void 0),[c,p]=_react.useState.call(void 0, i),u=_react.useCallback.call(void 0, ()=>o.current?(clearTimeout(o.current),o.current=void 0,!0):!1,[]),l=_react.useCallback.call(void 0, ()=>{let f=u();return a&&(t?_optionalChain([e, 'optionalCall', _23 => _23(...t)]):_optionalChain([e, 'optionalCall', _24 => _24()])),o.current=setTimeout(()=>{if(o.current=void 0,s&&p(!1),t)return _optionalChain([e, 'optionalCall', _25 => _25(...t)]);_optionalChain([e, 'optionalCall', _26 => _26()])},r),!f&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=_react.useCallback.call(void 0, ()=>{u()&&s&&p(!1)},[s,u]);return _react.useEffect.call(void 0, ()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}exports.useConnection = Tt; exports.useDarkMode = ln; exports.useDebounce = or; exports.useDeferCallback = Wt; exports.useDocumentVisibility = J; exports.useEffectOnce = C; exports.useEventListener = M; exports.useFocusTrap = Pn; exports.useInView = Bn; exports.useInput = Rt; exports.useInterval = te; exports.useIntervalWhenVisible = yr; exports.useIsClient = G; exports.useIsFirstRender = H; exports.useIsPortrait = On; exports.useIsTouchDevice = Mn; exports.useLightInterval = pr; exports.useLightTimeout = ee; exports.useLocalStorage = j; exports.useMediaQuery = L; exports.usePagination = _t; exports.usePreventContextMenu = Rn; exports.useScrollBlock = Jn; exports.useSelection = Yt; exports.useSessionStorage = ut; exports.useStorage = V; exports.useTimeout = Sr; exports.useUpdateEffect = h; exports.useWakeLock = Kn;
package/dist/index.mjs CHANGED
@@ -1 +1 @@
1
- import{useCallback as P,useEffect as re,useState as oe}from"react";import{LocalStorage as $,SessionStorage as j}from"@alessiofrittoli/web-utils";var V=(e,n,r="local")=>{let t=P(()=>(r==="local"?$:j).get(e)??n,[r,e,n]),[i,a]=oe(n),s=P(o=>{a(c=>{let p=o instanceof Function?o(c):o;return(typeof window<"u"&&r==="local"?$:j).set(e,p),p})},[r,e]);return re(()=>{a(t())},[t]),[i,s]};var B=(e,n)=>V(e,n,"local");var ut=(e,n)=>V(e,n,"session");import{useCallback as se,useState as ie}from"react";import{getConnection as ae}from"@alessiofrittoli/web-utils";var ce={onLine:!0},ue=["online","offline"],Tt=()=>{let[e,n]=ie(ce),r=se(()=>{n(ae())},[]);return U("change",{target:e.network,listener:r,onLoad:r}),U(ue,{listener:r}),e};import{useCallback as K,useEffect as J,useRef as Me}from"react";import{useCallback as M,useMemo as G,useReducer as me}from"react";import{useEffect as pe}from"react";import{useRef as le}from"react";var H=()=>{let e=le(!0);return e.current?(e.current=!1,!0):e.current};var h=(e,n)=>{let r=H();pe(()=>{if(!r)return e()},n)};import{isEmpty as de}from"@alessiofrittoli/web-utils";var R=e=>typeof e=="string"?de(e):!e,W={value:"",isTouched:!1,isValid:!0},N=(e,n)=>{switch(n.type){case"TOUCHED":return{...e,isTouched:!0};case"CHANGE":return{...e,value:n.value};case"BLUR":return{...e,value:e.value,isTouched:!R(e.value??"")};case"RESET":return W}};var Rt=(e={})=>{let{inputRef:n}=e,{initialValue:r}=e,{touchTimeout:t=600}=e,{validate:i,parse:a}=e,{onChange:s}=e,[o,c]=me(N,{...W,value:r}),p=G(()=>a?a(o.value):o.value,[o.value,a]),u=G(()=>typeof i=="function"?i(p):!0,[p,i]),{isTouched:l}=o,d=R(p),T=!u&&l||!!r&&!u;h(()=>{let y=setTimeout(()=>{R(p)||c({type:"TOUCHED"})},t);return()=>clearTimeout(y)},[p,t]);let v=M(y=>{let{target:S}=y,{type:E}=S,b=E==="checkbox"?S.checked:S.value;c({type:"CHANGE",value:b}),s?.(a?a(b):b)},[s,a]),g=M(()=>{c({type:"BLUR"})},[]),O=M(()=>{c({type:"TOUCHED"})},[]),x=M(y=>{c({type:"CHANGE",value:y})},[]),k=M(()=>{n?.current?.focus()},[n]),w=M(()=>{c({type:"RESET"})},[]);return{value:p,isTouched:l,isValid:u,isEmpty:d,hasError:T,changeHandler:v,blurHandler:g,setValue:x,submit:O,focus:k,reset:w}};import{useCallback as fe}from"react";import{deferCallback as Te}from"@alessiofrittoli/web-utils";var Wt=(e,n)=>fe(Te(e),n);import{useEffect as ye}from"react";var C=e=>{let n=H();ye(()=>{if(n)return e()},[])};import{useEffect as ve,useState as Ee}from"react";var _=()=>{let[e,n]=Ee(!1);return ve(()=>n(!0),[]),e};import{useMemo as xe}from"react";import{paginate as Se}from"@alessiofrittoli/math-utils";var _t=(e={})=>xe(()=>Se(e),[e]);import{useCallback as D,useState as ge}from"react";var Yt=(e,n=[])=>{let[r,t]=ge(n),i=r.length>0,a=u=>r.includes(u),s=D(u=>t(l=>{let d=new Set(l);return d.has(u)?d.delete(u):d.add(u),Array.from(d.values())}),[]),o=D(u=>{t(l=>{if(l.length===0)return[u];let d=[...e],T=d.indexOf(l.at(0)),v=d.indexOf(u);if(T>v){let g=[...d].reverse(),O=g.indexOf(l.at(0)),x=g.indexOf(u);return g.slice(O,x+1)}return d.slice(T,v+1)})},[e]),c=D(()=>{t(e)},[e]),p=D(u=>t(u?n:[]),[n]);return{selection:r,hasSelection:i,isSelected:a,setSelection:t,select:s,groupSelect:o,selectAll:c,resetSelection:p}};import{useCallback as Oe,useEffect as ke,useState as be}from"react";import{getMediaMatches as z}from"@alessiofrittoli/web-utils";function L(e,n={}){let{updateState:r=!0,onChange:t}=n,[i,a]=be(z(e)),s=Oe(()=>{let o=z(e);r&&a(o),t?.(o)},[e,r,t]);if(ke(()=>{let o=window.matchMedia(e),{matches:c}=o;return r&&a(c),t?.(c),o.addEventListener("change",s),()=>{o.removeEventListener("change",s)}},[e,r,t,s]),!!r)return i}var ln=(e={})=>{let n=_(),r=L("(prefers-color-scheme: dark)"),{initial:t=r,docClassNames:i=[]}=e,[a,s]=B("dark-mode",t),o=a??r,[c,p]=i,u=Me({light:"",dark:""});return h(()=>{s(r)},[r,s]),J(()=>{c&&document.documentElement.classList.toggle(c,o),p&&document.documentElement.classList.toggle(p,!o)},[o,c,p]),J(()=>{document.head.querySelectorAll('meta[name="theme-color"]').forEach(l=>{let d=l.getAttribute("media"),T=l.getAttribute("content");if(T){if(!d||d==="(prefers-color-scheme: light)"){u.current.light=T;return}u.current.dark=T}})},[]),h(()=>{let l=u.current.dark,d=u.current.light;a&&!l||!a&&!d||document.head.querySelectorAll('meta[name="theme-color"]').forEach(T=>{T.setAttribute("content",a?l:d)})},[a]),{isDarkMode:n?o:!1,isDarkOS:n?r:!1,toggleDarkMode:K(()=>s(l=>!l),[s]),enableDarkMode:K(()=>s(!0),[s]),disableDarkMode:K(()=>s(!1),[s])}};import{useCallback as Le,useEffect as he,useState as Ie}from"react";function X(e={}){let{updateState:n=!0,onVisibilityChange:r}=e,[t,i]=Ie(!1),a=Le(()=>{let s=!document.hidden;n&&i(s),r?.(s)},[n,r]);if(C(()=>{n&&i(!document.hidden)}),he(()=>(document.addEventListener("visibilitychange",a),()=>document.removeEventListener("visibilitychange",a)),[a]),n)return t}import{useEffect as Ve}from"react";function U(e,n){let{target:r,query:t,options:i,listener:a,onLoad:s,onCleanUp:o}=n;Ve(()=>{let c=Array.isArray(e)?e:[e],p=(t?window.matchMedia(t):r&&"current"in r?r.current:r)??window;if(p.addEventListener)return s?.(),c.map(u=>{p.addEventListener(u,a,i)}),()=>{c.map(u=>{p.removeEventListener(u,a,i)}),o?.()}},[e,r,t,i,a,s,o])}import{portraitMediaQuery as He}from"@alessiofrittoli/web-utils";var On=()=>L(He);var Ln=()=>L("(pointer: coarse)");import{useCallback as I,useEffect as Re,useRef as Ce,useState as De}from"react";var Cn=(e={})=>{let{onMount:n=!0,onError:r}=e,[t,i]=De(null),a=Ce(n),s=t&&!t.released||!1,o=I(async l=>!t||t.released?navigator.wakeLock.request("screen").then(d=>{i(d),l?.()}).catch(r||console.error):t,[t,r]),c=I(async()=>t?.release(),[t]),p=I(async()=>{o(()=>{a.current=!0})},[o]),u=I(async()=>{a.current=!1,c()},[c]);return X({updateState:!1,onVisibilityChange:I(l=>{if(l&&!s&&a.current)return o();if(!l)return c()},[s,o,c])}),C(()=>{s||!n||o()}),Re(()=>{if(!t)return;let l=()=>{t.released&&i(null)};return t.addEventListener("release",l),()=>{t.removeEventListener("release",l),!t.released&&t.release()}},[t]),{wakeLock:t,enabled:s,requestWakeLock:p,releaseWakeLock:u}};import{useCallback as Y,useEffect as we,useMemo as Ue,useRef as We,useState as Ke}from"react";var Ae=["input","select","textarea","button","[href]",'[tabindex]:not([tabindex="-1"])'].join(", "),Wn=e=>{let n=Ue(()=>e?.current,[e]),[r,t]=Ke(!1),i=We(null),a=Y(o=>{i.current=document.activeElement;let c=o||n||!1;if(c)return t(c)},[n]),s=Y(()=>{i.current?.focus(),t(!1)},[]);return we(()=>{if(!r)return;let o=c=>{if(c.key!=="Tab")return;let p=Array.from(r.querySelectorAll(Ae)),u=p.at(0),l=p.at(-1);if(!c.shiftKey){document.activeElement===l&&(c.preventDefault(),u?.focus());return}document.activeElement===u&&(c.preventDefault(),l?.focus())};return document.addEventListener("keydown",o),()=>{document.removeEventListener("keydown",o)}},[r]),[a,s]};import{useEffect as Qe,useMemo as Fe,useRef as A,useState as Z}from"react";var Fn=(e,n={})=>{let{initial:r=!1,once:t,amount:i,margin:a,root:s,enable:o=!0}=n,{onEnter:c,onExit:p,onIntersect:u}=n,l=A(!0),[d,T]=Z(r),[v,g]=Z(o),O=A(null),x=A(!1),k=Fe(()=>{if(!v||typeof IntersectionObserver>"u")return;let w=i==="all"?1:i==="some"?.5:i;try{return new IntersectionObserver(async([y],S)=>{if(!y)return;let E=y.isIntersecting;try{if(x.current=!E&&!!O.current,E&&c&&await c({entry:y,observer:S}),x.current&&p&&await p({entry:y,observer:S}),u&&(E||!E&&O.current!=null)){let b={isEntering:E,isExiting:x.current};await u({entry:y,observer:S,...b})}if(O.current=E,!l.current)return;T(E)}catch(b){console.error(b)}E&&t&&S.disconnect()},{root:s||void 0,rootMargin:a,threshold:w})}catch(y){console.error(y)}},[s,a,i,t,v,c,p,u]);return Qe(()=>{if(l.current=!0,!(!v||!e.current||!k))return k.observe(e.current),()=>{l.current=!1,k.disconnect()}},[e,k,v]),{inView:d,enabled:v,observer:k,isExiting:x.current,setInView:T,setEnabled:g}};import{useCallback as ee,useMemo as qe}from"react";import{blockScroll as Pe,restoreScroll as $e}from"@alessiofrittoli/web-utils";var Bn=e=>{let n=qe(()=>e?.current,[e]),r=ee(()=>Pe(n||void 0),[n]),t=ee(()=>$e(n||void 0),[n]);return[r,t]};import{useMemo as Be,useState as Ne}from"react";import{useEffect as je}from"react";var te=(e,n={})=>{let{delay:r=1,args:t}=n;je(()=>{let i=setTimeout(e,r,...t||[]);return()=>clearTimeout(i)},[r,t,e])};var Zn=(e,n=500)=>{let[r,t]=Ne(e),i=Be(()=>[e],[e]);return te(t,{delay:n,args:i}),r};import{useCallback as Q,useEffect as Ge,useRef as _e,useState as ze}from"react";function ne(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=_e(void 0),[c,p]=ze(i),u=Q(()=>o.current?(clearInterval(o.current),o.current=void 0,!0):!1,[]),l=Q(()=>{let T=u();return a&&(t?e(...t):e()),o.current=setInterval(e,r,...t||[]),!T&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=Q(()=>{u()&&s&&p(!1)},[s,u]);return Ge(()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}import{useEffect as Je}from"react";var ir=(e,n={})=>{let{delay:r=1,args:t}=n;Je(()=>{let i=setInterval(e,r,...t||[]);return()=>clearInterval(i)},[r,t,e])};import{useCallback as F,useEffect as Xe}from"react";function pr(e,n={}){let{autoplay:r=!0}=n,t=ne(e,{autoplay:!1,...n}),{start:i,stop:a}=t,s=F(()=>document.hidden?a():i(),[i,a]),o=F(()=>{if(document.addEventListener("visibilitychange",s),!document.hidden)return i()},[i,s]),c=F(()=>{a(),document.removeEventListener("visibilitychange",s)},[a,s]);return Xe(()=>(r&&o(),()=>c()),[r,o,c]),{...t,start:o,stop:c}}import{useCallback as q,useEffect as Ye,useRef as Ze,useState as et}from"react";function Tr(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=Ze(void 0),[c,p]=et(i),u=q(()=>o.current?(clearTimeout(o.current),o.current=void 0,!0):!1,[]),l=q(()=>{let T=u();return a&&(t?e?.(...t):e?.()),o.current=setTimeout(()=>{if(o.current=void 0,s&&p(!1),t)return e?.(...t);e?.()},r),!T&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=q(()=>{u()&&s&&p(!1)},[s,u]);return Ye(()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}export{Tt as useConnection,ln as useDarkMode,Zn as useDebounce,Wt as useDeferCallback,X as useDocumentVisibility,C as useEffectOnce,U as useEventListener,Wn as useFocusTrap,Fn as useInView,Rt as useInput,ne as useInterval,pr as useIntervalWhenVisible,_ as useIsClient,H as useIsFirstRender,On as useIsPortrait,Ln as useIsTouchDevice,ir as useLightInterval,te as useLightTimeout,B as useLocalStorage,L as useMediaQuery,_t as usePagination,Bn as useScrollBlock,Yt as useSelection,ut as useSessionStorage,V as useStorage,Tr as useTimeout,h as useUpdateEffect,Cn as useWakeLock};
1
+ import{useCallback as q,useEffect as re,useState as oe}from"react";import{LocalStorage as $,SessionStorage as j}from"@alessiofrittoli/web-utils";var H=(e,n,r="local")=>{let t=q(()=>(r==="local"?$:j).get(e)??n,[r,e,n]),[i,a]=oe(n),s=q(o=>{a(c=>{let p=o instanceof Function?o(c):o;return(typeof window<"u"&&r==="local"?$:j).set(e,p),p})},[r,e]);return re(()=>{a(t())},[t]),[i,s]};var B=(e,n)=>H(e,n,"local");var lt=(e,n)=>H(e,n,"session");import{useCallback as se,useState as ie}from"react";import{getConnection as ae}from"@alessiofrittoli/web-utils";var ce={onLine:!0},ue=["online","offline"],yt=()=>{let[e,n]=ie(ce),r=se(()=>{n(ae())},[]);return h("change",{target:e.network,listener:r,onLoad:r}),h(ue,{listener:r}),e};import{useCallback as K,useEffect as J,useRef as Le}from"react";import{useCallback as L,useMemo as G,useReducer as me}from"react";import{useEffect as pe}from"react";import{useRef as le}from"react";var R=()=>{let e=le(!0);return e.current?(e.current=!1,!0):e.current};var I=(e,n)=>{let r=R();pe(()=>{if(!r)return e()},n)};import{isEmpty as de}from"@alessiofrittoli/web-utils";var C=e=>typeof e=="string"?de(e):!e,W={value:"",isTouched:!1,isValid:!0},N=(e,n)=>{switch(n.type){case"TOUCHED":return{...e,isTouched:!0};case"CHANGE":return{...e,value:n.value};case"BLUR":return{...e,value:e.value,isTouched:!C(e.value??"")};case"RESET":return W}};var Ct=(e={})=>{let{inputRef:n}=e,{initialValue:r}=e,{touchTimeout:t=600}=e,{validate:i,parse:a}=e,{onChange:s}=e,[o,c]=me(N,{...W,value:r}),p=G(()=>a?a(o.value):o.value,[o.value,a]),u=G(()=>typeof i=="function"?i(p):!0,[p,i]),{isTouched:l}=o,d=C(p),T=!u&&l||!!r&&!u;I(()=>{let y=setTimeout(()=>{C(p)||c({type:"TOUCHED"})},t);return()=>clearTimeout(y)},[p,t]);let v=L(y=>{let{target:S}=y,{type:E}=S,k=E==="checkbox"?S.checked:S.value;c({type:"CHANGE",value:k}),s?.(a?a(k):k)},[s,a]),g=L(()=>{c({type:"BLUR"})},[]),O=L(()=>{c({type:"TOUCHED"})},[]),x=L(y=>{c({type:"CHANGE",value:y})},[]),b=L(()=>{n?.current?.focus()},[n]),U=L(()=>{c({type:"RESET"})},[]);return{value:p,isTouched:l,isValid:u,isEmpty:d,hasError:T,changeHandler:v,blurHandler:g,setValue:x,submit:O,focus:b,reset:U}};import{useCallback as fe}from"react";import{deferCallback as Te}from"@alessiofrittoli/web-utils";var Kt=(e,n)=>fe(Te(e),n);import{useEffect as ye}from"react";var D=e=>{let n=R();ye(()=>{if(n)return e()},[])};import{useEffect as ve,useState as Ee}from"react";var _=()=>{let[e,n]=Ee(!1);return ve(()=>n(!0),[]),e};import{useMemo as xe}from"react";import{paginate as Se}from"@alessiofrittoli/math-utils";var zt=(e={})=>xe(()=>Se(e),[e]);import{useCallback as w,useState as ge}from"react";var Zt=(e,n=[])=>{let[r,t]=ge(n),i=r.length>0,a=u=>r.includes(u),s=w(u=>t(l=>{let d=new Set(l);return d.has(u)?d.delete(u):d.add(u),Array.from(d.values())}),[]),o=w(u=>{t(l=>{if(l.length===0)return[u];let d=[...e],T=d.indexOf(l.at(0)),v=d.indexOf(u);if(T>v){let g=[...d].reverse(),O=g.indexOf(l.at(0)),x=g.indexOf(u);return g.slice(O,x+1)}return d.slice(T,v+1)})},[e]),c=w(()=>{t(e)},[e]),p=w(u=>t(u?n:[]),[n]);return{selection:r,hasSelection:i,isSelected:a,setSelection:t,select:s,groupSelect:o,selectAll:c,resetSelection:p}};import{useCallback as Oe,useEffect as be,useState as ke}from"react";import{getMediaMatches as z}from"@alessiofrittoli/web-utils";function M(e,n={}){let{updateState:r=!0,onChange:t}=n,[i,a]=ke(z(e)),s=Oe(()=>{let o=z(e);r&&a(o),t?.(o)},[e,r,t]);if(be(()=>{let o=window.matchMedia(e),{matches:c}=o;return r&&a(c),t?.(c),o.addEventListener("change",s),()=>{o.removeEventListener("change",s)}},[e,r,t,s]),!!r)return i}var pn=(e={})=>{let n=_(),r=M("(prefers-color-scheme: dark)"),{initial:t=r,docClassNames:i=[]}=e,[a,s]=B("dark-mode",t),o=a??r,[c,p]=i,u=Le({light:"",dark:""});return I(()=>{s(r)},[r,s]),J(()=>{c&&document.documentElement.classList.toggle(c,o),p&&document.documentElement.classList.toggle(p,!o)},[o,c,p]),J(()=>{document.head.querySelectorAll('meta[name="theme-color"]').forEach(l=>{let d=l.getAttribute("media"),T=l.getAttribute("content");if(T){if(!d||d==="(prefers-color-scheme: light)"){u.current.light=T;return}u.current.dark=T}})},[]),I(()=>{let l=u.current.dark,d=u.current.light;a&&!l||!a&&!d||document.head.querySelectorAll('meta[name="theme-color"]').forEach(T=>{T.setAttribute("content",a?l:d)})},[a]),{isDarkMode:n?o:!1,isDarkOS:n?r:!1,toggleDarkMode:K(()=>s(l=>!l),[s]),enableDarkMode:K(()=>s(!0),[s]),disableDarkMode:K(()=>s(!1),[s])}};import{useCallback as Me,useEffect as he,useState as Ie}from"react";function X(e={}){let{updateState:n=!0,onVisibilityChange:r}=e,[t,i]=Ie(!1),a=Me(()=>{let s=!document.hidden;n&&i(s),r?.(s)},[n,r]);if(D(()=>{n&&i(!document.hidden)}),he(()=>(document.addEventListener("visibilitychange",a),()=>document.removeEventListener("visibilitychange",a)),[a]),n)return t}import{useEffect as Ve}from"react";function h(e,n){let{target:r,query:t,options:i,listener:a,onLoad:s,onCleanUp:o}=n;Ve(()=>{let c=Array.isArray(e)?e:[e],p=(t?window.matchMedia(t):r&&"current"in r?r.current:r)??window;if(p.addEventListener)return s?.(),c.map(u=>{p.addEventListener(u,a,i)}),()=>{c.map(u=>{p.removeEventListener(u,a,i)}),o?.()}},[e,r,t,i,a,s,o])}import{portraitMediaQuery as He}from"@alessiofrittoli/web-utils";var bn=()=>M(He);var hn=()=>M("(pointer: coarse)");import{useCallback as Re}from"react";var Cn=e=>{h("contextmenu",{target:e,listener:Re(n=>{n.preventDefault()},[])})};import{useCallback as V,useEffect as Ce,useRef as De,useState as we}from"react";var An=(e={})=>{let{onMount:n=!0,onError:r}=e,[t,i]=we(null),a=De(n),s=t&&!t.released||!1,o=V(async l=>!t||t.released?navigator.wakeLock.request("screen").then(d=>{i(d),l?.()}).catch(r||console.error):t,[t,r]),c=V(async()=>t?.release(),[t]),p=V(async()=>{o(()=>{a.current=!0})},[o]),u=V(async()=>{a.current=!1,c()},[c]);return X({updateState:!1,onVisibilityChange:V(l=>{if(l&&!s&&a.current)return o();if(!l)return c()},[s,o,c])}),D(()=>{s||!n||o()}),Ce(()=>{if(!t)return;let l=()=>{t.released&&i(null)};return t.addEventListener("release",l),()=>{t.removeEventListener("release",l),!t.released&&t.release()}},[t]),{wakeLock:t,enabled:s,requestWakeLock:p,releaseWakeLock:u}};import{useCallback as Y,useEffect as Ue,useMemo as We,useRef as Ke,useState as Ae}from"react";var Qe=["input","select","textarea","button","[href]",'[tabindex]:not([tabindex="-1"])'].join(", "),qn=e=>{let n=We(()=>e?.current,[e]),[r,t]=Ae(!1),i=Ke(null),a=Y(o=>{i.current=document.activeElement;let c=o||n||!1;if(c)return t(c)},[n]),s=Y(()=>{i.current?.focus(),t(!1)},[]);return Ue(()=>{if(!r)return;let o=c=>{if(c.key!=="Tab")return;let p=Array.from(r.querySelectorAll(Qe)),u=p.at(0),l=p.at(-1);if(!c.shiftKey){document.activeElement===l&&(c.preventDefault(),u?.focus());return}document.activeElement===u&&(c.preventDefault(),l?.focus())};return document.addEventListener("keydown",o),()=>{document.removeEventListener("keydown",o)}},[r]),[a,s]};import{useEffect as Fe,useMemo as Pe,useRef as A,useState as Z}from"react";var Nn=(e,n={})=>{let{initial:r=!1,once:t,amount:i,margin:a,root:s,enable:o=!0}=n,{onEnter:c,onExit:p,onIntersect:u}=n,l=A(!0),[d,T]=Z(r),[v,g]=Z(o),O=A(null),x=A(!1),b=Pe(()=>{if(!v||typeof IntersectionObserver>"u")return;let U=i==="all"?1:i==="some"?.5:i;try{return new IntersectionObserver(async([y],S)=>{if(!y)return;let E=y.isIntersecting;try{if(x.current=!E&&!!O.current,E&&c&&await c({entry:y,observer:S}),x.current&&p&&await p({entry:y,observer:S}),u&&(E||!E&&O.current!=null)){let k={isEntering:E,isExiting:x.current};await u({entry:y,observer:S,...k})}if(O.current=E,!l.current)return;T(E)}catch(k){console.error(k)}E&&t&&S.disconnect()},{root:s||void 0,rootMargin:a,threshold:U})}catch(y){console.error(y)}},[s,a,i,t,v,c,p,u]);return Fe(()=>{if(l.current=!0,!(!v||!e.current||!b))return b.observe(e.current),()=>{l.current=!1,b.disconnect()}},[e,b,v]),{inView:d,enabled:v,observer:b,isExiting:x.current,setInView:T,setEnabled:g}};import{useCallback as ee,useMemo as qe}from"react";import{blockScroll as $e,restoreScroll as je}from"@alessiofrittoli/web-utils";var Xn=e=>{let n=qe(()=>e?.current,[e]),r=ee(()=>$e(n||void 0),[n]),t=ee(()=>je(n||void 0),[n]);return[r,t]};import{useMemo as Ne,useState as Ge}from"react";import{useEffect as Be}from"react";var te=(e,n={})=>{let{delay:r=1,args:t}=n;Be(()=>{let i=setTimeout(e,r,...t||[]);return()=>clearTimeout(i)},[r,t,e])};var sr=(e,n=500)=>{let[r,t]=Ge(e),i=Ne(()=>[e],[e]);return te(t,{delay:n,args:i}),r};import{useCallback as Q,useEffect as _e,useRef as ze,useState as Je}from"react";function ne(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=ze(void 0),[c,p]=Je(i),u=Q(()=>o.current?(clearInterval(o.current),o.current=void 0,!0):!1,[]),l=Q(()=>{let T=u();return a&&(t?e(...t):e()),o.current=setInterval(e,r,...t||[]),!T&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=Q(()=>{u()&&s&&p(!1)},[s,u]);return _e(()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}import{useEffect as Xe}from"react";var dr=(e,n={})=>{let{delay:r=1,args:t}=n;Xe(()=>{let i=setInterval(e,r,...t||[]);return()=>clearInterval(i)},[r,t,e])};import{useCallback as F,useEffect as Ye}from"react";function vr(e,n={}){let{autoplay:r=!0}=n,t=ne(e,{autoplay:!1,...n}),{start:i,stop:a}=t,s=F(()=>document.hidden?a():i(),[i,a]),o=F(()=>{if(document.addEventListener("visibilitychange",s),!document.hidden)return i()},[i,s]),c=F(()=>{a(),document.removeEventListener("visibilitychange",s)},[a,s]);return Ye(()=>(r&&o(),()=>c()),[r,o,c]),{...t,start:o,stop:c}}import{useCallback as P,useEffect as Ze,useRef as et,useState as tt}from"react";function gr(e,n={}){let{delay:r=1,args:t,autoplay:i=!0,runOnStart:a=!1,updateState:s=!1}=n,o=et(void 0),[c,p]=tt(i),u=P(()=>o.current?(clearTimeout(o.current),o.current=void 0,!0):!1,[]),l=P(()=>{let T=u();return a&&(t?e?.(...t):e?.()),o.current=setTimeout(()=>{if(o.current=void 0,s&&p(!1),t)return e?.(...t);e?.()},r),!T&&s&&p(!0),o.current},[r,t,s,a,e,u]),d=P(()=>{u()&&s&&p(!1)},[s,u]);return Ze(()=>(i&&l(),()=>d()),[i,l,d]),s?{isActive:c,start:l,stop:d}:{start:l,stop:d}}export{yt as useConnection,pn as useDarkMode,sr as useDebounce,Kt as useDeferCallback,X as useDocumentVisibility,D as useEffectOnce,h as useEventListener,qn as useFocusTrap,Nn as useInView,Ct as useInput,ne as useInterval,vr as useIntervalWhenVisible,_ as useIsClient,R as useIsFirstRender,bn as useIsPortrait,hn as useIsTouchDevice,dr as useLightInterval,te as useLightTimeout,B as useLocalStorage,M as useMediaQuery,zt as usePagination,Cn as usePreventContextMenu,Xn as useScrollBlock,Zt as useSelection,lt as useSessionStorage,H as useStorage,gr as useTimeout,I as useUpdateEffect,An as useWakeLock};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alessiofrittoli/react-hooks",
3
- "version": "4.0.0",
3
+ "version": "4.1.1",
4
4
  "description": "TypeScript React utility Hooks",
5
5
  "author": {
6
6
  "name": "Alessio Frittoli",