@siberiacancode/reactuse 0.3.17 → 0.3.18

package/dist/cjs/hooks/useAutoScroll/useAutoScroll.cjs

@@ -1,2 +1,2 @@
-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;
+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;
 //# sourceMappingURL=useAutoScroll.cjs.map

package/dist/cjs/hooks/useAutoScroll/useAutoScroll.cjs.map

@@ -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"}
+{"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"}

package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs

@@ -1,2 +1,2 @@
-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;
+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;
 //# sourceMappingURL=useClickOutside.cjs.map

package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs.map

@@ -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"}
+{"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"}

package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs

@@ -1,2 +1,2 @@
-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;
+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;
 //# sourceMappingURL=useDoubleClick.cjs.map

package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs.map

@@ -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"}
+{"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"}

package/dist/cjs/hooks/useKeyPressEvent/useKeyPressEvent.cjs.map

@@ -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"}
+{"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"}

package/dist/cjs/hooks/useKeyboard/useKeyboard.cjs

@@ -1,2 +1,2 @@
-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;
+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;
 //# sourceMappingURL=useKeyboard.cjs.map

package/dist/cjs/hooks/useKeyboard/useKeyboard.cjs.map

@@ -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"}
+{"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"}

package/dist/cjs/hooks/usePermission/usePermission.cjs.map

@@ -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"}
+{"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"}

package/dist/cjs/hooks/usePictureInPicture/usePictureInPicture.cjs

@@ -1,2 +1,2 @@
-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;
+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;
 //# sourceMappingURL=usePictureInPicture.cjs.map

package/dist/cjs/hooks/usePictureInPicture/usePictureInPicture.cjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/useAutoScroll/useAutoScroll.mjs

@@ -36,7 +36,7 @@ var i = ((...i) => {
 		s,
 		a && e.getRawElement(a),
 		c.state
-	]), !a) return { ref: c };
+	]), !a) return c;
 });
 //#endregion
 export { i as useAutoScroll };

package/dist/esm/hooks/useAutoScroll/useAutoScroll.mjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/useClickOutside/useClickOutside.mjs

@@ -14,7 +14,7 @@ var i = ((...i) => {
 		return document.addEventListener("click", n), () => {
 			document.removeEventListener("click", n);
 		};
-	}, [a && e.getRawElement(a), s.state]), !a) return { ref: s };
+	}, [a && e.getRawElement(a), s.state]), !a) return s;
 });
 //#endregion
 export { i as useClickOutside };

package/dist/esm/hooks/useClickOutside/useClickOutside.mjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs

@@ -18,7 +18,7 @@ var i = 300, a = ((...i) => {
 		return t.addEventListener("mousedown", n), t.addEventListener("touchstart", n), () => {
 			t.removeEventListener("mousedown", n), t.removeEventListener("touchstart", n), c.current && clearTimeout(c.current);
 		};
-	}, [a && e.getRawElement(a), u.state]), !a) return { ref: u };
+	}, [a && e.getRawElement(a), u.state]), !a) return u;
 });
 //#endregion
 export { i as DEFAULT_THRESHOLD_TIME, a as useDoubleClick };

package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/useKeyPressEvent/useKeyPressEvent.mjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/useKeyboard/useKeyboard.mjs

@@ -9,7 +9,7 @@ var i = ((...i) => {
 		return t.addEventListener("keydown", n), t.addEventListener("keyup", r), () => {
 			t.removeEventListener("keydown", n), t.removeEventListener("keyup", r);
 		};
-	}, [a && e.getRawElement(a), s.state]), !a) return { ref: s };
+	}, [a && e.getRawElement(a), s.state]), !a) return s;
 });
 //#endregion
 export { i as useKeyboard };

package/dist/esm/hooks/useKeyboard/useKeyboard.mjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/usePermission/usePermission.mjs.map

@@ -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"}
+{"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"}

package/dist/esm/hooks/usePictureInPicture/usePictureInPicture.mjs

