@simplysm/solid 13.0.74 → 13.0.76

package/dist/components/form-control/checkbox/Checkbox.js

@@ -1,102 +1,21 @@
-import { template as _$template } from "solid-js/web";
-import { className as _$className } from "solid-js/web";
-import { effect as _$effect } from "solid-js/web";
-import { insert as _$insert } from "solid-js/web";
 import { createComponent as _$createComponent } from "solid-js/web";
-import { use as _$use } from "solid-js/web";
-import { spread as _$spread } from "solid-js/web";
 import { mergeProps as _$mergeProps } from "solid-js/web";
-import { memo as _$memo } from "solid-js/web";
-var _tmpl$ = /* @__PURE__ */ _$template(`<span>`), _tmpl$2 = /* @__PURE__ */ _$template(`<div><div>`);
-import { Show, splitProps, createMemo } from "solid-js";
-import { twMerge } from "tailwind-merge";
 import { IconCheck } from "@tabler/icons-solidjs";
-import { createControllableSignal } from "../../../hooks/createControllableSignal.js";
-import { ripple } from "../../../directives/ripple.js";
 import { Icon } from "../../display/Icon.js";
-import { useI18n } from "../../../providers/i18n/I18nContext.js";
-import { checkboxBaseClass, indicatorBaseClass, checkedClass, checkboxSizeClasses, checkboxInsetClass, checkboxInsetSizeHeightClasses, checkboxInlineClass, checkboxDisabledClass } from "./Checkbox.styles.js";
-import { Invalid } from "../Invalid.js";
-void ripple;
-const Checkbox = (props) => {
-  const [local, rest] = splitProps(props, ["value", "onValueChange", "disabled", "size", "inset", "inline", "required", "validate", "touchMode", "class", "style", "children"]);
-  const i18n = useI18n();
-  const [value, setValue] = createControllableSignal({
-    value: () => local.value ?? false,
-    onChange: () => local.onValueChange
-  });
-  const handleClick = () => {
-    if (local.disabled) return;
-    setValue((v) => !v);
-  };
-  const handleKeyDown = (e) => {
-    if (e.key === " ") {
-      e.preventDefault();
-      handleClick();
-    }
-  };
-  const getWrapperClass = () => twMerge(checkboxBaseClass, local.size && checkboxSizeClasses[local.size], local.inset && checkboxInsetClass, local.inset && local.size && checkboxInsetSizeHeightClasses[local.size], local.inline && checkboxInlineClass, local.disabled && checkboxDisabledClass, local.class);
-  const getIndicatorClass = () => twMerge(indicatorBaseClass, "rounded-sm", value() && checkedClass);
-  const errorMsg = createMemo(() => {
-    var _a;
-    const v = local.value ?? false;
-    if (local.required && !v) return i18n.t("validation.requiredSelection");
-    return (_a = local.validate) == null ? void 0 : _a.call(local, v);
-  });
-  return _$createComponent(Invalid, {
-    get message() {
-      return errorMsg();
-    },
-    variant: "border",
-    get touchMode() {
-      return local.touchMode;
-    },
-    get children() {
-      var _el$ = _tmpl$2(), _el$2 = _el$.firstChild;
-      _$use(ripple, _el$, () => !local.disabled);
-      _$spread(_el$, _$mergeProps(rest, {
-        "role": "checkbox",
-        get ["aria-checked"]() {
-          return value();
-        },
-        get tabIndex() {
-          return local.disabled ? -1 : 0;
-        },
-        get ["class"]() {
-          return getWrapperClass();
-        },
-        get style() {
-          return local.style;
-        },
-        "onClick": handleClick,
-        "onKeyDown": handleKeyDown
-      }), false, true);
-      _$insert(_el$2, _$createComponent(Show, {
-        get when() {
-          return value();
-        },
-        get children() {
-          return _$createComponent(Icon, {
-            icon: IconCheck,
-            size: "1em"
-          });
-        }
-      }));
-      _$insert(_el$, _$createComponent(Show, {
-        get when() {
-          return local.children;
-        },
-        get children() {
-          var _el$3 = _tmpl$();
-          _$insert(_el$3, () => local.children);
-          return _el$3;
-        }
-      }), null);
-      _$effect(() => _$className(_el$2, getIndicatorClass()));
-      return _el$;
-    }
-  });
-};
+import { SelectableBase } from "./SelectableBase.js";
+const Checkbox = (props) => _$createComponent(SelectableBase, _$mergeProps(props, {
+  get config() {
+    return {
+      role: "checkbox",
+      indicatorShape: "rounded-sm",
+      indicatorContent: _$createComponent(Icon, {
+        icon: IconCheck,
+        size: "1em"
+      }),
+      onToggle: (v) => !v
+    };
+  }
+}));
 export {
   Checkbox
 };

