@konstructio/ui 0.0.5 → 0.0.7

package/dist/components/Switch/Switch.js

@@ -1,63 +1,63 @@
-import { jsxs as x, jsx as l } from "react/jsx-runtime";
+import { jsxs as x, 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-OOfdXoxx.js";
+import { P } from "../../index-BaNV0qac.js";
 import { cn as D } from "../../utils/index.js";
 import "../../contexts/theme.context.js";
 import { useTheme as L } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
 import { switchVariants as U, thumbVariants as W } from "./Switch.variants.js";
-var k = "Switch", [X, ue] = z(k), [G, J] = X(k), g = h.forwardRef(
-  (e, r) => {
+var k = "Switch", [X, de] = z(k), [G, J] = X(k), g = h.forwardRef(
+  (e, s) => {
     const {
       __scopeSwitch: t,
-      name: s,
-      checked: c,
+      name: c,
+      checked: n,
       defaultChecked: p,
-      required: n,
+      required: o,
       disabled: a,
       value: i = "on",
       onCheckedChange: m,
-      form: o,
-      ...u
-    } = e, [d, b] = h.useState(null), v = F(r, (C) => b(C)), f = h.useRef(!1), w = d ? o || !!d.closest("form") : !0, [S = !1, E] = B({
-      prop: c,
+      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({
+      prop: n,
       defaultProp: p,
       onChange: m
     });
     return /* @__PURE__ */ x(G, { scope: t, checked: S, disabled: a, children: [
-      /* @__PURE__ */ l(
+      /* @__PURE__ */ u(
         P.button,
         {
           type: "button",
           role: "switch",
           "aria-checked": S,
-          "aria-required": n,
+          "aria-required": o,
           "data-state": N(S),
           "data-disabled": a ? "" : void 0,
           disabled: a,
           value: i,
-          ...u,
+          ...d,
           ref: v,
           onClick: q(e.onClick, (C) => {
             E((T) => !T), w && (f.current = C.isPropagationStopped(), f.current || C.stopPropagation());
           })
         }
       ),
-      w && /* @__PURE__ */ l(
+      w && /* @__PURE__ */ u(
         K,
         {
-          control: d,
+          control: l,
           bubbles: !f.current,
-          name: s,
+          name: c,
           value: i,
           checked: S,
-          required: n,
+          required: o,
           disabled: a,
-          form: o,
+          form: r,
           style: { transform: "translateX(-100%)" }
         }
       )
@@ -66,35 +66,35 @@ var k = "Switch", [X, ue] = z(k), [G, J] = X(k), g = h.forwardRef(
 );
 g.displayName = k;
 var R = "SwitchThumb", y = h.forwardRef(
-  (e, r) => {
-    const { __scopeSwitch: t, ...s } = e, c = J(R, t);
-    return /* @__PURE__ */ l(
+  (e, s) => {
+    const { __scopeSwitch: t, ...c } = e, n = J(R, t);
+    return /* @__PURE__ */ u(
       P.span,
       {
-        "data-state": N(c.checked),
-        "data-disabled": c.disabled ? "" : void 0,
-        ...s,
-        ref: r
+        "data-state": N(n.checked),
+        "data-disabled": n.disabled ? "" : void 0,
+        ...c,
+        ref: s
       }
     );
   }
 );
 y.displayName = R;
 var K = (e) => {
-  const { control: r, checked: t, bubbles: s = !0, ...c } = e, p = h.useRef(null), n = O(t), a = V(r);
+  const { control: s, checked: t, bubbles: c = !0, ...n } = e, p = h.useRef(null), o = O(t), a = V(s);
   return h.useEffect(() => {
-    const i = p.current, m = window.HTMLInputElement.prototype, u = Object.getOwnPropertyDescriptor(m, "checked").set;
-    if (n !== t && u) {
-      const d = new Event("click", { bubbles: s });
-      u.call(i, t), i.dispatchEvent(d);
+    const i = p.current, m = window.HTMLInputElement.prototype, d = Object.getOwnPropertyDescriptor(m, "checked").set;
+    if (o !== t && d) {
+      const l = new Event("click", { bubbles: c });
+      d.call(i, t), i.dispatchEvent(l);
     }
-  }, [n, t, s]), /* @__PURE__ */ l(
+  }, [o, t, c]), /* @__PURE__ */ u(
     "input",
     {
       type: "checkbox",
       "aria-hidden": !0,
       defaultChecked: t,
-      ...c,
+      ...n,
       tabIndex: -1,
       ref: p,
       style: {
@@ -112,19 +112,19 @@ function N(e) {
   return e ? "checked" : "unchecked";
 }
 var Q = g, Y = y;
-const de = I(
+const le = I(
   ({
     name: e,
-    defaultChecked: r,
+    defaultChecked: s,
     alignment: t = "horizontal",
-    theme: s,
-    thumbClassName: c,
+    theme: c,
+    thumbClassName: n,
     className: p,
-    label: n
+    label: o
   }, a) => {
-    const [i, m] = _(r ?? !1), o = H(null), u = A(), { theme: d } = L(), b = s ?? d, v = e ? `${u}-${e}` : u;
-    M(a, () => o.current, [o]), $(() => {
-      o.current && (o.current.value = `${i}`);
+    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]), $(() => {
+      r.current && (r.current.value = `${i}`);
     }, [i]);
     const f = j(
       (w) => m(w),
@@ -138,39 +138,49 @@ const de = I(
           t === "vertical" ? "flex-col" : "flex-row"
         ),
         children: [
-          n ? /* @__PURE__ */ l(
+          o ? /* @__PURE__ */ u(
             "label",
             {
               className: "text-base",
               htmlFor: v,
               style: { paddingRight: 15 },
-              children: n
+              children: o
             }
           ) : null,
-          /* @__PURE__ */ l(
+          /* @__PURE__ */ u(
             Q,
             {
               id: v,
-              defaultChecked: r,
+              defaultChecked: s,
               onCheckedChange: f,
               className: U({ theme: b, className: p }),
-              children: /* @__PURE__ */ l(
+              "aria-label": o,
+              children: /* @__PURE__ */ u(
                 Y,
                 {
                   className: W({
                     theme: b,
-                    className: c
+                    className: n
                   })
                 }
               )
             }
           ),
-          /* @__PURE__ */ l("input", { ref: o, name: e, type: "text", className: "hidden" })
+          /* @__PURE__ */ u(
+            "input",
+            {
+              ref: r,
+              name: e,
+              type: "text",
+              className: "hidden",
+              "aria-hidden": "true"
+            }
+          )
         ]
       }
     );
   }
 );
 export {
-  de as Switch
+  le as Switch
 };

package/dist/components/Toast/Toast.js

@@ -1,13 +1,13 @@
 import { jsxs as D, jsx as c, Fragment as ne } from "react/jsx-runtime";
 import * as s from "react";
 import { useState as xe, useRef as Re, useEffect as be, useMemo as te, isValidElement as oe, useCallback as ge } from "react";
-import { P as L, r as Se, d as Ie } from "../../index-OOfdXoxx.js";
+import { P as L, r as Se, d as Ie } from "../../index-BaNV0qac.js";
 import { c as Ne, a as Ae, b as X, d as b, u as Fe } from "../../index-8vgf-x5i.js";
 import { u as se, S as j } from "../../index-DoOsnuB6.js";
 import { c as _e } from "../../index-BBjak_0p.js";
-import { B as De, R as Le, P as Oe } from "../../index-O3j1K921.js";
+import { B as De, R as Le, P as Oe } from "../../index-BedjZUuB.js";
 import { P as Me } from "../../index-D4Q2rMby.js";
-import { V as ae, R as ke } from "../../index-ffjBR8Av.js";
+import { V as ae, R as ke } from "../../index-BtibbG81.js";
 import "../../contexts/theme.context.js";
 import { useTheme as Ve } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";

package/dist/components/Tooltip/Tooltip.js

@@ -1,36 +1,36 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import { forwardRef as N, useRef as v, useImperativeHandle as w, useMemo as R, isValidElement as T } from "react";
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import { forwardRef as N, useRef as w, useImperativeHandle as x, useMemo as R, isValidElement as T } from "react";
 import { S as i } from "../../index-DoOsnuB6.js";
 import "../../contexts/theme.context.js";
 import { useTheme as V } from "../../contexts/theme.hook.js";
 import "../../js.cookie-OLEfuq_g.js";
 import { cn as a } from "../../utils/index.js";
-import { tooltipVariants as j, arrowVariants as C } from "./Tooltip.variants.js";
-import { useTooltip as S } from "./hooks/useTooltip.js";
+import { tooltipVariants as b, arrowVariants as j } from "./Tooltip.variants.js";
+import { useTooltip as C } from "./hooks/useTooltip.js";
 const z = N(
-  ({ children: r, content: n, className: l, theme: p, position: t, wrapperClassName: c }, f) => {
-    const d = v(null), { theme: h } = V(), m = p ?? h, { isVisible: u, componentRef: o } = S();
-    w(f, () => o.current, [o]);
-    const x = R(
-      () => T(r) ? r : /* @__PURE__ */ e("p", { className: "p-2", children: r }),
-      [r]
+  ({ children: t, content: l, className: n, theme: p, position: r, wrapperClassName: c }, f) => {
+    const d = w(null), { theme: h } = V(), s = p ?? h, { isVisible: u, componentRef: o } = C();
+    x(f, () => o.current, [o]);
+    const v = R(
+      () => T(t) ? t : /* @__PURE__ */ e("p", { className: "p-2", children: t }),
+      [t]
     );
-    return /* @__PURE__ */ e("div", { className: a("w-full", c), children: /* @__PURE__ */ s("div", { className: "relative w-max", children: [
-      /* @__PURE__ */ e(i, { ref: o, className: a("cursor-pointer ", l), children: x }),
-      /* @__PURE__ */ s(
+    return /* @__PURE__ */ e("div", { className: a("w-full", c), children: /* @__PURE__ */ m("div", { className: "relative w-max", children: [
+      /* @__PURE__ */ e(i, { ref: o, className: a("cursor-pointer ", n), children: v }),
+      /* @__PURE__ */ m(
         "div",
         {
           ref: d,
-          className: j({ theme: m, position: t }),
-          "aria-expanded": u,
+          className: b({ theme: s, position: r }),
+          "data-visible": u,
           children: [
             /* @__PURE__ */ e(
               "span",
               {
-                className: C({ theme: m, position: t })
+                className: j({ theme: s, position: r })
               }
             ),
-            /* @__PURE__ */ e(i, { children: n })
+            /* @__PURE__ */ e(i, { children: l })
           ]
         }
       )

package/dist/components/Tooltip/Tooltip.variants.js

@@ -10,7 +10,7 @@ const e = r(
     "ease-linear",
     "opacity-0",
     "duration-250",
-    "aria-expanded:opacity-100",
+    "[&[data-visible='true']]:opacity-100",
     "delay-100"
   ],
   {

package/dist/components/index.d.ts

@@ -2,6 +2,7 @@ export * from './AlertDialog/AlertDialog';
 export * from './Autocomplete/Autocomplete';
 export * from './Breadcrumb/Breadcrumb';
 export * from './Button/Button';
+export * from './Card/Card';
 export * from './Checkbox/Checkbox';
 export * from './Dropdown/Dropdown';
 export * from './Input/Input';

package/dist/components/index.js

@@ -2,39 +2,41 @@ import { AlertDialog as e } from "./AlertDialog/AlertDialog.js";
 import { Autocomplete as p } from "./Autocomplete/Autocomplete.js";
 import { Breadcrumb as x } from "./Breadcrumb/Breadcrumb.js";
 import { Button as a } from "./Button/Button.js";
-import { Checkbox as u } from "./Checkbox/Checkbox.js";
-import { Dropdown as d } from "./Dropdown/Dropdown.js";
-import { Input as i } from "./Input/Input.js";
-import { M as T } from "../Modal-Bg9UG35z.js";
-import { NumberInput as b } from "./NumberInput/NumberInput.js";
-import { ProgressBar as B } from "./ProgressBar/ProgressBar.js";
-import { Radio as h } from "./Radio/Radio.js";
-import { Range as D } from "./Range/Range.js";
-import { Slider as M } from "./Slider/Slider.js";
-import { Switch as k } from "./Switch/Switch.js";
-import { Tag as N } from "./Tag/Tag.js";
-import { TagSelect as j } from "./TagSelect/TagSelect.js";
-import { TextArea as v } from "./TextArea/TextArea.js";
-import { Toast as z } from "./Toast/Toast.js";
-import { Tooltip as F } from "./Tooltip/Tooltip.js";
+import { Card as d } from "./Card/Card.js";
+import { Checkbox as c } from "./Checkbox/Checkbox.js";
+import { Dropdown as i } from "./Dropdown/Dropdown.js";
+import { Input as T } from "./Input/Input.js";
+import { M as b } from "../Modal-Ca3bkvvt.js";
+import { NumberInput as B } from "./NumberInput/NumberInput.js";
+import { ProgressBar as h } from "./ProgressBar/ProgressBar.js";
+import { Radio as C } from "./Radio/Radio.js";
+import { Range as I } from "./Range/Range.js";
+import { Slider as R } from "./Slider/Slider.js";
+import { Switch as N } from "./Switch/Switch.js";
+import { Tag as j } from "./Tag/Tag.js";
+import { TagSelect as v } from "./TagSelect/TagSelect.js";
+import { TextArea as z } from "./TextArea/TextArea.js";
+import { Toast as F } from "./Toast/Toast.js";
+import { Tooltip as H } from "./Tooltip/Tooltip.js";
 export {
   e as AlertDialog,
   p as Autocomplete,
   x as Breadcrumb,
   a as Button,
-  u as Checkbox,
-  d as Dropdown,
-  i as Input,
-  T as Modal,
-  b as NumberInput,
-  B as ProgressBar,
-  h as Radio,
-  D as Range,
-  M as Slider,
-  k as Switch,
-  N as Tag,
-  j as TagSelect,
-  v as TextArea,
-  z as Toast,
-  F as Tooltip
+  d as Card,
+  c as Checkbox,
+  i as Dropdown,
+  T as Input,
+  b as Modal,
+  B as NumberInput,
+  h as ProgressBar,
+  C as Radio,
+  I as Range,
+  R as Slider,
+  N as Switch,
+  j as Tag,
+  v as TagSelect,
+  z as TextArea,
+  F as Toast,
+  H as Tooltip
 };