@konstructio/ui 0.0.12 → 0.0.13-alpha.2

package/dist/index-DvFiic6N.js

@@ -0,0 +1,446 @@
+import * as i from "react";
+import { u as Ee, d as j, a as he, c as ye, b as _, e as De } from "./index-bYyfdsls.js";
+import { u as S, c as be } from "./index-Bk324h27.js";
+import { P as Ce, D as Re } from "./index-YaQrdkGE.js";
+import { P as N } from "./index-g-TFwd6Y.js";
+import { jsx as f, jsxs as q, Fragment as B } from "react/jsx-runtime";
+import { P as W } from "./index-G_6jG4Qc.js";
+import { R as Ae } from "./Combination-b348x__d.js";
+var Ne = i[" useId ".trim().toString()] || (() => {
+}), Oe = 0;
+function M(e) {
+  const [n, t] = i.useState(Ne());
+  return Ee(() => {
+    t((o) => o ?? String(Oe++));
+  }, [e]), n ? `radix-${n}` : "";
+}
+var x = "focusScope.autoFocusOnMount", w = "focusScope.autoFocusOnUnmount", V = { bubbles: !1, cancelable: !0 }, _e = "FocusScope", Q = i.forwardRef((e, n) => {
+  const {
+    loop: t = !1,
+    trapped: o = !1,
+    onMountAutoFocus: a,
+    onUnmountAutoFocus: r,
+    ...c
+  } = e, [s, g] = i.useState(null), m = j(a), h = j(r), u = i.useRef(null), d = S(n, (l) => g(l)), p = i.useRef({
+    paused: !1,
+    pause() {
+      this.paused = !0;
+    },
+    resume() {
+      this.paused = !1;
+    }
+  }).current;
+  i.useEffect(() => {
+    if (o) {
+      let l = function(D) {
+        if (p.paused || !s) return;
+        const y = D.target;
+        s.contains(y) ? u.current = y : C(u.current, { select: !0 });
+      }, b = function(D) {
+        if (p.paused || !s) return;
+        const y = D.relatedTarget;
+        y !== null && (s.contains(y) || C(u.current, { select: !0 }));
+      }, v = function(D) {
+        if (document.activeElement === document.body)
+          for (const H of D)
+            H.removedNodes.length > 0 && C(s);
+      };
+      document.addEventListener("focusin", l), document.addEventListener("focusout", b);
+      const O = new MutationObserver(v);
+      return s && O.observe(s, { childList: !0, subtree: !0 }), () => {
+        document.removeEventListener("focusin", l), document.removeEventListener("focusout", b), O.disconnect();
+      };
+    }
+  }, [o, s, p.paused]), i.useEffect(() => {
+    if (s) {
+      Z.add(p);
+      const l = document.activeElement;
+      if (!s.contains(l)) {
+        const v = new CustomEvent(x, V);
+        s.addEventListener(x, m), s.dispatchEvent(v), v.defaultPrevented || (Ie(Me(X(s)), { select: !0 }), document.activeElement === l && C(s));
+      }
+      return () => {
+        s.removeEventListener(x, m), setTimeout(() => {
+          const v = new CustomEvent(w, V);
+          s.addEventListener(w, h), s.dispatchEvent(v), v.defaultPrevented || C(l ?? document.body, { select: !0 }), s.removeEventListener(w, h), Z.remove(p);
+        }, 0);
+      };
+    }
+  }, [s, m, h, p]);
+  const I = i.useCallback(
+    (l) => {
+      if (!t && !o || p.paused) return;
+      const b = l.key === "Tab" && !l.altKey && !l.ctrlKey && !l.metaKey, v = document.activeElement;
+      if (b && v) {
+        const O = l.currentTarget, [D, y] = Pe(O);
+        D && y ? !l.shiftKey && v === y ? (l.preventDefault(), t && C(D, { select: !0 })) : l.shiftKey && v === D && (l.preventDefault(), t && C(y, { select: !0 })) : v === O && l.preventDefault();
+      }
+    },
+    [t, o, p.paused]
+  );
+  return /* @__PURE__ */ f(N.div, { tabIndex: -1, ...c, ref: d, onKeyDown: I });
+});
+Q.displayName = _e;
+function Ie(e, { select: n = !1 } = {}) {
+  const t = document.activeElement;
+  for (const o of e)
+    if (C(o, { select: n }), document.activeElement !== t) return;
+}
+function Pe(e) {
+  const n = X(e), t = Y(n, e), o = Y(n.reverse(), e);
+  return [t, o];
+}
+function X(e) {
+  const n = [], t = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT, {
+    acceptNode: (o) => {
+      const a = o.tagName === "INPUT" && o.type === "hidden";
+      return o.disabled || o.hidden || a ? NodeFilter.FILTER_SKIP : o.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
+    }
+  });
+  for (; t.nextNode(); ) n.push(t.currentNode);
+  return n;
+}
+function Y(e, n) {
+  for (const t of e)
+    if (!Te(t, { upTo: n })) return t;
+}
+function Te(e, { upTo: n }) {
+  if (getComputedStyle(e).visibility === "hidden") return !0;
+  for (; e; ) {
+    if (n !== void 0 && e === n) return !1;
+    if (getComputedStyle(e).display === "none") return !0;
+    e = e.parentElement;
+  }
+  return !1;
+}
+function Fe(e) {
+  return e instanceof HTMLInputElement && "select" in e;
+}
+function C(e, { select: n = !1 } = {}) {
+  if (e && e.focus) {
+    const t = document.activeElement;
+    e.focus({ preventScroll: !0 }), e !== t && Fe(e) && n && e.select();
+  }
+}
+var Z = Se();
+function Se() {
+  let e = [];
+  return {
+    add(n) {
+      const t = e[0];
+      n !== t && (t == null || t.pause()), e = z(e, n), e.unshift(n);
+    },
+    remove(n) {
+      var t;
+      e = z(e, n), (t = e[0]) == null || t.resume();
+    }
+  };
+}
+function z(e, n) {
+  const t = [...e], o = t.indexOf(n);
+  return o !== -1 && t.splice(o, 1), t;
+}
+function Me(e) {
+  return e.filter((n) => n.tagName !== "A");
+}
+var L = 0;
+function xe() {
+  i.useEffect(() => {
+    const e = document.querySelectorAll("[data-radix-focus-guard]");
+    return document.body.insertAdjacentElement("afterbegin", e[0] ?? J()), document.body.insertAdjacentElement("beforeend", e[1] ?? J()), L++, () => {
+      L === 1 && document.querySelectorAll("[data-radix-focus-guard]").forEach((n) => n.remove()), L--;
+    };
+  }, []);
+}
+function J() {
+  const e = document.createElement("span");
+  return e.setAttribute("data-radix-focus-guard", ""), e.tabIndex = 0, e.style.outline = "none", e.style.opacity = "0", e.style.position = "fixed", e.style.pointerEvents = "none", e;
+}
+var we = function(e) {
+  if (typeof document > "u")
+    return null;
+  var n = Array.isArray(e) ? e[0] : e;
+  return n.ownerDocument.body;
+}, A = /* @__PURE__ */ new WeakMap(), P = /* @__PURE__ */ new WeakMap(), T = {}, k = 0, ee = function(e) {
+  return e && (e.host || ee(e.parentNode));
+}, Le = function(e, n) {
+  return n.map(function(t) {
+    if (e.contains(t))
+      return t;
+    var o = ee(t);
+    return o && e.contains(o) ? o : (console.error("aria-hidden", t, "in not contained inside", e, ". Doing nothing"), null);
+  }).filter(function(t) {
+    return !!t;
+  });
+}, ke = function(e, n, t, o) {
+  var a = Le(n, Array.isArray(e) ? e : [e]);
+  T[t] || (T[t] = /* @__PURE__ */ new WeakMap());
+  var r = T[t], c = [], s = /* @__PURE__ */ new Set(), g = new Set(a), m = function(u) {
+    !u || s.has(u) || (s.add(u), m(u.parentNode));
+  };
+  a.forEach(m);
+  var h = function(u) {
+    !u || g.has(u) || Array.prototype.forEach.call(u.children, function(d) {
+      if (s.has(d))
+        h(d);
+      else
+        try {
+          var p = d.getAttribute(o), I = p !== null && p !== "false", l = (A.get(d) || 0) + 1, b = (r.get(d) || 0) + 1;
+          A.set(d, l), r.set(d, b), c.push(d), l === 1 && I && P.set(d, !0), b === 1 && d.setAttribute(t, "true"), I || d.setAttribute(o, "true");
+        } catch (v) {
+          console.error("aria-hidden: cannot operate on ", d, v);
+        }
+    });
+  };
+  return h(n), s.clear(), k++, function() {
+    c.forEach(function(u) {
+      var d = A.get(u) - 1, p = r.get(u) - 1;
+      A.set(u, d), r.set(u, p), d || (P.has(u) || u.removeAttribute(o), P.delete(u)), p || u.removeAttribute(t);
+    }), k--, k || (A = /* @__PURE__ */ new WeakMap(), A = /* @__PURE__ */ new WeakMap(), P = /* @__PURE__ */ new WeakMap(), T = {});
+  };
+}, We = function(e, n, t) {
+  t === void 0 && (t = "data-aria-hidden");
+  var o = Array.from(Array.isArray(e) ? e : [e]), a = we(e);
+  return a ? (o.push.apply(o, Array.from(a.querySelectorAll("[aria-live]"))), ke(o, a, t, "aria-hidden")) : function() {
+    return null;
+  };
+}, U = "Dialog", [te, tt] = ye(U), [Ue, E] = te(U), ne = (e) => {
+  const {
+    __scopeDialog: n,
+    children: t,
+    open: o,
+    defaultOpen: a,
+    onOpenChange: r,
+    modal: c = !0
+  } = e, s = i.useRef(null), g = i.useRef(null), [m = !1, h] = he({
+    prop: o,
+    defaultProp: a,
+    onChange: r
+  });
+  return /* @__PURE__ */ f(
+    Ue,
+    {
+      scope: n,
+      triggerRef: s,
+      contentRef: g,
+      contentId: M(),
+      titleId: M(),
+      descriptionId: M(),
+      open: m,
+      onOpenChange: h,
+      onOpenToggle: i.useCallback(() => h((u) => !u), [h]),
+      modal: c,
+      children: t
+    }
+  );
+};
+ne.displayName = U;
+var oe = "DialogTrigger", re = i.forwardRef(
+  (e, n) => {
+    const { __scopeDialog: t, ...o } = e, a = E(oe, t), r = S(n, a.triggerRef);
+    return /* @__PURE__ */ f(
+      N.button,
+      {
+        type: "button",
+        "aria-haspopup": "dialog",
+        "aria-expanded": a.open,
+        "aria-controls": a.contentId,
+        "data-state": $(a.open),
+        ...o,
+        ref: r,
+        onClick: _(e.onClick, a.onOpenToggle)
+      }
+    );
+  }
+);
+re.displayName = oe;
+var K = "DialogPortal", [Ke, ae] = te(K, {
+  forceMount: void 0
+}), se = (e) => {
+  const { __scopeDialog: n, forceMount: t, children: o, container: a } = e, r = E(K, n);
+  return /* @__PURE__ */ f(Ke, { scope: n, forceMount: t, children: i.Children.map(o, (c) => /* @__PURE__ */ f(W, { present: t || r.open, children: /* @__PURE__ */ f(Ce, { asChild: !0, container: a, children: c }) })) });
+};
+se.displayName = K;
+var F = "DialogOverlay", ie = i.forwardRef(
+  (e, n) => {
+    const t = ae(F, e.__scopeDialog), { forceMount: o = t.forceMount, ...a } = e, r = E(F, e.__scopeDialog);
+    return r.modal ? /* @__PURE__ */ f(W, { present: o || r.open, children: /* @__PURE__ */ f($e, { ...a, ref: n }) }) : null;
+  }
+);
+ie.displayName = F;
+var Ge = be("DialogOverlay.RemoveScroll"), $e = i.forwardRef(
+  (e, n) => {
+    const { __scopeDialog: t, ...o } = e, a = E(F, t);
+    return (
+      // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
+      // ie. when `Overlay` and `Content` are siblings
+      /* @__PURE__ */ f(Ae, { as: Ge, allowPinchZoom: !0, shards: [a.contentRef], children: /* @__PURE__ */ f(
+        N.div,
+        {
+          "data-state": $(a.open),
+          ...o,
+          ref: n,
+          style: { pointerEvents: "auto", ...o.style }
+        }
+      ) })
+    );
+  }
+), R = "DialogContent", ce = i.forwardRef(
+  (e, n) => {
+    const t = ae(R, e.__scopeDialog), { forceMount: o = t.forceMount, ...a } = e, r = E(R, e.__scopeDialog);
+    return /* @__PURE__ */ f(W, { present: o || r.open, children: r.modal ? /* @__PURE__ */ f(He, { ...a, ref: n }) : /* @__PURE__ */ f(je, { ...a, ref: n }) });
+  }
+);
+ce.displayName = R;
+var He = i.forwardRef(
+  (e, n) => {
+    const t = E(R, e.__scopeDialog), o = i.useRef(null), a = S(n, t.contentRef, o);
+    return i.useEffect(() => {
+      const r = o.current;
+      if (r) return We(r);
+    }, []), /* @__PURE__ */ f(
+      ue,
+      {
+        ...e,
+        ref: a,
+        trapFocus: t.open,
+        disableOutsidePointerEvents: !0,
+        onCloseAutoFocus: _(e.onCloseAutoFocus, (r) => {
+          var c;
+          r.preventDefault(), (c = t.triggerRef.current) == null || c.focus();
+        }),
+        onPointerDownOutside: _(e.onPointerDownOutside, (r) => {
+          const c = r.detail.originalEvent, s = c.button === 0 && c.ctrlKey === !0;
+          (c.button === 2 || s) && r.preventDefault();
+        }),
+        onFocusOutside: _(
+          e.onFocusOutside,
+          (r) => r.preventDefault()
+        )
+      }
+    );
+  }
+), je = i.forwardRef(
+  (e, n) => {
+    const t = E(R, e.__scopeDialog), o = i.useRef(!1), a = i.useRef(!1);
+    return /* @__PURE__ */ f(
+      ue,
+      {
+        ...e,
+        ref: n,
+        trapFocus: !1,
+        disableOutsidePointerEvents: !1,
+        onCloseAutoFocus: (r) => {
+          var c, s;
+          (c = e.onCloseAutoFocus) == null || c.call(e, r), r.defaultPrevented || (o.current || (s = t.triggerRef.current) == null || s.focus(), r.preventDefault()), o.current = !1, a.current = !1;
+        },
+        onInteractOutside: (r) => {
+          var g, m;
+          (g = e.onInteractOutside) == null || g.call(e, r), r.defaultPrevented || (o.current = !0, r.detail.originalEvent.type === "pointerdown" && (a.current = !0));
+          const c = r.target;
+          ((m = t.triggerRef.current) == null ? void 0 : m.contains(c)) && r.preventDefault(), r.detail.originalEvent.type === "focusin" && a.current && r.preventDefault();
+        }
+      }
+    );
+  }
+), ue = i.forwardRef(
+  (e, n) => {
+    const { __scopeDialog: t, trapFocus: o, onOpenAutoFocus: a, onCloseAutoFocus: r, ...c } = e, s = E(R, t), g = i.useRef(null), m = S(n, g);
+    return xe(), /* @__PURE__ */ q(B, { children: [
+      /* @__PURE__ */ f(
+        Q,
+        {
+          asChild: !0,
+          loop: !0,
+          trapped: o,
+          onMountAutoFocus: a,
+          onUnmountAutoFocus: r,
+          children: /* @__PURE__ */ f(
+            Re,
+            {
+              role: "dialog",
+              id: s.contentId,
+              "aria-describedby": s.descriptionId,
+              "aria-labelledby": s.titleId,
+              "data-state": $(s.open),
+              ...c,
+              ref: m,
+              onDismiss: () => s.onOpenChange(!1)
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ q(B, { children: [
+        /* @__PURE__ */ f(qe, { titleId: s.titleId }),
+        /* @__PURE__ */ f(Ve, { contentRef: g, descriptionId: s.descriptionId })
+      ] })
+    ] });
+  }
+), G = "DialogTitle", le = i.forwardRef(
+  (e, n) => {
+    const { __scopeDialog: t, ...o } = e, a = E(G, t);
+    return /* @__PURE__ */ f(N.h2, { id: a.titleId, ...o, ref: n });
+  }
+);
+le.displayName = G;
+var fe = "DialogDescription", de = i.forwardRef(
+  (e, n) => {
+    const { __scopeDialog: t, ...o } = e, a = E(fe, t);
+    return /* @__PURE__ */ f(N.p, { id: a.descriptionId, ...o, ref: n });
+  }
+);
+de.displayName = fe;
+var pe = "DialogClose", ve = i.forwardRef(
+  (e, n) => {
+    const { __scopeDialog: t, ...o } = e, a = E(pe, t);
+    return /* @__PURE__ */ f(
+      N.button,
+      {
+        type: "button",
+        ...o,
+        ref: n,
+        onClick: _(e.onClick, () => a.onOpenChange(!1))
+      }
+    );
+  }
+);
+ve.displayName = pe;
+function $(e) {
+  return e ? "open" : "closed";
+}
+var me = "DialogTitleWarning", [nt, ge] = De(me, {
+  contentName: R,
+  titleName: G,
+  docsSlug: "dialog"
+}), qe = ({ titleId: e }) => {
+  const n = ge(me), t = `\`${n.contentName}\` requires a \`${n.titleName}\` for the component to be accessible for screen reader users.
+
+If you want to hide the \`${n.titleName}\`, you can wrap it with our VisuallyHidden component.
+
+For more information, see https://radix-ui.com/primitives/docs/components/${n.docsSlug}`;
+  return i.useEffect(() => {
+    e && (document.getElementById(e) || console.error(t));
+  }, [t, e]), null;
+}, Be = "DialogDescriptionWarning", Ve = ({ contentRef: e, descriptionId: n }) => {
+  const o = `Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${ge(Be).contentName}}.`;
+  return i.useEffect(() => {
+    var r;
+    const a = (r = e.current) == null ? void 0 : r.getAttribute("aria-describedby");
+    n && a && (document.getElementById(n) || console.warn(o));
+  }, [o, e, n]), null;
+}, ot = ne, rt = re, at = se, st = ie, it = ce, ct = le, ut = de, lt = ve;
+export {
+  it as C,
+  le as D,
+  st as O,
+  at as P,
+  ot as R,
+  ct as T,
+  nt as W,
+  se as a,
+  lt as b,
+  tt as c,
+  ut as d,
+  rt as e,
+  M as u
+};

package/dist/{index-D4Q2rMby.js → index-G_6jG4Qc.js}

@@ -1,6 +1,6 @@
 import * as a from "react";
-import { u as T } from "./index-DoOsnuB6.js";
-import { u as A } from "./index-8vgf-x5i.js";
+import { u as T } from "./index-Bk324h27.js";
+import { u as A } from "./index-bYyfdsls.js";
 function E(n, e) {
   return a.useReducer((r, t) => e[r][t] ?? r, n);
 }

package/dist/{index-BedjZUuB.js → index-YaQrdkGE.js}

@@ -1,7 +1,7 @@
 import * as i from "react";
-import { b, d as h, u as U } from "./index-8vgf-x5i.js";
-import { P as m, d as z, R as H } from "./index-BaNV0qac.js";
-import { u as T } from "./index-DoOsnuB6.js";
+import { d as b, b as h, u as U } from "./index-bYyfdsls.js";
+import { P as m, d as z, R as H } from "./index-g-TFwd6Y.js";
+import { u as T } from "./index-Bk324h27.js";
 import { jsx as P } from "react/jsx-runtime";
 function K(r, e = globalThis == null ? void 0 : globalThis.document) {
   const s = b(r);

package/dist/{index-8vgf-x5i.js → index-bYyfdsls.js}

@@ -19,18 +19,18 @@ function y(t, e = []) {
   function s(c, r) {
     const i = u.createContext(r), f = n.length;
     n = [...n, r];
-    const a = (l) => {
+    const a = (d) => {
       var S;
-      const { scope: d, children: h, ...x } = l, m = ((S = d == null ? void 0 : d[t]) == null ? void 0 : S[f]) || i, p = u.useMemo(() => x, Object.values(x));
+      const { scope: l, children: h, ...x } = d, m = ((S = l == null ? void 0 : l[t]) == null ? void 0 : S[f]) || i, p = u.useMemo(() => x, Object.values(x));
       return /* @__PURE__ */ v(m.Provider, { value: p, children: h });
     };
     a.displayName = c + "Provider";
-    function C(l, d) {
+    function C(d, l) {
       var m;
-      const h = ((m = d == null ? void 0 : d[t]) == null ? void 0 : m[f]) || i, x = u.useContext(h);
+      const h = ((m = l == null ? void 0 : l[t]) == null ? void 0 : m[f]) || i, x = u.useContext(h);
       if (x) return x;
       if (r !== void 0) return r;
-      throw new Error(`\`${l}\` must be used within \`${c}\``);
+      throw new Error(`\`${d}\` must be used within \`${c}\``);
     }
     return [a, C];
   }
@@ -56,8 +56,8 @@ function b(...t) {
     }));
     return function(c) {
       const r = s.reduce((i, { useScope: f, scopeName: a }) => {
-        const l = f(c)[`__scope${a}`];
-        return { ...i, ...l };
+        const d = f(c)[`__scope${a}`];
+        return { ...i, ...d };
       }, {});
       return u.useMemo(() => ({ [`__scope${e.scopeName}`]: r }), [r]);
     };
@@ -90,8 +90,8 @@ function j({
   const [s, o] = $({ defaultProp: e, onChange: n }), c = t !== void 0, r = c ? t : s, i = P(n), f = u.useCallback(
     (a) => {
       if (c) {
-        const l = typeof a == "function" ? a(t) : a;
-        l !== t && i(l);
+        const d = typeof a == "function" ? a(t) : a;
+        d !== t && i(d);
       } else
         o(a);
     },
@@ -110,9 +110,9 @@ function $({
 }
 export {
   j as a,
-  P as b,
+  M as b,
   y as c,
-  M as d,
+  P as d,
   _ as e,
   R as u
 };