@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 +55 -19
- package/dist/index.d.mts +30 -4
- package/dist/index.d.ts +30 -4
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +1 -1
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
|
-
-
|
|
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
|
-
-
|
|
145
|
-
|
|
146
|
-
|
|
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
|
|
582
|
-
| ------------------- |
|
|
583
|
-
| `type` | `K\|K[]`
|
|
584
|
-
| |
|
|
585
|
-
| |
|
|
586
|
-
| `options` | `CustomEventListenerOptions<T, K>`
|
|
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`
|
|
589
|
-
| `options.onLoad` | `() => void`
|
|
590
|
-
| `options.onCleanUp` | `() => void`
|
|
591
|
-
| `options.options` | `ListenerOptions`
|
|
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,
|
|
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,
|
|
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,
|
|
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,
|
|
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};
|