asheeui 0.5.0

package/dist/components/multi-select/MultiSelect.js

@@ -0,0 +1,302 @@
+"use client";
+import { jsx as l, jsxs as f } from "react/jsx-runtime";
+import { cn as b } from "@asheeui/utils";
+import { useFloating as Be, autoUpdate as Ge, offset as He, flip as Qe, shift as $e, useClick as qe, useDismiss as Je, useRole as We, useInteractions as Xe } from "@floating-ui/react";
+import { forwardRef as Ye, useId as Ze, useState as V, useMemo as g, useCallback as A } from "react";
+import { ChevronDownIcon as Ce } from "../../icons/ChevronDownIcon.js";
+import { CloseIcon as er } from "../../icons/CloseIcon.js";
+import { useAsheeConfig as rr } from "../../libs/context.js";
+import { RADIUS_CLASS as sr } from "../../shared/radius.js";
+import { resolveCascade as a, resolveRadiusKey as M, resolveClassKey as w } from "../../utils/resolve-token.js";
+import { Button as tr } from "../button/Button.js";
+import { Chip as lr } from "../chip/Chip.js";
+import { FieldShell as ar } from "../field/FieldShell.js";
+import { SelectMenu as or } from "../select-menu/SelectMenu.js";
+import { FALLBACK_MULTI_SELECT_CONFIG as s } from "./multi-select-config.js";
+import { MULTI_SELECT_HEIGHT_CLASS as nr, MULTI_SELECT_PADDING_CLASS as ir, MULTI_SELECT_FONT_CLASS as cr, STATUS_BORDER_CLASS as ur } from "./multi-select-styles.js";
+const dr = Ye(
+  ({
+    options: I = [],
+    value: o,
+    onChange: u,
+    InputLabel: F = "Select Options...",
+    isSearch: K = !0,
+    searchPlaceholder: O = "Search...",
+    searchInputName: U = "multiselect-search",
+    belowList: P,
+    chipOptions: N,
+    handleRemoveChip: n,
+    handleAddChip: m,
+    chipLabel: h,
+    disableChipDisplay: j = !1,
+    chipVariant: B,
+    chipColor: G,
+    chipRadius: H,
+    chipSize: Q,
+    menuVariant: $,
+    menuColor: q,
+    menuRadius: J,
+    menuSize: W,
+    variant: X,
+    color: Y,
+    size: Z,
+    radius: C,
+    status: ee,
+    label: re,
+    labelAlign: se,
+    description: te,
+    message: le,
+    required: ae,
+    isLoading: oe,
+    disabled: c,
+    containerClassName: ne,
+    dropdownClassName: ie,
+    id: ce,
+    className: ue,
+    style: de,
+    ...me
+  }, S) => {
+    var D;
+    const p = rr(), e = (D = p.components) == null ? void 0 : D.multiSelect, fe = Ze(), Se = ce ?? fe, [v, pe] = V(!1), [ve, xe] = V(""), { refs: E, floatingStyles: ye, context: x } = Be({
+      open: v,
+      onOpenChange: (r) => !c && pe(r),
+      placement: "bottom-start",
+      whileElementsMounted: Ge,
+      middleware: [He(4), Qe(), $e({ padding: 8 })]
+    }), be = qe(x, { enabled: !c }), we = Je(x), Ie = We(x, { role: "listbox" }), { getReferenceProps: Ne, getFloatingProps: ze } = Xe([
+      be,
+      we,
+      Ie
+    ]), y = a(
+      Z,
+      e == null ? void 0 : e.size,
+      void 0,
+      s.size
+    ), z = a(
+      X,
+      e == null ? void 0 : e.variant,
+      p.defaultVariant,
+      s.variant
+    ), L = a(
+      Y,
+      e == null ? void 0 : e.color,
+      p.defaultColor,
+      s.color
+    ), _ = M(
+      C,
+      e == null ? void 0 : e.radius,
+      p.defaultRadius,
+      s.radius
+    ), Le = a(
+      $,
+      e == null ? void 0 : e.menuVariant,
+      z,
+      s.variant
+    ), _e = a(
+      q,
+      e == null ? void 0 : e.menuColor,
+      L,
+      s.color
+    ), Ae = a(
+      W,
+      e == null ? void 0 : e.menuSize,
+      void 0,
+      s.menuSize
+    ), Me = M(
+      J,
+      e == null ? void 0 : e.menuRadius,
+      _,
+      s.radius
+    ), he = a(
+      B,
+      e == null ? void 0 : e.chipVariant,
+      z,
+      s.variant
+    ), Ee = a(
+      G,
+      e == null ? void 0 : e.chipColor,
+      L,
+      s.color
+    ), Te = a(
+      Q,
+      e == null ? void 0 : e.chipSize,
+      void 0,
+      s.chipSize
+    ), ke = M(
+      H,
+      e == null ? void 0 : e.chipRadius,
+      _,
+      s.radius
+    ), d = ee ?? "default", De = d === "error" ? "danger" : d === "success" ? "success" : d === "warning" ? "warning" : L, Re = a(
+      se,
+      e == null ? void 0 : e.labelAlign,
+      void 0,
+      s.labelAlign
+    ), Ve = w(
+      y,
+      nr,
+      s.size
+    ), ge = w(
+      y,
+      ir,
+      s.size
+    ), Fe = w(
+      y,
+      cr,
+      s.size
+    ), Ke = w(
+      ke,
+      sr,
+      s.radius
+    ), i = g(() => N !== void 0 ? N : Array.isArray(o) ? I.filter((r) => o.includes(r.value)) : [], [N, o, I]), T = A(
+      (r) => i.some((t) => t.value === r),
+      [i]
+    ), Oe = A(
+      (r) => {
+        const t = T(r.value);
+        if (m || n)
+          t ? n == null || n(r.value) : m == null || m(r);
+        else if (u) {
+          const R = o ?? [], Pe = t ? R.filter((je) => je !== r.value) : [...R, r.value];
+          u(Pe);
+        }
+      },
+      [T, m, n, u, o]
+    ), k = A(
+      (r) => {
+        n ? n(r) : u && Array.isArray(o) && u(o.filter((t) => t !== r));
+      },
+      [n, u, o]
+    ), Ue = g(
+      () => i.map((r) => r.value),
+      [i]
+    );
+    return /* @__PURE__ */ l(
+      ar,
+      {
+        id: Se,
+        label: re,
+        labelAlign: Re,
+        description: te,
+        message: le,
+        status: d,
+        required: ae,
+        isLoading: oe,
+        children: /* @__PURE__ */ f(
+          "div",
+          {
+            className: b("w-full flex flex-col gap-3", ne),
+            style: de,
+            ...me,
+            children: [
+              /* @__PURE__ */ f("div", { className: "relative w-full", children: [
+                /* @__PURE__ */ f(
+                  tr,
+                  {
+                    ref: (r) => {
+                      E.setReference(r), typeof S == "function" ? S(r) : S && (S.current = r);
+                    },
+                    variant: z,
+                    color: De,
+                    radius: _,
+                    animate: !1,
+                    size: y,
+                    isDisabled: c,
+                    "aria-expanded": v,
+                    "aria-haspopup": "listbox",
+                    "aria-invalid": d === "error",
+                    className: b(
+                      "w-full flex items-center justify-between font-normal text-left transition-all duration-200 outline-none select-none",
+                      ur[d],
+                      Ve,
+                      ge,
+                      Fe,
+                      ue
+                    ),
+                    ...Ne(),
+                    children: [
+                      /* @__PURE__ */ l("span", { children: i.length > 0 ? `${i.length} selected` : F }),
+                      /* @__PURE__ */ l(
+                        Ce,
+                        {
+                          className: b(
+                            "ml-2 shrink-0 transition-transform duration-200",
+                            v && "rotate-180"
+                          )
+                        }
+                      )
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ l(
+                  or,
+                  {
+                    isOpen: v,
+                    context: x,
+                    floatingStyles: ye,
+                    getFloatingProps: ze,
+                    setFloatingRef: E.setFloating,
+                    options: I,
+                    selectedValues: Ue,
+                    onSelectOption: Oe,
+                    isSearch: K,
+                    searchPlaceholder: O,
+                    searchInputName: U,
+                    searchQuery: ve,
+                    onSearchChange: xe,
+                    belowList: P,
+                    dropdownClassName: ie,
+                    variant: Le,
+                    color: _e,
+                    size: Ae,
+                    radius: Me
+                  }
+                )
+              ] }),
+              !j && /* @__PURE__ */ f("div", { className: "flex flex-col gap-1.5", children: [
+                h && /* @__PURE__ */ l("span", { className: "text-xs font-medium text-foreground/70", children: h }),
+                /* @__PURE__ */ l("div", { className: "flex flex-wrap gap-1.5 p-2 min-h-12 bg-secondary/20 border border-dashed border-border rounded-lg items-center", children: i.length === 0 ? /* @__PURE__ */ l("span", { className: "text-xs text-foreground/70 px-2 py-1", children: "No selections made" }) : i.map((r) => /* @__PURE__ */ f(
+                  lr,
+                  {
+                    variant: "bordered",
+                    color: Ee,
+                    size: Te,
+                    isDisabled: c,
+                    className: b(
+                      "inline-flex items-center gap-1.5 font-medium shadow-xs",
+                      Ke
+                    ),
+                    children: [
+                      /* @__PURE__ */ l("span", { children: r.label }),
+                      /* @__PURE__ */ l(
+                        "button",
+                        {
+                          type: "button",
+                          tabIndex: c ? -1 : 0,
+                          onClick: (t) => {
+                            t.stopPropagation(), c || k(r.value);
+                          },
+                          onKeyDown: (t) => {
+                            (t.key === "Enter" || t.key === " ") && !c && (t.stopPropagation(), k(r.value));
+                          },
+                          "aria-label": `Remove ${r.label}`,
+                          className: "inline-flex items-center justify-center h-3.5 w-3.5 rounded-full hover:bg-black/20 dark:hover:bg-white/20 transition-colors cursor-pointer shrink-0",
+                          children: /* @__PURE__ */ l(er, { className: "w-3 h-3" })
+                        }
+                      )
+                    ]
+                  },
+                  String(r.value)
+                )) })
+              ] })
+            ]
+          }
+        )
+      }
+    );
+  }
+);
+dr.displayName = "MultiSelect";
+export {
+  dr as MultiSelect
+};

package/dist/components/multi-select/index.d.ts

@@ -0,0 +1,3 @@
+export * from './MultiSelect';
+export * from './multi-select-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/multi-select/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/multi-select/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC"}

package/dist/components/multi-select/index.js

@@ -0,0 +1,3 @@
+export * from "./MultiSelect.js";
+export * from "./multi-select-config.js";
+export * from "./multi-select-styles.js";

package/dist/components/multi-select/multi-select-config.d.ts

@@ -0,0 +1,31 @@
+import { Radius } from '../../shared/radius';
+import { Size } from '../../shared/size';
+import { Color, Variant } from '../../shared/variant';
+import { FieldConfig, FieldSizeKey } from '../field/field-config';
+export type MultiSelectSizeKey = FieldSizeKey;
+export interface MultiSelectOption {
+    label: string;
+    value: string | number;
+    disabled?: boolean;
+    [key: string]: unknown;
+}
+export interface MultiSelectConfig extends Omit<FieldConfig, "size"> {
+    size?: MultiSelectSizeKey;
+    radius?: Radius;
+    menuVariant?: Variant;
+    menuColor?: Color;
+    menuRadius?: Radius;
+    menuSize?: Size;
+    chipVariant?: Variant;
+    chipColor?: Color;
+    chipRadius?: Radius;
+    chipSize?: Size;
+}
+export declare const defaultMultiSelectConfig: MultiSelectConfig;
+export declare const FALLBACK_MULTI_SELECT_CONFIG: Required<MultiSelectConfig>;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        multiSelect: MultiSelectConfig;
+    }
+}
+//# sourceMappingURL=multi-select-config.d.ts.map

package/dist/components/multi-select/multi-select-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-select-config.d.ts","sourceRoot":"","sources":["../../../src/components/multi-select/multi-select-config.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAEL,KAAK,WAAW,EAChB,KAAK,YAAY,EAClB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,MAAM,kBAAkB,GAAG,YAAY,CAAC;AAE9C,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC;IAClE,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAGhB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,IAAI,CAAC;IAGhB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB;AAED,eAAO,MAAM,wBAAwB,EAAE,iBAMtC,CAAC;AAEF,eAAO,MAAM,4BAA4B,EAAE,QAAQ,CAAC,iBAAiB,CAgBpE,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,WAAW,EAAE,iBAAiB,CAAC;KAChC;CACF"}

package/dist/components/multi-select/multi-select-config.js

@@ -0,0 +1,31 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+import { FALLBACK_FIELD_CONFIG as i } from "../field/field-config.js";
+const t = {
+  size: "md",
+  variant: "bordered",
+  labelAlign: "left",
+  chipSize: "sm",
+  menuSize: "sm"
+}, m = {
+  ...i,
+  size: "md",
+  radius: "md",
+  variant: "bordered",
+  color: "primary",
+  status: "default",
+  labelAlign: "left",
+  menuVariant: "solid",
+  menuColor: "default",
+  menuRadius: "md",
+  menuSize: "sm",
+  chipVariant: "solid",
+  chipColor: "primary",
+  chipRadius: "sm",
+  chipSize: "sm"
+};
+e("multiSelect", t);
+export {
+  m as FALLBACK_MULTI_SELECT_CONFIG,
+  t as defaultMultiSelectConfig
+};

package/dist/components/multi-select/multi-select-styles.d.ts

@@ -0,0 +1,6 @@
+import { FieldSizeKey, FieldStatus } from '../field/field-config';
+export declare const MULTI_SELECT_HEIGHT_CLASS: Record<FieldSizeKey, string>;
+export declare const MULTI_SELECT_PADDING_CLASS: Record<FieldSizeKey, string>;
+export declare const MULTI_SELECT_FONT_CLASS: Record<FieldSizeKey, string>;
+export declare const STATUS_BORDER_CLASS: Record<FieldStatus, string>;
+//# sourceMappingURL=multi-select-styles.d.ts.map

package/dist/components/multi-select/multi-select-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-select-styles.d.ts","sourceRoot":"","sources":["../../../src/components/multi-select/multi-select-styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEvE,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIlE,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAInE,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIhE,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAK3D,CAAC"}

package/dist/components/multi-select/multi-select-styles.js

@@ -0,0 +1,25 @@
+"use client";
+const r = {
+  sm: "h-9",
+  md: "h-10",
+  lg: "h-11"
+}, e = {
+  sm: "px-2.5",
+  md: "px-3",
+  lg: "px-3.5"
+}, s = {
+  sm: "text-sm",
+  md: "text-base",
+  lg: "text-lg"
+}, o = {
+  default: "border-border focus:border-primary",
+  error: "border-danger focus:border-danger",
+  warning: "border-warning focus:border-warning",
+  success: "border-success focus:border-success"
+};
+export {
+  s as MULTI_SELECT_FONT_CLASS,
+  r as MULTI_SELECT_HEIGHT_CLASS,
+  e as MULTI_SELECT_PADDING_CLASS,
+  o as STATUS_BORDER_CLASS
+};

package/dist/components/radio/Radio.d.ts

@@ -0,0 +1,20 @@
+import { ChangeEvent, InputHTMLAttributes, ReactNode } from 'react';
+import { Radius } from '../../shared/radius';
+import { Color } from '../../shared/variant';
+import { FieldSizeKey, FieldStatus } from '../field/field-config';
+import { RadioVariant } from './radio-config';
+export interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "onChange" | "children" | "color"> {
+    value: string;
+    size?: FieldSizeKey;
+    color?: Color;
+    radius?: Radius;
+    variant?: RadioVariant;
+    status?: FieldStatus;
+    label?: ReactNode;
+    description?: ReactNode;
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onChange?: (checked: boolean, value: string, event: ChangeEvent<HTMLInputElement>) => void;
+}
+export declare const Radio: import('react').ForwardRefExoticComponent<RadioProps & import('react').RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=Radio.d.ts.map

package/dist/components/radio/Radio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../src/components/radio/Radio.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAgB,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAMlD,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAGL,KAAK,YAAY,EAClB,MAAM,gBAAgB,CAAC;AAaxB,MAAM,WAAW,UACf,SAAQ,IAAI,CACV,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAC3C;IACD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,CACT,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KACjC,IAAI,CAAC;CACX;AAID,eAAO,MAAM,KAAK,yGAoNjB,CAAC"}

package/dist/components/radio/Radio.js

@@ -0,0 +1,156 @@
+"use client";
+import { jsxs as y, jsx as o } from "react/jsx-runtime";
+import { cn as i } from "@asheeui/utils";
+import { forwardRef as as, useId as rs, useState as ts, useCallback as os } from "react";
+import { useAsheeConfig as is } from "../../libs/context.js";
+import { RADIUS_CLASS as N } from "../../shared/radius.js";
+import { resolveCascade as A, resolveRadiusKey as ns, resolveClassKey as r } from "../../utils/resolve-token.js";
+import { FALLBACK_RADIO_CONFIG as a } from "./radio-config.js";
+import { useRadioGroupContext as ls } from "./radio-context.js";
+import { RADIO_OUTER_SIZE_CLASS as ds, RADIO_INNER_SIZE_CLASS as cs, RADIO_FONT_SIZE_CLASS as ms, RADIO_GAP_CLASS as fs, RADIO_COLOR_CLASS as O, RADIO_STATUS_BORDER_CLASS as h } from "./radio-styles.js";
+const us = as(
+  ({
+    value: t,
+    size: z,
+    color: D,
+    radius: L,
+    variant: k,
+    status: E,
+    label: f,
+    description: u,
+    id: K,
+    name: w,
+    className: B,
+    style: T,
+    disabled: U,
+    checked: S,
+    defaultChecked: j = !1,
+    onChange: n,
+    ...F
+  }, G) => {
+    var I;
+    const C = is(), s = ls(), e = (I = C.components) == null ? void 0 : I.radio, Z = rs(), $ = K ?? Z, P = w ?? (s == null ? void 0 : s.name), l = U ?? (s == null ? void 0 : s.disabled) ?? !1, [V, q] = ts(j), d = s ? s.value === t : S ?? V, c = A(
+      z ?? (s == null ? void 0 : s.size),
+      e == null ? void 0 : e.size,
+      void 0,
+      a.size
+    ), H = A(
+      k ?? (s == null ? void 0 : s.variant),
+      e == null ? void 0 : e.variant,
+      void 0,
+      a.variant
+    ), J = A(
+      D ?? (s == null ? void 0 : s.color),
+      e == null ? void 0 : e.color,
+      C.defaultColor,
+      a.color
+    ), M = E ?? (s == null ? void 0 : s.status) ?? a.status, R = H === "card", v = ns(
+      L,
+      e == null ? void 0 : e.radius,
+      void 0,
+      a.radius
+    ), Q = R && v === "full" ? "xl" : v, W = r(
+      c,
+      ds,
+      a.size
+    ), X = r(
+      c,
+      cs,
+      a.size
+    ), Y = r(
+      c,
+      ms,
+      a.size
+    ), g = r(
+      c,
+      fs,
+      a.size
+    ), _ = r(
+      v,
+      N,
+      a.radius
+    ), ss = r(
+      Q,
+      N,
+      "xl"
+    ), m = O[J] ?? O.primary, p = h[M] ?? h.default, es = os(
+      (x) => {
+        var b;
+        l || (s ? (b = s.onChange) == null || b.call(s, t) : S === void 0 && q(!0), n == null || n(x.target.checked, t, x));
+      },
+      [S, s, l, n, t]
+    );
+    return /* @__PURE__ */ y(
+      "label",
+      {
+        className: i(
+          "relative inline-flex items-start select-none cursor-pointer transition-all duration-150 shrink-0",
+          g,
+          R ? i("p-3 border bg-background", ss) : "",
+          R && (d ? `${m.border} ${m.cardBg}` : p),
+          l && "opacity-50 pointer-events-none cursor-not-allowed",
+          B
+        ),
+        style: T,
+        children: [
+          /* @__PURE__ */ o(
+            "input",
+            {
+              ref: G,
+              id: $,
+              type: "radio",
+              name: P,
+              value: t,
+              checked: d,
+              disabled: l,
+              onChange: es,
+              className: "sr-only peer",
+              ...F
+            }
+          ),
+          /* @__PURE__ */ o(
+            "div",
+            {
+              className: i(
+                "shrink-0 flex items-center justify-center border-2 transition-all duration-150 mt-0.5",
+                "peer-focus-visible:ring-2 peer-focus-visible:ring-primary peer-focus-visible:ring-offset-2",
+                W,
+                _,
+                d ? m.border : p
+              ),
+              children: /* @__PURE__ */ o(
+                "span",
+                {
+                  className: i(
+                    X,
+                    _,
+                    m.bg,
+                    "transition-all duration-200 ease-in-out transform-gpu",
+                    d ? "scale-100 opacity-100" : "scale-0 opacity-0"
+                  )
+                }
+              )
+            }
+          ),
+          (f || u) && /* @__PURE__ */ y("div", { className: "flex flex-col min-w-0", children: [
+            f && /* @__PURE__ */ o(
+              "span",
+              {
+                className: i(
+                  "font-medium text-foreground leading-snug",
+                  Y
+                ),
+                children: f
+              }
+            ),
+            u && /* @__PURE__ */ o("span", { className: "text-xs sm:text-sm text-foreground/70 leading-snug mt-0.5", children: u })
+          ] })
+        ]
+      }
+    );
+  }
+);
+us.displayName = "Radio";
+export {
+  us as Radio
+};

package/dist/components/radio/RadioGroup.d.ts

@@ -0,0 +1,25 @@
+import { ReactNode } from 'react';
+import { Color } from '../../shared/variant';
+import { FieldSizeKey, FieldStatus, LabelAlign } from '../field/field-config';
+import { RadioVariant } from './radio-config';
+export interface RadioGroupProps {
+    children: ReactNode;
+    name?: string;
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    size?: FieldSizeKey;
+    color?: Color;
+    variant?: RadioVariant;
+    orientation?: "horizontal" | "vertical";
+    status?: FieldStatus;
+    label?: string;
+    labelAlign?: LabelAlign;
+    description?: string;
+    message?: string;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+}
+export declare const RadioGroup: import('react').ForwardRefExoticComponent<RadioGroupProps & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=RadioGroup.d.ts.map

package/dist/components/radio/RadioGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/radio/RadioGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAc,KAAK,SAAS,EAAS,MAAM,OAAO,CAAC;AAE1D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAGlD,OAAO,KAAK,EACV,YAAY,EACZ,WAAW,EACX,UAAU,EACX,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAGL,KAAK,YAAY,EAClB,MAAM,gBAAgB,CAAC;AAKxB,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,eAAO,MAAM,UAAU,4GAyEtB,CAAC"}