@siberiacancode/reactuse 0.3.17 → 0.3.19

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.
Files changed (37) hide show
  1. package/dist/cjs/hooks/useAutoScroll/useAutoScroll.cjs +1 -1
  2. package/dist/cjs/hooks/useAutoScroll/useAutoScroll.cjs.map +1 -1
  3. package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs +1 -1
  4. package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs.map +1 -1
  5. package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs +1 -1
  6. package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs.map +1 -1
  7. package/dist/cjs/hooks/useKeyPressEvent/useKeyPressEvent.cjs.map +1 -1
  8. package/dist/cjs/hooks/useKeyboard/useKeyboard.cjs +1 -1
  9. package/dist/cjs/hooks/useKeyboard/useKeyboard.cjs.map +1 -1
  10. package/dist/cjs/hooks/usePermission/usePermission.cjs.map +1 -1
  11. package/dist/cjs/hooks/usePictureInPicture/usePictureInPicture.cjs +1 -1
  12. package/dist/cjs/hooks/usePictureInPicture/usePictureInPicture.cjs.map +1 -1
  13. package/dist/cjs/hooks/useUrlSearchParams/useUrlSearchParams.cjs +1 -1
  14. package/dist/cjs/hooks/useUrlSearchParams/useUrlSearchParams.cjs.map +1 -1
  15. package/dist/esm/hooks/useAutoScroll/useAutoScroll.mjs +1 -1
  16. package/dist/esm/hooks/useAutoScroll/useAutoScroll.mjs.map +1 -1
  17. package/dist/esm/hooks/useClickOutside/useClickOutside.mjs +1 -1
  18. package/dist/esm/hooks/useClickOutside/useClickOutside.mjs.map +1 -1
  19. package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs +1 -1
  20. package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs.map +1 -1
  21. package/dist/esm/hooks/useKeyPressEvent/useKeyPressEvent.mjs.map +1 -1
  22. package/dist/esm/hooks/useKeyboard/useKeyboard.mjs +1 -1
  23. package/dist/esm/hooks/useKeyboard/useKeyboard.mjs.map +1 -1
  24. package/dist/esm/hooks/usePermission/usePermission.mjs.map +1 -1
  25. package/dist/esm/hooks/usePictureInPicture/usePictureInPicture.mjs +1 -1
  26. package/dist/esm/hooks/usePictureInPicture/usePictureInPicture.mjs.map +1 -1
  27. package/dist/esm/hooks/useUrlSearchParams/useUrlSearchParams.mjs +1 -1
  28. package/dist/esm/hooks/useUrlSearchParams/useUrlSearchParams.mjs.map +1 -1
  29. package/dist/types/hooks/useAutoScroll/useAutoScroll.d.ts +3 -5
  30. package/dist/types/hooks/useClickOutside/useClickOutside.d.ts +3 -5
  31. package/dist/types/hooks/useDoubleClick/useDoubleClick.d.ts +3 -5
  32. package/dist/types/hooks/useKeyPressEvent/useKeyPressEvent.d.ts +2 -4
  33. package/dist/types/hooks/useKeyboard/useKeyboard.d.ts +6 -10
  34. package/dist/types/hooks/usePermission/usePermission.d.ts +1 -1
  35. package/dist/types/hooks/usePictureInPicture/usePictureInPicture.d.ts +1 -1
  36. package/dist/types/hooks/useUrlSearchParams/useUrlSearchParams.d.ts +1 -2
  37. package/package.json +1 -1
@@ -1,2 +1,2 @@
1
- require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=r[1]||(typeof r[0]==`object`?r[0]:{}),{enabled:o=!0}=a,s=t.useRefState(),c=(0,n.useRef)(a);if(c.current=a,(0,n.useEffect)(()=>{if(!o||!i&&!s.state)return;let t=i?e.isTarget.getElement(i):s.state;if(!t)return;let n=!0,r=0,a=0,l=()=>{if(c.current.force)return;let{scrollHeight:e,clientHeight:r,scrollTop:i}=t,o=e-r,s=o/2;i<a?n=!1:o-i<=s&&(n=!0),a=i},u=e=>{c.current.force||(e.deltaY<0?n=!1:l())},d=e=>{c.current.force||(r=e.touches[0].clientY)},f=e=>{if(c.current.force)return;let t=e.touches[0].clientY;r-t<0?n=!1:l(),r=t},p=()=>{!n&&!c.current.force||t.scrollTo({top:t.scrollHeight})};t.addEventListener(`wheel`,u),t.addEventListener(`touchstart`,d),t.addEventListener(`touchmove`,f);let m=new MutationObserver(p);return m.observe(t,{childList:!0,subtree:!0,characterData:!0}),()=>{m.disconnect(),t.removeEventListener(`wheel`,u),t.removeEventListener(`touchstart`,d),t.removeEventListener(`touchmove`,f)}},[o,i&&e.isTarget.getRawElement(i),s.state]),!i)return{ref:s}});exports.useAutoScroll=r;
1
+ require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=r[1]||(typeof r[0]==`object`?r[0]:{}),{enabled:o=!0}=a,s=t.useRefState(),c=(0,n.useRef)(a);if(c.current=a,(0,n.useEffect)(()=>{if(!o||!i&&!s.state)return;let t=i?e.isTarget.getElement(i):s.state;if(!t)return;let n=!0,r=0,a=0,l=()=>{if(c.current.force)return;let{scrollHeight:e,clientHeight:r,scrollTop:i}=t,o=e-r,s=o/2;i<a?n=!1:o-i<=s&&(n=!0),a=i},u=e=>{c.current.force||(e.deltaY<0?n=!1:l())},d=e=>{c.current.force||(r=e.touches[0].clientY)},f=e=>{if(c.current.force)return;let t=e.touches[0].clientY;r-t<0?n=!1:l(),r=t},p=()=>{!n&&!c.current.force||t.scrollTo({top:t.scrollHeight})};t.addEventListener(`wheel`,u),t.addEventListener(`touchstart`,d),t.addEventListener(`touchmove`,f);let m=new MutationObserver(p);return m.observe(t,{childList:!0,subtree:!0,characterData:!0}),()=>{m.disconnect(),t.removeEventListener(`wheel`,u),t.removeEventListener(`touchstart`,d),t.removeEventListener(`touchmove`,f)}},[o,i&&e.isTarget.getRawElement(i),s.state]),!i)return s});exports.useAutoScroll=r;
2
2
  //# sourceMappingURL=useAutoScroll.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useAutoScroll.cjs","names":[],"sources":["../../../../src/hooks/useAutoScroll/useAutoScroll.ts"],"sourcesContent":["import { useEffect, useRef } 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 auto scroll options type */\nexport interface UseAutoScrollOptions {\n /** Whether auto-scrolling is enabled */\n enabled?: boolean;\n /** Whether to force auto-scrolling regardless of user interactions */\n force?: boolean;\n}\n\nexport interface UseAutoScroll {\n (target: HookTarget, options?: UseAutoScrollOptions): void;\n\n <Target extends HTMLElement>(\n options?: UseAutoScrollOptions\n ): {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useAutoScroll\n * @description - Hook that automatically scrolls a list element to the bottom\n * @category Elements\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target element to auto-scroll\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {void}\n *\n * @example\n * useAutoScroll(ref);\n *\n * @overload\n * @template Target\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {{ ref: StateRef<Target> }} A React ref to attach to the list element\n *\n * @example\n * const { ref } = useAutoScroll();\n */\nexport const useAutoScroll = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (params[1] ||\n (typeof params[0] === 'object' ? params[0] : {})) as UseAutoScrollOptions;\n const { enabled = true } = options;\n\n const internalRef = useRefState<HTMLElement>();\n const internalOptionsRef = useRef<UseAutoScrollOptions>(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n if (!enabled || (!target && !internalRef.state)) return;\n\n const element = (target ? isTarget.getElement(target) : internalRef.state) as HTMLElement;\n\n if (!element) return;\n\n let shouldAutoScroll = true;\n let touchStartY = 0;\n let lastScrollTop = 0;\n\n const onCheckScrollPosition = () => {\n if (internalOptionsRef.current.force) return;\n\n const { scrollHeight, clientHeight, scrollTop } = element;\n const maxScrollHeight = scrollHeight - clientHeight;\n const scrollThreshold = maxScrollHeight / 2;\n\n if (scrollTop < lastScrollTop) shouldAutoScroll = false;\n else if (maxScrollHeight - scrollTop <= scrollThreshold) shouldAutoScroll = true;\n\n lastScrollTop = scrollTop;\n };\n\n const onWheel = (event: WheelEvent) => {\n if (internalOptionsRef.current.force) return;\n\n if (event.deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n };\n\n const onTouchStart = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n touchStartY = event.touches[0].clientY;\n };\n\n const onTouchMove = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n\n const touchEndY = event.touches[0].clientY;\n const deltaY = touchStartY - touchEndY;\n\n if (deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n\n touchStartY = touchEndY;\n };\n\n const onMutation = () => {\n if (!shouldAutoScroll && !internalOptionsRef.current.force) return;\n element.scrollTo({ top: element.scrollHeight });\n };\n\n element.addEventListener('wheel', onWheel);\n element.addEventListener('touchstart', onTouchStart);\n element.addEventListener('touchmove', onTouchMove);\n\n const observer = new MutationObserver(onMutation);\n\n observer.observe(element, {\n childList: true,\n subtree: true,\n characterData: true\n });\n\n return () => {\n observer.disconnect();\n element.removeEventListener('wheel', onWheel);\n element.removeEventListener('touchstart', onTouchStart);\n element.removeEventListener('touchmove', onTouchMove);\n };\n }, [enabled, target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return { ref: internalRef };\n}) as UseAutoScroll;\n"],"mappings":"uKAkDA,IAAa,IAAkB,GAAG,IAAkB,CAClD,IAAM,EAAS,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC3C,EAAW,EAAO,KACrB,OAAO,EAAO,IAAO,SAAW,EAAO,GAAK,EAAE,EAC3C,CAAE,UAAU,IAAS,EAErB,EAAc,EAAA,aAA0B,CACxC,GAAA,EAAA,EAAA,QAAkD,EAAQ,CAChE,KAAmB,QAAU,GAE7B,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,GAAY,CAAC,GAAU,CAAC,EAAY,MAAQ,OAEjD,IAAM,EAAW,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,MAEpE,GAAI,CAAC,EAAS,OAEd,IAAI,EAAmB,GACnB,EAAc,EACd,EAAgB,EAEd,MAA8B,CAClC,GAAI,EAAmB,QAAQ,MAAO,OAEtC,GAAM,CAAE,eAAc,eAAc,aAAc,EAC5C,EAAkB,EAAe,EACjC,EAAkB,EAAkB,EAEtC,EAAY,EAAe,EAAmB,GACzC,EAAkB,GAAa,IAAiB,EAAmB,IAE5E,EAAgB,GAGZ,EAAW,GAAsB,CACjC,EAAmB,QAAQ,QAE3B,EAAM,OAAS,EAAG,EAAmB,GACpC,GAAuB,GAGxB,EAAgB,GAAsB,CACtC,EAAmB,QAAQ,QAC/B,EAAc,EAAM,QAAQ,GAAG,UAG3B,EAAe,GAAsB,CACzC,GAAI,EAAmB,QAAQ,MAAO,OAEtC,IAAM,EAAY,EAAM,QAAQ,GAAG,QACpB,EAAc,EAEhB,EAAG,EAAmB,GAC9B,GAAuB,CAE5B,EAAc,GAGV,MAAmB,CACnB,CAAC,GAAoB,CAAC,EAAmB,QAAQ,OACrD,EAAQ,SAAS,CAAE,IAAK,EAAQ,aAAc,CAAC,EAGjD,EAAQ,iBAAiB,QAAS,EAAQ,CAC1C,EAAQ,iBAAiB,aAAc,EAAa,CACpD,EAAQ,iBAAiB,YAAa,EAAY,CAElD,IAAM,EAAW,IAAI,iBAAiB,EAAW,CAQjD,OANA,EAAS,QAAQ,EAAS,CACxB,UAAW,GACX,QAAS,GACT,cAAe,GAChB,CAAC,KAEW,CACX,EAAS,YAAY,CACrB,EAAQ,oBAAoB,QAAS,EAAQ,CAC7C,EAAQ,oBAAoB,aAAc,EAAa,CACvD,EAAQ,oBAAoB,YAAa,EAAY,GAEtD,CAAC,EAAS,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAEtE,GACJ,MAAO,CAAE,IAAK,EAAa"}
1
+ {"version":3,"file":"useAutoScroll.cjs","names":[],"sources":["../../../../src/hooks/useAutoScroll/useAutoScroll.ts"],"sourcesContent":["import { useEffect, useRef } 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 auto scroll options type */\nexport interface UseAutoScrollOptions {\n /** Whether auto-scrolling is enabled */\n enabled?: boolean;\n /** Whether to force auto-scrolling regardless of user interactions */\n force?: boolean;\n}\n\nexport interface UseAutoScroll {\n (target: HookTarget, options?: UseAutoScrollOptions): void;\n\n <Target extends HTMLElement>(options?: UseAutoScrollOptions): StateRef<Target>;\n}\n\n/**\n * @name useAutoScroll\n * @description - Hook that automatically scrolls a list element to the bottom\n * @category Elements\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target element to auto-scroll\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {void}\n *\n * @example\n * useAutoScroll(ref);\n *\n * @overload\n * @template Target\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {StateRef<Target>} A React ref to attach to the list element\n *\n * @example\n * const ref = useAutoScroll();\n */\nexport const useAutoScroll = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (params[1] ||\n (typeof params[0] === 'object' ? params[0] : {})) as UseAutoScrollOptions;\n const { enabled = true } = options;\n\n const internalRef = useRefState<HTMLElement>();\n const internalOptionsRef = useRef<UseAutoScrollOptions>(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n if (!enabled || (!target && !internalRef.state)) return;\n\n const element = (target ? isTarget.getElement(target) : internalRef.state) as HTMLElement;\n\n if (!element) return;\n\n let shouldAutoScroll = true;\n let touchStartY = 0;\n let lastScrollTop = 0;\n\n const onCheckScrollPosition = () => {\n if (internalOptionsRef.current.force) return;\n\n const { scrollHeight, clientHeight, scrollTop } = element;\n const maxScrollHeight = scrollHeight - clientHeight;\n const scrollThreshold = maxScrollHeight / 2;\n\n if (scrollTop < lastScrollTop) shouldAutoScroll = false;\n else if (maxScrollHeight - scrollTop <= scrollThreshold) shouldAutoScroll = true;\n\n lastScrollTop = scrollTop;\n };\n\n const onWheel = (event: WheelEvent) => {\n if (internalOptionsRef.current.force) return;\n\n if (event.deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n };\n\n const onTouchStart = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n touchStartY = event.touches[0].clientY;\n };\n\n const onTouchMove = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n\n const touchEndY = event.touches[0].clientY;\n const deltaY = touchStartY - touchEndY;\n\n if (deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n\n touchStartY = touchEndY;\n };\n\n const onMutation = () => {\n if (!shouldAutoScroll && !internalOptionsRef.current.force) return;\n element.scrollTo({ top: element.scrollHeight });\n };\n\n element.addEventListener('wheel', onWheel);\n element.addEventListener('touchstart', onTouchStart);\n element.addEventListener('touchmove', onTouchMove);\n\n const observer = new MutationObserver(onMutation);\n\n observer.observe(element, {\n childList: true,\n subtree: true,\n characterData: true\n });\n\n return () => {\n observer.disconnect();\n element.removeEventListener('wheel', onWheel);\n element.removeEventListener('touchstart', onTouchStart);\n element.removeEventListener('touchmove', onTouchMove);\n };\n }, [enabled, target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return internalRef;\n}) as UseAutoScroll;\n"],"mappings":"uKA8CA,IAAa,IAAkB,GAAG,IAAkB,CAClD,IAAM,EAAS,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC3C,EAAW,EAAO,KACrB,OAAO,EAAO,IAAO,SAAW,EAAO,GAAK,EAAE,EAC3C,CAAE,UAAU,IAAS,EAErB,EAAc,EAAA,aAA0B,CACxC,GAAA,EAAA,EAAA,QAAkD,EAAQ,CAChE,KAAmB,QAAU,GAE7B,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,GAAY,CAAC,GAAU,CAAC,EAAY,MAAQ,OAEjD,IAAM,EAAW,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,MAEpE,GAAI,CAAC,EAAS,OAEd,IAAI,EAAmB,GACnB,EAAc,EACd,EAAgB,EAEd,MAA8B,CAClC,GAAI,EAAmB,QAAQ,MAAO,OAEtC,GAAM,CAAE,eAAc,eAAc,aAAc,EAC5C,EAAkB,EAAe,EACjC,EAAkB,EAAkB,EAEtC,EAAY,EAAe,EAAmB,GACzC,EAAkB,GAAa,IAAiB,EAAmB,IAE5E,EAAgB,GAGZ,EAAW,GAAsB,CACjC,EAAmB,QAAQ,QAE3B,EAAM,OAAS,EAAG,EAAmB,GACpC,GAAuB,GAGxB,EAAgB,GAAsB,CACtC,EAAmB,QAAQ,QAC/B,EAAc,EAAM,QAAQ,GAAG,UAG3B,EAAe,GAAsB,CACzC,GAAI,EAAmB,QAAQ,MAAO,OAEtC,IAAM,EAAY,EAAM,QAAQ,GAAG,QACpB,EAAc,EAEhB,EAAG,EAAmB,GAC9B,GAAuB,CAE5B,EAAc,GAGV,MAAmB,CACnB,CAAC,GAAoB,CAAC,EAAmB,QAAQ,OACrD,EAAQ,SAAS,CAAE,IAAK,EAAQ,aAAc,CAAC,EAGjD,EAAQ,iBAAiB,QAAS,EAAQ,CAC1C,EAAQ,iBAAiB,aAAc,EAAa,CACpD,EAAQ,iBAAiB,YAAa,EAAY,CAElD,IAAM,EAAW,IAAI,iBAAiB,EAAW,CAQjD,OANA,EAAS,QAAQ,EAAS,CACxB,UAAW,GACX,QAAS,GACT,cAAe,GAChB,CAAC,KAEW,CACX,EAAS,YAAY,CACrB,EAAQ,oBAAoB,QAAS,EAAQ,CAC7C,EAAQ,oBAAoB,aAAc,EAAa,CACvD,EAAQ,oBAAoB,YAAa,EAAY,GAEtD,CAAC,EAAS,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAEtE,GACJ,OAAO"}
@@ -1,2 +1,2 @@
1
- require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=r[1]?r[1]:r[0],o=t.useRefState(),s=(0,n.useRef)(a);if(s.current=a,(0,n.useEffect)(()=>{if(!i&&!o.state)return;let t=i?e.isTarget.getElement(i):o.current;if(!t)return;let n=e=>{t.contains(e.target)||s.current(e)};return document.addEventListener(`click`,n),()=>{document.removeEventListener(`click`,n)}},[i&&e.isTarget.getRawElement(i),o.state]),!i)return{ref:o}});exports.useClickOutside=r;
1
+ require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=r[1]?r[1]:r[0],o=t.useRefState(),s=(0,n.useRef)(a);if(s.current=a,(0,n.useEffect)(()=>{if(!i&&!o.state)return;let t=i?e.isTarget.getElement(i):o.current;if(!t)return;let n=e=>{t.contains(e.target)||s.current(e)};return document.addEventListener(`click`,n),()=>{document.removeEventListener(`click`,n)}},[i&&e.isTarget.getRawElement(i),o.state]),!i)return o});exports.useClickOutside=r;
2
2
  //# sourceMappingURL=useClickOutside.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useClickOutside.cjs","names":[],"sources":["../../../../src/hooks/useClickOutside/useClickOutside.ts"],"sourcesContent":["import { useEffect, useRef } 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 interface UseClickOutside {\n (target: HookTarget, callback: (event: Event) => void): void;\n\n <Target extends Element>(\n callback: (event: Event) => void,\n target?: never\n ): {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useClickOutside\n * @description - Hook to handle click events outside the specified target element(s)\n * @category Elements \n * @usage necessary\n\n * @overload\n * @param {HookTarget} target The target element(s) to detect outside clicks for\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {void}\n *\n * @example\n * useClickOutside(ref, () => console.log('click outside'));\n *\n * @overload\n * @template Target The target element(s)\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {{ ref: StateRef<Target> }} A ref to attach to the target element\n *\n * @example\n * const { ref } = useClickOutside<HTMLDivElement>(() => console.log('click outside'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useClickOutside.html}\n */\nexport const useClickOutside = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const callback = (params[1] ? params[1] : params[0]) as (event: Event) => void;\n\n const internalRef = useRefState<Element>();\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\n if (!element) return;\n\n const onClick = (event: Event) => {\n if (!element.contains(event.target as Node)) {\n internalCallbackRef.current(event);\n }\n };\n\n document.addEventListener('click', onClick);\n\n return () => {\n document.removeEventListener('click', onClick);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n if (target) return;\n return { ref: internalRef };\n}) as UseClickOutside;\n"],"mappings":"uKA6CA,IAAa,IAAoB,GAAG,IAAkB,CACpD,IAAM,EAAU,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC5C,EAAY,EAAO,GAAK,EAAO,GAAK,EAAO,GAE3C,EAAc,EAAA,aAAsB,CACpC,GAAA,EAAA,EAAA,QAA6B,EAAS,CAC5C,KAAoB,QAAU,GAE9B,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,GAAU,CAAC,EAAY,MAAO,OAEnC,IAAM,EAAW,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,QAEpE,GAAI,CAAC,EAAS,OAEd,IAAM,EAAW,GAAiB,CAC3B,EAAQ,SAAS,EAAM,OAAe,EACzC,EAAoB,QAAQ,EAAM,EAMtC,OAFA,SAAS,iBAAiB,QAAS,EAAQ,KAE9B,CACX,SAAS,oBAAoB,QAAS,EAAQ,GAE/C,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAC7D,GACJ,MAAO,CAAE,IAAK,EAAa"}
