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

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

@@ -1,15 +1,37 @@
 import { c as t } from "../../index-D29mdTf5.js";
-const a = t(["absolute", "top-2", "bottom-2", "bg-metal-800", "rounded-lg", "pointer-events-none"]), o = t(["flex", "flex-col", "gap-2", "w-full"]), l = t(["inline-flex", "items-stretch", "w-full", "relative", "bg-metal-900", "rounded-lg"], {
-  variants: {
-    disabled: {
-      true: "opacity-50 cursor-not-allowed",
-      false: ""
+const a = t([
+  "absolute",
+  "top-2",
+  "bottom-2",
+  "bg-metal-800",
+  "rounded-lg",
+  "pointer-events-none"
+]), o = t([
+  "flex",
+  "flex-col",
+  "gap-2",
+  "w-full"
+]), l = t(
+  [
+    "inline-flex",
+    "items-stretch",
+    "w-full",
+    "relative",
+    "bg-metal-900",
+    "rounded-lg"
+  ],
+  {
+    variants: {
+      disabled: {
+        true: "opacity-50 cursor-not-allowed",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      disabled: !1
     }
-  },
-  defaultVariants: {
-    disabled: !1
   }
-});
+);
 export {
   a as buttonGroupPillVariants,
   l as buttonGroupVariants,

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

@@ -1,108 +1,116 @@
-import { jsx as K, jsxs as D } from "react/jsx-runtime";
-import { c as U } from "../../../../compiler-runtime-DA41awpA.js";
-import { memo as W } from "react";
-import { cn as G } from "../../../../utils/index.js";
-import { buttonGroupItemVariants as X, buttonGroupItemContentVariants as Y, buttonGroupLabelVariants as M, buttonGroupDescriptionVariants as Z } from "./ButtonGroupItem.variants.js";
-import { m as _ } from "../../../../proxy-BGrSEZuV.js";
-const ee = (I, e) => e === "none" ? I ? "inset(0 0 0 0)" : "inset(0 100% 0 0)" : I ? "inset(0 0 0 0)" : e === "right" ? "inset(0 0 0 100%)" : "inset(0 100% 0 0)", te = W((I) => {
-  const e = U.c(68), {
-    animationDirection: j,
-    className: k,
-    contentClassName: A,
-    descriptionAlign: B,
-    descriptionClassName: P,
-    duration: J,
-    hasDescription: E,
-    index: w,
+import { jsx as s, jsxs as a } from "react/jsx-runtime";
+import { memo as L } from "react";
+import { cn as t } from "../../../../utils/index.js";
+import { buttonGroupLabelVariants as u, buttonGroupDescriptionVariants as V, buttonGroupItemContentVariants as g, buttonGroupItemVariants as w } from "./ButtonGroupItem.variants.js";
+import { m as j } from "../../../../proxy-BGrSEZuV.js";
+const k = (r, n) => n === "none" ? r ? "inset(0 0 0 0)" : "inset(0 100% 0 0)" : r ? "inset(0 0 0 0)" : n === "right" ? "inset(0 0 0 100%)" : "inset(0 100% 0 0)", B = L(
+  ({
+    animationDirection: r,
+    className: n,
+    contentClassName: d,
+    descriptionAlign: p,
+    descriptionClassName: h,
+    duration: b = 0.3,
+    hasDescription: f,
+    index: c,
     isDisabled: l,
-    isFirst: F,
-    isLast: R,
-    isSelected: s,
-    labelAlign: i,
-    labelClassName: a,
-    option: t,
-    value: S,
-    onKeyDown: $,
-    onSelect: q
-  } = I, z = J === void 0 ? 0.3 : J, O = t.value, Q = t.value, H = s || w === 0 ? 0 : -1;
-  let n;
-  e[0] !== l || e[1] !== q || e[2] !== S ? (n = () => !l && q(S), e[0] = l, e[1] = q, e[2] = S, e[3] = n) : n = e[3];
-  let o;
-  e[4] !== w || e[5] !== $ ? (o = (T) => $(T, w), e[4] = w, e[5] = $, e[6] = o) : o = e[6];
-  let r;
-  e[7] !== k || e[8] !== l || e[9] !== F || e[10] !== R ? (r = G(X({
-    disabled: l,
-    isFirst: F,
-    isLast: R
-  }), "relative", k), e[7] = k, e[8] = l, e[9] = F, e[10] = R, e[11] = r) : r = e[11];
-  let c;
-  e[12] !== A || e[13] !== E ? (c = G(Y({
-    hasDescription: E
-  }), "relative", A), e[12] = A, e[13] = E, e[14] = c) : c = e[14];
-  let d;
-  e[15] !== i || e[16] !== a ? (d = G(M({
-    selected: !1,
-    labelAlign: i
-  }), a), e[15] = i, e[16] = a, e[17] = d) : d = e[17];
-  let m;
-  e[18] !== t.icon || e[19] !== t.label ? (m = /* @__PURE__ */ D("span", { className: "flex items-center gap-2", children: [
-    t.icon,
-    t.label
-  ] }), e[18] = t.icon, e[19] = t.label, e[20] = m) : m = e[20];
-  let p;
-  e[21] !== t.secondaryLabel ? (p = t.secondaryLabel && /* @__PURE__ */ K("span", { children: t.secondaryLabel }), e[21] = t.secondaryLabel, e[22] = p) : p = e[22];
-  let f;
-  e[23] !== m || e[24] !== p || e[25] !== d ? (f = /* @__PURE__ */ D("span", { className: d, children: [
-    m,
-    p
-  ] }), e[23] = m, e[24] = p, e[25] = d, e[26] = f) : f = e[26];
-  let u;
-  e[27] !== i || e[28] !== a ? (u = G(M({
-    selected: !0,
-    labelAlign: i
-  }), "absolute inset-0", a), e[27] = i, e[28] = a, e[29] = u) : u = e[29];
-  let b;
-  e[30] !== j || e[31] !== s ? (b = ee(s, j), e[30] = j, e[31] = s, e[32] = b) : b = e[32];
-  let h;
-  e[33] !== b ? (h = {
-    clipPath: b
-  }, e[33] = b, e[34] = h) : h = e[34];
-  let y;
-  e[35] !== z ? (y = {
-    type: "tween",
-    ease: "linear",
-    duration: z
-  }, e[35] = z, e[36] = y) : y = e[36];
-  let N;
-  e[37] !== t.icon || e[38] !== t.label ? (N = /* @__PURE__ */ D("span", { className: "flex items-center gap-2", children: [
-    t.icon,
-    t.label
-  ] }), e[37] = t.icon, e[38] = t.label, e[39] = N) : N = e[39];
-  let v;
-  e[40] !== t.secondaryLabel ? (v = t.secondaryLabel && /* @__PURE__ */ K("span", { children: t.secondaryLabel }), e[40] = t.secondaryLabel, e[41] = v) : v = e[41];
-  let L;
-  e[42] !== u || e[43] !== h || e[44] !== y || e[45] !== N || e[46] !== v ? (L = /* @__PURE__ */ D(_.span, { className: u, "aria-hidden": "true", initial: !1, animate: h, transition: y, children: [
-    N,
-    v
-  ] }), e[42] = u, e[43] = h, e[44] = y, e[45] = N, e[46] = v, e[47] = L) : L = e[47];
-  let x;
-  e[48] !== f || e[49] !== L ? (x = /* @__PURE__ */ D("span", { className: "relative w-full", children: [
-    f,
-    L
-  ] }), e[48] = f, e[49] = L, e[50] = x) : x = e[50];
-  let g;
-  e[51] !== B || e[52] !== P || e[53] !== t.description ? (g = t.description && /* @__PURE__ */ K("span", { className: G(Z({
-    descriptionAlign: B
-  }), P), children: t.description }), e[51] = B, e[52] = P, e[53] = t.description, e[54] = g) : g = e[54];
-  let C;
-  e[55] !== x || e[56] !== g || e[57] !== c ? (C = /* @__PURE__ */ D("div", { className: c, children: [
-    x,
-    g
-  ] }), e[55] = x, e[56] = g, e[57] = c, e[58] = C) : C = e[58];
-  let V;
-  return e[59] !== l || e[60] !== s || e[61] !== t.value || e[62] !== C || e[63] !== H || e[64] !== n || e[65] !== o || e[66] !== r ? (V = /* @__PURE__ */ K("button", { type: "button", role: "radio", "aria-checked": s, "data-value": Q, disabled: l, tabIndex: H, onClick: n, onKeyDown: o, className: r, children: C }, O), e[59] = l, e[60] = s, e[61] = t.value, e[62] = C, e[63] = H, e[64] = n, e[65] = o, e[66] = r, e[67] = V) : V = e[67], V;
-});
-te.displayName = "KonstructButtonGroupItem";
+    isFirst: y,
+    isLast: N,
+    isSelected: i,
+    labelAlign: m,
+    labelClassName: o,
+    option: e,
+    value: v,
+    onKeyDown: G,
+    onSelect: x
+  }) => /* @__PURE__ */ s(
+    "button",
+    {
+      type: "button",
+      role: "radio",
+      "aria-checked": i,
+      "data-value": e.value,
+      disabled: l,
+      tabIndex: i || c === 0 ? 0 : -1,
+      onClick: () => !l && x(v),
+      onKeyDown: (I) => G(I, c),
+      className: t(
+        w({ disabled: l, isFirst: y, isLast: N }),
+        "relative",
+        n
+      ),
+      children: /* @__PURE__ */ a(
+        "div",
+        {
+          className: t(
+            g({ hasDescription: f }),
+            "relative",
+            d
+          ),
+          children: [
+            /* @__PURE__ */ a("span", { className: "relative w-full", children: [
+              /* @__PURE__ */ a(
+                "span",
+                {
+                  className: t(
+                    u({ selected: !1, labelAlign: m }),
+                    o
+                  ),
+                  children: [
+                    /* @__PURE__ */ a("span", { className: "flex items-center gap-2", children: [
+                      e.icon,
+                      e.label
+                    ] }),
+                    e.secondaryLabel && /* @__PURE__ */ s("span", { children: e.secondaryLabel })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ a(
+                j.span,
+                {
+                  className: t(
+                    u({ selected: !0, labelAlign: m }),
+                    "absolute inset-0",
+                    o
+                  ),
+                  "aria-hidden": "true",
+                  initial: !1,
+                  animate: {
+                    clipPath: k(i, r)
+                  },
+                  transition: {
+                    type: "tween",
+                    ease: "linear",
+                    duration: b
+                  },
+                  children: [
+                    /* @__PURE__ */ a("span", { className: "flex items-center gap-2", children: [
+                      e.icon,
+                      e.label
+                    ] }),
+                    e.secondaryLabel && /* @__PURE__ */ s("span", { children: e.secondaryLabel })
+                  ]
+                }
+              )
+            ] }),
+            e.description && /* @__PURE__ */ s(
+              "span",
+              {
+                className: t(
+                  V({ descriptionAlign: p }),
+                  h
+                ),
+                children: e.description
+              }
+            )
+          ]
+        }
+      )
+    },
+    e.value
+  )
+);
+B.displayName = "KonstructButtonGroupItem";
 export {
-  te as ButtonGroupItem
+  B as ButtonGroupItem
 };

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

@@ -1,62 +1,108 @@
 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: ""
+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: ""
+      }
     },
-    isFirst: {
-      true: "border-l rounded-l-lg",
-      false: ""
-    },
-    isLast: {
-      true: "border-r rounded-r-lg",
-      false: ""
+    defaultVariants: {
+      disabled: !1,
+      isFirst: !1,
+      isLast: !1
     }
-  },
-  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"
+), s = t(
+  ["flex", "flex-col", "flex-1", "rounded-lg", "px-4", "py-2"],
+  {
+    variants: {
+      hasDescription: {
+        true: "justify-start",
+        false: "justify-center"
+      }
+    },
+    defaultVariants: {
+      hasDescription: !1
     }
-  },
-  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"
+), 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"
+      }
     },
-    labelAlign: {
-      left: "justify-between",
-      center: "justify-center",
-      right: "justify-end"
+    defaultVariants: {
+      selected: !1,
+      labelAlign: "left"
     }
-  },
-  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"
+), 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"
     }
-  },
-  defaultVariants: {
-    descriptionAlign: "left"
   }
-});
+);
 export {
   a as buttonGroupDescriptionVariants,
   s as buttonGroupItemContentVariants,

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

@@ -1,28 +1,45 @@
-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";
+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";
 export {
-  b as ButtonGroupLabel
+  c as ButtonGroupLabel
 };

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

@@ -1,30 +1,37 @@
-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";
+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";
 export {
-  x as ButtonGroupMessage
+  p as ButtonGroupMessage
 };