@siberiacancode/reactuse 0.3.10 → 0.3.13
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/dist/cjs/hooks/useActiveElement/useActiveElement.cjs +1 -1
- package/dist/cjs/hooks/useActiveElement/useActiveElement.cjs.map +1 -1
- package/dist/cjs/hooks/useAutoScroll/useAutoScroll.cjs +1 -1
- package/dist/cjs/hooks/useAutoScroll/useAutoScroll.cjs.map +1 -1
- package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs +1 -1
- package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs.map +1 -1
- package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs +1 -1
- package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs.map +1 -1
- package/dist/cjs/hooks/useFocusTrap/useFocusTrap.cjs.map +1 -1
- package/dist/cjs/hooks/useHash/useHash.cjs +1 -1
- package/dist/cjs/hooks/useHash/useHash.cjs.map +1 -1
- package/dist/cjs/hooks/useHover/useHover.cjs +1 -1
- package/dist/cjs/hooks/useHover/useHover.cjs.map +1 -1
- package/dist/cjs/hooks/useInfiniteScroll/useInfiniteScroll.cjs +1 -1
- package/dist/cjs/hooks/useInfiniteScroll/useInfiniteScroll.cjs.map +1 -1
- package/dist/cjs/hooks/useKeyPress/useKeyPress.cjs +1 -1
- package/dist/cjs/hooks/useKeyPress/useKeyPress.cjs.map +1 -1
- package/dist/cjs/hooks/useKeysPressed/useKeysPressed.cjs +1 -1
- package/dist/cjs/hooks/useKeysPressed/useKeysPressed.cjs.map +1 -1
- package/dist/cjs/hooks/useLongPress/useLongPress.cjs +1 -1
- package/dist/cjs/hooks/useLongPress/useLongPress.cjs.map +1 -1
- package/dist/cjs/hooks/useMediaControls/useMediaControls.cjs.map +1 -1
- package/dist/cjs/hooks/usePostMessage/usePostMessage.cjs +1 -1
- package/dist/cjs/hooks/usePostMessage/usePostMessage.cjs.map +1 -1
- package/dist/cjs/hooks/useProgress/useProgress.cjs +2 -0
- package/dist/cjs/hooks/useProgress/useProgress.cjs.map +1 -0
- package/dist/cjs/hooks/useSticky/useSticky.cjs +1 -1
- package/dist/cjs/hooks/useSticky/useSticky.cjs.map +1 -1
- package/dist/cjs/hooks/useWindowScroll/useWindowScroll.cjs +1 -1
- package/dist/cjs/hooks/useWindowScroll/useWindowScroll.cjs.map +1 -1
- package/dist/cjs/index.cjs +1 -1
- package/dist/esm/hooks/useActiveElement/useActiveElement.mjs +1 -1
- package/dist/esm/hooks/useActiveElement/useActiveElement.mjs.map +1 -1
- package/dist/esm/hooks/useAutoScroll/useAutoScroll.mjs +11 -11
- package/dist/esm/hooks/useAutoScroll/useAutoScroll.mjs.map +1 -1
- package/dist/esm/hooks/useClickOutside/useClickOutside.mjs +9 -9
- package/dist/esm/hooks/useClickOutside/useClickOutside.mjs.map +1 -1
- package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs +3 -1
- package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs.map +1 -1
- package/dist/esm/hooks/useFocusTrap/useFocusTrap.mjs.map +1 -1
- package/dist/esm/hooks/useHash/useHash.mjs +6 -3
- package/dist/esm/hooks/useHash/useHash.mjs.map +1 -1
- package/dist/esm/hooks/useHover/useHover.mjs +4 -4
- package/dist/esm/hooks/useHover/useHover.mjs.map +1 -1
- package/dist/esm/hooks/useInfiniteScroll/useInfiniteScroll.mjs +1 -1
- package/dist/esm/hooks/useInfiniteScroll/useInfiniteScroll.mjs.map +1 -1
- package/dist/esm/hooks/useKeyPress/useKeyPress.mjs +1 -1
- package/dist/esm/hooks/useKeyPress/useKeyPress.mjs.map +1 -1
- package/dist/esm/hooks/useKeysPressed/useKeysPressed.mjs +1 -1
- package/dist/esm/hooks/useKeysPressed/useKeysPressed.mjs.map +1 -1
- package/dist/esm/hooks/useLongPress/useLongPress.mjs +1 -4
- package/dist/esm/hooks/useLongPress/useLongPress.mjs.map +1 -1
- package/dist/esm/hooks/useMediaControls/useMediaControls.mjs.map +1 -1
- package/dist/esm/hooks/usePostMessage/usePostMessage.mjs +18 -14
- package/dist/esm/hooks/usePostMessage/usePostMessage.mjs.map +1 -1
- package/dist/esm/hooks/useProgress/useProgress.mjs +25 -0
- package/dist/esm/hooks/useProgress/useProgress.mjs.map +1 -0
- package/dist/esm/hooks/useSticky/useSticky.mjs +1 -1
- package/dist/esm/hooks/useSticky/useSticky.mjs.map +1 -1
- package/dist/esm/hooks/useWindowScroll/useWindowScroll.mjs +1 -4
- package/dist/esm/hooks/useWindowScroll/useWindowScroll.mjs.map +1 -1
- package/dist/esm/index.mjs +74 -72
- package/dist/esm/index.mjs.map +1 -1
- package/dist/types/hooks/time.d.ts +1 -0
- package/dist/types/hooks/useActiveElement/useActiveElement.d.ts +4 -3
- package/dist/types/hooks/useAutoScroll/useAutoScroll.d.ts +5 -3
- package/dist/types/hooks/useClickOutside/useClickOutside.d.ts +5 -3
- package/dist/types/hooks/useDoubleClick/useDoubleClick.d.ts +7 -5
- package/dist/types/hooks/useFocusTrap/useFocusTrap.d.ts +2 -2
- package/dist/types/hooks/useHash/useHash.d.ts +10 -5
- package/dist/types/hooks/useHover/useHover.d.ts +8 -6
- package/dist/types/hooks/useInfiniteScroll/useInfiniteScroll.d.ts +12 -6
- package/dist/types/hooks/useKeyPress/useKeyPress.d.ts +10 -4
- package/dist/types/hooks/useKeysPressed/useKeysPressed.d.ts +10 -10
- package/dist/types/hooks/useLongPress/useLongPress.d.ts +9 -3
- package/dist/types/hooks/usePostMessage/usePostMessage.d.ts +5 -2
- package/dist/types/hooks/useProgress/useProgress.d.ts +51 -0
- package/dist/types/hooks/useSticky/useSticky.d.ts +5 -5
- package/package.json +89 -89
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useKeyPress.mjs","sources":["../../../../src/hooks/useKeyPress/useKeyPress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The key or keys to listen for */\nexport type UseKeyPressKey = string | string[];\n\n/** The callback function to be invoked when key is pressed */\nexport type UseKeyPressCallback = (pressed: boolean, event: KeyboardEvent) => void;\n\nexport interface UseKeyPress {\n (target: HookTarget | Window
|
|
1
|
+
{"version":3,"file":"useKeyPress.mjs","sources":["../../../../src/hooks/useKeyPress/useKeyPress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The key or keys to listen for */\nexport type UseKeyPressKey = string | string[];\n\n/** The callback function to be invoked when key is pressed */\nexport type UseKeyPressCallback = (pressed: boolean, event: KeyboardEvent) => void;\n\n/** The use key press return type */\nexport interface UseKeyPressReturn {\n /** The pressed state of the key */\n pressed: boolean;\n /** The ref to attach to the element */\n ref: StateRef<Element>;\n}\n\nexport interface UseKeyPress {\n (\n target: HookTarget | Window,\n key: UseKeyPressKey,\n callback?: UseKeyPressCallback\n ): UseKeyPressReturn;\n\n <Target extends Element>(\n key: UseKeyPressKey,\n callback?: UseKeyPressCallback,\n target?: never\n ): UseKeyPressReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name useKeyPress\n * @description - Hook that listens for key press events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} [target=window] The target to attach the event listeners to\n * @param {UseKeyPressKey} key The key or keys to listen for\n * @param {(pressed: boolean, event: KeyboardEvent) => void} [callback] Callback function invoked when key is pressed\n * @returns {UseKeyPressReturn} An object containing the pressed state and ref\n *\n * @example\n * const isKeyPressed = useKeyPress(ref, 'a');\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyPressKey} key The key or keys to listen for\n * @param {(pressed: boolean, event: KeyboardEvent) => void} [callback] Callback function invoked when key is pressed\n * @returns {{ pressed: boolean; ref: StateRef<Target> }} An object containing the pressed state and ref\n *\n * @example\n * const { pressed, ref } = useKeyPress('a');\n */\nexport const useKeyPress = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const key = (target ? params[1] : params[0]) as UseKeyPressKey;\n const callback = (target ? params[2] : params[1]) as UseKeyPressCallback | undefined;\n\n const [pressed, setPressed] = useState(false);\n const internalRef = useRefState(window);\n\n const keyRef = useRef(key);\n keyRef.current = key;\n const internalCallbackRef = useRef(callback);\n internalCallbackRef.current = callback;\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n if (!element) return;\n\n const onKeyDown = (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n if (\n Array.isArray(keyRef.current)\n ? keyRef.current.includes(keyboardEvent.key)\n : keyboardEvent.key === keyRef.current\n ) {\n setPressed(true);\n internalCallbackRef.current?.(true, keyboardEvent);\n }\n };\n\n const onKeyUp = (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n if (\n Array.isArray(keyRef.current)\n ? keyRef.current.includes(keyboardEvent.key)\n : keyboardEvent.key === keyRef.current\n ) {\n setPressed(false);\n internalCallbackRef.current?.(false, keyboardEvent);\n }\n };\n\n element.addEventListener('keydown', onKeyDown);\n element.addEventListener('keyup', onKeyUp);\n\n return () => {\n element.removeEventListener('keydown', onKeyDown);\n element.removeEventListener('keyup', onKeyUp);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return { pressed };\n return { pressed, ref: internalRef };\n}) as UseKeyPress;\n"],"names":["useKeyPress","params","target","isTarget","key","callback","pressed","setPressed","useState","internalRef","useRefState","keyRef","useRef","internalCallbackRef","useEffect","element","onKeyDown","event","keyboardEvent","onKeyUp"],"mappings":";;;AA8DO,MAAMA,KAAe,IAAIC,MAAkB;AAChD,QAAMC,IAASC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC3CG,IAAOF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACpCI,IAAYH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAEzC,CAACK,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAAcC,EAAY,MAAM,GAEhCC,IAASC,EAAOR,CAAG;AACzB,EAAAO,EAAO,UAAUP;AACjB,QAAMS,IAAsBD,EAAOP,CAAQ;AA0C3C,SAzCAQ,EAAoB,UAAUR,GAE9BS,EAAU,MAAM;AACd,QAAI,CAACZ,KAAU,CAACO,EAAY,MAAO;AAEnC,UAAMM,IAAWb,IAASC,EAAS,WAAWD,CAAM,IAAIO,EAAY;AACpE,QAAI,CAACM,EAAS;AAEd,UAAMC,IAAY,CAACC,MAAiB;AAClC,YAAMC,IAAgBD;AACtB,OACE,MAAM,QAAQN,EAAO,OAAO,IACxBA,EAAO,QAAQ,SAASO,EAAc,GAAG,IACzCA,EAAc,QAAQP,EAAO,aAEjCJ,EAAW,EAAI,GACfM,EAAoB,UAAU,IAAMK,CAAa;AAAA,IACnD,GAGIC,IAAU,CAACF,MAAiB;AAChC,YAAMC,IAAgBD;AACtB,OACE,MAAM,QAAQN,EAAO,OAAO,IACxBA,EAAO,QAAQ,SAASO,EAAc,GAAG,IACzCA,EAAc,QAAQP,EAAO,aAEjCJ,EAAW,EAAK,GAChBM,EAAoB,UAAU,IAAOK,CAAa;AAAA,IACpD;AAGF,WAAAH,EAAQ,iBAAiB,WAAWC,CAAS,GAC7CD,EAAQ,iBAAiB,SAASI,CAAO,GAElC,MAAM;AACX,MAAAJ,EAAQ,oBAAoB,WAAWC,CAAS,GAChDD,EAAQ,oBAAoB,SAASI,CAAO;AAAA,IAAA;AAAA,EAC9C,GACC,CAACjB,KAAUC,EAAS,cAAcD,CAAM,GAAGO,EAAY,KAAK,CAAC,GAE5DP,IAAe,EAAE,SAAAI,EAAA,IACd,EAAE,SAAAA,GAAS,KAAKG,EAAA;AACzB;"}
|
|
@@ -18,7 +18,7 @@ const p = ((...r) => {
|
|
|
18
18
|
return t.addEventListener("keydown", m), t.addEventListener("keyup", E), () => {
|
|
19
19
|
t.removeEventListener("keydown", m), t.removeEventListener("keyup", E);
|
|
20
20
|
};
|
|
21
|
-
}, [f, i.state, e && u.getRawElement(e)]), e ? y : { value: y, ref: i };
|
|
21
|
+
}, [f, i.state, e && u.getRawElement(e)]), e ? { value: y } : { value: y, ref: i };
|
|
22
22
|
});
|
|
23
23
|
export {
|
|
24
24
|
p as useKeysPressed
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useKeysPressed.mjs","sources":["../../../../src/hooks/useKeysPressed/useKeysPressed.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The use keys pressed options type */\nexport interface UseKeysPressedOptions {\n /** Enable or disable the event listeners */\n enabled?: boolean;\n}\n\nexport interface
|
|
1
|
+
{"version":3,"file":"useKeysPressed.mjs","sources":["../../../../src/hooks/useKeysPressed/useKeysPressed.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The use keys pressed options type */\nexport interface UseKeysPressedOptions {\n /** Enable or disable the event listeners */\n enabled?: boolean;\n}\n\nexport interface UseKeysPressedReturn {\n /** The array of currently pressed keys */\n value: Array<{ key: string; code: string }>;\n}\n\nexport interface UseKeysPressed {\n (target: HookTarget | Window, options?: UseKeysPressedOptions): UseKeysPressedReturn;\n\n <Target extends Element>(\n options?: UseKeysPressedOptions\n ): UseKeysPressedReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name useKeysPressed\n * @description Tracks all currently pressed keyboard keys and their codes\n * @category Sensors\n * @usage low\n *\n * @overload\n * @param {HookTarget | Window} target DOM element or ref to attach keyboard listeners to\n * @param {UseKeysPressedOptions} [options.enabled=true] Enable or disable the event listeners\n * @returns {UseKeysPressedReturn} Object containing the array of currently pressed keys\n *\n * @example\n * const { value } = useKeysPressed(ref);\n *\n * @overload\n * @template Target - Type of the target DOM element\n * @param {UseKeysPressedOptions} [options] - Optional configuration options\n * @returns {UseKeysPressedReturn & { ref: StateRef<Target> }} Object containing the array of currently pressed keys and ref to attach to the element\n *\n * @example\n * const { value, ref } = useKeysPressed();\n */\nexport const useKeysPressed = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = (target ? params[1] : params[0]) as UseKeysPressedOptions | undefined;\n\n const enabled = options?.enabled ?? true;\n const [value, setValue] = useState<{ key: string; code: string }[]>([]);\n const internalRef = useRefState(window);\n\n useEffect(() => {\n if (!enabled) return;\n setValue([]);\n\n const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n if (!element) return;\n\n const onKeyDown = (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n setValue((prevValue) => {\n if (prevValue.some(({ code }) => code === keyboardEvent.code)) return prevValue;\n return [...prevValue, { key: keyboardEvent.key, code: keyboardEvent.code }];\n });\n };\n\n const onKeyUp = (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n setValue((prevValue) => prevValue.filter(({ code }) => code !== keyboardEvent.code));\n };\n\n element.addEventListener('keydown', onKeyDown);\n element.addEventListener('keyup', onKeyUp);\n\n return () => {\n element.removeEventListener('keydown', onKeyDown);\n element.removeEventListener('keyup', onKeyUp);\n };\n }, [enabled, internalRef.state, target && isTarget.getRawElement(target)]);\n\n if (target) return { value };\n return { value, ref: internalRef };\n}) as UseKeysPressed;\n"],"names":["useKeysPressed","params","target","isTarget","enabled","value","setValue","useState","internalRef","useRefState","useEffect","element","onKeyDown","event","keyboardEvent","prevValue","code","onKeyUp"],"mappings":";;;AAmDO,MAAMA,KAAkB,IAAIC,MAAkB;AACnD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAG5CG,KAFWF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,IAErB,WAAW,IAC9B,CAACI,GAAOC,CAAQ,IAAIC,EAA0C,CAAA,CAAE,GAChEC,IAAcC,EAAY,MAAM;AA+BtC,SA7BAC,EAAU,MAAM;AACd,QAAI,CAACN,EAAS;AACd,IAAAE,EAAS,CAAA,CAAE;AAEX,UAAMK,IAAWT,IAASC,EAAS,WAAWD,CAAM,IAAIM,EAAY;AACpE,QAAI,CAACG,EAAS;AAEd,UAAMC,IAAY,CAACC,MAAiB;AAClC,YAAMC,IAAgBD;AACtB,MAAAP,EAAS,CAACS,MACJA,EAAU,KAAK,CAAC,EAAE,MAAAC,EAAA,MAAWA,MAASF,EAAc,IAAI,IAAUC,IAC/D,CAAC,GAAGA,GAAW,EAAE,KAAKD,EAAc,KAAK,MAAMA,EAAc,MAAM,CAC3E;AAAA,IAAA,GAGGG,IAAU,CAACJ,MAAiB;AAChC,YAAMC,IAAgBD;AACtB,MAAAP,EAAS,CAACS,MAAcA,EAAU,OAAO,CAAC,EAAE,MAAAC,EAAA,MAAWA,MAASF,EAAc,IAAI,CAAC;AAAA,IAAA;AAGrF,WAAAH,EAAQ,iBAAiB,WAAWC,CAAS,GAC7CD,EAAQ,iBAAiB,SAASM,CAAO,GAElC,MAAM;AACX,MAAAN,EAAQ,oBAAoB,WAAWC,CAAS,GAChDD,EAAQ,oBAAoB,SAASM,CAAO;AAAA,IAAA;AAAA,EAC9C,GACC,CAACb,GAASI,EAAY,OAAON,KAAUC,EAAS,cAAcD,CAAM,CAAC,CAAC,GAErEA,IAAe,EAAE,OAAAG,EAAA,IACd,EAAE,OAAAA,GAAO,KAAKG,EAAA;AACvB;"}
|
|
@@ -19,10 +19,7 @@ const g = 400, P = ((...t) => {
|
|
|
19
19
|
return o.addEventListener("mousedown", c), window.addEventListener("mouseup", i), o.addEventListener("touchstart", c), window.addEventListener("touchend", i), () => {
|
|
20
20
|
o.removeEventListener("mousedown", c), window.removeEventListener("mouseup", i), o.removeEventListener("touchstart", c), window.removeEventListener("touchend", i), n.current && clearTimeout(n.current);
|
|
21
21
|
};
|
|
22
|
-
}, [e && a.getRawElement(e), u.state]), e ? E : {
|
|
23
|
-
ref: u,
|
|
24
|
-
pressed: E
|
|
25
|
-
};
|
|
22
|
+
}, [e && a.getRawElement(e), u.state]), e ? { pressed: E } : { pressed: E, ref: u };
|
|
26
23
|
});
|
|
27
24
|
export {
|
|
28
25
|
P as useLongPress
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useLongPress.mjs","sources":["../../../../src/hooks/useLongPress/useLongPress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\nexport type LongPressEvents = MouseEvent | TouchEvent;\n\n// * The use long press options type */\nexport interface UseLongPressOptions {\n // * The threshold time in milliseconds\n threshold?: number;\n // * The callback function to be invoked on long press cancel\n onCancel?: (event: LongPressEvents) => void;\n // * The callback function to be invoked on long press end\n onFinish?: (event: LongPressEvents) => void;\n // * The callback function to be invoked on long press start\n onStart?: (event: LongPressEvents) => void;\n}\n\nexport interface UseLongPress {\n (\n target: HookTarget,\n callback: (event: LongPressEvents) => void,\n options?: UseLongPressOptions\n ):
|
|
1
|
+
{"version":3,"file":"useLongPress.mjs","sources":["../../../../src/hooks/useLongPress/useLongPress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\nexport type LongPressEvents = MouseEvent | TouchEvent;\n\n// * The use long press options type */\nexport interface UseLongPressOptions {\n // * The threshold time in milliseconds\n threshold?: number;\n // * The callback function to be invoked on long press cancel\n onCancel?: (event: LongPressEvents) => void;\n // * The callback function to be invoked on long press end\n onFinish?: (event: LongPressEvents) => void;\n // * The callback function to be invoked on long press start\n onStart?: (event: LongPressEvents) => void;\n}\n\n/** The use long press return type */\nexport interface UseLongPressReturn {\n /** The long pressing state */\n pressed: boolean;\n /** The ref to attach to the element */\n ref: StateRef<Element>;\n}\n\nexport interface UseLongPress {\n (\n target: HookTarget,\n callback: (event: LongPressEvents) => void,\n options?: UseLongPressOptions\n ): UseLongPressReturn;\n\n <Target extends Element>(\n callback: (event: LongPressEvents) => void,\n options?: UseLongPressOptions,\n target?: never\n ): {\n ref: StateRef<Target>;\n } & UseLongPressReturn;\n}\n\nconst DEFAULT_THRESHOLD_TIME = 400;\n\n/**\n * @name useLongPress\n * @description - Hook that defines the logic when long pressing an element\n * @category Elements\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target element to be long pressed\n * @param {(event: LongPressEvents) => void} callback The callback function to be invoked on long press\n * @param {UseLongPressOptions} [options] The options for the long press\n * @returns {boolean} The long pressing state\n *\n * @example\n * const pressed = useLongPress(ref, () => console.log('callback'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: LongPressEvents) => void} callback The callback function to be invoked on long press\n * @param {UseLongPressOptions} [options] The options for the long press\n * @returns {boolean} The long pressing state\n *\n * @example\n * const { ref, pressed } = useLongPress(() => console.log('callback'));\n */\nexport const useLongPress = ((...params: any[]): any => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const callback = (target ? params[1] : params[0]) as (event: LongPressEvents) => void;\n const options = (target ? params[2] : params[1]) as UseLongPressOptions | undefined;\n\n const [pressed, setPressed] = useState(false);\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const isPressedRef = useRef(false);\n const internalRef = useRefState<Element>();\n\n const internalCallbackRef = useRef(callback);\n internalCallbackRef.current = callback;\n const internalOptionsRef = useRef(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = target ? isTarget.getElement(target) : internalRef.current;\n if (!element) return;\n\n const onStart = (event: LongPressEvents) => {\n internalOptionsRef.current?.onStart?.(event);\n\n isPressedRef.current = true;\n timeoutIdRef.current = setTimeout(() => {\n internalCallbackRef.current(event);\n setPressed(true);\n }, internalOptionsRef.current?.threshold ?? DEFAULT_THRESHOLD_TIME);\n };\n\n const onCancel = (event: LongPressEvents) => {\n setPressed((prevPressed) => {\n if (prevPressed) {\n internalOptionsRef.current?.onFinish?.(event);\n } else if (isPressedRef.current) {\n internalOptionsRef.current?.onCancel?.(event);\n }\n\n isPressedRef.current = false;\n if (timeoutIdRef.current) clearTimeout(timeoutIdRef.current);\n\n return false;\n });\n };\n\n element.addEventListener('mousedown', onStart as EventListener);\n window.addEventListener('mouseup', onCancel as EventListener);\n\n element.addEventListener('touchstart', onStart as EventListener);\n window.addEventListener('touchend', onCancel as EventListener);\n\n return () => {\n element.removeEventListener('mousedown', onStart as EventListener);\n window.removeEventListener('mouseup', onCancel as EventListener);\n\n element.removeEventListener('touchstart', onStart as EventListener);\n window.removeEventListener('touchend', onCancel as EventListener);\n\n if (timeoutIdRef.current) clearTimeout(timeoutIdRef.current);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return { pressed };\n return { pressed, ref: internalRef };\n}) as UseLongPress;\n"],"names":["DEFAULT_THRESHOLD_TIME","useLongPress","params","target","isTarget","callback","options","pressed","setPressed","useState","timeoutIdRef","useRef","isPressedRef","internalRef","useRefState","internalCallbackRef","internalOptionsRef","useEffect","element","onStart","event","onCancel","prevPressed"],"mappings":";;;AAgDA,MAAMA,IAAyB,KA0BlBC,KAAgB,IAAIC,MAAuB;AACtD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAYF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACzCI,IAAWH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExC,CAACK,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAAeC,EAAsC,MAAS,GAC9DC,IAAeD,EAAO,EAAK,GAC3BE,IAAcC,EAAA,GAEdC,IAAsBJ,EAAON,CAAQ;AAC3C,EAAAU,EAAoB,UAAUV;AAC9B,QAAMW,IAAqBL,EAAOL,CAAO;AAmDzC,SAlDAU,EAAmB,UAAUV,GAE7BW,EAAU,MAAM;AACd,QAAI,CAACd,KAAU,CAACU,EAAY,MAAO;AAEnC,UAAMK,IAAUf,IAASC,EAAS,WAAWD,CAAM,IAAIU,EAAY;AACnE,QAAI,CAACK,EAAS;AAEd,UAAMC,IAAU,CAACC,MAA2B;AAC1C,MAAAJ,EAAmB,SAAS,UAAUI,CAAK,GAE3CR,EAAa,UAAU,IACvBF,EAAa,UAAU,WAAW,MAAM;AACtC,QAAAK,EAAoB,QAAQK,CAAK,GACjCZ,EAAW,EAAI;AAAA,MAAA,GACdQ,EAAmB,SAAS,aAAahB,CAAsB;AAAA,IAAA,GAG9DqB,IAAW,CAACD,MAA2B;AAC3C,MAAAZ,EAAW,CAACc,OACNA,IACFN,EAAmB,SAAS,WAAWI,CAAK,IACnCR,EAAa,WACtBI,EAAmB,SAAS,WAAWI,CAAK,GAG9CR,EAAa,UAAU,IACnBF,EAAa,WAAS,aAAaA,EAAa,OAAO,GAEpD,GACR;AAAA,IAAA;AAGH,WAAAQ,EAAQ,iBAAiB,aAAaC,CAAwB,GAC9D,OAAO,iBAAiB,WAAWE,CAAyB,GAE5DH,EAAQ,iBAAiB,cAAcC,CAAwB,GAC/D,OAAO,iBAAiB,YAAYE,CAAyB,GAEtD,MAAM;AACX,MAAAH,EAAQ,oBAAoB,aAAaC,CAAwB,GACjE,OAAO,oBAAoB,WAAWE,CAAyB,GAE/DH,EAAQ,oBAAoB,cAAcC,CAAwB,GAClE,OAAO,oBAAoB,YAAYE,CAAyB,GAE5DX,EAAa,WAAS,aAAaA,EAAa,OAAO;AAAA,IAAA;AAAA,EAC7D,GACC,CAACP,KAAUC,EAAS,cAAcD,CAAM,GAAGU,EAAY,KAAK,CAAC,GAE5DV,IAAe,EAAE,SAAAI,EAAA,IACd,EAAE,SAAAA,GAAS,KAAKM,EAAA;AACzB;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMediaControls.mjs","sources":["../../../../src/hooks/useMediaControls/useMediaControls.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\nexport const timeRangeToArray = (timeRanges: TimeRanges) => {\n let ranges: [number, number][] = [];\n\n for (let i = 0; i < timeRanges.length; ++i)\n ranges = [...ranges, [timeRanges.start(i), timeRanges.end(i)]];\n\n return ranges;\n};\n\n/** The media source configuration type */\nexport interface UseMediaSource {\n /** The media attribute of the media */\n media?: string;\n /** The source URL of the media */\n src: string;\n /** The MIME type of the media */\n type?: string;\n}\n\n/** The media controls return type */\nexport interface UseMediaControlsReturn {\n /** Whether the media is currently buffering */\n buffered: [number, number][];\n /** The current playback position in seconds */\n currentTime: number;\n /** The total duration of the media in seconds */\n duration: number;\n /** Whether the media has ended */\n ended: boolean;\n /** Whether the media is currently muted */\n muted: boolean;\n /** The current playback rate (1.0 is normal speed) */\n playbackRate: number;\n /** Whether the media is currently playing */\n playing: boolean;\n /** Whether the media is currently seeking */\n seeking: boolean;\n /** Whether the media is currently stalled */\n stalled: boolean;\n /** The current volume level (0.0 to 1.0) */\n volume: number;\n /** Whether the media is currently waiting */\n waiting: boolean;\n\n /** Set the playback rate */\n changePlaybackRate: (rate: number) => void;\n /** Set the volume level (0.0 to 1.0) */\n changeVolume: (volume: number) => void;\n /** Set the muted state */\n mute: () => void;\n /** Pause the media */\n pause: () => void;\n /** Start playing the media */\n play: () => Promise<void>;\n /** Seek to a specific time in seconds */\n seek: (time: number) => void;\n /** Toggle between play and pause */\n toggle: () => Promise<void>;\n /** Set the unmuted state */\n unmute: () => void;\n}\n\nexport interface UseMediaControls {\n (target: HookTarget, src: string): UseMediaControlsReturn;\n\n (target: HookTarget, options: UseMediaSource): UseMediaControlsReturn;\n\n <Target extends HTMLMediaElement>(\n src: string\n ): UseMediaControlsReturn & {\n ref: StateRef<Target>;\n };\n\n <Target extends HTMLMediaElement>(\n options: UseMediaSource\n ): UseMediaControlsReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name useMediaControls\n * @description Hook that provides controls for HTML media elements (audio/video)\n * @category Browser\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target media element\n * @param {string} src The source URL of the media\n * @returns {UseMediaControlsReturn} An object containing media controls and state\n *\n * @example\n * const { playing, play, pause } = useMediaControls(videoRef, 'video.mp4');\n *\n * @overload\n * @param {HookTarget} target The target media element\n * @param {UseMediaSource} options The media source configuration\n * @returns {UseMediaControlsReturn} An object containing media controls and state\n *\n * @example\n * const { playing, play, pause } = useMediaControls(audioRef, { src: 'audio.mp3', type: 'audio/mp3' });\n *\n * @overload\n * @template Target The target media element type\n * @param {string} src The source URL of the media\n * @returns {UseMediaControlsReturn & { ref: StateRef<Target> }} An object containing media controls, state and ref\n *\n * @example\n * const { ref, playing, play, pause } = useMediaControls<HTMLVideoElement>('video.mp4');\n *\n * @overload\n * @template Target The target media element type\n * @param {UseMediaSource} options The media source configuration\n * @returns {UseMediaControlsReturn & { ref: StateRef<Target> }} An object containing media controls, state and ref\n *\n * @example\n * const { ref, playing, play, pause } = useMediaControls<HTMLVideoElement>({ src: 'video.mp4', type: 'video/mp4' });\n */\nexport const useMediaControls = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = (\n target\n ? typeof params[1] === 'object'\n ? params[1]\n : { src: params[1] }\n : typeof params[0] === 'object'\n ? params[0]\n : { src: params[0] }\n ) as UseMediaSource;\n\n const internalRef = useRefState<HTMLMediaElement>();\n const elementRef = useRef<HTMLMediaElement | null>(null);\n\n const [playing, setPlaying] = useState(false);\n const [duration, setDuration] = useState(0);\n const [currentTime, setCurrentTime] = useState(0);\n const [seeking, setSeeking] = useState(false);\n const [waiting, setWaiting] = useState(false);\n const [buffered, setBuffered] = useState<[number, number][]>([]);\n const [stalled, setStalled] = useState(false);\n const [ended, setEnded] = useState(false);\n const [playbackRate, setPlaybackRateState] = useState(1);\n\n const [muted, setMutedState] = useState(false);\n const [volume, setVolumeState] = useState(1);\n\n useEffect(() => {\n const element = (\n target ? isTarget.getElement(target) : internalRef.current\n ) as HTMLMediaElement;\n\n if (!element) return;\n\n elementRef.current = element;\n element.src = options.src;\n\n if (options.type) element.setAttribute('type', options.type);\n if (options.media) element.setAttribute('media', options.media);\n\n setDuration(element.duration);\n setCurrentTime(element.currentTime);\n setPlaying(false);\n setEnded(element.ended);\n setMutedState(element.muted);\n setVolumeState(element.volume);\n setPlaybackRateState(element.playbackRate);\n\n const onPlaying = () => {\n setPlaying(true);\n setStalled(false);\n };\n const onPause = () => setPlaying(false);\n const onWaiting = () => setWaiting(true);\n const onStalled = () => setStalled(true);\n const onSeeking = () => setSeeking(true);\n const onSeeked = () => setSeeking(false);\n const onEnded = () => {\n setPlaying(false);\n setEnded(true);\n };\n const onDurationChange = () => setDuration(element.duration);\n const onTimeUpdate = () => setCurrentTime(element.currentTime);\n const onVolumechange = () => {\n setMutedState(element.muted);\n setVolumeState(element.volume);\n };\n const onRatechange = () => setPlaybackRateState(element.playbackRate);\n const onProgress = () => setBuffered(timeRangeToArray(element.buffered));\n\n element.addEventListener('playing', onPlaying);\n element.addEventListener('pause', onPause);\n element.addEventListener('waiting', onWaiting);\n element.addEventListener('progress', onProgress);\n element.addEventListener('stalled', onStalled);\n element.addEventListener('seeking', onSeeking);\n element.addEventListener('seeked', onSeeked);\n element.addEventListener('ended', onEnded);\n element.addEventListener('loadedmetadata', onDurationChange);\n element.addEventListener('timeupdate', onTimeUpdate);\n element.addEventListener('volumechange', onVolumechange);\n element.addEventListener('ratechange', onRatechange);\n\n return () => {\n element.removeEventListener('playing', onPlaying);\n element.removeEventListener('pause', onPause);\n element.removeEventListener('waiting', onWaiting);\n element.removeEventListener('progress', onProgress);\n element.removeEventListener('stalled', onStalled);\n element.removeEventListener('seeking', onSeeking);\n element.removeEventListener('seeked', onSeeked);\n element.removeEventListener('ended', onEnded);\n element.removeEventListener('loadedmetadata', onDurationChange);\n element.removeEventListener('timeupdate', onTimeUpdate);\n element.removeEventListener('volumechange', onVolumechange);\n element.removeEventListener('ratechange', onRatechange);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n const play = async () => {\n const element = elementRef.current;\n if (!element) return;\n\n await element.play();\n };\n\n const pause = () => {\n if (!elementRef.current) return;\n elementRef.current.pause();\n };\n\n const toggle = async (value = !playing) => {\n if (value) return play();\n return pause();\n };\n\n const seek = (time: number) => {\n if (!elementRef.current) return;\n elementRef.current.currentTime = Math.min(Math.max(time, 0), duration);\n };\n\n const changeVolume = (value: number) => {\n if (!elementRef.current) return;\n elementRef.current.volume = Math.min(Math.max(value, 0), 1);\n };\n\n const mute = () => {\n if (!elementRef.current) return;\n elementRef.current.muted = true;\n };\n\n const unmute = () => {\n if (!elementRef.current) return;\n elementRef.current.muted = false;\n };\n\n const changePlaybackRate = (value: number) => {\n if (!elementRef.current) return;\n elementRef.current.playbackRate = value;\n };\n\n return {\n playing,\n duration,\n currentTime,\n seeking,\n waiting,\n buffered,\n stalled,\n ended,\n playbackRate,\n muted,\n volume,\n\n play,\n pause,\n toggle,\n seek,\n changeVolume,\n mute,\n unmute,\n changePlaybackRate,\n\n ...(!target && { ref: internalRef })\n };\n}) as UseMediaControls;\n"],"names":["timeRangeToArray","timeRanges","ranges","i","useMediaControls","params","target","isTarget","options","internalRef","useRefState","elementRef","useRef","playing","setPlaying","useState","duration","setDuration","currentTime","setCurrentTime","seeking","setSeeking","waiting","setWaiting","buffered","setBuffered","stalled","setStalled","ended","setEnded","playbackRate","setPlaybackRateState","muted","setMutedState","volume","setVolumeState","useEffect","element","onPlaying","onPause","onWaiting","onStalled","onSeeking","onSeeked","onEnded","onDurationChange","onTimeUpdate","onVolumechange","onRatechange","onProgress","play","pause","value","time"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useMediaControls.mjs","sources":["../../../../src/hooks/useMediaControls/useMediaControls.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\nexport const timeRangeToArray = (timeRanges: TimeRanges) => {\n let ranges: [number, number][] = [];\n\n for (let i = 0; i < timeRanges.length; ++i)\n ranges = [...ranges, [timeRanges.start(i), timeRanges.end(i)]];\n\n return ranges;\n};\n\n/** The media source configuration type */\nexport interface UseMediaSource {\n /** The media attribute of the media */\n media?: string;\n /** The source URL of the media */\n src: string;\n /** The MIME type of the media */\n type?: string;\n}\n\n/** The media controls return type */\nexport interface UseMediaControlsReturn {\n /** Whether the media is currently buffering */\n buffered: [number, number][];\n /** The current playback position in seconds */\n currentTime: number;\n /** The total duration of the media in seconds */\n duration: number;\n /** Whether the media has ended */\n ended: boolean;\n /** Whether the media is currently muted */\n muted: boolean;\n /** The current playback rate (1.0 is normal speed) */\n playbackRate: number;\n /** Whether the media is currently playing */\n playing: boolean;\n /** Whether the media is currently seeking */\n seeking: boolean;\n /** Whether the media is currently stalled */\n stalled: boolean;\n /** The current volume level (0.0 to 1.0) */\n volume: number;\n /** Whether the media is currently waiting */\n waiting: boolean;\n /** Set the playback rate */\n changePlaybackRate: (rate: number) => void;\n /** Set the volume level (0.0 to 1.0) */\n changeVolume: (volume: number) => void;\n /** Set the muted state */\n mute: () => void;\n /** Pause the media */\n pause: () => void;\n /** Start playing the media */\n play: () => Promise<void>;\n /** Seek to a specific time in seconds */\n seek: (time: number) => void;\n /** Toggle between play and pause */\n toggle: () => Promise<void>;\n /** Set the unmuted state */\n unmute: () => void;\n}\n\nexport interface UseMediaControls {\n (target: HookTarget, src: string): UseMediaControlsReturn;\n\n (target: HookTarget, options: UseMediaSource): UseMediaControlsReturn;\n\n <Target extends HTMLMediaElement>(\n src: string\n ): UseMediaControlsReturn & {\n ref: StateRef<Target>;\n };\n\n <Target extends HTMLMediaElement>(\n options: UseMediaSource\n ): UseMediaControlsReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name useMediaControls\n * @description Hook that provides controls for HTML media elements (audio/video)\n * @category Browser\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target media element\n * @param {string} src The source URL of the media\n * @returns {UseMediaControlsReturn} An object containing media controls and state\n *\n * @example\n * const { playing, play, pause } = useMediaControls(videoRef, 'video.mp4');\n *\n * @overload\n * @param {HookTarget} target The target media element\n * @param {UseMediaSource} options The media source configuration\n * @returns {UseMediaControlsReturn} An object containing media controls and state\n *\n * @example\n * const { playing, play, pause } = useMediaControls(audioRef, { src: 'audio.mp3', type: 'audio/mp3' });\n *\n * @overload\n * @template Target The target media element type\n * @param {string} src The source URL of the media\n * @returns {UseMediaControlsReturn & { ref: StateRef<Target> }} An object containing media controls, state and ref\n *\n * @example\n * const { ref, playing, play, pause } = useMediaControls<HTMLVideoElement>('video.mp4');\n *\n * @overload\n * @template Target The target media element type\n * @param {UseMediaSource} options The media source configuration\n * @returns {UseMediaControlsReturn & { ref: StateRef<Target> }} An object containing media controls, state and ref\n *\n * @example\n * const { ref, playing, play, pause } = useMediaControls<HTMLVideoElement>({ src: 'video.mp4', type: 'video/mp4' });\n */\nexport const useMediaControls = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = (\n target\n ? typeof params[1] === 'object'\n ? params[1]\n : { src: params[1] }\n : typeof params[0] === 'object'\n ? params[0]\n : { src: params[0] }\n ) as UseMediaSource;\n\n const internalRef = useRefState<HTMLMediaElement>();\n const elementRef = useRef<HTMLMediaElement | null>(null);\n\n const [playing, setPlaying] = useState(false);\n const [duration, setDuration] = useState(0);\n const [currentTime, setCurrentTime] = useState(0);\n const [seeking, setSeeking] = useState(false);\n const [waiting, setWaiting] = useState(false);\n const [buffered, setBuffered] = useState<[number, number][]>([]);\n const [stalled, setStalled] = useState(false);\n const [ended, setEnded] = useState(false);\n const [playbackRate, setPlaybackRateState] = useState(1);\n\n const [muted, setMutedState] = useState(false);\n const [volume, setVolumeState] = useState(1);\n\n useEffect(() => {\n const element = (\n target ? isTarget.getElement(target) : internalRef.current\n ) as HTMLMediaElement;\n\n if (!element) return;\n\n elementRef.current = element;\n element.src = options.src;\n\n if (options.type) element.setAttribute('type', options.type);\n if (options.media) element.setAttribute('media', options.media);\n\n setDuration(element.duration);\n setCurrentTime(element.currentTime);\n setPlaying(false);\n setEnded(element.ended);\n setMutedState(element.muted);\n setVolumeState(element.volume);\n setPlaybackRateState(element.playbackRate);\n\n const onPlaying = () => {\n setPlaying(true);\n setStalled(false);\n };\n const onPause = () => setPlaying(false);\n const onWaiting = () => setWaiting(true);\n const onStalled = () => setStalled(true);\n const onSeeking = () => setSeeking(true);\n const onSeeked = () => setSeeking(false);\n const onEnded = () => {\n setPlaying(false);\n setEnded(true);\n };\n const onDurationChange = () => setDuration(element.duration);\n const onTimeUpdate = () => setCurrentTime(element.currentTime);\n const onVolumechange = () => {\n setMutedState(element.muted);\n setVolumeState(element.volume);\n };\n const onRatechange = () => setPlaybackRateState(element.playbackRate);\n const onProgress = () => setBuffered(timeRangeToArray(element.buffered));\n\n element.addEventListener('playing', onPlaying);\n element.addEventListener('pause', onPause);\n element.addEventListener('waiting', onWaiting);\n element.addEventListener('progress', onProgress);\n element.addEventListener('stalled', onStalled);\n element.addEventListener('seeking', onSeeking);\n element.addEventListener('seeked', onSeeked);\n element.addEventListener('ended', onEnded);\n element.addEventListener('loadedmetadata', onDurationChange);\n element.addEventListener('timeupdate', onTimeUpdate);\n element.addEventListener('volumechange', onVolumechange);\n element.addEventListener('ratechange', onRatechange);\n\n return () => {\n element.removeEventListener('playing', onPlaying);\n element.removeEventListener('pause', onPause);\n element.removeEventListener('waiting', onWaiting);\n element.removeEventListener('progress', onProgress);\n element.removeEventListener('stalled', onStalled);\n element.removeEventListener('seeking', onSeeking);\n element.removeEventListener('seeked', onSeeked);\n element.removeEventListener('ended', onEnded);\n element.removeEventListener('loadedmetadata', onDurationChange);\n element.removeEventListener('timeupdate', onTimeUpdate);\n element.removeEventListener('volumechange', onVolumechange);\n element.removeEventListener('ratechange', onRatechange);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n const play = async () => {\n const element = elementRef.current;\n if (!element) return;\n\n await element.play();\n };\n\n const pause = () => {\n if (!elementRef.current) return;\n elementRef.current.pause();\n };\n\n const toggle = async (value = !playing) => {\n if (value) return play();\n return pause();\n };\n\n const seek = (time: number) => {\n if (!elementRef.current) return;\n elementRef.current.currentTime = Math.min(Math.max(time, 0), duration);\n };\n\n const changeVolume = (value: number) => {\n if (!elementRef.current) return;\n elementRef.current.volume = Math.min(Math.max(value, 0), 1);\n };\n\n const mute = () => {\n if (!elementRef.current) return;\n elementRef.current.muted = true;\n };\n\n const unmute = () => {\n if (!elementRef.current) return;\n elementRef.current.muted = false;\n };\n\n const changePlaybackRate = (value: number) => {\n if (!elementRef.current) return;\n elementRef.current.playbackRate = value;\n };\n\n return {\n playing,\n duration,\n currentTime,\n seeking,\n waiting,\n buffered,\n stalled,\n ended,\n playbackRate,\n muted,\n volume,\n\n play,\n pause,\n toggle,\n seek,\n changeVolume,\n mute,\n unmute,\n changePlaybackRate,\n\n ...(!target && { ref: internalRef })\n };\n}) as UseMediaControls;\n"],"names":["timeRangeToArray","timeRanges","ranges","i","useMediaControls","params","target","isTarget","options","internalRef","useRefState","elementRef","useRef","playing","setPlaying","useState","duration","setDuration","currentTime","setCurrentTime","seeking","setSeeking","waiting","setWaiting","buffered","setBuffered","stalled","setStalled","ended","setEnded","playbackRate","setPlaybackRateState","muted","setMutedState","volume","setVolumeState","useEffect","element","onPlaying","onPause","onWaiting","onStalled","onSeeking","onSeeked","onEnded","onDurationChange","onTimeUpdate","onVolumechange","onRatechange","onProgress","play","pause","value","time"],"mappings":"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"}
|
|
@@ -1,20 +1,24 @@
|
|
|
1
|
-
import { useRef as
|
|
2
|
-
const
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
import { useRef as i, useEffect as u } from "react";
|
|
2
|
+
const f = (s, t) => {
|
|
3
|
+
const o = i(t);
|
|
4
|
+
o.current = t;
|
|
5
|
+
const r = i(s);
|
|
6
|
+
return r.current = s, u(() => {
|
|
7
|
+
const n = (e) => {
|
|
8
|
+
if (Array.isArray(r.current)) {
|
|
9
|
+
if (!r.current.includes(e.origin)) return;
|
|
10
|
+
} else if (r.current !== "*" && e.origin !== r.current)
|
|
11
|
+
return;
|
|
12
|
+
o.current(e.data, e);
|
|
7
13
|
};
|
|
8
|
-
return window.addEventListener("message",
|
|
9
|
-
}, []), (
|
|
10
|
-
if (Array.isArray(
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}
|
|
14
|
-
window.postMessage(r, e);
|
|
14
|
+
return window.addEventListener("message", n), () => window.removeEventListener("message", n);
|
|
15
|
+
}, []), (n) => {
|
|
16
|
+
if (Array.isArray(r.current))
|
|
17
|
+
return r.current.forEach((e) => window.postMessage(n, e));
|
|
18
|
+
window.postMessage(n, r.current);
|
|
15
19
|
};
|
|
16
20
|
};
|
|
17
21
|
export {
|
|
18
|
-
|
|
22
|
+
f as usePostMessage
|
|
19
23
|
};
|
|
20
24
|
//# sourceMappingURL=usePostMessage.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePostMessage.mjs","sources":["../../../../src/hooks/usePostMessage/usePostMessage.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nexport type UsePostMessageReturn<Message> = (message: Message) => void;\n\n/**\n * @name usePostMessage\n * @description - Hook that allows you to receive messages from other origins\n * @category Browser\n * @usage low\n *\n * @overload\n * @template Message The message data type\n * @param {
|
|
1
|
+
{"version":3,"file":"usePostMessage.mjs","sources":["../../../../src/hooks/usePostMessage/usePostMessage.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\n/** The origin of the message */\nexport type UsePostMessageOrigin = string | '*' | string[];\n\n/** The return type of the usePostMessage hook */\nexport type UsePostMessageReturn<Message> = (message: Message) => void;\n\n/**\n * @name usePostMessage\n * @description - Hook that allows you to receive messages from other origins\n * @category Browser\n * @usage low\n *\n * @overload\n * @template Message The message data type\n * @param {UsePostMessageOrigin} origin The origin of the message\n * @param {(message: Message) => Message} callback callback to get received message\n * @returns {(message: Message) => void} An object containing the current message\n *\n * @example\n * const postMessage = usePostMessage();\n */\nexport const usePostMessage = <Message>(\n origin: UsePostMessageOrigin,\n callback: (message: Message, event: MessageEvent<Message>) => void\n): UsePostMessageReturn<Message> => {\n const internalCallbackRef = useRef(callback);\n internalCallbackRef.current = callback;\n const internalOriginRef = useRef(origin);\n internalOriginRef.current = origin;\n\n useEffect(() => {\n const onMessage = (event: MessageEvent<Message>) => {\n if (Array.isArray(internalOriginRef.current)) {\n if (!internalOriginRef.current.includes(event.origin)) return;\n } else if (internalOriginRef.current !== '*' && event.origin !== internalOriginRef.current)\n return;\n\n internalCallbackRef.current(event.data as Message, event);\n };\n\n window.addEventListener('message', onMessage);\n return () => window.removeEventListener('message', onMessage);\n }, []);\n\n const postMessage = (message: Message) => {\n if (Array.isArray(internalOriginRef.current))\n return internalOriginRef.current.forEach((origin) => window.postMessage(message, origin));\n\n window.postMessage(message, internalOriginRef.current);\n };\n\n return postMessage;\n};\n"],"names":["usePostMessage","origin","callback","internalCallbackRef","useRef","internalOriginRef","useEffect","onMessage","event","message"],"mappings":";AAuBO,MAAMA,IAAiB,CAC5BC,GACAC,MACkC;AAClC,QAAMC,IAAsBC,EAAOF,CAAQ;AAC3C,EAAAC,EAAoB,UAAUD;AAC9B,QAAMG,IAAoBD,EAAOH,CAAM;AACvC,SAAAI,EAAkB,UAAUJ,GAE5BK,EAAU,MAAM;AACd,UAAMC,IAAY,CAACC,MAAiC;AAClD,UAAI,MAAM,QAAQH,EAAkB,OAAO;AACzC,YAAI,CAACA,EAAkB,QAAQ,SAASG,EAAM,MAAM,EAAG;AAAA,iBAC9CH,EAAkB,YAAY,OAAOG,EAAM,WAAWH,EAAkB;AACjF;AAEF,MAAAF,EAAoB,QAAQK,EAAM,MAAiBA,CAAK;AAAA,IAAA;AAG1D,kBAAO,iBAAiB,WAAWD,CAAS,GACrC,MAAM,OAAO,oBAAoB,WAAWA,CAAS;AAAA,EAAA,GAC3D,EAAE,GAEe,CAACE,MAAqB;AACxC,QAAI,MAAM,QAAQJ,EAAkB,OAAO;AACzC,aAAOA,EAAkB,QAAQ,QAAQ,CAACJ,MAAW,OAAO,YAAYQ,GAASR,CAAM,CAAC;AAE1F,WAAO,YAAYQ,GAASJ,EAAkB,OAAO;AAAA,EAAA;AAIzD;"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { useState as s, useRef as y, useEffect as E } from "react";
|
|
2
|
+
const h = (t, e, n) => Math.min(Math.max(t, e), n), P = (t, e) => t < 0.25 ? 0.12 + e * Math.random() : t < 0.5 ? 0.08 + e * Math.random() : t < 0.8 ? 0.03 + e * Math.random() : t < 0.95 ? 0.01 + e / 2 * Math.random() : t < 0.99 ? 5e-3 * Math.random() : 0, T = (t = 0, e = {}) => {
|
|
3
|
+
const n = Math.max(e.speed ?? 250, 16), u = h(e.rate ?? 0.02, 0, 0.3), l = e.maximum ?? 0.98, [o, r] = s(t), [f, a] = s(!!e.immediately), [d, c] = s(f), v = y(void 0), M = () => {
|
|
4
|
+
r(1), c(!1), setTimeout(() => a(!1), 250);
|
|
5
|
+
}, i = (m = P(o, u)) => r((A) => h(A + m, t, l)), x = (m = t) => {
|
|
6
|
+
a(!0), c(!0), r(m);
|
|
7
|
+
}, I = () => {
|
|
8
|
+
a(!1), c(!1), r(0);
|
|
9
|
+
};
|
|
10
|
+
return E(() => {
|
|
11
|
+
if (d)
|
|
12
|
+
return v.current = setInterval(i, n), () => clearInterval(v.current);
|
|
13
|
+
}, [d, n, u]), {
|
|
14
|
+
value: o,
|
|
15
|
+
active: f,
|
|
16
|
+
start: x,
|
|
17
|
+
done: M,
|
|
18
|
+
inc: i,
|
|
19
|
+
remove: I
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
export {
|
|
23
|
+
T as useProgress
|
|
24
|
+
};
|
|
25
|
+
//# sourceMappingURL=useProgress.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useProgress.mjs","sources":["../../../../src/hooks/useProgress/useProgress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\n\nconst resolveAutoIncrement = (progress: number, trickleRate: number) => {\n if (progress < 0.25) return 0.12 + trickleRate * Math.random();\n if (progress < 0.5) return 0.08 + trickleRate * Math.random();\n if (progress < 0.8) return 0.03 + trickleRate * Math.random();\n if (progress < 0.95) return 0.01 + (trickleRate / 2) * Math.random();\n if (progress < 0.99) return 0.005 * Math.random();\n return 0;\n};\n\n/** The use progress options type */\nexport interface UseProgressOptions {\n /** Start progress immediately */\n immediately?: boolean;\n /** Maximum progress value */\n maximum?: number;\n /** Additional random amount for each auto increment */\n rate?: number;\n /** Auto-increment frequency in milliseconds */\n speed?: number;\n}\n\n/** The use progress return type */\nexport interface UseProgressReturn {\n /** Whether progress is currently active */\n active: boolean;\n /** Current progress value in range 0..1, null means hidden */\n value: number;\n /** Complete progress to 100% */\n done: (force?: boolean) => number | null;\n /** Increment progress with easing behavior */\n inc: (amount?: number) => number | null;\n /** Remove progress and stop timers */\n remove: () => void;\n /** Start progress and auto incrementing */\n start: (from?: number | null) => number;\n}\n\n/**\n * @name useProgress\n * @description - Hook that creates a lightweight progress bar state with NProgress-like behavior\n * @category Time\n * @usage medium\n *\n * @param {number} [initialProgress] Initial progress value in range 0..1\n * @param {boolean} [options.active] Controls progress externally (true -> start, false -> done)\n * @param {number} [options.maximum=0.95] Maximum value when progress starts\n * @param {number} [options.speed=250] Auto increment interval in milliseconds\n * @param {number} [options.rate=0.02] Additional random increment amount on each tick\n * @param {number} [options.doneResetDelay=250] Delay before reset to null after done\n * @returns {UseProgressReturn} Current progress state and control methods\n *\n * @example\n * const { value, active, start, done, inc, set, remove } = useProgress(0.2);\n */\nexport const useProgress = (initialValue: number = 0, options: UseProgressOptions = {}) => {\n const speed = Math.max(options.speed ?? 250, 16);\n const rate = clamp(options.rate ?? 0.02, 0, 0.3);\n const maximum = options.maximum ?? 0.98;\n\n const [value, setValue] = useState(initialValue);\n const [active, setActive] = useState(!!options.immediately);\n const [internalActive, setInternalActive] = useState(active);\n\n const intervalIdRef = useRef<ReturnType<typeof setInterval>>(undefined);\n\n const done = () => {\n setValue(1);\n setInternalActive(false);\n setTimeout(() => setActive(false), 250);\n };\n\n const inc = (amount: number = resolveAutoIncrement(value, rate)) =>\n setValue((currentValue) => clamp(currentValue + amount, initialValue, maximum));\n\n const start = (from: number = initialValue) => {\n setActive(true);\n setInternalActive(true);\n setValue(from);\n };\n\n const remove = () => {\n setActive(false);\n setInternalActive(false);\n setValue(0);\n };\n\n useEffect(() => {\n if (!internalActive) return;\n intervalIdRef.current = setInterval(inc, speed);\n return () => clearInterval(intervalIdRef.current);\n }, [internalActive, speed, rate]);\n\n return {\n value,\n active,\n start,\n done,\n inc,\n remove\n };\n};\n"],"names":["clamp","value","min","max","resolveAutoIncrement","progress","trickleRate","useProgress","initialValue","options","speed","rate","maximum","setValue","useState","active","setActive","internalActive","setInternalActive","intervalIdRef","useRef","done","inc","amount","currentValue","start","from","remove","useEffect"],"mappings":";AAEA,MAAMA,IAAQ,CAACC,GAAeC,GAAaC,MAAgB,KAAK,IAAI,KAAK,IAAIF,GAAOC,CAAG,GAAGC,CAAG,GAEvFC,IAAuB,CAACC,GAAkBC,MAC1CD,IAAW,OAAa,OAAOC,IAAc,KAAK,OAAA,IAClDD,IAAW,MAAY,OAAOC,IAAc,KAAK,OAAA,IACjDD,IAAW,MAAY,OAAOC,IAAc,KAAK,OAAA,IACjDD,IAAW,OAAa,OAAQC,IAAc,IAAK,KAAK,OAAA,IACxDD,IAAW,OAAa,OAAQ,KAAK,OAAA,IAClC,GAgDIE,IAAc,CAACC,IAAuB,GAAGC,IAA8B,CAAA,MAAO;AACzF,QAAMC,IAAQ,KAAK,IAAID,EAAQ,SAAS,KAAK,EAAE,GACzCE,IAAOX,EAAMS,EAAQ,QAAQ,MAAM,GAAG,GAAG,GACzCG,IAAUH,EAAQ,WAAW,MAE7B,CAACR,GAAOY,CAAQ,IAAIC,EAASN,CAAY,GACzC,CAACO,GAAQC,CAAS,IAAIF,EAAS,CAAC,CAACL,EAAQ,WAAW,GACpD,CAACQ,GAAgBC,CAAiB,IAAIJ,EAASC,CAAM,GAErDI,IAAgBC,EAAuC,MAAS,GAEhEC,IAAO,MAAM;AACjB,IAAAR,EAAS,CAAC,GACVK,EAAkB,EAAK,GACvB,WAAW,MAAMF,EAAU,EAAK,GAAG,GAAG;AAAA,EAAA,GAGlCM,IAAM,CAACC,IAAiBnB,EAAqBH,GAAOU,CAAI,MAC5DE,EAAS,CAACW,MAAiBxB,EAAMwB,IAAeD,GAAQf,GAAcI,CAAO,CAAC,GAE1Ea,IAAQ,CAACC,IAAelB,MAAiB;AAC7C,IAAAQ,EAAU,EAAI,GACdE,EAAkB,EAAI,GACtBL,EAASa,CAAI;AAAA,EAAA,GAGTC,IAAS,MAAM;AACnB,IAAAX,EAAU,EAAK,GACfE,EAAkB,EAAK,GACvBL,EAAS,CAAC;AAAA,EAAA;AAGZ,SAAAe,EAAU,MAAM;AACd,QAAKX;AACL,aAAAE,EAAc,UAAU,YAAYG,GAAKZ,CAAK,GACvC,MAAM,cAAcS,EAAc,OAAO;AAAA,EAAA,GAC/C,CAACF,GAAgBP,GAAOC,CAAI,CAAC,GAEzB;AAAA,IACL,OAAAV;AAAA,IACA,QAAAc;AAAA,IACA,OAAAU;AAAA,IACA,MAAAJ;AAAA,IACA,KAAAC;AAAA,IACA,QAAAK;AAAA,EAAA;AAEJ;"}
|
|
@@ -20,7 +20,7 @@ const R = ((...o) => {
|
|
|
20
20
|
return e.addEventListener("scroll", n), window.addEventListener("resize", n), window.addEventListener("orientationchange", n), n(), () => {
|
|
21
21
|
e.removeEventListener("scroll", n), window.removeEventListener("resize", n), window.removeEventListener("orientationchange", n);
|
|
22
22
|
};
|
|
23
|
-
}, [t && s.getRawElement(t), i.state, c, r?.root]), t ? u : {
|
|
23
|
+
}, [t && s.getRawElement(t), i.state, c, r?.root]), t ? { stuck: u } : {
|
|
24
24
|
stuck: u,
|
|
25
25
|
ref: i
|
|
26
26
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSticky.mjs","sources":["../../../../src/hooks/useSticky/useSticky.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The use sticky return type */\nexport interface UseStickyReturn {\n stuck: boolean;\n}\n\n/** The use sticky axis type */\nexport type UseStickyAxis = 'horizontal' | 'vertical';\n\n/** The use sticky options type */\nexport interface UseStickyOptions {\n axis?: UseStickyAxis;\n root?: HookTarget;\n}\n\nexport interface UseSticky {\n (target: HookTarget, options?: UseStickyOptions):
|
|
1
|
+
{"version":3,"file":"useSticky.mjs","sources":["../../../../src/hooks/useSticky/useSticky.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The use sticky return type */\nexport interface UseStickyReturn {\n stuck: boolean;\n}\n\n/** The use sticky axis type */\nexport type UseStickyAxis = 'horizontal' | 'vertical';\n\n/** The use sticky options type */\nexport interface UseStickyOptions {\n axis?: UseStickyAxis;\n root?: HookTarget;\n}\n\nexport interface UseSticky {\n (target: HookTarget, options?: UseStickyOptions): UseStickyReturn;\n\n <Target extends Element>(\n options?: UseStickyOptions,\n target?: never\n ): UseStickyReturn & {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name UseSticky\n * @description - Hook that allows you to detect that your sticky component is stuck\n * @category Elements\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target sticky element\n * @param {UseStickyAxis} [options.axis='vertical'] The axis of motion of the sticky component\n * @param {UseStickyRoot} [options.root=document] The element that contains your sticky component\n * @returns {UseStickyReturn} The state of the sticky\n *\n * @example\n * const { stuck } = useSticky(ref);\n *\n * @overload\n * @param {UseStickyAxis} [options.axis='vertical'] The axis of motion of the sticky component\n * @param {UseStickyRoot} [options.root=document] The element that contains your sticky component\n * @returns {{ ref: StateRef<Target> } & UseStickyReturn} The state of the sticky\n *\n * @example\n * const { stuck, ref } = useSticky();\n */\nexport const useSticky = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = (target ? params[1] : params[0]) as UseStickyOptions;\n const axis = options?.axis ?? 'vertical';\n\n const internalRef = useRefState<Element>();\n const [stuck, setStuck] = useState(false);\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n\n if (!element) return;\n\n const root = (options?.root ? isTarget.getElement(options.root) : document) as Element;\n const elementOffsetTop =\n element.getBoundingClientRect().top + root.scrollTop - root.getBoundingClientRect().top;\n const elementOffsetLeft =\n element.getBoundingClientRect().left + root.scrollLeft - root.getBoundingClientRect().left;\n\n const onSticky = () => {\n if (axis === 'vertical') {\n const scrollTop = root.scrollTop;\n setStuck(scrollTop >= elementOffsetTop);\n }\n\n if (axis === 'horizontal') {\n const scrollLeft = root.scrollLeft;\n setStuck(scrollLeft >= elementOffsetLeft);\n }\n };\n\n root.addEventListener('scroll', onSticky);\n window.addEventListener('resize', onSticky);\n window.addEventListener('orientationchange', onSticky);\n\n onSticky();\n\n return () => {\n root.removeEventListener('scroll', onSticky);\n window.removeEventListener('resize', onSticky);\n window.removeEventListener('orientationchange', onSticky);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state, axis, options?.root]);\n\n if (target) return { stuck };\n return {\n stuck,\n ref: internalRef\n };\n}) as UseSticky;\n"],"names":["useSticky","params","target","isTarget","options","axis","internalRef","useRefState","stuck","setStuck","useState","useEffect","element","root","elementOffsetTop","elementOffsetLeft","onSticky","scrollTop","scrollLeft"],"mappings":";;;AA0DO,MAAMA,KAAa,IAAIC,MAAkB;AAC9C,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAWF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACxCI,IAAOD,GAAS,QAAQ,YAExBE,IAAcC,EAAA,GACd,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAK;AAwCxC,SAtCAC,EAAU,MAAM;AACd,QAAI,CAACT,KAAU,CAACI,EAAY,MAAO;AAEnC,UAAMM,IAAWV,IAASC,EAAS,WAAWD,CAAM,IAAII,EAAY;AAEpE,QAAI,CAACM,EAAS;AAEd,UAAMC,IAAQT,GAAS,OAAOD,EAAS,WAAWC,EAAQ,IAAI,IAAI,UAC5DU,IACJF,EAAQ,wBAAwB,MAAMC,EAAK,YAAYA,EAAK,sBAAA,EAAwB,KAChFE,IACJH,EAAQ,wBAAwB,OAAOC,EAAK,aAAaA,EAAK,sBAAA,EAAwB,MAElFG,IAAW,MAAM;AACrB,UAAIX,MAAS,YAAY;AACvB,cAAMY,IAAYJ,EAAK;AACvB,QAAAJ,EAASQ,KAAaH,CAAgB;AAAA,MAAA;AAGxC,UAAIT,MAAS,cAAc;AACzB,cAAMa,IAAaL,EAAK;AACxB,QAAAJ,EAASS,KAAcH,CAAiB;AAAA,MAAA;AAAA,IAC1C;AAGF,WAAAF,EAAK,iBAAiB,UAAUG,CAAQ,GACxC,OAAO,iBAAiB,UAAUA,CAAQ,GAC1C,OAAO,iBAAiB,qBAAqBA,CAAQ,GAErDA,EAAA,GAEO,MAAM;AACX,MAAAH,EAAK,oBAAoB,UAAUG,CAAQ,GAC3C,OAAO,oBAAoB,UAAUA,CAAQ,GAC7C,OAAO,oBAAoB,qBAAqBA,CAAQ;AAAA,IAAA;AAAA,EAC1D,GACC,CAACd,KAAUC,EAAS,cAAcD,CAAM,GAAGI,EAAY,OAAOD,GAAMD,GAAS,IAAI,CAAC,GAEjFF,IAAe,EAAE,OAAAM,EAAA,IACd;AAAA,IACL,OAAAA;AAAA,IACA,KAAKF;AAAA,EAAA;AAET;"}
|
|
@@ -7,10 +7,7 @@ const i = ({
|
|
|
7
7
|
const r = { behavior: e };
|
|
8
8
|
typeof o == "number" && (r.left = o), typeof n == "number" && (r.top = n), window.scrollTo(r);
|
|
9
9
|
}, w = () => {
|
|
10
|
-
const [o, n] = t({
|
|
11
|
-
x: typeof window < "u" ? window.scrollX : Number.POSITIVE_INFINITY,
|
|
12
|
-
y: typeof window < "u" ? window.scrollY : Number.POSITIVE_INFINITY
|
|
13
|
-
});
|
|
10
|
+
const [o, n] = t(() => typeof window > "u" ? { x: Number.POSITIVE_INFINITY, y: Number.POSITIVE_INFINITY } : { x: window.scrollX, y: window.scrollY });
|
|
14
11
|
return s(() => {
|
|
15
12
|
const e = () => n({ x: window.scrollX, y: window.scrollY });
|
|
16
13
|
return window.addEventListener("scroll", e), window.addEventListener("resize", e), () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useWindowScroll.mjs","sources":["../../../../src/hooks/useWindowScroll/useWindowScroll.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport interface ScrollPosition {\n x: number;\n y: number;\n}\n\nexport const scrollTo = ({\n x,\n y,\n behavior = 'smooth'\n}: Partial<ScrollPosition & ScrollOptions>) => {\n const scrollOptions: ScrollToOptions = { behavior };\n if (typeof x === 'number') scrollOptions.left = x;\n if (typeof y === 'number') scrollOptions.top = y;\n window.scrollTo(scrollOptions);\n};\n\n/**\n * @name useWindowScroll\n * @description - Hook that manages the window scroll position\n * @category Sensors\n * @usage low\n *\n * @returns {UseWindowScrollReturn} An object containing the current window scroll position\n *\n * @example\n * const { value, scrollTo } = useWindowScroll();\n */\nexport const useWindowScroll = () => {\n const [value, setValue] = useState<ScrollPosition>({\n
|
|
1
|
+
{"version":3,"file":"useWindowScroll.mjs","sources":["../../../../src/hooks/useWindowScroll/useWindowScroll.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport interface ScrollPosition {\n x: number;\n y: number;\n}\n\nexport const scrollTo = ({\n x,\n y,\n behavior = 'smooth'\n}: Partial<ScrollPosition & ScrollOptions>) => {\n const scrollOptions: ScrollToOptions = { behavior };\n if (typeof x === 'number') scrollOptions.left = x;\n if (typeof y === 'number') scrollOptions.top = y;\n window.scrollTo(scrollOptions);\n};\n\n/**\n * @name useWindowScroll\n * @description - Hook that manages the window scroll position\n * @category Sensors\n * @usage low\n *\n * @returns {UseWindowScrollReturn} An object containing the current window scroll position\n *\n * @example\n * const { value, scrollTo } = useWindowScroll();\n */\nexport const useWindowScroll = () => {\n const [value, setValue] = useState<ScrollPosition>(() => {\n if (typeof window === 'undefined')\n return { x: Number.POSITIVE_INFINITY, y: Number.POSITIVE_INFINITY };\n return { x: window.scrollX, y: window.scrollY };\n });\n\n useEffect(() => {\n const onChange = () => setValue({ x: window.scrollX, y: window.scrollY });\n window.addEventListener('scroll', onChange);\n window.addEventListener('resize', onChange);\n return () => {\n window.removeEventListener('scroll', onChange);\n window.removeEventListener('resize', onChange);\n };\n }, []);\n\n return { value, scrollTo };\n};\n"],"names":["scrollTo","x","y","behavior","scrollOptions","useWindowScroll","value","setValue","useState","useEffect","onChange"],"mappings":";AAOO,MAAMA,IAAW,CAAC;AAAA,EACvB,GAAAC;AAAA,EACA,GAAAC;AAAA,EACA,UAAAC,IAAW;AACb,MAA+C;AAC7C,QAAMC,IAAiC,EAAE,UAAAD,EAAA;AACzC,EAAI,OAAOF,KAAM,aAAUG,EAAc,OAAOH,IAC5C,OAAOC,KAAM,aAAUE,EAAc,MAAMF,IAC/C,OAAO,SAASE,CAAa;AAC/B,GAaaC,IAAkB,MAAM;AACnC,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAyB,MAC7C,OAAO,SAAW,MACb,EAAE,GAAG,OAAO,mBAAmB,GAAG,OAAO,kBAAA,IAC3C,EAAE,GAAG,OAAO,SAAS,GAAG,OAAO,QAAA,CACvC;AAED,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAW,MAAMH,EAAS,EAAE,GAAG,OAAO,SAAS,GAAG,OAAO,SAAS;AACxE,kBAAO,iBAAiB,UAAUG,CAAQ,GAC1C,OAAO,iBAAiB,UAAUA,CAAQ,GACnC,MAAM;AACX,aAAO,oBAAoB,UAAUA,CAAQ,GAC7C,OAAO,oBAAoB,UAAUA,CAAQ;AAAA,IAAA;AAAA,EAC/C,GACC,EAAE,GAEE,EAAE,OAAAJ,GAAO,UAAAN,EAAA;AAClB;"}
|
package/dist/esm/index.mjs
CHANGED
|
@@ -133,37 +133,38 @@ import { URL_SEARCH_PARAMS_EVENT as Ls, createQueryString as Ms, dispatchUrlSear
|
|
|
133
133
|
import { useUrlSearchParams as Us } from "./hooks/useUrlSearchParams/useUrlSearchParams.mjs";
|
|
134
134
|
import { useWizard as ws } from "./hooks/useWizard/useWizard.mjs";
|
|
135
135
|
import { useInterval as Ws } from "./hooks/useInterval/useInterval.mjs";
|
|
136
|
-
import {
|
|
137
|
-
import {
|
|
138
|
-
import {
|
|
139
|
-
import {
|
|
140
|
-
import {
|
|
141
|
-
import {
|
|
142
|
-
import {
|
|
143
|
-
import {
|
|
144
|
-
import {
|
|
145
|
-
import {
|
|
146
|
-
import {
|
|
147
|
-
import {
|
|
148
|
-
import {
|
|
149
|
-
import {
|
|
150
|
-
import {
|
|
151
|
-
import {
|
|
152
|
-
import {
|
|
153
|
-
import {
|
|
154
|
-
import {
|
|
155
|
-
import {
|
|
156
|
-
import {
|
|
157
|
-
import {
|
|
158
|
-
import {
|
|
159
|
-
import {
|
|
160
|
-
import {
|
|
161
|
-
import {
|
|
162
|
-
import {
|
|
163
|
-
import {
|
|
164
|
-
import {
|
|
165
|
-
import {
|
|
166
|
-
import {
|
|
136
|
+
import { useProgress as Gs } from "./hooks/useProgress/useProgress.mjs";
|
|
137
|
+
import { useStopwatch as Xs } from "./hooks/useStopwatch/useStopwatch.mjs";
|
|
138
|
+
import { useTime as Zs } from "./hooks/useTime/useTime.mjs";
|
|
139
|
+
import { useTimeout as Js } from "./hooks/useTimeout/useTimeout.mjs";
|
|
140
|
+
import { getTimeFromSeconds as $s, useTimer as eu } from "./hooks/useTimer/useTimer.mjs";
|
|
141
|
+
import { useBrowserLanguage as ru } from "./hooks/useBrowserLanguage/useBrowserLanguage.mjs";
|
|
142
|
+
import { getOperatingSystem as su, useOperatingSystem as uu } from "./hooks/useOperatingSystem/useOperatingSystem.mjs";
|
|
143
|
+
import { usePreferredColorScheme as pu } from "./hooks/usePreferredColorScheme/usePreferredColorScheme.mjs";
|
|
144
|
+
import { usePreferredContrast as xu } from "./hooks/usePreferredContrast/usePreferredContrast.mjs";
|
|
145
|
+
import { usePreferredDark as iu } from "./hooks/usePreferredDark/usePreferredDark.mjs";
|
|
146
|
+
import { usePreferredLanguages as cu } from "./hooks/usePreferredLanguages/usePreferredLanguages.mjs";
|
|
147
|
+
import { usePreferredReducedMotion as Su } from "./hooks/usePreferredReducedMotion/usePreferredReducedMotion.mjs";
|
|
148
|
+
import { useBatchedCallback as Tu } from "./hooks/useBatchedCallback/useBatchedCallback.mjs";
|
|
149
|
+
import { useConst as Ru } from "./hooks/useConst/useConst.mjs";
|
|
150
|
+
import { useDebounceCallback as Cu } from "./hooks/useDebounceCallback/useDebounceCallback.mjs";
|
|
151
|
+
import { useDebounceEffect as Au } from "./hooks/useDebounceEffect/useDebounceEffect.mjs";
|
|
152
|
+
import { useDebounceState as yu } from "./hooks/useDebounceState/useDebounceState.mjs";
|
|
153
|
+
import { useDebounceValue as hu } from "./hooks/useDebounceValue/useDebounceValue.mjs";
|
|
154
|
+
import { useEvent as vu } from "./hooks/useEvent/useEvent.mjs";
|
|
155
|
+
import { useLastChanged as bu } from "./hooks/useLastChanged/useLastChanged.mjs";
|
|
156
|
+
import { useLatest as Lu } from "./hooks/useLatest/useLatest.mjs";
|
|
157
|
+
import { usePrevious as Nu } from "./hooks/usePrevious/usePrevious.mjs";
|
|
158
|
+
import { useThrottleCallback as Ku } from "./hooks/useThrottleCallback/useThrottleCallback.mjs";
|
|
159
|
+
import { useThrottleEffect as Uu } from "./hooks/useThrottleEffect/useThrottleEffect.mjs";
|
|
160
|
+
import { useThrottleState as wu } from "./hooks/useThrottleState/useThrottleState.mjs";
|
|
161
|
+
import { useThrottleValue as Wu } from "./hooks/useThrottleValue/useThrottleValue.mjs";
|
|
162
|
+
import { copy as Gu, legacyCopyToClipboard as Qu } from "./utils/helpers/copy.mjs";
|
|
163
|
+
import { debounce as qu } from "./utils/helpers/debounce.mjs";
|
|
164
|
+
import { getDate as ju } from "./utils/helpers/getDate.mjs";
|
|
165
|
+
import { getRetry as Yu } from "./utils/helpers/getRetry.mjs";
|
|
166
|
+
import { getRawElement as em, getRefState as om, isBrowserTarget as rm, isRef as tm, isRefState as sm, isTarget as um, target as mm, targetSymbol as pm } from "./utils/helpers/isTarget.mjs";
|
|
167
|
+
import { throttle as xm } from "./utils/helpers/throttle.mjs";
|
|
167
168
|
export {
|
|
168
169
|
Jo as BREAKPOINTS_ANT_DESIGN,
|
|
169
170
|
Yo as BREAKPOINTS_BOOTSTRAP_V5,
|
|
@@ -184,14 +185,14 @@ export {
|
|
|
184
185
|
Ls as URL_SEARCH_PARAMS_EVENT,
|
|
185
186
|
us as assignRef,
|
|
186
187
|
Ut as clearCookies,
|
|
187
|
-
|
|
188
|
+
Gu as copy,
|
|
188
189
|
r as createContext,
|
|
189
190
|
s as createEventEmitter,
|
|
190
191
|
Ms as createQueryString,
|
|
191
192
|
m as createReactiveContext,
|
|
192
193
|
Ss as createRefState,
|
|
193
194
|
f as createStore,
|
|
194
|
-
|
|
195
|
+
qu as debounce,
|
|
195
196
|
Qo as deepEqual,
|
|
196
197
|
_t as dispatchCookieEvent,
|
|
197
198
|
ks as dispatchStorageEvent,
|
|
@@ -199,22 +200,22 @@ export {
|
|
|
199
200
|
se as getConnection,
|
|
200
201
|
bt as getCookie,
|
|
201
202
|
Dt as getCookies,
|
|
202
|
-
|
|
203
|
+
ju as getDate,
|
|
203
204
|
jt as getHash,
|
|
204
|
-
|
|
205
|
+
su as getOperatingSystem,
|
|
205
206
|
it as getRangesSelection,
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
207
|
+
em as getRawElement,
|
|
208
|
+
om as getRefState,
|
|
209
|
+
Yu as getRetry,
|
|
209
210
|
Ae as getSpeechRecognition,
|
|
210
|
-
|
|
211
|
+
$s as getTimeFromSeconds,
|
|
211
212
|
Bs as getUrlSearchParams,
|
|
212
|
-
|
|
213
|
+
rm as isBrowserTarget,
|
|
213
214
|
dr as isHotkeyMatch,
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
215
|
+
tm as isRef,
|
|
216
|
+
sm as isRefState,
|
|
217
|
+
um as isTarget,
|
|
218
|
+
Qu as legacyCopyToClipboard,
|
|
218
219
|
q as mapGamepadToXbox360Controller,
|
|
219
220
|
ms as mergeRefs,
|
|
220
221
|
Lt as removeCookie,
|
|
@@ -223,35 +224,35 @@ export {
|
|
|
223
224
|
Nt as setCookie,
|
|
224
225
|
Bt as setCookieItem,
|
|
225
226
|
Ps as stateHistoryReducer,
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
227
|
+
mm as target,
|
|
228
|
+
pm as targetSymbol,
|
|
229
|
+
xm as throttle,
|
|
229
230
|
$ as timeRangeToArray,
|
|
230
231
|
ze as useActiveElement,
|
|
231
232
|
a as useAsync,
|
|
232
233
|
Bo as useAsyncEffect,
|
|
233
234
|
d as useAudio,
|
|
234
235
|
Qe as useAutoScroll,
|
|
235
|
-
|
|
236
|
+
Tu as useBatchedCallback,
|
|
236
237
|
P as useBattery,
|
|
237
238
|
I as useBluetooth,
|
|
238
239
|
yt as useBoolean,
|
|
239
240
|
mr as useBreakpoints,
|
|
240
241
|
O as useBroadcastChannel,
|
|
241
|
-
|
|
242
|
+
ru as useBrowserLanguage,
|
|
242
243
|
qe as useClickOutside,
|
|
243
244
|
k as useClipboard,
|
|
244
|
-
|
|
245
|
+
Ru as useConst,
|
|
245
246
|
ht as useControllableState,
|
|
246
247
|
Kt as useCookie,
|
|
247
248
|
Vt as useCookies,
|
|
248
249
|
_ as useCopy,
|
|
249
250
|
Ht as useCounter,
|
|
250
251
|
D as useCssVar,
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
252
|
+
Cu as useDebounceCallback,
|
|
253
|
+
Au as useDebounceEffect,
|
|
254
|
+
yu as useDebounceState,
|
|
255
|
+
hu as useDebounceValue,
|
|
255
256
|
zt as useDefault,
|
|
256
257
|
fr as useDeviceMotion,
|
|
257
258
|
ar as useDeviceOrientation,
|
|
@@ -264,7 +265,7 @@ export {
|
|
|
264
265
|
Er as useDocumentVisibility,
|
|
265
266
|
Je as useDoubleClick,
|
|
266
267
|
$e as useDropZone,
|
|
267
|
-
|
|
268
|
+
vu as useEvent,
|
|
268
269
|
gr as useEventListener,
|
|
269
270
|
F as useEventSource,
|
|
270
271
|
V as useEyeDropper,
|
|
@@ -292,8 +293,8 @@ export {
|
|
|
292
293
|
Lr as useKeyPressEvent,
|
|
293
294
|
vr as useKeyboard,
|
|
294
295
|
Nr as useKeysPressed,
|
|
295
|
-
|
|
296
|
-
|
|
296
|
+
bu as useLastChanged,
|
|
297
|
+
Lu as useLatest,
|
|
297
298
|
Do as useLess,
|
|
298
299
|
$t as useList,
|
|
299
300
|
os as useLocalStorage,
|
|
@@ -315,7 +316,7 @@ export {
|
|
|
315
316
|
xs as useOffsetPagination,
|
|
316
317
|
Mo as useOnce,
|
|
317
318
|
pe as useOnline,
|
|
318
|
-
|
|
319
|
+
uu as useOperatingSystem,
|
|
319
320
|
E as useOptimistic,
|
|
320
321
|
Xr as useOrientation,
|
|
321
322
|
xe as useOtpCredential,
|
|
@@ -327,12 +328,13 @@ export {
|
|
|
327
328
|
ce as usePictureInPicture,
|
|
328
329
|
Se as usePointerLock,
|
|
329
330
|
Te as usePostMessage,
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
331
|
+
pu as usePreferredColorScheme,
|
|
332
|
+
xu as usePreferredContrast,
|
|
333
|
+
iu as usePreferredDark,
|
|
334
|
+
cu as usePreferredLanguages,
|
|
335
|
+
Su as usePreferredReducedMotion,
|
|
336
|
+
Nu as usePrevious,
|
|
337
|
+
Gs as useProgress,
|
|
336
338
|
g as useQuery,
|
|
337
339
|
is as useQueue,
|
|
338
340
|
Re as useRaf,
|
|
@@ -357,18 +359,18 @@ export {
|
|
|
357
359
|
As as useStateHistory,
|
|
358
360
|
ys as useStep,
|
|
359
361
|
Io as useSticky,
|
|
360
|
-
|
|
362
|
+
Xs as useStopwatch,
|
|
361
363
|
vs as useStorage,
|
|
362
364
|
ko as useTextDirection,
|
|
363
365
|
nt as useTextSelection,
|
|
364
366
|
Oo as useTextareaAutosize,
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
367
|
+
Ku as useThrottleCallback,
|
|
368
|
+
Uu as useThrottleEffect,
|
|
369
|
+
wu as useThrottleState,
|
|
370
|
+
Wu as useThrottleValue,
|
|
371
|
+
Zs as useTime,
|
|
372
|
+
Js as useTimeout,
|
|
373
|
+
eu as useTimer,
|
|
372
374
|
bs as useToggle,
|
|
373
375
|
Zo as useUnmount,
|
|
374
376
|
Ks as useUrlSearchParam,
|
package/dist/esm/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|