package/dist/components/form-control/checkbox/Checkbox.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/form-control/checkbox/Checkbox.tsx"],
-  "mappings": "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",
-  "names": ["Show", "splitProps", "createMemo", "twMerge", "IconCheck", "createControllableSignal", "ripple", "Icon", "useI18n", "checkboxBaseClass", "indicatorBaseClass", "checkedClass", "checkboxSizeClasses", "checkboxInsetClass", "checkboxInsetSizeHeightClasses", "checkboxInlineClass", "checkboxDisabledClass", "Invalid", "Checkbox", "props", "local", "rest", "i18n", "value", "setValue", "onChange", "onValueChange", "handleClick", "disabled", "v", "handleKeyDown", "e", "key", "preventDefault", "getWrapperClass", "size", "inset", "inline", "class", "getIndicatorClass", "errorMsg", "required", "t", "validate", "_$createComponent", "message", "variant", "touchMode", "children", "_el$", "_tmpl$2", "_el$2", "firstChild", "_$use", "_$spread", "_$mergeProps", "tabIndex", "style", "_$insert", "when", "icon", "_el$3", "_tmpl$", "_$effect", "_$className"]
+  "mappings": ";;AACA,SAASA,iBAAiB;AAE1B,SAASC,YAAY;AACrB,SAASC,sBAAsB;AAiBxB,MAAMC,WAA4CC,WAAKC,kBAC3DH,gBAAcI,aACTF,OAAK;EAAA,IACTG,SAAM;AAAA,WAAE;MACNC,MAAM;MACNC,gBAAgB;MAChBC,kBAAgBL,kBAAGJ,MAAI;QAACU,MAAMX;QAAWY,MAAI;MAAA,CAAA;MAC7CC,UAAWC,OAAM,CAACA;IACpB;EAAC;AAAA,CAAA,CAAA;",
+  "names": ["IconCheck", "Icon", "SelectableBase", "Checkbox", "props", "_$createComponent", "_$mergeProps", "config", "role", "indicatorShape", "indicatorContent", "icon", "size", "onToggle", "v"]
 }

package/dist/components/form-control/checkbox/Checkbox.styles.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentSize } from "../../../styles/tokens.styles";
+import { type ComponentSize } from "../../../styles/control.styles";
 export type CheckboxSize = ComponentSize;
 export declare const checkboxBaseClass: string;
 export declare const indicatorBaseClass: string;
@@ -7,5 +7,5 @@ export declare const checkboxSizeClasses: Record<CheckboxSize, string>;
 export declare const checkboxInsetClass: string;
 export declare const checkboxInsetSizeHeightClasses: Record<CheckboxSize, string>;
 export declare const checkboxInlineClass: string;
-export declare const checkboxDisabledClass = "cursor-default opacity-30 pointer-events-none";
+export declare const checkboxDisabledClass: string;
 //# sourceMappingURL=Checkbox.styles.d.ts.map

package/dist/components/form-control/checkbox/Checkbox.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.styles.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\Checkbox.styles.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,aAAa,EAMnB,MAAM,+BAA+B,CAAC;AAGvC,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC;AAGzC,eAAO,MAAM,iBAAiB,QAU7B,CAAC;AAGF,eAAO,MAAM,kBAAkB,QAQ9B,CAAC;AAGF,eAAO,MAAM,YAAY,QAA0D,CAAC;AAGpF,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAK5D,CAAC;AAGF,eAAO,MAAM,kBAAkB,QAI9B,CAAC;AAGF,eAAO,MAAM,8BAA8B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAKvE,CAAC;AAGF,eAAO,MAAM,mBAAmB,QAAmC,CAAC;AAGpE,eAAO,MAAM,qBAAqB,kDAAkB,CAAC"}
+{"version":3,"file":"Checkbox.styles.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\Checkbox.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAmB,MAAM,gCAAgC,CAAC;AAErF,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC;AAGzC,eAAO,MAAM,iBAAiB,QAQ7B,CAAC;AAGF,eAAO,MAAM,kBAAkB,QAQ9B,CAAC;AAGF,eAAO,MAAM,YAAY,QAA0D,CAAC;AAGpF,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAM5D,CAAC;AAGF,eAAO,MAAM,kBAAkB,QAM9B,CAAC;AAGF,eAAO,MAAM,8BAA8B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAMvE,CAAC;AAGF,eAAO,MAAM,mBAAmB,QAAuC,CAAC;AAGxE,eAAO,MAAM,qBAAqB,QAAuB,CAAC"}

package/dist/components/form-control/checkbox/Checkbox.styles.js

@@ -1,19 +1,10 @@
 import clsx from "clsx";
