@moduix/solid 1.0.0

package/dist/components/qr-code/QrCode.jsx

@@ -0,0 +1,71 @@
+import { QrCode, useQrCode, useQrCodeContext } from "@ark-ui/solid/qr-code";
+import { clsx } from "clsx";
+import { splitProps } from "solid-js";
+import QrCode_module from "./QrCode.module.jsx";
+function QrCodeRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <QrCode.Root asChild={local.asChild} data-slot="qr-code-root" class={clsx(QrCode_module.root, local.class)} {...others}>
+      {local.children}
+    </QrCode.Root>;
+}
+function QrCodeRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <QrCode.RootProvider asChild={local.asChild} data-slot="qr-code-root-provider" class={clsx(QrCode_module.root, local.class)} {...others}>
+      {local.children}
+    </QrCode.RootProvider>;
+}
+function QrCodeFrame(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <QrCode.Frame asChild={local.asChild} data-slot="qr-code-frame" class={clsx(QrCode_module.frame, local.class)} {...others}>
+      {local.children}
+    </QrCode.Frame>;
+}
+function QrCodePattern(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <QrCode.Pattern asChild={local.asChild} data-slot="qr-code-pattern" class={clsx(QrCode_module.pattern, local.class)} {...others}/>;
+}
+function QrCodeOverlay(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <QrCode.Overlay asChild={local.asChild} data-slot="qr-code-overlay" class={clsx(QrCode_module.overlay, local.class)} {...others}>
+      {local.children}
+    </QrCode.Overlay>;
+}
+function QrCodeDownloadTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <QrCode.DownloadTrigger asChild={local.asChild} data-slot="qr-code-download-trigger" class={clsx(QrCode_module.downloadTrigger, local.class)} {...others}>
+      {local.children}
+    </QrCode.DownloadTrigger>;
+}
+const QrCode_QrCode = Object.assign(QrCodeRoot, {
+    Root: QrCodeRoot,
+    RootProvider: QrCodeRootProvider,
+    Context: QrCode.Context,
+    Frame: QrCodeFrame,
+    Pattern: QrCodePattern,
+    Overlay: QrCodeOverlay,
+    DownloadTrigger: QrCodeDownloadTrigger
+});
+export { QrCode_QrCode as QrCode, useQrCode, useQrCodeContext };

package/dist/components/qr-code/QrCode.module.js

@@ -0,0 +1,9 @@
+import "./QrCode_module.css";
+const QrCode_module = {
+    root: "root-FbZFrE",
+    frame: "frame-xuEHtQ",
+    pattern: "pattern-rEX5Uj",
+    overlay: "overlay-ZFFTQV",
+    downloadTrigger: "downloadTrigger-qWJcms"
+};
+export default QrCode_module;

package/dist/components/qr-code/QrCode.module.jsx

@@ -0,0 +1,9 @@
+import "./QrCode_module.css";
+const QrCode_module = {
+    root: "root-FbZFrE",
+    frame: "frame-xuEHtQ",
+    pattern: "pattern-rEX5Uj",
+    overlay: "overlay-ZFFTQV",
+    downloadTrigger: "downloadTrigger-qWJcms"
+};
+export default QrCode_module;

package/dist/components/qr-code/QrCode_module.css

