@clasing/ui 0.1.123 → 0.1.125

package/dist/components/input-otp.es.js

@@ -0,0 +1,253 @@
+import { j as I } from "../jsx-runtime-C5mzlN2N.js";
+import * as t from "react";
+import { c as K } from "../index-CRiPKpXj.js";
+import { I as Te } from "../icon-component-BZ-4FDV6.js";
+var Re = Object.defineProperty, Oe = Object.defineProperties, De = Object.getOwnPropertyDescriptors, Q = Object.getOwnPropertySymbols, ve = Object.prototype.hasOwnProperty, ge = Object.prototype.propertyIsEnumerable, fe = (n, a, l) => a in n ? Re(n, a, { enumerable: !0, configurable: !0, writable: !0, value: l }) : n[a] = l, Ie = (n, a) => {
+  for (var l in a || (a = {})) ve.call(a, l) && fe(n, l, a[l]);
+  if (Q) for (var l of Q(a)) ge.call(a, l) && fe(n, l, a[l]);
+  return n;
+}, Ae = (n, a) => Oe(n, De(a)), We = (n, a) => {
+  var l = {};
+  for (var u in n) ve.call(n, u) && a.indexOf(u) < 0 && (l[u] = n[u]);
+  if (n != null && Q) for (var u of Q(n)) a.indexOf(u) < 0 && ge.call(n, u) && (l[u] = n[u]);
+  return l;
+};
+function Be(n) {
+  let a = setTimeout(n, 0), l = setTimeout(n, 10), u = setTimeout(n, 50);
+  return [a, l, u];
+}
+function _e(n) {
+  let a = t.useRef();
+  return t.useEffect(() => {
+    a.current = n;
+  }), a.current;
+}
+var Fe = 18, he = 40, Ne = `${he}px`, He = ["[data-lastpass-icon-root]", "com-1password-button", "[data-dashlanecreated]", '[style$="2147483647 !important;"]'].join(",");
+function Le({ containerRef: n, inputRef: a, pushPasswordManagerStrategy: l, isFocused: u }) {
+  let [x, d] = t.useState(!1), [M, k] = t.useState(!1), [A, N] = t.useState(!1), H = t.useMemo(() => l === "none" ? !1 : (l === "increase-width" || l === "experimental-no-flickering") && x && M, [x, M, l]), W = t.useCallback(() => {
+    let f = n.current, y = a.current;
+    if (!f || !y || A || l === "none") return;
+    let h = f, E = h.getBoundingClientRect().left + h.offsetWidth, B = h.getBoundingClientRect().top + h.offsetHeight / 2, i = E - Fe, L = B;
+    document.querySelectorAll(He).length === 0 && document.elementFromPoint(i, L) === f || (d(!0), N(!0));
+  }, [n, a, A, l]);
+  return t.useEffect(() => {
+    let f = n.current;
+    if (!f || l === "none") return;
+    function y() {
+      let E = window.innerWidth - f.getBoundingClientRect().right;
+      k(E >= he);
+    }
+    y();
+    let h = setInterval(y, 1e3);
+    return () => {
+      clearInterval(h);
+    };
+  }, [n, l]), t.useEffect(() => {
+    let f = u || document.activeElement === a.current;
+    if (l === "none" || !f) return;
+    let y = setTimeout(W, 0), h = setTimeout(W, 2e3), E = setTimeout(W, 5e3), B = setTimeout(() => {
+      N(!0);
+    }, 6e3);
+    return () => {
+      clearTimeout(y), clearTimeout(h), clearTimeout(E), clearTimeout(B);
+    };
+  }, [a, u, l, W]), { hasPWMBadge: x, willPushPWMBadge: H, PWM_BADGE_SPACE_WIDTH: Ne };
+}
+var be = t.createContext({}), we = t.forwardRef((n, a) => {
+  var l = n, { value: u, onChange: x, maxLength: d, textAlign: M = "left", pattern: k, placeholder: A, inputMode: N = "numeric", onComplete: H, pushPasswordManagerStrategy: W = "increase-width", pasteTransformer: f, containerClassName: y, noScriptCSSFallback: h = Ge, render: E, children: B } = l, i = We(l, ["value", "onChange", "maxLength", "textAlign", "pattern", "placeholder", "inputMode", "onComplete", "pushPasswordManagerStrategy", "pasteTransformer", "containerClassName", "noScriptCSSFallback", "render", "children"]), L, ne, re, ae, le;
+  let [xe, Ee] = t.useState(typeof i.defaultValue == "string" ? i.defaultValue : ""), s = u ?? xe, j = _e(s), G = t.useCallback((e) => {
+    x?.(e), Ee(e);
+  }, [x]), w = t.useMemo(() => k ? typeof k == "string" ? new RegExp(k) : k : null, [k]), c = t.useRef(null), U = t.useRef(null), X = t.useRef({ value: s, onChange: G, isIOS: typeof window < "u" && ((ne = (L = window?.CSS) == null ? void 0 : L.supports) == null ? void 0 : ne.call(L, "-webkit-touch-callout", "none")) }), Z = t.useRef({ prev: [(re = c.current) == null ? void 0 : re.selectionStart, (ae = c.current) == null ? void 0 : ae.selectionEnd, (le = c.current) == null ? void 0 : le.selectionDirection] });
+  t.useImperativeHandle(a, () => c.current, []), t.useEffect(() => {
+    let e = c.current, r = U.current;
+    if (!e || !r) return;
+    X.current.value !== e.value && X.current.onChange(e.value), Z.current.prev = [e.selectionStart, e.selectionEnd, e.selectionDirection];
+    function p() {
+      if (document.activeElement !== e) {
+        z(null), V(null);
+        return;
+      }
+      let o = e.selectionStart, m = e.selectionEnd, J = e.selectionDirection, b = e.maxLength, R = e.value, S = Z.current.prev, C = -1, P = -1, O;
+      if (R.length !== 0 && o !== null && m !== null) {
+        let Me = o === m, ke = o === R.length && R.length < b;
+        if (Me && !ke) {
+          let D = o;
+          if (D === 0) C = 0, P = 1, O = "forward";
+          else if (D === b) C = D - 1, P = D, O = "backward";
+          else if (b > 1 && R.length > 1) {
+            let te = 0;
+            if (S[0] !== null && S[1] !== null) {
+              O = D < S[1] ? "backward" : "forward";
+              let je = S[0] === S[1] && S[0] < b;
+              O === "backward" && !je && (te = -1);
+            }
+            C = te + D, P = te + D + 1;
+          }
+        }
+        C !== -1 && P !== -1 && C !== P && c.current.setSelectionRange(C, P, O);
+      }
+      let pe = C !== -1 ? C : o, me = P !== -1 ? P : m, Pe = O ?? J;
+      z(pe), V(me), Z.current.prev = [pe, me, Pe];
+    }
+    if (document.addEventListener("selectionchange", p, { capture: !0 }), p(), document.activeElement === e && Y(!0), !document.getElementById("input-otp-style")) {
+      let o = document.createElement("style");
+      if (o.id = "input-otp-style", document.head.appendChild(o), o.sheet) {
+        let m = "background: transparent !important; color: transparent !important; border-color: transparent !important; opacity: 0 !important; box-shadow: none !important; -webkit-box-shadow: none !important; -webkit-text-fill-color: transparent !important;";
+        q(o.sheet, "[data-input-otp]::selection { background: transparent !important; color: transparent !important; }"), q(o.sheet, `[data-input-otp]:autofill { ${m} }`), q(o.sheet, `[data-input-otp]:-webkit-autofill { ${m} }`), q(o.sheet, "@supports (-webkit-touch-callout: none) { [data-input-otp] { letter-spacing: -.6em !important; font-weight: 100 !important; font-stretch: ultra-condensed; font-optical-sizing: none !important; left: -1px !important; right: 1px !important; } }"), q(o.sheet, "[data-input-otp] + * { pointer-events: all !important; }");
+      }
+    }
+    let v = () => {
+      r && r.style.setProperty("--root-height", `${e.clientHeight}px`);
+    };
+    v();
+    let g = new ResizeObserver(v);
+    return g.observe(e), () => {
+      document.removeEventListener("selectionchange", p, { capture: !0 }), g.disconnect();
+    };
+  }, []);
+  let [oe, ie] = t.useState(!1), [$, Y] = t.useState(!1), [T, z] = t.useState(null), [_, V] = t.useState(null);
+  t.useEffect(() => {
+    Be(() => {
+      var e, r, p, v;
+      (e = c.current) == null || e.dispatchEvent(new Event("input"));
+      let g = (r = c.current) == null ? void 0 : r.selectionStart, o = (p = c.current) == null ? void 0 : p.selectionEnd, m = (v = c.current) == null ? void 0 : v.selectionDirection;
+      g !== null && o !== null && (z(g), V(o), Z.current.prev = [g, o, m]);
+    });
+  }, [s, $]), t.useEffect(() => {
+    j !== void 0 && s !== j && j.length < d && s.length === d && H?.(s);
+  }, [d, H, j, s]);
+  let F = Le({ containerRef: U, inputRef: c, pushPasswordManagerStrategy: W, isFocused: $ }), ue = t.useCallback((e) => {
+    let r = e.currentTarget.value.slice(0, d);
+    if (r.length > 0 && w && !w.test(r)) {
+      e.preventDefault();
+      return;
+    }
+    typeof j == "string" && r.length < j.length && document.dispatchEvent(new Event("selectionchange")), G(r);
+  }, [d, G, j, w]), se = t.useCallback(() => {
+    var e;
+    if (c.current) {
+      let r = Math.min(c.current.value.length, d - 1), p = c.current.value.length;
+      (e = c.current) == null || e.setSelectionRange(r, p), z(r), V(p);
+    }
+    Y(!0);
+  }, [d]), ce = t.useCallback((e) => {
+    var r, p;
+    let v = c.current;
+    if (!f && (!X.current.isIOS || !e.clipboardData || !v)) return;
+    let g = e.clipboardData.getData("text/plain"), o = f ? f(g) : g;
+    e.preventDefault();
+    let m = (r = c.current) == null ? void 0 : r.selectionStart, J = (p = c.current) == null ? void 0 : p.selectionEnd, b = (m !== J ? s.slice(0, m) + o + s.slice(J) : s.slice(0, m) + o + s.slice(m)).slice(0, d);
+    if (b.length > 0 && w && !w.test(b)) return;
+    v.value = b, G(b);
+    let R = Math.min(b.length, d - 1), S = b.length;
+    v.setSelectionRange(R, S), z(R), V(S);
+  }, [d, G, w, s]), Se = t.useMemo(() => ({ position: "relative", cursor: i.disabled ? "default" : "text", userSelect: "none", WebkitUserSelect: "none", pointerEvents: "none" }), [i.disabled]), de = t.useMemo(() => ({ position: "absolute", inset: 0, width: F.willPushPWMBadge ? `calc(100% + ${F.PWM_BADGE_SPACE_WIDTH})` : "100%", clipPath: F.willPushPWMBadge ? `inset(0 ${F.PWM_BADGE_SPACE_WIDTH} 0 0)` : void 0, height: "100%", display: "flex", textAlign: M, opacity: "1", color: "transparent", pointerEvents: "all", background: "transparent", caretColor: "transparent", border: "0 solid transparent", outline: "0 solid transparent", boxShadow: "none", lineHeight: "1", letterSpacing: "-.5em", fontSize: "var(--root-height)", fontFamily: "monospace", fontVariantNumeric: "tabular-nums" }), [F.PWM_BADGE_SPACE_WIDTH, F.willPushPWMBadge, M]), ye = t.useMemo(() => t.createElement("input", Ae(Ie({ autoComplete: i.autoComplete || "one-time-code" }, i), { "data-input-otp": !0, "data-input-otp-placeholder-shown": s.length === 0 || void 0, "data-input-otp-mss": T, "data-input-otp-mse": _, inputMode: N, pattern: w?.source, "aria-placeholder": A, style: de, maxLength: d, value: s, ref: c, onPaste: (e) => {
+    var r;
+    ce(e), (r = i.onPaste) == null || r.call(i, e);
+  }, onChange: ue, onMouseOver: (e) => {
+    var r;
+    ie(!0), (r = i.onMouseOver) == null || r.call(i, e);
+  }, onMouseLeave: (e) => {
+    var r;
+    ie(!1), (r = i.onMouseLeave) == null || r.call(i, e);
+  }, onFocus: (e) => {
+    var r;
+    se(), (r = i.onFocus) == null || r.call(i, e);
+  }, onBlur: (e) => {
+    var r;
+    Y(!1), (r = i.onBlur) == null || r.call(i, e);
+  } })), [ue, se, ce, N, de, d, _, T, i, w?.source, s]), ee = t.useMemo(() => ({ slots: Array.from({ length: d }).map((e, r) => {
+    var p;
+    let v = $ && T !== null && _ !== null && (T === _ && r === T || r >= T && r < _), g = s[r] !== void 0 ? s[r] : null, o = s[0] !== void 0 ? null : (p = A?.[r]) != null ? p : null;
+    return { char: g, placeholderChar: o, isActive: v, hasFakeCaret: v && g === null };
+  }), isFocused: $, isHovering: !i.disabled && oe }), [$, oe, d, _, T, i.disabled, s]), Ce = t.useMemo(() => E ? E(ee) : t.createElement(be.Provider, { value: ee }, B), [B, ee, E]);
+  return t.createElement(t.Fragment, null, h !== null && t.createElement("noscript", null, t.createElement("style", null, h)), t.createElement("div", { ref: U, "data-input-otp-container": !0, style: Se, className: y }, Ce, t.createElement("div", { style: { position: "absolute", inset: 0, pointerEvents: "none" } }, ye)));
+});
+we.displayName = "Input";
+function q(n, a) {
+  try {
+    n.insertRule(a);
+  } catch {
+    console.error("input-otp could not insert CSS rule:", a);
+  }
+}
+var Ge = `
+[data-input-otp] {
+  --nojs-bg: white !important;
+  --nojs-fg: black !important;
+
+  background-color: var(--nojs-bg) !important;
+  color: var(--nojs-fg) !important;
+  caret-color: var(--nojs-fg) !important;
+  letter-spacing: .25em !important;
+  text-align: center !important;
+  border: 1px solid var(--nojs-fg) !important;
+  border-radius: 4px !important;
+  width: 100% !important;
+}
+@media (prefers-color-scheme: dark) {
+  [data-input-otp] {
+    --nojs-bg: black !important;
+    --nojs-fg: white !important;
+  }
+}`;
+function qe({
+  className: n,
+  containerClassName: a,
+  ...l
+}) {
+  return /* @__PURE__ */ I.jsx(
+    we,
+    {
+      "data-slot": "input-otp",
+      containerClassName: K(
+        "flex items-center gap-2 has-disabled:opacity-50",
+        a
+      ),
+      className: K("disabled:cursor-not-allowed", n),
+      ...l
+    }
+  );
+}
+function Ze({ className: n, ...a }) {
+  return /* @__PURE__ */ I.jsx(
+    "div",
+    {
+      "data-slot": "input-otp-group",
+      className: K("flex items-center", n),
+      ...a
+    }
+  );
+}
+function Je({
+  index: n,
+  className: a,
+  ...l
+}) {
+  const u = t.useContext(be), { char: x, hasFakeCaret: d, isActive: M } = u?.slots[n] ?? {};
+  return /* @__PURE__ */ I.jsxs(
+    "div",
+    {
+      "data-slot": "input-otp-slot",
+      "data-active": M,
+      className: K(
+        "data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 border-input relative flex h-9 w-9 items-center justify-center border-y border-r text-sm transition-all outline-none first:rounded-l-md first:border-l last:rounded-r-md data-[active=true]:z-10 data-[active=true]:ring-[3px]",
+        a
+      ),
+      ...l,
+      children: [
+        x,
+        d && /* @__PURE__ */ I.jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ I.jsx("div", { className: "animate-caret-blink bg-foreground h-4 w-px duration-1000" }) })
+      ]
+    }
+  );
+}
+function Ke({ ...n }) {
+  return /* @__PURE__ */ I.jsx("div", { "data-slot": "input-otp-separator", role: "separator", ...n, children: /* @__PURE__ */ I.jsx(Te, { iconName: "IconMinus" }) });
+}
+export {
+  qe as InputOTP,
+  Ze as InputOTPGroup,
+  Ke as InputOTPSeparator,
+  Je as InputOTPSlot
+};

