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

package/dist/components/ButtonGroup/ButtonGroup.js

@@ -1,142 +1,88 @@
-import { jsxs as d, jsx as a } from "react/jsx-runtime";
-import { useMemo as q } from "react";
-import { cn as n } from "../../utils/index.js";
-import { buttonGroupPillVariants as z, buttonGroupVariants as A, buttonGroupWrapperVariants as E } from "./ButtonGroup.variants.js";
-import { useButtonGroup as H } from "./hooks/useButtonGroup.js";
-import { ButtonGroupLabel as J } from "./components/ButtonGroupLabel/ButtonGroupLabel.js";
-import { m as Q } from "../../proxy-BGrSEZuV.js";
-import { ButtonGroupItem as T } from "./components/ButtonGroupItem/ButtonGroupItem.js";
-import { ButtonGroupMessage as U } from "./components/ButtonGroupMessage/ButtonGroupMessage.js";
-const X = ({
-  className: p,
-  contentClassName: f,
-  defaultValue: h,
-  descriptionAlign: v,
-  descriptionClassName: G,
-  disabled: o,
-  duration: l,
-  error: b,
-  errorClassName: N,
-  helperText: y,
-  helperTextClassName: B,
-  isRequired: D,
-  itemClassName: g,
-  itemLabelClassName: x,
-  label: s,
-  labelAlign: w,
-  labelClassName: I,
-  name: K,
-  options: t,
-  pillClassName: S,
-  requiredClassName: V,
-  theme: $,
-  value: j,
-  wrapperClassName: F,
-  onValueChange: L
-}) => {
-  const {
-    animationDirection: M,
-    groupRef: C,
-    id: m,
-    selected: r,
-    handleKeyDown: O,
-    handleSelect: P
-  } = H({
+import { t as n } from "../../utils-DHuiYnx1.js";
+import { t as k } from "../../proxy-uLtw-ZML.js";
+import { buttonGroupPillVariants as q, buttonGroupVariants as z, buttonGroupWrapperVariants as A } from "./ButtonGroup.variants.js";
+import { ButtonGroupItem as E } from "./components/ButtonGroupItem/ButtonGroupItem.js";
+import { ButtonGroupLabel as H } from "./components/ButtonGroupLabel/ButtonGroupLabel.js";
+import { ButtonGroupMessage as J } from "./components/ButtonGroupMessage/ButtonGroupMessage.js";
+import { useButtonGroup as Q } from "./hooks/useButtonGroup.js";
+import { useMemo as T } from "react";
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+var U = ({ className: p, contentClassName: f, defaultValue: h, descriptionAlign: v, descriptionClassName: G, disabled: s, duration: l, error: b, errorClassName: N, helperText: y, helperTextClassName: B, isRequired: D, itemClassName: g, itemLabelClassName: x, label: i, labelAlign: w, labelClassName: I, name: K, options: t, pillClassName: S, requiredClassName: V, theme: $, value: j, wrapperClassName: F, onValueChange: L }) => {
+  const { animationDirection: M, groupRef: C, id: m, selected: r, handleKeyDown: O, handleSelect: P } = Q({
     defaultValue: h,
-    disabled: o ?? void 0,
+    disabled: s ?? void 0,
     options: t,
     value: j,
     onValueChange: L
-  }), u = t.length, c = q(
-    () => t.findIndex((e) => e.value === r),
-    [t, r]
-  );
-  return /* @__PURE__ */ d(
-    "div",
-    {
-      className: n(E(), F),
-      "data-theme": $,
-      children: [
-        s && /* @__PURE__ */ a(
-          J,
-          {
-            className: I,
-            htmlFor: m,
-            isRequired: D,
-            label: s,
-            requiredClassName: V
+  }), u = t.length, c = T(() => t.findIndex((e) => e.value === r), [t, r]);
+  return /* @__PURE__ */ d("div", {
+    className: n(A(), F),
+    "data-theme": $,
+    children: [
+      i && /* @__PURE__ */ a(H, {
+        className: I,
+        htmlFor: m,
+        isRequired: D,
+        label: i,
+        requiredClassName: V
+      }),
+      /* @__PURE__ */ d("div", {
+        ref: C,
+        role: "radiogroup",
+        "aria-labelledby": i ? m : void 0,
+        className: n(z({ disabled: s }), p),
+        children: [c >= 0 && /* @__PURE__ */ a(k.div, {
+          "aria-hidden": "true",
+          className: n(q(), S),
+          initial: !1,
+          animate: {
+            left: `calc(${c} * (100% / ${u}) + 8px)`,
+            width: `calc(100% / ${u} - 16px)`
+          },
+          transition: {
+            type: "tween",
+            ease: "linear",
+            duration: l ?? 0.3
           }
-        ),
-        /* @__PURE__ */ d(
-          "div",
-          {
-            ref: C,
-            role: "radiogroup",
-            "aria-labelledby": s ? m : void 0,
-            className: n(A({ disabled: o }), p),
-            children: [
-              c >= 0 && /* @__PURE__ */ a(
-                Q.div,
-                {
-                  "aria-hidden": "true",
-                  className: n(z(), S),
-                  initial: !1,
-                  animate: {
-                    left: `calc(${c} * (100% / ${u}) + 8px)`,
-                    width: `calc(100% / ${u} - 16px)`
-                  },
-                  transition: {
-                    type: "tween",
-                    ease: "linear",
-                    duration: l ?? 0.3
-                  }
-                }
-              ),
-              t.map((e, i) => {
-                const R = r === e.value, W = o || e.disabled, k = !!e.description;
-                return /* @__PURE__ */ a(
-                  T,
-                  {
-                    animationDirection: M,
-                    className: g,
-                    contentClassName: f,
-                    descriptionAlign: v,
-                    descriptionClassName: G,
-                    duration: l,
-                    hasDescription: k,
-                    index: i,
-                    isDisabled: !!W,
-                    isFirst: i === 0,
-                    isLast: i === t.length - 1,
-                    isSelected: R,
-                    labelAlign: w,
-                    labelClassName: x,
-                    option: e,
-                    value: e.value,
-                    onKeyDown: O,
-                    onSelect: P
-                  },
-                  e.value
-                );
-              })
-            ]
-          }
-        ),
-        /* @__PURE__ */ a("input", { type: "hidden", name: K, value: r ?? "" }),
-        /* @__PURE__ */ a(
-          U,
-          {
-            error: b,
-            errorClassName: N,
-            helperText: y,
-            helperTextClassName: B
-          }
-        )
-      ]
-    }
-  );
+        }), t.map((e, o) => {
+          const R = r === e.value, W = s || e.disabled;
+          return /* @__PURE__ */ a(E, {
+            animationDirection: M,
+            className: g,
+            contentClassName: f,
+            descriptionAlign: v,
+            descriptionClassName: G,
+            duration: l,
+            hasDescription: !!e.description,
+            index: o,
+            isDisabled: !!W,
+            isFirst: o === 0,
+            isLast: o === t.length - 1,
+            isSelected: R,
+            labelAlign: w,
+            labelClassName: x,
+            option: e,
+            value: e.value,
+            onKeyDown: O,
+            onSelect: P
+          }, e.value);
+        })]
+      }),
+      /* @__PURE__ */ a("input", {
+        type: "hidden",
+        name: K,
+        value: r ?? ""
+      }),
+      /* @__PURE__ */ a(J, {
+        error: b,
+        errorClassName: N,
+        helperText: y,
+        helperTextClassName: B
+      })
+    ]
+  });
 };
-X.displayName = "KonstructButtonGroup";
+U.displayName = "KonstructButtonGroup";
 export {
-  X as ButtonGroup
+  U as ButtonGroup
 };

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

@@ -1,39 +1,32 @@
-import { c as t } from "../../index-D29mdTf5.js";
-const a = t([
+import { t } from "../../dist-DtEbXv47.js";
+var e = t([
   "absolute",
   "top-2",
   "bottom-2",
   "bg-metal-800",
   "rounded-lg",
   "pointer-events-none"
-]), o = t([
+]), l = 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
-    }
-  }
-);
+]), r = 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 }
+});
 export {
-  a as buttonGroupPillVariants,
-  l as buttonGroupVariants,
-  o as buttonGroupWrapperVariants
+  e as buttonGroupPillVariants,
+  r as buttonGroupVariants,
+  l as buttonGroupWrapperVariants
 };

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

