@konstructio/ui 0.1.2-alpha.76 → 0.1.2-alpha.77

package/dist/components/ButtonGroup/components/ButtonGroupItem/ButtonGroupItem.variants.js

@@ -1,108 +1,62 @@
 import { c as t } from "../../../../index-D29mdTf5.js";
-const r = t(
-  [
-    "flex",
-    "flex-1",
-    "items-start",
-    "cursor-pointer",
-    "select-none",
-    "transition-colors",
-    "p-2",
-    "border-metal-700",
-    "border-t",
-    "border-b",
-    "bg-transparent",
-    "focus:outline-none",
-    "focus-visible:ring-2",
-    "focus-visible:ring-aurora-500",
-    "focus-visible:ring-inset"
-  ],
-  {
-    variants: {
-      disabled: {
-        true: "pointer-events-none opacity-50",
-        false: ""
-      },
-      isFirst: {
-        true: "border-l rounded-l-lg",
-        false: ""
-      },
-      isLast: {
-        true: "border-r rounded-r-lg",
-        false: ""
-      }
+const r = t(["flex", "flex-1", "items-start", "cursor-pointer", "select-none", "transition-colors", "p-2", "border-metal-700", "border-t", "border-b", "bg-transparent", "focus:outline-none", "focus-visible:ring-2", "focus-visible:ring-aurora-500", "focus-visible:ring-inset"], {
+  variants: {
+    disabled: {
+      true: "pointer-events-none opacity-50",
+      false: ""
     },
-    defaultVariants: {
-      disabled: !1,
-      isFirst: !1,
-      isLast: !1
+    isFirst: {
+      true: "border-l rounded-l-lg",
+      false: ""
+    },
+    isLast: {
+      true: "border-r rounded-r-lg",
+      false: ""
     }
+  },
+  defaultVariants: {
+    disabled: !1,
+    isFirst: !1,
+    isLast: !1
   }
-), s = t(
-  ["flex", "flex-col", "flex-1", "rounded-lg", "px-4", "py-2"],
-  {
-    variants: {
-      hasDescription: {
-        true: "justify-start",
-        false: "justify-center"
-      }
-    },
-    defaultVariants: {
-      hasDescription: !1
+}), s = t(["flex", "flex-col", "flex-1", "rounded-lg", "px-4", "py-2"], {
+  variants: {
+    hasDescription: {
+      true: "justify-start",
+      false: "justify-center"
     }
+  },
+  defaultVariants: {
+    hasDescription: !1
   }
-), n = t(
-  [
-    "text-sm",
-    "font-medium",
-    "leading-5",
-    "tracking-[0.1px]",
-    "flex",
-    "items-center",
-    "gap-2",
-    "w-full",
-    "justify-between",
-    "transition-colors",
-    "ease-in-out"
-  ],
-  {
-    variants: {
-      selected: {
-        true: "text-aurora-500",
-        false: "text-metal-50"
-      },
-      labelAlign: {
-        left: "justify-between",
-        center: "justify-center",
-        right: "justify-end"
-      }
+}), n = t(["text-sm", "font-medium", "leading-5", "tracking-[0.1px]", "flex", "items-center", "gap-2", "w-full", "justify-between", "transition-colors", "ease-in-out"], {
+  variants: {
+    selected: {
+      true: "text-aurora-500",
+      false: "text-metal-50"
     },
-    defaultVariants: {
-      selected: !1,
-      labelAlign: "left"
+    labelAlign: {
+      left: "justify-between",
+      center: "justify-center",
+      right: "justify-end"
     }
+  },
+  defaultVariants: {
+    selected: !1,
+    labelAlign: "left"
   }
-), a = t(
-  [
-    "text-sm",
-    "font-normal",
-    "leading-5",
-    "tracking-[0.15px]",
-    "text-metal-300"
-  ],
-  {
-    variants: {
-      descriptionAlign: {
-        left: "text-left",
-        center: "text-center",
-        right: "text-right"
-      }
-    },
-    defaultVariants: {
-      descriptionAlign: "left"
+}), a = t(["text-sm", "font-normal", "leading-5", "tracking-[0.15px]", "text-metal-300"], {
+  variants: {
+    descriptionAlign: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right"
     }
+  },
+  defaultVariants: {
+    descriptionAlign: "left"
   }
-);
+});
 export {
   a as buttonGroupDescriptionVariants,
   s as buttonGroupItemContentVariants,

package/dist/components/ButtonGroup/components/ButtonGroupLabel/ButtonGroupLabel.js

@@ -1,45 +1,28 @@
-import { jsxs as p, jsx as s } from "react/jsx-runtime";
-import { memo as l } from "react";
-import { cn as t } from "../../../../utils/index.js";
-import { Typography as e } from "../../../Typography/Typography.js";
-const c = l(
-  ({ className: o, htmlFor: r, isRequired: m, label: a, requiredClassName: n }) => /* @__PURE__ */ p(
-    e,
-    {
-      component: "label",
-      variant: "labelLarge",
-      htmlFor: r,
-      className: t(
-        "cursor-pointer",
-        "flex",
-        "gap-1",
-        "text-sm",
-        "font-medium",
-        "text-metal-50",
-        o
-      ),
-      children: [
-        a,
-        " ",
-        m && /* @__PURE__ */ s(
-          e,
-          {
-            component: "span",
-            className: t(
-              "text-red-600",
-              "dark:text-red-500",
-              "text-xs",
-              "mt-0.5",
-              n
-            ),
-            children: "*"
-          }
-        )
-      ]
-    }
-  )
-);
-c.displayName = "KonstructButtonGroupLabel";
+import { jsx as u, jsxs as x } from "react/jsx-runtime";
+import { c as f } from "../../../../compiler-runtime-DA41awpA.js";
+import { memo as d } from "react";
+import { cn as n } from "../../../../utils/index.js";
+import { Typography as p } from "../../../Typography/Typography.js";
+const b = d((c) => {
+  const e = f.c(10), {
+    className: m,
+    htmlFor: s,
+    isRequired: l,
+    label: a,
+    requiredClassName: i
+  } = c;
+  let t;
+  e[0] !== m ? (t = n("cursor-pointer", "flex", "gap-1", "text-sm", "font-medium", "text-metal-50", m), e[0] = m, e[1] = t) : t = e[1];
+  let r;
+  e[2] !== l || e[3] !== i ? (r = l && /* @__PURE__ */ u(p, { component: "span", className: n("text-red-600", "dark:text-red-500", "text-xs", "mt-0.5", i), children: "*" }), e[2] = l, e[3] = i, e[4] = r) : r = e[4];
+  let o;
+  return e[5] !== s || e[6] !== a || e[7] !== t || e[8] !== r ? (o = /* @__PURE__ */ x(p, { component: "label", variant: "labelLarge", htmlFor: s, className: t, children: [
+    a,
+    " ",
+    r
+  ] }), e[5] = s, e[6] = a, e[7] = t, e[8] = r, e[9] = o) : o = e[9], o;
+});
+b.displayName = "KonstructButtonGroupLabel";
 export {
-  c as ButtonGroupLabel
+  b as ButtonGroupLabel
 };

package/dist/components/ButtonGroup/components/ButtonGroupMessage/ButtonGroupMessage.js

@@ -1,37 +1,30 @@
-import { jsx as o } from "react/jsx-runtime";
-import { memo as m } from "react";
-import { cn as r } from "../../../../utils/index.js";
-import { Typography as e } from "../../../Typography/Typography.js";
-const p = m(
-  ({ error: t, errorClassName: s, helperText: n, helperTextClassName: a }) => typeof t == "string" && t.length > 0 ? /* @__PURE__ */ o(
-    e,
-    {
-      component: "span",
-      className: r(
-        "text-xs",
-        "tracking-normal",
-        "text-red-400",
-        s
-      ),
-      children: t
-    }
-  ) : n ? /* @__PURE__ */ o(
-    e,
-    {
-      component: "span",
-      variant: "body1",
-      className: r(
-        "text-xs",
-        "text-metal-300",
-        "select-none",
-        "tracking-normal",
-        a
-      ),
-      children: n
-    }
-  ) : null
-);
-p.displayName = "KonstructButtonGroupMessage";
+import { jsx as l } from "react/jsx-runtime";
+import { c } from "../../../../compiler-runtime-DA41awpA.js";
+import { memo as f } from "react";
+import { cn as m } from "../../../../utils/index.js";
+import { Typography as i } from "../../../Typography/Typography.js";
+const x = f((p) => {
+  const e = c.c(10), {
+    error: o,
+    errorClassName: n,
+    helperText: s,
+    helperTextClassName: a
+  } = p;
+  if (typeof o == "string" && o.length > 0) {
+    let t;
+    e[0] !== n ? (t = m("text-xs", "tracking-normal", "text-red-400", n), e[0] = n, e[1] = t) : t = e[1];
+    let r;
+    return e[2] !== o || e[3] !== t ? (r = /* @__PURE__ */ l(i, { component: "span", className: t, children: o }), e[2] = o, e[3] = t, e[4] = r) : r = e[4], r;
+  }
+  if (s) {
+    let t;
+    e[5] !== a ? (t = m("text-xs", "text-metal-300", "select-none", "tracking-normal", a), e[5] = a, e[6] = t) : t = e[6];
+    let r;
+    return e[7] !== s || e[8] !== t ? (r = /* @__PURE__ */ l(i, { component: "span", variant: "body1", className: t, children: s }), e[7] = s, e[8] = t, e[9] = r) : r = e[9], r;
+  }
+  return null;
+});
+x.displayName = "KonstructButtonGroupMessage";
 export {
-  p as ButtonGroupMessage
+  x as ButtonGroupMessage
 };

package/dist/components/ButtonGroup/hooks/useButtonGroup.js

@@ -1,67 +1,69 @@
-import { useId as A, useRef as S, useState as D, useCallback as d } from "react";
-const R = ({
-  defaultValue: g,
-  disabled: l,
-  options: o,
-  value: f,
-  onValueChange: x
-}) => {
-  const p = A(), I = S(null), u = f !== void 0, [k, w] = D(
-    () => g
-  ), a = u ? f : k, [b, m] = D("none"), s = d(
-    (e) => e ? o.findIndex((n) => n.value === e) : -1,
-    [o]
-  ), i = d(
-    (e) => {
-      if (l) return;
-      const n = s(a), t = s(e);
-      n !== -1 && t !== -1 && m(t > n ? "right" : "left"), u || w(e), x?.(e);
-    },
-    [l, s, u, x, a]
-  ), v = d(
-    (e, n) => {
-      const t = o.filter(
-        (c) => !c.disabled && !l
-      ), h = t.findIndex(
-        (c) => c.value === o[n].value
-      );
-      let r = -1;
-      switch (e.key) {
-        case "ArrowRight":
-        case "ArrowDown":
-          e.preventDefault(), r = (h + 1) % t.length;
-          break;
-        case "ArrowLeft":
-        case "ArrowUp":
-          e.preventDefault(), r = (h - 1 + t.length) % t.length;
-          break;
-        case "Home":
-          e.preventDefault(), r = 0;
-          break;
-        case "End":
-          e.preventDefault(), r = t.length - 1;
-          break;
-        default:
-          return;
+import { c as C } from "../../../compiler-runtime-DA41awpA.js";
+import { useId as O, useRef as $, useState as S } from "react";
+const K = (y) => {
+  const e = C.c(20), {
+    defaultValue: m,
+    disabled: r,
+    options: o,
+    value: w,
+    onValueChange: I
+  } = y, b = O(), k = $(null), u = w !== void 0;
+  let d;
+  e[0] !== m ? (d = () => m, e[0] = m, e[1] = d) : d = e[1];
+  const [B, R] = S(d), l = u ? w : B, [D, E] = S("none");
+  let f;
+  e[2] !== o ? (f = (t) => t ? o.findIndex((a) => a.value === t) : -1, e[2] = o, e[3] = f) : f = e[3];
+  const p = f;
+  let x;
+  e[4] !== r || e[5] !== p || e[6] !== u || e[7] !== I || e[8] !== l ? (x = (t) => {
+    if (r)
+      return;
+    const a = p(l), n = p(t);
+    a !== -1 && n !== -1 && E(n > a ? "right" : "left"), u || R(t), I?.(t);
+  }, e[4] = r, e[5] = p, e[6] = u, e[7] = I, e[8] = l, e[9] = x) : x = e[9];
+  const s = x;
+  let h;
+  e[10] !== r || e[11] !== s || e[12] !== o ? (h = (t, a) => {
+    const n = o.filter((i) => !i.disabled && !r), A = n.findIndex((i) => i.value === o[a].value);
+    let c;
+    e: switch (t.key) {
+      case "ArrowRight":
+      case "ArrowDown": {
+        t.preventDefault(), c = (A + 1) % n.length;
+        break e;
       }
-      if (r >= 0) {
-        const c = t[r];
-        i(c.value), I.current?.querySelector(
-          `[data-value="${c.value}"]`
-        )?.focus();
+      case "ArrowLeft":
+      case "ArrowUp": {
+        t.preventDefault(), c = (A - 1 + n.length) % n.length;
+        break e;
       }
-    },
-    [l, i, o]
-  );
-  return {
-    animationDirection: b,
-    groupRef: I,
-    id: p,
-    selected: a,
+      case "Home": {
+        t.preventDefault(), c = 0;
+        break e;
+      }
+      case "End": {
+        t.preventDefault(), c = n.length - 1;
+        break e;
+      }
+      default:
+        return;
+    }
+    if (c >= 0) {
+      const i = n[c];
+      s(i.value), k.current?.querySelector(`[data-value="${i.value}"]`)?.focus();
+    }
+  }, e[10] = r, e[11] = s, e[12] = o, e[13] = h) : h = e[13];
+  const v = h;
+  let g;
+  return e[14] !== D || e[15] !== v || e[16] !== s || e[17] !== b || e[18] !== l ? (g = {
+    animationDirection: D,
+    groupRef: k,
+    id: b,
+    selected: l,
     handleKeyDown: v,
-    handleSelect: i
-  };
+    handleSelect: s
+  }, e[14] = D, e[15] = v, e[16] = s, e[17] = b, e[18] = l, e[19] = g) : g = e[19], g;
 };
 export {
-  R as useButtonGroup
+  K as useButtonGroup
 };

package/dist/components/Card/Card.js

@@ -1,37 +1,37 @@
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as c } from "react";
-import { cn as s } from "../../utils/index.js";
-import { cardVariants as f, cardBaseVariants as p } from "./Card.variants.js";
-const l = c(
-  ({ className: d, theme: o, isActive: a, canHover: r, wrapperClassName: t, ...e }, i) => /* @__PURE__ */ m(
-    "div",
-    {
-      "data-theme": o,
-      className: s(
-        p({
-          canHover: r,
-          className: t,
-          isActive: a
-        })
-      ),
-      children: /* @__PURE__ */ m(
-        "div",
-        {
-          ref: i,
-          className: s(
-            f({
-              className: d,
-              isActive: a,
-              canHover: r
-            })
-          ),
-          ...e
-        }
-      )
-    }
-  )
-);
-l.displayName = "Card";
+import { jsx as n } from "react/jsx-runtime";
+import { c as v } from "../../compiler-runtime-DA41awpA.js";
+import { forwardRef as h } from "react";
+import { cn as N } from "../../utils/index.js";
+import { cardBaseVariants as x, cardVariants as C } from "./Card.variants.js";
+const u = h((d, f) => {
+  const e = v.c(23);
+  let t, r, a, s, l, i;
+  e[0] !== d ? ({
+    className: r,
+    theme: l,
+    isActive: a,
+    canHover: t,
+    wrapperClassName: i,
+    ...s
+  } = d, e[0] = d, e[1] = t, e[2] = r, e[3] = a, e[4] = s, e[5] = l, e[6] = i) : (t = e[1], r = e[2], a = e[3], s = e[4], l = e[5], i = e[6]);
+  let m;
+  e[7] !== t || e[8] !== a || e[9] !== i ? (m = N(x({
+    canHover: t,
+    className: i,
+    isActive: a
+  })), e[7] = t, e[8] = a, e[9] = i, e[10] = m) : m = e[10];
+  let o;
+  e[11] !== t || e[12] !== r || e[13] !== a ? (o = N(C({
+    className: r,
+    isActive: a,
+    canHover: t
+  })), e[11] = t, e[12] = r, e[13] = a, e[14] = o) : o = e[14];
+  let c;
+  e[15] !== s || e[16] !== f || e[17] !== o ? (c = /* @__PURE__ */ n("div", { ref: f, className: o, ...s }), e[15] = s, e[16] = f, e[17] = o, e[18] = c) : c = e[18];
+  let p;
+  return e[19] !== m || e[20] !== c || e[21] !== l ? (p = /* @__PURE__ */ n("div", { "data-theme": l, className: m, children: c }), e[19] = m, e[20] = c, e[21] = l, e[22] = p) : p = e[22], p;
+});
+u.displayName = "Card";
 export {
-  l as Card
+  u as Card
 };

package/dist/components/Card/Card.variants.js

@@ -1,44 +1,32 @@
 import { c as r } from "../../index-D29mdTf5.js";
-const e = r(
-  ["rounded-xl", "border", "border-gray-200", "dark:border-metal-700"],
-  {
-    variants: {
-      isActive: {
-        true: "border-transparent",
-        false: ""
-      },
-      canHover: {
-        true: ["group", "hover:border-transparent"],
-        false: ""
-      }
+const e = r(["rounded-xl", "border", "border-gray-200", "dark:border-metal-700"], {
+  variants: {
+    isActive: {
+      true: "border-transparent",
+      false: ""
+    },
+    canHover: {
+      true: ["group", "hover:border-transparent"],
+      false: ""
     }
   }
-), o = r(
-  ["border", "border-4", "p-3", "text-card-foreground", "rounded-xl"],
-  {
-    variants: {
-      isActive: {
-        true: ["border-aurora-500", "shadow"],
-        false: "border-transparent"
-      },
-      canHover: {
-        true: [
-          "cursor-pointer",
-          "border-transparent",
-          "group-hover:border-aurora-500"
-        ],
-        false: ""
-      }
+}), o = r(["border", "border-4", "p-3", "text-card-foreground", "rounded-xl"], {
+  variants: {
+    isActive: {
+      true: ["border-aurora-500", "shadow"],
+      false: "border-transparent"
     },
-    compoundVariants: [
-      {
-        canHover: void 0,
-        isActive: void 0,
-        class: "border-transparent"
-      }
-    ]
-  }
-);
+    canHover: {
+      true: ["cursor-pointer", "border-transparent", "group-hover:border-aurora-500"],
+      false: ""
+    }
+  },
+  compoundVariants: [{
+    canHover: void 0,
+    isActive: void 0,
+    class: "border-transparent"
+  }]
+});
 export {
   e as cardBaseVariants,
   o as cardVariants