@frontify/fondue/dist/components/RichTextEditor/BlurObserver.es.js

Design system of Frontify

import { useEditorRef as b } from "@udecode/plate-core";
import { useFloatingLinkSelectors as I, floatingLinkActions as S } from "@udecode/plate-link";
import { useState as T, useCallback as f, useEffect as m } from "react";
import { FLOATING_MODAL_SELECTOR as h } from "./components/FloatingModal/FloatingModal.es.js";
const B = ({
  hideExternalFloatingModals: i
}) => {
  const e = b(), n = I().isOpen(e.id), [c, d] = T(!1), o = f(() => {
    n && S.hide(), i && i(e.id);
  }, [n, i, e]), l = f(() => {
    o(), e.deselect(), e.collapse();
  }, [e, o]);
  return m(() => {
    if (!c)
      return;
    const t = (r) => {
      const v = `[data-editor-id='${e.id}']`, E = "[role='toolbar']", p = "[data-is-underlay]", s = r.target, L = s.closest(p), O = s.closest(h), a = s.closest(v), u = s.closest(E);
      a && !O || u ? o() : !a && !u && !L && (l(), d(!1));
    };
    return document.addEventListener("pointerdown", t), document.addEventListener("focusin", t), () => {
      document.removeEventListener("focusin", t), document.removeEventListener("pointerdown", t);
    };
  }, [l, o, e.id, c]), m(() => {
    const t = document.querySelector(`[data-editor-id='${e.id}']`);
    if (!t)
      return;
    const r = () => {
      d(!0);
    };
    return t.addEventListener("focusin", r), () => {
      t.removeEventListener("focusin", r);
    };
  }, [e.id]), null;
};
export {
  B as BlurObserver
};
//# sourceMappingURL=BlurObserver.es.js.map