@@ -0,0 +1,119 @@
+@layer moduix.components {
+  .root-FbZFrE {
+    box-sizing: border-box;
+    align-items: center;
+    gap: var(--moduix-qr-code-gap, var(--moduix-spacing-3));
+    width: min(var(--moduix-qr-code-size, 8rem), 100%);
+    max-width: var(--moduix-qr-code-max-width, 100%);
+    color: var(--moduix-qr-code-color, var(--moduix-color-foreground));
+    flex-direction: column;
+    display: inline-flex;
+    position: relative;
+  }
+
+  .frame-xuEHtQ {
+    box-sizing: border-box;
+    aspect-ratio: 1;
+    width: 100%;
+    height: auto;
+    color: inherit;
+    fill: var(--moduix-qr-code-fill, currentColor);
+    display: block;
+  }
+
+  .pattern-rEX5Uj {
+    fill: inherit;
+  }
+
+  .overlay-ZFFTQV {
+    box-sizing: border-box;
+    width: var(--moduix-qr-code-overlay-size, var(--moduix-size-lg));
+    height: var(--moduix-qr-code-overlay-size, var(--moduix-size-lg));
+    padding: var(--moduix-qr-code-overlay-padding, var(--moduix-spacing-1));
+    border-radius: var(--moduix-qr-code-overlay-radius, var(--moduix-radius-sm));
+    background-color: var(--moduix-qr-code-overlay-bg, var(--moduix-color-background));
+    color: var(--moduix-qr-code-overlay-color, var(--moduix-color-foreground));
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+  }
+
+  .overlay-ZFFTQV :where(img, svg) {
+    object-fit: contain;
+    width: 100%;
+    height: 100%;
+  }
+
+  .downloadTrigger-qWJcms {
+    box-sizing: border-box;
+    justify-content: center;
+    align-items: center;
+    gap: var(--moduix-qr-code-download-trigger-gap, var(--moduix-button-content-gap, var(--moduix-spacing-2)));
+    min-height: var(--moduix-qr-code-download-trigger-height, var(--moduix-button-size-md, var(--moduix-size-md)));
+    padding-inline: var(--moduix-qr-code-download-trigger-padding-x, var(--moduix-button-padding-x-md, var(--moduix-spacing-4)));
+    border: var(--moduix-qr-code-download-trigger-border-width, var(--moduix-button-border-width, var(--moduix-border-width-sm)))
+      solid
+      var(--moduix-qr-code-download-trigger-border-color, var(--moduix-button-outline-border-color, var(--moduix-color-border)));
+    border-radius: var(--moduix-qr-code-download-trigger-radius, var(--moduix-button-radius, var(--moduix-radius-md)));
+    background-color: var(--moduix-qr-code-download-trigger-bg, var(--moduix-button-outline-bg, var(--moduix-color-background)));
+    color: var(--moduix-qr-code-download-trigger-color, var(--moduix-button-outline-color, var(--moduix-color-foreground)));
+    appearance: none;
+    font: inherit;
+    font-size: var(--moduix-qr-code-download-trigger-font-size, var(--moduix-button-font-size, var(--moduix-text-sm)));
+    font-weight: var(--moduix-qr-code-download-trigger-font-weight, var(--moduix-button-font-weight, var(--moduix-weight-medium)));
+    line-height: var(--moduix-qr-code-download-trigger-line-height, var(--moduix-button-line-height, var(--moduix-line-height-text-sm)));
+    -webkit-user-select: none;
+    user-select: none;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: border-color
+        var(--moduix-qr-code-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      background-color
+        var(--moduix-qr-code-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      color
+        var(--moduix-qr-code-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      opacity
+        var(--moduix-qr-code-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      box-shadow
+        var(--moduix-qr-code-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      transform
+        var(--moduix-qr-code-transition, var(--moduix-button-transition, var(--moduix-transition-default)));
+    display: inline-flex;
+  }
+
+  .downloadTrigger-qWJcms :where(svg) {
+    width: var(--moduix-qr-code-download-trigger-icon-size, var(--moduix-button-icon-size, var(--moduix-spacing-4)));
+    height: var(--moduix-qr-code-download-trigger-icon-size, var(--moduix-button-icon-size, var(--moduix-spacing-4)));
+    flex-shrink: 0;
+  }
+
+  @media (hover: hover) {
+    .downloadTrigger-qWJcms:hover:not(:disabled, [data-disabled]) {
+      background-color: var(--moduix-qr-code-download-trigger-bg-hover, var(--moduix-button-outline-bg-hover, var(--moduix-color-accent)));
+    }
+  }
+
+  .downloadTrigger-qWJcms:focus-visible {
+    outline: var(--moduix-qr-code-download-trigger-focus-ring-width, var(--moduix-button-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md))))
+      solid
+      var(--moduix-qr-code-download-trigger-focus-ring-color, var(--moduix-button-focus-ring-color, var(--moduix-color-ring)));
+    outline-offset: calc(var(--moduix-qr-code-download-trigger-focus-ring-offset, var(--moduix-qr-code-download-trigger-border-width, var(--moduix-button-border-width, var(--moduix-border-width-sm)))) *
+        -1);
+  }
+
+  .downloadTrigger-qWJcms:active:not(:disabled, [data-disabled]) {
+    opacity: .94;
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .downloadTrigger-qWJcms:active:not(:disabled, [data-disabled]) {
+      transform: translateY(1px) scale(.985);
+    }
+  }
+
+  .downloadTrigger-qWJcms:disabled, .downloadTrigger-qWJcms[data-disabled] {
+    pointer-events: none;
+    opacity: var(--moduix-qr-code-disabled-opacity, var(--moduix-button-disabled-opacity, var(--moduix-opacity-disabled)));
+  }
+}
+

package/dist/components/qr-code/index.d.ts

@@ -0,0 +1 @@
+export { QrCode, useQrCode, useQrCodeContext } from './QrCode.js';

package/dist/components/qr-code/index.js

@@ -0,0 +1 @@
+export { QrCode, useQrCode, useQrCodeContext } from "./QrCode.js";

package/dist/components/qr-code/index.jsx

@@ -0,0 +1 @@
+export { QrCode, useQrCode, useQrCodeContext } from "./QrCode.jsx";

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

@@ -0,0 +1,33 @@
+import { RadioGroup as RadioGroupPrimitive, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from '@ark-ui/solid/radio-group';
+import type { ComponentProps, JSX } from 'solid-js';
+type RadioGroupItemControlSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type RadioGroupItemControlProps = ComponentProps<typeof RadioGroupPrimitive.ItemControl> & {
+    size?: RadioGroupItemControlSize;
+};
+type RadioGroupOptionProps = Omit<ComponentProps<typeof RadioGroupPrimitive.Item>, 'asChild' | 'children'> & {
+    children: JSX.Element;
+    size?: RadioGroupItemControlSize;
+};
+declare function RadioGroupRoot(props: ComponentProps<typeof RadioGroupPrimitive.Root>): JSX.Element;
+declare function RadioGroupRootProvider(props: ComponentProps<typeof RadioGroupPrimitive.RootProvider>): JSX.Element;
+declare function RadioGroupLabel(props: ComponentProps<typeof RadioGroupPrimitive.Label>): JSX.Element;
+declare function RadioGroupItem(props: ComponentProps<typeof RadioGroupPrimitive.Item>): JSX.Element;
+declare function RadioGroupOption(props: RadioGroupOptionProps): JSX.Element;
+declare function RadioGroupItemControl(props: RadioGroupItemControlProps): JSX.Element;
+declare function RadioGroupItemText(props: ComponentProps<typeof RadioGroupPrimitive.ItemText>): JSX.Element;
+declare function RadioGroupIndicator(props: ComponentProps<typeof RadioGroupPrimitive.Indicator>): JSX.Element;
+declare const RadioGroup: typeof RadioGroupRoot & {
+    Root: typeof RadioGroupRoot;
+    RootProvider: typeof RadioGroupRootProvider;
+    Context: (props: import("@ark-ui/solid").RadioGroupContextProps) => JSX.Element;
+    ItemContext: (props: import("@ark-ui/solid").RadioGroupItemContextProps) => JSX.Element;
+    Label: typeof RadioGroupLabel;
+    Item: typeof RadioGroupItem;
+    ItemHiddenInput: (props: RadioGroupPrimitive.ItemHiddenInputProps) => JSX.Element;
+    Option: typeof RadioGroupOption;
+    ItemControl: typeof RadioGroupItemControl;
+    ItemText: typeof RadioGroupItemText;
+    Indicator: typeof RadioGroupIndicator;
+};
+export { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext };
+export type { RadioGroupItemControlProps, RadioGroupItemControlSize, RadioGroupOptionProps };

package/dist/components/radio-group/RadioGroup.js

@@ -0,0 +1,142 @@
+import { createComponent, mergeProps } from "solid-js/web";
+import { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from "@ark-ui/solid/radio-group";
+import { clsx } from "clsx";
+import { splitProps } from "solid-js";
+import RadioGroup_module from "./RadioGroup.module.js";
+function RadioGroupRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(RadioGroup.Root, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "radio-group-root",
+        get ["class"] () {
+            return clsx(RadioGroup_module.root, local.class);
+        }
+    }));
+}
+function RadioGroupRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(RadioGroup.RootProvider, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "radio-group-root-provider",
+        get ["class"] () {
+            return clsx(RadioGroup_module.root, local.class);
+        }
+    }));
+}
+function RadioGroupLabel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(RadioGroup.Label, mergeProps(others, {
+        "data-slot": "radio-group-label",
+        get ["class"] () {
+            return clsx(RadioGroup_module.label, local.class);
+        }
+    }));
+}
+function RadioGroupItem(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(RadioGroup.Item, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "radio-group-item",
+        get ["class"] () {
+            return clsx(RadioGroup_module.item, local.class);
+        },
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function RadioGroupOption(props) {
+    const [local, others] = splitProps(props, [
+        'children',
+        'size'
+    ]);
+    return createComponent(RadioGroupItem, mergeProps(others, {
+        get children () {
+            return [
+                createComponent(RadioGroup.ItemHiddenInput, {}),
+                createComponent(RadioGroupItemControl, {
+                    get size () {
+                        return local.size;
+                    }
+                }),
+                createComponent(RadioGroupItemText, {
+                    get children () {
+                        return local.children;
+                    }
+                })
+            ];
+        }
+    }));
+}
+function RadioGroupItemControl(props) {
+    const [local, others] = splitProps(props, [
+        'class',
+        'size'
+    ]);
+    return createComponent(RadioGroup.ItemControl, mergeProps(others, {
+        "data-slot": "radio-group-item-control",
+        get ["data-size"] () {
+            return local.size ?? 'md';
+        },
+        get ["class"] () {
+            return clsx(RadioGroup_module.itemControl, local.class);
+        }
+    }));
+}
+function RadioGroupItemText(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(RadioGroup.ItemText, mergeProps(others, {
+        "data-slot": "radio-group-item-text",
+        get ["class"] () {
+            return clsx(RadioGroup_module.itemText, local.class);
+        }
+    }));
+}
+function RadioGroupIndicator(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(RadioGroup.Indicator, mergeProps(others, {
+        "data-slot": "radio-group-indicator",
+        get ["class"] () {
+            return clsx(RadioGroup_module.indicator, local.class);
+        }
+    }));
+}
+const RadioGroup_RadioGroup = Object.assign(RadioGroupRoot, {
+    Root: RadioGroupRoot,
+    RootProvider: RadioGroupRootProvider,
+    Context: RadioGroup.Context,
+    ItemContext: RadioGroup.ItemContext,
+    Label: RadioGroupLabel,
+    Item: RadioGroupItem,
+    ItemHiddenInput: RadioGroup.ItemHiddenInput,
+    Option: RadioGroupOption,
+    ItemControl: RadioGroupItemControl,
+    ItemText: RadioGroupItemText,
+    Indicator: RadioGroupIndicator
+});
+export { RadioGroup_RadioGroup as RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext };

package/dist/components/radio-group/RadioGroup.jsx

@@ -0,0 +1,78 @@
+import { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from "@ark-ui/solid/radio-group";
+import { clsx } from "clsx";
+import { splitProps } from "solid-js";
+import RadioGroup_module from "./RadioGroup.module.jsx";
+function RadioGroupRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <RadioGroup.Root asChild={local.asChild} {...others} data-slot="radio-group-root" class={clsx(RadioGroup_module.root, local.class)}/>;
+}
+function RadioGroupRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <RadioGroup.RootProvider asChild={local.asChild} {...others} data-slot="radio-group-root-provider" class={clsx(RadioGroup_module.root, local.class)}/>;
+}
+function RadioGroupLabel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <RadioGroup.Label {...others} data-slot="radio-group-label" class={clsx(RadioGroup_module.label, local.class)}/>;
+}
+function RadioGroupItem(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <RadioGroup.Item asChild={local.asChild} {...others} data-slot="radio-group-item" class={clsx(RadioGroup_module.item, local.class)}>
+      {local.children}
+    </RadioGroup.Item>;
+}
+function RadioGroupOption(props) {
+    const [local, others] = splitProps(props, [
+        'children',
+        'size'
+    ]);
+    return <RadioGroupItem {...others}>
+      <RadioGroup.ItemHiddenInput/>
+      <RadioGroupItemControl size={local.size}/>
+      <RadioGroupItemText>{local.children}</RadioGroupItemText>
+    </RadioGroupItem>;
+}
+function RadioGroupItemControl(props) {
+    const [local, others] = splitProps(props, [
+        'class',
+        'size'
+    ]);
+    return <RadioGroup.ItemControl {...others} data-slot="radio-group-item-control" data-size={local.size ?? 'md'} class={clsx(RadioGroup_module.itemControl, local.class)}/>;
+}
+function RadioGroupItemText(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <RadioGroup.ItemText {...others} data-slot="radio-group-item-text" class={clsx(RadioGroup_module.itemText, local.class)}/>;
+}
+function RadioGroupIndicator(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <RadioGroup.Indicator {...others} data-slot="radio-group-indicator" class={clsx(RadioGroup_module.indicator, local.class)}/>;
+}
+const RadioGroup_RadioGroup = Object.assign(RadioGroupRoot, {
+    Root: RadioGroupRoot,
+    RootProvider: RadioGroupRootProvider,
+    Context: RadioGroup.Context,
+    ItemContext: RadioGroup.ItemContext,
+    Label: RadioGroupLabel,
+    Item: RadioGroupItem,
+    ItemHiddenInput: RadioGroup.ItemHiddenInput,
+    Option: RadioGroupOption,
+    ItemControl: RadioGroupItemControl,
+    ItemText: RadioGroupItemText,
+    Indicator: RadioGroupIndicator
+});
+export { RadioGroup_RadioGroup as RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext };

