@mantine/hooks/esm/use-in-viewport/use-in-viewport.mjs.map

A collection of 50+ hooks for state and UI management

{"version":3,"file":"use-in-viewport.mjs","names":[],"sources":["../../src/use-in-viewport/use-in-viewport.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\n\nexport interface UseInViewportReturnValue<T extends HTMLElement = any> {\n  inViewport: boolean;\n  ref: React.RefCallback<T | null>;\n}\n\nexport function useInViewport<T extends HTMLElement = any>(): UseInViewportReturnValue<T> {\n  const observer = useRef<IntersectionObserver | null>(null);\n  const [inViewport, setInViewport] = useState(false);\n\n  const ref: React.RefCallback<T | null> = useCallback((node) => {\n    if (typeof IntersectionObserver !== 'undefined') {\n      observer.current?.disconnect();\n\n      if (node) {\n        observer.current = new IntersectionObserver((entries) => {\n          const lastEntry = entries[entries.length - 1];\n          setInViewport(lastEntry.isIntersecting);\n        });\n        observer.current.observe(node);\n      } else {\n        observer.current = null;\n        setInViewport(false);\n      }\n    }\n  }, []);\n\n  return { ref, inViewport };\n}\n\nexport namespace useInViewport {\n  export type ReturnValue<T extends HTMLElement> = UseInViewportReturnValue<T>;\n}\n"],"mappings":";;;AAOA,SAAgB,gBAA0E;CACxF,MAAM,WAAW,OAAoC,IAAI;CACzD,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAmBlD,OAAO;EAAE,KAjBgC,aAAa,SAAS;GAC7D,IAAI,OAAO,yBAAyB,aAAa;IAC/C,SAAS,SAAS,WAAW;IAE7B,IAAI,MAAM;KACR,SAAS,UAAU,IAAI,sBAAsB,YAAY;MACvD,MAAM,YAAY,QAAQ,QAAQ,SAAS;MAC3C,cAAc,UAAU,cAAc;KACxC,CAAC;KACD,SAAS,QAAQ,QAAQ,IAAI;IAC/B,OAAO;KACL,SAAS,UAAU;KACnB,cAAc,KAAK;IACrB;GACF;EACF,GAAG,CAAC,CAEO;EAAG;CAAW;AAC3B"}