@lazar-ui/kit 0.1.0

package/dist/useModalOverlay-D5Bs9FCB.mjs

@@ -0,0 +1,486 @@
+import { l as N, n as ee, p as J, h as g, $ as P, g as te, o as ne, a as oe, s as D, b as k, q as K, e as re, c as F } from "./Overlay-RmiBtqDR.mjs";
+import { useState as X, useRef as E, useCallback as Y, useEffect as C } from "react";
+import { $ as le } from "./useOverlayTriggerState-BIo1Jcba.mjs";
+import { c as ae } from "./clsx-OuTLNxxd.mjs";
+function _(...t) {
+  return (...e) => {
+    for (let n of t) typeof n == "function" && n(...e);
+  };
+}
+function ie(t) {
+  let [e, n] = X(t), r = E(e), o = E(null), a = E(() => {
+    if (!o.current) return;
+    let u = o.current.next();
+    if (u.done) {
+      o.current = null;
+      return;
+    }
+    r.current === u.value ? a.current() : n(u.value);
+  });
+  N(() => {
+    r.current = e, o.current && a.current();
+  });
+  let l = Y((u) => {
+    o.current = u(r.current), a.current();
+  }, [
+    a
+  ]);
+  return [
+    e,
+    l
+  ];
+}
+let ce = !!(typeof window < "u" && window.document && window.document.createElement), w = /* @__PURE__ */ new Map(), x;
+typeof FinalizationRegistry < "u" && (x = new FinalizationRegistry((t) => {
+  w.delete(t);
+}));
+function fe(t) {
+  let [e, n] = X(t), r = E(null), o = ee(e), a = E(null);
+  if (x && x.register(a, o), ce) {
+    const l = w.get(o);
+    l && !l.includes(r) ? l.push(r) : w.set(o, [
+      r
+    ]);
+  }
+  return N(() => {
+    let l = o;
+    return () => {
+      x && x.unregister(a), w.delete(l);
+    };
+  }, [
+    o
+  ]), C(() => {
+    let l = r.current;
+    return l && n(l), () => {
+      l && (r.current = null);
+    };
+  }), o;
+}
+function ue(t, e) {
+  if (t === e) return t;
+  let n = w.get(t);
+  if (n)
+    return n.forEach((o) => o.current = e), e;
+  let r = w.get(e);
+  return r ? (r.forEach((o) => o.current = t), t) : e;
+}
+function se(t = []) {
+  let e = fe(), [n, r] = ie(e), o = Y(() => {
+    r(function* () {
+      yield e, yield document.getElementById(e) ? e : void 0;
+    });
+  }, [
+    e,
+    r
+  ]);
+  return N(o, [
+    e,
+    o,
+    ...t
+  ]), n;
+}
+function de(...t) {
+  return t.length === 1 && t[0] ? t[0] : (e) => {
+    let n = !1;
+    const r = t.map((o) => {
+      const a = U(o, e);
+      return n ||= typeof a == "function", a;
+    });
+    if (n) return () => {
+      r.forEach((o, a) => {
+        typeof o == "function" ? o() : U(t[a], null);
+      });
+    };
+  };
+}
+function U(t, e) {
+  if (typeof t == "function") return t(e);
+  t != null && (t.current = e);
+}
+function be(...t) {
+  let e = {
+    ...t[0]
+  };
+  for (let n = 1; n < t.length; n++) {
+    let r = t[n];
+    for (let o in r) {
+      let a = e[o], l = r[o];
+      typeof a == "function" && typeof l == "function" && // This is a lot faster than a regex.
+      o[0] === "o" && o[1] === "n" && o.charCodeAt(2) >= /* 'A' */
+      65 && o.charCodeAt(2) <= /* 'Z' */
+      90 ? e[o] = _(a, l) : (o === "className" || o === "UNSAFE_className") && typeof a == "string" && typeof l == "string" ? e[o] = ae(a, l) : o === "id" && a && l ? e.id = ue(a, l) : o === "ref" && a && l ? e.ref = de(a, l) : e[o] = l !== void 0 ? l : a;
+    }
+  }
+  return e;
+}
+const $e = /* @__PURE__ */ new Set([
+  "checkbox",
+  "radio",
+  "range",
+  "color",
+  "file",
+  "image",
+  "button",
+  "submit",
+  "reset"
+]);
+function I(t) {
+  return t instanceof HTMLInputElement && !$e.has(t.type) || t instanceof HTMLTextAreaElement || t instanceof HTMLElement && t.isContentEditable;
+}
+const pe = /* @__PURE__ */ new Set([
+  "id"
+]), me = /* @__PURE__ */ new Set([
+  "aria-label",
+  "aria-labelledby",
+  "aria-describedby",
+  "aria-details"
+]), he = /* @__PURE__ */ new Set([
+  "href",
+  "hrefLang",
+  "target",
+  "rel",
+  "download",
+  "ping",
+  "referrerPolicy"
+]), ve = /* @__PURE__ */ new Set([
+  "dir",
+  "lang",
+  "hidden",
+  "inert",
+  "translate"
+]), G = /* @__PURE__ */ new Set([
+  "onClick",
+  "onAuxClick",
+  "onContextMenu",
+  "onDoubleClick",
+  "onMouseDown",
+  "onMouseEnter",
+  "onMouseLeave",
+  "onMouseMove",
+  "onMouseOut",
+  "onMouseOver",
+  "onMouseUp",
+  "onTouchCancel",
+  "onTouchEnd",
+  "onTouchMove",
+  "onTouchStart",
+  "onPointerDown",
+  "onPointerMove",
+  "onPointerUp",
+  "onPointerCancel",
+  "onPointerEnter",
+  "onPointerLeave",
+  "onPointerOver",
+  "onPointerOut",
+  "onGotPointerCapture",
+  "onLostPointerCapture",
+  "onScroll",
+  "onWheel",
+  "onAnimationStart",
+  "onAnimationEnd",
+  "onAnimationIteration",
+  "onTransitionCancel",
+  "onTransitionEnd",
+  "onTransitionRun",
+  "onTransitionStart"
+]), Ee = /^(data-.*)$/;
+function we(t, e = {}) {
+  let { labelable: n, isLink: r, global: o, events: a = o, propNames: l } = e, u = {};
+  for (const d in t) Object.prototype.hasOwnProperty.call(t, d) && (pe.has(d) || n && me.has(d) || r && he.has(d) || o && ve.has(d) || a && (G.has(d) || d.endsWith("Capture") && G.has(d.slice(0, -7))) || l?.has(d) || Ee.test(d)) && (u[d] = t[d]);
+  return u;
+}
+function q(t) {
+  return t?.defaultView?.__webpack_nonce__ || globalThis.__webpack_nonce__ || void 0;
+}
+let H = /* @__PURE__ */ new WeakMap();
+function ge(t) {
+  let e = t ?? (typeof document < "u" ? document : void 0);
+  if (!e) return q(e);
+  if (H.has(e)) return H.get(e);
+  let n = e.querySelector('meta[property="csp-nonce"]'), r = n && n instanceof J(n).HTMLMetaElement && (n.nonce || n.content) || q(e) || void 0;
+  return r !== void 0 && H.set(e, r), r;
+}
+function W(t, e) {
+  if (!t) return !1;
+  let n = window.getComputedStyle(t), r = document.scrollingElement || document.documentElement, o = /(auto|scroll)/.test(n.overflow + n.overflowX + n.overflowY);
+  return t === r && n.overflow !== "hidden" && (o = !0), o && e && (o = t.scrollHeight !== t.clientHeight || t.scrollWidth !== t.clientWidth), o;
+}
+function Q(t, e) {
+  let n = t;
+  for (W(n, e) && (n = n.parentElement); n && !W(n, e); ) n = n.parentElement;
+  return n || document.scrollingElement || document.documentElement;
+}
+const ye = typeof HTMLElement < "u" && "inert" in HTMLElement.prototype;
+function j(t) {
+  return t.dataset.liveAnnouncer === "true" || t.dataset.reactAriaTopLayer !== void 0;
+}
+let y = /* @__PURE__ */ new WeakMap(), m = [];
+function xe(t, e) {
+  let n = J(t?.[0]), r = e instanceof n.Element ? {
+    root: e
+  } : e, o = r?.root ?? document.body, a = r?.shouldUseInert && ye, l = new Set(t), u = /* @__PURE__ */ new Set(), d = (i) => a && i instanceof n.HTMLElement ? i.inert : i.getAttribute("aria-hidden") === "true", M = (i, c) => {
+    a && i instanceof n.HTMLElement ? i.inert = c : c ? i.setAttribute("aria-hidden", "true") : (i.removeAttribute("aria-hidden"), i instanceof n.HTMLElement && (i.inert = !1));
+  }, $ = /* @__PURE__ */ new Set();
+  if (g())
+    for (let i of t) {
+      let c = i;
+      for (; c && c !== o; ) {
+        let b = c.getRootNode();
+        "shadowRoot" in b && $.add(b.shadowRoot), c = b.parentNode;
+      }
+    }
+  let s = (i) => {
+    for (let f of i.querySelectorAll("[data-live-announcer], [data-react-aria-top-layer]")) l.add(f);
+    let c = (f) => {
+      if (u.has(f) || l.has(f) || f.parentElement && u.has(f.parentElement) && f.parentElement.getAttribute("role") !== "row") return NodeFilter.FILTER_REJECT;
+      for (let Z of l)
+        if (P(f, Z)) return NodeFilter.FILTER_SKIP;
+      return NodeFilter.FILTER_ACCEPT;
+    }, b = te(ne(i), i, NodeFilter.SHOW_ELEMENT, {
+      acceptNode: c
+    }), v = c(i);
+    if (v === NodeFilter.FILTER_ACCEPT && p(i), v !== NodeFilter.FILTER_REJECT) {
+      let f = b.nextNode();
+      for (; f != null; )
+        p(f), f = b.nextNode();
+    }
+  }, p = (i) => {
+    let c = y.get(i) ?? 0;
+    d(i) && c === 0 || (c === 0 && M(i, !0), u.add(i), y.set(i, c + 1));
+  };
+  m.length && m[m.length - 1].disconnect(), s(o);
+  let h = new MutationObserver((i) => {
+    for (let c of i)
+      if (c.type === "childList") {
+        if (c.target.isConnected && ![
+          ...l,
+          ...u
+        ].some((b) => P(b, c.target))) for (let b of c.addedNodes)
+          (b instanceof HTMLElement || b instanceof SVGElement) && j(b) ? l.add(b) : b instanceof Element && s(b);
+        if (g()) {
+          for (let b of $) if (!b.isConnected) {
+            h.disconnect();
+            break;
+          }
+        }
+      }
+  });
+  h.observe(o, {
+    childList: !0,
+    subtree: !0
+  });
+  let V = /* @__PURE__ */ new Set();
+  if (g()) for (let i of $) {
+    let c = new MutationObserver((b) => {
+      for (let v of b)
+        if (v.type === "childList") {
+          if (v.target.isConnected && ![
+            ...l,
+            ...u
+          ].some((f) => P(f, v.target))) for (let f of v.addedNodes)
+            (f instanceof HTMLElement || f instanceof SVGElement) && j(f) ? l.add(f) : f instanceof Element && s(f);
+          if (g()) {
+            for (let f of $) if (!f.isConnected) {
+              h.disconnect();
+              break;
+            }
+          }
+        }
+    });
+    c.observe(i, {
+      childList: !0,
+      subtree: !0
+    }), V.add(c);
+  }
+  let R = {
+    visibleNodes: l,
+    hiddenNodes: u,
+    observe() {
+      h.observe(o, {
+        childList: !0,
+        subtree: !0
+      });
+    },
+    disconnect() {
+      h.disconnect();
+    }
+  };
+  return m.push(R), () => {
+    if (h.disconnect(), g()) for (let i of V) i.disconnect();
+    for (let i of u) {
+      let c = y.get(i);
+      c != null && (c === 1 ? (M(i, !1), y.delete(i)) : y.set(i, c - 1));
+    }
+    R === m[m.length - 1] ? (m.pop(), m.length && m[m.length - 1].observe()) : m.splice(m.indexOf(R), 1);
+  };
+}
+function Pe(t, e) {
+  let { role: n = "dialog" } = t, r = se();
+  r = t["aria-label"] ? void 0 : r;
+  let o = E(!1);
+  C(() => {
+    if (e.current && !oe(e.current)) {
+      D(e.current);
+      let l = setTimeout(() => {
+        (k() === e.current || k() === document.body) && (o.current = !0, e.current && (e.current.blur(), D(e.current)), o.current = !1);
+      }, 500);
+      return () => {
+        clearTimeout(l);
+      };
+    }
+  }, [
+    e
+  ]), K();
+  let a = E(!1);
+  return C(() => {
+    if (process.env.NODE_ENV !== "production" && !a.current && e.current) {
+      let l = e.current, u = l.hasAttribute("aria-label"), d = l.hasAttribute("aria-labelledby");
+      !u && !d && (console.warn("A dialog must have a title for accessibility. Either provide an aria-label or aria-labelledby prop, or render a heading element inside the dialog."), a.current = !0);
+    }
+  }), {
+    dialogProps: {
+      ...we(t, {
+        labelable: !0
+      }),
+      role: n,
+      tabIndex: -1,
+      "aria-labelledby": t["aria-labelledby"] || r,
+      // Prevent blur events from reaching useOverlay, which may cause
+      // popovers to close. Since focus is contained within the dialog,
+      // we don't want this to occur due to the above useEffect.
+      onBlur: (l) => {
+        o.current && l.stopPropagation();
+      }
+    },
+    titleProps: {
+      id: r
+    }
+  };
+}
+const T = typeof document < "u" && window.visualViewport;
+let S = 0, O;
+function Te(t = {}) {
+  let { isDisabled: e } = t;
+  N(() => {
+    if (!e)
+      return S++, S === 1 && (re() ? O = Se() : O = Me()), () => {
+        S--, S === 0 && O();
+      };
+  }, [
+    e
+  ]);
+}
+function Me() {
+  let t = window.innerWidth - document.documentElement.clientWidth;
+  return _(t > 0 && // Use scrollbar-gutter when supported because it also works for fixed positioned elements.
+  ("scrollbarGutter" in document.documentElement.style ? L(document.documentElement, "scrollbarGutter", "stable") : L(document.documentElement, "paddingRight", `${t}px`)), L(document.documentElement, "overflow", "hidden"));
+}
+function Se() {
+  let t = L(document.documentElement, "overflow", "hidden"), e, n = !1, r = ($) => {
+    let s = F($);
+    e = W(s) ? s : Q(s, !0), n = !1;
+    let p = s.ownerDocument.defaultView.getSelection();
+    p && !p.isCollapsed && p.containsNode(s, !0) && (n = !0), $.composedPath().some((h) => h instanceof HTMLInputElement && h.type === "range") && (n = !0), "selectionStart" in s && "selectionEnd" in s && s.selectionStart < s.selectionEnd && s.ownerDocument.activeElement === s && (n = !0);
+  }, o = document.createElement("style"), a = ge();
+  a && (o.nonce = a), o.textContent = `
+@layer {
+  * {
+    overscroll-behavior: contain;
+  }
+}`.trim(), document.head.prepend(o);
+  let l = ($) => {
+    if (!($.touches.length === 2 || n)) {
+      if (!e || e === document.documentElement || e === document.body) {
+        $.preventDefault();
+        return;
+      }
+      e.scrollHeight === e.clientHeight && e.scrollWidth === e.clientWidth && $.preventDefault();
+    }
+  }, u = ($) => {
+    let s = F($), p = $.relatedTarget;
+    p && I(p) ? (p.focus({
+      preventScroll: !0
+    }), z(p, I(s))) : p || s.parentElement?.closest("[tabindex]")?.focus({
+      preventScroll: !0
+    });
+  }, d = HTMLElement.prototype.focus;
+  HTMLElement.prototype.focus = function($) {
+    let s = k(), p = s != null && I(s);
+    d.call(this, {
+      ...$,
+      preventScroll: !0
+    }), (!$ || !$.preventScroll) && z(this, p);
+  };
+  let M = _(A(document, "touchstart", r, {
+    passive: !1,
+    capture: !0
+  }), A(document, "touchmove", l, {
+    passive: !1,
+    capture: !0
+  }), A(document, "blur", u, !0));
+  return () => {
+    t(), M(), o.remove(), HTMLElement.prototype.focus = d;
+  };
+}
+function L(t, e, n) {
+  let r = t.style[e];
+  return t.style[e] = n, () => {
+    t.style[e] = r;
+  };
+}
+function A(t, e, n, r) {
+  return t.addEventListener(e, n, r), () => {
+    t.removeEventListener(e, n, r);
+  };
+}
+function z(t, e) {
+  e || !T ? B(t) : T.addEventListener("resize", () => B(t), {
+    once: !0
+  });
+}
+function B(t) {
+  let e = document.scrollingElement || document.documentElement, n = t;
+  for (; n && n !== e; ) {
+    let r = Q(n);
+    if (r !== document.documentElement && r !== document.body && r !== n) {
+      let o = r.getBoundingClientRect(), a = n.getBoundingClientRect();
+      if (a.top < o.top || a.bottom > o.top + n.clientHeight) {
+        let l = o.bottom;
+        T && (l = Math.min(l, T.offsetTop + T.height));
+        let u = a.top - o.top - ((l - o.top) / 2 - a.height / 2);
+        r.scrollTo({
+          // Clamp to the valid range to prevent over-scrolling.
+          top: Math.max(0, Math.min(r.scrollHeight - r.clientHeight, r.scrollTop + u)),
+          behavior: "smooth"
+        });
+      }
+    }
+    n = r.parentElement;
+  }
+}
+function Ie(t, e, n) {
+  let { overlayProps: r, underlayProps: o } = le({
+    ...t,
+    isOpen: e.isOpen,
+    onClose: e.close
+  }, n);
+  return Te({
+    isDisabled: !e.isOpen
+  }), K(), C(() => {
+    if (e.isOpen && n.current) return xe([
+      n.current
+    ], {
+      shouldUseInert: !0
+    });
+  }, [
+    e.isOpen,
+    n
+  ]), {
+    modalProps: be(r),
+    underlayProps: o
+  };
+}
+export {
+  Pe as $,
+  Ie as a
+};