@konstructio/ui 0.0.12-alpha.9 → 0.0.13-alpha.1

package/dist/components/Checkbox/Checkbox.js

@@ -1,16 +1,15 @@
 import { jsxs as S, jsx as f } from "react/jsx-runtime";
 import * as u from "react";
 import j, { forwardRef as _, useId as A, useCallback as H } from "react";
-import { u as K } from "../../index-B_6_jmOO.js";
-import { a as W, c as $, b as I } from "../../index-Cva-e5M4.js";
-import { u as q, a as F } from "../../index-4ecjw_Aj.js";
-import { P as V } from "../../index-Dj1pom3_.js";
-import { P as T } from "../../index-D7QNmo_D.js";
+import { u as K } from "../../index-Bk324h27.js";
+import { a as W, c as $, b as I } from "../../index-bYyfdsls.js";
+import { u as q, a as F } from "../../index-Bry5AFQ2.js";
+import { P as V } from "../../index-G_6jG4Qc.js";
+import { P as z } from "../../index-g-TFwd6Y.js";
 import { cn as N } from "../../utils/index.js";
 import { checkboxVariants as X, labelVariants as G } from "./Checkbox.variants.js";
 import { useToggle as J } from "../../hooks/useToggle.js";
 import { P } from "../../index-C5psggHV.js";