package/dist/components/input.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../input-DFPJ_mtM.cjs");exports.Input=t.Input;

package/dist/components/input.d.ts

@@ -0,0 +1,32 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import { TablerIconName } from './icon-component';
+declare const inputStyles: (props?: ({
+    size?: "lg" | "md" | "sm" | null | undefined;
+    rounded?: "default" | "full" | null | undefined;
+    state?: "default" | "error" | "success" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface InputProps extends VariantProps<typeof inputStyles> {
+    /** Label text shown above the input */
+    label?: string;
+    /** Helper text shown below the input */
+    helperText?: string;
+    /** Error message shown below the input */
+    error?: string;
+    /** Whether the input has been touched/blurred */
+    touched?: boolean;
+    /** Icon to display on the left side of the input */
+    iconLeft?: TablerIconName | {
+        name: TablerIconName;
+        stroke?: string;
+    };
+    /** Icon to display on the right side of the input */
+    iconRight?: TablerIconName | {
+        name: TablerIconName;
+        stroke?: string;
+    };
+    /** Container className for the entire input component including label and helper text */
+    containerClassName?: string;
+}
+declare function Input({ className, label, helperText, error, touched, iconLeft, iconRight, type, size, rounded, state, containerClassName, ...props }: Omit<React.ComponentProps<'input'>, 'size'> & InputProps): import("react/jsx-runtime").JSX.Element;
+export { Input, inputStyles };

package/dist/components/input.es.js

@@ -0,0 +1,4 @@
+import { I as r } from "../input-DwPDvbRE.js";
+export {
+  r as Input
+};

package/dist/components/label.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../label-CbzkBbPT.cjs");exports.Label=e.Label;

package/dist/components/label.d.ts

@@ -0,0 +1,4 @@
+import * as LabelPrimitive from '@radix-ui/react-label';
+import * as React from 'react';
+declare function Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export { Label };

package/dist/components/label.es.js

@@ -0,0 +1,4 @@
+import { L as o } from "../label-BpDUqtrC.js";
+export {
+  o as Label
+};

package/dist/components/menubar.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../jsx-runtime-DUiatUiq.cjs"),c=require("@radix-ui/react-menubar"),o=require("../index-DoxiiusW.cjs"),i=require("../icon-component-LY_vGYHZ.cjs");function m(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const a=m(c);function l({className:e,...t}){return n.jsxRuntimeExports.jsx(a.Root,{"data-slot":"menubar",className:o.cn("bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs",e),...t})}function x({...e}){return n.jsxRuntimeExports.jsx(a.Menu,{"data-slot":"menubar-menu",...e})}function b({...e}){return n.jsxRuntimeExports.jsx(a.Group,{"data-slot":"menubar-group",...e})}function u({...e}){return n.jsxRuntimeExports.jsx(a.Portal,{"data-slot":"menubar-portal",...e})}function p({...e}){return n.jsxRuntimeExports.jsx(a.RadioGroup,{"data-slot":"menubar-radio-group",...e})}function f({className:e,...t}){return n.jsxRuntimeExports.jsx(a.Trigger,{"data-slot":"menubar-trigger",className:o.cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none",e),...t})}function g({className:e,align:t="start",alignOffset:r=-4,sideOffset:s=8,...d}){return n.jsxRuntimeExports.jsx(u,{children:n.jsxRuntimeExports.jsx(a.Content,{"data-slot":"menubar-content",align:t,alignOffset:r,sideOffset:s,className:o.cn("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md",e),...d})})}function j({className:e,inset:t,variant:r="default",...s}){return n.jsxRuntimeExports.jsx(a.Item,{"data-slot":"menubar-item","data-inset":t,"data-variant":r,className:o.cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",e),...s})}function v({className:e,children:t,checked:r,...s}){return n.jsxRuntimeExports.jsxs(a.CheckboxItem,{"data-slot":"menubar-checkbox-item",className:o.cn("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",e),checked:r,...s,children:[n.jsxRuntimeExports.jsx("span",{className:"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center",children:n.jsxRuntimeExports.jsx(a.ItemIndicator,{children:n.jsxRuntimeExports.jsx(i.IconComponent,{iconName:"IconCheck",className:"size-4"})})}),t]})}function M({className:e,children:t,...r}){return n.jsxRuntimeExports.jsxs(a.RadioItem,{"data-slot":"menubar-radio-item",className:o.cn("focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",e),...r,children:[n.jsxRuntimeExports.jsx("span",{className:"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center",children:n.jsxRuntimeExports.jsx(a.ItemIndicator,{children:n.jsxRuntimeExports.jsx(i.IconComponent,{iconName:"IconCircle",className:"size-2 fill-current"})})}),t]})}function h({className:e,inset:t,...r}){return n.jsxRuntimeExports.jsx(a.Label,{"data-slot":"menubar-label","data-inset":t,className:o.cn("px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",e),...r})}function R({className:e,...t}){return n.jsxRuntimeExports.jsx(a.Separator,{"data-slot":"menubar-separator",className:o.cn("bg-border -mx-1 my-1 h-px",e),...t})}function E({className:e,...t}){return n.jsxRuntimeExports.jsx("span",{"data-slot":"menubar-shortcut",className:o.cn("text-muted-foreground ml-auto text-xs tracking-widest",e),...t})}function N({...e}){return n.jsxRuntimeExports.jsx(a.Sub,{"data-slot":"menubar-sub",...e})}function I({className:e,inset:t,children:r,...s}){return n.jsxRuntimeExports.jsxs(a.SubTrigger,{"data-slot":"menubar-sub-trigger","data-inset":t,className:o.cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[inset]:pl-8",e),...s,children:[r,n.jsxRuntimeExports.jsx(i.IconComponent,{iconName:"IconChevronRight",className:"ml-auto h-4 w-4"})]})}function S({className:e,...t}){return n.jsxRuntimeExports.jsx(a.SubContent,{"data-slot":"menubar-sub-content",className:o.cn("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",e),...t})}exports.Menubar=l;exports.MenubarCheckboxItem=v;exports.MenubarContent=g;exports.MenubarGroup=b;exports.MenubarItem=j;exports.MenubarLabel=h;exports.MenubarMenu=x;exports.MenubarPortal=u;exports.MenubarRadioGroup=p;exports.MenubarRadioItem=M;exports.MenubarSeparator=R;exports.MenubarShortcut=E;exports.MenubarSub=N;exports.MenubarSubContent=S;exports.MenubarSubTrigger=I;exports.MenubarTrigger=f;

