@konstructio/ui 0.0.8 → 0.0.10

package/dist/components/Switch/Switch.js

@@ -1,16 +1,16 @@
-import { jsxs as x, jsx as u } from "react/jsx-runtime";
+import { jsxs as P, jsx as u } from "react/jsx-runtime";
 import * as h from "react";
-import { forwardRef as I, useState as _, useRef as H, useId as A, useImperativeHandle as M, useEffect as $, useCallback as j } from "react";
-import { c as z, a as B, d as q } from "../../index-8vgf-x5i.js";
-import { u as F } from "../../index-DoOsnuB6.js";
-import { u as O, a as V } from "../../index-BxeV34ij.js";
-import { P } from "../../index-BaNV0qac.js";
-import { cn as D } from "../../utils/index.js";
+import { forwardRef as _, useState as H, useRef as A, useId as M, useImperativeHandle as $, useEffect as j, useCallback as z } from "react";
+import { c as B, a as q, d as F } from "../../index-8vgf-x5i.js";
+import { u as O } from "../../index-DoOsnuB6.js";
+import { u as V, a as D } from "../../index-BxeV34ij.js";
+import { P as g } from "../../index-BaNV0qac.js";
 import "../../contexts/theme.context.js";
 import { useTheme as L } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
+import { cn as x } from "../../utils/index.js";
 import { switchVariants as U, thumbVariants as W } from "./Switch.variants.js";