-import { useTheme as Q } from "../../contexts/theme.hook.js";
 function E() {
   return E = Object.assign || function(e) {
     for (var s = 1; s < arguments.length; s++) {
@@ -21,9 +20,9 @@ function E() {
     return e;
   }, E.apply(this, arguments);
 }
-function U(e, s) {
+function Q(e, s) {
   if (e == null) return {};
-  var t = Y(e, s), o, n;
+  var t = U(e, s), o, n;
   if (Object.getOwnPropertySymbols) {
     var r = Object.getOwnPropertySymbols(e);
     for (n = 0; n < r.length; n++)
@@ -31,7 +30,7 @@ function U(e, s) {
   }
   return t;
 }
-function Y(e, s) {
+function U(e, s) {
   if (e == null) return {};
   var t = {}, o = Object.keys(e), n, r;
   for (r = 0; r < o.length; r++)
@@ -39,7 +38,7 @@ function Y(e, s) {
   return t;
 }
 var O = _(function(e, s) {
-  var t = e.color, o = t === void 0 ? "currentColor" : t, n = e.size, r = n === void 0 ? 24 : n, l = U(e, ["color", "size"]);
+  var t = e.color, o = t === void 0 ? "currentColor" : t, n = e.size, r = n === void 0 ? 24 : n, l = Q(e, ["color", "size"]);
   return /* @__PURE__ */ j.createElement("svg", E({
     ref: s,
     xmlns: "http://www.w3.org/2000/svg",
@@ -60,7 +59,7 @@ O.propTypes = {
   size: P.oneOfType([P.string, P.number])
 };
 O.displayName = "Check";
-var R = "Checkbox", [Z, ke] = $(R), [ee, te] = Z(R), z = u.forwardRef(
+var R = "Checkbox", [Y, he] = $(R), [Z, ee] = Y(R), L = u.forwardRef(
   (e, s) => {
     const {
       __scopeCheckbox: t,
@@ -68,68 +67,68 @@ var R = "Checkbox", [Z, ke] = $(R), [ee, te] = Z(R), z = u.forwardRef(
       checked: n,
       defaultChecked: r,
       required: l,
-      disabled: a,
+      disabled: c,
       value: b = "on",
       onCheckedChange: C,
       form: d,
       ...p
-    } = e, [i, k] = u.useState(null), v = K(s, (c) => k(c)), x = u.useRef(!1), g = i ? d || !!i.closest("form") : !0, [m = !1, w] = W({
+    } = e, [i, h] = u.useState(null), k = K(s, (a) => h(a)), y = u.useRef(!1), g = i ? d || !!i.closest("form") : !0, [v = !1, w] = W({
       prop: n,
       defaultProp: r,
       onChange: C
-    }), M = u.useRef(m);
+    }), M = u.useRef(v);
     return u.useEffect(() => {
-      const c = i == null ? void 0 : i.form;
-      if (c) {
-        const y = () => w(M.current);
-        return c.addEventListener("reset", y), () => c.removeEventListener("reset", y);
+      const a = i == null ? void 0 : i.form;
+      if (a) {
+        const x = () => w(M.current);
+        return a.addEventListener("reset", x), () => a.removeEventListener("reset", x);
       }
-    }, [i, w]), /* @__PURE__ */ S(ee, { scope: t, state: m, disabled: a, children: [
+    }, [i, w]), /* @__PURE__ */ S(Z, { scope: t, state: v, disabled: c, children: [
       /* @__PURE__ */ f(
-        T.button,
+        z.button,
         {
           type: "button",
           role: "checkbox",
-          "aria-checked": h(m) ? "mixed" : m,
+          "aria-checked": m(v) ? "mixed" : v,
           "aria-required": l,
-          "data-state": B(m),
-          "data-disabled": a ? "" : void 0,
-          disabled: a,
+          "data-state": B(v),
+          "data-disabled": c ? "" : void 0,
+          disabled: c,
           value: b,
           ...p,
-          ref: v,
-          onKeyDown: I(e.onKeyDown, (c) => {
-            c.key === "Enter" && c.preventDefault();
+          ref: k,
+          onKeyDown: I(e.onKeyDown, (a) => {
+            a.key === "Enter" && a.preventDefault();
           }),
-          onClick: I(e.onClick, (c) => {
-            w((y) => h(y) ? !0 : !y), g && (x.current = c.isPropagationStopped(), x.current || c.stopPropagation());
+          onClick: I(e.onClick, (a) => {
+            w((x) => m(x) ? !0 : !x), g && (y.current = a.isPropagationStopped(), y.current || a.stopPropagation());
           })
         }
       ),
       g && /* @__PURE__ */ f(
-        re,
+        te,
         {
           control: i,
-          bubbles: !x.current,
+          bubbles: !y.current,
           name: o,
           value: b,
-          checked: m,
+          checked: v,
           required: l,
-          disabled: a,
+          disabled: c,
           form: d,
           style: { transform: "translateX(-100%)" },
-          defaultChecked: h(r) ? !1 : r
+          defaultChecked: m(r) ? !1 : r
         }
       )
     ] });
   }
 );
-z.displayName = R;
-var L = "CheckboxIndicator", D = u.forwardRef(
+L.displayName = R;
+var T = "CheckboxIndicator", D = u.forwardRef(
   (e, s) => {
-    const { __scopeCheckbox: t, forceMount: o, ...n } = e, r = te(L, t);
-    return /* @__PURE__ */ f(V, { present: o || h(r.state) || r.state === !0, children: /* @__PURE__ */ f(
-      T.span,
+    const { __scopeCheckbox: t, forceMount: o, ...n } = e, r = ee(T, t);
+    return /* @__PURE__ */ f(V, { present: o || m(r.state) || r.state === !0, children: /* @__PURE__ */ f(
+      z.span,
       {
         "data-state": B(r.state),
         "data-disabled": r.disabled ? "" : void 0,
@@ -140,17 +139,17 @@ var L = "CheckboxIndicator", D = u.forwardRef(
     ) });
   }
 );
-D.displayName = L;
-var re = (e) => {
-  const { control: s, checked: t, bubbles: o = !0, defaultChecked: n, ...r } = e, l = u.useRef(null), a = q(t), b = F(s);
+D.displayName = T;
+var te = (e) => {
+  const { control: s, checked: t, bubbles: o = !0, defaultChecked: n, ...r } = e, l = u.useRef(null), c = q(t), b = F(s);
   u.useEffect(() => {
-    const d = l.current, p = window.HTMLInputElement.prototype, k = Object.getOwnPropertyDescriptor(p, "checked").set;
-    if (a !== t && k) {
-      const v = new Event("click", { bubbles: o });
-      d.indeterminate = h(t), k.call(d, h(t) ? !1 : t), d.dispatchEvent(v);
+    const d = l.current, p = window.HTMLInputElement.prototype, h = Object.getOwnPropertyDescriptor(p, "checked").set;
+    if (c !== t && h) {
+      const k = new Event("click", { bubbles: o });
+      d.indeterminate = m(t), h.call(d, m(t) ? !1 : t), d.dispatchEvent(k);
     }
-  }, [a, t, o]);
-  const C = u.useRef(h(t) ? !1 : t);
+  }, [c, t, o]);
+  const C = u.useRef(m(t) ? !1 : t);
   return /* @__PURE__ */ f(
     "input",
     {
@@ -171,14 +170,14 @@ var re = (e) => {
     }
   );
 };
-function h(e) {
+function m(e) {
   return e === "indeterminate";
 }
 function B(e) {
-  return h(e) ? "indeterminate" : e ? "checked" : "unchecked";
+  return m(e) ? "indeterminate" : e ? "checked" : "unchecked";
 }
-var oe = z, ne = D;
-const ve = _(
+var re = L, oe = D;
+const be = _(
   ({
     ariaLabelledBy: e,
     className: s,
@@ -187,46 +186,44 @@ const ve = _(
     id: n,
     label: r,
     labelClassName: l,
-    name: a,
+    name: c,
     theme: b,
     title: C,
     variant: d,
     onChange: p
   }, i) => {
-    const [k, v] = J(t), x = A(), { theme: g } = Q(), m = H(() => {
-      v(), p == null || p();
-    }, [p, v]);
-    return /* @__PURE__ */ S("div", { className: "flex items-center gap-2", children: [
+    const [h, k] = J(t), y = A(), g = H(() => {
+      k(), p == null || p();
+    }, [p, k]);
+    return /* @__PURE__ */ S("div", { className: "flex items-center gap-2", "data-theme": b, children: [
       /* @__PURE__ */ f(
-        oe,
+        re,
         {
-          id: n ?? x,
-          checked: k,
+          id: n ?? y,
+          checked: h,
           ref: i,
-          name: a,
+          name: c,
           disabled: o,
           "aria-labelledby": e,
           title: C,
           className: N(
             X({
               className: s,
-              theme: b ?? g,
               variant: d,
-              checked: k
+              checked: h
             })
           ),
-          onCheckedChange: m,
-          children: /* @__PURE__ */ f(ne, { children: /* @__PURE__ */ f(O, { className: "w-4 h-4 stroke-2" }) })
+          onCheckedChange: g,
+          children: /* @__PURE__ */ f(oe, { children: /* @__PURE__ */ f(O, { className: "w-4 h-4 stroke-2" }) })
         }
       ),
       r ? /* @__PURE__ */ f(
         "label",
         {
-          htmlFor: a ?? n,
+          htmlFor: c ?? n,
           className: N(
             G({
               variant: d,
-              theme: b,
               className: l
             })
           ),
@@ -237,5 +234,5 @@ const ve = _(
   }
 );
 export {
-  ve as Checkbox
+  be as Checkbox
 };

package/dist/components/Checkbox/Checkbox.variants.js

@@ -1,5 +1,5 @@
-import { c as e } from "../../index-BNmRGtA6.js";
-const r = e(
+import { c as r } from "../../index-BNmRGtA6.js";
+const e = r(
   [
     "cursor-pointer",
     "border",
@@ -9,18 +9,15 @@ const r = e(
     "flex",
     "justify-center",
     "items-center",
-    "text-white"
+    "text-white",
+    "border-kubefirst-primary",
+    "colony:border-red-700"
   ],
   {
     variants: {
       variant: {
         default: ""
       },
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      },
       checked: {
         true: "",
         false: ""
@@ -28,46 +25,25 @@ const r = e(
     },
     compoundVariants: [
       {
-        theme: "kubefirst",
-        class: ["border-kubefirst-primary"]
-      },
-      {
-        theme: "kubefirst",
         checked: !0,
-        class: ["bg-kubefirst-primary"]
-      },
-      {
-        theme: "colony",
-        class: ["border-red-700"]
-      },
-      {
-        theme: "colony",
-        checked: !0,
-        class: ["bg-red-700"]
+        class: ["bg-kubefirst-primary", "colony:bg-red-700"]
       }
     ],
     defaultVariants: {
-      variant: "default",
-      theme: "kubefirst"
+      variant: "default"
     }
   }
-), a = e(["cursor-pointer"], {
+), t = r(["cursor-pointer"], {
   variants: {
     variant: {
       default: ""
-    },
-    theme: {
-      colony: "",
-      kubefirst: "",
-      civo: ""
     }
   },
   defaultVariants: {
-    variant: "default",
-    theme: "kubefirst"
+    variant: "default"
   }
 });
 export {
-  r as checkboxVariants,
-  a as labelVariants
+  e as checkboxVariants,
+  t as labelVariants
 };

package/dist/components/Command/Command.js

@@ -1,32 +1,40 @@
 import { jsx as o, jsxs as i } from "react/jsx-runtime";
-import { R as t, D as s } from "../../index-DyKo5ZJT.js";
-import { V as p } from "../../index-CbTU3cnP.js";
-import { cn as r } from "../../utils/index.js";
-import { wrapperVariants as l } from "./Command.variants.js";
-import { DialogContent as f } from "./components/DialogContent.js";
-import { Command as c } from "./components/Command.js";
-import { CommandGroup as R } from "./components/CommandGroup.js";
-import { CommandItem as v } from "./components/CommandItem.js";
-import { CommandSeparator as G } from "./components/CommandSeparator.js";
-const g = ({
-  children: m,
+import { R as s, D as p } from "../../index-DvFiic6N.js";
+import { V as l } from "../../index-CWKdynYu.js";
+import { cn as m } from "../../utils/index.js";
+import { wrapperVariants as f } from "./Command.variants.js";
+import { DialogContent as c } from "./components/DialogContent.js";
+import { Command as h } from "./components/Command.js";
+import { CommandGroup as b } from "./components/CommandGroup.js";
+import { CommandItem as y } from "./components/CommandItem.js";
+import { CommandSeparator as H } from "./components/CommandSeparator.js";
+const j = ({
+  children: r,
   title: a,
   titleClassName: e,
   wrapperClassName: n,
+  theme: t,
   ...d
-}) => /* @__PURE__ */ o(t, { ...d, children: /* @__PURE__ */ i(f, { className: "overflow-hidden p-0 border-0 !rounded-none", children: [
-  /* @__PURE__ */ o(s, { className: r("hidden", e), children: /* @__PURE__ */ o(p, { children: a }) }),
-  /* @__PURE__ */ o(
-    c,
-    {
-      className: r(l({ className: n })),
-      children: m
-    }
-  )
-] }) });
+}) => /* @__PURE__ */ o(s, { ...d, children: /* @__PURE__ */ i(
+  c,
+  {
+    className: "overflow-hidden p-0 border-0 !rounded-none",
+    "data-theme": t,
+    children: [
+      /* @__PURE__ */ o(p, { className: m("hidden", e), children: /* @__PURE__ */ o(l, { children: a }) }),
+      /* @__PURE__ */ o(
+        h,
+        {
+          className: m(f({ className: n })),
+          children: r
+        }
+      )
+    ]
+  }
+) });
 export {
-  g as Command,
-  R as CommandGroup,
-  v as CommandItem,
-  G as CommandSeparator
+  j as Command,
+  b as CommandGroup,
+  y as CommandItem,
+  H as CommandSeparator
 };

package/dist/components/Command/Command.variants.js

@@ -1,97 +1,50 @@
 import { c as e } from "../../index-BNmRGtA6.js";
-const r = e([], {
-  variants: {
-    theme: {
-      colony: "",
-      kubefirst: "",
-      civo: ""
-    }
-  },
-  defaultVariants: {
-    theme: "kubefirst"
-  }
-}), o = e(
-  [
-    "[&_[cmdk-group-heading]]:font-medium",
-    "[&_[cmdk-group-heading]]:px-2",
-    "[&_[cmdk-group-heading]]:text-muted-foreground",
-    "[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0",
-    "[&_[cmdk-group]]:px-2",
-    "[&_[cmdk-input-wrapper]_svg]:h-5",
-    "[&_[cmdk-input-wrapper]_svg]:w-5",
-    "[&_[cmdk-input]]:h-12",
-    "[&_[cmdk-item]]:px-2",
-    "[&_[cmdk-item]]:py-3",
-    "[&_[cmdk-item]_svg]:h-5",
-    "[&_[cmdk-item]_svg]:w-5",
-    "bg-popover",
-    "flex",
-    "items-center",
-    "justify-center",
-    "overflow-hidden",
-    "text-popover-foreground",
-    "border",
-    "rounded-md",
-    "border-neutral-900/35",
-    "bg-neutral-900/30"
-  ],
-  {
-    variants: {
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      }
-    },
-    defaultVariants: {
-      theme: "kubefirst"
-    }
-  }
-), n = e(
-  [
-    "bg-transparent",
-    "disabled:cursor-not-allowed",
-    "disabled:opacity-50",
-    "flex",
-    "h-10",
-    "outline-none",
-    "placeholder:text-muted-foreground",
-    "py-3",
-    "rounded-md",
-    "text-sm",
-    "w-full",
-    "text-white/80"
-  ],
-  {
-    variants: {
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      }
-    },
-    defaultVariants: {
-      theme: "kubefirst"
-    }
-  }
-), i = e(
-  ["mr-2", "h-4", "w-4", "shrink-0", "opacity-80", "text-white"],
-  {
-    variants: {
-      theme: {
-        colony: "",
-        kubefirst: "",
-        civo: ""
-      }
-    },
-    defaultVariants: {
-      theme: "kubefirst"
-    }
-  }
-);
+const r = e([
+  "[&_[cmdk-group-heading]]:font-medium",
+  "[&_[cmdk-group-heading]]:px-2",
+  "[&_[cmdk-group-heading]]:text-muted-foreground",
+  "[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0",
+  "[&_[cmdk-group]]:px-2",
+  "[&_[cmdk-input-wrapper]_svg]:h-5",
+  "[&_[cmdk-input-wrapper]_svg]:w-5",
+  "[&_[cmdk-input]]:h-12",
+  "[&_[cmdk-item]]:px-2",
+  "[&_[cmdk-item]]:py-3",
+  "[&_[cmdk-item]_svg]:h-5",
+  "[&_[cmdk-item]_svg]:w-5",
+  "bg-popover",
+  "flex",
+  "items-center",
+  "justify-center",
+  "overflow-hidden",
+  "text-popover-foreground",
+  "border",
+  "rounded-md",
+  "border-neutral-900/35",
+  "bg-neutral-900/30"
+]), d = e([
+  "bg-transparent",
+  "disabled:cursor-not-allowed",
+  "disabled:opacity-50",
+  "flex",
+  "h-10",
+  "outline-none",
+  "placeholder:text-muted-foreground",
+  "py-3",
+  "rounded-md",
+  "text-sm",
+  "w-full",
+  "text-white/80"
+]), o = e([
+  "mr-2",
+  "h-4",
+  "w-4",
+  "shrink-0",
+  "opacity-80",
+  "text-white"
+]);
 export {
-  r as commandVariants,
-  n as inputVariants,
-  i as searchInconInputVariants,
-  o as wrapperVariants
+  d as inputVariants,
+  o as searchInconInputVariants,
+  r as wrapperVariants
 };

package/dist/components/Command/components/Command.js

@@ -1,6 +1,6 @@
 import { jsx as m } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import { V as o } from "../../../index-CzSBQN5S.js";
+import { _ as o } from "../../../index-dRxIWVBr.js";
 const s = p(({ className: r, children: a, ...e }, i) => /* @__PURE__ */ m(o, { ref: i, className: r, ...e, children: /* @__PURE__ */ m("div", { className: "w-[500px]", children: a }) }));
 s.displayName = o.displayName;
 export {

package/dist/components/Command/components/CommandEmpty.js

@@ -1,6 +1,6 @@
 import { jsx as o } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import { V as m } from "../../../index-CzSBQN5S.js";
+import { _ as m } from "../../../index-dRxIWVBr.js";
 const r = p((t, e) => /* @__PURE__ */ o(
   m.Empty,
   {

package/dist/components/Command/components/CommandGroup.js

@@ -1,6 +1,6 @@
 import { jsx as e } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import { V as o } from "../../../index-CzSBQN5S.js";
+import { _ as o } from "../../../index-dRxIWVBr.js";
 import { cn as a } from "../../../utils/index.js";
 const t = p(({ className: r, ...m }, d) => /* @__PURE__ */ e(
   o.Group,

package/dist/components/Command/components/CommandInput.js

@@ -1,5 +1,5 @@
 import { jsxs as y, jsx as c } from "react/jsx-runtime";
-import { V as m } from "../../../index-CzSBQN5S.js";
+import { _ as m } from "../../../index-dRxIWVBr.js";
 import s, { forwardRef as u } from "react";
 import { cn as f } from "../../../utils/index.js";
 import { searchInconInputVariants as v, inputVariants as g } from "../Command.variants.js";

package/dist/components/Command/components/CommandItem.js

@@ -1,6 +1,6 @@
 import { jsx as d } from "react/jsx-runtime";
 import { forwardRef as i, useContext as p, useCallback as c } from "react";
-import { V as r } from "../../../index-CzSBQN5S.js";
+import { _ as r } from "../../../index-dRxIWVBr.js";
 import { cn as l } from "../../../utils/index.js";
 import { CommandContext as u } from "../contexts/Command.context.js";
 const f = i(({ className: a, onSelect: e, ...s }, o) => {

package/dist/components/Command/components/CommandList.js

@@ -1,6 +1,6 @@
 import { jsx as i } from "react/jsx-runtime";
 import { forwardRef as s } from "react";
-import { V as o } from "../../../index-CzSBQN5S.js";
+import { _ as o } from "../../../index-dRxIWVBr.js";
 import { cn as t } from "../../../utils/index.js";
 const e = s(({ className: m, ...r }, a) => /* @__PURE__ */ i(
   o.List,

package/dist/components/Command/components/CommandSeparator.js

@@ -1,6 +1,6 @@
 import { jsx as e } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import { V as r } from "../../../index-CzSBQN5S.js";
+import { _ as r } from "../../../index-dRxIWVBr.js";
 import { cn as t } from "../../../utils/index.js";
 const s = p(({ className: o, ...a }, m) => /* @__PURE__ */ e(
   r.Separator,

package/dist/components/Command/components/DialogContent.js

@@ -1,6 +1,6 @@
 import { jsxs as t, jsx as a } from "react/jsx-runtime";
 import { forwardRef as i } from "react";
-import { a as r, C as o, b as l } from "../../../index-DyKo5ZJT.js";
+import { a as r, C as o, b as l } from "../../../index-DvFiic6N.js";
 import { cn as m } from "../../../utils/index.js";
 import { DialogOverlay as p } from "./DialogOverlay.js";
 import { X as c } from "../../../x-DU-Zw-L_.js";

package/dist/components/Command/components/DialogOverlay.js

@@ -1,19 +1,19 @@
 import { jsx as s } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
-import { O as a } from "../../../index-DyKo5ZJT.js";
-import { cn as m } from "../../../utils/index.js";
-const r = i(({ className: t, ...e }, o) => /* @__PURE__ */ s(
+import { forwardRef as d } from "react";
+import { O as a } from "../../../index-DvFiic6N.js";
+import { cn as i } from "../../../utils/index.js";
+const m = d(({ className: t, ...e }, o) => /* @__PURE__ */ s(
   a,
   {
     ref: o,
-    className: m(
-      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+    className: i(
+      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 delay-200",
       t
     ),
     ...e
   }
 ));
-r.displayName = a.displayName;
+m.displayName = a.displayName;
 export {
-  r as DialogOverlay
+  m as DialogOverlay
 };