1
+ {"version":3,"file":"useClickOutside.cjs","names":[],"sources":["../../../../src/hooks/useClickOutside/useClickOutside.ts"],"sourcesContent":["import { useEffect, useRef } 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 interface UseClickOutside {\n (target: HookTarget, callback: (event: Event) => void): void;\n\n <Target extends Element>(callback: (event: Event) => void, target?: never): StateRef<Target>;\n}\n\n/**\n * @name useClickOutside\n * @description - Hook to handle click events outside the specified target element(s)\n * @category Elements \n * @usage necessary\n\n * @overload\n * @param {HookTarget} target The target element(s) to detect outside clicks for\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {void}\n *\n * @example\n * useClickOutside(ref, () => console.log('click outside'));\n *\n * @overload\n * @template Target The target element(s)\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useClickOutside<HTMLDivElement>(() => console.log('click outside'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useClickOutside.html}\n */\nexport const useClickOutside = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const callback = (params[1] ? params[1] : params[0]) as (event: Event) => void;\n\n const internalRef = useRefState<Element>();\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\n if (!element) return;\n\n const onClick = (event: Event) => {\n if (!element.contains(event.target as Node)) {\n internalCallbackRef.current(event);\n }\n };\n\n document.addEventListener('click', onClick);\n\n return () => {\n document.removeEventListener('click', onClick);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n if (target) return;\n return internalRef;\n}) as UseClickOutside;\n"],"mappings":"uKAwCA,IAAa,IAAoB,GAAG,IAAkB,CACpD,IAAM,EAAU,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC5C,EAAY,EAAO,GAAK,EAAO,GAAK,EAAO,GAE3C,EAAc,EAAA,aAAsB,CACpC,GAAA,EAAA,EAAA,QAA6B,EAAS,CAC5C,KAAoB,QAAU,GAE9B,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,GAAU,CAAC,EAAY,MAAO,OAEnC,IAAM,EAAW,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,QAEpE,GAAI,CAAC,EAAS,OAEd,IAAM,EAAW,GAAiB,CAC3B,EAAQ,SAAS,EAAM,OAAe,EACzC,EAAoB,QAAQ,EAAM,EAMtC,OAFA,SAAS,iBAAiB,QAAS,EAAQ,KAE9B,CACX,SAAS,oBAAoB,QAAS,EAAQ,GAE/C,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAC7D,GACJ,OAAO"}
@@ -1,2 +1,2 @@
1
- require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=300,i=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=i?r[1]:r[0],o=i?r[2]:r[1],s=(0,n.useRef)(void 0),c=(0,n.useRef)(0),l=t.useRefState(),u=(0,n.useRef)(a);u.current=a;let d=(0,n.useRef)(o);if(d.current=o,(0,n.useEffect)(()=>{if(!i&&!l.state)return;let t=i?e.isTarget.getElement(i):l.current;if(!t)return;let n=e=>{c.current+=1,c.current===1&&(s.current=setTimeout(()=>{d.current?.onSingleClick&&d.current.onSingleClick(e),c.current=0},d.current?.threshold??300)),c.current===2&&(clearTimeout(s.current),u.current(e),c.current=0)};return t.addEventListener(`mousedown`,n),t.addEventListener(`touchstart`,n),()=>{t.removeEventListener(`mousedown`,n),t.removeEventListener(`touchstart`,n),s.current&&clearTimeout(s.current)}},[i&&e.isTarget.getRawElement(i),l.state]),!i)return{ref:l}});exports.DEFAULT_THRESHOLD_TIME=r,exports.useDoubleClick=i;
1
+ require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=300,i=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=i?r[1]:r[0],o=i?r[2]:r[1],s=(0,n.useRef)(void 0),c=(0,n.useRef)(0),l=t.useRefState(),u=(0,n.useRef)(a);u.current=a;let d=(0,n.useRef)(o);if(d.current=o,(0,n.useEffect)(()=>{if(!i&&!l.state)return;let t=i?e.isTarget.getElement(i):l.current;if(!t)return;let n=e=>{c.current+=1,c.current===1&&(s.current=setTimeout(()=>{d.current?.onSingleClick&&d.current.onSingleClick(e),c.current=0},d.current?.threshold??300)),c.current===2&&(clearTimeout(s.current),u.current(e),c.current=0)};return t.addEventListener(`mousedown`,n),t.addEventListener(`touchstart`,n),()=>{t.removeEventListener(`mousedown`,n),t.removeEventListener(`touchstart`,n),s.current&&clearTimeout(s.current)}},[i&&e.isTarget.getRawElement(i),l.state]),!i)return l});exports.DEFAULT_THRESHOLD_TIME=r,exports.useDoubleClick=i;
2
2
  //# sourceMappingURL=useDoubleClick.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useDoubleClick.cjs","names":[],"sources":["../../../../src/hooks/useDoubleClick/useDoubleClick.ts"],"sourcesContent":["import { useEffect, useRef } 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 DoubleClickEvents = MouseEvent | TouchEvent;\n\n/** The use double click options type */\nexport interface UseDoubleClickOptions {\n /** The threshold time in milliseconds between clicks */\n threshold?: number;\n /** The callback function to be invoked on single click */\n onSingleClick?: (event: DoubleClickEvents) => void;\n}\n\nexport interface UseDoubleClick {\n (\n target: HookTarget,\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions\n ): void;\n\n <Target extends Element>(\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions,\n target?: never\n ): { ref: StateRef<Target> };\n}\n\nexport const DEFAULT_THRESHOLD_TIME = 300;\n\n/**\n * @name useDoubleClick\n * @description - Hook that defines the logic when double clicking an element\n * @category Elements\n * @usage medium\n\n * @overload\n * @param {HookTarget} target The target element to be double clicked\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {void} The double clicking state\n *\n * @example\n * useDoubleClick(ref, () => console.log('double clicked'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {{ ref: StateRef<Target> }} The double clicking state\n *\n * @example\n * const { ref } = useDoubleClick(() => console.log('double clicked'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useDoubleClick.html}\n */\nexport const useDoubleClick = ((...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: DoubleClickEvents) => void;\n const options = (target ? params[2] : params[1]) as UseDoubleClickOptions | undefined;\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const clickCountRef = useRef(0);\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 onClick = (event: DoubleClickEvents) => {\n clickCountRef.current += 1;\n\n if (clickCountRef.current === 1) {\n timeoutIdRef.current = setTimeout(() => {\n if (internalOptionsRef.current?.onSingleClick)\n internalOptionsRef.current.onSingleClick(event);\n clickCountRef.current = 0;\n }, internalOptionsRef.current?.threshold ?? DEFAULT_THRESHOLD_TIME);\n }\n\n if (clickCountRef.current === 2) {\n clearTimeout(timeoutIdRef.current);\n internalCallbackRef.current(event);\n clickCountRef.current = 0;\n }\n };\n\n element.addEventListener('mousedown', onClick as EventListener);\n element.addEventListener('touchstart', onClick as EventListener);\n\n return () => {\n element.removeEventListener('mousedown', onClick as EventListener);\n element.removeEventListener('touchstart', onClick as EventListener);\n if (timeoutIdRef.current) clearTimeout(timeoutIdRef.current);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return {\n ref: internalRef\n };\n}) as UseDoubleClick;\n"],"mappings":"uKAkCA,IAAa,EAAyB,IA4BzB,IAAmB,GAAG,IAAuB,CACxD,IAAM,EAAU,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC5C,EAAY,EAAS,EAAO,GAAK,EAAO,GACxC,EAAW,EAAS,EAAO,GAAK,EAAO,GAEvC,GAAA,EAAA,EAAA,QAAqD,IAAA,GAAU,CAC/D,GAAA,EAAA,EAAA,QAAuB,EAAE,CACzB,EAAc,EAAA,aAAsB,CAEpC,GAAA,EAAA,EAAA,QAA6B,EAAS,CAC5C,EAAoB,QAAU,EAC9B,IAAM,GAAA,EAAA,EAAA,QAA4B,EAAQ,CAC1C,KAAmB,QAAU,GAE7B,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,GAAU,CAAC,EAAY,MAAO,OAEnC,IAAM,EAAU,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,QACnE,GAAI,CAAC,EAAS,OAEd,IAAM,EAAW,GAA6B,CAC5C,EAAc,SAAW,EAErB,EAAc,UAAY,IAC5B,EAAa,QAAU,eAAiB,CAClC,EAAmB,SAAS,eAC9B,EAAmB,QAAQ,cAAc,EAAM,CACjD,EAAc,QAAU,GACvB,EAAmB,SAAS,WAAA,IAAoC,EAGjE,EAAc,UAAY,IAC5B,aAAa,EAAa,QAAQ,CAClC,EAAoB,QAAQ,EAAM,CAClC,EAAc,QAAU,IAO5B,OAHA,EAAQ,iBAAiB,YAAa,EAAyB,CAC/D,EAAQ,iBAAiB,aAAc,EAAyB,KAEnD,CACX,EAAQ,oBAAoB,YAAa,EAAyB,CAClE,EAAQ,oBAAoB,aAAc,EAAyB,CAC/D,EAAa,SAAS,aAAa,EAAa,QAAQ,GAE7D,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAE7D,GACJ,MAAO,CACL,IAAK,EACN"}
1
+ {"version":3,"file":"useDoubleClick.cjs","names":[],"sources":["../../../../src/hooks/useDoubleClick/useDoubleClick.ts"],"sourcesContent":["import { useEffect, useRef } 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 DoubleClickEvents = MouseEvent | TouchEvent;\n\n/** The use double click options type */\nexport interface UseDoubleClickOptions {\n /** The threshold time in milliseconds between clicks */\n threshold?: number;\n /** The callback function to be invoked on single click */\n onSingleClick?: (event: DoubleClickEvents) => void;\n}\n\nexport interface UseDoubleClick {\n (\n target: HookTarget,\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions\n ): void;\n\n <Target extends Element>(\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions,\n target?: never\n ): StateRef<Target>;\n}\n\nexport const DEFAULT_THRESHOLD_TIME = 300;\n\n/**\n * @name useDoubleClick\n * @description - Hook that defines the logic when double clicking an element\n * @category Elements\n * @usage medium\n\n * @overload\n * @param {HookTarget} target The target element to be double clicked\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {void} The double clicking state\n *\n * @example\n * useDoubleClick(ref, () => console.log('double clicked'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {StateRef<Target>} The double clicking state\n *\n * @example\n * const ref = useDoubleClick(() => console.log('double clicked'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useDoubleClick.html}\n */\nexport const useDoubleClick = ((...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: DoubleClickEvents) => void;\n const options = (target ? params[2] : params[1]) as UseDoubleClickOptions | undefined;\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const clickCountRef = useRef(0);\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 onClick = (event: DoubleClickEvents) => {\n clickCountRef.current += 1;\n\n if (clickCountRef.current === 1) {\n timeoutIdRef.current = setTimeout(() => {\n if (internalOptionsRef.current?.onSingleClick)\n internalOptionsRef.current.onSingleClick(event);\n clickCountRef.current = 0;\n }, internalOptionsRef.current?.threshold ?? DEFAULT_THRESHOLD_TIME);\n }\n\n if (clickCountRef.current === 2) {\n clearTimeout(timeoutIdRef.current);\n internalCallbackRef.current(event);\n clickCountRef.current = 0;\n }\n };\n\n element.addEventListener('mousedown', onClick as EventListener);\n element.addEventListener('touchstart', onClick as EventListener);\n\n return () => {\n element.removeEventListener('mousedown', onClick as EventListener);\n element.removeEventListener('touchstart', onClick as EventListener);\n if (timeoutIdRef.current) clearTimeout(timeoutIdRef.current);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return internalRef;\n}) as UseDoubleClick;\n"],"mappings":"uKAkCA,IAAa,EAAyB,IA4BzB,IAAmB,GAAG,IAAuB,CACxD,IAAM,EAAU,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC5C,EAAY,EAAS,EAAO,GAAK,EAAO,GACxC,EAAW,EAAS,EAAO,GAAK,EAAO,GAEvC,GAAA,EAAA,EAAA,QAAqD,IAAA,GAAU,CAC/D,GAAA,EAAA,EAAA,QAAuB,EAAE,CACzB,EAAc,EAAA,aAAsB,CAEpC,GAAA,EAAA,EAAA,QAA6B,EAAS,CAC5C,EAAoB,QAAU,EAC9B,IAAM,GAAA,EAAA,EAAA,QAA4B,EAAQ,CAC1C,KAAmB,QAAU,GAE7B,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,GAAU,CAAC,EAAY,MAAO,OAEnC,IAAM,EAAU,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,QACnE,GAAI,CAAC,EAAS,OAEd,IAAM,EAAW,GAA6B,CAC5C,EAAc,SAAW,EAErB,EAAc,UAAY,IAC5B,EAAa,QAAU,eAAiB,CAClC,EAAmB,SAAS,eAC9B,EAAmB,QAAQ,cAAc,EAAM,CACjD,EAAc,QAAU,GACvB,EAAmB,SAAS,WAAA,IAAoC,EAGjE,EAAc,UAAY,IAC5B,aAAa,EAAa,QAAQ,CAClC,EAAoB,QAAQ,EAAM,CAClC,EAAc,QAAU,IAO5B,OAHA,EAAQ,iBAAiB,YAAa,EAAyB,CAC/D,EAAQ,iBAAiB,aAAc,EAAyB,KAEnD,CACX,EAAQ,oBAAoB,YAAa,EAAyB,CAClE,EAAQ,oBAAoB,aAAc,EAAyB,CAC/D,EAAa,SAAS,aAAa,EAAa,QAAQ,GAE7D,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAE7D,GACJ,OAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"useKeyPressEvent.cjs","names":[],"sources":["../../../../src/hooks/useKeyPressEvent/useKeyPressEvent.ts"],"sourcesContent":["import { useEffect, useRef } 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 UseKeyPressEventKey = string | string[];\n\n/** The use key press event options type */\nexport interface UseKeyPressEventOptions {\n /** Whether the event should be captured */\n capture?: boolean;\n /** Whether the event listener should only be triggered once */\n once?: boolean;\n /** Whether the event listener should be passive */\n passive?: boolean;\n}\n\nexport interface UseKeyPressEvent {\n (\n target: HookTarget | Window,\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions\n ): void;\n\n <Target extends Element>(\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions,\n target?: never\n ): { ref: StateRef<Target> };\n}\n\n/**\n * @name useKeyPressEvent\n * @description - Hook that listens for key press events on specified targets\n * @category Sensors\n * @usage low\n *\n * @overload\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {HookTarget | Window} target The target to attach the event listener to.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {void}\n *\n * @example\n * useKeyPressEvent(ref, 'Enter', () => console.log('pressed'));\n *\n * @overload\n * @template Target extends Element\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {{ ref: StateRef<Target> }} An object containing the ref\n *\n * @example\n * const ref = useKeyPressEvent('Enter', (event) => console.log('pressed'));\n */\nexport const useKeyPressEvent = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const key = (target ? params[1] : params[0]) as UseKeyPressEventKey;\n const listener = (target ? params[2] : params[1]) as (event: KeyboardEvent) => void;\n const options = (target ? params[3] : params[2]) as UseKeyPressEventOptions | undefined;\n\n const internalRef = useRefState(window);\n\n const keyRef = useRef(key);\n keyRef.current = key;\n const listenerRef = useRef(listener);\n listenerRef.current = listener;\n\n useEffect(() => {\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 const keys = Array.isArray(keyRef.current) ? keyRef.current : [keyRef.current];\n if (keys.includes(keyboardEvent.key)) {\n listenerRef.current(keyboardEvent);\n }\n };\n\n element.addEventListener('keydown', onKeyDown, {\n capture: options?.capture,\n passive: options?.passive,\n once: options?.once\n });\n\n return () => {\n element.removeEventListener('keydown', onKeyDown, {\n capture: options?.capture\n });\n };\n }, [\n target && isTarget.getRawElement(target),\n internalRef.state,\n options?.capture,\n options?.passive,\n options?.once\n ]);\n\n if (target) return;\n return internalRef;\n}) as UseKeyPressEvent;\n"],"mappings":"uKAiEA,IAAa,IAAqB,GAAG,IAAkB,CACrD,IAAM,EAAS,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC3C,EAAO,EAAS,EAAO,GAAK,EAAO,GACnC,EAAY,EAAS,EAAO,GAAK,EAAO,GACxC,EAAW,EAAS,EAAO,GAAK,EAAO,GAEvC,EAAc,EAAA,YAAY,OAAO,CAEjC,GAAA,EAAA,EAAA,QAAgB,EAAI,CAC1B,EAAO,QAAU,EACjB,IAAM,GAAA,EAAA,EAAA,QAAqB,EAAS,CACpC,KAAY,QAAU,GAEtB,EAAA,EAAA,eAAgB,CACd,IAAM,EAAW,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,QACpE,GAAI,CAAC,EAAS,OAEd,IAAM,EAAa,GAAiB,CAClC,IAAM,EAAgB,GACT,MAAM,QAAQ,EAAO,QAAQ,CAAG,EAAO,QAAU,CAAC,EAAO,QAAQ,EACrE,SAAS,EAAc,IAAI,EAClC,EAAY,QAAQ,EAAc,EAUtC,OANA,EAAQ,iBAAiB,UAAW,EAAW,CAC7C,QAAS,GAAS,QAClB,QAAS,GAAS,QAClB,KAAM,GAAS,KAChB,CAAC,KAEW,CACX,EAAQ,oBAAoB,UAAW,EAAW,CAChD,QAAS,GAAS,QACnB,CAAC,GAEH,CACD,GAAU,EAAA,SAAS,cAAc,EAAO,CACxC,EAAY,MACZ,GAAS,QACT,GAAS,QACT,GAAS,KACV,CAAC,CAEE,GACJ,OAAO"}
1
+ {"version":3,"file":"useKeyPressEvent.cjs","names":[],"sources":["../../../../src/hooks/useKeyPressEvent/useKeyPressEvent.ts"],"sourcesContent":["import { useEffect, useRef } 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 UseKeyPressEventKey = string | string[];\n\n/** The use key press event options type */\nexport interface UseKeyPressEventOptions {\n /** Whether the event should be captured */\n capture?: boolean;\n /** Whether the event listener should only be triggered once */\n once?: boolean;\n /** Whether the event listener should be passive */\n passive?: boolean;\n}\n\nexport interface UseKeyPressEvent {\n (\n target: HookTarget | Window,\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions\n ): void;\n\n <Target extends Element>(\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions,\n target?: never\n ): StateRef<Target>;\n}\n\n/**\n * @name useKeyPressEvent\n * @description - Hook that listens for key press events on specified targets\n * @category Sensors\n * @usage low\n *\n * @overload\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {HookTarget | Window} target The target to attach the event listener to.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {void}\n *\n * @example\n * useKeyPressEvent(ref, 'Enter', () => console.log('pressed'));\n *\n * @overload\n * @template Target extends Element\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useKeyPressEvent('Enter', (event) => console.log('pressed'));\n */\nexport const useKeyPressEvent = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const key = (target ? params[1] : params[0]) as UseKeyPressEventKey;\n const listener = (target ? params[2] : params[1]) as (event: KeyboardEvent) => void;\n const options = (target ? params[3] : params[2]) as UseKeyPressEventOptions | undefined;\n\n const internalRef = useRefState(window);\n\n const keyRef = useRef(key);\n keyRef.current = key;\n const listenerRef = useRef(listener);\n listenerRef.current = listener;\n\n useEffect(() => {\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 const keys = Array.isArray(keyRef.current) ? keyRef.current : [keyRef.current];\n if (keys.includes(keyboardEvent.key)) {\n listenerRef.current(keyboardEvent);\n }\n };\n\n element.addEventListener('keydown', onKeyDown, {\n capture: options?.capture,\n passive: options?.passive,\n once: options?.once\n });\n\n return () => {\n element.removeEventListener('keydown', onKeyDown, {\n capture: options?.capture\n });\n };\n }, [\n target && isTarget.getRawElement(target),\n internalRef.state,\n options?.capture,\n options?.passive,\n options?.once\n ]);\n\n if (target) return;\n return internalRef;\n}) as UseKeyPressEvent;\n"],"mappings":"uKAiEA,IAAa,IAAqB,GAAG,IAAkB,CACrD,IAAM,EAAS,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC3C,EAAO,EAAS,EAAO,GAAK,EAAO,GACnC,EAAY,EAAS,EAAO,GAAK,EAAO,GACxC,EAAW,EAAS,EAAO,GAAK,EAAO,GAEvC,EAAc,EAAA,YAAY,OAAO,CAEjC,GAAA,EAAA,EAAA,QAAgB,EAAI,CAC1B,EAAO,QAAU,EACjB,IAAM,GAAA,EAAA,EAAA,QAAqB,EAAS,CACpC,KAAY,QAAU,GAEtB,EAAA,EAAA,eAAgB,CACd,IAAM,EAAW,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,QACpE,GAAI,CAAC,EAAS,OAEd,IAAM,EAAa,GAAiB,CAClC,IAAM,EAAgB,GACT,MAAM,QAAQ,EAAO,QAAQ,CAAG,EAAO,QAAU,CAAC,EAAO,QAAQ,EACrE,SAAS,EAAc,IAAI,EAClC,EAAY,QAAQ,EAAc,EAUtC,OANA,EAAQ,iBAAiB,UAAW,EAAW,CAC7C,QAAS,GAAS,QAClB,QAAS,GAAS,QAClB,KAAM,GAAS,KAChB,CAAC,KAEW,CACX,EAAQ,oBAAoB,UAAW,EAAW,CAChD,QAAS,GAAS,QACnB,CAAC,GAEH,CACD,GAAU,EAAA,SAAS,cAAc,EAAO,CACxC,EAAY,MACZ,GAAS,QACT,GAAS,QACT,GAAS,KACV,CAAC,CAEE,GACJ,OAAO"}
@@ -1,2 +1,2 @@
1
- require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=i?typeof r[1]==`object`?r[1]:{onKeyDown:r[1]}:typeof r[0]==`object`?r[0]:{onKeyDown:r[0]},o=t.useRefState(),s=(0,n.useRef)(a);if(s.current=a,(0,n.useEffect)(()=>{let t=(i?e.isTarget.getElement(i):o.current)??window,n=e=>s.current?.onKeyDown?.(e),r=e=>s.current?.onKeyUp?.(e);return t.addEventListener(`keydown`,n),t.addEventListener(`keyup`,r),()=>{t.removeEventListener(`keydown`,n),t.removeEventListener(`keyup`,r)}},[i&&e.isTarget.getRawElement(i),o.state]),!i)return{ref:o}});exports.useKeyboard=r;
1
+ require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=e.isTarget(r[0])?r[0]:void 0,a=i?typeof r[1]==`object`?r[1]:{onKeyDown:r[1]}:typeof r[0]==`object`?r[0]:{onKeyDown:r[0]},o=t.useRefState(),s=(0,n.useRef)(a);if(s.current=a,(0,n.useEffect)(()=>{let t=(i?e.isTarget.getElement(i):o.current)??window,n=e=>s.current?.onKeyDown?.(e),r=e=>s.current?.onKeyUp?.(e);return t.addEventListener(`keydown`,n),t.addEventListener(`keyup`,r),()=>{t.removeEventListener(`keydown`,n),t.removeEventListener(`keyup`,r)}},[i&&e.isTarget.getRawElement(i),o.state]),!i)return o});exports.useKeyboard=r;
2
2
  //# sourceMappingURL=useKeyboard.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useKeyboard.cjs","names":[],"sources":["../../../../src/hooks/useKeyboard/useKeyboard.ts"],"sourcesContent":["import { useEffect, useRef } 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 keyboard return type */\nexport type UseKeyboardReturn<Target extends HTMLElement> = StateRef<Target>;\n\n/** The use keyboard event handler type */\nexport type KeyboardEventHandler = (event: KeyboardEvent) => void;\n\n/** The use keyboard event options type */\nexport interface UseKeyboardEventOptions {\n /** The callback function to be invoked on key down */\n onKeyDown?: KeyboardEventHandler;\n /** The callback function to be invoked on key up */\n onKeyUp?: KeyboardEventHandler;\n}\n\nexport interface UseKeyboard {\n (target: HookTarget, callback: KeyboardEventHandler): void;\n\n (target: HookTarget, options: UseKeyboardEventOptions): void;\n\n <Target extends HTMLElement>(\n callback: KeyboardEventHandler,\n target?: never\n ): { ref: StateRef<Target> };\n\n <Target extends HTMLElement>(\n options: UseKeyboardEventOptions,\n target?: never\n ): {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useKeyboard\n * @description - Hook that helps to listen for keyboard events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, (event) => console.log('key down'));\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, { onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n *\n * @overload\n * @template Target The target element type\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {{ ref: StateRef<Target> }} An object containing the ref\n *\n * @example\n * const keyboard = useKeyboard((event) => console.log('key down'));\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {{ ref: StateRef<Target> }} An object containing the ref\n *\n * @example\n * const keyboard = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n */\nexport const useKeyboard = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (\n target\n ? typeof params[1] === 'object'\n ? params[1]\n : { onKeyDown: params[1] }\n : typeof params[0] === 'object'\n ? params[0]\n : { onKeyDown: params[0] }\n ) as UseKeyboardEventOptions;\n\n const internalRef = useRefState<HTMLElement | Window>();\n const internalOptionsRef = useRef(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n const element =\n ((target ? isTarget.getElement(target) : internalRef.current) as HTMLElement) ?? window;\n\n const onKeyDown = (event: Event) =>\n internalOptionsRef.current?.onKeyDown?.(event as KeyboardEvent);\n const onKeyUp = (event: Event) => internalOptionsRef.current?.onKeyUp?.(event as KeyboardEvent);\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;\n return { ref: internalRef };\n}) as UseKeyboard;\n"],"mappings":"uKAgFA,IAAa,IAAgB,GAAG,IAAkB,CAChD,IAAM,EAAS,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC3C,EACJ,EACI,OAAO,EAAO,IAAO,SACnB,EAAO,GACP,CAAE,UAAW,EAAO,GAAI,CAC1B,OAAO,EAAO,IAAO,SACnB,EAAO,GACP,CAAE,UAAW,EAAO,GAAI,CAG1B,EAAc,EAAA,aAAmC,CACjD,GAAA,EAAA,EAAA,QAA4B,EAAQ,CAC1C,KAAmB,QAAU,GAE7B,EAAA,EAAA,eAAgB,CACd,IAAM,GACF,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,UAA4B,OAE7E,EAAa,GACjB,EAAmB,SAAS,YAAY,EAAuB,CAC3D,EAAW,GAAiB,EAAmB,SAAS,UAAU,EAAuB,CAK/F,OAHA,EAAQ,iBAAiB,UAAW,EAAU,CAC9C,EAAQ,iBAAiB,QAAS,EAAQ,KAE7B,CACX,EAAQ,oBAAoB,UAAW,EAAU,CACjD,EAAQ,oBAAoB,QAAS,EAAQ,GAE9C,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAE7D,GACJ,MAAO,CAAE,IAAK,EAAa"}