package/dist/components/menubar.d.ts

@@ -0,0 +1,26 @@
+import * as MenubarPrimitive from '@radix-ui/react-menubar';
+import * as React from 'react';
+declare function Menubar({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarMenu({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Menu>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarGroup({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarPortal({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarRadioGroup({ ...props }: React.ComponentProps<typeof MenubarPrimitive.RadioGroup>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarTrigger({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarContent({ className, align, alignOffset, sideOffset, ...props }: React.ComponentProps<typeof MenubarPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarItem({ className, inset, variant, ...props }: React.ComponentProps<typeof MenubarPrimitive.Item> & {
+    inset?: boolean;
+    variant?: 'default' | 'destructive';
+}): import("react/jsx-runtime").JSX.Element;
+declare function MenubarCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof MenubarPrimitive.CheckboxItem>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarRadioItem({ className, children, ...props }: React.ComponentProps<typeof MenubarPrimitive.RadioItem>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarLabel({ className, inset, ...props }: React.ComponentProps<typeof MenubarPrimitive.Label> & {
+    inset?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSeparator({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.Separator>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarShortcut({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSub({ ...props }: React.ComponentProps<typeof MenubarPrimitive.Sub>): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSubTrigger({ className, inset, children, ...props }: React.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {
+    inset?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function MenubarSubContent({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive.SubContent>): import("react/jsx-runtime").JSX.Element;
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, };

package/dist/components/menubar.es.js

@@ -0,0 +1,257 @@
+import { j as t } from "../jsx-runtime-C5mzlN2N.js";
+import * as n from "@radix-ui/react-menubar";
+import { c as r } from "../index-CRiPKpXj.js";
+import { I as d } from "../icon-component-BZ-4FDV6.js";
+function f({
+  className: e,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsx(
+    n.Root,
+    {
+      "data-slot": "menubar",
+      className: r(
+        "bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs",
+        e
+      ),
+      ...a
+    }
+  );
+}
+function b({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(n.Menu, { "data-slot": "menubar-menu", ...e });
+}
+function p({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(n.Group, { "data-slot": "menubar-group", ...e });
+}
+function u({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(n.Portal, { "data-slot": "menubar-portal", ...e });
+}
+function x({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(n.RadioGroup, { "data-slot": "menubar-radio-group", ...e });
+}
+function g({
+  className: e,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsx(
+    n.Trigger,
+    {
+      "data-slot": "menubar-trigger",
+      className: r(
+        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none",
+        e
+      ),
+      ...a
+    }
+  );
+}
+function v({
+  className: e,
+  align: a = "start",
+  alignOffset: o = -4,
+  sideOffset: s = 8,
+  ...i
+}) {
+  return /* @__PURE__ */ t.jsx(u, { children: /* @__PURE__ */ t.jsx(
+    n.Content,
+    {
+      "data-slot": "menubar-content",
+      align: a,
+      alignOffset: o,
+      sideOffset: s,
+      className: r(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md",
+        e
+      ),
+      ...i
+    }
+  ) });
+}
+function h({
+  className: e,
+  inset: a,
+  variant: o = "default",
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsx(
+    n.Item,
+    {
+      "data-slot": "menubar-item",
+      "data-inset": a,
+      "data-variant": o,
+      className: r(
+        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        e
+      ),
+      ...s
+    }
+  );
+}
+function j({
+  className: e,
+  children: a,
+  checked: o,
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    n.CheckboxItem,
+    {
+      "data-slot": "menubar-checkbox-item",
+      className: r(
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        e
+      ),
+      checked: o,
+      ...s,
+      children: [
+        /* @__PURE__ */ t.jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ t.jsx(n.ItemIndicator, { children: /* @__PURE__ */ t.jsx(d, { iconName: "IconCheck", className: "size-4" }) }) }),
+        a
+      ]
+    }
+  );
+}
+function M({
+  className: e,
+  children: a,
+  ...o
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    n.RadioItem,
+    {
+      "data-slot": "menubar-radio-item",
+      className: r(
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        e
+      ),
+      ...o,
+      children: [
+        /* @__PURE__ */ t.jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ t.jsx(n.ItemIndicator, { children: /* @__PURE__ */ t.jsx(
+          d,
+          {
+            iconName: "IconCircle",
+            className: "size-2 fill-current"
+          }
+        ) }) }),
+        a
+      ]
+    }
+  );
+}
+function N({
+  className: e,
+  inset: a,
+  ...o
+}) {
+  return /* @__PURE__ */ t.jsx(
+    n.Label,
+    {
+      "data-slot": "menubar-label",
+      "data-inset": a,
+      className: r(
+        "px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
+        e
+      ),
+      ...o
+    }
+  );
+}
+function z({
+  className: e,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsx(
+    n.Separator,
+    {
+      "data-slot": "menubar-separator",
+      className: r("bg-border -mx-1 my-1 h-px", e),
+      ...a
+    }
+  );
+}
+function I({
+  className: e,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsx(
+    "span",
+    {
+      "data-slot": "menubar-shortcut",
+      className: r(
+        "text-muted-foreground ml-auto text-xs tracking-widest",
+        e
+      ),
+      ...a
+    }
+  );
+}
+function y({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(n.Sub, { "data-slot": "menubar-sub", ...e });
+}
+function k({
+  className: e,
+  inset: a,
+  children: o,
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    n.SubTrigger,
+    {
+      "data-slot": "menubar-sub-trigger",
+      "data-inset": a,
+      className: r(
+        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[inset]:pl-8",
+        e
+      ),
+      ...s,
+      children: [
+        o,
+        /* @__PURE__ */ t.jsx(d, { iconName: "IconChevronRight", className: "ml-auto h-4 w-4" })
+      ]
+    }
+  );
+}
+function C({
+  className: e,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsx(
+    n.SubContent,
+    {
+      "data-slot": "menubar-sub-content",
+      className: r(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
+        e
+      ),
+      ...a
+    }
+  );
+}
+export {
+  f as Menubar,
+  j as MenubarCheckboxItem,
+  v as MenubarContent,
+  p as MenubarGroup,
+  h as MenubarItem,
+  N as MenubarLabel,
+  b as MenubarMenu,
+  u as MenubarPortal,
+  x as MenubarRadioGroup,
+  M as MenubarRadioItem,
+  z as MenubarSeparator,
+  I as MenubarShortcut,
+  y as MenubarSub,
+  C as MenubarSubContent,
+  k as MenubarSubTrigger,
+  g as MenubarTrigger
+};

package/dist/components/multi-select.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../jsx-runtime-DUiatUiq.cjs"),M=require("../badge-Czof3oqL.cjs"),x=require("../command-D9M8dk1M.cjs"),y=require("../popover-B8wp2cHF.cjs"),R=require("../index-DoxiiusW.cjs"),r=require("react"),v=require("../icon-component-LY_vGYHZ.cjs"),I=r.createContext(null);function k({children:e,values:n,defaultValues:i,onValuesChange:u}){const[g,m]=r.useState(!1),[h,p]=r.useState(new Set(n??i)),[E,f]=r.useState(new Map);function w(c){const s=l=>{const a=new Set(l);return a.has(c)?a.delete(c):a.add(c),a};p(s),u?.([...s(h)])}const j=r.useCallback((c,s)=>{f(l=>l.get(c)===s?l:new Map(l).set(c,s))},[]);return t.jsxRuntimeExports.jsx(I,{value:{open:g,setOpen:m,selectedValues:n?new Set(n):h,toggleValue:w,items:E,onItemAdded:j},children:t.jsxRuntimeExports.jsx(y.Popover,{open:g,onOpenChange:m,children:e})})}function V({className:e,children:n,...i}){const{open:u}=b();return t.jsxRuntimeExports.jsx(y.PopoverTrigger,{asChild:!0,children:t.jsxRuntimeExports.jsxs("button",{...i,role:i.role??"combobox","aria-expanded":i["aria-expanded"]??u,className:R.cn("border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='text-'])]:text-muted-foreground flex h-auto min-h-9 w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent px-3 py-1.5 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",e),children:[n,t.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconSelector",className:"size-4 shrink-0 opacity-50"})]})})}function z({placeholder:e,clickToRemove:n=!0,className:i,overflowBehavior:u="wrap-when-open",...g}){const{selectedValues:m,toggleValue:h,items:p,open:E}=b(),[f,w]=r.useState(0),j=r.useRef(null),c=r.useRef(null),s=r.useRef(new Set),l=u==="wrap"||u==="wrap-when-open"&&E;r.useEffect(()=>{l&&s.current.forEach(o=>o.style.removeProperty("display"))},[l]);const a=r.useCallback(()=>{if(j.current==null)return;const o=j.current,d=c.current;d!=null&&(d.style.display="none"),s.current.forEach(S=>S.style.removeProperty("display"));let C=0;for(let S=s.current.size-1;S>=0;S--){const N=[...s.current][S];if(o.scrollWidth<=o.clientWidth)break;C=s.current.size-S,N.style.display="none",d?.style.removeProperty("display")}w(C)},[]);return r.useEffect(()=>{if(j.current==null)return;const o=new ResizeObserver(a);return o.observe(j.current),()=>o.disconnect()},[a]),r.useLayoutEffect(()=>{a()},[m,a]),m.size===0&&e?t.jsxRuntimeExports.jsx("span",{className:"text-muted-foreground font-normal",children:e}):t.jsxRuntimeExports.jsxs("div",{...g,ref:j,className:R.cn("flex w-full gap-1.5 overflow-hidden",l&&"h-full flex-wrap",i),children:[[...m].filter(o=>p.has(o)).map(o=>t.jsxRuntimeExports.jsxs(M.Badge,{ref:d=>{if(d!=null)return s.current.add(d),()=>{s.current.delete(d)}},variant:"outline",className:"group flex items-center gap-1",onClick:n?d=>{d.stopPropagation(),h(o)}:void 0,children:[p.get(o),n&&t.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconX",className:"text-muted-foreground group-hover:text-destructive size-2"})]},o)),t.jsxRuntimeExports.jsxs(M.Badge,{style:{display:f>0&&!l?"block":"none"},variant:"outline",ref:c,children:["+",f]})]})}function P({search:e=!0,children:n,...i}){const u=typeof e=="object"?!0:e;return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx("div",{style:{display:"none"},children:t.jsxRuntimeExports.jsx(x.Command,{children:t.jsxRuntimeExports.jsx(x.CommandList,{children:n})})}),t.jsxRuntimeExports.jsx(y.PopoverContent,{className:"min-w-[var(--radix-popover-trigger-width)] p-0",children:t.jsxRuntimeExports.jsxs(x.Command,{...i,children:[u?t.jsxRuntimeExports.jsx(x.CommandInput,{placeholder:typeof e=="object"?e.placeholder:void 0}):t.jsxRuntimeExports.jsx("button",{autoFocus:!0,"aria-hidden":"true",className:"sr-only"}),t.jsxRuntimeExports.jsxs(x.CommandList,{children:[u&&t.jsxRuntimeExports.jsx(x.CommandEmpty,{children:typeof e=="object"?e.emptyMessage:void 0}),n]})]})})]})}function q({value:e,children:n,badgeLabel:i,onSelect:u,...g}){const{toggleValue:m,selectedValues:h,onItemAdded:p}=b(),E=h.has(e);return r.useEffect(()=>{p(e,i??n)},[e,n,p,i]),t.jsxRuntimeExports.jsxs(x.CommandItem,{...g,value:e,onSelect:f=>{m(f),u?.(f)},children:[t.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconCheck",className:R.cn("mr-2 size-4",E?"opacity-100":"opacity-0")}),n]})}function O(e){return t.jsxRuntimeExports.jsx(x.CommandGroup,{...e})}function A(e){return t.jsxRuntimeExports.jsx(x.CommandSeparator,{...e})}function b(){const e=r.useContext(I);if(e==null)throw new Error("useMultiSelectContext must be used within a MultiSelectContext");return e}exports.MultiSelect=k;exports.MultiSelectContent=P;exports.MultiSelectGroup=O;exports.MultiSelectItem=q;exports.MultiSelectSeparator=A;exports.MultiSelectTrigger=V;exports.MultiSelectValue=z;

package/dist/components/multi-select.d.ts

@@ -0,0 +1,32 @@
+import { Button } from '@/components/button';
+import { Command, CommandGroup, CommandItem, CommandSeparator } from '@/components/command';
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+declare function MultiSelect({ children, values, defaultValues, onValuesChange, }: {
+    children: ReactNode;
+    values?: string[];
+    defaultValues?: string[];
+    onValuesChange?: (values: string[]) => void;
+}): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelectTrigger({ className, children, ...props }: {
+    className?: string;
+    children?: ReactNode;
+} & ComponentPropsWithoutRef<typeof Button>): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelectValue({ placeholder, clickToRemove, className, overflowBehavior, ...props }: {
+    placeholder?: string;
+    clickToRemove?: boolean;
+    overflowBehavior?: 'wrap' | 'wrap-when-open' | 'cutoff';
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelectContent({ search, children, ...props }: {
+    search?: boolean | {
+        placeholder?: string;
+        emptyMessage?: string;
+    };
+    children: ReactNode;
+} & Omit<ComponentPropsWithoutRef<typeof Command>, 'children'>): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelectItem({ value, children, badgeLabel, onSelect, ...props }: {
+    badgeLabel?: ReactNode;
+    value: string;
+} & Omit<ComponentPropsWithoutRef<typeof CommandItem>, 'value'>): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelectGroup(props: ComponentPropsWithoutRef<typeof CommandGroup>): import("react/jsx-runtime").JSX.Element;
+declare function MultiSelectSeparator(props: ComponentPropsWithoutRef<typeof CommandSeparator>): import("react/jsx-runtime").JSX.Element;
+export { MultiSelect, MultiSelectContent, MultiSelectGroup, MultiSelectItem, MultiSelectSeparator, MultiSelectTrigger, MultiSelectValue, };