@siberiacancode/reactuse 0.2.32 → 0.2.34

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

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusTrap.mjs","sources":["../../../../src/hooks/useFocusTrap/useFocusTrap.ts"],"sourcesContent":["import { useState } from \"react\";\n\nimport type { HookTarget } from \"@/utils/helpers\";\n\nimport { getElement, isTarget } from \"@/utils/helpers\";\n\nimport type { StateRef } from \"../useRefState/useRefState\";\n\nimport { useIsomorphicLayoutEffect } from \"../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect\";\nimport { useRefState } from \"../useRefState/useRefState\";\n\nconst FOCUSABLE_ELEMENTS_SELECTOR = [\n  \"input:not([disabled])\",\n  \"select:not([disabled])\",\n  \"textarea:not([disabled])\",\n  \"button:not([disabled])\",\n  \"a[href]\",\n  \"area[href]\",\n  \"summary\",\n  \"iframe\",\n  \"object\",\n  \"embed\",\n  \"audio[controls]\",\n  \"video[controls]\",\n  \"[contenteditable]\",\n  '[tabindex]:not([tabindex^=\"-\"])',\n].join(\",\");\n\nconst getFocusableElements = (element: HTMLElement): HTMLElement[] => {\n  const elements = Array.from(\n    element.querySelectorAll(FOCUSABLE_ELEMENTS_SELECTOR)\n  );\n  return elements.filter((el) => {\n    const htmlEl = el as HTMLElement;\n    return (\n      htmlEl.tabIndex !== -1 &&\n      !htmlEl.hidden &&\n      htmlEl.style.display !== \"none\"\n    );\n  }) as HTMLElement[];\n};\n\nconst focusElement = (element: HTMLElement) => {\n  const autofocusElement = element.querySelector(\n    \"[data-autofocus]\"\n  ) as HTMLElement;\n  if (autofocusElement) return autofocusElement.focus();\n\n  const focusableElements = getFocusableElements(element);\n  if (focusableElements.length > 0) {\n    focusableElements[0].focus();\n  }\n};\n\n/** The use focus trap return type */\nexport interface UseFocusTrapReturn {\n  /** Whether focus trap is active */\n  active: boolean;\n  /** Disable focus trap */\n  disable: () => void;\n  /** Enable focus trap */\n  enable: () => void;\n  /** Toggle focus trap */\n  toggle: () => void;\n}\n\nexport interface UseFocusTrap {\n  (target: HookTarget, active?: boolean): UseFocusTrapReturn;\n\n  <Target extends HTMLElement>(\n    active?: boolean,\n    target?: never\n  ): UseFocusTrapReturn & {\n    ref: StateRef<Target>;\n  };\n}\n\n/**\n * @name useFocusTrap\n * @description - Hook that traps focus within a given element\n * @category Elements\n * @usage medium\n *\n * @overload\n * @param {HookTarget} target The target element for focus trap\n * @param {boolean} [active=true] Whether focus trap is active\n * @returns {UseFocusTrapReturn} Object with control methods and state\n *\n * @example\n * const { active, disable, toggle, enable } = useFocusTrap(ref, true);\n *\n * @overload\n * @template Target The target element type\n * @param {boolean} [active=true] Whether focus trap is active\n * @returns {UseFocusTrapReturn & { ref: StateRef<Target> }} Object with ref and controls\n *\n * @example\n * const { ref, active, disable, toggle, enable } = useFocusTrap(true);\n */\nexport const useFocusTrap = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as\n    | HookTarget\n    | undefined;\n  const initialActive = target ? params[1] : params[0];\n\n  const [active, setActive] = useState(initialActive);\n  const internalRef = useRefState<HTMLElement>();\n\n  const enable = () => setActive(true);\n  const disable = () => setActive(false);\n  const toggle = () => setActive((prevActive: boolean) => !prevActive);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!active) return;\n\n    const element = target ? getElement(target) : internalRef.current;\n    if (!element) return;\n\n    const htmlElement = element as HTMLElement;\n    focusElement(htmlElement);\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key !== \"Tab\") return;\n\n      const [firstElement, ...restElements] = getFocusableElements(htmlElement);\n      if (!restElements.length) return;\n\n      const lastElement = restElements.at(-1)!;\n\n      if (event.shiftKey && document.activeElement === firstElement) {\n        event.preventDefault();\n        lastElement.focus();\n      }\n\n      if (document.activeElement === lastElement) {\n        event.preventDefault();\n        firstElement.focus();\n      }\n    };\n\n    document.addEventListener(\"keydown\", onKeyDown);\n\n    return () => {\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [active, target, internalRef.state]);\n\n  if (target) return { active, enable, disable, toggle };\n  return { active, enable, disable, toggle, ref: internalRef };\n}) as UseFocusTrap;\n"],"names":["FOCUSABLE_ELEMENTS_SELECTOR","getFocusableElements","element","el","htmlEl","focusElement","autofocusElement","focusableElements","useFocusTrap","params","target","isTarget","initialActive","active","setActive","useState","internalRef","useRefState","enable","disable","toggle","prevActive","useIsomorphicLayoutEffect","getElement","htmlElement","onKeyDown","event","firstElement","restElements","lastElement"],"mappings":";;;;;AAWA,MAAMA,IAA8B;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJC,IAAuB,CAACC,MACX,MAAM;AAAA,EACrBA,EAAQ,iBAAiBF,CAA2B;AAAA,EAEtC,OAAO,CAACG,MAAO;AAC7B,QAAMC,IAASD;AACf,SACEC,EAAO,aAAa,MACpB,CAACA,EAAO,UACRA,EAAO,MAAM,YAAY;AAAA,CAE5B,GAGGC,IAAe,CAACH,MAAyB;AAC7C,QAAMI,IAAmBJ,EAAQ;AAAA,IAC/B;AAAA,EAAA;AAEF,MAAII,EAAkB,QAAOA,EAAiB,MAAA;AAE9C,QAAMC,IAAoBN,EAAqBC,CAAO;AACtD,EAAIK,EAAkB,SAAS,KAC7BA,EAAkB,CAAC,EAAE,MAAA;AAEzB,GA+CaC,IAAgB,IAAIC,MAAkB;AACjD,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAG5CG,IAAgBF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,GAE7C,CAACI,GAAQC,CAAS,IAAIC,EAASH,CAAa,GAC5CI,IAAcC,EAAA,GAEdC,IAAS,MAAMJ,EAAU,EAAI,GAC7BK,IAAU,MAAML,EAAU,EAAK,GAC/BM,IAAS,MAAMN,EAAU,CAACO,MAAwB,CAACA,CAAU;AAqCnE,SAnCAC,EAA0B,MAAM;AAC9B,QAAI,CAACT,EAAQ;AAEb,UAAMX,IAAUQ,IAASa,EAAWb,CAAM,IAAIM,EAAY;AAC1D,QAAI,CAACd,EAAS;AAEd,UAAMsB,IAActB;AACpB,IAAAG,EAAamB,CAAW;AAExB,UAAMC,IAAY,CAACC,MAAyB;AAC1C,UAAIA,EAAM,QAAQ,MAAO;AAEzB,YAAM,CAACC,GAAc,GAAGC,CAAY,IAAI3B,EAAqBuB,CAAW;AACxE,UAAI,CAACI,EAAa,OAAQ;AAE1B,YAAMC,IAAcD,EAAa,GAAG,EAAE;AAEtC,MAAIF,EAAM,YAAY,SAAS,kBAAkBC,MAC/CD,EAAM,eAAA,GACNG,EAAY,MAAA,IAGV,SAAS,kBAAkBA,MAC7BH,EAAM,eAAA,GACNC,EAAa,MAAA;AAAA,IACf;AAGF,oBAAS,iBAAiB,WAAWF,CAAS,GAEvC,MAAM;AACX,eAAS,oBAAoB,WAAWA,CAAS;AAAA,IAAA;AAAA,EACnD,GACC,CAACZ,GAAQH,GAAQM,EAAY,KAAK,CAAC,GAElCN,IAAe,EAAE,QAAAG,GAAQ,QAAAK,GAAQ,SAAAC,GAAS,QAAAC,EAAA,IACvC,EAAE,QAAAP,GAAQ,QAAAK,GAAQ,SAAAC,GAAS,QAAAC,GAAQ,KAAKJ,EAAA;AACjD;"}

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