@@ -24,7 +24,7 @@ var a = ((...a) => {
 		};
 	}, [s && e.getRawElement(s), d.state]);
 	let g = {
-		open: l,
+		opened: l,
 		supported: o,
 		enter: m,
 		exit: h,

package/dist/esm/hooks/usePictureInPicture/usePictureInPicture.mjs.map

@@ -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"}
+{"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"}

package/dist/types/hooks/useAutoScroll/useAutoScroll.d.ts

@@ -9,9 +9,7 @@ export interface UseAutoScrollOptions {
 }
 export interface UseAutoScroll {
     (target: HookTarget, options?: UseAutoScrollOptions): void;
-    <Target extends HTMLElement>(options?: UseAutoScrollOptions): {
-        ref: StateRef<Target>;
-    };
+    <Target extends HTMLElement>(options?: UseAutoScrollOptions): StateRef<Target>;
 }
 /**
  * @name useAutoScroll
@@ -30,9 +28,9 @@ export interface UseAutoScroll {
  * @overload
  * @template Target
  * @param {boolean} [options.enabled] Whether auto-scrolling is enabled
- * @returns {{ ref: StateRef<Target> }} A React ref to attach to the list element
+ * @returns {StateRef<Target>} A React ref to attach to the list element
  *
  * @example
- * const { ref } = useAutoScroll();
+ * const ref = useAutoScroll();
  */
 export declare const useAutoScroll: UseAutoScroll;

package/dist/types/hooks/useClickOutside/useClickOutside.d.ts

@@ -2,9 +2,7 @@ import { HookTarget } from '../../utils/helpers';
 import { StateRef } from '../useRefState/useRefState';
 export interface UseClickOutside {
     (target: HookTarget, callback: (event: Event) => void): void;
-    <Target extends Element>(callback: (event: Event) => void, target?: never): {
-        ref: StateRef<Target>;
-    };
+    <Target extends Element>(callback: (event: Event) => void, target?: never): StateRef<Target>;
 }
 /**
  * @name useClickOutside
@@ -23,10 +21,10 @@ export interface UseClickOutside {
  * @overload
  * @template Target The target element(s)
  * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected
- * @returns {{ ref: StateRef<Target> }} A ref to attach to the target element
+ * @returns {StateRef<Target>} A ref to attach to the target element
  *
  * @example
- * const { ref } = useClickOutside<HTMLDivElement>(() => console.log('click outside'));
+ * const ref = useClickOutside<HTMLDivElement>(() => console.log('click outside'));
  *
  * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useClickOutside.html}
  */

package/dist/types/hooks/useDoubleClick/useDoubleClick.d.ts

@@ -10,9 +10,7 @@ export interface UseDoubleClickOptions {
 }
 export interface UseDoubleClick {
     (target: HookTarget, callback: (event: DoubleClickEvents) => void, options?: UseDoubleClickOptions): void;
-    <Target extends Element>(callback: (event: DoubleClickEvents) => void, options?: UseDoubleClickOptions, target?: never): {
-        ref: StateRef<Target>;
-    };
+    <Target extends Element>(callback: (event: DoubleClickEvents) => void, options?: UseDoubleClickOptions, target?: never): StateRef<Target>;
 }
 export declare const DEFAULT_THRESHOLD_TIME = 300;
 /**
@@ -34,10 +32,10 @@ export declare const DEFAULT_THRESHOLD_TIME = 300;
  * @template Target The target element
  * @param {(event: DoubleClickEvents) => void} callback The callback function to be invoked on double click
  * @param {UseDoubleClickOptions} [options] The options for the double click
- * @returns {{ ref: StateRef<Target> }} The double clicking state
+ * @returns {StateRef<Target>} The double clicking state
  *
  * @example
- * const { ref } = useDoubleClick(() => console.log('double clicked'));
+ * const ref = useDoubleClick(() => console.log('double clicked'));
  *
  * @see {@link https://siberiacancode.github.io/reactuse/functions/hooks/useDoubleClick.html}
  */

package/dist/types/hooks/useKeyPressEvent/useKeyPressEvent.d.ts

@@ -13,9 +13,7 @@ export interface UseKeyPressEventOptions {
 }
 export interface UseKeyPressEvent {
     (target: HookTarget | Window, key: UseKeyPressEventKey, listener: (event: KeyboardEvent) => void, options?: UseKeyPressEventOptions): void;
-    <Target extends Element>(key: UseKeyPressEventKey, listener: (event: KeyboardEvent) => void, options?: UseKeyPressEventOptions, target?: never): {
-        ref: StateRef<Target>;
-    };
+    <Target extends Element>(key: UseKeyPressEventKey, listener: (event: KeyboardEvent) => void, options?: UseKeyPressEventOptions, target?: never): StateRef<Target>;
 }
 /**
  * @name useKeyPressEvent
@@ -38,7 +36,7 @@ export interface UseKeyPressEvent {
  * @param {UseKeyPressEventKey} key The key or array of keys to listen for.
  * @param {(event: KeyboardEvent) => void} listener The callback function to be executed when the specified key or keys are pressed.
  * @param {UseKeyPressEventOptions} [options] The options for the event listener.
- * @returns {{ ref: StateRef<Target> }} An object containing the ref
+ * @returns {StateRef<Target>} A ref to attach to the target element
  *
  * @example
  * const ref = useKeyPressEvent('Enter', (event) => console.log('pressed'));

package/dist/types/hooks/useKeyboard/useKeyboard.d.ts

@@ -14,12 +14,8 @@ export interface UseKeyboardEventOptions {
 export interface UseKeyboard {
     (target: HookTarget, callback: KeyboardEventHandler): void;
     (target: HookTarget, options: UseKeyboardEventOptions): void;
-    <Target extends HTMLElement>(callback: KeyboardEventHandler, target?: never): {
-        ref: StateRef<Target>;
-    };
-    <Target extends HTMLElement>(options: UseKeyboardEventOptions, target?: never): {
-        ref: StateRef<Target>;
-    };
+    <Target extends HTMLElement>(callback: KeyboardEventHandler, target?: never): StateRef<Target>;
+    <Target extends HTMLElement>(options: UseKeyboardEventOptions, target?: never): StateRef<Target>;
 }
 /**
  * @name useKeyboard
@@ -46,17 +42,17 @@ export interface UseKeyboard {
  * @overload
  * @template Target The target element type
  * @param {KeyboardEventHandler} callback The callback function to be invoked on key down
- * @returns {{ ref: StateRef<Target> }} An object containing the ref
+ * @returns {StateRef<Target>} A ref to attach to the target element
  *
  * @example
- * const keyboard = useKeyboard((event) => console.log('key down'));
+ * const ref = useKeyboard((event) => console.log('key down'));
  *
  * @overload
  * @template Target The target element type
  * @param {UseKeyboardEventOptions} [options] The keyboard event options
- * @returns {{ ref: StateRef<Target> }} An object containing the ref
+ * @returns {StateRef<Target>} A ref to attach to the target element
  *
  * @example
- * const keyboard = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });
+ * const ref = useKeyboard({ onKeyDown: (event) => console.log('key down'), onKeyUp: (event) => console.log('key up') });
  */
 export declare const useKeyboard: UseKeyboard;

package/dist/types/hooks/usePermission/usePermission.d.ts

@@ -29,7 +29,7 @@ export interface UsePermissionReturn {
  *  @example
  *  const { state, supported, query } = usePermission('microphone');
  */
-export declare const usePermission: (permissionDescriptorName: UsePermissionName, options?: UsePermissionOptions) => {
+export declare const usePermission: (name: UsePermissionName, options?: UsePermissionOptions) => {
     state: PermissionState;
     supported: boolean;
     query: () => Promise<PermissionState>;

package/dist/types/hooks/usePictureInPicture/usePictureInPicture.d.ts

@@ -10,7 +10,7 @@ export interface UsePictureInPictureOptions {
 /** The use picture in picture return type */
 export interface UsePictureInPictureReturn {
     /** Whether Picture-in-Picture mode is currently active */
-    open: boolean;
+    opened: boolean;
     /** Whether Picture-in-Picture mode is supported by the browser */
     supported: boolean;
     /** Request to enter Picture-in-Picture mode */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@siberiacancode/reactuse",
-  "version": "0.3.17",
+  "version": "0.3.18",
   "description": "The ultimate collection of react hooks",
   "author": {
     "name": "SIBERIA CAN CODE 🧊",