@siberiacancode/reactuse 0.3.3 → 0.3.4

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

@@ -1 +1 @@
-{"version":3,"file":"useFullscreen.mjs","sources":["../../../../src/hooks/useFullscreen/useFullscreen.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport screenfull from 'screenfull';\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 fullscreen options type */\nexport interface UseFullScreenOptions {\n  /** initial value */\n  initialValue?: boolean;\n  /** on enter fullscreen */\n  onEnter?: () => void;\n  /** on exit fullscreen */\n  onExit?: () => void;\n}\n\n/** The use click outside return type */\nexport interface UseFullScreenReturn {\n  /** The fullscreen state */\n  value: boolean;\n  /** The fullscreen enter method */\n  enter: () => void;\n  /** The fullscreen exit method */\n  exit: () => void;\n  /** The fullscreen toggle method */\n  toggle: () => void;\n}\n\nexport interface UseFullScreen {\n  (target: HookTarget, options?: UseFullScreenOptions): UseFullScreenReturn;\n\n  <Target extends Element>(\n    options?: UseFullScreenOptions,\n    target?: never\n  ): UseFullScreenReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name useFullscreen\n * @description - Hook to handle fullscreen events\n * @category Browser\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target element for fullscreen\n * @param {boolean} [options.initialValue=false] initial value of fullscreen\n * @param {() => void} [options.onEnter] on enter fullscreen\n * @param {() => void} [options.onExit] on exit fullscreen\n * @returns {UseFullScreenReturn} An object with the fullscreen state and methods\n *\n * @example\n * const { enter, exit, toggle, value } = useFullscreen(ref);\n *\n * @overload\n * @template Target The target element for fullscreen\n * @param {boolean} [options.initialValue=false] initial value of fullscreen\n * @param {() => void} [options.onEnter] on enter fullscreen\n * @param {() => void} [options.onExit] on exit fullscreen\n * @returns {UseFullScreenReturn & { ref: RefObject<Target> }} An object with the fullscreen state and methods\n *\n * @example\n * const { ref, enter, exit, toggle, value } = useFullscreen();\n */\nexport const useFullscreen = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n  const options = (target ? params[1] : params[0]) as UseFullScreenOptions | undefined;\n\n  const [value, setValue] = useState(options?.initialValue ?? false);\n  const internalRef = useRefState<Element>();\n\n  const onChange = () => {\n    if (!screenfull.isEnabled) return;\n\n    if (screenfull.isFullscreen) {\n      options?.onEnter?.();\n    } else {\n      screenfull.off('change', onChange);\n      options?.onExit?.();\n    }\n\n    setValue(screenfull.isFullscreen);\n  };\n\n  const enter = () => {\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    if (screenfull.isEnabled) {\n      try {\n        screenfull.request(element);\n        screenfull.on('change', onChange);\n      } catch (error) {\n        console.error(error);\n      }\n    }\n  };\n\n  const exit = () => {\n    if (screenfull.isEnabled) screenfull.exit();\n  };\n\n  const toggle = () => {\n    if (value) return exit();\n    enter();\n  };\n\n  useEffect(\n    () => () => {\n      if (screenfull.isEnabled) screenfull.off('change', onChange);\n    },\n    []\n  );\n\n  if (target)\n    return {\n      enter,\n      exit,\n      toggle,\n      value\n    };\n  return {\n    ref: internalRef,\n    enter,\n    exit,\n    toggle,\n    value\n  };\n}) as UseFullScreen;\n"],"names":["useFullscreen","params","target","isTarget","options","value","setValue","useState","internalRef","useRefState","onChange","screenfull","enter","element","error","exit","toggle","useEffect"],"mappings":";;;;AAoEO,MAAMA,IAAiB,IAAIC,MAAkB;AAClD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAWF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExC,CAACI,GAAOC,CAAQ,IAAIC,EAASH,GAAS,gBAAgB,EAAK,GAC3DI,IAAcC,EAAA,GAEdC,IAAW,MAAM;AACrB,IAAKC,EAAW,cAEZA,EAAW,eACbP,GAAS,UAAA,KAETO,EAAW,IAAI,UAAUD,CAAQ,GACjCN,GAAS,SAAA,IAGXE,EAASK,EAAW,YAAY;AAAA,EAAA,GAG5BC,IAAQ,MAAM;AAClB,UAAMC,IAAWX,IAASC,EAAS,WAAWD,CAAM,IAAIM,EAAY;AACpE,QAAKK,KAEDF,EAAW;AACb,UAAI;AACF,QAAAA,EAAW,QAAQE,CAAO,GAC1BF,EAAW,GAAG,UAAUD,CAAQ;AAAA,MAAA,SACzBI,GAAO;AACd,gBAAQ,MAAMA,CAAK;AAAA,MAAA;AAAA,EAEvB,GAGIC,IAAO,MAAM;AACjB,IAAIJ,EAAW,aAAWA,EAAW,KAAA;AAAA,EAAK,GAGtCK,IAAS,MAAM;AACnB,QAAIX,UAAcU,EAAA;AAClB,IAAAH,EAAA;AAAA,EAAM;AAUR,SAPAK;AAAA,IACE,MAAM,MAAM;AACV,MAAIN,EAAW,aAAWA,EAAW,IAAI,UAAUD,CAAQ;AAAA,IAAA;AAAA,IAE7D,CAAA;AAAA,EAAC,GAGCR,IACK;AAAA,IACL,OAAAU;AAAA,IACA,MAAAG;AAAA,IACA,QAAAC;AAAA,IACA,OAAAX;AAAA,EAAA,IAEG;AAAA,IACL,KAAKG;AAAA,IACL,OAAAI;AAAA,IACA,MAAAG;AAAA,IACA,QAAAC;AAAA,IACA,OAAAX;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useFullscreen.mjs","sources":["../../../../src/hooks/useFullscreen/useFullscreen.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport screenfull from 'screenfull';\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 fullscreen options type */\nexport interface UseFullScreenOptions {\n  /** initial value */\n  initialValue?: boolean;\n  /** on enter fullscreen */\n  onEnter?: () => void;\n  /** on exit fullscreen */\n  onExit?: () => void;\n}\n\n/** The use click outside return type */\nexport interface UseFullScreenReturn {\n  /** The fullscreen state */\n  value: boolean;\n  /** The fullscreen enter method */\n  enter: () => void;\n  /** The fullscreen exit method */\n  exit: () => void;\n  /** The fullscreen toggle method */\n  toggle: () => void;\n}\n\nexport interface UseFullScreen {\n  (target: HookTarget, options?: UseFullScreenOptions): UseFullScreenReturn;\n\n  <Target extends Element>(\n    options?: UseFullScreenOptions,\n    target?: never\n  ): UseFullScreenReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name useFullscreen\n * @description - Hook to handle fullscreen events\n * @category Browser\n * @usage low\n *\n * @overload\n * @param {HookTarget} target The target element for fullscreen\n * @param {boolean} [options.initialValue=false] initial value of fullscreen\n * @param {() => void} [options.onEnter] on enter fullscreen\n * @param {() => void} [options.onExit] on exit fullscreen\n * @returns {UseFullScreenReturn} An object with the fullscreen state and methods\n *\n * @example\n * const { enter, exit, toggle, value } = useFullscreen(ref);\n *\n * @overload\n * @template Target The target element for fullscreen\n * @param {boolean} [options.initialValue=false] initial value of fullscreen\n * @param {() => void} [options.onEnter] on enter fullscreen\n * @param {() => void} [options.onExit] on exit fullscreen\n * @returns {UseFullScreenReturn & { ref: RefObject<Target> }} An object with the fullscreen state and methods\n *\n * @example\n * const { ref, enter, exit, toggle, value } = useFullscreen();\n */\nexport const useFullscreen = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n  const options = (target ? params[1] : params[0]) as UseFullScreenOptions | undefined;\n\n  const [value, setValue] = useState(options?.initialValue ?? false);\n  const internalRef = useRefState<Element>();\n\n  const onChange = () => {\n    if (!screenfull.isEnabled) return;\n\n    if (screenfull.isFullscreen) {\n      options?.onEnter?.();\n    } else {\n      screenfull.off('change', onChange);\n      options?.onExit?.();\n    }\n\n    setValue(screenfull.isFullscreen);\n  };\n\n  const enter = () => {\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    if (screenfull.isEnabled) {\n      try {\n        screenfull.request(element);\n        screenfull.on('change', onChange);\n      } catch (error) {\n        console.error(error);\n      }\n    }\n  };\n\n  const exit = () => {\n    if (screenfull.isEnabled) screenfull.exit();\n  };\n\n  const toggle = () => {\n    if (value) return exit();\n    enter();\n  };\n\n  useEffect(\n    () => () => {\n      if (screenfull.isEnabled) screenfull.off('change', onChange);\n    },\n    []\n  );\n\n  if (target)\n    return {\n      enter,\n      exit,\n      toggle,\n      value\n    };\n  return {\n    ref: internalRef,\n    enter,\n    exit,\n    toggle,\n    value\n  };\n}) as UseFullScreen;\n"],"names":["useFullscreen","params","target","isTarget","options","value","setValue","useState","internalRef","useRefState","onChange","screenfull","enter","element","error","exit","toggle","useEffect"],"mappings":";;;;AAoEO,MAAMA,KAAiB,IAAIC,MAAkB;AAClD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAWF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExC,CAACI,GAAOC,CAAQ,IAAIC,EAASH,GAAS,gBAAgB,EAAK,GAC3DI,IAAcC,EAAA,GAEdC,IAAW,MAAM;AACrB,IAAKC,EAAW,cAEZA,EAAW,eACbP,GAAS,UAAA,KAETO,EAAW,IAAI,UAAUD,CAAQ,GACjCN,GAAS,SAAA,IAGXE,EAASK,EAAW,YAAY;AAAA,EAAA,GAG5BC,IAAQ,MAAM;AAClB,UAAMC,IAAWX,IAASC,EAAS,WAAWD,CAAM,IAAIM,EAAY;AACpE,QAAKK,KAEDF,EAAW;AACb,UAAI;AACF,QAAAA,EAAW,QAAQE,CAAO,GAC1BF,EAAW,GAAG,UAAUD,CAAQ;AAAA,MAAA,SACzBI,GAAO;AACd,gBAAQ,MAAMA,CAAK;AAAA,MAAA;AAAA,EAEvB,GAGIC,IAAO,MAAM;AACjB,IAAIJ,EAAW,aAAWA,EAAW,KAAA;AAAA,EAAK,GAGtCK,IAAS,MAAM;AACnB,QAAIX,UAAcU,EAAA;AAClB,IAAAH,EAAA;AAAA,EAAM;AAUR,SAPAK;AAAA,IACE,MAAM,MAAM;AACV,MAAIN,EAAW,aAAWA,EAAW,IAAI,UAAUD,CAAQ;AAAA,IAAA;AAAA,IAE7D,CAAA;AAAA,EAAC,GAGCR,IACK;AAAA,IACL,OAAAU;AAAA,IACA,MAAAG;AAAA,IACA,QAAAC;AAAA,IACA,OAAAX;AAAA,EAAA,IAEG;AAAA,IACL,KAAKG;AAAA,IACL,OAAAI;AAAA,IACA,MAAAG;AAAA,IACA,QAAAC;AAAA,IACA,OAAAX;AAAA,EAAA;AAEJ;"}

package/dist/esm/hooks/useHash/useHash.mjs

@@ -1,5 +1,5 @@
 import { useState as a, useRef as w, useEffect as g } from "react";
