@konstructio/ui 0.0.9 → 0.0.11

package/dist/components/Card/Card.js

@@ -1,39 +1,44 @@
-import { jsx as t } from "react/jsx-runtime";
-import { forwardRef as p } from "react";
+import { jsx as o } from "react/jsx-runtime";
+import { forwardRef as c } from "react";
 import "../../contexts/theme.context.js";
-import { useTheme as c } from "../../contexts/theme.hook.js";
+import { useTheme as f } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
-import { cardBaseVariants as f, cardVariants as n } from "./Card.variants.js";
-const h = p(
-  ({ className: o, theme: r, isActive: m, canHover: a, wrapperClassName: s, ...i }, d) => {
-    const { theme: e } = c();
-    return /* @__PURE__ */ t(
+import { cn as t } from "../../utils/index.js";
+import { cardBaseVariants as n, cardVariants as h } from "./Card.variants.js";
+const l = c(
+  ({ className: s, theme: r, isActive: m, canHover: a, wrapperClassName: i, ...d }, p) => {
+    const { theme: e } = f();
+    return /* @__PURE__ */ o(
       "div",
       {
-        className: f({
-          canHover: a,
-          className: s,
-          isActive: m,
-          theme: r ?? e
-        }),
-        children: /* @__PURE__ */ t(
+        className: t(
+          n({
+            canHover: a,
+            className: i,
+            isActive: m,
+            theme: r ?? e
+          })
+        ),
+        children: /* @__PURE__ */ o(
           "div",
           {
-            ref: d,
-            className: n({
-              className: o,
-              theme: r ?? e,
-              isActive: m,
-              canHover: a
-            }),
-            ...i
+            ref: p,
+            className: t(
+              h({
+                className: s,
+                theme: r ?? e,
+                isActive: m,
+                canHover: a
+              })
+            ),
+            ...d
           }
         )
       }
     );
   }
 );
-h.displayName = "Card";
+l.displayName = "Card";
 export {
-  h as Card
+  l as Card
 };

package/dist/components/Checkbox/Checkbox.js

@@ -1,16 +1,17 @@
-import { jsxs as N, jsx as f } from "react/jsx-runtime";
+import { jsxs as S, jsx as f } from "react/jsx-runtime";
 import * as u from "react";
-import j, { forwardRef as S, useId as M, useCallback as A } from "react";
-import { u as H } from "../../index-DoOsnuB6.js";
-import { c as K, a as W, d as I } from "../../index-8vgf-x5i.js";
-import { u as $, a as q } from "../../index-BxeV34ij.js";
-import { P as F } from "../../index-D4Q2rMby.js";
-import { P as _ } from "../../index-BaNV0qac.js";
-import { useToggle as V } from "../../hooks/useToggle.js";
-import { checkboxVariants as X, labelVariants as G } from "./Checkbox.variants.js";
+import j, { forwardRef as _, useId as A, useCallback as H } from "react";
+import { u as K } from "../../index-DoOsnuB6.js";
+import { c as W, a as $, d as I } from "../../index-8vgf-x5i.js";
+import { u as q, a as F } from "../../index-BxeV34ij.js";
+import { P as V } from "../../index-D4Q2rMby.js";
+import { P as T } from "../../index-BaNV0qac.js";
 import "../../contexts/theme.context.js";
-import { useTheme as J } from "../../contexts/theme.hook.js";
+import { useTheme as X } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
+import { cn as N } from "../../utils/index.js";
+import { useToggle as G } from "../../hooks/useToggle.js";
+import { checkboxVariants as J, labelVariants as Q } from "./Checkbox.variants.js";
 import { P } from "../../index-D68N8v8R.js";
 function E() {
   return E = Object.assign || function(e) {
@@ -22,9 +23,9 @@ function E() {
     return e;
   }, E.apply(this, arguments);
 }
-function Q(e, s) {
+function U(e, s) {
   if (e == null) return {};
-  var t = U(e, s), o, n;
+  var t = Y(e, s), o, n;
   if (Object.getOwnPropertySymbols) {
     var r = Object.getOwnPropertySymbols(e);
     for (n = 0; n < r.length; n++)
@@ -32,15 +33,15 @@ function Q(e, s) {
   }
   return t;
 }
-function U(e, s) {
+function Y(e, s) {
   if (e == null) return {};
   var t = {}, o = Object.keys(e), n, r;
   for (r = 0; r < o.length; r++)
     n = o[r], !(s.indexOf(n) >= 0) && (t[n] = e[n]);
   return t;
 }
-var O = S(function(e, s) {
-  var t = e.color, o = t === void 0 ? "currentColor" : t, n = e.size, r = n === void 0 ? 24 : n, l = Q(e, ["color", "size"]);
+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"]);
   return /* @__PURE__ */ j.createElement("svg", E({
     ref: s,
     xmlns: "http://www.w3.org/2000/svg",
@@ -61,7 +62,7 @@ O.propTypes = {
   size: P.oneOfType([P.string, P.number])
 };
 O.displayName = "Check";
-var R = "Checkbox", [Y, ke] = K(R), [Z, ee] = Y(R), T = u.forwardRef(
+var R = "Checkbox", [Z, Ce] = W(R), [ee, te] = Z(R), z = u.forwardRef(
   (e, s) => {
     const {
       __scopeCheckbox: t,
@@ -74,26 +75,26 @@ var R = "Checkbox", [Y, ke] = K(R), [Z, ee] = Y(R), T = u.forwardRef(
       onCheckedChange: C,
       form: d,
       ...p
-    } = e, [i, k] = u.useState(null), v = H(s, (c) => k(c)), x = u.useRef(!1), g = i ? d || !!i.closest("form") : !0, [m = !1, w] = W({
+    } = 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] = $({
       prop: n,
       defaultProp: r,
       onChange: C
-    }), B = u.useRef(m);
+    }), M = u.useRef(m);
     return u.useEffect(() => {
       const c = i == null ? void 0 : i.form;
       if (c) {
-        const y = () => w(B.current);
+        const y = () => w(M.current);
         return c.addEventListener("reset", y), () => c.removeEventListener("reset", y);
       }
-    }, [i, w]), /* @__PURE__ */ N(Z, { scope: t, state: m, disabled: a, children: [
+    }, [i, w]), /* @__PURE__ */ S(ee, { scope: t, state: m, disabled: a, children: [
       /* @__PURE__ */ f(
-        _.button,
+        T.button,
         {
           type: "button",
           role: "checkbox",
           "aria-checked": h(m) ? "mixed" : m,
           "aria-required": l,
-          "data-state": D(m),
+          "data-state": B(m),
           "data-disabled": a ? "" : void 0,
           disabled: a,
           value: b,
@@ -108,7 +109,7 @@ var R = "Checkbox", [Y, ke] = K(R), [Z, ee] = Y(R), T = u.forwardRef(
         }
       ),
       g && /* @__PURE__ */ f(
-        te,
+        re,
         {
           control: i,
           bubbles: !x.current,
@@ -125,14 +126,14 @@ var R = "Checkbox", [Y, ke] = K(R), [Z, ee] = Y(R), T = u.forwardRef(
     ] });
   }
 );
-T.displayName = R;
-var z = "CheckboxIndicator", L = u.forwardRef(
+z.displayName = R;
+var L = "CheckboxIndicator", D = u.forwardRef(
   (e, s) => {
-    const { __scopeCheckbox: t, forceMount: o, ...n } = e, r = ee(z, t);
-    return /* @__PURE__ */ f(F, { present: o || h(r.state) || r.state === !0, children: /* @__PURE__ */ f(
-      _.span,
+    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,
       {
-        "data-state": D(r.state),
+        "data-state": B(r.state),
         "data-disabled": r.disabled ? "" : void 0,
         ...n,
         ref: s,
@@ -141,9 +142,9 @@ var z = "CheckboxIndicator", L = u.forwardRef(
     ) });
   }
 );
-L.displayName = z;
-var te = (e) => {
-  const { control: s, checked: t, bubbles: o = !0, defaultChecked: n, ...r } = e, l = u.useRef(null), a = $(t), b = q(s);
+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);
   u.useEffect(() => {
     const d = l.current, p = window.HTMLInputElement.prototype, k = Object.getOwnPropertyDescriptor(p, "checked").set;
     if (a !== t && k) {
@@ -175,11 +176,11 @@ var te = (e) => {
 function h(e) {
   return e === "indeterminate";
 }
-function D(e) {
+function B(e) {
   return h(e) ? "indeterminate" : e ? "checked" : "unchecked";
 }
-var re = T, oe = L;
-const ve = S(
+var oe = z, ne = D;
+const xe = _(
   ({
     ariaLabelledBy: e,
     className: s,
@@ -194,12 +195,12 @@ const ve = S(
     variant: d,
     onChange: p
   }, i) => {
-    const [k, v] = V(t), x = M(), { theme: g } = J(), m = A(() => {
+    const [k, v] = G(t), x = A(), { theme: g } = X(), m = H(() => {
       v(), p == null || p();
     }, [p, v]);
-    return /* @__PURE__ */ N("div", { className: "flex items-center gap-2", children: [
+    return /* @__PURE__ */ S("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ f(
-        re,
+        oe,
         {
           id: n ?? x,
           checked: k,
@@ -208,25 +209,29 @@ const ve = S(
           disabled: o,
           "aria-labelledby": e,
           title: C,
-          className: X({
-            className: s,
-            theme: b ?? g,
-            variant: d,
-            checked: k
-          }),
+          className: N(
+            J({
+              className: s,
+              theme: b ?? g,
+              variant: d,
+              checked: k
+            })
+          ),
           onCheckedChange: m,
-          children: /* @__PURE__ */ f(oe, { children: /* @__PURE__ */ f(O, { className: "w-4 h-4 stroke-2" }) })
+          children: /* @__PURE__ */ f(ne, { children: /* @__PURE__ */ f(O, { className: "w-4 h-4 stroke-2" }) })
         }
       ),
       r ? /* @__PURE__ */ f(
         "label",
         {
           htmlFor: a ?? n,
-          className: G({
-            variant: d,
-            theme: b,
-            className: l
-          }),
+          className: N(
+            Q({
+              variant: d,
+              theme: b,
+              className: l
+            })
+          ),
           children: r
         }
       ) : null
@@ -234,5 +239,5 @@ const ve = S(
   }
 );
 export {
-  ve as Checkbox
+  xe as Checkbox
 };

package/dist/components/Dropdown/components/ListItem/ListItem.js

@@ -1,29 +1,30 @@
-import { jsxs as m, jsx as f } from "react/jsx-runtime";
-import { useRef as u, useCallback as r } from "react";
+import { jsxs as i, jsx as f } from "react/jsx-runtime";
+import { useRef as u, useCallback as s } from "react";
+import { cn as p } from "../../../../utils/index.js";
 import { useDropdownContext as d } from "../../contexts/dropdown.hook.js";
 import "../../contexts/dropdown.context.js";
-import { listItemVariants as p } from "./ListItem.variants.js";
-const y = ({ theme: o, ...e }) => {
-  const { setValue: n, toggleOpen: s } = d(), c = u(null), t = r(
-    (l) => {
-      n(l), s(!1);
+import { listItemVariants as x } from "./ListItem.variants.js";
+const b = ({ theme: o, ...e }) => {
+  const { setValue: n, toggleOpen: r } = d(), c = u(null), l = s(
+    (t) => {
+      n(t), r(!1);
     },
-    [n, s]
-  ), a = r(
-    (l, i) => {
-      l.key === "Enter" && t(i);
+    [n, r]
+  ), m = s(
+    (t, a) => {
+      t.key === "Enter" && l(a);
     },
-    [t]
+    [l]
   );
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ i(
     "li",
     {
       ref: c,
       role: "option",
-      className: p({ theme: o }),
+      className: p(x({ theme: o })),
       tabIndex: 0,
-      onClick: () => t(e),
-      onKeyDown: (l) => a(l, e),
+      onClick: () => l(e),
+      onKeyDown: (t) => m(t, e),
       children: [
         e.leftIcon ? /* @__PURE__ */ f("span", { className: "w-4 h-4 flex justify-center items-center", children: e.leftIcon }) : null,
         e.label
@@ -32,5 +33,5 @@ const y = ({ theme: o, ...e }) => {
   );
 };
 export {
-  y as ListItem
+  b as ListItem
 };

package/dist/components/Dropdown/components/Wrapper.js

@@ -1,6 +1,6 @@
 import { jsxs as m, jsx as t } from "react/jsx-runtime";
-import { forwardRef as D, useId as F, useRef as N, useImperativeHandle as L, useEffect as f } from "react";
-import { cn as $ } from "../../../utils/index.js";
+import { forwardRef as F, useId as L, useRef as N, useImperativeHandle as $, useEffect as f } from "react";
+import { cn as R } from "../../../utils/index.js";
 import "../../../contexts/theme.context.js";
 import { useTheme as A } from "../../../contexts/theme.hook.js";
 import "../../../js.cookie-OLEfuq_g.js";
@@ -10,10 +10,10 @@ import { useDropdownContext as W } from "../contexts/dropdown.hook.js";
 import "../contexts/dropdown.context.js";
 import { List as q } from "./List/List.js";
 import { C as z } from "../../../chevron-up-CvquEaNg.js";
-const _ = D(
-  ({ theme: R, label: p, placeholder: g, name: o, options: a, defaultValue: c }, O) => {
-    const d = F(), r = N(null), u = N(null), { wrapperRef: n, wrapperInputRef: h, handleOpen: j, handleOpenIfClosed: y } = U({ ulRef: u }), { isOpen: x, value: e, setValue: w, toggleOpen: b } = W(), { theme: E } = A(), v = R ?? E, i = o ? `${d}-${o}` : d;
-    L(O, () => r.current, [r]), f(() => {
+const _ = F(
+  ({ theme: g, label: p, placeholder: O, name: o, options: a, defaultValue: c }, j) => {
+    const d = L(), r = N(null), u = N(null), { wrapperRef: n, wrapperInputRef: h, handleOpen: y, handleOpenIfClosed: E } = U({ ulRef: u }), { isOpen: x, value: e, setValue: w, toggleOpen: b } = W(), { theme: T } = A(), v = g ?? T, i = o ? `${d}-${o}` : d;
+    $(j, () => r.current, [r]), f(() => {
       r.current && (r.current.value = e ? e.value : "");
     }, [e]), f(() => {
       if (c) {
@@ -25,15 +25,15 @@ const _ = D(
     }, [c, a, w]), f(() => {
       var l;
       const s = new AbortController();
-      return (l = n.current) == null || l.addEventListener("focusout", (k) => {
+      return (l = n.current) == null || l.addEventListener("focusout", (D) => {
         var I;
-        const C = k.relatedTarget;
+        const C = D.relatedTarget;
         (!C || !((I = n.current) != null && I.contains(C))) && b(!1);
       }), () => {
         s.abort();
       };
     }, [b, n]);
-    const T = () => e != null && e.leftIcon ? /* @__PURE__ */ t("span", { className: "w-4 h-4 flex justify-center items-center", children: e.leftIcon }) : null;
+    const k = () => e != null && e.leftIcon ? /* @__PURE__ */ t("span", { className: "w-4 h-4 flex justify-center items-center", children: e.leftIcon }) : null;
     return /* @__PURE__ */ m("div", { ref: n, className: "flex flex-col w-full relative", children: [
       p ? /* @__PURE__ */ t(
         "label",
@@ -41,7 +41,7 @@ const _ = D(
           id: i,
           className: "m-2 cursor-pointer",
           htmlFor: i,
-          onClick: y,
+          onClick: E,
           children: p
         }
       ) : null,
@@ -50,21 +50,21 @@ const _ = D(
         {
           ref: h,
           id: i,
-          className: H({ theme: v }),
+          className: R(H({ theme: v })),
           role: "combobox",
-          onClick: j,
+          onClick: y,
           "aria-expanded": x,
           tabIndex: 0,
           "aria-labelledby": i,
           children: [
             /* @__PURE__ */ t("span", { className: "text-base text-inherit", children: e ? /* @__PURE__ */ m("span", { className: "flex gap-3 items-center", children: [
-              T(),
+              k(),
               e.label
-            ] }) : g }),
+            ] }) : O }),
             /* @__PURE__ */ t(
               z,
               {
-                className: $(
+                className: R(
                   "w-4 h-4 text-inherit transition-all duration-50",
                   x ? "rotate-0" : "rotate-180"
                 )

package/dist/components/Input/Input.js

@@ -1,10 +1,10 @@
 import { jsxs as y, jsx as a } from "react/jsx-runtime";
 import s, { forwardRef as m, useId as b } from "react";
 import { cn as w } from "../../utils/index.js";
-import { inputVariants as j } from "./Input.variants.js";
 import "../../contexts/theme.context.js";
-import { useTheme as N } from "../../contexts/theme.hook.js";
+import { useTheme as j } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
+import { inputVariants as N } from "./Input.variants.js";
 import { P as l } from "../../index-D68N8v8R.js";
 function p() {
   return p = Object.assign || function(e) {
@@ -133,7 +133,7 @@ const _ = m(
     onClickIcon: g,
     ...d
   }, x) => {
-    const v = b(), { theme: O } = N();
+    const v = b(), { theme: O } = j();
     return /* @__PURE__ */ y("div", { className: "flex flex-col gap-1.5", children: [
       r ? /* @__PURE__ */ a(
         "label",
@@ -151,7 +151,7 @@ const _ = m(
             ref: x,
             name: n,
             type: i,
-            className: j({
+            className: N({
               className: e,
               theme: c ?? O,
               variant: o ? "error" : "default"

package/dist/components/Modal/Modal.js

@@ -3,7 +3,7 @@ import "../../index-BaNV0qac.js";
 import "./components/Body/Body.js";
 import "./components/Footer/Footer.js";
 import "./components/Header/Header.js";
-import { M as d } from "../../Modal-Ca3bkvvt.js";
+import { M as d } from "../../Modal-L73dmnHv.js";
 import "./hooks/useModal.js";
 export {
   d as Modal

package/dist/components/Modal/components/Footer/Footer.js

@@ -1,6 +1,7 @@
-import { jsx as n } from "react/jsx-runtime";
-import { S as m } from "../../../../index-DoOsnuB6.js";
-const i = ({ children: o, asChild: t, className: r }) => /* @__PURE__ */ n(t ? m : "div", { className: r, children: o });
+import { jsx as m } from "react/jsx-runtime";
+import { S as n } from "../../../../index-DoOsnuB6.js";
+import { cn as e } from "../../../../utils/index.js";
+const a = ({ children: o, asChild: t, className: r }) => /* @__PURE__ */ m(t ? n : "div", { className: e(r), children: o });
 export {
-  i as Footer
+  a as Footer
 };

package/dist/components/Modal/components/Header/Header.js

@@ -1,6 +1,7 @@
-import { jsx as n } from "react/jsx-runtime";
-import { S as e } from "../../../../index-DoOsnuB6.js";
-const i = ({ children: o, asChild: t, className: r }) => /* @__PURE__ */ n(t ? e : "div", { className: r, children: o });
+import { jsx as m } from "react/jsx-runtime";
+import { S as n } from "../../../../index-DoOsnuB6.js";
+import { cn as e } from "../../../../utils/index.js";
+const i = ({ children: o, asChild: r, className: t }) => /* @__PURE__ */ m(r ? n : "div", { className: e(t), children: o });
 export {
   i as Header
 };

package/dist/components/Modal/components/Wrapper/Wrapper.js

@@ -1,14 +1,15 @@
 import "react/jsx-runtime";
+import "../../../../index-BtibbG81.js";
 import "react";
-import { W as b } from "../../../../Modal-Ca3bkvvt.js";
+import { W as c } from "../../../../Modal-L73dmnHv.js";
 import "../../../../Combination-Cmu9JRkv.js";
-import "../../../../index-BtibbG81.js";
 import "../../../../contexts/theme.context.js";
 import "../../../../contexts/theme.hook.js";
 import "../../../../js.cookie-OLEfuq_g.js";
+import "../../../../utils/index.js";
 import "../../hooks/useModal.js";
 import "./Wrapper.variants.js";
 import "../../../../x-CRBgmX1Q.js";
 export {
-  b as Wrapper
+  c as Wrapper
 };

package/dist/components/Modal/components/index.js

@@ -1,7 +1,7 @@
 import { Body as e } from "./Body/Body.js";
 import { Footer as t } from "./Footer/Footer.js";
 import { Header as m } from "./Header/Header.js";
-import { W as a } from "../../../Modal-Ca3bkvvt.js";
+import { W as a } from "../../../Modal-L73dmnHv.js";
 export {
   e as Body,
   t as Footer,