package/dist/components/radio-group/RadioGroup.module.js

@@ -0,0 +1,10 @@
+import "./RadioGroup_module.css";
+const RadioGroup_module = {
+    root: "root-_abn0d",
+    label: "label-EH8IpJ",
+    item: "item-fC3CNm",
+    itemControl: "itemControl-l9dtE4",
+    itemText: "itemText-gi6tev",
+    indicator: "indicator-bsZ8TQ"
+};
+export default RadioGroup_module;

package/dist/components/radio-group/RadioGroup.module.jsx

@@ -0,0 +1,10 @@
+import "./RadioGroup_module.css";
+const RadioGroup_module = {
+    root: "root-_abn0d",
+    label: "label-EH8IpJ",
+    item: "item-fC3CNm",
+    itemControl: "itemControl-l9dtE4",
+    itemText: "itemText-gi6tev",
+    indicator: "indicator-bsZ8TQ"
+};
+export default RadioGroup_module;

package/dist/components/radio-group/RadioGroup_module.css

@@ -0,0 +1,156 @@
+@layer moduix.components {
+  .root-_abn0d {
+    gap: var(--moduix-radio-group-gap, var(--moduix-spacing-2));
+    color: var(--moduix-radio-group-color, var(--moduix-color-foreground));
+    flex-direction: column;
+    display: flex;
+    position: relative;
+  }
+
+  .root-_abn0d[data-disabled] {
+    cursor: default;
+  }
+
+  .label-EH8IpJ {
+    color: var(--moduix-radio-group-label-color, var(--moduix-radio-group-color, var(--moduix-color-foreground)));
+    font-size: var(--moduix-radio-group-label-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-radio-group-label-font-weight, var(--moduix-weight-semibold));
+    line-height: var(--moduix-radio-group-label-line-height, var(--moduix-line-height-text-sm));
+  }
+
+  .item-fC3CNm {
+    align-items: center;
+    gap: var(--moduix-radio-gap, var(--moduix-spacing-2));
+    vertical-align: middle;
+    cursor: pointer;
+    width: fit-content;
+    display: inline-flex;
+  }
+
+  .item-fC3CNm[data-disabled] {
+    cursor: default;
+    opacity: var(--moduix-radio-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .itemControl-l9dtE4 {
+    box-sizing: border-box;
+    appearance: none;
+    width: var(--_radio-size, 1.25rem);
+    height: var(--_radio-size, 1.25rem);
+    border: var(--moduix-radio-border-width, var(--moduix-border-width-sm)) solid
+      var(--moduix-radio-border-color, var(--moduix-color-border));
+    border-radius: var(--moduix-radius-full);
+    background-color: var(--moduix-radio-bg, var(--moduix-color-background));
+    color: var(--moduix-radio-indicator-color, var(--moduix-color-primary-foreground));
+    -webkit-user-select: none;
+    user-select: none;
+    transition: background-color var(--moduix-radio-transition, var(--moduix-transition-default)),
+      border-color var(--moduix-radio-transition, var(--moduix-transition-default)),
+      border-width var(--moduix-radio-transition, var(--moduix-transition-default)),
+      color var(--moduix-radio-transition, var(--moduix-transition-default)),
+      opacity var(--moduix-radio-transition, var(--moduix-transition-default));
+    outline: 0;
+    flex: none;
+    justify-content: center;
+    align-items: center;
+    line-height: 0;
+    display: inline-flex;
+    position: relative;
+  }
+
+  .itemControl-l9dtE4:before {
+    width: var(--_radio-indicator-size, .5rem);
+    height: var(--_radio-indicator-size, .5rem);
+    border: var(--moduix-radio-indicator-border-width, 0) solid
+        var(--moduix-radio-indicator-border-color, currentColor);
+    border-radius: var(--moduix-radio-indicator-radius, var(--moduix-radius-full));
+    content: "";
+    opacity: 0;
+    transition: opacity var(--moduix-radio-transition, var(--moduix-transition-default)),
+        transform var(--moduix-radio-transition, var(--moduix-transition-default));
+    background-color: currentColor;
+    display: block;
+    transform: scale(.6);
+  }
+
+  .itemControl-l9dtE4[data-state="checked"] {
+    border-color: var(--moduix-radio-border-color-checked, var(--moduix-color-primary));
+    background-color: var(--moduix-radio-bg-checked, var(--moduix-color-primary));
+  }
+
+  .itemControl-l9dtE4[data-state="checked"]:before {
+    opacity: 1;
+    transform: scale(1);
+  }
+
+  .itemControl-l9dtE4[data-invalid] {
+    border-color: var(--moduix-radio-border-color-invalid, var(--moduix-color-destructive));
+  }
+
+  .itemControl-l9dtE4[data-focus-visible] {
+    outline: var(--moduix-radio-focus-ring-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm)))
+        solid var(--moduix-radio-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-radio-focus-ring-offset, var(--moduix-border-width-sm));
+  }
+
+  .itemControl-l9dtE4[data-invalid][data-focus-visible] {
+    outline-color: var(--moduix-radio-focus-ring-color-invalid, var(--moduix-color-destructive));
+  }
+
+  @media (hover: hover) {
+    .itemControl-l9dtE4[data-state="unchecked"]:not([data-readonly], [data-disabled]):hover {
+      background-color: var(--moduix-radio-bg-hover, var(--moduix-color-accent));
+    }
+  }
+
+  .itemControl-l9dtE4[data-readonly], .itemControl-l9dtE4[data-disabled] {
+    cursor: default;
+  }
+
+  .itemControl-l9dtE4[data-size="xs"] {
+    --_radio-size: var(--moduix-radio-size-xs, var(--moduix-spacing-3-5));
+    --_radio-indicator-size: var(--moduix-radio-indicator-size-xs, var(--moduix-spacing-1));
+  }
+
+  .itemControl-l9dtE4[data-size="sm"] {
+    --_radio-size: var(--moduix-radio-size-sm, var(--moduix-spacing-4));
+    --_radio-indicator-size: var(--moduix-radio-indicator-size-sm, var(--moduix-spacing-1-5));
+  }
+
+  .itemControl-l9dtE4[data-size="md"] {
+    --_radio-size: var(--moduix-radio-size-md, var(--moduix-spacing-5));
+    --_radio-indicator-size: var(--moduix-radio-indicator-size-md, var(--moduix-spacing-2));
+  }
+
+  .itemControl-l9dtE4[data-size="lg"] {
+    --_radio-size: var(--moduix-radio-size-lg, var(--moduix-size-xs));
+    --_radio-indicator-size: var(--moduix-radio-indicator-size-lg, var(--moduix-spacing-2-5));
+  }
+
+  .itemControl-l9dtE4[data-size="xl"] {
+    --_radio-size: var(--moduix-radio-size-xl, var(--moduix-spacing-7));
+    --_radio-indicator-size: var(--moduix-radio-indicator-size-xl, var(--moduix-spacing-3));
+  }
+
+  .itemText-gi6tev {
+    color: var(--moduix-radio-label-color, var(--moduix-radio-group-color, var(--moduix-color-foreground)));
+    font-size: var(--moduix-radio-label-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-radio-label-font-weight, var(--moduix-weight-medium));
+    line-height: var(--moduix-radio-label-line-height, var(--moduix-line-height-text-sm));
+  }
+
+  .indicator-bsZ8TQ {
+    top: var(--top);
+    left: var(--left);
+    width: var(--width);
+    height: var(--height);
+    border-radius: var(--moduix-radio-indicator-radius, var(--moduix-radius-full));
+    background-color: var(--moduix-radio-bg-checked, var(--moduix-color-primary));
+    opacity: var(--moduix-radio-group-indicator-opacity, .12);
+    pointer-events: none;
+    transition: var(--transition-property, translate)
+      var(--moduix-radio-transition, var(--moduix-transition-default));
+    position: absolute;
+  }
+}
+

package/dist/components/radio-group/index.d.ts

@@ -0,0 +1,2 @@
+export { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext, } from './RadioGroup.js';
+export type { RadioGroupItemControlProps, RadioGroupItemControlSize, RadioGroupOptionProps, } from './RadioGroup.js';

package/dist/components/radio-group/index.js

@@ -0,0 +1 @@
+export { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from "./RadioGroup.js";

package/dist/components/radio-group/index.jsx

@@ -0,0 +1 @@
+export { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from "./RadioGroup.jsx";