1
+ {"version":3,"file":"useKeyboard.cjs","names":[],"sources":["../../../../src/hooks/useKeyboard/useKeyboard.ts"],"sourcesContent":["import { useEffect, useRef } 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 keyboard return type */\nexport type UseKeyboardReturn<Target extends HTMLElement> = StateRef<Target>;\n\n/** The use keyboard event handler type */\nexport type KeyboardEventHandler = (event: KeyboardEvent) => void;\n\n/** The use keyboard event options type */\nexport interface UseKeyboardEventOptions {\n /** The callback function to be invoked on key down */\n onKeyDown?: KeyboardEventHandler;\n /** The callback function to be invoked on key up */\n onKeyUp?: KeyboardEventHandler;\n}\n\nexport interface UseKeyboard {\n (target: HookTarget, callback: KeyboardEventHandler): void;\n\n (target: HookTarget, options: UseKeyboardEventOptions): void;\n\n <Target extends HTMLElement>(callback: KeyboardEventHandler, target?: never): StateRef<Target>;\n\n <Target extends HTMLElement>(options: UseKeyboardEventOptions, target?: never): StateRef<Target>;\n}\n\n/**\n * @name useKeyboard\n * @description - Hook that helps to listen for keyboard events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, (event) => console.log('key down'));\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, { onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n *\n * @overload\n * @template Target The target element type\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useKeyboard((event) => console.log('key down'));\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n */\nexport const useKeyboard = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (\n target\n ? typeof params[1] === 'object'\n ? params[1]\n : { onKeyDown: params[1] }\n : typeof params[0] === 'object'\n ? params[0]\n : { onKeyDown: params[0] }\n ) as UseKeyboardEventOptions;\n\n const internalRef = useRefState<HTMLElement | Window>();\n const internalOptionsRef = useRef(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n const element =\n ((target ? isTarget.getElement(target) : internalRef.current) as HTMLElement) ?? window;\n\n const onKeyDown = (event: Event) =>\n internalOptionsRef.current?.onKeyDown?.(event as KeyboardEvent);\n const onKeyUp = (event: Event) => internalOptionsRef.current?.onKeyUp?.(event as KeyboardEvent);\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;\n return internalRef;\n}) as UseKeyboard;\n"],"mappings":"uKAwEA,IAAa,IAAgB,GAAG,IAAkB,CAChD,IAAM,EAAS,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC3C,EACJ,EACI,OAAO,EAAO,IAAO,SACnB,EAAO,GACP,CAAE,UAAW,EAAO,GAAI,CAC1B,OAAO,EAAO,IAAO,SACnB,EAAO,GACP,CAAE,UAAW,EAAO,GAAI,CAG1B,EAAc,EAAA,aAAmC,CACjD,GAAA,EAAA,EAAA,QAA4B,EAAQ,CAC1C,KAAmB,QAAU,GAE7B,EAAA,EAAA,eAAgB,CACd,IAAM,GACF,EAAS,EAAA,SAAS,WAAW,EAAO,CAAG,EAAY,UAA4B,OAE7E,EAAa,GACjB,EAAmB,SAAS,YAAY,EAAuB,CAC3D,EAAW,GAAiB,EAAmB,SAAS,UAAU,EAAuB,CAK/F,OAHA,EAAQ,iBAAiB,UAAW,EAAU,CAC9C,EAAQ,iBAAiB,QAAS,EAAQ,KAE7B,CACX,EAAQ,oBAAoB,UAAW,EAAU,CACjD,EAAQ,oBAAoB,QAAS,EAAQ,GAE9C,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAE7D,GACJ,OAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"usePermission.cjs","names":[],"sources":["../../../../src/hooks/usePermission/usePermission.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useEvent } from '../useEvent/useEvent';\n\n/** The permission name */\nexport type UsePermissionName =\n | 'accelerometer'\n | 'accessibility-events'\n | 'ambient-light-sensor'\n | 'background-sync'\n | 'camera'\n | 'clipboard-read'\n | 'clipboard-write'\n | 'gyroscope'\n | 'magnetometer'\n | 'microphone'\n | 'notifications'\n | 'payment-handler'\n | 'persistent-storage'\n | 'push'\n | 'speaker'\n | PermissionName;\n\n/** The use permission options type */\nexport interface UsePermissionOptions {\n /** Whether the permission is enabled */\n enabled: boolean;\n}\n\n/** The use permission return type */\nexport interface UsePermissionReturn {\n /** The permission state */\n state: PermissionState;\n /** The permission supported status */\n supported: boolean;\n /** The permission query function */\n query: () => Promise<PermissionState>;\n}\n\n/**\n * @name usePermission\n * @description - Hook that gives you the state of permission\n * @category Browser\n * @usage medium\n *\n * @browserapi navigator.permissions https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions\n *\n * @param {UsePermissionName} permissionDescriptorName - The permission name\n * @param {boolean} [options.enabled=true] - Whether the permission is enabled\n * @returns {UsePermissionReturn} An object containing the state and the supported status\n *\n * @example\n * const { state, supported, query } = usePermission('microphone');\n */\nexport const usePermission = (\n permissionDescriptorName: UsePermissionName,\n options?: UsePermissionOptions\n) => {\n const supported =\n typeof navigator !== 'undefined' && 'permissions' in navigator && !!navigator.permissions;\n const [state, setState] = useState<PermissionState>('prompt');\n const enabled = options?.enabled ?? true;\n\n const permissionDescriptor = { name: permissionDescriptorName };\n\n const query = useEvent(async () => {\n try {\n const permissionStatus = await navigator.permissions.query(\n permissionDescriptor as PermissionDescriptor\n );\n setState(permissionStatus.state);\n return permissionStatus.state;\n } catch {\n setState('prompt');\n return 'prompt';\n }\n });\n\n useEffect(() => {\n if (!supported || !enabled) return;\n query();\n window.addEventListener('change', query);\n return () => {\n window.removeEventListener('change', query);\n };\n }, [permissionDescriptorName, enabled]);\n\n return {\n state,\n supported,\n query\n };\n};\n"],"mappings":"mHAsDA,IAAa,GACX,EACA,IACG,CACH,IAAM,EACJ,OAAO,UAAc,KAAe,gBAAiB,WAAa,CAAC,CAAC,UAAU,YAC1E,CAAC,EAAO,IAAA,EAAA,EAAA,UAAsC,SAAS,CACvD,EAAU,GAAS,SAAW,GAE9B,EAAuB,CAAE,KAAM,EAA0B,CAEzD,EAAQ,EAAA,SAAS,SAAY,CACjC,GAAI,CACF,IAAM,EAAmB,MAAM,UAAU,YAAY,MACnD,EACD,CAED,OADA,EAAS,EAAiB,MAAM,CACzB,EAAiB,WAClB,CAEN,OADA,EAAS,SAAS,CACX,WAET,CAWF,OATA,EAAA,EAAA,eAAgB,CACV,MAAC,GAAa,CAAC,GAGnB,OAFA,GAAO,CACP,OAAO,iBAAiB,SAAU,EAAM,KAC3B,CACX,OAAO,oBAAoB,SAAU,EAAM,GAE5C,CAAC,EAA0B,EAAQ,CAAC,CAEhC,CACL,QACA,YACA,QACD"}
1
+ {"version":3,"file":"usePermission.cjs","names":[],"sources":["../../../../src/hooks/usePermission/usePermission.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useEvent } from '../useEvent/useEvent';\n\n/** The permission name */\nexport type UsePermissionName =\n | 'accelerometer'\n | 'accessibility-events'\n | 'ambient-light-sensor'\n | 'background-sync'\n | 'camera'\n | 'clipboard-read'\n | 'clipboard-write'\n | 'gyroscope'\n | 'magnetometer'\n | 'microphone'\n | 'notifications'\n | 'payment-handler'\n | 'persistent-storage'\n | 'push'\n | 'speaker'\n | PermissionName;\n\n/** The use permission options type */\nexport interface UsePermissionOptions {\n /** Whether the permission is enabled */\n enabled: boolean;\n}\n\n/** The use permission return type */\nexport interface UsePermissionReturn {\n /** The permission state */\n state: PermissionState;\n /** The permission supported status */\n supported: boolean;\n /** The permission query function */\n query: () => Promise<PermissionState>;\n}\n\n/**\n * @name usePermission\n * @description - Hook that gives you the state of permission\n * @category Browser\n * @usage medium\n *\n * @browserapi navigator.permissions https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions\n *\n * @param {UsePermissionName} permissionDescriptorName - The permission name\n * @param {boolean} [options.enabled=true] - Whether the permission is enabled\n * @returns {UsePermissionReturn} An object containing the state and the supported status\n *\n * @example\n * const { state, supported, query } = usePermission('microphone');\n */\nexport const usePermission = (name: UsePermissionName, options?: UsePermissionOptions) => {\n const supported =\n typeof navigator !== 'undefined' && 'permissions' in navigator && !!navigator.permissions;\n const [state, setState] = useState<PermissionState>('prompt');\n const enabled = options?.enabled ?? true;\n\n const permissionDescriptor = { name };\n\n const query = useEvent(async () => {\n try {\n const permissionStatus = await navigator.permissions.query(\n permissionDescriptor as PermissionDescriptor\n );\n setState(permissionStatus.state);\n return permissionStatus.state;\n } catch {\n setState('prompt');\n return 'prompt';\n }\n });\n\n useEffect(() => {\n if (!supported || !enabled) return;\n query();\n window.addEventListener('change', query);\n return () => {\n window.removeEventListener('change', query);\n };\n }, [name, enabled]);\n\n return {\n state,\n supported,\n query\n };\n};\n"],"mappings":"mHAsDA,IAAa,GAAiB,EAAyB,IAAmC,CACxF,IAAM,EACJ,OAAO,UAAc,KAAe,gBAAiB,WAAa,CAAC,CAAC,UAAU,YAC1E,CAAC,EAAO,IAAA,EAAA,EAAA,UAAsC,SAAS,CACvD,EAAU,GAAS,SAAW,GAE9B,EAAuB,CAAE,OAAM,CAE/B,EAAQ,EAAA,SAAS,SAAY,CACjC,GAAI,CACF,IAAM,EAAmB,MAAM,UAAU,YAAY,MACnD,EACD,CAED,OADA,EAAS,EAAiB,MAAM,CACzB,EAAiB,WAClB,CAEN,OADA,EAAS,SAAS,CACX,WAET,CAWF,OATA,EAAA,EAAA,eAAgB,CACV,MAAC,GAAa,CAAC,GAGnB,OAFA,GAAO,CACP,OAAO,iBAAiB,SAAU,EAAM,KAC3B,CACX,OAAO,oBAAoB,SAAU,EAAM,GAE5C,CAAC,EAAM,EAAQ,CAAC,CAEZ,CACL,QACA,YACA,QACD"}
@@ -1,2 +1,2 @@
1
- require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=typeof document<`u`&&`pictureInPictureEnabled`in document&&!!document.pictureInPictureEnabled,a=e.isTarget(r[0])?r[0]:void 0,o=(a?r[1]:r[0])??{},[s,c]=(0,n.useState)(!1),l=t.useRefState(),u=(0,n.useRef)(null),d=(0,n.useRef)(o);d.current=o;let f=async()=>{i&&u.current&&(await u.current.requestPictureInPicture(),c(!0),o.onEnter?.())},p=async()=>{i&&(await document.exitPictureInPicture(),c(!1),o.onExit?.())};(0,n.useEffect)(()=>{let t=a?e.isTarget.getElement(a):l.current;if(!t)return;u.current=t;let n=()=>{c(!0),d.current.onEnter?.()},r=()=>{c(!1),d.current.onExit?.()};return t.addEventListener(`enterpictureinpicture`,n),t.addEventListener(`leavepictureinpicture`,r),()=>{t.removeEventListener(`enterpictureinpicture`,n),t.removeEventListener(`leavepictureinpicture`,r)}},[a&&e.isTarget.getRawElement(a),l.state]);let m={open:s,supported:i,enter:f,exit:p,toggle:async()=>{s?await p():await f()}};return a?m:{...m,ref:l}});exports.usePictureInPicture=r;
1
+ require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../utils/helpers/isTarget.cjs`),t=require(`../useRefState/useRefState.cjs`);let n=require(`react`);var r=((...r)=>{let i=typeof document<`u`&&`pictureInPictureEnabled`in document&&!!document.pictureInPictureEnabled,a=e.isTarget(r[0])?r[0]:void 0,o=(a?r[1]:r[0])??{},[s,c]=(0,n.useState)(!1),l=t.useRefState(),u=(0,n.useRef)(null),d=(0,n.useRef)(o);d.current=o;let f=async()=>{i&&u.current&&(await u.current.requestPictureInPicture(),c(!0),o.onEnter?.())},p=async()=>{i&&(await document.exitPictureInPicture(),c(!1),o.onExit?.())};(0,n.useEffect)(()=>{let t=a?e.isTarget.getElement(a):l.current;if(!t)return;u.current=t;let n=()=>{c(!0),d.current.onEnter?.()},r=()=>{c(!1),d.current.onExit?.()};return t.addEventListener(`enterpictureinpicture`,n),t.addEventListener(`leavepictureinpicture`,r),()=>{t.removeEventListener(`enterpictureinpicture`,n),t.removeEventListener(`leavepictureinpicture`,r)}},[a&&e.isTarget.getRawElement(a),l.state]);let m={opened:s,supported:i,enter:f,exit:p,toggle:async()=>{s?await p():await f()}};return a?m:{...m,ref:l}});exports.usePictureInPicture=r;
2
2
  //# sourceMappingURL=usePictureInPicture.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"usePictureInPicture.cjs","names":[],"sources":["../../../../src/hooks/usePictureInPicture/usePictureInPicture.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 use picture in picture options type */\nexport interface UsePictureInPictureOptions {\n /** The callback when Picture-in-Picture mode is entered */\n onEnter?: () => void;\n /** The callback when Picture-in-Picture mode is exited */\n onExit?: () => void;\n}\n\n/** The use picture in picture return type */\nexport interface UsePictureInPictureReturn {\n /** Whether Picture-in-Picture mode is currently active */\n open: boolean;\n /** Whether Picture-in-Picture mode is supported by the browser */\n supported: boolean;\n /** Request to enter Picture-in-Picture mode */\n enter: () => Promise<void>;\n /** Request to exit Picture-in-Picture mode */\n exit: () => Promise<void>;\n /** Toggle Picture-in-Picture mode */\n toggle: () => Promise<void>;\n}\n\nexport interface UsePictureInPicture {\n (target: HookTarget, options?: UsePictureInPictureOptions): UsePictureInPictureReturn;\n\n (options?: UsePictureInPictureOptions): UsePictureInPictureReturn & {\n ref: StateRef<HTMLVideoElement>;\n };\n}\n\n/**\n * @name usePictureInPicture\n * @description - Hook that provides Picture-in-Picture functionality for video elements\n * @category Browser\n * @usage low\n *\n * @browserapi window.PictureInPicture https://developer.mozilla.org/en-US/docs/Web/API/Picture-in-Picture_API\n *\n * @overload\n * @param {HookTarget} target The target video element\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn} An object containing Picture-in-Picture state and controls\n *\n * @example\n * const { open, supported, enter, exit, toggle } = usePictureInPicture(videoRef);\n *\n * @overload\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn & { ref: StateRef<HTMLVideoElement> }} An object containing Picture-in-Picture state, controls and ref\n *\n * @example\n * const { ref, open, supported, enter, exit, toggle } = usePictureInPicture();\n */\nexport const usePictureInPicture = ((...params: any[]) => {\n const supported =\n typeof document !== 'undefined' &&\n 'pictureInPictureEnabled' in document &&\n !!document.pictureInPictureEnabled;\n\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = ((target ? params[1] : params[0]) as UsePictureInPictureOptions) ?? {};\n\n const [open, setOpen] = useState(false);\n\n const internalRef = useRefState<HTMLVideoElement>();\n const elementRef = useRef<HTMLVideoElement>(null);\n const onOptionsRef = useRef<UsePictureInPictureOptions>(options);\n onOptionsRef.current = options;\n\n const enter = async () => {\n if (!supported) return;\n\n if (!elementRef.current) return;\n\n await elementRef.current.requestPictureInPicture();\n setOpen(true);\n\n options.onEnter?.();\n };\n\n const exit = async () => {\n if (!supported) return;\n\n await document.exitPictureInPicture();\n setOpen(false);\n options.onExit?.();\n };\n\n useEffect(() => {\n const element = target\n ? (isTarget.getElement(target) as HTMLVideoElement)\n : internalRef.current;\n if (!element) return;\n\n elementRef.current = element;\n\n const onEnterPictureInPicture = () => {\n setOpen(true);\n onOptionsRef.current.onEnter?.();\n };\n\n const onLeavePictureInPicture = () => {\n setOpen(false);\n onOptionsRef.current.onExit?.();\n };\n\n element.addEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.addEventListener('leavepictureinpicture', onLeavePictureInPicture);\n\n return () => {\n element.removeEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.removeEventListener('leavepictureinpicture', onLeavePictureInPicture);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n const toggle = async () => {\n if (open) await exit();\n else await enter();\n };\n\n const value = {\n open,\n supported,\n enter,\n exit,\n toggle\n };\n\n if (target) return value;\n return { ...value, ref: internalRef };\n}) as UsePictureInPicture;\n"],"mappings":"uKAiEA,IAAa,IAAwB,GAAG,IAAkB,CACxD,IAAM,EACJ,OAAO,SAAa,KACpB,4BAA6B,UAC7B,CAAC,CAAC,SAAS,wBAEP,EAAU,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC5C,GAAY,EAAS,EAAO,GAAK,EAAO,KAAsC,EAAE,CAEhF,CAAC,EAAM,IAAA,EAAA,EAAA,UAAoB,GAAM,CAEjC,EAAc,EAAA,aAA+B,CAC7C,GAAA,EAAA,EAAA,QAAsC,KAAK,CAC3C,GAAA,EAAA,EAAA,QAAkD,EAAQ,CAChE,EAAa,QAAU,EAEvB,IAAM,EAAQ,SAAY,CACnB,GAEA,EAAW,UAEhB,MAAM,EAAW,QAAQ,yBAAyB,CAClD,EAAQ,GAAK,CAEb,EAAQ,WAAW,GAGf,EAAO,SAAY,CAClB,IAEL,MAAM,SAAS,sBAAsB,CACrC,EAAQ,GAAM,CACd,EAAQ,UAAU,IAGpB,EAAA,EAAA,eAAgB,CACd,IAAM,EAAU,EACX,EAAA,SAAS,WAAW,EAAO,CAC5B,EAAY,QAChB,GAAI,CAAC,EAAS,OAEd,EAAW,QAAU,EAErB,IAAM,MAAgC,CACpC,EAAQ,GAAK,CACb,EAAa,QAAQ,WAAW,EAG5B,MAAgC,CACpC,EAAQ,GAAM,CACd,EAAa,QAAQ,UAAU,EAMjC,OAHA,EAAQ,iBAAiB,wBAAyB,EAAwB,CAC1E,EAAQ,iBAAiB,wBAAyB,EAAwB,KAE7D,CACX,EAAQ,oBAAoB,wBAAyB,EAAwB,CAC7E,EAAQ,oBAAoB,wBAAyB,EAAwB,GAE9E,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAOjE,IAAM,EAAQ,CACZ,OACA,YACA,QACA,OACA,OAVa,SAAY,CACrB,EAAM,MAAM,GAAM,CACjB,MAAM,GAAO,EASnB,CAGD,OADI,EAAe,EACZ,CAAE,GAAG,EAAO,IAAK,EAAa"}
1
+ {"version":3,"file":"usePictureInPicture.cjs","names":[],"sources":["../../../../src/hooks/usePictureInPicture/usePictureInPicture.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 use picture in picture options type */\nexport interface UsePictureInPictureOptions {\n /** The callback when Picture-in-Picture mode is entered */\n onEnter?: () => void;\n /** The callback when Picture-in-Picture mode is exited */\n onExit?: () => void;\n}\n\n/** The use picture in picture return type */\nexport interface UsePictureInPictureReturn {\n /** Whether Picture-in-Picture mode is currently active */\n opened: boolean;\n /** Whether Picture-in-Picture mode is supported by the browser */\n supported: boolean;\n /** Request to enter Picture-in-Picture mode */\n enter: () => Promise<void>;\n /** Request to exit Picture-in-Picture mode */\n exit: () => Promise<void>;\n /** Toggle Picture-in-Picture mode */\n toggle: () => Promise<void>;\n}\n\nexport interface UsePictureInPicture {\n (target: HookTarget, options?: UsePictureInPictureOptions): UsePictureInPictureReturn;\n\n (options?: UsePictureInPictureOptions): UsePictureInPictureReturn & {\n ref: StateRef<HTMLVideoElement>;\n };\n}\n\n/**\n * @name usePictureInPicture\n * @description - Hook that provides Picture-in-Picture functionality for video elements\n * @category Browser\n * @usage low\n *\n * @browserapi window.PictureInPicture https://developer.mozilla.org/en-US/docs/Web/API/Picture-in-Picture_API\n *\n * @overload\n * @param {HookTarget} target The target video element\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn} An object containing Picture-in-Picture state and controls\n *\n * @example\n * const { open, supported, enter, exit, toggle } = usePictureInPicture(videoRef);\n *\n * @overload\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn & { ref: StateRef<HTMLVideoElement> }} An object containing Picture-in-Picture state, controls and ref\n *\n * @example\n * const { ref, open, supported, enter, exit, toggle } = usePictureInPicture();\n */\nexport const usePictureInPicture = ((...params: any[]) => {\n const supported =\n typeof document !== 'undefined' &&\n 'pictureInPictureEnabled' in document &&\n !!document.pictureInPictureEnabled;\n\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = ((target ? params[1] : params[0]) as UsePictureInPictureOptions) ?? {};\n\n const [opened, setOpened] = useState(false);\n\n const internalRef = useRefState<HTMLVideoElement>();\n const elementRef = useRef<HTMLVideoElement>(null);\n const onOptionsRef = useRef<UsePictureInPictureOptions>(options);\n onOptionsRef.current = options;\n\n const enter = async () => {\n if (!supported) return;\n\n if (!elementRef.current) return;\n\n await elementRef.current.requestPictureInPicture();\n setOpened(true);\n\n options.onEnter?.();\n };\n\n const exit = async () => {\n if (!supported) return;\n\n await document.exitPictureInPicture();\n setOpened(false);\n options.onExit?.();\n };\n\n useEffect(() => {\n const element = target\n ? (isTarget.getElement(target) as HTMLVideoElement)\n : internalRef.current;\n if (!element) return;\n\n elementRef.current = element;\n\n const onEnterPictureInPicture = () => {\n setOpened(true);\n onOptionsRef.current.onEnter?.();\n };\n\n const onLeavePictureInPicture = () => {\n setOpened(false);\n onOptionsRef.current.onExit?.();\n };\n\n element.addEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.addEventListener('leavepictureinpicture', onLeavePictureInPicture);\n\n return () => {\n element.removeEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.removeEventListener('leavepictureinpicture', onLeavePictureInPicture);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n const toggle = async () => {\n if (opened) await exit();\n else await enter();\n };\n\n const value = {\n opened,\n supported,\n enter,\n exit,\n toggle\n };\n\n if (target) return value;\n return { ...value, ref: internalRef };\n}) as UsePictureInPicture;\n"],"mappings":"uKAiEA,IAAa,IAAwB,GAAG,IAAkB,CACxD,IAAM,EACJ,OAAO,SAAa,KACpB,4BAA6B,UAC7B,CAAC,CAAC,SAAS,wBAEP,EAAU,EAAA,SAAS,EAAO,GAAG,CAAG,EAAO,GAAK,IAAA,GAC5C,GAAY,EAAS,EAAO,GAAK,EAAO,KAAsC,EAAE,CAEhF,CAAC,EAAQ,IAAA,EAAA,EAAA,UAAsB,GAAM,CAErC,EAAc,EAAA,aAA+B,CAC7C,GAAA,EAAA,EAAA,QAAsC,KAAK,CAC3C,GAAA,EAAA,EAAA,QAAkD,EAAQ,CAChE,EAAa,QAAU,EAEvB,IAAM,EAAQ,SAAY,CACnB,GAEA,EAAW,UAEhB,MAAM,EAAW,QAAQ,yBAAyB,CAClD,EAAU,GAAK,CAEf,EAAQ,WAAW,GAGf,EAAO,SAAY,CAClB,IAEL,MAAM,SAAS,sBAAsB,CACrC,EAAU,GAAM,CAChB,EAAQ,UAAU,IAGpB,EAAA,EAAA,eAAgB,CACd,IAAM,EAAU,EACX,EAAA,SAAS,WAAW,EAAO,CAC5B,EAAY,QAChB,GAAI,CAAC,EAAS,OAEd,EAAW,QAAU,EAErB,IAAM,MAAgC,CACpC,EAAU,GAAK,CACf,EAAa,QAAQ,WAAW,EAG5B,MAAgC,CACpC,EAAU,GAAM,CAChB,EAAa,QAAQ,UAAU,EAMjC,OAHA,EAAQ,iBAAiB,wBAAyB,EAAwB,CAC1E,EAAQ,iBAAiB,wBAAyB,EAAwB,KAE7D,CACX,EAAQ,oBAAoB,wBAAyB,EAAwB,CAC7E,EAAQ,oBAAoB,wBAAyB,EAAwB,GAE9E,CAAC,GAAU,EAAA,SAAS,cAAc,EAAO,CAAE,EAAY,MAAM,CAAC,CAOjE,IAAM,EAAQ,CACZ,SACA,YACA,QACA,OACA,OAVa,SAAY,CACrB,EAAQ,MAAM,GAAM,CACnB,MAAM,GAAO,EASnB,CAGD,OADI,EAAe,EACZ,CAAE,GAAG,EAAO,IAAK,EAAa"}
@@ -1,2 +1,2 @@
1
- require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../useUrlSearchParam/useUrlSearchParam.cjs`);let t=require(`react`);var n=(n=>{let r=typeof n==`object`&&n&&(`serializer`in n||`deserializer`in n||`initialValue`in n||`mode`in n||`write`in n)?n:void 0,i=r?r?.initialValue:n,{mode:a=`history`,write:o=`replace`}=r??{},s=e=>r?.serializer?r.serializer(e):typeof e==`string`?e:JSON.stringify(e),c=e=>{if(r?.deserializer)return r.deserializer(e);if(e!==`undefined`)try{return JSON.parse(e)}catch{return e}},l=(t,n,r=`replace`)=>{let i=e.getUrlSearchParams(t);Object.entries(n).forEach(([e,t])=>{if(t===void 0)i.delete(e);else{let n=s?s(t):String(t);i.set(e,n)}});let a=e.createQueryString(i,t);return r===`replace`&&window.history.replaceState({},``,a),r===`push`&&window.history.pushState({},``,a),e.dispatchUrlSearchParamsEvent(),i},u=e=>typeof e==`string`?u(new URLSearchParams(e)):e instanceof URLSearchParams?Array.from(e.entries()).reduce((e,[t,n])=>(e[t]=c(n),e),{}):e,[d,f]=(0,t.useState)(()=>{if(typeof window>`u`)return i??{};let t=e.getUrlSearchParams(a),n={...i&&u(i),...u(t)};return l(a,n,o),n});return(0,t.useEffect)(()=>{let t=()=>{f(u(e.getUrlSearchParams(a)))};return window.addEventListener(e.URL_SEARCH_PARAMS_EVENT,t),window.addEventListener(`popstate`,t),a!==`history`&&window.addEventListener(`hashchange`,t),()=>{window.removeEventListener(e.URL_SEARCH_PARAMS_EVENT,t),window.removeEventListener(`popstate`,t),a!==`history`&&window.removeEventListener(`hashchange`,t)}},[a]),{value:d,set:(e,t)=>{f(u(l(a,{...d,...e},t?.write??o)))}}});exports.useUrlSearchParams=n;
1
+ require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../useUrlSearchParam/useUrlSearchParam.cjs`);let t=require(`react`);var n=(n=>{let r=typeof n==`object`&&n&&(`serializer`in n||`deserializer`in n||`initialValue`in n||`mode`in n||`write`in n)?n:void 0,i=r?r?.initialValue:n,{mode:a=`history`,write:o=`replace`}=r??{},s=e=>r?.serializer?r.serializer(e):typeof e==`string`?e:JSON.stringify(e),c=e=>{if(r?.deserializer)return r.deserializer(e);if(e!==`undefined`)try{return JSON.parse(e)}catch{return e}},l=(t,n,r=`replace`)=>{let i=e.getUrlSearchParams(t);Object.entries(n).forEach(([e,t])=>{if(t===void 0)i.delete(e);else{let n=s?s(t):String(t);i.set(e,n)}});let a=e.createQueryString(i,t);return r===`replace`&&window.history.replaceState({},``,a),r===`push`&&window.history.pushState({},``,a),e.dispatchUrlSearchParamsEvent(),i},u=e=>typeof e==`string`?u(new URLSearchParams(e)):e instanceof URLSearchParams?[...e.entries()].reduce((e,[t,n])=>(e[t]=c(n),e),{}):e,[d,f]=(0,t.useState)(()=>{if(typeof window>`u`)return i??{};let t=e.getUrlSearchParams(a),n={...i&&u(i),...u(t)};return l(a,n,o),n});return(0,t.useEffect)(()=>{let t=()=>{f(u(e.getUrlSearchParams(a)))};return window.addEventListener(e.URL_SEARCH_PARAMS_EVENT,t),window.addEventListener(`popstate`,t),a!==`history`&&window.addEventListener(`hashchange`,t),()=>{window.removeEventListener(e.URL_SEARCH_PARAMS_EVENT,t),window.removeEventListener(`popstate`,t),a!==`history`&&window.removeEventListener(`hashchange`,t)}},[a]),{value:d,set:(e,t)=>{f(u(l(a,{...d,...e},t?.write??o)))}}});exports.useUrlSearchParams=n;
2
2
  //# sourceMappingURL=useUrlSearchParams.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"useUrlSearchParams.cjs","names":[],"sources":["../../../../src/hooks/useUrlSearchParams/useUrlSearchParams.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport {\n createQueryString,\n dispatchUrlSearchParamsEvent,\n getUrlSearchParams,\n URL_SEARCH_PARAMS_EVENT\n} from '../useUrlSearchParam/useUrlSearchParam';\n\n/** The url params type */\nexport type UrlParams = Record<string, any>;\n\n/** The url search params mod */\nexport type UrlSearchParamsMode = 'hash-params' | 'hash' | 'history';\n\n/** The use url search params set options type */\nexport interface UseUrlSearchParamsSetOptions {\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n}\n\n/* The use search params initial value type */\nexport type UseUrlSearchParamsInitialValue<Value> = (() => Value) | Value;\n\n/** The use url search params options type */\nexport interface UseUrlSearchParamsOptions<Value> {\n /** The mode to use for writing to the URL */\n mode?: UrlSearchParamsMode;\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n /* The deserializer function to be invoked */\n deserializer?: (value: string) => Value[keyof Value];\n /* The serializer function to be invoked */\n serializer?: (value: Value[keyof Value]) => string;\n}\n\n/** The use url search params return type */\nexport interface UseUrlSearchParamsReturn<Value> {\n /** The value of the url search params */\n value: Value;\n /** The set function */\n set: (value: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => void;\n}\n\nexport interface UseUrlSearchParams {\n <Value>(\n key: string,\n options: UseUrlSearchParamsOptions<Value> & {\n initialValue: UseUrlSearchParamsInitialValue<Value>;\n }\n ): UseUrlSearchParamsReturn<Value>;\n\n <Value>(options?: UseUrlSearchParamsOptions<Value>): UseUrlSearchParamsReturn<Value | undefined>;\n\n <Value>(initialValue: UseUrlSearchParamsInitialValue<Value>): UseUrlSearchParamsReturn<Value>;\n\n <Value>(key: string): UseUrlSearchParamsReturn<Value | undefined>;\n}\n\n/**\n * @name useUrlSearchParams\n * @description - Hook that provides reactive URLSearchParams\n * @category State\n * @usage high\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsOptions<Value> & { initialValue: UseUrlSearchParamsInitialValue<Value> }} options The options object with required initialValue\n * @param {UseUrlSearchParamsInitialValue<Value>} [options.initialValue] The initial value for the url params\n * @param {UrlSearchParamsMode} [options.mode='history'] The mode to use for the URL ('history' | 'hash-params' | 'hash')\n * @param {'push' | 'replace'} [options.write='replace'] The mode to use for writing to the URL\n * @param {(value: Value[keyof Value]) => string} [options.serializer] Custom serializer function to convert value to string\n * @param {(value: string) => Value[keyof Value]} [options.deserializer] Custom deserializer function to convert string to value\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ initialValue: { page: 1 } });\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsInitialValue<Value>} [initialValue] The initial value for the url params\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ page: 1 });\n */\nexport const useUrlSearchParams = (<Value extends UrlParams>(\n params: any\n): UseUrlSearchParamsReturn<Value> => {\n const options = (\n typeof params === 'object' &&\n params &&\n ('serializer' in params ||\n 'deserializer' in params ||\n 'initialValue' in params ||\n 'mode' in params ||\n 'write' in params)\n ? params\n : undefined\n ) as\n | (UseUrlSearchParamsOptions<Value> & {\n initialValue?: UseUrlSearchParamsInitialValue<Value>;\n })\n | undefined;\n const initialValue = (\n options ? options?.initialValue : params\n ) as UseUrlSearchParamsInitialValue<Value>;\n\n const { mode = 'history', write: writeMode = 'replace' } = options ?? {};\n\n const serializer = (value: Value[keyof Value]) => {\n if (options?.serializer) return options.serializer(value);\n if (typeof value === 'string') return value;\n return JSON.stringify(value);\n };\n\n const deserializer = (value: string) => {\n if (options?.deserializer) return options.deserializer(value);\n if (value === 'undefined') return undefined as unknown as Value[keyof Value];\n\n try {\n return JSON.parse(value) as Value;\n } catch {\n return value as Value[keyof Value];\n }\n };\n\n const setUrlSearchParams = <Value extends UrlParams>(\n mode: UrlSearchParamsMode,\n value: Partial<Value>,\n write: 'push' | 'replace' = 'replace'\n ) => {\n const urlSearchParams = getUrlSearchParams(mode);\n\n Object.entries(value).forEach(([key, param]) => {\n if (param === undefined) {\n urlSearchParams.delete(key);\n } else {\n const serializedValue = serializer ? serializer(param) : String(param);\n urlSearchParams.set(key, serializedValue);\n }\n });\n\n const query = createQueryString(urlSearchParams, mode);\n if (write === 'replace') window.history.replaceState({}, '', query);\n if (write === 'push') window.history.pushState({}, '', query);\n dispatchUrlSearchParamsEvent();\n\n return urlSearchParams;\n };\n\n const getParsedUrlSearchParams = (searchParams: string | UrlParams | URLSearchParams) => {\n if (typeof searchParams === 'string') {\n return getParsedUrlSearchParams(new URLSearchParams(searchParams));\n }\n\n if (searchParams instanceof URLSearchParams) {\n return Array.from(searchParams.entries()).reduce(\n (acc, [key, value]) => {\n acc[key] = deserializer(value);\n return acc;\n },\n {} as Record<string, any>\n );\n }\n\n return searchParams;\n };\n\n const [value, setValue] = useState<Value>(() => {\n if (typeof window === 'undefined') return (initialValue ?? {}) as Value;\n\n const urlSearchParams = getUrlSearchParams(mode);\n const value = {\n ...(initialValue && getParsedUrlSearchParams(initialValue)),\n ...getParsedUrlSearchParams(urlSearchParams)\n } as Value;\n\n setUrlSearchParams(mode, value, writeMode);\n\n return value;\n });\n\n const set = (params: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => {\n const searchParams = setUrlSearchParams(\n mode,\n { ...value, ...params },\n options?.write ?? writeMode\n );\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n useEffect(() => {\n const onParamsChange = () => {\n const searchParams = getUrlSearchParams(mode);\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n window.addEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.addEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.addEventListener('hashchange', onParamsChange);\n\n return () => {\n window.removeEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.removeEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.removeEventListener('hashchange', onParamsChange);\n };\n }, [mode]);\n\n return {\n value,\n set\n };\n}) as UseUrlSearchParams;\n\nexport { createQueryString, dispatchUrlSearchParamsEvent, getUrlSearchParams };\n"],"mappings":"qIAsFA,IAAa,GACX,GACoC,CACpC,IAAM,EACJ,OAAO,GAAW,UAClB,IACC,eAAgB,GACf,iBAAkB,GAClB,iBAAkB,GAClB,SAAU,GACV,UAAW,GACT,EACA,IAAA,GAMA,EACJ,EAAU,GAAS,aAAe,EAG9B,CAAE,OAAO,UAAW,MAAO,EAAY,WAAc,GAAW,EAAE,CAElE,EAAc,GACd,GAAS,WAAmB,EAAQ,WAAW,EAAM,CACrD,OAAO,GAAU,SAAiB,EAC/B,KAAK,UAAU,EAAM,CAGxB,EAAgB,GAAkB,CACtC,GAAI,GAAS,aAAc,OAAO,EAAQ,aAAa,EAAM,CACzD,OAAU,YAEd,GAAI,CACF,OAAO,KAAK,MAAM,EAAM,MAClB,CACN,OAAO,IAIL,GACJ,EACA,EACA,EAA4B,YACzB,CACH,IAAM,EAAkB,EAAA,mBAAmB,EAAK,CAEhD,OAAO,QAAQ,EAAM,CAAC,SAAS,CAAC,EAAK,KAAW,CAC9C,GAAI,IAAU,IAAA,GACZ,EAAgB,OAAO,EAAI,KACtB,CACL,IAAM,EAAkB,EAAa,EAAW,EAAM,CAAG,OAAO,EAAM,CACtE,EAAgB,IAAI,EAAK,EAAgB,GAE3C,CAEF,IAAM,EAAQ,EAAA,kBAAkB,EAAiB,EAAK,CAKtD,OAJI,IAAU,WAAW,OAAO,QAAQ,aAAa,EAAE,CAAE,GAAI,EAAM,CAC/D,IAAU,QAAQ,OAAO,QAAQ,UAAU,EAAE,CAAE,GAAI,EAAM,CAC7D,EAAA,8BAA8B,CAEvB,GAGH,EAA4B,GAC5B,OAAO,GAAiB,SACnB,EAAyB,IAAI,gBAAgB,EAAa,CAAC,CAGhE,aAAwB,gBACnB,MAAM,KAAK,EAAa,SAAS,CAAC,CAAC,QACvC,EAAK,CAAC,EAAK,MACV,EAAI,GAAO,EAAa,EAAM,CACvB,GAET,EAAE,CACH,CAGI,EAGH,CAAC,EAAO,IAAA,EAAA,EAAA,cAAkC,CAC9C,GAAI,OAAO,OAAW,IAAa,OAAQ,GAAgB,EAAE,CAE7D,IAAM,EAAkB,EAAA,mBAAmB,EAAK,CAC1C,EAAQ,CACZ,GAAI,GAAgB,EAAyB,EAAa,CAC1D,GAAG,EAAyB,EAAgB,CAC7C,CAID,OAFA,EAAmB,EAAM,EAAO,EAAU,CAEnC,GACP,CA4BF,OAjBA,EAAA,EAAA,eAAgB,CACd,IAAM,MAAuB,CAE3B,EAAS,EADY,EAAA,mBAAmB,EAAK,CACE,CAAU,EAO3D,OAJA,OAAO,iBAAiB,EAAA,wBAAyB,EAAe,CAChE,OAAO,iBAAiB,WAAY,EAAe,CAC/C,IAAS,WAAW,OAAO,iBAAiB,aAAc,EAAe,KAEhE,CACX,OAAO,oBAAoB,EAAA,wBAAyB,EAAe,CACnE,OAAO,oBAAoB,WAAY,EAAe,CAClD,IAAS,WAAW,OAAO,oBAAoB,aAAc,EAAe,GAEjF,CAAC,EAAK,CAAC,CAEH,CACL,QACA,KA5BW,EAAwB,IAA2C,CAM9E,EAAS,EALY,EACnB,EACA,CAAE,GAAG,EAAO,GAAG,EAAQ,CACvB,GAAS,OAAS,EACnB,CAC8C,CAAU,EAuB1D"}
1
+ {"version":3,"file":"useUrlSearchParams.cjs","names":[],"sources":["../../../../src/hooks/useUrlSearchParams/useUrlSearchParams.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport {\n createQueryString,\n dispatchUrlSearchParamsEvent,\n getUrlSearchParams,\n URL_SEARCH_PARAMS_EVENT\n} from '../useUrlSearchParam/useUrlSearchParam';\n\n/** The url params type */\nexport type UrlParams = Record<string, any>;\n\n/** The url search params mod */\nexport type UrlSearchParamsMode = 'hash-params' | 'hash' | 'history';\n\n/** The use url search params set options type */\nexport interface UseUrlSearchParamsSetOptions {\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n}\n\n/* The use search params initial value type */\nexport type UseUrlSearchParamsInitialValue<Value> = (() => Value) | Value;\n\n/** The use url search params options type */\nexport interface UseUrlSearchParamsOptions<Value> {\n /** The mode to use for writing to the URL */\n mode?: UrlSearchParamsMode;\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n /* The deserializer function to be invoked */\n deserializer?: (value: string) => Value[keyof Value];\n /* The serializer function to be invoked */\n serializer?: (value: Value[keyof Value]) => string;\n}\n\n/** The use url search params return type */\nexport interface UseUrlSearchParamsReturn<Value> {\n /** The value of the url search params */\n value: Value;\n /** The set function */\n set: (value: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => void;\n}\n\nexport interface UseUrlSearchParams {\n <Value>(\n options: UseUrlSearchParamsOptions<Value> & {\n initialValue: UseUrlSearchParamsInitialValue<Value>;\n }\n ): UseUrlSearchParamsReturn<Value>;\n\n <Value>(options?: UseUrlSearchParamsOptions<Value>): UseUrlSearchParamsReturn<Value | undefined>;\n\n <Value>(initialValue: UseUrlSearchParamsInitialValue<Value>): UseUrlSearchParamsReturn<Value>;\n}\n\n/**\n * @name useUrlSearchParams\n * @description - Hook that provides reactive URLSearchParams\n * @category State\n * @usage high\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsOptions<Value> & { initialValue: UseUrlSearchParamsInitialValue<Value> }} options The options object with required initialValue\n * @param {UseUrlSearchParamsInitialValue<Value>} [options.initialValue] The initial value for the url params\n * @param {UrlSearchParamsMode} [options.mode='history'] The mode to use for the URL ('history' | 'hash-params' | 'hash')\n * @param {'push' | 'replace'} [options.write='replace'] The mode to use for writing to the URL\n * @param {(value: Value[keyof Value]) => string} [options.serializer] Custom serializer function to convert value to string\n * @param {(value: string) => Value[keyof Value]} [options.deserializer] Custom deserializer function to convert string to value\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ initialValue: { page: 1 } });\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsInitialValue<Value>} [initialValue] The initial value for the url params\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ page: 1 });\n */\nexport const useUrlSearchParams = (<Value extends UrlParams>(\n params: any\n): UseUrlSearchParamsReturn<Value> => {\n const options = (\n typeof params === 'object' &&\n params &&\n ('serializer' in params ||\n 'deserializer' in params ||\n 'initialValue' in params ||\n 'mode' in params ||\n 'write' in params)\n ? params\n : undefined\n ) as\n | (UseUrlSearchParamsOptions<Value> & {\n initialValue?: UseUrlSearchParamsInitialValue<Value>;\n })\n | undefined;\n const initialValue = (\n options ? options?.initialValue : params\n ) as UseUrlSearchParamsInitialValue<Value>;\n\n const { mode = 'history', write: writeMode = 'replace' } = options ?? {};\n\n const serializer = (value: Value[keyof Value]) => {\n if (options?.serializer) return options.serializer(value);\n if (typeof value === 'string') return value;\n return JSON.stringify(value);\n };\n\n const deserializer = (value: string) => {\n if (options?.deserializer) return options.deserializer(value);\n if (value === 'undefined') return undefined as unknown as Value[keyof Value];\n\n try {\n return JSON.parse(value) as Value;\n } catch {\n return value as Value[keyof Value];\n }\n };\n\n const setUrlSearchParams = <Value extends UrlParams>(\n mode: UrlSearchParamsMode,\n value: Partial<Value>,\n write: 'push' | 'replace' = 'replace'\n ) => {\n const urlSearchParams = getUrlSearchParams(mode);\n\n Object.entries(value).forEach(([key, param]) => {\n if (param === undefined) {\n urlSearchParams.delete(key);\n } else {\n const serializedValue = serializer ? serializer(param) : String(param);\n urlSearchParams.set(key, serializedValue);\n }\n });\n\n const query = createQueryString(urlSearchParams, mode);\n if (write === 'replace') window.history.replaceState({}, '', query);\n if (write === 'push') window.history.pushState({}, '', query);\n dispatchUrlSearchParamsEvent();\n\n return urlSearchParams;\n };\n\n const getParsedUrlSearchParams = (searchParams: string | UrlParams | URLSearchParams) => {\n if (typeof searchParams === 'string') {\n return getParsedUrlSearchParams(new URLSearchParams(searchParams));\n }\n\n if (searchParams instanceof URLSearchParams) {\n return [...searchParams.entries()].reduce(\n (acc, [key, value]) => {\n acc[key] = deserializer(value);\n return acc;\n },\n {} as Record<string, any>\n );\n }\n\n return searchParams;\n };\n\n const [value, setValue] = useState<Value>(() => {\n if (typeof window === 'undefined') return (initialValue ?? {}) as Value;\n\n const urlSearchParams = getUrlSearchParams(mode);\n const value = {\n ...(initialValue && getParsedUrlSearchParams(initialValue)),\n ...getParsedUrlSearchParams(urlSearchParams)\n } as Value;\n\n setUrlSearchParams(mode, value, writeMode);\n\n return value;\n });\n\n const set = (params: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => {\n const searchParams = setUrlSearchParams(\n mode,\n { ...value, ...params },\n options?.write ?? writeMode\n );\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n useEffect(() => {\n const onParamsChange = () => {\n const searchParams = getUrlSearchParams(mode);\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n window.addEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.addEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.addEventListener('hashchange', onParamsChange);\n\n return () => {\n window.removeEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.removeEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.removeEventListener('hashchange', onParamsChange);\n };\n }, [mode]);\n\n return {\n value,\n set\n };\n}) as UseUrlSearchParams;\n\nexport { createQueryString, dispatchUrlSearchParamsEvent, getUrlSearchParams };\n"],"mappings":"qIAmFA,IAAa,GACX,GACoC,CACpC,IAAM,EACJ,OAAO,GAAW,UAClB,IACC,eAAgB,GACf,iBAAkB,GAClB,iBAAkB,GAClB,SAAU,GACV,UAAW,GACT,EACA,IAAA,GAMA,EACJ,EAAU,GAAS,aAAe,EAG9B,CAAE,OAAO,UAAW,MAAO,EAAY,WAAc,GAAW,EAAE,CAElE,EAAc,GACd,GAAS,WAAmB,EAAQ,WAAW,EAAM,CACrD,OAAO,GAAU,SAAiB,EAC/B,KAAK,UAAU,EAAM,CAGxB,EAAgB,GAAkB,CACtC,GAAI,GAAS,aAAc,OAAO,EAAQ,aAAa,EAAM,CACzD,OAAU,YAEd,GAAI,CACF,OAAO,KAAK,MAAM,EAAM,MAClB,CACN,OAAO,IAIL,GACJ,EACA,EACA,EAA4B,YACzB,CACH,IAAM,EAAkB,EAAA,mBAAmB,EAAK,CAEhD,OAAO,QAAQ,EAAM,CAAC,SAAS,CAAC,EAAK,KAAW,CAC9C,GAAI,IAAU,IAAA,GACZ,EAAgB,OAAO,EAAI,KACtB,CACL,IAAM,EAAkB,EAAa,EAAW,EAAM,CAAG,OAAO,EAAM,CACtE,EAAgB,IAAI,EAAK,EAAgB,GAE3C,CAEF,IAAM,EAAQ,EAAA,kBAAkB,EAAiB,EAAK,CAKtD,OAJI,IAAU,WAAW,OAAO,QAAQ,aAAa,EAAE,CAAE,GAAI,EAAM,CAC/D,IAAU,QAAQ,OAAO,QAAQ,UAAU,EAAE,CAAE,GAAI,EAAM,CAC7D,EAAA,8BAA8B,CAEvB,GAGH,EAA4B,GAC5B,OAAO,GAAiB,SACnB,EAAyB,IAAI,gBAAgB,EAAa,CAAC,CAGhE,aAAwB,gBACnB,CAAC,GAAG,EAAa,SAAS,CAAC,CAAC,QAChC,EAAK,CAAC,EAAK,MACV,EAAI,GAAO,EAAa,EAAM,CACvB,GAET,EAAE,CACH,CAGI,EAGH,CAAC,EAAO,IAAA,EAAA,EAAA,cAAkC,CAC9C,GAAI,OAAO,OAAW,IAAa,OAAQ,GAAgB,EAAE,CAE7D,IAAM,EAAkB,EAAA,mBAAmB,EAAK,CAC1C,EAAQ,CACZ,GAAI,GAAgB,EAAyB,EAAa,CAC1D,GAAG,EAAyB,EAAgB,CAC7C,CAID,OAFA,EAAmB,EAAM,EAAO,EAAU,CAEnC,GACP,CA4BF,OAjBA,EAAA,EAAA,eAAgB,CACd,IAAM,MAAuB,CAE3B,EAAS,EADY,EAAA,mBAAmB,EAAK,CACE,CAAU,EAO3D,OAJA,OAAO,iBAAiB,EAAA,wBAAyB,EAAe,CAChE,OAAO,iBAAiB,WAAY,EAAe,CAC/C,IAAS,WAAW,OAAO,iBAAiB,aAAc,EAAe,KAEhE,CACX,OAAO,oBAAoB,EAAA,wBAAyB,EAAe,CACnE,OAAO,oBAAoB,WAAY,EAAe,CAClD,IAAS,WAAW,OAAO,oBAAoB,aAAc,EAAe,GAEjF,CAAC,EAAK,CAAC,CAEH,CACL,QACA,KA5BW,EAAwB,IAA2C,CAM9E,EAAS,EALY,EACnB,EACA,CAAE,GAAG,EAAO,GAAG,EAAQ,CACvB,GAAS,OAAS,EACnB,CAC8C,CAAU,EAuB1D"}
@@ -36,7 +36,7 @@ var i = ((...i) => {
36
36
  s,
37
37
  a && e.getRawElement(a),
38
38
  c.state
39
- ]), !a) return { ref: c };
39
+ ]), !a) return c;
40
40
  });
41
41
  //#endregion
42
42
  export { i as useAutoScroll };
@@ -1 +1 @@
1
- {"version":3,"file":"useAutoScroll.mjs","names":[],"sources":["../../../../src/hooks/useAutoScroll/useAutoScroll.ts"],"sourcesContent":["import { useEffect, useRef } 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 auto scroll options type */\nexport interface UseAutoScrollOptions {\n /** Whether auto-scrolling is enabled */\n enabled?: boolean;\n /** Whether to force auto-scrolling regardless of user interactions */\n force?: boolean;\n}\n\nexport interface UseAutoScroll {\n (target: HookTarget, options?: UseAutoScrollOptions): void;\n\n <Target extends HTMLElement>(\n options?: UseAutoScrollOptions\n ): {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useAutoScroll\n * @description - Hook that automatically scrolls a list element to the bottom\n * @category Elements\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target element to auto-scroll\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {void}\n *\n * @example\n * useAutoScroll(ref);\n *\n * @overload\n * @template Target\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {{ ref: StateRef<Target> }} A React ref to attach to the list element\n *\n * @example\n * const { ref } = useAutoScroll();\n */\nexport const useAutoScroll = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (params[1] ||\n (typeof params[0] === 'object' ? params[0] : {})) as UseAutoScrollOptions;\n const { enabled = true } = options;\n\n const internalRef = useRefState<HTMLElement>();\n const internalOptionsRef = useRef<UseAutoScrollOptions>(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n if (!enabled || (!target && !internalRef.state)) return;\n\n const element = (target ? isTarget.getElement(target) : internalRef.state) as HTMLElement;\n\n if (!element) return;\n\n let shouldAutoScroll = true;\n let touchStartY = 0;\n let lastScrollTop = 0;\n\n const onCheckScrollPosition = () => {\n if (internalOptionsRef.current.force) return;\n\n const { scrollHeight, clientHeight, scrollTop } = element;\n const maxScrollHeight = scrollHeight - clientHeight;\n const scrollThreshold = maxScrollHeight / 2;\n\n if (scrollTop < lastScrollTop) shouldAutoScroll = false;\n else if (maxScrollHeight - scrollTop <= scrollThreshold) shouldAutoScroll = true;\n\n lastScrollTop = scrollTop;\n };\n\n const onWheel = (event: WheelEvent) => {\n if (internalOptionsRef.current.force) return;\n\n if (event.deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n };\n\n const onTouchStart = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n touchStartY = event.touches[0].clientY;\n };\n\n const onTouchMove = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n\n const touchEndY = event.touches[0].clientY;\n const deltaY = touchStartY - touchEndY;\n\n if (deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n\n touchStartY = touchEndY;\n };\n\n const onMutation = () => {\n if (!shouldAutoScroll && !internalOptionsRef.current.force) return;\n element.scrollTo({ top: element.scrollHeight });\n };\n\n element.addEventListener('wheel', onWheel);\n element.addEventListener('touchstart', onTouchStart);\n element.addEventListener('touchmove', onTouchMove);\n\n const observer = new MutationObserver(onMutation);\n\n observer.observe(element, {\n childList: true,\n subtree: true,\n characterData: true\n });\n\n return () => {\n observer.disconnect();\n element.removeEventListener('wheel', onWheel);\n element.removeEventListener('touchstart', onTouchStart);\n element.removeEventListener('touchmove', onTouchMove);\n };\n }, [enabled, target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return { ref: internalRef };\n}) as UseAutoScroll;\n"],"mappings":";;;;AAkDA,IAAa,MAAkB,GAAG,MAAkB;CAClD,IAAM,IAAS,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC3C,IAAW,EAAO,OACrB,OAAO,EAAO,MAAO,WAAW,EAAO,KAAK,EAAE,GAC3C,EAAE,aAAU,OAAS,GAErB,IAAc,GAA0B,EACxC,IAAqB,EAA6B,EAAQ;AAChE,OAAmB,UAAU,GAE7B,QAAgB;AACd,MAAI,CAAC,KAAY,CAAC,KAAU,CAAC,EAAY,MAAQ;EAEjD,IAAM,IAAW,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AAEpE,MAAI,CAAC,EAAS;EAEd,IAAI,IAAmB,IACnB,IAAc,GACd,IAAgB,GAEd,UAA8B;AAClC,OAAI,EAAmB,QAAQ,MAAO;GAEtC,IAAM,EAAE,iBAAc,iBAAc,iBAAc,GAC5C,IAAkB,IAAe,GACjC,IAAkB,IAAkB;AAK1C,GAHI,IAAY,IAAe,IAAmB,KACzC,IAAkB,KAAa,MAAiB,IAAmB,KAE5E,IAAgB;KAGZ,KAAW,MAAsB;AACjC,KAAmB,QAAQ,UAE3B,EAAM,SAAS,IAAG,IAAmB,KACpC,GAAuB;KAGxB,KAAgB,MAAsB;AACtC,KAAmB,QAAQ,UAC/B,IAAc,EAAM,QAAQ,GAAG;KAG3B,KAAe,MAAsB;AACzC,OAAI,EAAmB,QAAQ,MAAO;GAEtC,IAAM,IAAY,EAAM,QAAQ,GAAG;AAMnC,GALe,IAAc,IAEhB,IAAG,IAAmB,KAC9B,GAAuB,EAE5B,IAAc;KAGV,UAAmB;AACnB,IAAC,KAAoB,CAAC,EAAmB,QAAQ,SACrD,EAAQ,SAAS,EAAE,KAAK,EAAQ,cAAc,CAAC;;AAKjD,EAFA,EAAQ,iBAAiB,SAAS,EAAQ,EAC1C,EAAQ,iBAAiB,cAAc,EAAa,EACpD,EAAQ,iBAAiB,aAAa,EAAY;EAElD,IAAM,IAAW,IAAI,iBAAiB,EAAW;AAQjD,SANA,EAAS,QAAQ,GAAS;GACxB,WAAW;GACX,SAAS;GACT,eAAe;GAChB,CAAC,QAEW;AAIX,GAHA,EAAS,YAAY,EACrB,EAAQ,oBAAoB,SAAS,EAAQ,EAC7C,EAAQ,oBAAoB,cAAc,EAAa,EACvD,EAAQ,oBAAoB,aAAa,EAAY;;IAEtD;EAAC;EAAS,KAAU,EAAS,cAAc,EAAO;EAAE,EAAY;EAAM,CAAC,EAEtE,GACJ,QAAO,EAAE,KAAK,GAAa"}
1
+ {"version":3,"file":"useAutoScroll.mjs","names":[],"sources":["../../../../src/hooks/useAutoScroll/useAutoScroll.ts"],"sourcesContent":["import { useEffect, useRef } 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 auto scroll options type */\nexport interface UseAutoScrollOptions {\n /** Whether auto-scrolling is enabled */\n enabled?: boolean;\n /** Whether to force auto-scrolling regardless of user interactions */\n force?: boolean;\n}\n\nexport interface UseAutoScroll {\n (target: HookTarget, options?: UseAutoScrollOptions): void;\n\n <Target extends HTMLElement>(options?: UseAutoScrollOptions): StateRef<Target>;\n}\n\n/**\n * @name useAutoScroll\n * @description - Hook that automatically scrolls a list element to the bottom\n * @category Elements\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target element to auto-scroll\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {void}\n *\n * @example\n * useAutoScroll(ref);\n *\n * @overload\n * @template Target\n * @param {boolean} [options.enabled] Whether auto-scrolling is enabled\n * @returns {StateRef<Target>} A React ref to attach to the list element\n *\n * @example\n * const ref = useAutoScroll();\n */\nexport const useAutoScroll = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (params[1] ||\n (typeof params[0] === 'object' ? params[0] : {})) as UseAutoScrollOptions;\n const { enabled = true } = options;\n\n const internalRef = useRefState<HTMLElement>();\n const internalOptionsRef = useRef<UseAutoScrollOptions>(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n if (!enabled || (!target && !internalRef.state)) return;\n\n const element = (target ? isTarget.getElement(target) : internalRef.state) as HTMLElement;\n\n if (!element) return;\n\n let shouldAutoScroll = true;\n let touchStartY = 0;\n let lastScrollTop = 0;\n\n const onCheckScrollPosition = () => {\n if (internalOptionsRef.current.force) return;\n\n const { scrollHeight, clientHeight, scrollTop } = element;\n const maxScrollHeight = scrollHeight - clientHeight;\n const scrollThreshold = maxScrollHeight / 2;\n\n if (scrollTop < lastScrollTop) shouldAutoScroll = false;\n else if (maxScrollHeight - scrollTop <= scrollThreshold) shouldAutoScroll = true;\n\n lastScrollTop = scrollTop;\n };\n\n const onWheel = (event: WheelEvent) => {\n if (internalOptionsRef.current.force) return;\n\n if (event.deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n };\n\n const onTouchStart = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n touchStartY = event.touches[0].clientY;\n };\n\n const onTouchMove = (event: TouchEvent) => {\n if (internalOptionsRef.current.force) return;\n\n const touchEndY = event.touches[0].clientY;\n const deltaY = touchStartY - touchEndY;\n\n if (deltaY < 0) shouldAutoScroll = false;\n else onCheckScrollPosition();\n\n touchStartY = touchEndY;\n };\n\n const onMutation = () => {\n if (!shouldAutoScroll && !internalOptionsRef.current.force) return;\n element.scrollTo({ top: element.scrollHeight });\n };\n\n element.addEventListener('wheel', onWheel);\n element.addEventListener('touchstart', onTouchStart);\n element.addEventListener('touchmove', onTouchMove);\n\n const observer = new MutationObserver(onMutation);\n\n observer.observe(element, {\n childList: true,\n subtree: true,\n characterData: true\n });\n\n return () => {\n observer.disconnect();\n element.removeEventListener('wheel', onWheel);\n element.removeEventListener('touchstart', onTouchStart);\n element.removeEventListener('touchmove', onTouchMove);\n };\n }, [enabled, target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return internalRef;\n}) as UseAutoScroll;\n"],"mappings":";;;;AA8CA,IAAa,MAAkB,GAAG,MAAkB;CAClD,IAAM,IAAS,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC3C,IAAW,EAAO,OACrB,OAAO,EAAO,MAAO,WAAW,EAAO,KAAK,EAAE,GAC3C,EAAE,aAAU,OAAS,GAErB,IAAc,GAA0B,EACxC,IAAqB,EAA6B,EAAQ;AAChE,OAAmB,UAAU,GAE7B,QAAgB;AACd,MAAI,CAAC,KAAY,CAAC,KAAU,CAAC,EAAY,MAAQ;EAEjD,IAAM,IAAW,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AAEpE,MAAI,CAAC,EAAS;EAEd,IAAI,IAAmB,IACnB,IAAc,GACd,IAAgB,GAEd,UAA8B;AAClC,OAAI,EAAmB,QAAQ,MAAO;GAEtC,IAAM,EAAE,iBAAc,iBAAc,iBAAc,GAC5C,IAAkB,IAAe,GACjC,IAAkB,IAAkB;AAK1C,GAHI,IAAY,IAAe,IAAmB,KACzC,IAAkB,KAAa,MAAiB,IAAmB,KAE5E,IAAgB;KAGZ,KAAW,MAAsB;AACjC,KAAmB,QAAQ,UAE3B,EAAM,SAAS,IAAG,IAAmB,KACpC,GAAuB;KAGxB,KAAgB,MAAsB;AACtC,KAAmB,QAAQ,UAC/B,IAAc,EAAM,QAAQ,GAAG;KAG3B,KAAe,MAAsB;AACzC,OAAI,EAAmB,QAAQ,MAAO;GAEtC,IAAM,IAAY,EAAM,QAAQ,GAAG;AAMnC,GALe,IAAc,IAEhB,IAAG,IAAmB,KAC9B,GAAuB,EAE5B,IAAc;KAGV,UAAmB;AACnB,IAAC,KAAoB,CAAC,EAAmB,QAAQ,SACrD,EAAQ,SAAS,EAAE,KAAK,EAAQ,cAAc,CAAC;;AAKjD,EAFA,EAAQ,iBAAiB,SAAS,EAAQ,EAC1C,EAAQ,iBAAiB,cAAc,EAAa,EACpD,EAAQ,iBAAiB,aAAa,EAAY;EAElD,IAAM,IAAW,IAAI,iBAAiB,EAAW;AAQjD,SANA,EAAS,QAAQ,GAAS;GACxB,WAAW;GACX,SAAS;GACT,eAAe;GAChB,CAAC,QAEW;AAIX,GAHA,EAAS,YAAY,EACrB,EAAQ,oBAAoB,SAAS,EAAQ,EAC7C,EAAQ,oBAAoB,cAAc,EAAa,EACvD,EAAQ,oBAAoB,aAAa,EAAY;;IAEtD;EAAC;EAAS,KAAU,EAAS,cAAc,EAAO;EAAE,EAAY;EAAM,CAAC,EAEtE,GACJ,QAAO"}
@@ -14,7 +14,7 @@ var i = ((...i) => {
14
14
  return document.addEventListener("click", n), () => {
15
15
  document.removeEventListener("click", n);
16
16
  };
17
- }, [a && e.getRawElement(a), s.state]), !a) return { ref: s };
17
+ }, [a && e.getRawElement(a), s.state]), !a) return s;
18
18
  });
19
19
  //#endregion
20
20
  export { i as useClickOutside };
@@ -1 +1 @@
1
- {"version":3,"file":"useClickOutside.mjs","names":[],"sources":["../../../../src/hooks/useClickOutside/useClickOutside.ts"],"sourcesContent":["import { useEffect, useRef } 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 interface UseClickOutside {\n (target: HookTarget, callback: (event: Event) => void): void;\n\n <Target extends Element>(\n callback: (event: Event) => void,\n target?: never\n ): {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useClickOutside\n * @description - Hook to handle click events outside the specified target element(s)\n * @category Elements \n * @usage necessary\n\n * @overload\n * @param {HookTarget} target The target element(s) to detect outside clicks for\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {void}\n *\n * @example\n * useClickOutside(ref, () => console.log('click outside'));\n *\n * @overload\n * @template Target The target element(s)\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {{ ref: StateRef<Target> }} A ref to attach to the target element\n *\n * @example\n * const { ref } = useClickOutside<HTMLDivElement>(() => console.log('click outside'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useClickOutside.html}\n */\nexport const useClickOutside = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const callback = (params[1] ? params[1] : params[0]) as (event: Event) => void;\n\n const internalRef = useRefState<Element>();\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\n if (!element) return;\n\n const onClick = (event: Event) => {\n if (!element.contains(event.target as Node)) {\n internalCallbackRef.current(event);\n }\n };\n\n document.addEventListener('click', onClick);\n\n return () => {\n document.removeEventListener('click', onClick);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n if (target) return;\n return { ref: internalRef };\n}) as UseClickOutside;\n"],"mappings":";;;;AA6CA,IAAa,MAAoB,GAAG,MAAkB;CACpD,IAAM,IAAU,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC5C,IAAY,EAAO,KAAK,EAAO,KAAK,EAAO,IAE3C,IAAc,GAAsB,EACpC,IAAsB,EAAO,EAAS;AAC5C,OAAoB,UAAU,GAE9B,QAAgB;AACd,MAAI,CAAC,KAAU,CAAC,EAAY,MAAO;EAEnC,IAAM,IAAW,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AAEpE,MAAI,CAAC,EAAS;EAEd,IAAM,KAAW,MAAiB;AAChC,GAAK,EAAQ,SAAS,EAAM,OAAe,IACzC,EAAoB,QAAQ,EAAM;;AAMtC,SAFA,SAAS,iBAAiB,SAAS,EAAQ,QAE9B;AACX,YAAS,oBAAoB,SAAS,EAAQ;;IAE/C,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC,EAC7D,GACJ,QAAO,EAAE,KAAK,GAAa"}
1
+ {"version":3,"file":"useClickOutside.mjs","names":[],"sources":["../../../../src/hooks/useClickOutside/useClickOutside.ts"],"sourcesContent":["import { useEffect, useRef } 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 interface UseClickOutside {\n (target: HookTarget, callback: (event: Event) => void): void;\n\n <Target extends Element>(callback: (event: Event) => void, target?: never): StateRef<Target>;\n}\n\n/**\n * @name useClickOutside\n * @description - Hook to handle click events outside the specified target element(s)\n * @category Elements \n * @usage necessary\n\n * @overload\n * @param {HookTarget} target The target element(s) to detect outside clicks for\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {void}\n *\n * @example\n * useClickOutside(ref, () => console.log('click outside'));\n *\n * @overload\n * @template Target The target element(s)\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useClickOutside<HTMLDivElement>(() => console.log('click outside'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useClickOutside.html}\n */\nexport const useClickOutside = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const callback = (params[1] ? params[1] : params[0]) as (event: Event) => void;\n\n const internalRef = useRefState<Element>();\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\n if (!element) return;\n\n const onClick = (event: Event) => {\n if (!element.contains(event.target as Node)) {\n internalCallbackRef.current(event);\n }\n };\n\n document.addEventListener('click', onClick);\n\n return () => {\n document.removeEventListener('click', onClick);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n if (target) return;\n return internalRef;\n}) as UseClickOutside;\n"],"mappings":";;;;AAwCA,IAAa,MAAoB,GAAG,MAAkB;CACpD,IAAM,IAAU,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC5C,IAAY,EAAO,KAAK,EAAO,KAAK,EAAO,IAE3C,IAAc,GAAsB,EACpC,IAAsB,EAAO,EAAS;AAC5C,OAAoB,UAAU,GAE9B,QAAgB;AACd,MAAI,CAAC,KAAU,CAAC,EAAY,MAAO;EAEnC,IAAM,IAAW,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AAEpE,MAAI,CAAC,EAAS;EAEd,IAAM,KAAW,MAAiB;AAChC,GAAK,EAAQ,SAAS,EAAM,OAAe,IACzC,EAAoB,QAAQ,EAAM;;AAMtC,SAFA,SAAS,iBAAiB,SAAS,EAAQ,QAE9B;AACX,YAAS,oBAAoB,SAAS,EAAQ;;IAE/C,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC,EAC7D,GACJ,QAAO"}
@@ -18,7 +18,7 @@ var i = 300, a = ((...i) => {
18
18
  return t.addEventListener("mousedown", n), t.addEventListener("touchstart", n), () => {
19
19
  t.removeEventListener("mousedown", n), t.removeEventListener("touchstart", n), c.current && clearTimeout(c.current);
20
20
  };
21
- }, [a && e.getRawElement(a), u.state]), !a) return { ref: u };
21
+ }, [a && e.getRawElement(a), u.state]), !a) return u;
22
22
  });
23
23
  //#endregion
24
24
  export { i as DEFAULT_THRESHOLD_TIME, a as useDoubleClick };
@@ -1 +1 @@
1
- {"version":3,"file":"useDoubleClick.mjs","names":[],"sources":["../../../../src/hooks/useDoubleClick/useDoubleClick.ts"],"sourcesContent":["import { useEffect, useRef } 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 DoubleClickEvents = MouseEvent | TouchEvent;\n\n/** The use double click options type */\nexport interface UseDoubleClickOptions {\n /** The threshold time in milliseconds between clicks */\n threshold?: number;\n /** The callback function to be invoked on single click */\n onSingleClick?: (event: DoubleClickEvents) => void;\n}\n\nexport interface UseDoubleClick {\n (\n target: HookTarget,\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions\n ): void;\n\n <Target extends Element>(\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions,\n target?: never\n ): { ref: StateRef<Target> };\n}\n\nexport const DEFAULT_THRESHOLD_TIME = 300;\n\n/**\n * @name useDoubleClick\n * @description - Hook that defines the logic when double clicking an element\n * @category Elements\n * @usage medium\n\n * @overload\n * @param {HookTarget} target The target element to be double clicked\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {void} The double clicking state\n *\n * @example\n * useDoubleClick(ref, () => console.log('double clicked'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {{ ref: StateRef<Target> }} The double clicking state\n *\n * @example\n * const { ref } = useDoubleClick(() => console.log('double clicked'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useDoubleClick.html}\n */\nexport const useDoubleClick = ((...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: DoubleClickEvents) => void;\n const options = (target ? params[2] : params[1]) as UseDoubleClickOptions | undefined;\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const clickCountRef = useRef(0);\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 onClick = (event: DoubleClickEvents) => {\n clickCountRef.current += 1;\n\n if (clickCountRef.current === 1) {\n timeoutIdRef.current = setTimeout(() => {\n if (internalOptionsRef.current?.onSingleClick)\n internalOptionsRef.current.onSingleClick(event);\n clickCountRef.current = 0;\n }, internalOptionsRef.current?.threshold ?? DEFAULT_THRESHOLD_TIME);\n }\n\n if (clickCountRef.current === 2) {\n clearTimeout(timeoutIdRef.current);\n internalCallbackRef.current(event);\n clickCountRef.current = 0;\n }\n };\n\n element.addEventListener('mousedown', onClick as EventListener);\n element.addEventListener('touchstart', onClick as EventListener);\n\n return () => {\n element.removeEventListener('mousedown', onClick as EventListener);\n element.removeEventListener('touchstart', onClick as EventListener);\n if (timeoutIdRef.current) clearTimeout(timeoutIdRef.current);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return {\n ref: internalRef\n };\n}) as UseDoubleClick;\n"],"mappings":";;;;AAkCA,IAAa,IAAyB,KA4BzB,MAAmB,GAAG,MAAuB;CACxD,IAAM,IAAU,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC5C,IAAY,IAAS,EAAO,KAAK,EAAO,IACxC,IAAW,IAAS,EAAO,KAAK,EAAO,IAEvC,IAAe,EAAsC,KAAA,EAAU,EAC/D,IAAgB,EAAO,EAAE,EACzB,IAAc,GAAsB,EAEpC,IAAsB,EAAO,EAAS;AAC5C,GAAoB,UAAU;CAC9B,IAAM,IAAqB,EAAO,EAAQ;AAC1C,OAAmB,UAAU,GAE7B,QAAgB;AACd,MAAI,CAAC,KAAU,CAAC,EAAY,MAAO;EAEnC,IAAM,IAAU,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AACnE,MAAI,CAAC,EAAS;EAEd,IAAM,KAAW,MAA6B;AAW5C,GAVA,EAAc,WAAW,GAErB,EAAc,YAAY,MAC5B,EAAa,UAAU,iBAAiB;AAGtC,IAFI,EAAmB,SAAS,iBAC9B,EAAmB,QAAQ,cAAc,EAAM,EACjD,EAAc,UAAU;MACvB,EAAmB,SAAS,aAAA,IAAoC,GAGjE,EAAc,YAAY,MAC5B,aAAa,EAAa,QAAQ,EAClC,EAAoB,QAAQ,EAAM,EAClC,EAAc,UAAU;;AAO5B,SAHA,EAAQ,iBAAiB,aAAa,EAAyB,EAC/D,EAAQ,iBAAiB,cAAc,EAAyB,QAEnD;AAGX,GAFA,EAAQ,oBAAoB,aAAa,EAAyB,EAClE,EAAQ,oBAAoB,cAAc,EAAyB,EAC/D,EAAa,WAAS,aAAa,EAAa,QAAQ;;IAE7D,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC,EAE7D,GACJ,QAAO,EACL,KAAK,GACN"}
1
+ {"version":3,"file":"useDoubleClick.mjs","names":[],"sources":["../../../../src/hooks/useDoubleClick/useDoubleClick.ts"],"sourcesContent":["import { useEffect, useRef } 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 DoubleClickEvents = MouseEvent | TouchEvent;\n\n/** The use double click options type */\nexport interface UseDoubleClickOptions {\n /** The threshold time in milliseconds between clicks */\n threshold?: number;\n /** The callback function to be invoked on single click */\n onSingleClick?: (event: DoubleClickEvents) => void;\n}\n\nexport interface UseDoubleClick {\n (\n target: HookTarget,\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions\n ): void;\n\n <Target extends Element>(\n callback: (event: DoubleClickEvents) => void,\n options?: UseDoubleClickOptions,\n target?: never\n ): StateRef<Target>;\n}\n\nexport const DEFAULT_THRESHOLD_TIME = 300;\n\n/**\n * @name useDoubleClick\n * @description - Hook that defines the logic when double clicking an element\n * @category Elements\n * @usage medium\n\n * @overload\n * @param {HookTarget} target The target element to be double clicked\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {void} The double clicking state\n *\n * @example\n * useDoubleClick(ref, () => console.log('double clicked'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click\n * @param {UseDoubleClickOptions} [options] The options for the double click\n * @returns {StateRef<Target>} The double clicking state\n *\n * @example\n * const ref = useDoubleClick(() => console.log('double clicked'));\n *\n * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useDoubleClick.html}\n */\nexport const useDoubleClick = ((...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: DoubleClickEvents) => void;\n const options = (target ? params[2] : params[1]) as UseDoubleClickOptions | undefined;\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const clickCountRef = useRef(0);\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 onClick = (event: DoubleClickEvents) => {\n clickCountRef.current += 1;\n\n if (clickCountRef.current === 1) {\n timeoutIdRef.current = setTimeout(() => {\n if (internalOptionsRef.current?.onSingleClick)\n internalOptionsRef.current.onSingleClick(event);\n clickCountRef.current = 0;\n }, internalOptionsRef.current?.threshold ?? DEFAULT_THRESHOLD_TIME);\n }\n\n if (clickCountRef.current === 2) {\n clearTimeout(timeoutIdRef.current);\n internalCallbackRef.current(event);\n clickCountRef.current = 0;\n }\n };\n\n element.addEventListener('mousedown', onClick as EventListener);\n element.addEventListener('touchstart', onClick as EventListener);\n\n return () => {\n element.removeEventListener('mousedown', onClick as EventListener);\n element.removeEventListener('touchstart', onClick as EventListener);\n if (timeoutIdRef.current) clearTimeout(timeoutIdRef.current);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n if (target) return;\n return internalRef;\n}) as UseDoubleClick;\n"],"mappings":";;;;AAkCA,IAAa,IAAyB,KA4BzB,MAAmB,GAAG,MAAuB;CACxD,IAAM,IAAU,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC5C,IAAY,IAAS,EAAO,KAAK,EAAO,IACxC,IAAW,IAAS,EAAO,KAAK,EAAO,IAEvC,IAAe,EAAsC,KAAA,EAAU,EAC/D,IAAgB,EAAO,EAAE,EACzB,IAAc,GAAsB,EAEpC,IAAsB,EAAO,EAAS;AAC5C,GAAoB,UAAU;CAC9B,IAAM,IAAqB,EAAO,EAAQ;AAC1C,OAAmB,UAAU,GAE7B,QAAgB;AACd,MAAI,CAAC,KAAU,CAAC,EAAY,MAAO;EAEnC,IAAM,IAAU,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AACnE,MAAI,CAAC,EAAS;EAEd,IAAM,KAAW,MAA6B;AAW5C,GAVA,EAAc,WAAW,GAErB,EAAc,YAAY,MAC5B,EAAa,UAAU,iBAAiB;AAGtC,IAFI,EAAmB,SAAS,iBAC9B,EAAmB,QAAQ,cAAc,EAAM,EACjD,EAAc,UAAU;MACvB,EAAmB,SAAS,aAAA,IAAoC,GAGjE,EAAc,YAAY,MAC5B,aAAa,EAAa,QAAQ,EAClC,EAAoB,QAAQ,EAAM,EAClC,EAAc,UAAU;;AAO5B,SAHA,EAAQ,iBAAiB,aAAa,EAAyB,EAC/D,EAAQ,iBAAiB,cAAc,EAAyB,QAEnD;AAGX,GAFA,EAAQ,oBAAoB,aAAa,EAAyB,EAClE,EAAQ,oBAAoB,cAAc,EAAyB,EAC/D,EAAa,WAAS,aAAa,EAAa,QAAQ;;IAE7D,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC,EAE7D,GACJ,QAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"useKeyPressEvent.mjs","names":[],"sources":["../../../../src/hooks/useKeyPressEvent/useKeyPressEvent.ts"],"sourcesContent":["import { useEffect, useRef } 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 UseKeyPressEventKey = string | string[];\n\n/** The use key press event options type */\nexport interface UseKeyPressEventOptions {\n /** Whether the event should be captured */\n capture?: boolean;\n /** Whether the event listener should only be triggered once */\n once?: boolean;\n /** Whether the event listener should be passive */\n passive?: boolean;\n}\n\nexport interface UseKeyPressEvent {\n (\n target: HookTarget | Window,\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions\n ): void;\n\n <Target extends Element>(\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions,\n target?: never\n ): { ref: StateRef<Target> };\n}\n\n/**\n * @name useKeyPressEvent\n * @description - Hook that listens for key press events on specified targets\n * @category Sensors\n * @usage low\n *\n * @overload\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {HookTarget | Window} target The target to attach the event listener to.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {void}\n *\n * @example\n * useKeyPressEvent(ref, 'Enter', () => console.log('pressed'));\n *\n * @overload\n * @template Target extends Element\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {{ ref: StateRef<Target> }} An object containing the ref\n *\n * @example\n * const ref = useKeyPressEvent('Enter', (event) => console.log('pressed'));\n */\nexport const useKeyPressEvent = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const key = (target ? params[1] : params[0]) as UseKeyPressEventKey;\n const listener = (target ? params[2] : params[1]) as (event: KeyboardEvent) => void;\n const options = (target ? params[3] : params[2]) as UseKeyPressEventOptions | undefined;\n\n const internalRef = useRefState(window);\n\n const keyRef = useRef(key);\n keyRef.current = key;\n const listenerRef = useRef(listener);\n listenerRef.current = listener;\n\n useEffect(() => {\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 const keys = Array.isArray(keyRef.current) ? keyRef.current : [keyRef.current];\n if (keys.includes(keyboardEvent.key)) {\n listenerRef.current(keyboardEvent);\n }\n };\n\n element.addEventListener('keydown', onKeyDown, {\n capture: options?.capture,\n passive: options?.passive,\n once: options?.once\n });\n\n return () => {\n element.removeEventListener('keydown', onKeyDown, {\n capture: options?.capture\n });\n };\n }, [\n target && isTarget.getRawElement(target),\n internalRef.state,\n options?.capture,\n options?.passive,\n options?.once\n ]);\n\n if (target) return;\n return internalRef;\n}) as UseKeyPressEvent;\n"],"mappings":";;;;AAiEA,IAAa,MAAqB,GAAG,MAAkB;CACrD,IAAM,IAAS,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC3C,IAAO,IAAS,EAAO,KAAK,EAAO,IACnC,IAAY,IAAS,EAAO,KAAK,EAAO,IACxC,IAAW,IAAS,EAAO,KAAK,EAAO,IAEvC,IAAc,EAAY,OAAO,EAEjC,IAAS,EAAO,EAAI;AAC1B,GAAO,UAAU;CACjB,IAAM,IAAc,EAAO,EAAS;AACpC,OAAY,UAAU,GAEtB,QAAgB;EACd,IAAM,IAAW,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AACpE,MAAI,CAAC,EAAS;EAEd,IAAM,KAAa,MAAiB;GAClC,IAAM,IAAgB;AAEtB,IADa,MAAM,QAAQ,EAAO,QAAQ,GAAG,EAAO,UAAU,CAAC,EAAO,QAAQ,EACrE,SAAS,EAAc,IAAI,IAClC,EAAY,QAAQ,EAAc;;AAUtC,SANA,EAAQ,iBAAiB,WAAW,GAAW;GAC7C,SAAS,GAAS;GAClB,SAAS,GAAS;GAClB,MAAM,GAAS;GAChB,CAAC,QAEW;AACX,KAAQ,oBAAoB,WAAW,GAAW,EAChD,SAAS,GAAS,SACnB,CAAC;;IAEH;EACD,KAAU,EAAS,cAAc,EAAO;EACxC,EAAY;EACZ,GAAS;EACT,GAAS;EACT,GAAS;EACV,CAAC,EAEE,GACJ,QAAO"}
1
+ {"version":3,"file":"useKeyPressEvent.mjs","names":[],"sources":["../../../../src/hooks/useKeyPressEvent/useKeyPressEvent.ts"],"sourcesContent":["import { useEffect, useRef } 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 UseKeyPressEventKey = string | string[];\n\n/** The use key press event options type */\nexport interface UseKeyPressEventOptions {\n /** Whether the event should be captured */\n capture?: boolean;\n /** Whether the event listener should only be triggered once */\n once?: boolean;\n /** Whether the event listener should be passive */\n passive?: boolean;\n}\n\nexport interface UseKeyPressEvent {\n (\n target: HookTarget | Window,\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions\n ): void;\n\n <Target extends Element>(\n key: UseKeyPressEventKey,\n listener: (event: KeyboardEvent) => void,\n options?: UseKeyPressEventOptions,\n target?: never\n ): StateRef<Target>;\n}\n\n/**\n * @name useKeyPressEvent\n * @description - Hook that listens for key press events on specified targets\n * @category Sensors\n * @usage low\n *\n * @overload\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {HookTarget | Window} target The target to attach the event listener to.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {void}\n *\n * @example\n * useKeyPressEvent(ref, 'Enter', () => console.log('pressed'));\n *\n * @overload\n * @template Target extends Element\n * @param {UseKeyPressEventKey} key The key or array of keys to listen for.\n * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.\n * @param {UseKeyPressEventOptions} [options] The options for the event listener.\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useKeyPressEvent('Enter', (event) => console.log('pressed'));\n */\nexport const useKeyPressEvent = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const key = (target ? params[1] : params[0]) as UseKeyPressEventKey;\n const listener = (target ? params[2] : params[1]) as (event: KeyboardEvent) => void;\n const options = (target ? params[3] : params[2]) as UseKeyPressEventOptions | undefined;\n\n const internalRef = useRefState(window);\n\n const keyRef = useRef(key);\n keyRef.current = key;\n const listenerRef = useRef(listener);\n listenerRef.current = listener;\n\n useEffect(() => {\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 const keys = Array.isArray(keyRef.current) ? keyRef.current : [keyRef.current];\n if (keys.includes(keyboardEvent.key)) {\n listenerRef.current(keyboardEvent);\n }\n };\n\n element.addEventListener('keydown', onKeyDown, {\n capture: options?.capture,\n passive: options?.passive,\n once: options?.once\n });\n\n return () => {\n element.removeEventListener('keydown', onKeyDown, {\n capture: options?.capture\n });\n };\n }, [\n target && isTarget.getRawElement(target),\n internalRef.state,\n options?.capture,\n options?.passive,\n options?.once\n ]);\n\n if (target) return;\n return internalRef;\n}) as UseKeyPressEvent;\n"],"mappings":";;;;AAiEA,IAAa,MAAqB,GAAG,MAAkB;CACrD,IAAM,IAAS,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC3C,IAAO,IAAS,EAAO,KAAK,EAAO,IACnC,IAAY,IAAS,EAAO,KAAK,EAAO,IACxC,IAAW,IAAS,EAAO,KAAK,EAAO,IAEvC,IAAc,EAAY,OAAO,EAEjC,IAAS,EAAO,EAAI;AAC1B,GAAO,UAAU;CACjB,IAAM,IAAc,EAAO,EAAS;AACpC,OAAY,UAAU,GAEtB,QAAgB;EACd,IAAM,IAAW,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY;AACpE,MAAI,CAAC,EAAS;EAEd,IAAM,KAAa,MAAiB;GAClC,IAAM,IAAgB;AAEtB,IADa,MAAM,QAAQ,EAAO,QAAQ,GAAG,EAAO,UAAU,CAAC,EAAO,QAAQ,EACrE,SAAS,EAAc,IAAI,IAClC,EAAY,QAAQ,EAAc;;AAUtC,SANA,EAAQ,iBAAiB,WAAW,GAAW;GAC7C,SAAS,GAAS;GAClB,SAAS,GAAS;GAClB,MAAM,GAAS;GAChB,CAAC,QAEW;AACX,KAAQ,oBAAoB,WAAW,GAAW,EAChD,SAAS,GAAS,SACnB,CAAC;;IAEH;EACD,KAAU,EAAS,cAAc,EAAO;EACxC,EAAY;EACZ,GAAS;EACT,GAAS;EACT,GAAS;EACV,CAAC,EAEE,GACJ,QAAO"}
@@ -9,7 +9,7 @@ var i = ((...i) => {
9
9
  return t.addEventListener("keydown", n), t.addEventListener("keyup", r), () => {
10
10
  t.removeEventListener("keydown", n), t.removeEventListener("keyup", r);
11
11
  };
12
- }, [a && e.getRawElement(a), s.state]), !a) return { ref: s };
12
+ }, [a && e.getRawElement(a), s.state]), !a) return s;
13
13
  });
14
14
  //#endregion
15
15
  export { i as useKeyboard };
@@ -1 +1 @@
1
- {"version":3,"file":"useKeyboard.mjs","names":[],"sources":["../../../../src/hooks/useKeyboard/useKeyboard.ts"],"sourcesContent":["import { useEffect, useRef } 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 keyboard return type */\nexport type UseKeyboardReturn<Target extends HTMLElement> = StateRef<Target>;\n\n/** The use keyboard event handler type */\nexport type KeyboardEventHandler = (event: KeyboardEvent) => void;\n\n/** The use keyboard event options type */\nexport interface UseKeyboardEventOptions {\n /** The callback function to be invoked on key down */\n onKeyDown?: KeyboardEventHandler;\n /** The callback function to be invoked on key up */\n onKeyUp?: KeyboardEventHandler;\n}\n\nexport interface UseKeyboard {\n (target: HookTarget, callback: KeyboardEventHandler): void;\n\n (target: HookTarget, options: UseKeyboardEventOptions): void;\n\n <Target extends HTMLElement>(\n callback: KeyboardEventHandler,\n target?: never\n ): { ref: StateRef<Target> };\n\n <Target extends HTMLElement>(\n options: UseKeyboardEventOptions,\n target?: never\n ): {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useKeyboard\n * @description - Hook that helps to listen for keyboard events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, (event) => console.log('key down'));\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, { onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n *\n * @overload\n * @template Target The target element type\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {{ ref: StateRef<Target> }} An object containing the ref\n *\n * @example\n * const keyboard = useKeyboard((event) => console.log('key down'));\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {{ ref: StateRef<Target> }} An object containing the ref\n *\n * @example\n * const keyboard = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n */\nexport const useKeyboard = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (\n target\n ? typeof params[1] === 'object'\n ? params[1]\n : { onKeyDown: params[1] }\n : typeof params[0] === 'object'\n ? params[0]\n : { onKeyDown: params[0] }\n ) as UseKeyboardEventOptions;\n\n const internalRef = useRefState<HTMLElement | Window>();\n const internalOptionsRef = useRef(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n const element =\n ((target ? isTarget.getElement(target) : internalRef.current) as HTMLElement) ?? window;\n\n const onKeyDown = (event: Event) =>\n internalOptionsRef.current?.onKeyDown?.(event as KeyboardEvent);\n const onKeyUp = (event: Event) => internalOptionsRef.current?.onKeyUp?.(event as KeyboardEvent);\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;\n return { ref: internalRef };\n}) as UseKeyboard;\n"],"mappings":";;;;AAgFA,IAAa,MAAgB,GAAG,MAAkB;CAChD,IAAM,IAAS,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC3C,IACJ,IACI,OAAO,EAAO,MAAO,WACnB,EAAO,KACP,EAAE,WAAW,EAAO,IAAI,GAC1B,OAAO,EAAO,MAAO,WACnB,EAAO,KACP,EAAE,WAAW,EAAO,IAAI,EAG1B,IAAc,GAAmC,EACjD,IAAqB,EAAO,EAAQ;AAC1C,OAAmB,UAAU,GAE7B,QAAgB;EACd,IAAM,KACF,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY,YAA4B,QAE7E,KAAa,MACjB,EAAmB,SAAS,YAAY,EAAuB,EAC3D,KAAW,MAAiB,EAAmB,SAAS,UAAU,EAAuB;AAK/F,SAHA,EAAQ,iBAAiB,WAAW,EAAU,EAC9C,EAAQ,iBAAiB,SAAS,EAAQ,QAE7B;AAEX,GADA,EAAQ,oBAAoB,WAAW,EAAU,EACjD,EAAQ,oBAAoB,SAAS,EAAQ;;IAE9C,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC,EAE7D,GACJ,QAAO,EAAE,KAAK,GAAa"}
1
+ {"version":3,"file":"useKeyboard.mjs","names":[],"sources":["../../../../src/hooks/useKeyboard/useKeyboard.ts"],"sourcesContent":["import { useEffect, useRef } 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 keyboard return type */\nexport type UseKeyboardReturn<Target extends HTMLElement> = StateRef<Target>;\n\n/** The use keyboard event handler type */\nexport type KeyboardEventHandler = (event: KeyboardEvent) => void;\n\n/** The use keyboard event options type */\nexport interface UseKeyboardEventOptions {\n /** The callback function to be invoked on key down */\n onKeyDown?: KeyboardEventHandler;\n /** The callback function to be invoked on key up */\n onKeyUp?: KeyboardEventHandler;\n}\n\nexport interface UseKeyboard {\n (target: HookTarget, callback: KeyboardEventHandler): void;\n\n (target: HookTarget, options: UseKeyboardEventOptions): void;\n\n <Target extends HTMLElement>(callback: KeyboardEventHandler, target?: never): StateRef<Target>;\n\n <Target extends HTMLElement>(options: UseKeyboardEventOptions, target?: never): StateRef<Target>;\n}\n\n/**\n * @name useKeyboard\n * @description - Hook that helps to listen for keyboard events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, (event) => console.log('key down'));\n *\n * @overload\n * @param {HookTarget} target The target to attach the event listeners to\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {void}\n *\n * @example\n * useKeyboard(ref, { onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n *\n * @overload\n * @template Target The target element type\n * @param {KeyboardEventHandler} callback The callback function to be invoked on key down\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useKeyboard((event) => console.log('key down'));\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyboardEventOptions} [options] The keyboard event options\n * @returns {StateRef<Target>} A ref to attach to the target element\n *\n * @example\n * const ref = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });\n */\nexport const useKeyboard = ((...params: any[]) => {\n const target = isTarget(params[0]) ? params[0] : undefined;\n const options = (\n target\n ? typeof params[1] === 'object'\n ? params[1]\n : { onKeyDown: params[1] }\n : typeof params[0] === 'object'\n ? params[0]\n : { onKeyDown: params[0] }\n ) as UseKeyboardEventOptions;\n\n const internalRef = useRefState<HTMLElement | Window>();\n const internalOptionsRef = useRef(options);\n internalOptionsRef.current = options;\n\n useEffect(() => {\n const element =\n ((target ? isTarget.getElement(target) : internalRef.current) as HTMLElement) ?? window;\n\n const onKeyDown = (event: Event) =>\n internalOptionsRef.current?.onKeyDown?.(event as KeyboardEvent);\n const onKeyUp = (event: Event) => internalOptionsRef.current?.onKeyUp?.(event as KeyboardEvent);\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;\n return internalRef;\n}) as UseKeyboard;\n"],"mappings":";;;;AAwEA,IAAa,MAAgB,GAAG,MAAkB;CAChD,IAAM,IAAS,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC3C,IACJ,IACI,OAAO,EAAO,MAAO,WACnB,EAAO,KACP,EAAE,WAAW,EAAO,IAAI,GAC1B,OAAO,EAAO,MAAO,WACnB,EAAO,KACP,EAAE,WAAW,EAAO,IAAI,EAG1B,IAAc,GAAmC,EACjD,IAAqB,EAAO,EAAQ;AAC1C,OAAmB,UAAU,GAE7B,QAAgB;EACd,IAAM,KACF,IAAS,EAAS,WAAW,EAAO,GAAG,EAAY,YAA4B,QAE7E,KAAa,MACjB,EAAmB,SAAS,YAAY,EAAuB,EAC3D,KAAW,MAAiB,EAAmB,SAAS,UAAU,EAAuB;AAK/F,SAHA,EAAQ,iBAAiB,WAAW,EAAU,EAC9C,EAAQ,iBAAiB,SAAS,EAAQ,QAE7B;AAEX,GADA,EAAQ,oBAAoB,WAAW,EAAU,EACjD,EAAQ,oBAAoB,SAAS,EAAQ;;IAE9C,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC,EAE7D,GACJ,QAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"usePermission.mjs","names":[],"sources":["../../../../src/hooks/usePermission/usePermission.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useEvent } from '../useEvent/useEvent';\n\n/** The permission name */\nexport type UsePermissionName =\n | 'accelerometer'\n | 'accessibility-events'\n | 'ambient-light-sensor'\n | 'background-sync'\n | 'camera'\n | 'clipboard-read'\n | 'clipboard-write'\n | 'gyroscope'\n | 'magnetometer'\n | 'microphone'\n | 'notifications'\n | 'payment-handler'\n | 'persistent-storage'\n | 'push'\n | 'speaker'\n | PermissionName;\n\n/** The use permission options type */\nexport interface UsePermissionOptions {\n /** Whether the permission is enabled */\n enabled: boolean;\n}\n\n/** The use permission return type */\nexport interface UsePermissionReturn {\n /** The permission state */\n state: PermissionState;\n /** The permission supported status */\n supported: boolean;\n /** The permission query function */\n query: () => Promise<PermissionState>;\n}\n\n/**\n * @name usePermission\n * @description - Hook that gives you the state of permission\n * @category Browser\n * @usage medium\n *\n * @browserapi navigator.permissions https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions\n *\n * @param {UsePermissionName} permissionDescriptorName - The permission name\n * @param {boolean} [options.enabled=true] - Whether the permission is enabled\n * @returns {UsePermissionReturn} An object containing the state and the supported status\n *\n * @example\n * const { state, supported, query } = usePermission('microphone');\n */\nexport const usePermission = (\n permissionDescriptorName: UsePermissionName,\n options?: UsePermissionOptions\n) => {\n const supported =\n typeof navigator !== 'undefined' && 'permissions' in navigator && !!navigator.permissions;\n const [state, setState] = useState<PermissionState>('prompt');\n const enabled = options?.enabled ?? true;\n\n const permissionDescriptor = { name: permissionDescriptorName };\n\n const query = useEvent(async () => {\n try {\n const permissionStatus = await navigator.permissions.query(\n permissionDescriptor as PermissionDescriptor\n );\n setState(permissionStatus.state);\n return permissionStatus.state;\n } catch {\n setState('prompt');\n return 'prompt';\n }\n });\n\n useEffect(() => {\n if (!supported || !enabled) return;\n query();\n window.addEventListener('change', query);\n return () => {\n window.removeEventListener('change', query);\n };\n }, [permissionDescriptorName, enabled]);\n\n return {\n state,\n supported,\n query\n };\n};\n"],"mappings":";;;AAsDA,IAAa,KACX,GACA,MACG;CACH,IAAM,IACJ,OAAO,YAAc,OAAe,iBAAiB,aAAa,CAAC,CAAC,UAAU,aAC1E,CAAC,GAAO,KAAY,EAA0B,SAAS,EACvD,IAAU,GAAS,WAAW,IAE9B,IAAuB,EAAE,MAAM,GAA0B,EAEzD,IAAQ,EAAS,YAAY;AACjC,MAAI;GACF,IAAM,IAAmB,MAAM,UAAU,YAAY,MACnD,EACD;AAED,UADA,EAAS,EAAiB,MAAM,EACzB,EAAiB;UAClB;AAEN,UADA,EAAS,SAAS,EACX;;GAET;AAWF,QATA,QAAgB;AACV,SAAC,KAAa,CAAC,GAGnB,QAFA,GAAO,EACP,OAAO,iBAAiB,UAAU,EAAM,QAC3B;AACX,UAAO,oBAAoB,UAAU,EAAM;;IAE5C,CAAC,GAA0B,EAAQ,CAAC,EAEhC;EACL;EACA;EACA;EACD"}
1
+ {"version":3,"file":"usePermission.mjs","names":[],"sources":["../../../../src/hooks/usePermission/usePermission.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useEvent } from '../useEvent/useEvent';\n\n/** The permission name */\nexport type UsePermissionName =\n | 'accelerometer'\n | 'accessibility-events'\n | 'ambient-light-sensor'\n | 'background-sync'\n | 'camera'\n | 'clipboard-read'\n | 'clipboard-write'\n | 'gyroscope'\n | 'magnetometer'\n | 'microphone'\n | 'notifications'\n | 'payment-handler'\n | 'persistent-storage'\n | 'push'\n | 'speaker'\n | PermissionName;\n\n/** The use permission options type */\nexport interface UsePermissionOptions {\n /** Whether the permission is enabled */\n enabled: boolean;\n}\n\n/** The use permission return type */\nexport interface UsePermissionReturn {\n /** The permission state */\n state: PermissionState;\n /** The permission supported status */\n supported: boolean;\n /** The permission query function */\n query: () => Promise<PermissionState>;\n}\n\n/**\n * @name usePermission\n * @description - Hook that gives you the state of permission\n * @category Browser\n * @usage medium\n *\n * @browserapi navigator.permissions https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions\n *\n * @param {UsePermissionName} permissionDescriptorName - The permission name\n * @param {boolean} [options.enabled=true] - Whether the permission is enabled\n * @returns {UsePermissionReturn} An object containing the state and the supported status\n *\n * @example\n * const { state, supported, query } = usePermission('microphone');\n */\nexport const usePermission = (name: UsePermissionName, options?: UsePermissionOptions) => {\n const supported =\n typeof navigator !== 'undefined' && 'permissions' in navigator && !!navigator.permissions;\n const [state, setState] = useState<PermissionState>('prompt');\n const enabled = options?.enabled ?? true;\n\n const permissionDescriptor = { name };\n\n const query = useEvent(async () => {\n try {\n const permissionStatus = await navigator.permissions.query(\n permissionDescriptor as PermissionDescriptor\n );\n setState(permissionStatus.state);\n return permissionStatus.state;\n } catch {\n setState('prompt');\n return 'prompt';\n }\n });\n\n useEffect(() => {\n if (!supported || !enabled) return;\n query();\n window.addEventListener('change', query);\n return () => {\n window.removeEventListener('change', query);\n };\n }, [name, enabled]);\n\n return {\n state,\n supported,\n query\n };\n};\n"],"mappings":";;;AAsDA,IAAa,KAAiB,GAAyB,MAAmC;CACxF,IAAM,IACJ,OAAO,YAAc,OAAe,iBAAiB,aAAa,CAAC,CAAC,UAAU,aAC1E,CAAC,GAAO,KAAY,EAA0B,SAAS,EACvD,IAAU,GAAS,WAAW,IAE9B,IAAuB,EAAE,SAAM,EAE/B,IAAQ,EAAS,YAAY;AACjC,MAAI;GACF,IAAM,IAAmB,MAAM,UAAU,YAAY,MACnD,EACD;AAED,UADA,EAAS,EAAiB,MAAM,EACzB,EAAiB;UAClB;AAEN,UADA,EAAS,SAAS,EACX;;GAET;AAWF,QATA,QAAgB;AACV,SAAC,KAAa,CAAC,GAGnB,QAFA,GAAO,EACP,OAAO,iBAAiB,UAAU,EAAM,QAC3B;AACX,UAAO,oBAAoB,UAAU,EAAM;;IAE5C,CAAC,GAAM,EAAQ,CAAC,EAEZ;EACL;EACA;EACA;EACD"}
@@ -24,7 +24,7 @@ var a = ((...a) => {
24
24
  };
25
25
  }, [s && e.getRawElement(s), d.state]);
26
26
  let g = {
27
- open: l,
27
+ opened: l,
28
28
  supported: o,
29
29
  enter: m,
30
30
  exit: h,
@@ -1 +1 @@
1
- {"version":3,"file":"usePictureInPicture.mjs","names":[],"sources":["../../../../src/hooks/usePictureInPicture/usePictureInPicture.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 use picture in picture options type */\nexport interface UsePictureInPictureOptions {\n /** The callback when Picture-in-Picture mode is entered */\n onEnter?: () => void;\n /** The callback when Picture-in-Picture mode is exited */\n onExit?: () => void;\n}\n\n/** The use picture in picture return type */\nexport interface UsePictureInPictureReturn {\n /** Whether Picture-in-Picture mode is currently active */\n open: boolean;\n /** Whether Picture-in-Picture mode is supported by the browser */\n supported: boolean;\n /** Request to enter Picture-in-Picture mode */\n enter: () => Promise<void>;\n /** Request to exit Picture-in-Picture mode */\n exit: () => Promise<void>;\n /** Toggle Picture-in-Picture mode */\n toggle: () => Promise<void>;\n}\n\nexport interface UsePictureInPicture {\n (target: HookTarget, options?: UsePictureInPictureOptions): UsePictureInPictureReturn;\n\n (options?: UsePictureInPictureOptions): UsePictureInPictureReturn & {\n ref: StateRef<HTMLVideoElement>;\n };\n}\n\n/**\n * @name usePictureInPicture\n * @description - Hook that provides Picture-in-Picture functionality for video elements\n * @category Browser\n * @usage low\n *\n * @browserapi window.PictureInPicture https://developer.mozilla.org/en-US/docs/Web/API/Picture-in-Picture_API\n *\n * @overload\n * @param {HookTarget} target The target video element\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn} An object containing Picture-in-Picture state and controls\n *\n * @example\n * const { open, supported, enter, exit, toggle } = usePictureInPicture(videoRef);\n *\n * @overload\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn & { ref: StateRef<HTMLVideoElement> }} An object containing Picture-in-Picture state, controls and ref\n *\n * @example\n * const { ref, open, supported, enter, exit, toggle } = usePictureInPicture();\n */\nexport const usePictureInPicture = ((...params: any[]) => {\n const supported =\n typeof document !== 'undefined' &&\n 'pictureInPictureEnabled' in document &&\n !!document.pictureInPictureEnabled;\n\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = ((target ? params[1] : params[0]) as UsePictureInPictureOptions) ?? {};\n\n const [open, setOpen] = useState(false);\n\n const internalRef = useRefState<HTMLVideoElement>();\n const elementRef = useRef<HTMLVideoElement>(null);\n const onOptionsRef = useRef<UsePictureInPictureOptions>(options);\n onOptionsRef.current = options;\n\n const enter = async () => {\n if (!supported) return;\n\n if (!elementRef.current) return;\n\n await elementRef.current.requestPictureInPicture();\n setOpen(true);\n\n options.onEnter?.();\n };\n\n const exit = async () => {\n if (!supported) return;\n\n await document.exitPictureInPicture();\n setOpen(false);\n options.onExit?.();\n };\n\n useEffect(() => {\n const element = target\n ? (isTarget.getElement(target) as HTMLVideoElement)\n : internalRef.current;\n if (!element) return;\n\n elementRef.current = element;\n\n const onEnterPictureInPicture = () => {\n setOpen(true);\n onOptionsRef.current.onEnter?.();\n };\n\n const onLeavePictureInPicture = () => {\n setOpen(false);\n onOptionsRef.current.onExit?.();\n };\n\n element.addEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.addEventListener('leavepictureinpicture', onLeavePictureInPicture);\n\n return () => {\n element.removeEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.removeEventListener('leavepictureinpicture', onLeavePictureInPicture);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n const toggle = async () => {\n if (open) await exit();\n else await enter();\n };\n\n const value = {\n open,\n supported,\n enter,\n exit,\n toggle\n };\n\n if (target) return value;\n return { ...value, ref: internalRef };\n}) as UsePictureInPicture;\n"],"mappings":";;;;AAiEA,IAAa,MAAwB,GAAG,MAAkB;CACxD,IAAM,IACJ,OAAO,WAAa,OACpB,6BAA6B,YAC7B,CAAC,CAAC,SAAS,yBAEP,IAAU,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC5C,KAAY,IAAS,EAAO,KAAK,EAAO,OAAsC,EAAE,EAEhF,CAAC,GAAM,KAAW,EAAS,GAAM,EAEjC,IAAc,GAA+B,EAC7C,IAAa,EAAyB,KAAK,EAC3C,IAAe,EAAmC,EAAQ;AAChE,GAAa,UAAU;CAEvB,IAAM,IAAQ,YAAY;AACnB,OAEA,EAAW,YAEhB,MAAM,EAAW,QAAQ,yBAAyB,EAClD,EAAQ,GAAK,EAEb,EAAQ,WAAW;IAGf,IAAO,YAAY;AAClB,QAEL,MAAM,SAAS,sBAAsB,EACrC,EAAQ,GAAM,EACd,EAAQ,UAAU;;AAGpB,SAAgB;EACd,IAAM,IAAU,IACX,EAAS,WAAW,EAAO,GAC5B,EAAY;AAChB,MAAI,CAAC,EAAS;AAEd,IAAW,UAAU;EAErB,IAAM,UAAgC;AAEpC,GADA,EAAQ,GAAK,EACb,EAAa,QAAQ,WAAW;KAG5B,UAAgC;AAEpC,GADA,EAAQ,GAAM,EACd,EAAa,QAAQ,UAAU;;AAMjC,SAHA,EAAQ,iBAAiB,yBAAyB,EAAwB,EAC1E,EAAQ,iBAAiB,yBAAyB,EAAwB,QAE7D;AAEX,GADA,EAAQ,oBAAoB,yBAAyB,EAAwB,EAC7E,EAAQ,oBAAoB,yBAAyB,EAAwB;;IAE9E,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC;CAOjE,IAAM,IAAQ;EACZ;EACA;EACA;EACA;EACA,QAVa,YAAY;AACzB,GAAI,IAAM,MAAM,GAAM,GACjB,MAAM,GAAO;;EASnB;AAGD,QADI,IAAe,IACZ;EAAE,GAAG;EAAO,KAAK;EAAa"}
1
+ {"version":3,"file":"usePictureInPicture.mjs","names":[],"sources":["../../../../src/hooks/usePictureInPicture/usePictureInPicture.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 use picture in picture options type */\nexport interface UsePictureInPictureOptions {\n /** The callback when Picture-in-Picture mode is entered */\n onEnter?: () => void;\n /** The callback when Picture-in-Picture mode is exited */\n onExit?: () => void;\n}\n\n/** The use picture in picture return type */\nexport interface UsePictureInPictureReturn {\n /** Whether Picture-in-Picture mode is currently active */\n opened: boolean;\n /** Whether Picture-in-Picture mode is supported by the browser */\n supported: boolean;\n /** Request to enter Picture-in-Picture mode */\n enter: () => Promise<void>;\n /** Request to exit Picture-in-Picture mode */\n exit: () => Promise<void>;\n /** Toggle Picture-in-Picture mode */\n toggle: () => Promise<void>;\n}\n\nexport interface UsePictureInPicture {\n (target: HookTarget, options?: UsePictureInPictureOptions): UsePictureInPictureReturn;\n\n (options?: UsePictureInPictureOptions): UsePictureInPictureReturn & {\n ref: StateRef<HTMLVideoElement>;\n };\n}\n\n/**\n * @name usePictureInPicture\n * @description - Hook that provides Picture-in-Picture functionality for video elements\n * @category Browser\n * @usage low\n *\n * @browserapi window.PictureInPicture https://developer.mozilla.org/en-US/docs/Web/API/Picture-in-Picture_API\n *\n * @overload\n * @param {HookTarget} target The target video element\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn} An object containing Picture-in-Picture state and controls\n *\n * @example\n * const { open, supported, enter, exit, toggle } = usePictureInPicture(videoRef);\n *\n * @overload\n * @param {() => void} [options.onEnter] Callback when Picture-in-Picture mode is entered\n * @param {() => void} [options.onExit] Callback when Picture-in-Picture mode is exited\n * @returns {UsePictureInPictureReturn & { ref: StateRef<HTMLVideoElement> }} An object containing Picture-in-Picture state, controls and ref\n *\n * @example\n * const { ref, open, supported, enter, exit, toggle } = usePictureInPicture();\n */\nexport const usePictureInPicture = ((...params: any[]) => {\n const supported =\n typeof document !== 'undefined' &&\n 'pictureInPictureEnabled' in document &&\n !!document.pictureInPictureEnabled;\n\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = ((target ? params[1] : params[0]) as UsePictureInPictureOptions) ?? {};\n\n const [opened, setOpened] = useState(false);\n\n const internalRef = useRefState<HTMLVideoElement>();\n const elementRef = useRef<HTMLVideoElement>(null);\n const onOptionsRef = useRef<UsePictureInPictureOptions>(options);\n onOptionsRef.current = options;\n\n const enter = async () => {\n if (!supported) return;\n\n if (!elementRef.current) return;\n\n await elementRef.current.requestPictureInPicture();\n setOpened(true);\n\n options.onEnter?.();\n };\n\n const exit = async () => {\n if (!supported) return;\n\n await document.exitPictureInPicture();\n setOpened(false);\n options.onExit?.();\n };\n\n useEffect(() => {\n const element = target\n ? (isTarget.getElement(target) as HTMLVideoElement)\n : internalRef.current;\n if (!element) return;\n\n elementRef.current = element;\n\n const onEnterPictureInPicture = () => {\n setOpened(true);\n onOptionsRef.current.onEnter?.();\n };\n\n const onLeavePictureInPicture = () => {\n setOpened(false);\n onOptionsRef.current.onExit?.();\n };\n\n element.addEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.addEventListener('leavepictureinpicture', onLeavePictureInPicture);\n\n return () => {\n element.removeEventListener('enterpictureinpicture', onEnterPictureInPicture);\n element.removeEventListener('leavepictureinpicture', onLeavePictureInPicture);\n };\n }, [target && isTarget.getRawElement(target), internalRef.state]);\n\n const toggle = async () => {\n if (opened) await exit();\n else await enter();\n };\n\n const value = {\n opened,\n supported,\n enter,\n exit,\n toggle\n };\n\n if (target) return value;\n return { ...value, ref: internalRef };\n}) as UsePictureInPicture;\n"],"mappings":";;;;AAiEA,IAAa,MAAwB,GAAG,MAAkB;CACxD,IAAM,IACJ,OAAO,WAAa,OACpB,6BAA6B,YAC7B,CAAC,CAAC,SAAS,yBAEP,IAAU,EAAS,EAAO,GAAG,GAAG,EAAO,KAAK,KAAA,GAC5C,KAAY,IAAS,EAAO,KAAK,EAAO,OAAsC,EAAE,EAEhF,CAAC,GAAQ,KAAa,EAAS,GAAM,EAErC,IAAc,GAA+B,EAC7C,IAAa,EAAyB,KAAK,EAC3C,IAAe,EAAmC,EAAQ;AAChE,GAAa,UAAU;CAEvB,IAAM,IAAQ,YAAY;AACnB,OAEA,EAAW,YAEhB,MAAM,EAAW,QAAQ,yBAAyB,EAClD,EAAU,GAAK,EAEf,EAAQ,WAAW;IAGf,IAAO,YAAY;AAClB,QAEL,MAAM,SAAS,sBAAsB,EACrC,EAAU,GAAM,EAChB,EAAQ,UAAU;;AAGpB,SAAgB;EACd,IAAM,IAAU,IACX,EAAS,WAAW,EAAO,GAC5B,EAAY;AAChB,MAAI,CAAC,EAAS;AAEd,IAAW,UAAU;EAErB,IAAM,UAAgC;AAEpC,GADA,EAAU,GAAK,EACf,EAAa,QAAQ,WAAW;KAG5B,UAAgC;AAEpC,GADA,EAAU,GAAM,EAChB,EAAa,QAAQ,UAAU;;AAMjC,SAHA,EAAQ,iBAAiB,yBAAyB,EAAwB,EAC1E,EAAQ,iBAAiB,yBAAyB,EAAwB,QAE7D;AAEX,GADA,EAAQ,oBAAoB,yBAAyB,EAAwB,EAC7E,EAAQ,oBAAoB,yBAAyB,EAAwB;;IAE9E,CAAC,KAAU,EAAS,cAAc,EAAO,EAAE,EAAY,MAAM,CAAC;CAOjE,IAAM,IAAQ;EACZ;EACA;EACA;EACA;EACA,QAVa,YAAY;AACzB,GAAI,IAAQ,MAAM,GAAM,GACnB,MAAM,GAAO;;EASnB;AAGD,QADI,IAAe,IACZ;EAAE,GAAG;EAAO,KAAK;EAAa"}
@@ -20,7 +20,7 @@ var o = ((o) => {
20
20
  });
21
21
  let s = t(o, e);
22
22
  return a === "replace" && window.history.replaceState({}, "", s), a === "push" && window.history.pushState({}, "", s), n(), o;
23
- }, m = (e) => typeof e == "string" ? m(new URLSearchParams(e)) : e instanceof URLSearchParams ? Array.from(e.entries()).reduce((e, [t, n]) => (e[t] = f(n), e), {}) : e, [h, g] = a(() => {
23
+ }, m = (e) => typeof e == "string" ? m(new URLSearchParams(e)) : e instanceof URLSearchParams ? [...e.entries()].reduce((e, [t, n]) => (e[t] = f(n), e), {}) : e, [h, g] = a(() => {
24
24
  if (typeof window > "u") return c ?? {};
25
25
  let e = r(l), t = {
26
26
  ...c && m(c),
@@ -1 +1 @@
1
- {"version":3,"file":"useUrlSearchParams.mjs","names":[],"sources":["../../../../src/hooks/useUrlSearchParams/useUrlSearchParams.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport {\n createQueryString,\n dispatchUrlSearchParamsEvent,\n getUrlSearchParams,\n URL_SEARCH_PARAMS_EVENT\n} from '../useUrlSearchParam/useUrlSearchParam';\n\n/** The url params type */\nexport type UrlParams = Record<string, any>;\n\n/** The url search params mod */\nexport type UrlSearchParamsMode = 'hash-params' | 'hash' | 'history';\n\n/** The use url search params set options type */\nexport interface UseUrlSearchParamsSetOptions {\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n}\n\n/* The use search params initial value type */\nexport type UseUrlSearchParamsInitialValue<Value> = (() => Value) | Value;\n\n/** The use url search params options type */\nexport interface UseUrlSearchParamsOptions<Value> {\n /** The mode to use for writing to the URL */\n mode?: UrlSearchParamsMode;\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n /* The deserializer function to be invoked */\n deserializer?: (value: string) => Value[keyof Value];\n /* The serializer function to be invoked */\n serializer?: (value: Value[keyof Value]) => string;\n}\n\n/** The use url search params return type */\nexport interface UseUrlSearchParamsReturn<Value> {\n /** The value of the url search params */\n value: Value;\n /** The set function */\n set: (value: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => void;\n}\n\nexport interface UseUrlSearchParams {\n <Value>(\n key: string,\n options: UseUrlSearchParamsOptions<Value> & {\n initialValue: UseUrlSearchParamsInitialValue<Value>;\n }\n ): UseUrlSearchParamsReturn<Value>;\n\n <Value>(options?: UseUrlSearchParamsOptions<Value>): UseUrlSearchParamsReturn<Value | undefined>;\n\n <Value>(initialValue: UseUrlSearchParamsInitialValue<Value>): UseUrlSearchParamsReturn<Value>;\n\n <Value>(key: string): UseUrlSearchParamsReturn<Value | undefined>;\n}\n\n/**\n * @name useUrlSearchParams\n * @description - Hook that provides reactive URLSearchParams\n * @category State\n * @usage high\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsOptions<Value> & { initialValue: UseUrlSearchParamsInitialValue<Value> }} options The options object with required initialValue\n * @param {UseUrlSearchParamsInitialValue<Value>} [options.initialValue] The initial value for the url params\n * @param {UrlSearchParamsMode} [options.mode='history'] The mode to use for the URL ('history' | 'hash-params' | 'hash')\n * @param {'push' | 'replace'} [options.write='replace'] The mode to use for writing to the URL\n * @param {(value: Value[keyof Value]) => string} [options.serializer] Custom serializer function to convert value to string\n * @param {(value: string) => Value[keyof Value]} [options.deserializer] Custom deserializer function to convert string to value\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ initialValue: { page: 1 } });\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsInitialValue<Value>} [initialValue] The initial value for the url params\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ page: 1 });\n */\nexport const useUrlSearchParams = (<Value extends UrlParams>(\n params: any\n): UseUrlSearchParamsReturn<Value> => {\n const options = (\n typeof params === 'object' &&\n params &&\n ('serializer' in params ||\n 'deserializer' in params ||\n 'initialValue' in params ||\n 'mode' in params ||\n 'write' in params)\n ? params\n : undefined\n ) as\n | (UseUrlSearchParamsOptions<Value> & {\n initialValue?: UseUrlSearchParamsInitialValue<Value>;\n })\n | undefined;\n const initialValue = (\n options ? options?.initialValue : params\n ) as UseUrlSearchParamsInitialValue<Value>;\n\n const { mode = 'history', write: writeMode = 'replace' } = options ?? {};\n\n const serializer = (value: Value[keyof Value]) => {\n if (options?.serializer) return options.serializer(value);\n if (typeof value === 'string') return value;\n return JSON.stringify(value);\n };\n\n const deserializer = (value: string) => {\n if (options?.deserializer) return options.deserializer(value);\n if (value === 'undefined') return undefined as unknown as Value[keyof Value];\n\n try {\n return JSON.parse(value) as Value;\n } catch {\n return value as Value[keyof Value];\n }\n };\n\n const setUrlSearchParams = <Value extends UrlParams>(\n mode: UrlSearchParamsMode,\n value: Partial<Value>,\n write: 'push' | 'replace' = 'replace'\n ) => {\n const urlSearchParams = getUrlSearchParams(mode);\n\n Object.entries(value).forEach(([key, param]) => {\n if (param === undefined) {\n urlSearchParams.delete(key);\n } else {\n const serializedValue = serializer ? serializer(param) : String(param);\n urlSearchParams.set(key, serializedValue);\n }\n });\n\n const query = createQueryString(urlSearchParams, mode);\n if (write === 'replace') window.history.replaceState({}, '', query);\n if (write === 'push') window.history.pushState({}, '', query);\n dispatchUrlSearchParamsEvent();\n\n return urlSearchParams;\n };\n\n const getParsedUrlSearchParams = (searchParams: string | UrlParams | URLSearchParams) => {\n if (typeof searchParams === 'string') {\n return getParsedUrlSearchParams(new URLSearchParams(searchParams));\n }\n\n if (searchParams instanceof URLSearchParams) {\n return Array.from(searchParams.entries()).reduce(\n (acc, [key, value]) => {\n acc[key] = deserializer(value);\n return acc;\n },\n {} as Record<string, any>\n );\n }\n\n return searchParams;\n };\n\n const [value, setValue] = useState<Value>(() => {\n if (typeof window === 'undefined') return (initialValue ?? {}) as Value;\n\n const urlSearchParams = getUrlSearchParams(mode);\n const value = {\n ...(initialValue && getParsedUrlSearchParams(initialValue)),\n ...getParsedUrlSearchParams(urlSearchParams)\n } as Value;\n\n setUrlSearchParams(mode, value, writeMode);\n\n return value;\n });\n\n const set = (params: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => {\n const searchParams = setUrlSearchParams(\n mode,\n { ...value, ...params },\n options?.write ?? writeMode\n );\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n useEffect(() => {\n const onParamsChange = () => {\n const searchParams = getUrlSearchParams(mode);\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n window.addEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.addEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.addEventListener('hashchange', onParamsChange);\n\n return () => {\n window.removeEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.removeEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.removeEventListener('hashchange', onParamsChange);\n };\n }, [mode]);\n\n return {\n value,\n set\n };\n}) as UseUrlSearchParams;\n\nexport { createQueryString, dispatchUrlSearchParamsEvent, getUrlSearchParams };\n"],"mappings":";;;AAsFA,IAAa,MACX,MACoC;CACpC,IAAM,IACJ,OAAO,KAAW,YAClB,MACC,gBAAgB,KACf,kBAAkB,KAClB,kBAAkB,KAClB,UAAU,KACV,WAAW,KACT,IACA,KAAA,GAMA,IACJ,IAAU,GAAS,eAAe,GAG9B,EAAE,UAAO,WAAW,OAAO,IAAY,cAAc,KAAW,EAAE,EAElE,KAAc,MACd,GAAS,aAAmB,EAAQ,WAAW,EAAM,GACrD,OAAO,KAAU,WAAiB,IAC/B,KAAK,UAAU,EAAM,EAGxB,KAAgB,MAAkB;AACtC,MAAI,GAAS,aAAc,QAAO,EAAQ,aAAa,EAAM;AACzD,YAAU,YAEd,KAAI;AACF,UAAO,KAAK,MAAM,EAAM;UAClB;AACN,UAAO;;IAIL,KACJ,GACA,GACA,IAA4B,cACzB;EACH,IAAM,IAAkB,EAAmB,EAAK;AAEhD,SAAO,QAAQ,EAAM,CAAC,SAAS,CAAC,GAAK,OAAW;AAC9C,OAAI,MAAU,KAAA,EACZ,GAAgB,OAAO,EAAI;QACtB;IACL,IAAM,IAAkB,IAAa,EAAW,EAAM,GAAG,OAAO,EAAM;AACtE,MAAgB,IAAI,GAAK,EAAgB;;IAE3C;EAEF,IAAM,IAAQ,EAAkB,GAAiB,EAAK;AAKtD,SAJI,MAAU,aAAW,OAAO,QAAQ,aAAa,EAAE,EAAE,IAAI,EAAM,EAC/D,MAAU,UAAQ,OAAO,QAAQ,UAAU,EAAE,EAAE,IAAI,EAAM,EAC7D,GAA8B,EAEvB;IAGH,KAA4B,MAC5B,OAAO,KAAiB,WACnB,EAAyB,IAAI,gBAAgB,EAAa,CAAC,GAGhE,aAAwB,kBACnB,MAAM,KAAK,EAAa,SAAS,CAAC,CAAC,QACvC,GAAK,CAAC,GAAK,QACV,EAAI,KAAO,EAAa,EAAM,EACvB,IAET,EAAE,CACH,GAGI,GAGH,CAAC,GAAO,KAAY,QAAsB;AAC9C,MAAI,OAAO,SAAW,IAAa,QAAQ,KAAgB,EAAE;EAE7D,IAAM,IAAkB,EAAmB,EAAK,EAC1C,IAAQ;GACZ,GAAI,KAAgB,EAAyB,EAAa;GAC1D,GAAG,EAAyB,EAAgB;GAC7C;AAID,SAFA,EAAmB,GAAM,GAAO,EAAU,EAEnC;GACP;AA4BF,QAjBA,QAAgB;EACd,IAAM,UAAuB;AAE3B,KAAS,EADY,EAAmB,EAAK,CACE,CAAU;;AAO3D,SAJA,OAAO,iBAAiB,GAAyB,EAAe,EAChE,OAAO,iBAAiB,YAAY,EAAe,EAC/C,MAAS,aAAW,OAAO,iBAAiB,cAAc,EAAe,QAEhE;AAGX,GAFA,OAAO,oBAAoB,GAAyB,EAAe,EACnE,OAAO,oBAAoB,YAAY,EAAe,EAClD,MAAS,aAAW,OAAO,oBAAoB,cAAc,EAAe;;IAEjF,CAAC,EAAK,CAAC,EAEH;EACL;EACA,MA5BW,GAAwB,MAA2C;AAM9E,KAAS,EALY,EACnB,GACA;IAAE,GAAG;IAAO,GAAG;IAAQ,EACvB,GAAS,SAAS,EACnB,CAC8C,CAAU;;EAuB1D"}
1
+ {"version":3,"file":"useUrlSearchParams.mjs","names":[],"sources":["../../../../src/hooks/useUrlSearchParams/useUrlSearchParams.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport {\n createQueryString,\n dispatchUrlSearchParamsEvent,\n getUrlSearchParams,\n URL_SEARCH_PARAMS_EVENT\n} from '../useUrlSearchParam/useUrlSearchParam';\n\n/** The url params type */\nexport type UrlParams = Record<string, any>;\n\n/** The url search params mod */\nexport type UrlSearchParamsMode = 'hash-params' | 'hash' | 'history';\n\n/** The use url search params set options type */\nexport interface UseUrlSearchParamsSetOptions {\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n}\n\n/* The use search params initial value type */\nexport type UseUrlSearchParamsInitialValue<Value> = (() => Value) | Value;\n\n/** The use url search params options type */\nexport interface UseUrlSearchParamsOptions<Value> {\n /** The mode to use for writing to the URL */\n mode?: UrlSearchParamsMode;\n /** The mode to use for writing to the URL */\n write?: 'push' | 'replace';\n /* The deserializer function to be invoked */\n deserializer?: (value: string) => Value[keyof Value];\n /* The serializer function to be invoked */\n serializer?: (value: Value[keyof Value]) => string;\n}\n\n/** The use url search params return type */\nexport interface UseUrlSearchParamsReturn<Value> {\n /** The value of the url search params */\n value: Value;\n /** The set function */\n set: (value: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => void;\n}\n\nexport interface UseUrlSearchParams {\n <Value>(\n options: UseUrlSearchParamsOptions<Value> & {\n initialValue: UseUrlSearchParamsInitialValue<Value>;\n }\n ): UseUrlSearchParamsReturn<Value>;\n\n <Value>(options?: UseUrlSearchParamsOptions<Value>): UseUrlSearchParamsReturn<Value | undefined>;\n\n <Value>(initialValue: UseUrlSearchParamsInitialValue<Value>): UseUrlSearchParamsReturn<Value>;\n}\n\n/**\n * @name useUrlSearchParams\n * @description - Hook that provides reactive URLSearchParams\n * @category State\n * @usage high\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsOptions<Value> & { initialValue: UseUrlSearchParamsInitialValue<Value> }} options The options object with required initialValue\n * @param {UseUrlSearchParamsInitialValue<Value>} [options.initialValue] The initial value for the url params\n * @param {UrlSearchParamsMode} [options.mode='history'] The mode to use for the URL ('history' | 'hash-params' | 'hash')\n * @param {'push' | 'replace'} [options.write='replace'] The mode to use for writing to the URL\n * @param {(value: Value[keyof Value]) => string} [options.serializer] Custom serializer function to convert value to string\n * @param {(value: string) => Value[keyof Value]} [options.deserializer] Custom deserializer function to convert string to value\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ initialValue: { page: 1 } });\n *\n * @overload\n * @template Value The type of the url param values\n * @param {UseUrlSearchParamsInitialValue<Value>} [initialValue] The initial value for the url params\n * @returns {UseUrlSearchParamsReturn<Value>} The object with value and function for change value\n *\n * @example\n * const { value, set } = useUrlSearchParams({ page: 1 });\n */\nexport const useUrlSearchParams = (<Value extends UrlParams>(\n params: any\n): UseUrlSearchParamsReturn<Value> => {\n const options = (\n typeof params === 'object' &&\n params &&\n ('serializer' in params ||\n 'deserializer' in params ||\n 'initialValue' in params ||\n 'mode' in params ||\n 'write' in params)\n ? params\n : undefined\n ) as\n | (UseUrlSearchParamsOptions<Value> & {\n initialValue?: UseUrlSearchParamsInitialValue<Value>;\n })\n | undefined;\n const initialValue = (\n options ? options?.initialValue : params\n ) as UseUrlSearchParamsInitialValue<Value>;\n\n const { mode = 'history', write: writeMode = 'replace' } = options ?? {};\n\n const serializer = (value: Value[keyof Value]) => {\n if (options?.serializer) return options.serializer(value);\n if (typeof value === 'string') return value;\n return JSON.stringify(value);\n };\n\n const deserializer = (value: string) => {\n if (options?.deserializer) return options.deserializer(value);\n if (value === 'undefined') return undefined as unknown as Value[keyof Value];\n\n try {\n return JSON.parse(value) as Value;\n } catch {\n return value as Value[keyof Value];\n }\n };\n\n const setUrlSearchParams = <Value extends UrlParams>(\n mode: UrlSearchParamsMode,\n value: Partial<Value>,\n write: 'push' | 'replace' = 'replace'\n ) => {\n const urlSearchParams = getUrlSearchParams(mode);\n\n Object.entries(value).forEach(([key, param]) => {\n if (param === undefined) {\n urlSearchParams.delete(key);\n } else {\n const serializedValue = serializer ? serializer(param) : String(param);\n urlSearchParams.set(key, serializedValue);\n }\n });\n\n const query = createQueryString(urlSearchParams, mode);\n if (write === 'replace') window.history.replaceState({}, '', query);\n if (write === 'push') window.history.pushState({}, '', query);\n dispatchUrlSearchParamsEvent();\n\n return urlSearchParams;\n };\n\n const getParsedUrlSearchParams = (searchParams: string | UrlParams | URLSearchParams) => {\n if (typeof searchParams === 'string') {\n return getParsedUrlSearchParams(new URLSearchParams(searchParams));\n }\n\n if (searchParams instanceof URLSearchParams) {\n return [...searchParams.entries()].reduce(\n (acc, [key, value]) => {\n acc[key] = deserializer(value);\n return acc;\n },\n {} as Record<string, any>\n );\n }\n\n return searchParams;\n };\n\n const [value, setValue] = useState<Value>(() => {\n if (typeof window === 'undefined') return (initialValue ?? {}) as Value;\n\n const urlSearchParams = getUrlSearchParams(mode);\n const value = {\n ...(initialValue && getParsedUrlSearchParams(initialValue)),\n ...getParsedUrlSearchParams(urlSearchParams)\n } as Value;\n\n setUrlSearchParams(mode, value, writeMode);\n\n return value;\n });\n\n const set = (params: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => {\n const searchParams = setUrlSearchParams(\n mode,\n { ...value, ...params },\n options?.write ?? writeMode\n );\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n useEffect(() => {\n const onParamsChange = () => {\n const searchParams = getUrlSearchParams(mode);\n setValue(getParsedUrlSearchParams(searchParams) as Value);\n };\n\n window.addEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.addEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.addEventListener('hashchange', onParamsChange);\n\n return () => {\n window.removeEventListener(URL_SEARCH_PARAMS_EVENT, onParamsChange);\n window.removeEventListener('popstate', onParamsChange);\n if (mode !== 'history') window.removeEventListener('hashchange', onParamsChange);\n };\n }, [mode]);\n\n return {\n value,\n set\n };\n}) as UseUrlSearchParams;\n\nexport { createQueryString, dispatchUrlSearchParamsEvent, getUrlSearchParams };\n"],"mappings":";;;AAmFA,IAAa,MACX,MACoC;CACpC,IAAM,IACJ,OAAO,KAAW,YAClB,MACC,gBAAgB,KACf,kBAAkB,KAClB,kBAAkB,KAClB,UAAU,KACV,WAAW,KACT,IACA,KAAA,GAMA,IACJ,IAAU,GAAS,eAAe,GAG9B,EAAE,UAAO,WAAW,OAAO,IAAY,cAAc,KAAW,EAAE,EAElE,KAAc,MACd,GAAS,aAAmB,EAAQ,WAAW,EAAM,GACrD,OAAO,KAAU,WAAiB,IAC/B,KAAK,UAAU,EAAM,EAGxB,KAAgB,MAAkB;AACtC,MAAI,GAAS,aAAc,QAAO,EAAQ,aAAa,EAAM;AACzD,YAAU,YAEd,KAAI;AACF,UAAO,KAAK,MAAM,EAAM;UAClB;AACN,UAAO;;IAIL,KACJ,GACA,GACA,IAA4B,cACzB;EACH,IAAM,IAAkB,EAAmB,EAAK;AAEhD,SAAO,QAAQ,EAAM,CAAC,SAAS,CAAC,GAAK,OAAW;AAC9C,OAAI,MAAU,KAAA,EACZ,GAAgB,OAAO,EAAI;QACtB;IACL,IAAM,IAAkB,IAAa,EAAW,EAAM,GAAG,OAAO,EAAM;AACtE,MAAgB,IAAI,GAAK,EAAgB;;IAE3C;EAEF,IAAM,IAAQ,EAAkB,GAAiB,EAAK;AAKtD,SAJI,MAAU,aAAW,OAAO,QAAQ,aAAa,EAAE,EAAE,IAAI,EAAM,EAC/D,MAAU,UAAQ,OAAO,QAAQ,UAAU,EAAE,EAAE,IAAI,EAAM,EAC7D,GAA8B,EAEvB;IAGH,KAA4B,MAC5B,OAAO,KAAiB,WACnB,EAAyB,IAAI,gBAAgB,EAAa,CAAC,GAGhE,aAAwB,kBACnB,CAAC,GAAG,EAAa,SAAS,CAAC,CAAC,QAChC,GAAK,CAAC,GAAK,QACV,EAAI,KAAO,EAAa,EAAM,EACvB,IAET,EAAE,CACH,GAGI,GAGH,CAAC,GAAO,KAAY,QAAsB;AAC9C,MAAI,OAAO,SAAW,IAAa,QAAQ,KAAgB,EAAE;EAE7D,IAAM,IAAkB,EAAmB,EAAK,EAC1C,IAAQ;GACZ,GAAI,KAAgB,EAAyB,EAAa;GAC1D,GAAG,EAAyB,EAAgB;GAC7C;AAID,SAFA,EAAmB,GAAM,GAAO,EAAU,EAEnC;GACP;AA4BF,QAjBA,QAAgB;EACd,IAAM,UAAuB;AAE3B,KAAS,EADY,EAAmB,EAAK,CACE,CAAU;;AAO3D,SAJA,OAAO,iBAAiB,GAAyB,EAAe,EAChE,OAAO,iBAAiB,YAAY,EAAe,EAC/C,MAAS,aAAW,OAAO,iBAAiB,cAAc,EAAe,QAEhE;AAGX,GAFA,OAAO,oBAAoB,GAAyB,EAAe,EACnE,OAAO,oBAAoB,YAAY,EAAe,EAClD,MAAS,aAAW,OAAO,oBAAoB,cAAc,EAAe;;IAEjF,CAAC,EAAK,CAAC,EAEH;EACL;EACA,MA5BW,GAAwB,MAA2C;AAM9E,KAAS,EALY,EACnB,GACA;IAAE,GAAG;IAAO,GAAG;IAAQ,EACvB,GAAS,SAAS,EACnB,CAC8C,CAAU;;EAuB1D"}
@@ -9,9 +9,7 @@ export interface UseAutoScrollOptions {
9
9
  }
10
10
  export interface UseAutoScroll {
11
11
  (target: HookTarget, options?: UseAutoScrollOptions): void;
12
- <Target extends HTMLElement>(options?: UseAutoScrollOptions): {
13
- ref: StateRef<Target>;
14
- };
12
+ <Target extends HTMLElement>(options?: UseAutoScrollOptions): StateRef<Target>;
15
13
  }
16
14
  /**
17
15
  * @name useAutoScroll
@@ -30,9 +28,9 @@ export interface UseAutoScroll {
30
28
  * @overload
31
29
  * @template Target
32
30
  * @param {boolean} [options.enabled] Whether auto-scrolling is enabled
33
- * @returns {{ ref: StateRef<Target> }} A React ref to attach to the list element
31
+ * @returns {StateRef<Target>} A React ref to attach to the list element
34
32
  *
35
33
  * @example
36
- * const { ref } = useAutoScroll();
34
+ * const ref = useAutoScroll();
37
35
  */
38
36
  export declare const useAutoScroll: UseAutoScroll;
@@ -2,9 +2,7 @@ import { HookTarget } from '../../utils/helpers';
2
2
  import { StateRef } from '../useRefState/useRefState';
3
3
  export interface UseClickOutside {
4
4
  (target: HookTarget, callback: (event: Event) => void): void;
5
- <Target extends Element>(callback: (event: Event) => void, target?: never): {
6
- ref: StateRef<Target>;
7
- };
5
+ <Target extends Element>(callback: (event: Event) => void, target?: never): StateRef<Target>;
8
6
  }
9
7
  /**
10
8
  * @name useClickOutside
@@ -23,10 +21,10 @@ export interface UseClickOutside {
23
21
  * @overload
24
22
  * @template Target The target element(s)
25
23
  * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected
26
- * @returns {{ ref: StateRef<Target> }} A ref to attach to the target element
24
+ * @returns {StateRef<Target>} A ref to attach to the target element
27
25
  *
28
26
  * @example
29
- * const { ref } = useClickOutside<HTMLDivElement>(() => console.log('click outside'));
27
+ * const ref = useClickOutside<HTMLDivElement>(() => console.log('click outside'));
30
28
  *
31
29
  * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useClickOutside.html}
32
30
  */
@@ -10,9 +10,7 @@ export interface UseDoubleClickOptions {
10
10
  }
11
11
  export interface UseDoubleClick {
12
12
  (target: HookTarget, callback: (event: DoubleClickEvents) => void, options?: UseDoubleClickOptions): void;
13
- <Target extends Element>(callback: (event: DoubleClickEvents) => void, options?: UseDoubleClickOptions, target?: never): {
14
- ref: StateRef<Target>;
15
- };
13
+ <Target extends Element>(callback: (event: DoubleClickEvents) => void, options?: UseDoubleClickOptions, target?: never): StateRef<Target>;
16
14
  }
17
15
  export declare const DEFAULT_THRESHOLD_TIME = 300;
18
16
  /**
@@ -34,10 +32,10 @@ export declare const DEFAULT_THRESHOLD_TIME = 300;
34
32
  * @template Target The target element
35
33
  * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click
36
34
  * @param {UseDoubleClickOptions} [options] The options for the double click
37
- * @returns {{ ref: StateRef<Target> }} The double clicking state
35
+ * @returns {StateRef<Target>} The double clicking state
38
36
  *
39
37
  * @example
40
- * const { ref } = useDoubleClick(() => console.log('double clicked'));
38
+ * const ref = useDoubleClick(() => console.log('double clicked'));
41
39
  *
42
40
  * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useDoubleClick.html}
43
41
  */
@@ -13,9 +13,7 @@ export interface UseKeyPressEventOptions {
13
13
  }
14
14
  export interface UseKeyPressEvent {
15
15
  (target: HookTarget | Window, key: UseKeyPressEventKey, listener: (event: KeyboardEvent) => void, options?: UseKeyPressEventOptions): void;
16
- <Target extends Element>(key: UseKeyPressEventKey, listener: (event: KeyboardEvent) => void, options?: UseKeyPressEventOptions, target?: never): {
17
- ref: StateRef<Target>;
18
- };
16
+ <Target extends Element>(key: UseKeyPressEventKey, listener: (event: KeyboardEvent) => void, options?: UseKeyPressEventOptions, target?: never): StateRef<Target>;
19
17
  }
20
18
  /**
21
19
  * @name useKeyPressEvent
@@ -38,7 +36,7 @@ export interface UseKeyPressEvent {
38
36
  * @param {UseKeyPressEventKey} key The key or array of keys to listen for.
39
37
  * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.
40
38
  * @param {UseKeyPressEventOptions} [options] The options for the event listener.
41
- * @returns {{ ref: StateRef<Target> }} An object containing the ref
39
+ * @returns {StateRef<Target>} A ref to attach to the target element
42
40
  *
43
41
  * @example
44
42
  * const ref = useKeyPressEvent('Enter', (event) => console.log('pressed'));
@@ -14,12 +14,8 @@ export interface UseKeyboardEventOptions {
14
14
  export interface UseKeyboard {
15
15
  (target: HookTarget, callback: KeyboardEventHandler): void;
16
16
  (target: HookTarget, options: UseKeyboardEventOptions): void;
17
- <Target extends HTMLElement>(callback: KeyboardEventHandler, target?: never): {
18
- ref: StateRef<Target>;
19
- };
20
- <Target extends HTMLElement>(options: UseKeyboardEventOptions, target?: never): {
21
- ref: StateRef<Target>;
22
- };
17
+ <Target extends HTMLElement>(callback: KeyboardEventHandler, target?: never): StateRef<Target>;
18
+ <Target extends HTMLElement>(options: UseKeyboardEventOptions, target?: never): StateRef<Target>;
23
19
  }
24
20
  /**
25
21
  * @name useKeyboard
@@ -46,17 +42,17 @@ export interface UseKeyboard {
46
42
  * @overload
47
43
  * @template Target The target element type
48
44
  * @param {KeyboardEventHandler} callback The callback function to be invoked on key down
49
- * @returns {{ ref: StateRef<Target> }} An object containing the ref
45
+ * @returns {StateRef<Target>} A ref to attach to the target element
50
46
  *
51
47
  * @example
52
- * const keyboard = useKeyboard((event) => console.log('key down'));
48
+ * const ref = useKeyboard((event) => console.log('key down'));
53
49
  *
54
50
  * @overload
55
51
  * @template Target The target element type
56
52
  * @param {UseKeyboardEventOptions} [options] The keyboard event options
57
- * @returns {{ ref: StateRef<Target> }} An object containing the ref
53
+ * @returns {StateRef<Target>} A ref to attach to the target element
58
54
  *
59
55
  * @example
60
- * const keyboard = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });
56
+ * const ref = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });
61
57
  */
62
58
  export declare const useKeyboard: UseKeyboard;
@@ -29,7 +29,7 @@ export interface UsePermissionReturn {
29
29
  * @example
30
30
  * const { state, supported, query } = usePermission('microphone');
31
31
  */
32
- export declare const usePermission: (permissionDescriptorName: UsePermissionName, options?: UsePermissionOptions) => {
32
+ export declare const usePermission: (name: UsePermissionName, options?: UsePermissionOptions) => {
33
33
  state: PermissionState;
34
34
  supported: boolean;
35
35
  query: () => Promise<PermissionState>;
@@ -10,7 +10,7 @@ export interface UsePictureInPictureOptions {
10
10
  /** The use picture in picture return type */
11
11
  export interface UsePictureInPictureReturn {
12
12
  /** Whether Picture-in-Picture mode is currently active */
13
- open: boolean;
13
+ opened: boolean;
14
14
  /** Whether Picture-in-Picture mode is supported by the browser */
15
15
  supported: boolean;
16
16
  /** Request to enter Picture-in-Picture mode */
@@ -26,12 +26,11 @@ export interface UseUrlSearchParamsReturn<Value> {
26
26
  set: (value: Partial<Value>, options?: UseUrlSearchParamsSetOptions) => void;
27
27
  }
28
28
  export interface UseUrlSearchParams {
29
- <Value>(key: string, options: UseUrlSearchParamsOptions<Value> & {
29
+ <Value>(options: UseUrlSearchParamsOptions<Value> & {
30
30
  initialValue: UseUrlSearchParamsInitialValue<Value>;
31
31
  }): UseUrlSearchParamsReturn<Value>;
32
32
  <Value>(options?: UseUrlSearchParamsOptions<Value>): UseUrlSearchParamsReturn<Value | undefined>;
33
33
  <Value>(initialValue: UseUrlSearchParamsInitialValue<Value>): UseUrlSearchParamsReturn<Value>;
34
- <Value>(key: string): UseUrlSearchParamsReturn<Value | undefined>;
35
34
  }
36
35
  /**
37
36
  * @name useUrlSearchParams
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@siberiacancode/reactuse",
3
- "version": "0.3.17",
3
+ "version": "0.3.19",
4
4
  "description": "The ultimate collection of react hooks",
5
5
  "author": {
6
6
  "name": "SIBERIA CAN CODE 🧊",