@liveblocks/react-ui/dist/utils/use-visible.cjs.map

A set of React pre-built components for the Liveblocks products. Liveblocks is the all-in-one toolkit to build collaborative products like Figma, Notion, and more.

{"version":3,"file":"use-visible.cjs","sources":["../../src/utils/use-visible.ts"],"sourcesContent":["import { type RefObject, useEffect, useState } from \"react\";\n\nimport { useLatest } from \"./use-latest\";\n\ntype Options = { enabled?: boolean };\n\ntype IntersectionObserverSingleCallback = (\n  entry: IntersectionObserverEntry\n) => void;\n\nlet intersectionObserver: IntersectionObserver | undefined;\nconst intersectionCallbacks = new WeakMap<\n  Element,\n  IntersectionObserverSingleCallback\n>();\n\nfunction observe(\n  element: Element,\n  callback: IntersectionObserverSingleCallback\n) {\n  if (!intersectionObserver) {\n    intersectionObserver = new IntersectionObserver((entries) => {\n      for (const entry of entries) {\n        const callback = intersectionCallbacks.get(entry.target);\n\n        callback?.(entry);\n      }\n    });\n  }\n\n  intersectionCallbacks.set(element, callback);\n  intersectionObserver.observe(element);\n}\n\nfunction unobserve(element: Element) {\n  intersectionCallbacks.delete(element);\n  intersectionObserver?.unobserve(element);\n}\n\n/**\n * Observe whether an element is currently visible or not.\n */\nexport function useVisible(ref: RefObject<Element>, options?: Options) {\n  const [isVisible, setVisible] = useState(false);\n  const enabled = options?.enabled ?? true;\n\n  useEffect(() => {\n    const element = ref.current;\n\n    if (!element) {\n      return;\n    }\n\n    if (enabled) {\n      observe(element, (entry) => {\n        setVisible(entry.isIntersecting);\n      });\n    } else {\n      unobserve(element);\n    }\n\n    return () => {\n      unobserve(element);\n    };\n  }, [enabled]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  return isVisible;\n}\n\nexport function useVisibleCallback<T extends (...args: any[]) => void>(\n  ref: RefObject<Element>,\n  callback: T,\n  options?: Options\n) {\n  const enabled = options?.enabled ?? true;\n  const latestCallback = useLatest(callback);\n\n  useEffect(() => {\n    const element = ref.current;\n\n    if (!element) {\n      return;\n    }\n\n    if (enabled) {\n      observe(element, (entry) => {\n        if (entry.isIntersecting) {\n          latestCallback.current();\n        }\n      });\n    } else {\n      unobserve(element);\n    }\n\n    return () => {\n      unobserve(element);\n    };\n  }, [enabled]); // eslint-disable-line react-hooks/exhaustive-deps\n}\n"],"names":["callback","useState","useEffect","useLatest"],"mappings":";;;;;AAUA,IAAI,oBAAA,CAAA;AACJ,MAAM,qBAAA,uBAA4B,OAGhC,EAAA,CAAA;AAEF,SAAS,OAAA,CACP,SACA,QACA,EAAA;AACA,EAAA,IAAI,CAAC,oBAAsB,EAAA;AACzB,IAAuB,oBAAA,GAAA,IAAI,oBAAqB,CAAA,CAAC,OAAY,KAAA;AAC3D,MAAA,KAAA,MAAW,SAAS,OAAS,EAAA;AAC3B,QAAA,MAAMA,SAAW,GAAA,qBAAA,CAAsB,GAAI,CAAA,KAAA,CAAM,MAAM,CAAA,CAAA;AAEvD,QAAAA,YAAW,KAAK,CAAA,CAAA;AAAA,OAClB;AAAA,KACD,CAAA,CAAA;AAAA,GACH;AAEA,EAAsB,qBAAA,CAAA,GAAA,CAAI,SAAS,QAAQ,CAAA,CAAA;AAC3C,EAAA,oBAAA,CAAqB,QAAQ,OAAO,CAAA,CAAA;AACtC,CAAA;AAEA,SAAS,UAAU,OAAkB,EAAA;AACnC,EAAA,qBAAA,CAAsB,OAAO,OAAO,CAAA,CAAA;AACpC,EAAA,oBAAA,EAAsB,UAAU,OAAO,CAAA,CAAA;AACzC,CAAA;AAKgB,SAAA,UAAA,CAAW,KAAyB,OAAmB,EAAA;AACrE,EAAA,MAAM,CAAC,SAAA,EAAW,UAAU,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAC9C,EAAM,MAAA,OAAA,GAAU,SAAS,OAAW,IAAA,IAAA,CAAA;AAEpC,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,UAAU,GAAI,CAAA,OAAA,CAAA;AAEpB,IAAA,IAAI,CAAC,OAAS,EAAA;AACZ,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,IAAI,OAAS,EAAA;AACX,MAAQ,OAAA,CAAA,OAAA,EAAS,CAAC,KAAU,KAAA;AAC1B,QAAA,UAAA,CAAW,MAAM,cAAc,CAAA,CAAA;AAAA,OAChC,CAAA,CAAA;AAAA,KACI,MAAA;AACL,MAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAAA,KACnB;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAAA,KACnB,CAAA;AAAA,GACF,EAAG,CAAC,OAAO,CAAC,CAAA,CAAA;AAEZ,EAAO,OAAA,SAAA,CAAA;AACT,CAAA;AAEgB,SAAA,kBAAA,CACd,GACA,EAAA,QAAA,EACA,OACA,EAAA;AACA,EAAM,MAAA,OAAA,GAAU,SAAS,OAAW,IAAA,IAAA,CAAA;AACpC,EAAM,MAAA,cAAA,GAAiBC,oBAAU,QAAQ,CAAA,CAAA;AAEzC,EAAAD,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,UAAU,GAAI,CAAA,OAAA,CAAA;AAEpB,IAAA,IAAI,CAAC,OAAS,EAAA;AACZ,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,IAAI,OAAS,EAAA;AACX,MAAQ,OAAA,CAAA,OAAA,EAAS,CAAC,KAAU,KAAA;AAC1B,QAAA,IAAI,MAAM,cAAgB,EAAA;AACxB,UAAA,cAAA,CAAe,OAAQ,EAAA,CAAA;AAAA,SACzB;AAAA,OACD,CAAA,CAAA;AAAA,KACI,MAAA;AACL,MAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAAA,KACnB;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAAA,KACnB,CAAA;AAAA,GACF,EAAG,CAAC,OAAO,CAAC,CAAA,CAAA;AACd;;;;;"}