@konstructio/ui 0.1.2-alpha.11 → 0.1.2-alpha.111

package/dist/DropdownButton-Blhkj-Oi.js

@@ -0,0 +1,490 @@
+import { o as Ae } from "./rolldown-runtime-Dw9YIBcH.js";
+import { t as Le } from "./prop-types-BCUW56rg.js";
+import { a as D, n as Fe } from "./dist-xCbHbMLA.js";
+import { n as Ne, t as se } from "./dist-CCdbu9GU.js";
+import { t as A } from "./utils-DnIJruo0.js";
+import { i as le, r as g, t as Ke } from "./dist-D-yS0HN8.js";
+import { n as ae, t as je } from "./dist-D70ZJkHf.js";
+import { t as Ge } from "./dist-uerXivvM.js";
+import { n as Ue, r as Be, t as $e } from "./es2015-Hhb87ipX.js";
+import { t as Ve } from "./dist-BUocnzkM.js";
+import { t as ze } from "./Combination-CnMM05mt.js";
+import { Button as We } from "./components/Button/Button.js";
+import { a as de, i as Ye, r as Xe, t as He } from "./dist-DcFwF4XM.js";
+import { n as qe, t as Ze } from "./dist-DZ_SU77k.js";
+import { n as Je, r as fe, t as Qe } from "./dist-Bi8Y5nEx.js";
+import * as i from "react";
+import ce, { forwardRef as en } from "react";
+import { jsx as s, jsxs as ie } from "react/jsx-runtime";
+var L = /* @__PURE__ */ Ae(Le());
+function W() {
+  return W = Object.assign || function(t) {
+    for (var e = 1; e < arguments.length; e++) {
+      var o = arguments[e];
+      for (var n in o) Object.prototype.hasOwnProperty.call(o, n) && (t[n] = o[n]);
+    }
+    return t;
+  }, W.apply(this, arguments);
+}
+function nn(t, e) {
+  if (t == null) return {};
+  var o = tn(t, e), n, r;
+  if (Object.getOwnPropertySymbols) {
+    var a = Object.getOwnPropertySymbols(t);
+    for (r = 0; r < a.length; r++)
+      n = a[r], !(e.indexOf(n) >= 0) && Object.prototype.propertyIsEnumerable.call(t, n) && (o[n] = t[n]);
+  }
+  return o;
+}
+function tn(t, e) {
+  if (t == null) return {};
+  for (var o = {}, n = Object.keys(t), r, a = 0; a < n.length; a++)
+    r = n[a], !(e.indexOf(r) >= 0) && (o[r] = t[r]);
+  return o;
+}
+var q = en(function(t, e) {
+  var o = t.color, n = o === void 0 ? "currentColor" : o, r = t.size, a = r === void 0 ? 24 : r, c = nn(t, ["color", "size"]);
+  return /* @__PURE__ */ ce.createElement("svg", W({
+    ref: e,
+    xmlns: "http://www.w3.org/2000/svg",
+    width: a,
+    height: a,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: n,
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, c), /* @__PURE__ */ ce.createElement("polyline", { points: "6 9 12 15 18 9" }));
+});
+q.propTypes = {
+  color: L.default.string,
+  size: L.default.oneOfType([L.default.string, L.default.number])
+};
+q.displayName = "ChevronDown";
+var on = Object.defineProperty, p = (t, e) => on(t, "name", {
+  value: e,
+  configurable: !0
+}), Y = ["Enter", " "], rn = [
+  "ArrowDown",
+  "PageUp",
+  "Home"
+], pe = [
+  "ArrowUp",
+  "PageDown",
+  "End"
+], an = [...rn, ...pe], at = {
+  ltr: [...Y, "ArrowRight"],
+  rtl: [...Y, "ArrowLeft"]
+}, N = "Menu", [X, cn, un] = qe(N), [S, me] = le(N, [
+  un,
+  de,
+  fe
+]), Z = de(), ve = fe(), [sn, K] = S(N), [ln, J] = S(N), dn = /* @__PURE__ */ p((t) => {
+  const { __scopeMenu: e, open: o = !1, children: n, dir: r, onOpenChange: a, modal: c = !0 } = t, l = Z(e), [h, d] = i.useState(null), m = i.useRef(!1), v = je(a), f = Ze(r);
+  return i.useEffect(() => {
+    const w = /* @__PURE__ */ p(() => {
+      m.current = !0, document.addEventListener("pointerdown", C, {
+        capture: !0,
+        once: !0
+      }), document.addEventListener("pointermove", C, {
+        capture: !0,
+        once: !0
+      });
+    }, "handleKeyDown"), C = /* @__PURE__ */ p(() => m.current = !1, "handlePointer");
+    return document.addEventListener("keydown", w, { capture: !0 }), () => {
+      document.removeEventListener("keydown", w, { capture: !0 }), document.removeEventListener("pointerdown", C, { capture: !0 }), document.removeEventListener("pointermove", C, { capture: !0 });
+    };
+  }, []), i.useEffect(() => {
+    if (!o) return;
+    const w = /* @__PURE__ */ p(() => v(!1), "handleBlur");
+    return window.addEventListener("blur", w), () => window.removeEventListener("blur", w);
+  }, [o, v]), /* @__PURE__ */ s(Ye, {
+    ...l,
+    children: /* @__PURE__ */ s(sn, {
+      scope: e,
+      open: o,
+      onOpenChange: v,
+      content: h,
+      onContentChange: d,
+      children: /* @__PURE__ */ s(ln, {
+        scope: e,
+        onClose: i.useCallback(() => v(!1), [v]),
+        isUsingKeyboardRef: m,
+        dir: f,
+        modal: c,
+        children: n
+      })
+    })
+  });
+}, "Menu"), fn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const { __scopeMenu: n, ...r } = e, a = Z(n);
+  return /* @__PURE__ */ s(He, {
+    ...a,
+    ...r,
+    ref: o
+  });
+}, "MenuAnchor")), pn = "MenuPortal", [ct, mn] = S(pn, { forceMount: void 0 }), I = "MenuContent", [vn, he] = S(I), hn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const n = mn(I, e.__scopeMenu), { forceMount: r = n.forceMount, ...a } = e, c = K(I, e.__scopeMenu), l = J(I, e.__scopeMenu);
+  return /* @__PURE__ */ s(X.Provider, {
+    scope: e.__scopeMenu,
+    children: /* @__PURE__ */ s(Ve, {
+      present: r || c.open,
+      children: /* @__PURE__ */ s(X.Slot, {
+        scope: e.__scopeMenu,
+        children: l.modal ? /* @__PURE__ */ s(gn, {
+          ...a,
+          ref: o
+        }) : /* @__PURE__ */ s(wn, {
+          ...a,
+          ref: o
+        })
+      })
+    })
+  });
+}, "MenuContent")), gn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const n = K(I, e.__scopeMenu), r = i.useRef(null), a = D(o, r);
+  return i.useEffect(() => {
+    const c = r.current;
+    if (c) return $e(c);
+  }, []), /* @__PURE__ */ s(ge, {
+    ...e,
+    ref: a,
+    trapFocus: n.open,
+    disableOutsidePointerEvents: n.open,
+    disableOutsideScroll: !0,
+    onFocusOutside: g(e.onFocusOutside, (c) => c.preventDefault(), { checkForDefaultPrevented: !1 }),
+    onDismiss: () => n.onOpenChange(!1)
+  });
+}, "MenuRootContentModal")), wn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const n = K(I, e.__scopeMenu);
+  return /* @__PURE__ */ s(ge, {
+    ...e,
+    ref: o,
+    trapFocus: !1,
+    disableOutsidePointerEvents: !1,
+    disableOutsideScroll: !1,
+    onDismiss: () => n.onOpenChange(!1)
+  });
+}, "MenuRootContentNonModal")), Mn = Fe("MenuContent.ScrollLock"), ge = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const { __scopeMenu: n, loop: r = !1, trapFocus: a, onOpenAutoFocus: c, onCloseAutoFocus: l, disableOutsidePointerEvents: h, onEntryFocus: d, onEscapeKeyDown: m, onPointerDownOutside: v, onFocusOutside: f, onInteractOutside: w, onDismiss: C, disableOutsideScroll: M, ...U } = e, ee = K(I, n), B = J(I, n), be = Z(n), _e = ve(n), ne = cn(n), [Ee, te] = i.useState(null), x = i.useRef(null), De = D(o, x, ee.onContentChange), O = i.useRef(0), T = i.useRef(""), xe = i.useRef(0), $ = i.useRef(null), oe = i.useRef("right"), V = i.useRef(0), Oe = M ? ze : i.Fragment, Te = M ? {
+    as: Mn,
+    allowPinchZoom: !0
+  } : void 0, ke = /* @__PURE__ */ p((u) => {
+    const b = T.current + u, y = ne().filter((R) => !R.disabled), E = document.activeElement, z = y.find((R) => R.ref.current === E)?.textValue, k = Ie(y.map((R) => R.textValue), b, z), _ = y.find((R) => R.textValue === k)?.ref.current;
+    (/* @__PURE__ */ p((function R(re) {
+      T.current = re, window.clearTimeout(O.current), re !== "" && (O.current = window.setTimeout(() => R(""), 1e3));
+    }), "updateSearch"))(b), _ && setTimeout(() => _.focus());
+  }, "handleTypeaheadSearch");
+  i.useEffect(() => () => window.clearTimeout(O.current), []), Ue();
+  const P = i.useCallback((u) => oe.current === $.current?.side && Se(u, $.current?.area), []);
+  return /* @__PURE__ */ s(vn, {
+    scope: n,
+    searchRef: T,
+    onItemEnter: i.useCallback((u) => {
+      P(u) && u.preventDefault();
+    }, [P]),
+    onItemLeave: i.useCallback((u) => {
+      P(u) || (x.current?.focus(), te(null));
+    }, [P]),
+    onTriggerLeave: i.useCallback((u) => {
+      P(u) && u.preventDefault();
+    }, [P]),
+    pointerGraceTimerRef: xe,
+    onPointerGraceIntentChange: i.useCallback((u) => {
+      $.current = u;
+    }, []),
+    children: /* @__PURE__ */ s(Oe, {
+      ...Te,
+      children: /* @__PURE__ */ s(Be, {
+        asChild: !0,
+        trapped: a,
+        onMountAutoFocus: g(c, (u) => {
+          u.preventDefault(), x.current?.focus({ preventScroll: !0 });
+        }),
+        onUnmountAutoFocus: l,
+        children: /* @__PURE__ */ s(Ge, {
+          asChild: !0,
+          disableOutsidePointerEvents: h,
+          onEscapeKeyDown: m,
+          onPointerDownOutside: v,
+          onFocusOutside: f,
+          onInteractOutside: w,
+          onDismiss: C,
+          children: /* @__PURE__ */ s(Je, {
+            asChild: !0,
+            ..._e,
+            dir: B.dir,
+            orientation: "vertical",
+            loop: r,
+            currentTabStopId: Ee,
+            onCurrentTabStopIdChange: te,
+            onEntryFocus: g(d, (u) => {
+              B.isUsingKeyboardRef.current || u.preventDefault();
+            }),
+            preventScrollOnEntryFocus: !0,
+            children: /* @__PURE__ */ s(Xe, {
+              role: "menu",
+              "aria-orientation": "vertical",
+              "data-state": we(ee.open),
+              "data-radix-menu-content": "",
+              dir: B.dir,
+              ...be,
+              ...U,
+              ref: De,
+              style: {
+                outline: "none",
+                ...U.style
+              },
+              onKeyDown: g(U.onKeyDown, (u) => {
+                const b = u.target.closest("[data-radix-menu-content]") === u.currentTarget, y = u.ctrlKey || u.altKey || u.metaKey, E = u.key.length === 1;
+                b && (u.key === "Tab" && u.preventDefault(), !y && E && ke(u.key));
+                const z = x.current;
+                if (u.target !== z || !an.includes(u.key)) return;
+                u.preventDefault();
+                const k = ne().filter((_) => !_.disabled).map((_) => _.ref.current);
+                pe.includes(u.key) && k.reverse(), Ce(k);
+              }),
+              onBlur: g(e.onBlur, (u) => {
+                u.currentTarget.contains(u.target) || (window.clearTimeout(O.current), T.current = "");
+              }),
+              onPointerMove: g(e.onPointerMove, F((u) => {
+                const b = u.target, y = V.current !== u.clientX;
+                if (u.currentTarget.contains(b) && y) {
+                  const E = u.clientX > V.current ? "right" : "left";
+                  oe.current = E, V.current = u.clientX;
+                }
+              }))
+            })
+          })
+        })
+      })
+    })
+  });
+}, "MenuContentImpl")), H = "MenuItem", ue = "menu.itemSelect", Cn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const { disabled: n = !1, onSelect: r, ...a } = e, c = i.useRef(null), l = J(H, e.__scopeMenu), h = he(H, e.__scopeMenu), d = D(o, c), m = i.useRef(!1), v = /* @__PURE__ */ p(() => {
+    const f = c.current;
+    if (!n && f) {
+      const w = new CustomEvent(ue, {
+        bubbles: !0,
+        cancelable: !0
+      });
+      f.addEventListener(ue, (C) => r?.(C), { once: !0 }), Ne(f, w), w.defaultPrevented ? m.current = !1 : l.onClose();
+    }
+  }, "handleSelect");
+  return /* @__PURE__ */ s(Rn, {
+    ...a,
+    ref: d,
+    disabled: n,
+    onClick: g(e.onClick, v),
+    onPointerDown: (f) => {
+      e.onPointerDown?.(f), m.current = !0;
+    },
+    onPointerUp: g(e.onPointerUp, (f) => {
+      m.current || f.currentTarget?.click();
+    }),
+    onKeyDown: g(e.onKeyDown, (f) => {
+      n || f.target !== f.currentTarget || h.searchRef.current !== "" && f.key === " " || Y.includes(f.key) && (f.currentTarget.click(), f.preventDefault());
+    })
+  });
+}, "MenuItem")), Rn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ p(function(e, o) {
+  const { __scopeMenu: n, disabled: r = !1, textValue: a, ...c } = e, l = he(H, n), h = ve(n), d = i.useRef(null), m = D(o, d), [v, f] = i.useState(!1), [w, C] = i.useState("");
+  return i.useEffect(() => {
+    const M = d.current;
+    M && C((M.textContent ?? "").trim());
+  }, [c.children]), /* @__PURE__ */ s(X.ItemSlot, {
+    scope: n,
+    disabled: r,
+    textValue: a ?? w,
+    children: /* @__PURE__ */ s(Qe, {
+      asChild: !0,
+      ...h,
+      focusable: !r,
+      children: /* @__PURE__ */ s(se.div, {
+        role: "menuitem",
+        "data-highlighted": v ? "" : void 0,
+        "aria-disabled": r || void 0,
+        "data-disabled": r ? "" : void 0,
+        ...c,
+        ref: m,
+        onPointerMove: g(e.onPointerMove, F((M) => {
+          r ? l.onItemLeave(M) : (l.onItemEnter(M), M.defaultPrevented || M.currentTarget.focus({ preventScroll: !0 }));
+        })),
+        onPointerLeave: g(e.onPointerLeave, F((M) => l.onItemLeave(M))),
+        onFocus: g(e.onFocus, () => f(!0)),
+        onBlur: g(e.onBlur, () => f(!1))
+      })
+    })
+  });
+}, "MenuItemImpl")), [it, ut] = S("MenuRadioGroup", {
+  value: void 0,
+  onValueChange: /* @__PURE__ */ p(() => {
+  }, "onValueChange")
+}), In = "MenuItemIndicator", [st, lt] = S(In, { checked: !1 }), yn = "MenuSub", [dt, ft] = S(yn);
+function we(t) {
+  return t ? "open" : "closed";
+}
+p(we, "getOpenState");
+function Me(t) {
+  return t === "indeterminate";
+}
+p(Me, "isIndeterminate");
+function Sn(t) {
+  return Me(t) ? "indeterminate" : t ? "checked" : "unchecked";
+}
+p(Sn, "getCheckedState");
+function Ce(t) {
+  const e = document.activeElement;
+  for (const o of t)
+    if (o === e || (o.focus(), document.activeElement !== e)) return;
+}
+p(Ce, "focusFirst");
+function Re(t, e) {
+  return t.map((o, n) => t[(e + n) % t.length]);
+}
+p(Re, "wrapArray");
+function Ie(t, e, o) {
+  const n = e.length > 1 && Array.from(e).every((l) => l === e[0]) ? e[0] : e, r = o ? t.indexOf(o) : -1;
+  let a = Re(t, Math.max(r, 0));
+  n.length === 1 && (a = a.filter((l) => l !== o));
+  const c = a.find((l) => l.toLowerCase().startsWith(n.toLowerCase()));
+  return c !== o ? c : void 0;
+}
+p(Ie, "getNextMatch");
+function ye(t, e) {
+  const { x: o, y: n } = t;
+  let r = !1;
+  for (let a = 0, c = e.length - 1; a < e.length; c = a++) {
+    const l = e[a], h = e[c], d = l.x, m = l.y, v = h.x, f = h.y;
+    m > n != f > n && o < (v - d) * (n - m) / (f - m) + d && (r = !r);
+  }
+  return r;
+}
+p(ye, "isPointInPolygon");
+function Se(t, e) {
+  return e ? ye({
+    x: t.clientX,
+    y: t.clientY
+  }, e) : !1;
+}
+p(Se, "isPointerInGraceArea");
+function F(t) {
+  return (e) => e.pointerType === "mouse" ? t(e) : void 0;
+}
+p(F, "whenMouse");
+var Pn = dn, bn = fn, _n = hn, En = Cn, Dn = Object.defineProperty, j = (t, e) => Dn(t, "name", {
+  value: e,
+  configurable: !0
+}), Q = "DropdownMenu", [xn, pt] = le(Q, [me]), G = me(), [On, Pe] = xn(Q), Tn = /* @__PURE__ */ j((t) => {
+  const { __scopeDropdownMenu: e, children: o, dir: n, open: r, defaultOpen: a, onOpenChange: c, modal: l = !0 } = t, h = G(e), d = i.useRef(null), [m, v] = Ke({
+    prop: r,
+    defaultProp: a ?? !1,
+    onChange: c,
+    caller: Q
+  });
+  return /* @__PURE__ */ s(On, {
+    scope: e,
+    triggerId: ae(),
+    triggerRef: d,
+    contentId: ae(),
+    open: m,
+    onOpenChange: v,
+    onOpenToggle: i.useCallback(() => v((f) => !f), [v]),
+    modal: l,
+    children: /* @__PURE__ */ s(Pn, {
+      ...h,
+      open: m,
+      onOpenChange: v,
+      dir: n,
+      modal: l,
+      children: o
+    })
+  });
+}, "DropdownMenu"), kn = "DropdownMenuTrigger", An = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ j(function(e, o) {
+  const { __scopeDropdownMenu: n, disabled: r = !1, ...a } = e, c = Pe(kn, n), l = G(n), h = D(o, c.triggerRef);
+  return /* @__PURE__ */ s(bn, {
+    asChild: !0,
+    ...l,
+    children: /* @__PURE__ */ s(se.button, {
+      type: "button",
+      id: c.triggerId,
+      "aria-haspopup": "menu",
+      "aria-expanded": c.open,
+      "aria-controls": c.open ? c.contentId : void 0,
+      "data-state": c.open ? "open" : "closed",
+      "data-disabled": r ? "" : void 0,
+      disabled: r,
+      ...a,
+      ref: h,
+      onPointerDown: g(e.onPointerDown, (d) => {
+        !r && d.button === 0 && d.ctrlKey === !1 && (c.onOpenToggle(), c.open || d.preventDefault());
+      }),
+      onKeyDown: g(e.onKeyDown, (d) => {
+        r || (["Enter", " "].includes(d.key) && c.onOpenToggle(), d.key === "ArrowDown" && c.onOpenChange(!0), [
+          "Enter",
+          " ",
+          "ArrowDown"
+        ].includes(d.key) && d.preventDefault());
+      })
+    })
+  });
+}, "DropdownMenuTrigger")), Ln = "DropdownMenuContent", Fn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ j(function(e, o) {
+  const { __scopeDropdownMenu: n, ...r } = e, a = Pe(Ln, n), c = G(n), l = i.useRef(!1);
+  return /* @__PURE__ */ s(_n, {
+    id: a.contentId,
+    "aria-labelledby": a.triggerId,
+    ...c,
+    ...r,
+    ref: o,
+    onCloseAutoFocus: g(e.onCloseAutoFocus, (h) => {
+      l.current || a.triggerRef.current?.focus(), l.current = !1, h.preventDefault();
+    }),
+    onInteractOutside: g(e.onInteractOutside, (h) => {
+      const d = h.detail.originalEvent, m = d.button === 0 && d.ctrlKey === !0, v = d.button === 2 || m;
+      (!a.modal || v) && (l.current = !0);
+    }),
+    style: {
+      ...e.style,
+      "--radix-dropdown-menu-content-transform-origin": "var(--radix-popper-transform-origin)",
+      "--radix-dropdown-menu-content-available-width": "var(--radix-popper-available-width)",
+      "--radix-dropdown-menu-content-available-height": "var(--radix-popper-available-height)",
+      "--radix-dropdown-menu-trigger-width": "var(--radix-popper-anchor-width)",
+      "--radix-dropdown-menu-trigger-height": "var(--radix-popper-anchor-height)"
+    }
+  });
+}, "DropdownMenuContent")), Nn = /* @__PURE__ */ i.forwardRef(/* @__PURE__ */ j(function(e, o) {
+  const { __scopeDropdownMenu: n, ...r } = e, a = G(n);
+  return /* @__PURE__ */ s(En, {
+    ...a,
+    ...r,
+    ref: o
+  });
+}, "DropdownMenuItem")), Kn = Tn, jn = An, Gn = Fn, Un = Nn, mt = ({ buttonClassName: t, className: e, itemClassName: o, label: n = "Download Invoice as", listClassName: r, options: a }) => /* @__PURE__ */ s(Kn, {
+  modal: !1,
+  children: /* @__PURE__ */ ie("div", {
+    className: A("relative w-full", e),
+    children: [/* @__PURE__ */ s(jn, {
+      asChild: !0,
+      children: /* @__PURE__ */ ie(We, {
+        className: A("group flex gap-2 items-center justify-between w-full", t),
+        children: [n, /* @__PURE__ */ s(q, { className: "transition-transform duration-200 group-data-[state=open]:rotate-180" })]
+      })
+    }), /* @__PURE__ */ s(Gn, {
+      align: "start",
+      sideOffset: 4,
+      loop: !0,
+      className: A("z-10 bg-white border border-gray-200 rounded shadow-xs animate-in fade-in-0 py-2", r),
+      style: { width: "var(--radix-dropdown-menu-trigger-width)" },
+      children: a.map((c, l) => /* @__PURE__ */ s(Un, {
+        className: A("hover:bg-gray-50 focus:bg-gray-50 outline-none px-6 py-1.5 hover:cursor-pointer", o),
+        onSelect: () => {
+          c.onClick?.();
+        },
+        children: c.label
+      }, l))
+    })]
+  })
+});
+export {
+  mt as t
+};