-const f = () => decodeURIComponent(window.location.hash.replace("#", "")), p = (...e) => {
+const f = () => decodeURIComponent(window.location.hash.replace("#", "")), p = ((...e) => {
   const c = typeof e[0] == "string" ? e[0] : "", o = typeof e[1] == "object" ? e[1] : typeof e[1] == "function" ? { onChange: e[1] } : typeof e[0] == "object" ? e[0] : {}, s = o?.enabled ?? !0, h = o?.mode ?? "replace", [i, r] = a(() => typeof window > "u" ? c : f() || c), t = w(o);
   t.current = o;
   const u = (n) => {
@@ -16,7 +16,7 @@ const f = () => decodeURIComponent(window.location.hash.replace("#", "")), p = (
       window.removeEventListener("hashchange", n);
     };
   }, [s, h]), [i, u];
-};
+});
 export {
   f as getHash,
   p as useHash

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

@@ -1 +1 @@
-{"version":3,"file":"useHash.mjs","sources":["../../../../src/hooks/useHash/useHash.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nexport const getHash = () => decodeURIComponent(window.location.hash.replace('#', ''));\n\n/** The use hash options type */\nexport interface UseHashOptions {\n  /** The enabled state of the hook */\n  enabled?: boolean;\n  /** The mode of hash setting */\n  mode?: 'initial' | 'replace';\n  /** Callback function called when hash changes */\n  onChange?: (hash: string) => void;\n}\n\n/** The use hash return type */\ntype UseHashReturn = [string, (value: string) => void];\n\nexport interface UseHash {\n  (initialValue?: string, options?: UseHashOptions): UseHashReturn;\n\n  (options?: UseHashOptions): UseHashReturn;\n\n  (initialValue?: string, callback?: (hash: string) => void): UseHashReturn;\n\n  (callback?: (hash: string) => void): UseHashReturn;\n}\n\n/**\n * @name useHash\n * @description - Hook that manages the hash value\n * @category State\n * @usage low\n *\n * @overload\n * @param {string} [initialValue] The initial hash value if no hash exists\n * @param {UseHashOptions} [options] Configuration options\n * @param {boolean} [options.enabled] The enabled state of the hook\n * @param {'initial' | 'replace'} [options.mode] The mode of hash setting\n * @param {(hash: string) => void} [options.onChange] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash(\"initial\");\n *\n * @overload\n * @param {string} [initialValue] The initial hash value if no hash exists\n * @param {(hash: string) => void} [callback] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash(\"initial\", (newHash) => console.log('callback'));\n *\n * @overload\n * @param {UseHashOptions} [options] Configuration options\n * @param {boolean} [options.enabled] The enabled state of the hook\n * @param {'initial' | 'replace'} [options.mode] The mode of hash setting\n * @param {(hash: string) => void} [options.onChange] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash();\n *\n * @overload\n * @param {(hash: string) => void} [callback] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash((newHash) => console.log('callback'));\n */\nexport const useHash = ((...params: any[]) => {\n  const initialValue = typeof params[0] === 'string' ? params[0] : '';\n  const options =\n    typeof params[1] === 'object'\n      ? params[1]\n      : typeof params[1] === 'function'\n        ? { onChange: params[1] }\n        : typeof params[0] === 'object'\n          ? params[0]\n          : {};\n\n  const enabled = options?.enabled ?? true;\n  const mode = options?.mode ?? 'replace';\n\n  const [hash, setHash] = useState(() => {\n    if (typeof window === 'undefined') return initialValue;\n    return getHash() || initialValue;\n  });\n\n  const optionsRef = useRef(options);\n  optionsRef.current = options;\n\n  const set = (value: string) => {\n    window.location.hash = value;\n    setHash(value);\n    optionsRef.current?.onChange?.(value);\n  };\n\n  useEffect(() => {\n    if (!enabled) return;\n\n    if (mode === 'replace') window.location.hash = hash;\n\n    const onHashChange = () => {\n      const newHash = getHash();\n      setHash(newHash);\n      optionsRef.current?.onChange?.(newHash);\n    };\n\n    window.addEventListener('hashchange', onHashChange);\n    return () => {\n      window.removeEventListener('hashchange', onHashChange);\n    };\n  }, [enabled, mode]);\n\n  return [hash, set] as const;\n}) as UseHash;\n"],"names":["getHash","useHash","params","initialValue","options","enabled","mode","hash","setHash","useState","optionsRef","useRef","set","value","useEffect","onHashChange","newHash"],"mappings":";AAEO,MAAMA,IAAU,MAAM,mBAAmB,OAAO,SAAS,KAAK,QAAQ,KAAK,EAAE,CAAC,GAmExEC,IAAW,IAAIC,MAAkB;AAC5C,QAAMC,IAAe,OAAOD,EAAO,CAAC,KAAM,WAAWA,EAAO,CAAC,IAAI,IAC3DE,IACJ,OAAOF,EAAO,CAAC,KAAM,WACjBA,EAAO,CAAC,IACR,OAAOA,EAAO,CAAC,KAAM,aACnB,EAAE,UAAUA,EAAO,CAAC,EAAA,IACpB,OAAOA,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,CAAA,GAEJG,IAAUD,GAAS,WAAW,IAC9BE,IAAOF,GAAS,QAAQ,WAExB,CAACG,GAAMC,CAAO,IAAIC,EAAS,MAC3B,OAAO,SAAW,MAAoBN,IACnCH,OAAaG,CACrB,GAEKO,IAAaC,EAAOP,CAAO;AACjC,EAAAM,EAAW,UAAUN;AAErB,QAAMQ,IAAM,CAACC,MAAkB;AAC7B,WAAO,SAAS,OAAOA,GACvBL,EAAQK,CAAK,GACbH,EAAW,SAAS,WAAWG,CAAK;AAAA,EAAA;AAGtC,SAAAC,EAAU,MAAM;AACd,QAAI,CAACT,EAAS;AAEd,IAAIC,MAAS,cAAW,OAAO,SAAS,OAAOC;AAE/C,UAAMQ,IAAe,MAAM;AACzB,YAAMC,IAAUhB,EAAA;AAChB,MAAAQ,EAAQQ,CAAO,GACfN,EAAW,SAAS,WAAWM,CAAO;AAAA,IAAA;AAGxC,kBAAO,iBAAiB,cAAcD,CAAY,GAC3C,MAAM;AACX,aAAO,oBAAoB,cAAcA,CAAY;AAAA,IAAA;AAAA,EACvD,GACC,CAACV,GAASC,CAAI,CAAC,GAEX,CAACC,GAAMK,CAAG;AACnB;"}
+{"version":3,"file":"useHash.mjs","sources":["../../../../src/hooks/useHash/useHash.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nexport const getHash = () => decodeURIComponent(window.location.hash.replace('#', ''));\n\n/** The use hash options type */\nexport interface UseHashOptions {\n  /** The enabled state of the hook */\n  enabled?: boolean;\n  /** The mode of hash setting */\n  mode?: 'initial' | 'replace';\n  /** Callback function called when hash changes */\n  onChange?: (hash: string) => void;\n}\n\n/** The use hash return type */\ntype UseHashReturn = [string, (value: string) => void];\n\nexport interface UseHash {\n  (initialValue?: string, options?: UseHashOptions): UseHashReturn;\n\n  (options?: UseHashOptions): UseHashReturn;\n\n  (initialValue?: string, callback?: (hash: string) => void): UseHashReturn;\n\n  (callback?: (hash: string) => void): UseHashReturn;\n}\n\n/**\n * @name useHash\n * @description - Hook that manages the hash value\n * @category State\n * @usage low\n *\n * @overload\n * @param {string} [initialValue] The initial hash value if no hash exists\n * @param {UseHashOptions} [options] Configuration options\n * @param {boolean} [options.enabled] The enabled state of the hook\n * @param {'initial' | 'replace'} [options.mode] The mode of hash setting\n * @param {(hash: string) => void} [options.onChange] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash(\"initial\");\n *\n * @overload\n * @param {string} [initialValue] The initial hash value if no hash exists\n * @param {(hash: string) => void} [callback] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash(\"initial\", (newHash) => console.log('callback'));\n *\n * @overload\n * @param {UseHashOptions} [options] Configuration options\n * @param {boolean} [options.enabled] The enabled state of the hook\n * @param {'initial' | 'replace'} [options.mode] The mode of hash setting\n * @param {(hash: string) => void} [options.onChange] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash();\n *\n * @overload\n * @param {(hash: string) => void} [callback] Callback function called when hash changes\n * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value\n *\n * @example\n * const [hash, setHash] = useHash((newHash) => console.log('callback'));\n */\nexport const useHash = ((...params: any[]) => {\n  const initialValue = typeof params[0] === 'string' ? params[0] : '';\n  const options =\n    typeof params[1] === 'object'\n      ? params[1]\n      : typeof params[1] === 'function'\n        ? { onChange: params[1] }\n        : typeof params[0] === 'object'\n          ? params[0]\n          : {};\n\n  const enabled = options?.enabled ?? true;\n  const mode = options?.mode ?? 'replace';\n\n  const [hash, setHash] = useState(() => {\n    if (typeof window === 'undefined') return initialValue;\n    return getHash() || initialValue;\n  });\n\n  const optionsRef = useRef(options);\n  optionsRef.current = options;\n\n  const set = (value: string) => {\n    window.location.hash = value;\n    setHash(value);\n    optionsRef.current?.onChange?.(value);\n  };\n\n  useEffect(() => {\n    if (!enabled) return;\n\n    if (mode === 'replace') window.location.hash = hash;\n\n    const onHashChange = () => {\n      const newHash = getHash();\n      setHash(newHash);\n      optionsRef.current?.onChange?.(newHash);\n    };\n\n    window.addEventListener('hashchange', onHashChange);\n    return () => {\n      window.removeEventListener('hashchange', onHashChange);\n    };\n  }, [enabled, mode]);\n\n  return [hash, set] as const;\n}) as UseHash;\n"],"names":["getHash","useHash","params","initialValue","options","enabled","mode","hash","setHash","useState","optionsRef","useRef","set","value","useEffect","onHashChange","newHash"],"mappings":";AAEO,MAAMA,IAAU,MAAM,mBAAmB,OAAO,SAAS,KAAK,QAAQ,KAAK,EAAE,CAAC,GAmExEC,KAAW,IAAIC,MAAkB;AAC5C,QAAMC,IAAe,OAAOD,EAAO,CAAC,KAAM,WAAWA,EAAO,CAAC,IAAI,IAC3DE,IACJ,OAAOF,EAAO,CAAC,KAAM,WACjBA,EAAO,CAAC,IACR,OAAOA,EAAO,CAAC,KAAM,aACnB,EAAE,UAAUA,EAAO,CAAC,EAAA,IACpB,OAAOA,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,CAAA,GAEJG,IAAUD,GAAS,WAAW,IAC9BE,IAAOF,GAAS,QAAQ,WAExB,CAACG,GAAMC,CAAO,IAAIC,EAAS,MAC3B,OAAO,SAAW,MAAoBN,IACnCH,OAAaG,CACrB,GAEKO,IAAaC,EAAOP,CAAO;AACjC,EAAAM,EAAW,UAAUN;AAErB,QAAMQ,IAAM,CAACC,MAAkB;AAC7B,WAAO,SAAS,OAAOA,GACvBL,EAAQK,CAAK,GACbH,EAAW,SAAS,WAAWG,CAAK;AAAA,EAAA;AAGtC,SAAAC,EAAU,MAAM;AACd,QAAI,CAACT,EAAS;AAEd,IAAIC,MAAS,cAAW,OAAO,SAAS,OAAOC;AAE/C,UAAMQ,IAAe,MAAM;AACzB,YAAMC,IAAUhB,EAAA;AAChB,MAAAQ,EAAQQ,CAAO,GACfN,EAAW,SAAS,WAAWM,CAAO;AAAA,IAAA;AAGxC,kBAAO,iBAAiB,cAAcD,CAAY,GAC3C,MAAM;AACX,aAAO,oBAAoB,cAAcA,CAAY;AAAA,IAAA;AAAA,EACvD,GACC,CAACV,GAASC,CAAI,CAAC,GAEX,CAACC,GAAMK,CAAG;AACnB;"}

package/dist/esm/hooks/useHotkeys/useHotkeys.mjs

@@ -1,29 +1,37 @@
 import { useRef as m, useEffect as w } from "react";
-import { useEvent as k } from "../useEvent/useEvent.mjs";
+import { useEvent as L } from "../useEvent/useEvent.mjs";
 import { useRefState as E } from "../useRefState/useRefState.mjs";
-import { isTarget as L } from "../../utils/helpers/isTarget.mjs";
-const h = (t, o) => t.toLowerCase().split(/[+_,\-]/g).map((r) => r.trim()).every(
-  (r) => o.find(
+import { isTarget as d } from "../../utils/helpers/isTarget.mjs";
+const h = (o, t) => o.toLowerCase().split(/[+_,\-]/g).map((r) => r.trim()).every(
+  (r) => t.find(
     (s) => r === s.code.toLocaleLowerCase() || r === s.key.toLocaleLowerCase() || r === s.alias.toLocaleLowerCase()
   )
-), M = (...t) => {
-  const o = L(t[0]) ? t[0] : void 0, r = o ? t[1] : t[0], s = o ? t[2] : t[1], d = o ? t[3] : t[2], i = E(window), n = m([]), u = d?.enabled ?? !0, f = k((e) => {
+), M = ((...o) => {
+  const t = d(o[0]) ? o[0] : void 0, r = t ? o[1] : o[0], s = t ? o[2] : o[1], y = t ? o[3] : o[2], i = E(window), n = m([]), u = y?.enabled ?? !0, f = L((e) => {
     if (!u || n.current.some(({ code: c }) => c === e.code)) return;
-    const a = d?.alias?.[e.key] ?? e.code, y = [...n.current, { key: e.key, code: e.code, alias: a }];
-    n.current = y, r.split(",").map((c) => c.trim()).some((c) => h(c, y)) && (e.preventDefault(), s(e));
-  }), l = k((e) => {
-    u && (n.current = n.current.filter(({ code: a }) => a !== e.code));
+    const l = y?.alias?.[e.key] ?? e.code, k = [...n.current, { key: e.key, code: e.code, alias: l }];
+    n.current = k, r.split(",").map((c) => c.trim()).some((c) => h(c, k)) && (e.preventDefault(), s(e));
+  }), a = L((e) => {
+    u && (n.current = n.current.filter(({ code: l }) => l !== e.code));
   });
   if (w(() => {
-    if (n.current = [], !o && !i.state && !u) return;
-    const e = o ? L.getElement(o) : i.current;
+    if (n.current = [], !t && !i.state && !u) return;
+    const e = t ? d.getElement(t) : i.current;
     if (e)
-      return e.addEventListener("keydown", f), e.addEventListener("keyup", l), () => {
-        e.removeEventListener("keydown", f), e.removeEventListener("keyup", l);
+      return e.addEventListener("keydown", f), e.addEventListener("keyup", a), () => {
+        e.removeEventListener("keydown", f), e.removeEventListener("keyup", a);
       };
-  }, [o, i.state, u, r, f, l]), !o)
+  }, [
+    t,
+    i.state,
+    d.getRefState(t),
+    u,
+    r,
+    f,
+    a
+  ]), !t)
     return i;
-};
+});
 export {
   h as isHotkeyMatch,
   M as useHotkeys

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

@@ -1 +1 @@
-{"version":3,"file":"useHotkeys.mjs","sources":["../../../../src/hooks/useHotkeys/useHotkeys.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 { useEvent } from '../useEvent/useEvent';\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The use hotkeys params type */\nexport interface UseHotkeysOptions {\n  /** Alias map for hotkeys */\n  alias?: Record<string, string>;\n  /** Enable or disable the event listeners */\n  enabled?: boolean;\n}\n\nexport const isHotkeyMatch = (hotkey: string, keys: UseHotkeysKey[]) =>\n  hotkey\n    .toLowerCase()\n    .split(/[+_,\\-]/g)\n    .map((key) => key.trim())\n    .every((key) =>\n      keys.find(\n        (updatedKey) =>\n          key === updatedKey.code.toLocaleLowerCase() ||\n          key === updatedKey.key.toLocaleLowerCase() ||\n          key === updatedKey.alias.toLocaleLowerCase()\n      )\n    );\n\n/** The hotkeys string type */\nexport type UseHotkeysHotkeys = string;\n\n/** The hotkey key information */\nexport interface UseHotkeysKey {\n  /** The alias for the key */\n  alias: string;\n  /** The key code */\n  code: string;\n  /** The key value */\n  key: string;\n}\n\n/** The use hotkeys target type */\nexport type UseHotkeysTarget = Element | React.RefObject<Element | null | undefined>;\n\nexport interface UseHotkeys {\n  (\n    target: UseHotkeysTarget,\n    hotkeys: UseHotkeysHotkeys,\n    callback: (event: KeyboardEvent) => void,\n    options?: UseHotkeysOptions\n  ): void;\n\n  <Target extends Element>(\n    hotkeys: UseHotkeysHotkeys,\n    callback: (event: KeyboardEvent) => void,\n    options?: UseHotkeysOptions,\n    target?: never\n  ): StateRef<Target>;\n}\n\n/**\n * @name useHotkeys\n * @description - Hook that listens for hotkeys\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} [target=window] The target element to attach the event listener to\n * @param {string} hotkeys The hotkey to listen for\n * @param {(event: KeyboardEvent) => void} callback The callback function to execute when hotkey is pressed\n * @param {Record<string, string>} [options.alias] Alias map for hotkeys\n * @param {boolean} [options.enabled=true] Enable or disable the event listeners\n * @returns {void}\n *\n * @example\n * useHotkeys(ref, 'ctrl+a', () => console.log('hotkey pressed'));\n * @example\n * useHotkeys(ref, 'ctrl+a, ctrl+b', () => console.log('hotkey pressed'));\n *\n * @overload\n * @template Target The target element\n * @param {string} hotkeys The hotkey to listen for\n * @param {(event: KeyboardEvent) => void} callback The callback function to execute when hotkey is pressed\n * @param {Record<string, string>} [options.alias] Alias map for hotkeys\n * @param {boolean} [options.enabled=true] Enable or disable the event listeners\n * @returns {StateRef<Target>} A reference to the target element\n *\n * @example\n * const ref = useHotkeys('ctrl+a', () => console.log('hotkey pressed'));\n * @example\n * const ref = useHotkeys('ctrl+a, ctrl+b', () => console.log('hotkey pressed'));\n */\nexport const useHotkeys = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n  const hotkeys = (target ? params[1] : params[0]) as UseHotkeysHotkeys;\n  const callback = (target ? params[2] : params[1]) as (event: KeyboardEvent) => void;\n  const options = (target ? params[3] : params[2]) as UseHotkeysOptions | undefined;\n\n  const internalRef = useRefState(window);\n  const keysRef = useRef<UseHotkeysKey[]>([]);\n  const enabled = options?.enabled ?? true;\n\n  const onKeyDown = useEvent((event: KeyboardEvent) => {\n    if (!enabled) return;\n\n    if (keysRef.current.some(({ code }) => code === event.code)) return;\n\n    const alias = options?.alias?.[event.key] ?? event.code;\n    const updatedKeys = [...keysRef.current, { key: event.key, code: event.code, alias }];\n    keysRef.current = updatedKeys;\n\n    const hotkeysList = hotkeys.split(',').map((h) => h.trim());\n    const isMatch = hotkeysList.some((hotkey) => isHotkeyMatch(hotkey, updatedKeys));\n    if (!isMatch) return;\n    event.preventDefault();\n    callback(event);\n  });\n\n  const onKeyUp = useEvent((event: KeyboardEvent) => {\n    if (!enabled) return;\n    keysRef.current = keysRef.current.filter(({ code }) => code !== event.code);\n  });\n\n  useEffect(() => {\n    keysRef.current = [];\n    if (!target && !internalRef.state && !enabled) return;\n\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    element.addEventListener('keydown', onKeyDown as EventListener);\n    element.addEventListener('keyup', onKeyUp as EventListener);\n\n    return () => {\n      element.removeEventListener('keydown', onKeyDown as EventListener);\n      element.removeEventListener('keyup', onKeyUp as EventListener);\n    };\n  }, [target, internalRef.state, enabled, hotkeys, onKeyDown, onKeyUp]);\n\n  if (target) return;\n  return internalRef;\n}) as UseHotkeys;\n"],"names":["isHotkeyMatch","hotkey","keys","key","updatedKey","useHotkeys","params","target","isTarget","hotkeys","callback","options","internalRef","useRefState","keysRef","useRef","enabled","onKeyDown","useEvent","event","code","alias","updatedKeys","h","onKeyUp","useEffect","element"],"mappings":";;;;AAmBO,MAAMA,IAAgB,CAACC,GAAgBC,MAC5CD,EACG,cACA,MAAM,UAAU,EAChB,IAAI,CAACE,MAAQA,EAAI,KAAA,CAAM,EACvB;AAAA,EAAM,CAACA,MACND,EAAK;AAAA,IACH,CAACE,MACCD,MAAQC,EAAW,KAAK,kBAAA,KACxBD,MAAQC,EAAW,IAAI,kBAAA,KACvBD,MAAQC,EAAW,MAAM,kBAAA;AAAA,EAAkB;AAEjD,GAkESC,IAAc,IAAIC,MAAkB;AAC/C,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAWF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACxCI,IAAYH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACzCK,IAAWJ,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExCM,IAAcC,EAAY,MAAM,GAChCC,IAAUC,EAAwB,EAAE,GACpCC,IAAUL,GAAS,WAAW,IAE9BM,IAAYC,EAAS,CAACC,MAAyB;AAGnD,QAFI,CAACH,KAEDF,EAAQ,QAAQ,KAAK,CAAC,EAAE,MAAAM,QAAWA,MAASD,EAAM,IAAI,EAAG;AAE7D,UAAME,IAAQV,GAAS,QAAQQ,EAAM,GAAG,KAAKA,EAAM,MAC7CG,IAAc,CAAC,GAAGR,EAAQ,SAAS,EAAE,KAAKK,EAAM,KAAK,MAAMA,EAAM,MAAM,OAAAE,GAAO;AAKpF,IAJAP,EAAQ,UAAUQ,GAEEb,EAAQ,MAAM,GAAG,EAAE,IAAI,CAACc,MAAMA,EAAE,MAAM,EAC9B,KAAK,CAACtB,MAAWD,EAAcC,GAAQqB,CAAW,CAAC,MAE/EH,EAAM,eAAA,GACNT,EAASS,CAAK;AAAA,EAAA,CACf,GAEKK,IAAUN,EAAS,CAACC,MAAyB;AACjD,IAAKH,MACLF,EAAQ,UAAUA,EAAQ,QAAQ,OAAO,CAAC,EAAE,MAAAM,QAAWA,MAASD,EAAM,IAAI;AAAA,EAAA,CAC3E;AAkBD,MAhBAM,EAAU,MAAM;AAEd,QADAX,EAAQ,UAAU,CAAA,GACd,CAACP,KAAU,CAACK,EAAY,SAAS,CAACI,EAAS;AAE/C,UAAMU,IAAWnB,IAASC,EAAS,WAAWD,CAAM,IAAIK,EAAY;AACpE,QAAKc;AAEL,aAAAA,EAAQ,iBAAiB,WAAWT,CAA0B,GAC9DS,EAAQ,iBAAiB,SAASF,CAAwB,GAEnD,MAAM;AACX,QAAAE,EAAQ,oBAAoB,WAAWT,CAA0B,GACjES,EAAQ,oBAAoB,SAASF,CAAwB;AAAA,MAAA;AAAA,EAC/D,GACC,CAACjB,GAAQK,EAAY,OAAOI,GAASP,GAASQ,GAAWO,CAAO,CAAC,GAEhE,CAAAjB;AACJ,WAAOK;AACT;"}
+{"version":3,"file":"useHotkeys.mjs","sources":["../../../../src/hooks/useHotkeys/useHotkeys.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 { useEvent } from '../useEvent/useEvent';\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The use hotkeys params type */\nexport interface UseHotkeysOptions {\n  /** Alias map for hotkeys */\n  alias?: Record<string, string>;\n  /** Enable or disable the event listeners */\n  enabled?: boolean;\n}\n\nexport const isHotkeyMatch = (hotkey: string, keys: UseHotkeysKey[]) =>\n  hotkey\n    .toLowerCase()\n    .split(/[+_,\\-]/g)\n    .map((key) => key.trim())\n    .every((key) =>\n      keys.find(\n        (updatedKey) =>\n          key === updatedKey.code.toLocaleLowerCase() ||\n          key === updatedKey.key.toLocaleLowerCase() ||\n          key === updatedKey.alias.toLocaleLowerCase()\n      )\n    );\n\n/** The hotkeys string type */\nexport type UseHotkeysHotkeys = string;\n\n/** The hotkey key information */\nexport interface UseHotkeysKey {\n  /** The alias for the key */\n  alias: string;\n  /** The key code */\n  code: string;\n  /** The key value */\n  key: string;\n}\n\n/** The use hotkeys target type */\nexport type UseHotkeysTarget = Element | React.RefObject<Element | null | undefined>;\n\nexport interface UseHotkeys {\n  (\n    target: UseHotkeysTarget,\n    hotkeys: UseHotkeysHotkeys,\n    callback: (event: KeyboardEvent) => void,\n    options?: UseHotkeysOptions\n  ): void;\n\n  <Target extends Element>(\n    hotkeys: UseHotkeysHotkeys,\n    callback: (event: KeyboardEvent) => void,\n    options?: UseHotkeysOptions,\n    target?: never\n  ): StateRef<Target>;\n}\n\n/**\n * @name useHotkeys\n * @description - Hook that listens for hotkeys\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} [target=window] The target element to attach the event listener to\n * @param {string} hotkeys The hotkey to listen for\n * @param {(event: KeyboardEvent) => void} callback The callback function to execute when hotkey is pressed\n * @param {Record<string, string>} [options.alias] Alias map for hotkeys\n * @param {boolean} [options.enabled=true] Enable or disable the event listeners\n * @returns {void}\n *\n * @example\n * useHotkeys(ref, 'ctrl+a', () => console.log('hotkey pressed'));\n * @example\n * useHotkeys(ref, 'ctrl+a, ctrl+b', () => console.log('hotkey pressed'));\n *\n * @overload\n * @template Target The target element\n * @param {string} hotkeys The hotkey to listen for\n * @param {(event: KeyboardEvent) => void} callback The callback function to execute when hotkey is pressed\n * @param {Record<string, string>} [options.alias] Alias map for hotkeys\n * @param {boolean} [options.enabled=true] Enable or disable the event listeners\n * @returns {StateRef<Target>} A reference to the target element\n *\n * @example\n * const ref = useHotkeys('ctrl+a', () => console.log('hotkey pressed'));\n * @example\n * const ref = useHotkeys('ctrl+a, ctrl+b', () => console.log('hotkey pressed'));\n */\nexport const useHotkeys = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n  const hotkeys = (target ? params[1] : params[0]) as UseHotkeysHotkeys;\n  const callback = (target ? params[2] : params[1]) as (event: KeyboardEvent) => void;\n  const options = (target ? params[3] : params[2]) as UseHotkeysOptions | undefined;\n\n  const internalRef = useRefState(window);\n  const keysRef = useRef<UseHotkeysKey[]>([]);\n  const enabled = options?.enabled ?? true;\n\n  const onKeyDown = useEvent((event: KeyboardEvent) => {\n    if (!enabled) return;\n\n    if (keysRef.current.some(({ code }) => code === event.code)) return;\n\n    const alias = options?.alias?.[event.key] ?? event.code;\n    const updatedKeys = [...keysRef.current, { key: event.key, code: event.code, alias }];\n    keysRef.current = updatedKeys;\n\n    const hotkeysList = hotkeys.split(',').map((h) => h.trim());\n    const isMatch = hotkeysList.some((hotkey) => isHotkeyMatch(hotkey, updatedKeys));\n    if (!isMatch) return;\n    event.preventDefault();\n    callback(event);\n  });\n\n  const onKeyUp = useEvent((event: KeyboardEvent) => {\n    if (!enabled) return;\n    keysRef.current = keysRef.current.filter(({ code }) => code !== event.code);\n  });\n\n  useEffect(() => {\n    keysRef.current = [];\n    if (!target && !internalRef.state && !enabled) return;\n\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    element.addEventListener('keydown', onKeyDown as EventListener);\n    element.addEventListener('keyup', onKeyUp as EventListener);\n\n    return () => {\n      element.removeEventListener('keydown', onKeyDown as EventListener);\n      element.removeEventListener('keyup', onKeyUp as EventListener);\n    };\n  }, [\n    target,\n    internalRef.state,\n    isTarget.getRefState(target),\n    enabled,\n    hotkeys,\n    onKeyDown,\n    onKeyUp\n  ]);\n\n  if (target) return;\n  return internalRef;\n}) as UseHotkeys;\n"],"names":["isHotkeyMatch","hotkey","keys","key","updatedKey","useHotkeys","params","target","isTarget","hotkeys","callback","options","internalRef","useRefState","keysRef","useRef","enabled","onKeyDown","useEvent","event","code","alias","updatedKeys","h","onKeyUp","useEffect","element"],"mappings":";;;;AAmBO,MAAMA,IAAgB,CAACC,GAAgBC,MAC5CD,EACG,cACA,MAAM,UAAU,EAChB,IAAI,CAACE,MAAQA,EAAI,KAAA,CAAM,EACvB;AAAA,EAAM,CAACA,MACND,EAAK;AAAA,IACH,CAACE,MACCD,MAAQC,EAAW,KAAK,kBAAA,KACxBD,MAAQC,EAAW,IAAI,kBAAA,KACvBD,MAAQC,EAAW,MAAM,kBAAA;AAAA,EAAkB;AAEjD,GAkESC,KAAc,IAAIC,MAAkB;AAC/C,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAWF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACxCI,IAAYH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACzCK,IAAWJ,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExCM,IAAcC,EAAY,MAAM,GAChCC,IAAUC,EAAwB,EAAE,GACpCC,IAAUL,GAAS,WAAW,IAE9BM,IAAYC,EAAS,CAACC,MAAyB;AAGnD,QAFI,CAACH,KAEDF,EAAQ,QAAQ,KAAK,CAAC,EAAE,MAAAM,QAAWA,MAASD,EAAM,IAAI,EAAG;AAE7D,UAAME,IAAQV,GAAS,QAAQQ,EAAM,GAAG,KAAKA,EAAM,MAC7CG,IAAc,CAAC,GAAGR,EAAQ,SAAS,EAAE,KAAKK,EAAM,KAAK,MAAMA,EAAM,MAAM,OAAAE,GAAO;AAKpF,IAJAP,EAAQ,UAAUQ,GAEEb,EAAQ,MAAM,GAAG,EAAE,IAAI,CAACc,MAAMA,EAAE,MAAM,EAC9B,KAAK,CAACtB,MAAWD,EAAcC,GAAQqB,CAAW,CAAC,MAE/EH,EAAM,eAAA,GACNT,EAASS,CAAK;AAAA,EAAA,CACf,GAEKK,IAAUN,EAAS,CAACC,MAAyB;AACjD,IAAKH,MACLF,EAAQ,UAAUA,EAAQ,QAAQ,OAAO,CAAC,EAAE,MAAAM,QAAWA,MAASD,EAAM,IAAI;AAAA,EAAA,CAC3E;AA0BD,MAxBAM,EAAU,MAAM;AAEd,QADAX,EAAQ,UAAU,CAAA,GACd,CAACP,KAAU,CAACK,EAAY,SAAS,CAACI,EAAS;AAE/C,UAAMU,IAAWnB,IAASC,EAAS,WAAWD,CAAM,IAAIK,EAAY;AACpE,QAAKc;AAEL,aAAAA,EAAQ,iBAAiB,WAAWT,CAA0B,GAC9DS,EAAQ,iBAAiB,SAASF,CAAwB,GAEnD,MAAM;AACX,QAAAE,EAAQ,oBAAoB,WAAWT,CAA0B,GACjES,EAAQ,oBAAoB,SAASF,CAAwB;AAAA,MAAA;AAAA,EAC/D,GACC;AAAA,IACDjB;AAAA,IACAK,EAAY;AAAA,IACZJ,EAAS,YAAYD,CAAM;AAAA,IAC3BS;AAAA,IACAP;AAAA,IACAQ;AAAA,IACAO;AAAA,EAAA,CACD,GAEG,CAAAjB;AACJ,WAAOK;AACT;"}

package/dist/esm/hooks/useHover/useHover.mjs

@@ -1,26 +1,26 @@
-import { useState as d, useRef as m, useEffect as L } from "react";
-import { useRefState as a } from "../useRefState/useRefState.mjs";
-import { isTarget as E } from "../../utils/helpers/isTarget.mjs";
-const R = (...e) => {
-  const t = E(e[0]) ? e[0] : void 0, r = t ? typeof e[1] == "object" ? e[1] : { onEntry: e[1] } : typeof e[0] == "object" ? e[0] : { onEntry: e[0] }, i = r?.enabled ?? !0, [c, f] = d(!1), o = a(), s = m(r);
-  return s.current = r, L(() => {
+import { useState as d, useRef as m, useEffect as a } from "react";
+import { useRefState as g } from "../useRefState/useRefState.mjs";
+import { isTarget as f } from "../../utils/helpers/isTarget.mjs";
+const b = ((...e) => {
+  const t = f(e[0]) ? e[0] : void 0, r = t ? typeof e[1] == "object" ? e[1] : { onEntry: e[1] } : typeof e[0] == "object" ? e[0] : { onEntry: e[0] }, i = r?.enabled ?? !0, [c, v] = d(!1), o = g(), s = m(r);
+  return s.current = r, a(() => {
     if (!i || !t && !o.state) return;
-    const n = t ? E.getElement(t) : o.current;
+    const n = t ? f.getElement(t) : o.current;
     if (!n) return;
-    const v = (u) => {
-      s.current?.onEntry?.(u), f(!0);
-    }, l = (u) => {
-      s.current?.onLeave?.(u), f(!1);
+    const l = (u) => {
+      s.current?.onEntry?.(u), v(!0);
+    }, E = (u) => {
+      s.current?.onLeave?.(u), v(!1);
     };
-    return n.addEventListener("mouseenter", v), n.addEventListener("mouseleave", l), () => {
-      n.removeEventListener("mouseenter", v), n.removeEventListener("mouseleave", l);
+    return n.addEventListener("mouseenter", l), n.addEventListener("mouseleave", E), () => {
+      n.removeEventListener("mouseenter", l), n.removeEventListener("mouseleave", E);
     };
-  }, [i, t, o.state]), t ? c : {
+  }, [i, t, o.state, f.getRefState(t)]), t ? c : {
     ref: o,
     value: c
   };
-};
+});
 export {
-  R as useHover
+  b as useHover
 };
 //# sourceMappingURL=useHover.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"useHover.mjs","sources":["../../../../src/hooks/useHover/useHover.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 hover options type */\nexport interface UseHoverOptions {\n  /** The enabled state of the hook */\n  enabled?: boolean;\n  /** The on entry callback */\n  onEntry?: (event: Event) => void;\n  /** The on leave callback */\n  onLeave?: (event: Event) => void;\n}\n\nexport interface UseHoverReturn {\n  value: boolean;\n}\n\nexport interface UseHover {\n  (target: HookTarget, callback?: (event: Event) => void): boolean;\n\n  (target: HookTarget, options?: UseHoverOptions): boolean;\n\n  <Target extends Element>(\n    callback?: (event: Event) => void,\n    target?: never\n  ): {\n    ref: StateRef<Target>;\n  } & UseHoverReturn;\n\n  <Target extends Element>(\n    options?: UseHoverOptions,\n    target?: never\n  ): {\n    ref: StateRef<Target>;\n  } & UseHoverReturn;\n}\n\n/**\n * @name useHover\n * @description - Hook that defines the logic when hovering an element\n * @category Elements\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target element to be hovered\n * @param {(event: Event) => void} [callback] The callback function to be invoked on mouse enter\n * @returns {boolean} The state of the hover\n *\n * @example\n * const hovering = useHover(ref, () => console.log('callback'));\n *\n * @overload\n * @param {HookTarget} target The target element to be hovered\n * @param {(event: Event) => void} [options.onEntry] The callback function to be invoked on mouse enter\n * @param {(event: Event) => void} [options.onLeave] The callback function to be invoked on mouse leave\n * @returns {boolean} The state of the hover\n *\n * @example\n * const hovering = useHover(ref, options);\n *\n * @overload\n * @template Target The target element\n * @param {(event: Event) => void} [callback] The callback function to be invoked on mouse enter\n * @returns {{ ref: StateRef<Target> } & UseHoverReturn} The state of the hover\n *\n * @example\n * const [ref, hovering] = useHover(() => console.log('callback'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: Event) => void} [options.onEntry] The callback function to be invoked on mouse enter\n * @param {(event: Event) => void} [options.onLeave] The callback function to be invoked on mouse leave\n * @returns {{ ref: StateRef<Target> } & UseHoverReturn} The state of the hover\n *\n * @example\n * const [ref, hovering] = useHover(options);\n */\nexport const useHover = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n\n  const options = (\n    target\n      ? typeof params[1] === 'object'\n        ? params[1]\n        : { onEntry: params[1] }\n      : typeof params[0] === 'object'\n        ? params[0]\n        : { onEntry: params[0] }\n  ) as UseHoverOptions | undefined;\n\n  const enabled = options?.enabled ?? true;\n\n  const [hovering, setHovering] = useState(false);\n  const internalRef = useRefState<Element>();\n  const internalOptionsRef = useRef(options);\n  internalOptionsRef.current = options;\n\n  useEffect(() => {\n    if (!enabled || (!target && !internalRef.state)) return;\n\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n\n    if (!element) return;\n\n    const onMouseEnter = (event: Event) => {\n      internalOptionsRef.current?.onEntry?.(event);\n      setHovering(true);\n    };\n\n    const onMouseLeave = (event: Event) => {\n      internalOptionsRef.current?.onLeave?.(event);\n      setHovering(false);\n    };\n\n    element.addEventListener('mouseenter', onMouseEnter);\n    element.addEventListener('mouseleave', onMouseLeave);\n\n    return () => {\n      element.removeEventListener('mouseenter', onMouseEnter);\n      element.removeEventListener('mouseleave', onMouseLeave);\n    };\n  }, [enabled, target, internalRef.state]);\n\n  if (target) return hovering;\n  return {\n    ref: internalRef,\n    value: hovering\n  } as const;\n}) as UseHover;\n"],"names":["useHover","params","target","isTarget","options","enabled","hovering","setHovering","useState","internalRef","useRefState","internalOptionsRef","useRef","useEffect","element","onMouseEnter","event","onMouseLeave"],"mappings":";;;AAoFO,MAAMA,IAAY,IAAIC,MAAkB;AAC7C,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAE5CG,IACJF,IACI,OAAOD,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,SAASA,EAAO,CAAC,EAAA,IACrB,OAAOA,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,SAASA,EAAO,CAAC,EAAA,GAGrBI,IAAUD,GAAS,WAAW,IAE9B,CAACE,GAAUC,CAAW,IAAIC,EAAS,EAAK,GACxCC,IAAcC,EAAA,GACdC,IAAqBC,EAAOR,CAAO;AA6BzC,SA5BAO,EAAmB,UAAUP,GAE7BS,EAAU,MAAM;AACd,QAAI,CAACR,KAAY,CAACH,KAAU,CAACO,EAAY,MAAQ;AAEjD,UAAMK,IAAWZ,IAASC,EAAS,WAAWD,CAAM,IAAIO,EAAY;AAEpE,QAAI,CAACK,EAAS;AAEd,UAAMC,IAAe,CAACC,MAAiB;AACrC,MAAAL,EAAmB,SAAS,UAAUK,CAAK,GAC3CT,EAAY,EAAI;AAAA,IAAA,GAGZU,IAAe,CAACD,MAAiB;AACrC,MAAAL,EAAmB,SAAS,UAAUK,CAAK,GAC3CT,EAAY,EAAK;AAAA,IAAA;AAGnB,WAAAO,EAAQ,iBAAiB,cAAcC,CAAY,GACnDD,EAAQ,iBAAiB,cAAcG,CAAY,GAE5C,MAAM;AACX,MAAAH,EAAQ,oBAAoB,cAAcC,CAAY,GACtDD,EAAQ,oBAAoB,cAAcG,CAAY;AAAA,IAAA;AAAA,EACxD,GACC,CAACZ,GAASH,GAAQO,EAAY,KAAK,CAAC,GAEnCP,IAAeI,IACZ;AAAA,IACL,KAAKG;AAAA,IACL,OAAOH;AAAA,EAAA;AAEX;"}
+{"version":3,"file":"useHover.mjs","sources":["../../../../src/hooks/useHover/useHover.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 hover options type */\nexport interface UseHoverOptions {\n  /** The enabled state of the hook */\n  enabled?: boolean;\n  /** The on entry callback */\n  onEntry?: (event: Event) => void;\n  /** The on leave callback */\n  onLeave?: (event: Event) => void;\n}\n\nexport interface UseHoverReturn {\n  value: boolean;\n}\n\nexport interface UseHover {\n  (target: HookTarget, callback?: (event: Event) => void): boolean;\n\n  (target: HookTarget, options?: UseHoverOptions): boolean;\n\n  <Target extends Element>(\n    callback?: (event: Event) => void,\n    target?: never\n  ): {\n    ref: StateRef<Target>;\n  } & UseHoverReturn;\n\n  <Target extends Element>(\n    options?: UseHoverOptions,\n    target?: never\n  ): {\n    ref: StateRef<Target>;\n  } & UseHoverReturn;\n}\n\n/**\n * @name useHover\n * @description - Hook that defines the logic when hovering an element\n * @category Elements\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target element to be hovered\n * @param {(event: Event) => void} [callback] The callback function to be invoked on mouse enter\n * @returns {boolean} The value of the hover\n *\n * @example\n * const hovering = useHover(ref, () => console.log('callback'));\n *\n * @overload\n * @param {HookTarget} target The target element to be hovered\n * @param {(event: Event) => void} [options.onEntry] The callback function to be invoked on mouse enter\n * @param {(event: Event) => void} [options.onLeave] The callback function to be invoked on mouse leave\n * @returns {boolean} The value of the hover\n *\n * @example\n * const hovering = useHover(ref, options);\n *\n * @overload\n * @template Target The target element\n * @param {(event: Event) => void} [callback] The callback function to be invoked on mouse enter\n * @returns {{ ref: StateRef<Target> } & UseHoverReturn} The object with the ref and the value of the hover\n *\n * @example\n * const { ref, value } = useHover(() => console.log('callback'));\n *\n * @overload\n * @template Target The target element\n * @param {(event: Event) => void} [options.onEntry] The callback function to be invoked on mouse enter\n * @param {(event: Event) => void} [options.onLeave] The callback function to be invoked on mouse leave\n * @returns {{ ref: StateRef<Target> } & UseHoverReturn} The object with the ref and the value of the hover\n *\n * @example\n * const { ref, value } = useHover(options);\n */\nexport const useHover = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n\n  const options = (\n    target\n      ? typeof params[1] === 'object'\n        ? params[1]\n        : { onEntry: params[1] }\n      : typeof params[0] === 'object'\n        ? params[0]\n        : { onEntry: params[0] }\n  ) as UseHoverOptions | undefined;\n\n  const enabled = options?.enabled ?? true;\n\n  const [hovering, setHovering] = useState(false);\n  const internalRef = useRefState<Element>();\n  const internalOptionsRef = useRef(options);\n  internalOptionsRef.current = options;\n\n  useEffect(() => {\n    if (!enabled || (!target && !internalRef.state)) return;\n\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n\n    if (!element) return;\n\n    const onMouseEnter = (event: Event) => {\n      internalOptionsRef.current?.onEntry?.(event);\n      setHovering(true);\n    };\n\n    const onMouseLeave = (event: Event) => {\n      internalOptionsRef.current?.onLeave?.(event);\n      setHovering(false);\n    };\n\n    element.addEventListener('mouseenter', onMouseEnter);\n    element.addEventListener('mouseleave', onMouseLeave);\n\n    return () => {\n      element.removeEventListener('mouseenter', onMouseEnter);\n      element.removeEventListener('mouseleave', onMouseLeave);\n    };\n  }, [enabled, target, internalRef.state, isTarget.getRefState(target)]);\n\n  if (target) return hovering;\n  return {\n    ref: internalRef,\n    value: hovering\n  } as const;\n}) as UseHover;\n"],"names":["useHover","params","target","isTarget","options","enabled","hovering","setHovering","useState","internalRef","useRefState","internalOptionsRef","useRef","useEffect","element","onMouseEnter","event","onMouseLeave"],"mappings":";;;AAoFO,MAAMA,KAAY,IAAIC,MAAkB;AAC7C,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAE5CG,IACJF,IACI,OAAOD,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,SAASA,EAAO,CAAC,EAAA,IACrB,OAAOA,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,SAASA,EAAO,CAAC,EAAA,GAGrBI,IAAUD,GAAS,WAAW,IAE9B,CAACE,GAAUC,CAAW,IAAIC,EAAS,EAAK,GACxCC,IAAcC,EAAA,GACdC,IAAqBC,EAAOR,CAAO;AA6BzC,SA5BAO,EAAmB,UAAUP,GAE7BS,EAAU,MAAM;AACd,QAAI,CAACR,KAAY,CAACH,KAAU,CAACO,EAAY,MAAQ;AAEjD,UAAMK,IAAWZ,IAASC,EAAS,WAAWD,CAAM,IAAIO,EAAY;AAEpE,QAAI,CAACK,EAAS;AAEd,UAAMC,IAAe,CAACC,MAAiB;AACrC,MAAAL,EAAmB,SAAS,UAAUK,CAAK,GAC3CT,EAAY,EAAI;AAAA,IAAA,GAGZU,IAAe,CAACD,MAAiB;AACrC,MAAAL,EAAmB,SAAS,UAAUK,CAAK,GAC3CT,EAAY,EAAK;AAAA,IAAA;AAGnB,WAAAO,EAAQ,iBAAiB,cAAcC,CAAY,GACnDD,EAAQ,iBAAiB,cAAcG,CAAY,GAE5C,MAAM;AACX,MAAAH,EAAQ,oBAAoB,cAAcC,CAAY,GACtDD,EAAQ,oBAAoB,cAAcG,CAAY;AAAA,IAAA;AAAA,EACxD,GACC,CAACZ,GAASH,GAAQO,EAAY,OAAON,EAAS,YAAYD,CAAM,CAAC,CAAC,GAEjEA,IAAeI,IACZ;AAAA,IACL,KAAKG;AAAA,IACL,OAAOH;AAAA,EAAA;AAEX;"}

package/dist/esm/hooks/useInfiniteScroll/useInfiniteScroll.mjs

@@ -1,32 +1,32 @@
 import { useState as H, useRef as L, useEffect as I } from "react";
 import { useRefState as T } from "../useRefState/useRefState.mjs";
-import { isTarget as R } from "../../utils/helpers/isTarget.mjs";
-const B = (...e) => {
-  const t = R(e[0]) ? e[0] : void 0, c = t ? e[1] : e[0], s = t ? e[2] : e[1], i = s?.direction ?? "bottom", l = s?.distance ?? 10, [n, f] = H(!1), o = T(), a = L(c);
-  a.current = c;
-  const u = L(n);
-  return u.current = n, I(() => {
+import { isTarget as c } from "../../utils/helpers/isTarget.mjs";
+const B = ((...e) => {
+  const t = c(e[0]) ? e[0] : void 0, s = t ? e[1] : e[0], i = t ? e[2] : e[1], l = i?.direction ?? "bottom", f = i?.distance ?? 10, [n, a] = H(!1), o = T(), u = L(s);
+  u.current = s;
+  const d = L(n);
+  return d.current = n, I(() => {
     if (!t && !o.state) return;
-    const r = t ? R.getElement(t) : o.current;
+    const r = t ? c.getElement(t) : o.current;
     if (!r) return;
-    const d = async (g) => {
-      if (u.current) return;
-      const { clientHeight: b, scrollHeight: E, scrollTop: m, clientWidth: v, scrollWidth: S, scrollLeft: h } = g.target, k = E - (m + b), p = S - (h + v);
+    const g = async (m) => {
+      if (d.current) return;
+      const { clientHeight: b, scrollHeight: E, scrollTop: R, clientWidth: S, scrollWidth: v, scrollLeft: h } = m.target, k = E - (R + b), p = v - (h + S);
       ({
         bottom: k,
-        top: m,
+        top: R,
         right: p,
         left: h
-      })[i] <= l && (f(!0), await a.current(g), f(!1));
+      })[l] <= f && (a(!0), await u.current(m), a(!1));
     };
-    return r.addEventListener("scroll", d), () => {
-      r.removeEventListener("scroll", d);
+    return r.addEventListener("scroll", g), () => {
+      r.removeEventListener("scroll", g);
     };
-  }, [t, o.state, i, l]), t ? n : {
+  }, [t, o.state, c.getRefState(t), l, f]), t ? n : {
     ref: o,
     loading: n
   };
-};
+});
 export {
   B as useInfiniteScroll
 };

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

@@ -1 +1 @@
-{"version":3,"file":"useInfiniteScroll.mjs","sources":["../../../../src/hooks/useInfiniteScroll/useInfiniteScroll.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 infinite scroll options type */\nexport interface UseInfiniteScrollOptions {\n  /** The direction to trigger the callback */\n  direction?: 'bottom' | 'left' | 'right' | 'top';\n  /** The distance in pixels to trigger the callback */\n  distance?: number;\n}\n\nexport interface UseInfiniteScroll {\n  (\n    target: HookTarget,\n    callback: (event: Event) => void,\n    options?: UseInfiniteScrollOptions\n  ): boolean;\n\n  <Target extends Element>(\n    callback: (event: Event) => void,\n    options?: UseInfiniteScrollOptions,\n    target?: never\n  ): {\n    ref: StateRef<Target>;\n    loading: boolean;\n  };\n}\n\n/**\n * @name useInfiniteScroll\n * @description - Hook that defines the logic for infinite scroll\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @template Target The target element\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @param {number} [options.distance=10] The distance in pixels to trigger the callback\n * @param {string} [options.direction='bottom'] The direction to trigger the callback\n * @returns {{ ref: StateRef<Target>, loading: boolean }} An object containing the ref and loading\n *\n * @example\n * const { ref, loading } = useInfiniteScroll(() => console.log('infinite scroll'));\n *\n * @overload\n * @param {HookTarget} target The target element to detect infinite scroll for\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @param {number} [options.distance=10] The distance in pixels to trigger the callback\n * @param {string} [options.direction='bottom'] The direction to trigger the callback\n * @returns {boolean} A loading indicator of the infinite scroll\n *\n * @example\n * const loading = useInfiniteScroll(ref, () => console.log('infinite scroll'));\n */\nexport const useInfiniteScroll = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n  const callback = (target ? params[1] : params[0]) as (event: Event) => void;\n  const options = (target ? params[2] : params[1]) as UseInfiniteScrollOptions | undefined;\n\n  const direction = options?.direction ?? 'bottom';\n  const distance = options?.distance ?? 10;\n\n  const [loading, setIsLoading] = useState(false);\n\n  const internalRef = useRefState<Element>();\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n  const internalLoadingRef = useRef(loading);\n  internalLoadingRef.current = loading;\n\n  useEffect(() => {\n    if (!target && !internalRef.state) return;\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    const onLoadMore = async (event: Event) => {\n      if (internalLoadingRef.current) return;\n\n      const { clientHeight, scrollHeight, scrollTop, clientWidth, scrollWidth, scrollLeft } =\n        event.target as Element;\n      const scrollBottom = scrollHeight - (scrollTop + clientHeight);\n      const scrollRight = scrollWidth - (scrollLeft + clientWidth);\n\n      const distances = {\n        bottom: scrollBottom,\n        top: scrollTop,\n        right: scrollRight,\n        left: scrollLeft\n      };\n\n      if (distances[direction] <= distance) {\n        setIsLoading(true);\n        await internalCallbackRef.current(event);\n        setIsLoading(false);\n      }\n    };\n\n    element.addEventListener('scroll', onLoadMore);\n\n    return () => {\n      element.removeEventListener('scroll', onLoadMore);\n    };\n  }, [target, internalRef.state, direction, distance]);\n\n  if (target) return loading;\n  return {\n    ref: internalRef,\n    loading\n  };\n}) as UseInfiniteScroll;\n"],"names":["useInfiniteScroll","params","target","isTarget","callback","options","direction","distance","loading","setIsLoading","useState","internalRef","useRefState","internalCallbackRef","useRef","internalLoadingRef","useEffect","element","onLoadMore","event","clientHeight","scrollHeight","scrollTop","clientWidth","scrollWidth","scrollLeft","scrollBottom","scrollRight"],"mappings":";;;AA6DO,MAAMA,IAAqB,IAAIC,MAAkB;AACtD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAYF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACzCI,IAAWH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExCK,IAAYD,GAAS,aAAa,UAClCE,IAAWF,GAAS,YAAY,IAEhC,CAACG,GAASC,CAAY,IAAIC,EAAS,EAAK,GAExCC,IAAcC,EAAA,GACdC,IAAsBC,EAAOV,CAAQ;AAC3C,EAAAS,EAAoB,UAAUT;AAC9B,QAAMW,IAAqBD,EAAON,CAAO;AAqCzC,SApCAO,EAAmB,UAAUP,GAE7BQ,EAAU,MAAM;AACd,QAAI,CAACd,KAAU,CAACS,EAAY,MAAO;AACnC,UAAMM,IAAWf,IAASC,EAAS,WAAWD,CAAM,IAAIS,EAAY;AACpE,QAAI,CAACM,EAAS;AAEd,UAAMC,IAAa,OAAOC,MAAiB;AACzC,UAAIJ,EAAmB,QAAS;AAEhC,YAAM,EAAE,cAAAK,GAAc,cAAAC,GAAc,WAAAC,GAAW,aAAAC,GAAa,aAAAC,GAAa,YAAAC,MACvEN,EAAM,QACFO,IAAeL,KAAgBC,IAAYF,IAC3CO,IAAcH,KAAeC,IAAaF;AAShD,OAPkB;AAAA,QAChB,QAAQG;AAAA,QACR,KAAKJ;AAAA,QACL,OAAOK;AAAA,QACP,MAAMF;AAAA,MAAA,GAGMnB,CAAS,KAAKC,MAC1BE,EAAa,EAAI,GACjB,MAAMI,EAAoB,QAAQM,CAAK,GACvCV,EAAa,EAAK;AAAA,IACpB;AAGF,WAAAQ,EAAQ,iBAAiB,UAAUC,CAAU,GAEtC,MAAM;AACX,MAAAD,EAAQ,oBAAoB,UAAUC,CAAU;AAAA,IAAA;AAAA,EAClD,GACC,CAAChB,GAAQS,EAAY,OAAOL,GAAWC,CAAQ,CAAC,GAE/CL,IAAeM,IACZ;AAAA,IACL,KAAKG;AAAA,IACL,SAAAH;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useInfiniteScroll.mjs","sources":["../../../../src/hooks/useInfiniteScroll/useInfiniteScroll.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 infinite scroll options type */\nexport interface UseInfiniteScrollOptions {\n  /** The direction to trigger the callback */\n  direction?: 'bottom' | 'left' | 'right' | 'top';\n  /** The distance in pixels to trigger the callback */\n  distance?: number;\n}\n\nexport interface UseInfiniteScroll {\n  (\n    target: HookTarget,\n    callback: (event: Event) => void,\n    options?: UseInfiniteScrollOptions\n  ): boolean;\n\n  <Target extends Element>(\n    callback: (event: Event) => void,\n    options?: UseInfiniteScrollOptions,\n    target?: never\n  ): {\n    ref: StateRef<Target>;\n    loading: boolean;\n  };\n}\n\n/**\n * @name useInfiniteScroll\n * @description - Hook that defines the logic for infinite scroll\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @template Target The target element\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @param {number} [options.distance=10] The distance in pixels to trigger the callback\n * @param {string} [options.direction='bottom'] The direction to trigger the callback\n * @returns {{ ref: StateRef<Target>, loading: boolean }} An object containing the ref and loading\n *\n * @example\n * const { ref, loading } = useInfiniteScroll(() => console.log('infinite scroll'));\n *\n * @overload\n * @param {HookTarget} target The target element to detect infinite scroll for\n * @param {(event: Event) => void} callback The callback to execute when a click outside the target is detected\n * @param {number} [options.distance=10] The distance in pixels to trigger the callback\n * @param {string} [options.direction='bottom'] The direction to trigger the callback\n * @returns {boolean} A loading indicator of the infinite scroll\n *\n * @example\n * const loading = useInfiniteScroll(ref, () => console.log('infinite scroll'));\n */\nexport const useInfiniteScroll = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n  const callback = (target ? params[1] : params[0]) as (event: Event) => void;\n  const options = (target ? params[2] : params[1]) as UseInfiniteScrollOptions | undefined;\n\n  const direction = options?.direction ?? 'bottom';\n  const distance = options?.distance ?? 10;\n\n  const [loading, setIsLoading] = useState(false);\n\n  const internalRef = useRefState<Element>();\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n  const internalLoadingRef = useRef(loading);\n  internalLoadingRef.current = loading;\n\n  useEffect(() => {\n    if (!target && !internalRef.state) return;\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    const onLoadMore = async (event: Event) => {\n      if (internalLoadingRef.current) return;\n\n      const { clientHeight, scrollHeight, scrollTop, clientWidth, scrollWidth, scrollLeft } =\n        event.target as Element;\n      const scrollBottom = scrollHeight - (scrollTop + clientHeight);\n      const scrollRight = scrollWidth - (scrollLeft + clientWidth);\n\n      const distances = {\n        bottom: scrollBottom,\n        top: scrollTop,\n        right: scrollRight,\n        left: scrollLeft\n      };\n\n      if (distances[direction] <= distance) {\n        setIsLoading(true);\n        await internalCallbackRef.current(event);\n        setIsLoading(false);\n      }\n    };\n\n    element.addEventListener('scroll', onLoadMore);\n\n    return () => {\n      element.removeEventListener('scroll', onLoadMore);\n    };\n  }, [target, internalRef.state, isTarget.getRefState(target), direction, distance]);\n\n  if (target) return loading;\n  return {\n    ref: internalRef,\n    loading\n  };\n}) as UseInfiniteScroll;\n"],"names":["useInfiniteScroll","params","target","isTarget","callback","options","direction","distance","loading","setIsLoading","useState","internalRef","useRefState","internalCallbackRef","useRef","internalLoadingRef","useEffect","element","onLoadMore","event","clientHeight","scrollHeight","scrollTop","clientWidth","scrollWidth","scrollLeft","scrollBottom","scrollRight"],"mappings":";;;AA6DO,MAAMA,KAAqB,IAAIC,MAAkB;AACtD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,IAAYF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACzCI,IAAWH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAExCK,IAAYD,GAAS,aAAa,UAClCE,IAAWF,GAAS,YAAY,IAEhC,CAACG,GAASC,CAAY,IAAIC,EAAS,EAAK,GAExCC,IAAcC,EAAA,GACdC,IAAsBC,EAAOV,CAAQ;AAC3C,EAAAS,EAAoB,UAAUT;AAC9B,QAAMW,IAAqBD,EAAON,CAAO;AAqCzC,SApCAO,EAAmB,UAAUP,GAE7BQ,EAAU,MAAM;AACd,QAAI,CAACd,KAAU,CAACS,EAAY,MAAO;AACnC,UAAMM,IAAWf,IAASC,EAAS,WAAWD,CAAM,IAAIS,EAAY;AACpE,QAAI,CAACM,EAAS;AAEd,UAAMC,IAAa,OAAOC,MAAiB;AACzC,UAAIJ,EAAmB,QAAS;AAEhC,YAAM,EAAE,cAAAK,GAAc,cAAAC,GAAc,WAAAC,GAAW,aAAAC,GAAa,aAAAC,GAAa,YAAAC,MACvEN,EAAM,QACFO,IAAeL,KAAgBC,IAAYF,IAC3CO,IAAcH,KAAeC,IAAaF;AAShD,OAPkB;AAAA,QAChB,QAAQG;AAAA,QACR,KAAKJ;AAAA,QACL,OAAOK;AAAA,QACP,MAAMF;AAAA,MAAA,GAGMnB,CAAS,KAAKC,MAC1BE,EAAa,EAAI,GACjB,MAAMI,EAAoB,QAAQM,CAAK,GACvCV,EAAa,EAAK;AAAA,IACpB;AAGF,WAAAQ,EAAQ,iBAAiB,UAAUC,CAAU,GAEtC,MAAM;AACX,MAAAD,EAAQ,oBAAoB,UAAUC,CAAU;AAAA,IAAA;AAAA,EAClD,GACC,CAAChB,GAAQS,EAAY,OAAOR,EAAS,YAAYD,CAAM,GAAGI,GAAWC,CAAQ,CAAC,GAE7EL,IAAeM,IACZ;AAAA,IACL,KAAKG;AAAA,IACL,SAAAH;AAAA,EAAA;AAEJ;"}

package/dist/esm/hooks/useIntersectionObserver/useIntersectionObserver.mjs

@@ -1,31 +1,39 @@
-import { useState as v, useRef as C, useEffect as E } from "react";
-import { useRefState as R } from "../useRefState/useRefState.mjs";
-import { isTarget as s } from "../../utils/helpers/isTarget.mjs";
-const k = (...e) => {
-  const o = s(e[0]) ? e[0] : void 0, t = o ? typeof e[1] == "object" ? e[1] : { onChange: e[1] } : typeof e[0] == "object" ? e[0] : { onChange: e[0] }, c = t?.onChange, i = t?.enabled ?? !0, [f, d] = v(), [u, h] = v(), n = R(), b = C(c);
-  return b.current = c, E(() => {
-    if (!i || !o && !n.state) return;
-    const l = o ? s.getElement(o) : n.current;
+import { useState as v, useRef as R, useEffect as C } from "react";
+import { useRefState as E } from "../useRefState/useRefState.mjs";
+import { isTarget as r } from "../../utils/helpers/isTarget.mjs";
+const j = ((...e) => {
+  const o = r(e[0]) ? e[0] : void 0, t = o ? typeof e[1] == "object" ? e[1] : { onChange: e[1] } : typeof e[0] == "object" ? e[0] : { onChange: e[0] }, c = t?.onChange, f = t?.enabled ?? !0, [i, d] = v(), [u, a] = v(), n = E(), b = R(c);
+  return b.current = c, C(() => {
+    if (!f || !o && !n.state) return;
+    const l = o ? r.getElement(o) : n.current;
     if (!l) return;
-    const r = new IntersectionObserver(
-      (g, a) => {
-        h(g), b.current?.(g, a);
+    const s = new IntersectionObserver(
+      (g, h) => {
+        a(g), b.current?.(g, h);
       },
       {
         ...t,
-        root: t?.root ? s.getElement(t.root) : document
+        root: t?.root ? r.getElement(t.root) : document
       }
     );
-    return d(r), r.observe(l), () => {
-      r.disconnect();
+    return d(s), s.observe(l), () => {
+      s.disconnect();
     };
-  }, [o, n.state, t?.rootMargin, t?.threshold, t?.root, i]), o ? { observer: f, entries: u } : {
-    observer: f,
+  }, [
+    o,
+    n.state,
+    r.getRefState(o),
+    t?.rootMargin,
+    t?.threshold,
+    t?.root,
+    f
+  ]), o ? { observer: i, entries: u } : {
+    observer: i,
     ref: n,
     entries: u
   };
-};
+});
 export {
-  k as useIntersectionObserver
+  j as useIntersectionObserver
 };
 //# sourceMappingURL=useIntersectionObserver.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"useIntersectionObserver.mjs","sources":["../../../../src/hooks/useIntersectionObserver/useIntersectionObserver.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 intersection observer callback type */\nexport type UseIntersectionObserverCallback = (\n  entries: IntersectionObserverEntry[],\n  observer: IntersectionObserver\n) => void;\n\n/** The intersection observer options type */\nexport interface UseIntersectionObserverOptions extends Omit<IntersectionObserverInit, 'root'> {\n  /** The enabled state of the intersection observer */\n  enabled?: boolean;\n  /** The callback to execute when intersection is detected */\n  onChange?: UseIntersectionObserverCallback;\n  /** The root element to observe */\n  root?: HookTarget;\n}\n\n/** The intersection observer return type */\nexport interface UseIntersectionObserverReturn {\n  /** The intersection observer entry */\n  entries?: IntersectionObserverEntry[];\n  /** The intersection observer instance */\n  observer?: IntersectionObserver;\n}\n\nexport interface UseIntersectionObserver {\n  <Target extends Element>(\n    options?: UseIntersectionObserverOptions,\n    target?: never\n  ): UseIntersectionObserverReturn & { ref: StateRef<Target> };\n\n  (target: HookTarget, options?: UseIntersectionObserverOptions): UseIntersectionObserverReturn;\n\n  <Target extends Element>(\n    callback: UseIntersectionObserverCallback,\n    target?: never\n  ): UseIntersectionObserverReturn & { ref: StateRef<Target> };\n\n  (target: HookTarget, callback: UseIntersectionObserverCallback): UseIntersectionObserverReturn;\n}\n\n/**\n * @name useIntersectionObserver\n * @description - Hook that gives you intersection observer state\n * @category Sensors\n * @usage medium\n *\n * @browserapi IntersectionObserver https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver\n *\n * @overload\n * @param {HookTarget} target The target element to detect intersection\n * @param {boolean} [options.enabled=true] The IntersectionObserver options\n * @param {((entries: IntersectionObserverEntry[], observer: IntersectionObserver) => void) | undefined} [options.onChange] The callback to execute when intersection is detected\n * @param {HookTarget} [options.root=document] The root element to observe\n * @returns {UseIntersectionObserverReturn} An object containing the state\n *\n * @example\n * const { ref, entries, observer } = useIntersectionObserver();\n *\n * @overload\n * @template Target The target element\n * @param {boolean} [options.enabled=true] The IntersectionObserver options\n * @param {((entries: IntersectionObserverEntry[], observer: IntersectionObserver) => void) | undefined} [options.onChange] The callback to execute when intersection is detected\n * @param {HookTarget} [options.root=document] The root element to observe\n * @returns {UseIntersectionObserverReturn & { ref: StateRef<Target> }} A React ref to attach to the target element\n *\n * @example\n * const { entries, observer } = useIntersectionObserver(ref);\n *\n * @overload\n * @template Target The target element\n * @param {UseIntersectionObserverCallback} callback The callback to execute when intersection is detected\n * @returns {UseIntersectionObserverReturn & { ref: StateRef<Target> }} A React ref to attach to the target element\n *\n * @example\n * const { ref, entries, observer } = useIntersectionObserver(() => console.log('callback'));\n *\n * @overload\n * @param {UseIntersectionObserverCallback} callback The callback to execute when intersection is detected\n * @param {HookTarget} target The target element to detect intersection\n * @returns {UseIntersectionObserverReturn} An object containing the state\n *\n * @example\n * const { entries, observer } = useIntersectionObserver(ref, () => console.log('callback'));\n */\nexport const useIntersectionObserver = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n\n  const options = (\n    target\n      ? typeof params[1] === 'object'\n        ? params[1]\n        : { onChange: params[1] }\n      : typeof params[0] === 'object'\n        ? params[0]\n        : { onChange: params[0] }\n  ) as UseIntersectionObserverOptions | undefined;\n\n  const callback = options?.onChange;\n  const enabled = options?.enabled ?? true;\n\n  const [observer, setObserver] = useState<IntersectionObserver>();\n  const [entries, setEntries] = useState<IntersectionObserverEntry[]>();\n\n  const internalRef = useRefState<Element>();\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n\n  useEffect(() => {\n    if (!enabled || (!target && !internalRef.state)) return;\n\n    const element = target ? isTarget.getElement(target) : internalRef.current;\n    if (!element) return;\n\n    const observer = new IntersectionObserver(\n      (entries, observer) => {\n        setEntries(entries);\n        internalCallbackRef.current?.(entries, observer);\n      },\n      {\n        ...options,\n        root: options?.root ? (isTarget.getElement(options.root) as Document | Element) : document\n      }\n    );\n\n    setObserver(observer);\n    observer.observe(element as Element);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [target, internalRef.state, options?.rootMargin, options?.threshold, options?.root, enabled]);\n\n  if (target) return { observer, entries };\n  return {\n    observer,\n    ref: internalRef,\n    entries\n  };\n}) as UseIntersectionObserver;\n"],"names":["useIntersectionObserver","params","target","isTarget","options","callback","enabled","observer","setObserver","useState","entries","setEntries","internalRef","useRefState","internalCallbackRef","useRef","useEffect","element"],"mappings":";;;AA8FO,MAAMA,IAA2B,IAAIC,MAAkB;AAC5D,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAE5CG,IACJF,IACI,OAAOD,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,UAAUA,EAAO,CAAC,EAAA,IACtB,OAAOA,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,UAAUA,EAAO,CAAC,EAAA,GAGtBI,IAAWD,GAAS,UACpBE,IAAUF,GAAS,WAAW,IAE9B,CAACG,GAAUC,CAAW,IAAIC,EAAA,GAC1B,CAACC,GAASC,CAAU,IAAIF,EAAA,GAExBG,IAAcC,EAAA,GACdC,IAAsBC,EAAOV,CAAQ;AA4B3C,SA3BAS,EAAoB,UAAUT,GAE9BW,EAAU,MAAM;AACd,QAAI,CAACV,KAAY,CAACJ,KAAU,CAACU,EAAY,MAAQ;AAEjD,UAAMK,IAAUf,IAASC,EAAS,WAAWD,CAAM,IAAIU,EAAY;AACnE,QAAI,CAACK,EAAS;AAEd,UAAMV,IAAW,IAAI;AAAA,MACnB,CAACG,GAASH,MAAa;AACrB,QAAAI,EAAWD,CAAO,GAClBI,EAAoB,UAAUJ,GAASH,CAAQ;AAAA,MAAA;AAAA,MAEjD;AAAA,QACE,GAAGH;AAAA,QACH,MAAMA,GAAS,OAAQD,EAAS,WAAWC,EAAQ,IAAI,IAA2B;AAAA,MAAA;AAAA,IACpF;AAGF,WAAAI,EAAYD,CAAQ,GACpBA,EAAS,QAAQU,CAAkB,GAE5B,MAAM;AACXV,MAAAA,EAAS,WAAA;AAAA,IAAW;AAAA,EACtB,GACC,CAACL,GAAQU,EAAY,OAAOR,GAAS,YAAYA,GAAS,WAAWA,GAAS,MAAME,CAAO,CAAC,GAE3FJ,IAAe,EAAE,UAAAK,GAAU,SAAAG,EAAA,IACxB;AAAA,IACL,UAAAH;AAAA,IACA,KAAKK;AAAA,IACL,SAAAF;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useIntersectionObserver.mjs","sources":["../../../../src/hooks/useIntersectionObserver/useIntersectionObserver.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 intersection observer callback type */\nexport type UseIntersectionObserverCallback = (\n  entries: IntersectionObserverEntry[],\n  observer: IntersectionObserver\n) => void;\n\n/** The intersection observer options type */\nexport interface UseIntersectionObserverOptions extends Omit<IntersectionObserverInit, 'root'> {\n  /** The enabled state of the intersection observer */\n  enabled?: boolean;\n  /** The callback to execute when intersection is detected */\n  onChange?: UseIntersectionObserverCallback;\n  /** The root element to observe */\n  root?: HookTarget;\n}\n\n/** The intersection observer return type */\nexport interface UseIntersectionObserverReturn {\n  /** The intersection observer entry */\n  entries?: IntersectionObserverEntry[];\n  /** The intersection observer instance */\n  observer?: IntersectionObserver;\n}\n\nexport interface UseIntersectionObserver {\n  <Target extends Element>(\n    options?: UseIntersectionObserverOptions,\n    target?: never\n  ): UseIntersectionObserverReturn & { ref: StateRef<Target> };\n\n  (target: HookTarget, options?: UseIntersectionObserverOptions): UseIntersectionObserverReturn;\n\n  <Target extends Element>(\n    callback: UseIntersectionObserverCallback,\n    target?: never\n  ): UseIntersectionObserverReturn & { ref: StateRef<Target> };\n\n  (target: HookTarget, callback: UseIntersectionObserverCallback): UseIntersectionObserverReturn;\n}\n\n/**\n * @name useIntersectionObserver\n * @description - Hook that gives you intersection observer state\n * @category Sensors\n * @usage medium\n *\n * @browserapi IntersectionObserver https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver\n *\n * @overload\n * @param {HookTarget} target The target element to detect intersection\n * @param {boolean} [options.enabled=true] The IntersectionObserver options\n * @param {((entries: IntersectionObserverEntry[], observer: IntersectionObserver) => void) | undefined} [options.onChange] The callback to execute when intersection is detected\n * @param {HookTarget} [options.root=document] The root element to observe\n * @returns {UseIntersectionObserverReturn} An object containing the state\n *\n * @example\n * const { ref, entries, observer } = useIntersectionObserver();\n *\n * @overload\n * @template Target The target element\n * @param {boolean} [options.enabled=true] The IntersectionObserver options\n * @param {((entries: IntersectionObserverEntry[], observer: IntersectionObserver) => void) | undefined} [options.onChange] The callback to execute when intersection is detected\n * @param {HookTarget} [options.root=document] The root element to observe\n * @returns {UseIntersectionObserverReturn & { ref: StateRef<Target> }} A React ref to attach to the target element\n *\n * @example\n * const { entries, observer } = useIntersectionObserver(ref);\n *\n * @overload\n * @template Target The target element\n * @param {UseIntersectionObserverCallback} callback The callback to execute when intersection is detected\n * @returns {UseIntersectionObserverReturn & { ref: StateRef<Target> }} A React ref to attach to the target element\n *\n * @example\n * const { ref, entries, observer } = useIntersectionObserver(() => console.log('callback'));\n *\n * @overload\n * @param {UseIntersectionObserverCallback} callback The callback to execute when intersection is detected\n * @param {HookTarget} target The target element to detect intersection\n * @returns {UseIntersectionObserverReturn} An object containing the state\n *\n * @example\n * const { entries, observer } = useIntersectionObserver(ref, () => console.log('callback'));\n */\nexport const useIntersectionObserver = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n\n  const options = (\n    target\n      ? typeof params[1] === 'object'\n        ? params[1]\n        : { onChange: params[1] }\n      : typeof params[0] === 'object'\n        ? params[0]\n        : { onChange: params[0] }\n  ) as UseIntersectionObserverOptions | undefined;\n\n  const callback = options?.onChange;\n  const enabled = options?.enabled ?? true;\n\n  const [observer, setObserver] = useState<IntersectionObserver>();\n  const [entries, setEntries] = useState<IntersectionObserverEntry[]>();\n\n  const internalRef = useRefState<Element>();\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n\n  useEffect(() => {\n    if (!enabled || (!target && !internalRef.state)) return;\n\n    const element = target ? isTarget.getElement(target) : internalRef.current;\n    if (!element) return;\n\n    const observer = new IntersectionObserver(\n      (entries, observer) => {\n        setEntries(entries);\n        internalCallbackRef.current?.(entries, observer);\n      },\n      {\n        ...options,\n        root: options?.root ? (isTarget.getElement(options.root) as Document | Element) : document\n      }\n    );\n\n    setObserver(observer);\n    observer.observe(element as Element);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [\n    target,\n    internalRef.state,\n    isTarget.getRefState(target),\n    options?.rootMargin,\n    options?.threshold,\n    options?.root,\n    enabled\n  ]);\n\n  if (target) return { observer, entries };\n  return {\n    observer,\n    ref: internalRef,\n    entries\n  };\n}) as UseIntersectionObserver;\n"],"names":["useIntersectionObserver","params","target","isTarget","options","callback","enabled","observer","setObserver","useState","entries","setEntries","internalRef","useRefState","internalCallbackRef","useRef","useEffect","element"],"mappings":";;;AA8FO,MAAMA,KAA2B,IAAIC,MAAkB;AAC5D,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAE5CG,IACJF,IACI,OAAOD,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,UAAUA,EAAO,CAAC,EAAA,IACtB,OAAOA,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,UAAUA,EAAO,CAAC,EAAA,GAGtBI,IAAWD,GAAS,UACpBE,IAAUF,GAAS,WAAW,IAE9B,CAACG,GAAUC,CAAW,IAAIC,EAAA,GAC1B,CAACC,GAASC,CAAU,IAAIF,EAAA,GAExBG,IAAcC,EAAA,GACdC,IAAsBC,EAAOV,CAAQ;AAoC3C,SAnCAS,EAAoB,UAAUT,GAE9BW,EAAU,MAAM;AACd,QAAI,CAACV,KAAY,CAACJ,KAAU,CAACU,EAAY,MAAQ;AAEjD,UAAMK,IAAUf,IAASC,EAAS,WAAWD,CAAM,IAAIU,EAAY;AACnE,QAAI,CAACK,EAAS;AAEd,UAAMV,IAAW,IAAI;AAAA,MACnB,CAACG,GAASH,MAAa;AACrB,QAAAI,EAAWD,CAAO,GAClBI,EAAoB,UAAUJ,GAASH,CAAQ;AAAA,MAAA;AAAA,MAEjD;AAAA,QACE,GAAGH;AAAA,QACH,MAAMA,GAAS,OAAQD,EAAS,WAAWC,EAAQ,IAAI,IAA2B;AAAA,MAAA;AAAA,IACpF;AAGF,WAAAI,EAAYD,CAAQ,GACpBA,EAAS,QAAQU,CAAkB,GAE5B,MAAM;AACXV,MAAAA,EAAS,WAAA;AAAA,IAAW;AAAA,EACtB,GACC;AAAA,IACDL;AAAA,IACAU,EAAY;AAAA,IACZT,EAAS,YAAYD,CAAM;AAAA,IAC3BE,GAAS;AAAA,IACTA,GAAS;AAAA,IACTA,GAAS;AAAA,IACTE;AAAA,EAAA,CACD,GAEGJ,IAAe,EAAE,UAAAK,GAAU,SAAAG,EAAA,IACxB;AAAA,IACL,UAAAH;AAAA,IACA,KAAKK;AAAA,IACL,SAAAF;AAAA,EAAA;AAEJ;"}

package/dist/esm/hooks/useInterval/useInterval.mjs

@@ -1,5 +1,5 @@
 import { useState as i, useRef as s, useEffect as f } from "react";
-const y = (...e) => {
+const y = ((...e) => {
   const o = e[0], n = (typeof e[1] == "number" ? e[1] : e[1].interval) ?? 1e3, l = (typeof e[1] == "object" ? e[1] : e[2])?.immediately ?? !0, [t, r] = i(l ?? !0), c = s(void 0), u = s(o);
   return u.current = o, f(() => {
     if (t)
@@ -14,7 +14,7 @@ const y = (...e) => {
     },
     toggle: () => r(!t)
   };
-};
+});
 export {
   y as useInterval
 };

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

@@ -1 +1 @@
-{"version":3,"file":"useInterval.mjs","sources":["../../../../src/hooks/useInterval/useInterval.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\n/** The use interval options */\nexport interface UseIntervalOptions {\n  /** Start the interval immediately */\n  immediately?: boolean;\n}\n\n/** The use interval return type */\nexport interface UseIntervalReturn {\n  /** Is the interval active */\n  active: boolean;\n  /** Pause the interval */\n  pause: () => void;\n  /** Resume the interval */\n  resume: () => void;\n  /** Toggle the interval */\n  toggle: () => void;\n}\n\ninterface UseInterval {\n  (callback: () => void, interval?: number, options?: UseIntervalOptions): UseIntervalReturn;\n\n  (callback: () => void, options?: UseIntervalOptions & { interval?: number }): UseIntervalReturn;\n}\n\n/**\n * @name useInterval\n * @description - Hook that makes and interval and returns controlling functions\n * @category Time\n * @usage high\n *\n * @overload\n * @param {() => void} callback Any callback function\n * @param {number} [interval=1000] Time in milliseconds\n * @param {boolean} [options.immediately=true] Start the interval immediately\n * @returns {UseIntervalReturn}\n *\n * @example\n * const { active, pause, resume, toggle } = useInterval(() => console.log('inside interval'), 2500);\n *\n * @overload\n * @param {() => void} callback Any callback function\n * @param {number} [options.interval=1000] Time in milliseconds\n * @param {boolean} [options.immediately=true] Start the interval immediately\n *\n * @example\n * const { active, pause, resume, toggle } = useInterval(() => console.log('inside interval'), { interval: 2500 });\n */\nexport const useInterval = ((...params: any[]): UseIntervalReturn => {\n  const callback = params[0] as () => void;\n  const interval =\n    ((typeof params[1] === 'number'\n      ? params[1]\n      : (params[1] as UseIntervalOptions & { interval?: number }).interval) as number) ?? 1000;\n  const options =\n    typeof params[1] === 'object'\n      ? (params[1] as (UseIntervalOptions & { interval?: number }) | undefined)\n      : (params[2] as UseIntervalOptions | undefined);\n  const immediately = options?.immediately ?? true;\n\n  const [active, setActive] = useState<boolean>(immediately ?? true);\n\n  const intervalIdRef = useRef<ReturnType<typeof setInterval>>(undefined);\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n\n  useEffect(() => {\n    if (!active) return;\n\n    intervalIdRef.current = setInterval(() => internalCallbackRef.current(), interval);\n    return () => {\n      clearInterval(intervalIdRef.current);\n    };\n  }, [active, interval]);\n\n  const pause = () => setActive(false);\n\n  const resume = () => {\n    if (interval <= 0) return;\n    setActive(true);\n  };\n\n  const toggle = () => setActive(!active);\n\n  return {\n    active,\n    pause,\n    resume,\n    toggle\n  };\n}) as UseInterval;\n"],"names":["useInterval","params","callback","interval","immediately","active","setActive","useState","intervalIdRef","useRef","internalCallbackRef","useEffect"],"mappings":";AAiDO,MAAMA,IAAe,IAAIC,MAAqC;AACnE,QAAMC,IAAWD,EAAO,CAAC,GACnBE,KACF,OAAOF,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACPA,EAAO,CAAC,EAAiD,aAAwB,KAKlFG,KAHJ,OAAOH,EAAO,CAAC,KAAM,WAChBA,EAAO,CAAC,IACRA,EAAO,CAAC,IACc,eAAe,IAEtC,CAACI,GAAQC,CAAS,IAAIC,EAAkBH,KAAe,EAAI,GAE3DI,IAAgBC,EAAuC,MAAS,GAChEC,IAAsBD,EAAOP,CAAQ;AAC3C,SAAAQ,EAAoB,UAAUR,GAE9BS,EAAU,MAAM;AACd,QAAKN;AAEL,aAAAG,EAAc,UAAU,YAAY,MAAME,EAAoB,QAAA,GAAWP,CAAQ,GAC1E,MAAM;AACX,sBAAcK,EAAc,OAAO;AAAA,MAAA;AAAA,EACrC,GACC,CAACH,GAAQF,CAAQ,CAAC,GAWd;AAAA,IACL,QAAAE;AAAA,IACA,OAXY,MAAMC,EAAU,EAAK;AAAA,IAYjC,QAVa,MAAM;AACnB,MAAIH,KAAY,KAChBG,EAAU,EAAI;AAAA,IAAA;AAAA,IASd,QANa,MAAMA,EAAU,CAACD,CAAM;AAAA,EAMpC;AAEJ;"}
+{"version":3,"file":"useInterval.mjs","sources":["../../../../src/hooks/useInterval/useInterval.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\n/** The use interval options */\nexport interface UseIntervalOptions {\n  /** Start the interval immediately */\n  immediately?: boolean;\n}\n\n/** The use interval return type */\nexport interface UseIntervalReturn {\n  /** Is the interval active */\n  active: boolean;\n  /** Pause the interval */\n  pause: () => void;\n  /** Resume the interval */\n  resume: () => void;\n  /** Toggle the interval */\n  toggle: () => void;\n}\n\ninterface UseInterval {\n  (callback: () => void, interval?: number, options?: UseIntervalOptions): UseIntervalReturn;\n\n  (callback: () => void, options?: UseIntervalOptions & { interval?: number }): UseIntervalReturn;\n}\n\n/**\n * @name useInterval\n * @description - Hook that makes and interval and returns controlling functions\n * @category Time\n * @usage high\n *\n * @overload\n * @param {() => void} callback Any callback function\n * @param {number} [interval=1000] Time in milliseconds\n * @param {boolean} [options.immediately=true] Start the interval immediately\n * @returns {UseIntervalReturn}\n *\n * @example\n * const { active, pause, resume, toggle } = useInterval(() => console.log('inside interval'), 2500);\n *\n * @overload\n * @param {() => void} callback Any callback function\n * @param {number} [options.interval=1000] Time in milliseconds\n * @param {boolean} [options.immediately=true] Start the interval immediately\n *\n * @example\n * const { active, pause, resume, toggle } = useInterval(() => console.log('inside interval'), { interval: 2500 });\n */\nexport const useInterval = ((...params: any[]): UseIntervalReturn => {\n  const callback = params[0] as () => void;\n  const interval =\n    ((typeof params[1] === 'number'\n      ? params[1]\n      : (params[1] as UseIntervalOptions & { interval?: number }).interval) as number) ?? 1000;\n  const options =\n    typeof params[1] === 'object'\n      ? (params[1] as (UseIntervalOptions & { interval?: number }) | undefined)\n      : (params[2] as UseIntervalOptions | undefined);\n  const immediately = options?.immediately ?? true;\n\n  const [active, setActive] = useState<boolean>(immediately ?? true);\n\n  const intervalIdRef = useRef<ReturnType<typeof setInterval>>(undefined);\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n\n  useEffect(() => {\n    if (!active) return;\n\n    intervalIdRef.current = setInterval(() => internalCallbackRef.current(), interval);\n    return () => {\n      clearInterval(intervalIdRef.current);\n    };\n  }, [active, interval]);\n\n  const pause = () => setActive(false);\n\n  const resume = () => {\n    if (interval <= 0) return;\n    setActive(true);\n  };\n\n  const toggle = () => setActive(!active);\n\n  return {\n    active,\n    pause,\n    resume,\n    toggle\n  };\n}) as UseInterval;\n"],"names":["useInterval","params","callback","interval","immediately","active","setActive","useState","intervalIdRef","useRef","internalCallbackRef","useEffect"],"mappings":";AAiDO,MAAMA,KAAe,IAAIC,MAAqC;AACnE,QAAMC,IAAWD,EAAO,CAAC,GACnBE,KACF,OAAOF,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACPA,EAAO,CAAC,EAAiD,aAAwB,KAKlFG,KAHJ,OAAOH,EAAO,CAAC,KAAM,WAChBA,EAAO,CAAC,IACRA,EAAO,CAAC,IACc,eAAe,IAEtC,CAACI,GAAQC,CAAS,IAAIC,EAAkBH,KAAe,EAAI,GAE3DI,IAAgBC,EAAuC,MAAS,GAChEC,IAAsBD,EAAOP,CAAQ;AAC3C,SAAAQ,EAAoB,UAAUR,GAE9BS,EAAU,MAAM;AACd,QAAKN;AAEL,aAAAG,EAAc,UAAU,YAAY,MAAME,EAAoB,QAAA,GAAWP,CAAQ,GAC1E,MAAM;AACX,sBAAcK,EAAc,OAAO;AAAA,MAAA;AAAA,EACrC,GACC,CAACH,GAAQF,CAAQ,CAAC,GAWd;AAAA,IACL,QAAAE;AAAA,IACA,OAXY,MAAMC,EAAU,EAAK;AAAA,IAYjC,QAVa,MAAM;AACnB,MAAIH,KAAY,KAChBG,EAAU,EAAI;AAAA,IAAA;AAAA,IASd,QANa,MAAMA,EAAU,CAACD,CAAM;AAAA,EAMpC;AAEJ;"}

package/dist/esm/hooks/useKeyPress/useKeyPress.mjs

@@ -1,27 +1,27 @@
-import { useState as E, useRef as l, useEffect as m } from "react";
-import { useRefState as w } from "../useRefState/useRefState.mjs";
-import { isTarget as v } from "../../utils/helpers/isTarget.mjs";
-const L = (...n) => {
-  const e = v(n[0]) ? n[0] : void 0, i = e ? n[1] : n[0], f = e ? n[2] : n[1], [y, d] = E(!1), o = w(window), t = l(i);
-  t.current = i;
-  const c = l(f);
-  return c.current = f, m(() => {
+import { useState as E, useRef as v, useEffect as R } from "react";
+import { useRefState as m } from "../useRefState/useRefState.mjs";
+import { isTarget as i } from "../../utils/helpers/isTarget.mjs";
+const A = ((...n) => {
+  const e = i(n[0]) ? n[0] : void 0, f = e ? n[1] : n[0], y = e ? n[2] : n[1], [a, d] = E(!1), o = m(window), t = v(f);
+  t.current = f;
+  const c = v(y);
+  return c.current = y, R(() => {
     if (!e && !o.state) return;
-    const s = e ? v.getElement(e) : o.current;
+    const s = e ? i.getElement(e) : o.current;
     if (!s) return;
     const k = (u) => {
       const r = u;
       (Array.isArray(t.current) ? t.current.includes(r.key) : r.key === t.current) && (d(!0), c.current?.(!0, r));
-    }, a = (u) => {
+    }, l = (u) => {
       const r = u;
       (Array.isArray(t.current) ? t.current.includes(r.key) : r.key === t.current) && (d(!1), c.current?.(!1, r));
     };
-    return s.addEventListener("keydown", k), s.addEventListener("keyup", a), () => {
-      s.removeEventListener("keydown", k), s.removeEventListener("keyup", a);
+    return s.addEventListener("keydown", k), s.addEventListener("keyup", l), () => {
+      s.removeEventListener("keydown", k), s.removeEventListener("keyup", l);
     };
-  }, [e, o.state]), e ? y : { pressed: y, ref: o };
-};
+  }, [e, o.state, i.getRefState(e)]), e ? a : { pressed: a, ref: o };
+});
 export {
-  L as useKeyPress
+  A as useKeyPress
 };
 //# sourceMappingURL=useKeyPress.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"useKeyPress.mjs","sources":["../../../../src/hooks/useKeyPress/useKeyPress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The key or keys to listen for */\nexport type UseKeyPressKey = string | string[];\n\n/** The callback function to be invoked when key is pressed */\nexport type UseKeyPressCallback = (pressed: boolean, event: KeyboardEvent) => void;\n\nexport interface UseKeyPress {\n  (target: HookTarget | Window, key: UseKeyPressKey, callback?: UseKeyPressCallback): boolean;\n\n  <Target extends Element>(\n    key: UseKeyPressKey,\n    callback?: UseKeyPressCallback,\n    target?: never\n  ): { pressed: boolean; ref: StateRef<Target> };\n}\n\n/**\n * @name useKeyPress\n * @description - Hook that listens for key press events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} [target=window] The target to attach the event listeners to\n * @param {UseKeyPressKey} key The key or keys to listen for\n * @param {(pressed: boolean, event: KeyboardEvent) => void} [callback] Callback function invoked when key is pressed\n * @returns {boolean} The pressed state of the key\n *\n * @example\n * const isKeyPressed = useKeyPress(ref, 'a');\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyPressKey} key The key or keys to listen for\n * @param {(pressed: boolean, event: KeyboardEvent) => void} [callback] Callback function invoked when key is pressed\n * @returns {{ pressed: boolean; ref: StateRef<Target> }} An object containing the pressed state and ref\n *\n * @example\n * const { pressed, ref } = useKeyPress('a');\n */\nexport const useKeyPress = ((...params: any[]) => {\n  const target = isTarget(params[0]) ? params[0] : undefined;\n  const key = (target ? params[1] : params[0]) as UseKeyPressKey;\n  const callback = (target ? params[2] : params[1]) as UseKeyPressCallback | undefined;\n\n  const [pressed, setPressed] = useState(false);\n  const internalRef = useRefState(window);\n\n  const keyRef = useRef(key);\n  keyRef.current = key;\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n\n  useEffect(() => {\n    if (!target && !internalRef.state) return;\n\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    const onKeyDown = (event: Event) => {\n      const keyboardEvent = event as KeyboardEvent;\n      if (\n        Array.isArray(keyRef.current)\n          ? keyRef.current.includes(keyboardEvent.key)\n          : keyboardEvent.key === keyRef.current\n      ) {\n        setPressed(true);\n        internalCallbackRef.current?.(true, keyboardEvent);\n      }\n    };\n\n    const onKeyUp = (event: Event) => {\n      const keyboardEvent = event as KeyboardEvent;\n      if (\n        Array.isArray(keyRef.current)\n          ? keyRef.current.includes(keyboardEvent.key)\n          : keyboardEvent.key === keyRef.current\n      ) {\n        setPressed(false);\n        internalCallbackRef.current?.(false, keyboardEvent);\n      }\n    };\n\n    element.addEventListener('keydown', onKeyDown);\n    element.addEventListener('keyup', onKeyUp);\n\n    return () => {\n      element.removeEventListener('keydown', onKeyDown);\n      element.removeEventListener('keyup', onKeyUp);\n    };\n  }, [target, internalRef.state]);\n\n  if (target) return pressed;\n  return { pressed, ref: internalRef };\n}) as UseKeyPress;\n"],"names":["useKeyPress","params","target","isTarget","key","callback","pressed","setPressed","useState","internalRef","useRefState","keyRef","useRef","internalCallbackRef","useEffect","element","onKeyDown","event","keyboardEvent","onKeyUp"],"mappings":";;;AAkDO,MAAMA,IAAe,IAAIC,MAAkB;AAChD,QAAMC,IAASC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC3CG,IAAOF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACpCI,IAAYH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAEzC,CAACK,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAAcC,EAAY,MAAM,GAEhCC,IAASC,EAAOR,CAAG;AACzB,EAAAO,EAAO,UAAUP;AACjB,QAAMS,IAAsBD,EAAOP,CAAQ;AA0C3C,SAzCAQ,EAAoB,UAAUR,GAE9BS,EAAU,MAAM;AACd,QAAI,CAACZ,KAAU,CAACO,EAAY,MAAO;AAEnC,UAAMM,IAAWb,IAASC,EAAS,WAAWD,CAAM,IAAIO,EAAY;AACpE,QAAI,CAACM,EAAS;AAEd,UAAMC,IAAY,CAACC,MAAiB;AAClC,YAAMC,IAAgBD;AACtB,OACE,MAAM,QAAQN,EAAO,OAAO,IACxBA,EAAO,QAAQ,SAASO,EAAc,GAAG,IACzCA,EAAc,QAAQP,EAAO,aAEjCJ,EAAW,EAAI,GACfM,EAAoB,UAAU,IAAMK,CAAa;AAAA,IACnD,GAGIC,IAAU,CAACF,MAAiB;AAChC,YAAMC,IAAgBD;AACtB,OACE,MAAM,QAAQN,EAAO,OAAO,IACxBA,EAAO,QAAQ,SAASO,EAAc,GAAG,IACzCA,EAAc,QAAQP,EAAO,aAEjCJ,EAAW,EAAK,GAChBM,EAAoB,UAAU,IAAOK,CAAa;AAAA,IACpD;AAGF,WAAAH,EAAQ,iBAAiB,WAAWC,CAAS,GAC7CD,EAAQ,iBAAiB,SAASI,CAAO,GAElC,MAAM;AACX,MAAAJ,EAAQ,oBAAoB,WAAWC,CAAS,GAChDD,EAAQ,oBAAoB,SAASI,CAAO;AAAA,IAAA;AAAA,EAC9C,GACC,CAACjB,GAAQO,EAAY,KAAK,CAAC,GAE1BP,IAAeI,IACZ,EAAE,SAAAA,GAAS,KAAKG,EAAA;AACzB;"}
+{"version":3,"file":"useKeyPress.mjs","sources":["../../../../src/hooks/useKeyPress/useKeyPress.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useRefState } from '../useRefState/useRefState';\n\n/** The key or keys to listen for */\nexport type UseKeyPressKey = string | string[];\n\n/** The callback function to be invoked when key is pressed */\nexport type UseKeyPressCallback = (pressed: boolean, event: KeyboardEvent) => void;\n\nexport interface UseKeyPress {\n  (target: HookTarget | Window, key: UseKeyPressKey, callback?: UseKeyPressCallback): boolean;\n\n  <Target extends Element>(\n    key: UseKeyPressKey,\n    callback?: UseKeyPressCallback,\n    target?: never\n  ): { pressed: boolean; ref: StateRef<Target> };\n}\n\n/**\n * @name useKeyPress\n * @description - Hook that listens for key press events\n * @category Sensors\n * @usage medium\n *\n * @overload\n * @param {HookTarget} [target=window] The target to attach the event listeners to\n * @param {UseKeyPressKey} key The key or keys to listen for\n * @param {(pressed: boolean, event: KeyboardEvent) => void} [callback] Callback function invoked when key is pressed\n * @returns {boolean} The pressed state of the key\n *\n * @example\n * const isKeyPressed = useKeyPress(ref, 'a');\n *\n * @overload\n * @template Target The target element type\n * @param {UseKeyPressKey} key The key or keys to listen for\n * @param {(pressed: boolean, event: KeyboardEvent) => void} [callback] Callback function invoked when key is pressed\n * @returns {{ pressed: boolean; ref: StateRef<Target> }} An object containing the pressed state and ref\n *\n * @example\n * const { pressed, ref } = useKeyPress('a');\n */\nexport const useKeyPress = ((...params: any[]) => {\n  const target = isTarget(params[0]) ? params[0] : undefined;\n  const key = (target ? params[1] : params[0]) as UseKeyPressKey;\n  const callback = (target ? params[2] : params[1]) as UseKeyPressCallback | undefined;\n\n  const [pressed, setPressed] = useState(false);\n  const internalRef = useRefState(window);\n\n  const keyRef = useRef(key);\n  keyRef.current = key;\n  const internalCallbackRef = useRef(callback);\n  internalCallbackRef.current = callback;\n\n  useEffect(() => {\n    if (!target && !internalRef.state) return;\n\n    const element = (target ? isTarget.getElement(target) : internalRef.current) as Element;\n    if (!element) return;\n\n    const onKeyDown = (event: Event) => {\n      const keyboardEvent = event as KeyboardEvent;\n      if (\n        Array.isArray(keyRef.current)\n          ? keyRef.current.includes(keyboardEvent.key)\n          : keyboardEvent.key === keyRef.current\n      ) {\n        setPressed(true);\n        internalCallbackRef.current?.(true, keyboardEvent);\n      }\n    };\n\n    const onKeyUp = (event: Event) => {\n      const keyboardEvent = event as KeyboardEvent;\n      if (\n        Array.isArray(keyRef.current)\n          ? keyRef.current.includes(keyboardEvent.key)\n          : keyboardEvent.key === keyRef.current\n      ) {\n        setPressed(false);\n        internalCallbackRef.current?.(false, keyboardEvent);\n      }\n    };\n\n    element.addEventListener('keydown', onKeyDown);\n    element.addEventListener('keyup', onKeyUp);\n\n    return () => {\n      element.removeEventListener('keydown', onKeyDown);\n      element.removeEventListener('keyup', onKeyUp);\n    };\n  }, [target, internalRef.state, isTarget.getRefState(target)]);\n\n  if (target) return pressed;\n  return { pressed, ref: internalRef };\n}) as UseKeyPress;\n"],"names":["useKeyPress","params","target","isTarget","key","callback","pressed","setPressed","useState","internalRef","useRefState","keyRef","useRef","internalCallbackRef","useEffect","element","onKeyDown","event","keyboardEvent","onKeyUp"],"mappings":";;;AAkDO,MAAMA,KAAe,IAAIC,MAAkB;AAChD,QAAMC,IAASC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC3CG,IAAOF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GACpCI,IAAYH,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAEzC,CAACK,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAAcC,EAAY,MAAM,GAEhCC,IAASC,EAAOR,CAAG;AACzB,EAAAO,EAAO,UAAUP;AACjB,QAAMS,IAAsBD,EAAOP,CAAQ;AA0C3C,SAzCAQ,EAAoB,UAAUR,GAE9BS,EAAU,MAAM;AACd,QAAI,CAACZ,KAAU,CAACO,EAAY,MAAO;AAEnC,UAAMM,IAAWb,IAASC,EAAS,WAAWD,CAAM,IAAIO,EAAY;AACpE,QAAI,CAACM,EAAS;AAEd,UAAMC,IAAY,CAACC,MAAiB;AAClC,YAAMC,IAAgBD;AACtB,OACE,MAAM,QAAQN,EAAO,OAAO,IACxBA,EAAO,QAAQ,SAASO,EAAc,GAAG,IACzCA,EAAc,QAAQP,EAAO,aAEjCJ,EAAW,EAAI,GACfM,EAAoB,UAAU,IAAMK,CAAa;AAAA,IACnD,GAGIC,IAAU,CAACF,MAAiB;AAChC,YAAMC,IAAgBD;AACtB,OACE,MAAM,QAAQN,EAAO,OAAO,IACxBA,EAAO,QAAQ,SAASO,EAAc,GAAG,IACzCA,EAAc,QAAQP,EAAO,aAEjCJ,EAAW,EAAK,GAChBM,EAAoB,UAAU,IAAOK,CAAa;AAAA,IACpD;AAGF,WAAAH,EAAQ,iBAAiB,WAAWC,CAAS,GAC7CD,EAAQ,iBAAiB,SAASI,CAAO,GAElC,MAAM;AACX,MAAAJ,EAAQ,oBAAoB,WAAWC,CAAS,GAChDD,EAAQ,oBAAoB,SAASI,CAAO;AAAA,IAAA;AAAA,EAC9C,GACC,CAACjB,GAAQO,EAAY,OAAON,EAAS,YAAYD,CAAM,CAAC,CAAC,GAExDA,IAAeI,IACZ,EAAE,SAAAA,GAAS,KAAKG,EAAA;AACzB;"}

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

@@ -1,29 +1,36 @@
-import { useRef as v, useEffect as l } from "react";
+import { useRef as d, useEffect as l } from "react";
 import { useRefState as p } from "../useRefState/useRefState.mjs";
-import { isTarget as d } from "../../utils/helpers/isTarget.mjs";
-const g = (...e) => {
-  const t = d(e[0]) ? e[0] : void 0, s = t ? e[1] : e[0], u = t ? e[2] : e[1], n = t ? e[3] : e[2], o = p(window), r = v(s);
-  r.current = s;
-  const i = v(u);
-  if (i.current = u, l(() => {
-    const c = t ? d.getElement(t) : o.current;
+import { isTarget as s } from "../../utils/helpers/isTarget.mjs";
+const g = ((...e) => {
+  const t = s(e[0]) ? e[0] : void 0, u = t ? e[1] : e[0], i = t ? e[2] : e[1], n = t ? e[3] : e[2], o = p(window), r = d(u);
+  r.current = u;
+  const f = d(i);
+  if (f.current = i, l(() => {
+    const c = t ? s.getElement(t) : o.current;
     if (!c) return;
-    const f = (k) => {
-      const y = k;
-      (Array.isArray(r.current) ? r.current : [r.current]).includes(y.key) && i.current(y);
+    const y = (k) => {
+      const v = k;
+      (Array.isArray(r.current) ? r.current : [r.current]).includes(v.key) && f.current(v);
     };
-    return c.addEventListener("keydown", f, {
+    return c.addEventListener("keydown", y, {
       capture: n?.capture,
       passive: n?.passive,
       once: n?.once
     }), () => {
-      c.removeEventListener("keydown", f, {
+      c.removeEventListener("keydown", y, {
         capture: n?.capture
       });
     };
-  }, [t, o.state, n?.capture, n?.passive, n?.once]), !t)
+  }, [
+    t,
+    o.state,
+    s.getRefState(t),
+    n?.capture,
+    n?.passive,
+    n?.once
+  ]), !t)
     return o;
-};
+});
 export {
   g as useKeyPressEvent
 };