@@ -1,115 +1,59 @@
+import { t as r } from "../../../../utils-DHuiYnx1.js";
+import { t as L } from "../../../../proxy-uLtw-ZML.js";
+import { buttonGroupDescriptionVariants as V, buttonGroupItemContentVariants as g, buttonGroupItemVariants as w, buttonGroupLabelVariants as o } from "./ButtonGroupItem.variants.js";
+import { memo as j } from "react";
 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: 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
-  )
-);
+var k = (t, n) => n === "none" ? t ? "inset(0 0 0 0)" : "inset(0 100% 0 0)" : t ? "inset(0 0 0 0)" : n === "right" ? "inset(0 0 0 100%)" : "inset(0 100% 0 0)", B = j(({ animationDirection: t, className: n, contentClassName: d, descriptionAlign: p, descriptionClassName: h, duration: b = 0.3, hasDescription: f, index: c, isDisabled: l, isFirst: v, isLast: y, isSelected: i, labelAlign: m, labelClassName: u, option: e, value: N, 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(N),
+  onKeyDown: (I) => G(I, c),
+  className: r(w({
+    disabled: l,
+    isFirst: v,
+    isLast: y
+  }), "relative", n),
+  children: /* @__PURE__ */ a("div", {
+    className: r(g({ hasDescription: f }), "relative", d),
+    children: [/* @__PURE__ */ a("span", {
+      className: "relative w-full",
+      children: [/* @__PURE__ */ a("span", {
+        className: r(o({
+          selected: !1,
+          labelAlign: m
+        }), u),
+        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(L.span, {
+        className: r(o({
+          selected: !0,
+          labelAlign: m
+        }), "absolute inset-0", u),
+        "aria-hidden": "true",
+        initial: !1,
+        animate: { clipPath: k(i, t) },
+        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: r(V({ descriptionAlign: p }), h),
+      children: e.description
+    })]
+  })
+}, e.value));
 B.displayName = "KonstructButtonGroupItem";
 export {
   B as ButtonGroupItem

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

@@ -1,111 +1,98 @@
-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: ""
-      }
+import { t } from "../../../../dist-DtEbXv47.js";
+var 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
-    }
-  }
-), 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"
-      }
+    isFirst: {
+      true: "border-l rounded-l-lg",
+      false: ""
     },
-    defaultVariants: {
-      selected: !1,
-      labelAlign: "left"
+    isLast: {
+      true: "border-r rounded-r-lg",
+      false: ""
     }
+  },
+  defaultVariants: {
+    disabled: !1,
+    isFirst: !1,
+    isLast: !1
   }
-), 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([
+  "flex",
+  "flex-col",
+  "flex-1",
+  "rounded-lg",
+  "px-4",
+  "py-2"
+], {
+  variants: { hasDescription: {
+    true: "justify-start",
+    false: "justify-center"
+  } },
+  defaultVariants: { hasDescription: !1 }
+}), s = 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: {
-      descriptionAlign: "left"
+    labelAlign: {
+      left: "justify-between",
+      center: "justify-center",
+      right: "justify-end"
     }
+  },
+  defaultVariants: {
+    selected: !1,
+    labelAlign: "left"
   }
-);
+}), i = 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,
+  i as buttonGroupDescriptionVariants,
+  a as buttonGroupItemContentVariants,
   r as buttonGroupItemVariants,
-  n as buttonGroupLabelVariants
+  s as buttonGroupLabelVariants
 };

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

@@ -1,4 +1,4 @@
-import { ButtonGroupItem as r } from "./ButtonGroupItem.js";
+import { ButtonGroupItem as t } from "./ButtonGroupItem.js";
 export {
-  r as ButtonGroupItem
+  t as ButtonGroupItem
 };