-import {
-  borderDefault,
-  disabledOpacity,
-  paddingLg,
-  paddingSm,
-  paddingXl,
-  paddingXs
-} from "../../../styles/tokens.styles.js";
-import { insetBase, insetFocusOutlineSelf } from "../../../styles/patterns.styles.js";
+import { border } from "../../../styles/base.styles.js";
+import { state, gap, pad } from "../../../styles/control.styles.js";
 const checkboxBaseClass = clsx(
   "inline-flex items-center gap-2",
   "whitespace-nowrap",
   "cursor-pointer",
-  "px-2 py-1",
-  "h-field",
   "border border-transparent",
   "rounded",
   "focus:outline-none",
@@ -23,31 +14,35 @@ const indicatorBaseClass = clsx(
   "flex shrink-0 items-center justify-center",
   "size-4",
   "border",
-  borderDefault,
-  // bgSurface,
+  border.default,
+  // bg.surface,
   "bg-primary-50 dark:bg-primary-950/30",
   "transition-colors"
 );
 const checkedClass = clsx("border-primary-500 bg-primary-500", "text-white");
 const checkboxSizeClasses = {
-  xs: clsx("h-field-xs", paddingXs),
-  sm: clsx("h-field-sm", paddingSm),
-  lg: clsx("h-field-lg", paddingLg),
-  xl: clsx("h-field-xl", paddingXl)
+  default: clsx("h-field", pad.default),
+  xs: clsx("h-field-xs", pad.xs),
+  sm: clsx("h-field-sm", pad.sm),
+  lg: clsx("h-field-lg", pad.lg),
+  xl: clsx("h-field-xl", pad.xl)
 };
 const checkboxInsetClass = clsx(
+  "w-full rounded-none border-none",
   "h-field-inset justify-center bg-transparent",
-  insetBase,
-  insetFocusOutlineSelf
+  "focus:[outline-style:solid]",
+  "focus:outline-1 focus:-outline-offset-1",
+  "focus:outline-primary-400 dark:focus:outline-primary-400"
 );
 const checkboxInsetSizeHeightClasses = {
-  xs: "h-field-inset-xs",
-  sm: "h-field-inset-sm",
-  lg: "h-field-inset-lg",
-  xl: "h-field-inset-xl"
+  default: clsx`h-field-inset`,
+  xs: clsx`h-field-inset-xs`,
+  sm: clsx`h-field-inset-sm`,
+  lg: clsx`h-field-inset-lg`,
+  xl: clsx`h-field-inset-xl`
 };
-const checkboxInlineClass = clsx("!h-auto", "!p-0", "gap-1");
-const checkboxDisabledClass = disabledOpacity;
+const checkboxInlineClass = clsx("!h-auto", "!p-0", gap.default);
+const checkboxDisabledClass = clsx(state.disabled);
 export {
   checkboxBaseClass,
   checkboxDisabledClass,

package/dist/components/form-control/checkbox/Checkbox.styles.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/form-control/checkbox/Checkbox.styles.ts"],
-  "mappings": "AAAA,OAAO,UAAU;AACjB;AAAA,EACE;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAAW,6BAA6B;AAK1C,MAAM,oBAAoB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAGO,MAAM,qBAAqB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AACF;AAGO,MAAM,eAAe,KAAK,qCAAqC,YAAY;AAG3E,MAAM,sBAAoD;AAAA,EAC/D,IAAI,KAAK,cAAc,SAAS;AAAA,EAChC,IAAI,KAAK,cAAc,SAAS;AAAA,EAChC,IAAI,KAAK,cAAc,SAAS;AAAA,EAChC,IAAI,KAAK,cAAc,SAAS;AAClC;AAGO,MAAM,qBAAqB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACF;AAGO,MAAM,iCAA+D;AAAA,EAC1E,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAGO,MAAM,sBAAsB,KAAK,WAAW,QAAQ,OAAO;AAG3D,MAAM,wBAAwB;",
+  "mappings": "AAAA,OAAO,UAAU;AACjB,SAAS,cAAc;AACvB,SAA6B,OAAO,KAAK,WAAW;AAK7C,MAAM,oBAAoB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAGO,MAAM,qBAAqB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA;AAAA,EAEP;AAAA,EACA;AACF;AAGO,MAAM,eAAe,KAAK,qCAAqC,YAAY;AAG3E,MAAM,sBAAoD;AAAA,EAC/D,SAAS,KAAK,WAAW,IAAI,OAAO;AAAA,EACpC,IAAI,KAAK,cAAc,IAAI,EAAE;AAAA,EAC7B,IAAI,KAAK,cAAc,IAAI,EAAE;AAAA,EAC7B,IAAI,KAAK,cAAc,IAAI,EAAE;AAAA,EAC7B,IAAI,KAAK,cAAc,IAAI,EAAE;AAC/B;AAGO,MAAM,qBAAqB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAGO,MAAM,iCAA+D;AAAA,EAC1E,SAAS;AAAA,EACT,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAGO,MAAM,sBAAsB,KAAK,WAAW,QAAQ,IAAI,OAAO;AAG/D,MAAM,wBAAwB,KAAK,MAAM,QAAQ;",
   "names": []
 }

package/dist/components/form-control/checkbox/CheckboxGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\CheckboxGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,UAAU,CAAC;AAGpC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,UAAU,kBAAkB,CAAC,MAAM;IACjC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACxB;AAED,UAAU,sBAAsB;IAC9B,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE,kBAAkB,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC;IACnE,IAAI,EAAE,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE;QAC9B,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;KACxB,KAAK,GAAG,CAAC,OAAO,CAAC;CACnB;AASD,eAAO,MAAM,aAAa,EAAuB,sBAAsB,CAAC"}
+{"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\CheckboxGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAA6B,MAAM,UAAU,CAAC;AAE/D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAetD,UAAU,kBAAkB,CAAC,MAAM;IACjC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACxB;AAsED,UAAU,sBAAsB;IAC9B,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE,kBAAkB,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC;IACnE,IAAI,EAAE,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE;QAC9B,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;KACxB,KAAK,GAAG,CAAC,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,aAAa,EAEpB,sBAAsB,CAAC"}

package/dist/components/form-control/checkbox/CheckboxGroup.js

@@ -1,14 +1,89 @@
+import { createComponent as _$createComponent } from "solid-js/web";
+import { memo as _$memo } from "solid-js/web";
+import { createContext, useContext } from "solid-js";
 import { Checkbox } from "./Checkbox.js";
-import { createSelectionGroup } from "../../../hooks/createSelectionGroup.js";
-const {
-  Group
-} = createSelectionGroup({
-  mode: "multiple",
-  contextName: "CheckboxGroup",
-  ItemComponent: Checkbox,
-  emptyErrorMsgKey: "validation.selectItem"
+import { createControllableSignal } from "../../../hooks/createControllableSignal.js";
+import { SelectionGroupBase } from "./SelectionGroupBase.js";
+const CheckboxGroupCtx = createContext();
+function CheckboxGroupInner(props) {
+  const [value, setValue] = createControllableSignal({
+    value: () => props.value ?? [],
+    onChange: () => props.onValueChange
+  });
+  const toggle = (item) => {
+    setValue((prev) => {
+      if (prev.includes(item)) return prev.filter((v) => v !== item);
+      return [...prev, item];
+    });
+  };
+  const contextValue = {
+    value,
+    toggle,
+    disabled: () => props.disabled ?? false,
+    size: () => props.size,
+    inline: () => props.inline ?? false,
+    inset: () => props.inset ?? false
+  };
+  return _$createComponent(SelectionGroupBase, {
+    context: CheckboxGroupCtx,
+    contextValue,
+    errorMsgKey: "validation.selectItem",
+    get value() {
+      return props.value ?? [];
+    },
+    isEmpty: (v) => v.length === 0,
+    get validate() {
+      return props.validate;
+    },
+    get required() {
+      return props.required;
+    },
+    get touchMode() {
+      return props.touchMode;
+    },
+    get ["class"]() {
+      return props.class;
+    },
+    get style() {
+      return props.style;
+    },
+    get children() {
+      return props.children;
+    }
+  });
+}
+function CheckboxGroupItem(props) {
+  const ctx = useContext(CheckboxGroupCtx);
+  if (!ctx) throw new Error("CheckboxGroup.Item can only be used inside CheckboxGroup");
+  const isSelected = () => ctx.value().includes(props.value);
+  const handleChange = () => {
+    ctx.toggle(props.value);
+  };
+  return _$createComponent(Checkbox, {
+    get value() {
+      return isSelected();
+    },
+    onValueChange: handleChange,
+    get disabled() {
+      return props.disabled ?? ctx.disabled();
+    },
+    get size() {
+      return ctx.size();
+    },
+    get inline() {
+      return ctx.inline();
+    },
+    get inset() {
+      return ctx.inset();
+    },
+    get children() {
+      return props.children;
+    }
+  });
+}
+const CheckboxGroup = Object.assign(CheckboxGroupInner, {
+  Item: CheckboxGroupItem
 });
-const CheckboxGroup = Group;
 export {
   CheckboxGroup
 };

package/dist/components/form-control/checkbox/CheckboxGroup.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/form-control/checkbox/CheckboxGroup.tsx"],
-  "mappings": "AACA,SAASA,gBAAgB;AACzB,SAASC,4BAA4B;AA2BrC,MAAM;EAAEC;AAAM,IAAID,qBAAqB;EACrCE,MAAM;EACNC,aAAa;EACbC,eAAeL;EACfM,kBAAkB;AACpB,CAAC;AAEM,MAAMC,gBAAgBL;",
-  "names": ["Checkbox", "createSelectionGroup", "Group", "mode", "contextName", "ItemComponent", "emptyErrorMsgKey", "CheckboxGroup"]
+  "mappings": ";;AAAA,SAAmBA,eAAeC,kBAAkB;AACpD,SAASC,gBAAgB;AAEzB,SAASC,gCAAgC;AACzC,SAASC,0BAA0B;AAWnC,MAAMC,mBAAmBL,cAAyC;AAiBlE,SAASM,mBAAqCC,OAAgD;AAC5F,QAAM,CAACC,OAAOC,QAAQ,IAAIN,yBAAyB;IACjDK,OAAOA,MAAMD,MAAMC,SAAU,CAAA;IAC7BE,UAAUA,MAAMH,MAAMI;EACxB,CAAC;AAED,QAAMC,SAAUC,UAAiB;AAC/BJ,aAAUK,UAAS;AACjB,UAAIA,KAAKC,SAASF,IAAI,EAAG,QAAOC,KAAKE,OAAQC,OAAMA,MAAMJ,IAAI;AAC7D,aAAO,CAAC,GAAGC,MAAMD,IAAI;IACvB,CAAC;EACH;AAEA,QAAMK,eAA6C;IACjDV;IACAI;IACAO,UAAUA,MAAMZ,MAAMY,YAAY;IAClCC,MAAMA,MAAMb,MAAMa;IAClBC,QAAQA,MAAMd,MAAMc,UAAU;IAC9BC,OAAOA,MAAMf,MAAMe,SAAS;EAC9B;AAEA,SAAAC,kBACGnB,oBAAkB;IACjBoB,SAASnB;IACTa;IACAO,aAAW;IAAA,IACXjB,QAAK;AAAA,aAAED,MAAMC,SAAS,CAAA;IAAE;IACxBkB,SAAUT,OAAOA,EAAgBU,WAAW;IAAC,IAC7CC,WAAQ;AAAA,aAAErB,MAAMqB;IAAQ;IAAA,IACxBC,WAAQ;AAAA,aAAEtB,MAAMsB;IAAQ;IAAA,IACxBC,YAAS;AAAA,aAAEvB,MAAMuB;IAAS;IAAA,KAAA,OAAA,IAAA;AAAA,aACnBvB,MAAMwB;IAAK;IAAA,IAClBC,QAAK;AAAA,aAAEzB,MAAMyB;IAAK;IAAA,IAAAC,WAAA;AAAA,aAEjB1B,MAAM0B;IAAQ;EAAA,CAAA;AAGrB;AAEA,SAASC,kBAAoC3B,OAI7B;AACd,QAAM4B,MAAMlC,WAAWI,gBAAgB;AACvC,MAAI,CAAC8B,IAAK,OAAM,IAAIC,MAAM,0DAA0D;AAEpF,QAAMC,aAAaA,MAAMF,IAAI3B,MAAM,EAAEO,SAASR,MAAMC,KAAK;AAEzD,QAAM8B,eAAeA,MAAM;AACzBH,QAAIvB,OAAOL,MAAMC,KAAK;EACxB;AAEA,SAAAe,kBACGrB,UAAQ;IAAA,IACPM,QAAK;AAAA,aAAE6B,WAAW;IAAC;IACnB1B,eAAe2B;IAAY,IAC3BnB,WAAQ;AAAA,aAAEZ,MAAMY,YAAYgB,IAAIhB,SAAS;IAAC;IAAA,IAC1CC,OAAI;AAAA,aAAEe,IAAIf,KAAK;IAAC;IAAA,IAChBC,SAAM;AAAA,aAAEc,IAAId,OAAO;IAAC;IAAA,IACpBC,QAAK;AAAA,aAAEa,IAAIb,MAAM;IAAC;IAAA,IAAAW,WAAA;AAAA,aAEjB1B,MAAM0B;IAAQ;EAAA,CAAA;AAGrB;AAWO,MAAMM,gBAAgBC,OAAOC,OAAOnC,oBAAoB;EAC7DoC,MAAMR;AACR,CAAC;",
+  "names": ["createContext", "useContext", "Checkbox", "createControllableSignal", "SelectionGroupBase", "CheckboxGroupCtx", "CheckboxGroupInner", "props", "value", "setValue", "onChange", "onValueChange", "toggle", "item", "prev", "includes", "filter", "v", "contextValue", "disabled", "size", "inline", "inset", "_$createComponent", "context", "errorMsgKey", "isEmpty", "length", "validate", "required", "touchMode", "class", "style", "children", "CheckboxGroupItem", "ctx", "Error", "isSelected", "handleChange", "CheckboxGroup", "Object", "assign", "Item"]
 }

package/dist/components/form-control/checkbox/Radio.d.ts

@@ -1,5 +1,5 @@
 import { type JSX, type ParentComponent } from "solid-js";
-import { type CheckboxSize } from "./Checkbox.styles";
+import type { CheckboxSize } from "./Checkbox.styles";
 export interface RadioProps {
     value?: boolean;
     onValueChange?: (value: boolean) => void;

package/dist/components/form-control/checkbox/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,eAAe,EAAgC,MAAM,UAAU,CAAC;AAMxF,OAAO,EACL,KAAK,YAAY,EASlB,MAAM,mBAAmB,CAAC;AAQ3B,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,KAAK,EAAE,eAAe,CAAC,UAAU,CA+E7C,CAAC"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AAC1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGtD,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,KAAK,EAAE,eAAe,CAAC,UAAU,CAU7C,CAAC"}

package/dist/components/form-control/checkbox/Radio.js

@@ -1,101 +1,18 @@
 import { template as _$template } from "solid-js/web";
-import { effect as _$effect } from "solid-js/web";
-import { insert as _$insert } from "solid-js/web";
 import { createComponent as _$createComponent } from "solid-js/web";
-import { className as _$className } from "solid-js/web";
-import { use as _$use } from "solid-js/web";
-import { spread as _$spread } from "solid-js/web";
 import { mergeProps as _$mergeProps } from "solid-js/web";
-import { memo as _$memo } from "solid-js/web";
-var _tmpl$ = /* @__PURE__ */ _$template(`<div>`), _tmpl$2 = /* @__PURE__ */ _$template(`<span>`), _tmpl$3 = /* @__PURE__ */ _$template(`<div><div>`);
-import { Show, splitProps, createMemo } from "solid-js";
-import { twMerge } from "tailwind-merge";
-import { createControllableSignal } from "../../../hooks/createControllableSignal.js";
-import { ripple } from "../../../directives/ripple.js";
-import clsx from "clsx";
-import { useI18n } from "../../../providers/i18n/I18nContext.js";
-import { checkboxBaseClass, indicatorBaseClass, checkedClass, checkboxSizeClasses, checkboxInsetClass, checkboxInsetSizeHeightClasses, checkboxInlineClass, checkboxDisabledClass } from "./Checkbox.styles.js";
-import { Invalid } from "../Invalid.js";
-const radioDotClass = clsx("size-2", "rounded-full", "bg-current");
-void ripple;
-const Radio = (props) => {
-  const [local, rest] = splitProps(props, ["value", "onValueChange", "disabled", "size", "inset", "inline", "required", "validate", "touchMode", "class", "style", "children"]);
-  const i18n = useI18n();
-  const [value, setValue] = createControllableSignal({
-    value: () => local.value ?? false,
-    onChange: () => local.onValueChange
-  });
-  const handleClick = () => {
-    if (local.disabled) return;
-    setValue(true);
-  };
-  const handleKeyDown = (e) => {
-    if (e.key === " ") {
-      e.preventDefault();
-      handleClick();
-    }
-  };
-  const getWrapperClass = () => twMerge(checkboxBaseClass, local.size && checkboxSizeClasses[local.size], local.inset && checkboxInsetClass, local.inset && local.size && checkboxInsetSizeHeightClasses[local.size], local.inline && checkboxInlineClass, local.disabled && checkboxDisabledClass, local.class);
-  const getIndicatorClass = () => twMerge(indicatorBaseClass, "rounded-full", value() && checkedClass);
-  const errorMsg = createMemo(() => {
-    var _a;
-    const v = local.value ?? false;
-    if (local.required && !v) return i18n.t("validation.requiredSelection");
-    return (_a = local.validate) == null ? void 0 : _a.call(local, v);
-  });
-  return _$createComponent(Invalid, {
-    get message() {
-      return errorMsg();
-    },
-    variant: "border",
-    get touchMode() {
-      return local.touchMode;
-    },
-    get children() {
-      var _el$ = _tmpl$3(), _el$2 = _el$.firstChild;
-      _$use(ripple, _el$, () => !local.disabled);
-      _$spread(_el$, _$mergeProps(rest, {
-        "role": "radio",
-        get ["aria-checked"]() {
-          return value();
-        },
-        get tabIndex() {
-          return local.disabled ? -1 : 0;
-        },
-        get ["class"]() {
-          return getWrapperClass();
-        },
-        get style() {
-          return local.style;
-        },
-        "onClick": handleClick,
-        "onKeyDown": handleKeyDown
-      }), false, true);
-      _$insert(_el$2, _$createComponent(Show, {
-        get when() {
-          return value();
-        },
-        get children() {
-          var _el$3 = _tmpl$();
-          _$className(_el$3, radioDotClass);
-          return _el$3;
-        }
-      }));
-      _$insert(_el$, _$createComponent(Show, {
-        get when() {
-          return local.children;
-        },
-        get children() {
-          var _el$4 = _tmpl$2();
-          _$insert(_el$4, () => local.children);
-          return _el$4;
-        }
-      }), null);
-      _$effect(() => _$className(_el$2, getIndicatorClass()));
-      return _el$;
-    }
-  });
-};
+var _tmpl$ = /* @__PURE__ */ _$template(`<div class="size-2 rounded-full bg-current">`);
+import { SelectableBase } from "./SelectableBase.js";
+const Radio = (props) => _$createComponent(SelectableBase, _$mergeProps(props, {
+  get config() {
+    return {
+      role: "radio",
+      indicatorShape: "rounded-full",
+      indicatorContent: _tmpl$(),
+      onToggle: () => true
+    };
+  }
+}));
 export {
   Radio
 };

package/dist/components/form-control/checkbox/Radio.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/form-control/checkbox/Radio.tsx"],
-  "mappings": "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",
-  "names": ["Show", "splitProps", "createMemo", "twMerge", "createControllableSignal", "ripple", "clsx", "useI18n", "checkboxBaseClass", "indicatorBaseClass", "checkedClass", "checkboxSizeClasses", "checkboxInsetClass", "checkboxInsetSizeHeightClasses", "checkboxInlineClass", "checkboxDisabledClass", "Invalid", "radioDotClass", "Radio", "props", "local", "rest", "i18n", "value", "setValue", "onChange", "onValueChange", "handleClick", "disabled", "handleKeyDown", "e", "key", "preventDefault", "getWrapperClass", "size", "inset", "inline", "class", "getIndicatorClass", "errorMsg", "v", "required", "t", "validate", "_$createComponent", "message", "variant", "touchMode", "children", "_el$", "_tmpl$3", "_el$2", "firstChild", "_$use", "_$spread", "_$mergeProps", "tabIndex", "style", "_$insert", "when", "_el$3", "_tmpl$", "_$className", "_el$4", "_tmpl$2", "_$effect"]
+  "mappings": ";;;;AAEA,SAASA,sBAAsB;AAiBxB,MAAMC,QAAsCC,WAAKC,kBACrDH,gBAAcI,aACTF,OAAK;EAAA,IACTG,SAAM;AAAA,WAAE;MACNC,MAAM;MACNC,gBAAgB;MAChBC,kBAAgBC,OAAA;MAChBC,UAAUA,MAAM;IAClB;EAAC;AAAA,CAAA,CAAA;",
+  "names": ["SelectableBase", "Radio", "props", "_$createComponent", "_$mergeProps", "config", "role", "indicatorShape", "indicatorContent", "_tmpl$", "onToggle"]
 }

package/dist/components/form-control/checkbox/RadioGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,UAAU,CAAC;AAGpC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,UAAU,eAAe,CAAC,MAAM;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,MAAM,GAAG,SAAS,CAAC;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACxB;AAED,UAAU,mBAAmB;IAC3B,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC;IAChE,IAAI,EAAE,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE;QAC9B,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;KACxB,KAAK,GAAG,CAAC,OAAO,CAAC;CACnB;AASD,eAAO,MAAM,UAAU,EAAuB,mBAAmB,CAAC"}
+{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\form-control\\checkbox\\RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAA6B,MAAM,UAAU,CAAC;AAE/D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAetD,UAAU,eAAe,CAAC,MAAM;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,MAAM,GAAG,SAAS,CAAC;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACxB;AAmED,UAAU,mBAAmB;IAC3B,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC;IAChE,IAAI,EAAE,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE;QAC9B,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;KACxB,KAAK,GAAG,CAAC,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,UAAU,EAEjB,mBAAmB,CAAC"}

package/dist/components/form-control/checkbox/RadioGroup.js

@@ -1,14 +1,86 @@
+import { memo as _$memo } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { createContext, useContext } from "solid-js";
 import { Radio } from "./Radio.js";
-import { createSelectionGroup } from "../../../hooks/createSelectionGroup.js";
-const {
-  Group
-} = createSelectionGroup({
-  mode: "single",
-  contextName: "RadioGroup",
-  ItemComponent: Radio,
-  emptyErrorMsgKey: "validation.selectItem"
+import { createControllableSignal } from "../../../hooks/createControllableSignal.js";
+import { SelectionGroupBase } from "./SelectionGroupBase.js";
+const RadioGroupCtx = createContext();
+function RadioGroupInner(props) {
+  const [value, setValue] = createControllableSignal({
+    value: () => props.value,
+    onChange: () => props.onValueChange
+  });
+  const select = (item) => {
+    setValue(item);
+  };
+  const contextValue = {
+    value,
+    select,
+    disabled: () => props.disabled ?? false,
+    size: () => props.size,
+    inline: () => props.inline ?? false,
+    inset: () => props.inset ?? false
+  };
+  return _$createComponent(SelectionGroupBase, {
+    context: RadioGroupCtx,
+    contextValue,
+    errorMsgKey: "validation.selectItem",
+    get value() {
+      return props.value;
+    },
+    isEmpty: (v) => v === void 0 || v === null,
+    get validate() {
+      return props.validate;
+    },
+    get required() {
+      return props.required;
+    },
+    get touchMode() {
+      return props.touchMode;
+    },
+    get ["class"]() {
+      return props.class;
+    },
+    get style() {
+      return props.style;
+    },
+    get children() {
+      return props.children;
+    }
+  });
+}
+function RadioGroupItem(props) {
+  const ctx = useContext(RadioGroupCtx);
+  if (!ctx) throw new Error("RadioGroup.Item can only be used inside RadioGroup");
+  const isSelected = () => ctx.value() === props.value;
+  const handleChange = () => {
+    ctx.select(props.value);
+  };
+  return _$createComponent(Radio, {
+    get value() {
+      return isSelected();
+    },
+    onValueChange: handleChange,
+    get disabled() {
+      return props.disabled ?? ctx.disabled();
+    },
+    get size() {
+      return ctx.size();
+    },
+    get inline() {
+      return ctx.inline();
+    },
+    get inset() {
+      return ctx.inset();
+    },
+    get children() {
+      return props.children;
+    }
+  });
+}
+const RadioGroup = Object.assign(RadioGroupInner, {
+  Item: RadioGroupItem
 });
-const RadioGroup = Group;
 export {
   RadioGroup
 };

package/dist/components/form-control/checkbox/RadioGroup.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/form-control/checkbox/RadioGroup.tsx"],
-  "mappings": "AACA,SAASA,aAAa;AACtB,SAASC,4BAA4B;AA2BrC,MAAM;EAAEC;AAAM,IAAID,qBAAqB;EACrCE,MAAM;EACNC,aAAa;EACbC,eAAeL;EACfM,kBAAkB;AACpB,CAAC;AAEM,MAAMC,aAAaL;",
-  "names": ["Radio", "createSelectionGroup", "Group", "mode", "contextName", "ItemComponent", "emptyErrorMsgKey", "RadioGroup"]
+  "mappings": ";;AAAA,SAAmBA,eAAeC,kBAAkB;AACpD,SAASC,aAAa;AAEtB,SAASC,gCAAgC;AACzC,SAASC,0BAA0B;AAWnC,MAAMC,gBAAgBL,cAAiC;AAiBvD,SAASM,gBAAkCC,OAA6C;AACtF,QAAM,CAACC,OAAOC,QAAQ,IAAIN,yBAAkC;IAC1DK,OAAOA,MAAMD,MAAMC;IACnBE,UAAUA,MAAMH,MAAMI;EACxB,CAAC;AAED,QAAMC,SAAUC,UAAkB;AAChCJ,aAASI,IAAI;EACf;AAEA,QAAMC,eAAkC;IACtCN;IACAI;IACAG,UAAUA,MAAMR,MAAMQ,YAAY;IAClCC,MAAMA,MAAMT,MAAMS;IAClBC,QAAQA,MAAMV,MAAMU,UAAU;IAC9BC,OAAOA,MAAMX,MAAMW,SAAS;EAC9B;AAEA,SAAAC,kBACGf,oBAAkB;IACjBgB,SAASf;IACTS;IACAO,aAAW;IAAA,IACXb,QAAK;AAAA,aAAED,MAAMC;IAAK;IAClBc,SAAUC,OAAMA,MAAMC,UAAaD,MAAM;IAAI,IAC7CE,WAAQ;AAAA,aAAElB,MAAMkB;IAAQ;IAAA,IACxBC,WAAQ;AAAA,aAAEnB,MAAMmB;IAAQ;IAAA,IACxBC,YAAS;AAAA,aAAEpB,MAAMoB;IAAS;IAAA,KAAA,OAAA,IAAA;AAAA,aACnBpB,MAAMqB;IAAK;IAAA,IAClBC,QAAK;AAAA,aAAEtB,MAAMsB;IAAK;IAAA,IAAAC,WAAA;AAAA,aAEjBvB,MAAMuB;IAAQ;EAAA,CAAA;AAGrB;AAEA,SAASC,eAAiCxB,OAI1B;AACd,QAAMyB,MAAM/B,WAAWI,aAAa;AACpC,MAAI,CAAC2B,IAAK,OAAM,IAAIC,MAAM,oDAAoD;AAE9E,QAAMC,aAAaA,MAAMF,IAAIxB,MAAM,MAAMD,MAAMC;AAE/C,QAAM2B,eAAeA,MAAM;AACzBH,QAAIpB,OAAOL,MAAMC,KAAK;EACxB;AAEA,SAAAW,kBACGjB,OAAK;IAAA,IACJM,QAAK;AAAA,aAAE0B,WAAW;IAAC;IACnBvB,eAAewB;IAAY,IAC3BpB,WAAQ;AAAA,aAAER,MAAMQ,YAAYiB,IAAIjB,SAAS;IAAC;IAAA,IAC1CC,OAAI;AAAA,aAAEgB,IAAIhB,KAAK;IAAC;IAAA,IAChBC,SAAM;AAAA,aAAEe,IAAIf,OAAO;IAAC;IAAA,IACpBC,QAAK;AAAA,aAAEc,IAAId,MAAM;IAAC;IAAA,IAAAY,WAAA;AAAA,aAEjBvB,MAAMuB;IAAQ;EAAA,CAAA;AAGrB;AAWO,MAAMM,aAAaC,OAAOC,OAAOhC,iBAAiB;EACvDiC,MAAMR;AACR,CAAC;",
+  "names": ["createContext", "useContext", "Radio", "createControllableSignal", "SelectionGroupBase", "RadioGroupCtx", "RadioGroupInner", "props", "value", "setValue", "onChange", "onValueChange", "select", "item", "contextValue", "disabled", "size", "inline", "inset", "_$createComponent", "context", "errorMsgKey", "isEmpty", "v", "undefined", "validate", "required", "touchMode", "class", "style", "children", "RadioGroupItem", "ctx", "Error", "isSelected", "handleChange", "RadioGroup", "Object", "assign", "Item"]
 }