-var k = "Switch", [X, de] = z(k), [G, J] = X(k), g = h.forwardRef(
+var k = "Switch", [X, de] = B(k), [G, J] = X(k), R = h.forwardRef(
   (e, s) => {
     const {
       __scopeSwitch: t,
@@ -23,27 +23,27 @@ var k = "Switch", [X, de] = z(k), [G, J] = X(k), g = h.forwardRef(
       onCheckedChange: m,
       form: r,
       ...d
-    } = e, [l, b] = h.useState(null), v = F(s, (C) => b(C)), f = h.useRef(!1), w = l ? r || !!l.closest("form") : !0, [S = !1, E] = B({
+    } = e, [l, b] = h.useState(null), v = O(s, (C) => b(C)), f = h.useRef(!1), w = l ? r || !!l.closest("form") : !0, [S = !1, T] = q({
       prop: n,
       defaultProp: p,
       onChange: m
     });
-    return /* @__PURE__ */ x(G, { scope: t, checked: S, disabled: a, children: [
+    return /* @__PURE__ */ P(G, { scope: t, checked: S, disabled: a, children: [
       /* @__PURE__ */ u(
-        P.button,
+        g.button,
         {
           type: "button",
           role: "switch",
           "aria-checked": S,
           "aria-required": o,
-          "data-state": N(S),
+          "data-state": E(S),
           "data-disabled": a ? "" : void 0,
           disabled: a,
           value: i,
           ...d,
           ref: v,
-          onClick: q(e.onClick, (C) => {
-            E((T) => !T), w && (f.current = C.isPropagationStopped(), f.current || C.stopPropagation());
+          onClick: F(e.onClick, (C) => {
+            T((I) => !I), w && (f.current = C.isPropagationStopped(), f.current || C.stopPropagation());
           })
         }
       ),
@@ -64,14 +64,14 @@ var k = "Switch", [X, de] = z(k), [G, J] = X(k), g = h.forwardRef(
     ] });
   }
 );
-g.displayName = k;
-var R = "SwitchThumb", y = h.forwardRef(
+R.displayName = k;
+var y = "SwitchThumb", N = h.forwardRef(
   (e, s) => {
-    const { __scopeSwitch: t, ...c } = e, n = J(R, t);
+    const { __scopeSwitch: t, ...c } = e, n = J(y, t);
     return /* @__PURE__ */ u(
-      P.span,
+      g.span,
       {
-        "data-state": N(n.checked),
+        "data-state": E(n.checked),
         "data-disabled": n.disabled ? "" : void 0,
         ...c,
         ref: s
@@ -79,9 +79,9 @@ var R = "SwitchThumb", y = h.forwardRef(
     );
   }
 );
-y.displayName = R;
+N.displayName = y;
 var K = (e) => {
-  const { control: s, checked: t, bubbles: c = !0, ...n } = e, p = h.useRef(null), o = O(t), a = V(s);
+  const { control: s, checked: t, bubbles: c = !0, ...n } = e, p = h.useRef(null), o = V(t), a = D(s);
   return h.useEffect(() => {
     const i = p.current, m = window.HTMLInputElement.prototype, d = Object.getOwnPropertyDescriptor(m, "checked").set;
     if (o !== t && d) {
@@ -108,11 +108,11 @@ var K = (e) => {
     }
   );
 };
-function N(e) {
+function E(e) {
   return e ? "checked" : "unchecked";
 }
-var Q = g, Y = y;
-const le = I(
+var Q = R, Y = N;
+const le = _(
   ({
     name: e,
     defaultChecked: s,
@@ -122,18 +122,18 @@ const le = I(
     className: p,
     label: o
   }, a) => {
-    const [i, m] = _(s ?? !1), r = H(null), d = A(), { theme: l } = L(), b = c ?? l, v = e ? `${d}-${e}` : d;
-    M(a, () => r.current, [r]), $(() => {
+    const [i, m] = H(s ?? !1), r = A(null), d = M(), { theme: l } = L(), b = c ?? l, v = e ? `${d}-${e}` : d;
+    $(a, () => r.current, [r]), j(() => {
       r.current && (r.current.value = `${i}`);
     }, [i]);
-    const f = j(
+    const f = z(
       (w) => m(w),
       []
     );
-    return /* @__PURE__ */ x(
+    return /* @__PURE__ */ P(
       "div",
       {
-        className: D(
+        className: x(
           "w-full flex gap-3",
           t === "vertical" ? "flex-col" : "flex-row"
         ),
@@ -153,7 +153,7 @@ const le = I(
               id: v,
               defaultChecked: s,
               onCheckedChange: f,
-              className: U({ theme: b, className: p }),
+              className: x(U({ theme: b, className: p })),
               "aria-label": o,
               children: /* @__PURE__ */ u(
                 Y,

package/dist/components/Tag/Tag.js

@@ -1,6 +1,7 @@
-import { jsx as a } from "react/jsx-runtime";
-import { tagVariants as i } from "./Tag.variants.js";
-const m = ({ label: r, color: t }) => /* @__PURE__ */ a("div", { className: i({ color: t }), children: /* @__PURE__ */ a("span", { className: "text-inherit", children: r }) });
+import { jsx as r } from "react/jsx-runtime";
+import { cn as i } from "../../utils/index.js";
+import { tagVariants as m } from "./Tag.variants.js";
+const n = ({ label: t, color: a }) => /* @__PURE__ */ r("div", { className: i(m({ color: a })), children: /* @__PURE__ */ r("span", { className: "text-inherit", children: t }) });
 export {
-  m as Tag
+  n as Tag
 };

package/dist/components/TagSelect/TagSelect.js

@@ -1,58 +1,58 @@
-import { jsxs as p, jsx as e } from "react/jsx-runtime";
+import { jsxs as u, jsx as e } from "react/jsx-runtime";
 import { forwardRef as g, useId as w, useRef as C, useImperativeHandle as T, useEffect as R } from "react";
 import "../../contexts/theme.context.js";
 import { useTheme as S } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
-import { cn as u } from "../../utils/index.js";
+import { cn as r } from "../../utils/index.js";
 import { Tag as d } from "../Tag/Tag.js";
 import { useTagSelect as k } from "./hooks/useTagSelect.js";
 import { tagSelectVariants as I, tagListVariants as V, tagItemVariants as j } from "./TagSelect.variants.js";
 import { C as y } from "../../chevron-up-CvquEaNg.js";
-const B = g(({ label: n, name: r, options: f, placeholder: h = "Select a value...", theme: l }, x) => {
-  const s = w(), { theme: o } = S(), t = C(null), {
-    isOpen: a,
-    selectedTag: c,
-    value: m,
+const B = g(({ label: s, name: l, options: f, placeholder: h = "Select a value...", theme: o }, x) => {
+  const c = w(), { theme: a } = S(), t = C(null), {
+    isOpen: i,
+    selectedTag: m,
+    value: p,
     wrapperRef: b,
     handleClickTag: N,
     handleOpenDropdown: v
   } = k();
   return T(x, () => t.current, [t]), R(() => {
-    t.current && (t.current.value = m);
-  }, [m]), /* @__PURE__ */ p("div", { ref: b, className: "flex flex-col w-full relative", children: [
-    n ? /* @__PURE__ */ e("label", { className: "m-2 cursor-pointer", htmlFor: r ?? s, children: n }) : null,
-    /* @__PURE__ */ p(
+    t.current && (t.current.value = p);
+  }, [p]), /* @__PURE__ */ u("div", { ref: b, className: "flex flex-col w-full relative", children: [
+    s ? /* @__PURE__ */ e("label", { className: "m-2 cursor-pointer", htmlFor: l ?? c, children: s }) : null,
+    /* @__PURE__ */ u(
       "div",
       {
-        id: r ?? s,
-        className: I({ theme: l ?? o }),
+        id: l ?? c,
+        className: r(I({ theme: o ?? a })),
         role: "combobox",
         onClick: v,
-        "aria-expanded": a,
+        "aria-expanded": i,
         children: [
-          c ? /* @__PURE__ */ e(d, { ...c }) : /* @__PURE__ */ e("span", { className: "text-base text-inherit", children: h }),
+          m ? /* @__PURE__ */ e(d, { ...m }) : /* @__PURE__ */ e("span", { className: "text-base text-inherit", children: h }),
           /* @__PURE__ */ e(
             y,
             {
-              className: u(
+              className: r(
                 "w-4 h-4 text-inherit transition-all duration-50",
-                a ? "rotate-0" : "rotate-180"
+                i ? "rotate-0" : "rotate-180"
               )
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ e("input", { ref: t, type: "text", name: r, className: "hidden" }),
-    a ? /* @__PURE__ */ e(
+    /* @__PURE__ */ e("input", { ref: t, type: "text", name: l, className: "hidden" }),
+    i ? /* @__PURE__ */ e(
       "ul",
       {
         role: "listbox",
-        className: u(V({ theme: l ?? o })),
-        children: f.map((i) => /* @__PURE__ */ e(
+        className: r(V({ theme: o ?? a })),
+        children: f.map((n) => /* @__PURE__ */ e(
           "li",
           {
-            className: j({ theme: l ?? o }),
+            className: r(j({ theme: o ?? a })),
             role: "option",
             children: /* @__PURE__ */ e(
               "button",
@@ -60,8 +60,8 @@ const B = g(({ label: n, name: r, options: f, placeholder: h = "Select a value..
                 type: "button",
                 role: "button",
                 className: "m-0 p-0 w-full",
-                onClick: () => N(i),
-                children: /* @__PURE__ */ e(d, { label: i.label, color: i.color })
+                onClick: () => N(n),
+                children: /* @__PURE__ */ e(d, { label: n.label, color: n.color })
               }
             )
           }

package/dist/components/TextArea/TextArea.js

@@ -1,34 +1,35 @@
-import { jsxs as h, jsx as a } from "react/jsx-runtime";
+import { jsxs as h, jsx as s } from "react/jsx-runtime";
 import { forwardRef as v, useId as N, useState as T, useCallback as j } from "react";
-import { textAreaVariants as A } from "./TextArea.variants.js";
 import "../../contexts/theme.context.js";
-import { useTheme as I } from "../../contexts/theme.hook.js";
+import { useTheme as A } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
-const S = v(
-  ({ initialValue: m, label: t, name: o, placeholder: l, rows: c = 3, theme: i, onChange: e }, u) => {
-    const r = N(), { theme: d } = I(), s = o ? `${r}-name` : r, [p, x] = T(m ?? ""), f = j(
-      (n) => {
-        x(n.target.value), e == null || e();
+import { cn as I } from "../../utils/index.js";
+import { textAreaVariants as V } from "./TextArea.variants.js";
+const q = v(
+  ({ initialValue: o, label: t, name: a, placeholder: l, rows: c = 3, theme: i, onChange: e }, p) => {
+    const r = N(), { theme: u } = A(), m = a ? `${r}-name` : r, [d, f] = T(o ?? ""), n = j(
+      (x) => {
+        f(x.target.value), e == null || e();
       },
       [e]
     );
     return /* @__PURE__ */ h("div", { className: "flex flex-col gap-2", children: [
-      t ? /* @__PURE__ */ a("label", { htmlFor: s, className: "cursor-pointer", children: t }) : null,
-      /* @__PURE__ */ a(
+      t ? /* @__PURE__ */ s("label", { htmlFor: m, className: "cursor-pointer", children: t }) : null,
+      /* @__PURE__ */ s(
         "textarea",
         {
-          id: s,
-          ref: u,
-          className: A({ theme: i ?? d }),
+          id: m,
+          ref: p,
+          className: I(V({ theme: i ?? u })),
           rows: c,
           placeholder: l,
-          value: p,
-          onChange: f
+          value: d,
+          onChange: n
         }
       )
     ] });
   }
 );
 export {
-  S as TextArea
+  q as TextArea
 };