@konstructio/ui/dist/index-D_76wh4w.js

A set of reusable and customizable React components built for konstruct.io

import * as i from "react";
import { d as b, b as h, u as U } from "./index-Cva-e5M4.js";
import { P as m, d as z, R as H } from "./index-D7QNmo_D.js";
import { u as T } from "./index-B_6_jmOO.js";
import { jsx as P } from "react/jsx-runtime";
function K(r, e = globalThis == null ? void 0 : globalThis.document) {
  const s = b(r);
  i.useEffect(() => {
    const n = (t) => {
      t.key === "Escape" && s(t);
    };
    return e.addEventListener("keydown", n, { capture: !0 }), () => e.removeEventListener("keydown", n, { capture: !0 });
  }, [s, e]);
}
var j = "DismissableLayer", p = "dismissableLayer.update", X = "dismissableLayer.pointerDownOutside", Y = "dismissableLayer.focusOutside", g, B = i.createContext({
  layers: /* @__PURE__ */ new Set(),
  layersWithOutsidePointerEventsDisabled: /* @__PURE__ */ new Set(),
  branches: /* @__PURE__ */ new Set()
}), x = i.forwardRef(
  (r, e) => {
    const {
      disableOutsidePointerEvents: s = !1,
      onEscapeKeyDown: n,
      onPointerDownOutside: t,
      onFocusOutside: a,
      onInteractOutside: l,
      onDismiss: u,
      ...v
    } = r, c = i.useContext(B), [d, N] = i.useState(null), f = (d == null ? void 0 : d.ownerDocument) ?? (globalThis == null ? void 0 : globalThis.document), [, F] = i.useState({}), W = T(e, (o) => N(o)), D = Array.from(c.layers), [k] = [...c.layersWithOutsidePointerEventsDisabled].slice(-1), I = D.indexOf(k), L = d ? D.indexOf(d) : -1, _ = c.layersWithOutsidePointerEventsDisabled.size > 0, C = L >= I, M = G((o) => {
      const E = o.target, R = [...c.branches].some((y) => y.contains(E));
      !C || R || (t == null || t(o), l == null || l(o), o.defaultPrevented || u == null || u());
    }, f), O = J((o) => {
      const E = o.target;
      [...c.branches].some((y) => y.contains(E)) || (a == null || a(o), l == null || l(o), o.defaultPrevented || u == null || u());
    }, f);
    return K((o) => {
      L === c.layers.size - 1 && (n == null || n(o), !o.defaultPrevented && u && (o.preventDefault(), u()));
    }, f), i.useEffect(() => {
      if (d)
        return s && (c.layersWithOutsidePointerEventsDisabled.size === 0 && (g = f.body.style.pointerEvents, f.body.style.pointerEvents = "none"), c.layersWithOutsidePointerEventsDisabled.add(d)), c.layers.add(d), w(), () => {
          s && c.layersWithOutsidePointerEventsDisabled.size === 1 && (f.body.style.pointerEvents = g);
        };
    }, [d, f, s, c]), i.useEffect(() => () => {
      d && (c.layers.delete(d), c.layersWithOutsidePointerEventsDisabled.delete(d), w());
    }, [d, c]), i.useEffect(() => {
      const o = () => F({});
      return document.addEventListener(p, o), () => document.removeEventListener(p, o);
    }, []), /* @__PURE__ */ P(
      m.div,
      {
        ...v,
        ref: W,
        style: {
          pointerEvents: _ ? C ? "auto" : "none" : void 0,
          ...r.style
        },
        onFocusCapture: h(r.onFocusCapture, O.onFocusCapture),
        onBlurCapture: h(r.onBlurCapture, O.onBlurCapture),
        onPointerDownCapture: h(
          r.onPointerDownCapture,
          M.onPointerDownCapture
        )
      }
    );
  }
);
x.displayName = j;
var q = "DismissableLayerBranch", S = i.forwardRef((r, e) => {
  const s = i.useContext(B), n = i.useRef(null), t = T(e, n);
  return i.useEffect(() => {
    const a = n.current;
    if (a)
      return s.branches.add(a), () => {
        s.branches.delete(a);
      };
  }, [s.branches]), /* @__PURE__ */ P(m.div, { ...r, ref: t });
});
S.displayName = q;
function G(r, e = globalThis == null ? void 0 : globalThis.document) {
  const s = b(r), n = i.useRef(!1), t = i.useRef(() => {
  });
  return i.useEffect(() => {
    const a = (u) => {
      if (u.target && !n.current) {
        let v = function() {
          A(
            X,
            s,
            c,
            { discrete: !0 }
          );
        };
        const c = { originalEvent: u };
        u.pointerType === "touch" ? (e.removeEventListener("click", t.current), t.current = v, e.addEventListener("click", t.current, { once: !0 })) : v();
      } else
        e.removeEventListener("click", t.current);
      n.current = !1;
    }, l = window.setTimeout(() => {
      e.addEventListener("pointerdown", a);
    }, 0);
    return () => {
      window.clearTimeout(l), e.removeEventListener("pointerdown", a), e.removeEventListener("click", t.current);
    };
  }, [e, s]), {
    // ensures we check React component tree (not just DOM tree)
    onPointerDownCapture: () => n.current = !0
  };
}
function J(r, e = globalThis == null ? void 0 : globalThis.document) {
  const s = b(r), n = i.useRef(!1);
  return i.useEffect(() => {
    const t = (a) => {
      a.target && !n.current && A(Y, s, { originalEvent: a }, {
        discrete: !1
      });
    };
    return e.addEventListener("focusin", t), () => e.removeEventListener("focusin", t);
  }, [e, s]), {
    onFocusCapture: () => n.current = !0,
    onBlurCapture: () => n.current = !1
  };
}
function w() {
  const r = new CustomEvent(p);
  document.dispatchEvent(r);
}
function A(r, e, s, { discrete: n }) {
  const t = s.originalEvent.target, a = new CustomEvent(r, { bubbles: !1, cancelable: !0, detail: s });
  e && t.addEventListener(r, e, { once: !0 }), n ? z(t, a) : t.dispatchEvent(a);
}
var se = x, ne = S, Q = "Portal", V = i.forwardRef((r, e) => {
  var u;
  const { container: s, ...n } = r, [t, a] = i.useState(!1);
  U(() => a(!0), []);
  const l = s || t && ((u = globalThis == null ? void 0 : globalThis.document) == null ? void 0 : u.body);
  return l ? H.createPortal(/* @__PURE__ */ P(m.div, { ...n, ref: e }), l) : null;
});
V.displayName = Q;
export {
  ne as B,
  x as D,
  V as P,
  se as R
};