@@ -1,17 +1,24 @@
-import { useState as r, useEffect as c } from "react";
-const s = () => decodeURIComponent(window.location.hash.replace("#", "")), i = (n = "", h = "replace") => {
-  const [o, t] = r(() => typeof window > "u" ? n : s() || n), a = (e) => {
-    window.location.hash = e, t(e);
+import { useState as f, useRef as p, useEffect as l } from "react";
+const d = () => decodeURIComponent(window.location.hash.replace("#", "")), m = (...u) => {
+  const [s = "", o] = u, n = typeof o == "function" ? { onChange: o } : o, a = n?.enabled ?? !0, r = n?.mode ?? "replace", [c, h] = f(() => typeof window > "u" ? s : d() || s), t = p(n);
+  t.current = n;
+  const w = (e) => {
+    window.location.hash = e, h(e), t.current?.onChange?.(e);
   };
-  return c(() => {
-    h === "replace" && (window.location.hash = o);
-    const e = () => t(s());
+  return l(() => {
+    if (!a) return;
+    r === "replace" && (window.location.hash = c);
+    const e = () => {
+      const i = d();
+      h(i), t.current?.onChange?.(i);
+    };
     return window.addEventListener("hashchange", e), () => {
       window.removeEventListener("hashchange", e);
     };
-  }, []), [o, a];
+  }, [a, r]), [c, w];
 };
 export {
-  i as useHash
+  d as getHash,
+  m as useHash
 };
 //# sourceMappingURL=useHash.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"useHash.mjs","sources":["../../../../src/hooks/useHash/useHash.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nconst getHash = () => decodeURIComponent(window.location.hash.replace('#', ''));\n\n/** The use hash return type */\ntype UseHashReturn = [string, (value: string) => void];\n\n/**\n * @name useHash\n * @description - Hook that manages the hash value\n * @category State\n * @usage low\n *\n * @param {string} [initialValue] The initial hash value if no hash exists\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 */\nexport const useHash = (\n  initialValue = '',\n  mode: 'initial' | 'replace' = 'replace'\n): UseHashReturn => {\n  const [hash, setHash] = useState(() => {\n    if (typeof window === 'undefined') return initialValue;\n    return getHash() || initialValue;\n  });\n\n  const set = (value: string) => {\n    window.location.hash = value;\n    setHash(value);\n  };\n\n  useEffect(() => {\n    if (mode === 'replace') window.location.hash = hash;\n\n    const onHashChange = () => setHash(getHash());\n    window.addEventListener('hashchange', onHashChange);\n    return () => {\n      window.removeEventListener('hashchange', onHashChange);\n    };\n  }, []);\n\n  return [hash, set] as const;\n};\n"],"names":["getHash","useHash","initialValue","mode","hash","setHash","useState","set","value","useEffect","onHashChange"],"mappings":";AAEA,MAAMA,IAAU,MAAM,mBAAmB,OAAO,SAAS,KAAK,QAAQ,KAAK,EAAE,CAAC,GAiBjEC,IAAU,CACrBC,IAAe,IACfC,IAA8B,cACZ;AAClB,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAS,MAC3B,OAAO,SAAW,MAAoBJ,IACnCF,OAAaE,CACrB,GAEKK,IAAM,CAACC,MAAkB;AAC7B,WAAO,SAAS,OAAOA,GACvBH,EAAQG,CAAK;AAAA,EAAA;AAGf,SAAAC,EAAU,MAAM;AACd,IAAIN,MAAS,cAAW,OAAO,SAAS,OAAOC;AAE/C,UAAMM,IAAe,MAAML,EAAQL,GAAS;AAC5C,kBAAO,iBAAiB,cAAcU,CAAY,GAC3C,MAAM;AACX,aAAO,oBAAoB,cAAcA,CAAY;AAAA,IAAA;AAAA,EACvD,GACC,EAAE,GAEE,CAACN,GAAMG,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  (initialValue?: string, 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 *   enabled: true,\n *   mode: \"replace\",\n *   onChange: (newHash) => console.log('Hash changed:', newHash)\n * });\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('Hash changed:', newHash));\n */\nexport const useHash = ((...params: any[]) => {\n  const [initialValue = '', param] = params;\n\n  const options = (typeof param === 'function' ? { onChange: param } : param) as\n    | UseHashOptions\n    | undefined;\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","param","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,GAkDxEC,IAAW,IAAIC,MAAkB;AAC5C,QAAM,CAACC,IAAe,IAAIC,CAAK,IAAIF,GAE7BG,IAAW,OAAOD,KAAU,aAAa,EAAE,UAAUA,MAAUA,GAI/DE,IAAUD,GAAS,WAAW,IAC9BE,IAAOF,GAAS,QAAQ,WAExB,CAACG,GAAMC,CAAO,IAAIC,EAAS,MAC3B,OAAO,SAAW,MAAoBP,IACnCH,OAAaG,CACrB,GAEKQ,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,IAAUjB,EAAA;AAChB,MAAAS,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/useIntersectionObserver/useIntersectionObserver.mjs

@@ -20,7 +20,14 @@ const j = (...e) => {
     return d(s), s.observe(b), () => {
       s.disconnect();
     };
-  }, [n, r.state, t?.rootMargin, t?.threshold, t?.root, i]), n ? { observer: f, entry: o, inView: !!o?.isIntersecting } : {
+  }, [
+    n,
+    r.state,
+    t?.rootMargin,
+    t?.threshold,
+    t?.root,
+    i
+  ]), n ? { observer: f, entry: o, inView: !!o?.isIntersecting } : {
     observer: f,
     ref: r,
     entry: o,

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 { getElement, 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  entry: 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  entry?: IntersectionObserverEntry;\n  /** The in view state of the intersection observer */\n  inView: boolean;\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, entry, inView, 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 { entry, inView, 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, entry, inView, 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 { entry, inView, observer } = useIntersectionObserver(() => console.log('callback'), ref);\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 [entry, setEntry] = 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 ? getElement(target) : internalRef.current;\n    if (!element) return;\n\n    const observer = new IntersectionObserver(\n      ([entry], observer) => {\n        setEntry(entry);\n        internalCallbackRef.current?.(entry, observer);\n      },\n      {\n        ...options,\n        root: options?.root ? (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, entry, inView: !!entry?.isIntersecting };\n  return {\n    observer,\n    ref: internalRef,\n    entry,\n    inView: !!entry?.isIntersecting\n  };\n}) as UseIntersectionObserver;\n"],"names":["useIntersectionObserver","params","target","isTarget","options","callback","enabled","observer","setObserver","useState","entry","setEntry","internalRef","useRefState","internalCallbackRef","useRef","useEffect","element","getElement"],"mappings":";;;;AAgGO,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,GAAOC,CAAQ,IAAIF,EAAA,GAEpBG,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,IAASgB,EAAWhB,CAAM,IAAIU,EAAY;AAC1D,QAAI,CAACK,EAAS;AAEd,UAAMV,IAAW,IAAI;AAAA,MACnB,CAAC,CAACG,CAAK,GAAGH,MAAa;AACrB,QAAAI,EAASD,CAAK,GACdI,EAAoB,UAAUJ,GAAOH,CAAQ;AAAA,MAAA;AAAA,MAE/C;AAAA,QACE,GAAGH;AAAA,QACH,MAAMA,GAAS,OAAQc,EAAWd,EAAQ,IAAI,IAA2B;AAAA,MAAA;AAAA,IAC3E;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,OAAAG,GAAO,QAAQ,CAAC,CAACA,GAAO,eAAA,IAChD;AAAA,IACL,UAAAH;AAAA,IACA,KAAKK;AAAA,IACL,OAAAF;AAAA,IACA,QAAQ,CAAC,CAACA,GAAO;AAAA,EAAA;AAErB;"}
+{"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 { getElement, 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  entry: IntersectionObserverEntry,\n  observer: IntersectionObserver\n) => void;\n\n/** The intersection observer options type */\nexport interface UseIntersectionObserverOptions\n  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  entry?: IntersectionObserverEntry;\n  /** The in view state of the intersection observer */\n  inView: boolean;\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  (\n    target: HookTarget,\n    options?: UseIntersectionObserverOptions\n  ): UseIntersectionObserverReturn;\n\n  <Target extends Element>(\n    callback: UseIntersectionObserverCallback,\n    target?: never\n  ): UseIntersectionObserverReturn & { ref: StateRef<Target> };\n\n  (\n    target: HookTarget,\n    callback: UseIntersectionObserverCallback\n  ): 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, entry, inView, 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 { entry, inView, 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, entry, inView, 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 { entry, inView, observer } = useIntersectionObserver(() => console.log('callback'), ref);\n */\nexport const useIntersectionObserver = ((...params: any[]) => {\n  const target = (isTarget(params[0]) ? params[0] : undefined) as\n    | HookTarget\n    | 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 [entry, setEntry] = 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 ? getElement(target) : internalRef.current;\n    if (!element) return;\n\n    const observer = new IntersectionObserver(\n      ([entry], observer) => {\n        setEntry(entry);\n        internalCallbackRef.current?.(entry, observer);\n      },\n      {\n        ...options,\n        root: options?.root\n          ? (getElement(options.root) as Document | Element)\n          : 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    options?.rootMargin,\n    options?.threshold,\n    options?.root,\n    enabled,\n  ]);\n\n  if (target) return { observer, entry, inView: !!entry?.isIntersecting };\n  return {\n    observer,\n    ref: internalRef,\n    entry,\n    inView: !!entry?.isIntersecting,\n  };\n}) as UseIntersectionObserver;\n"],"names":["useIntersectionObserver","params","target","isTarget","options","callback","enabled","observer","setObserver","useState","entry","setEntry","internalRef","useRefState","internalCallbackRef","useRef","useEffect","element","getElement"],"mappings":";;;;AAuGO,MAAMA,IAA2B,IAAIC,MAAkB;AAC5D,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAI5CG,IACJF,IACI,OAAOD,EAAO,CAAC,KAAM,WACnBA,EAAO,CAAC,IACR,EAAE,UAAUA,EAAO,CAAC,EAAA,IACtB,OAAOA,EAAO,CAAC,KAAM,WACrBA,EAAO,CAAC,IACR,EAAE,UAAUA,EAAO,CAAC,EAAA,GAGpBI,IAAWD,GAAS,UACpBE,IAAUF,GAAS,WAAW,IAE9B,CAACG,GAAUC,CAAW,IAAIC,EAAA,GAC1B,CAACC,GAAOC,CAAQ,IAAIF,EAAA,GAEpBG,IAAcC,EAAA,GACdC,IAAsBC,EAAOV,CAAQ;AAqC3C,SApCAS,EAAoB,UAAUT,GAE9BW,EAAU,MAAM;AACd,QAAI,CAACV,KAAY,CAACJ,KAAU,CAACU,EAAY,MAAQ;AAEjD,UAAMK,IAAUf,IAASgB,EAAWhB,CAAM,IAAIU,EAAY;AAC1D,QAAI,CAACK,EAAS;AAEd,UAAMV,IAAW,IAAI;AAAA,MACnB,CAAC,CAACG,CAAK,GAAGH,MAAa;AACrB,QAAAI,EAASD,CAAK,GACdI,EAAoB,UAAUJ,GAAOH,CAAQ;AAAA,MAAA;AAAA,MAE/C;AAAA,QACE,GAAGH;AAAA,QACH,MAAMA,GAAS,OACVc,EAAWd,EAAQ,IAAI,IACxB;AAAA,MAAA;AAAA,IACN;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,IACZR,GAAS;AAAA,IACTA,GAAS;AAAA,IACTA,GAAS;AAAA,IACTE;AAAA,EAAA,CACD,GAEGJ,IAAe,EAAE,UAAAK,GAAU,OAAAG,GAAO,QAAQ,CAAC,CAACA,GAAO,eAAA,IAChD;AAAA,IACL,UAAAH;AAAA,IACA,KAAKK;AAAA,IACL,OAAAF;AAAA,IACA,QAAQ,CAAC,CAACA,GAAO;AAAA,EAAA;AAErB;"}