@moduix/solid-tailwind 1.0.0

package/dist/components/progress-linear/ProgressLinear.jsx

@@ -0,0 +1,71 @@
+import { Progress, useProgress, useProgressContext } from "@ark-ui/solid/progress";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.jsx";
+function ProgressLinearRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <Progress.Root asChild={local.asChild} data-slot="progress-linear-root" class={cn('box-border grid w-48 max-w-full min-w-0 grid-cols-[minmax(0,1fr)_auto] gap-2 text-foreground data-[orientation=vertical]:h-48 data-[orientation=vertical]:w-max data-[orientation=vertical]:grid-rows-[auto_minmax(0,1fr)]', local.class)} {...others}>
+      {local.children}
+    </Progress.Root>;
+}
+function ProgressLinearRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <Progress.RootProvider asChild={local.asChild} data-slot="progress-linear-root-provider" class={cn('box-border grid w-48 max-w-full min-w-0 grid-cols-[minmax(0,1fr)_auto] gap-2 text-foreground data-[orientation=vertical]:h-48 data-[orientation=vertical]:w-max data-[orientation=vertical]:grid-rows-[auto_minmax(0,1fr)]', local.class)} {...others}>
+      {local.children}
+    </Progress.RootProvider>;
+}
+function ProgressLinearLabel(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Progress.Label asChild={local.asChild} data-slot="progress-linear-label" class={cn('min-w-0 text-sm leading-5 font-normal [overflow-wrap:anywhere] text-current', local.class)} {...others}/>;
+}
+function ProgressLinearValueText(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Progress.ValueText asChild={local.asChild} data-slot="progress-linear-value-text" class={cn('min-w-0 justify-self-end text-end text-sm leading-5 font-normal [overflow-wrap:anywhere] text-current', local.class)} {...others}/>;
+}
+function ProgressLinearTrack(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Progress.Track asChild={local.asChild} data-slot="progress-linear-track" class={cn('col-span-full box-border block h-2 w-full overflow-hidden rounded-full bg-muted ring-1 ring-border ring-inset data-[orientation=vertical]:flex data-[orientation=vertical]:h-full data-[orientation=vertical]:w-2 data-[orientation=vertical]:items-end data-[orientation=vertical]:justify-self-center', local.class)} {...others}/>;
+}
+function ProgressLinearRange(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Progress.Range asChild={local.asChild} data-slot="progress-linear-range" class={cn('block h-full rounded-[inherit] bg-primary transition-[width,height] duration-200 ease-in-out data-[orientation=vertical]:w-full data-[state=indeterminate]:w-[35%] data-[state=indeterminate]:animate-moduix-progress-linear-indeterminate data-[state=indeterminate]:data-[orientation=vertical]:h-[35%] data-[state=indeterminate]:data-[orientation=vertical]:animate-moduix-progress-linear-indeterminate-vertical motion-reduce:data-[state=indeterminate]:translate-x-0 motion-reduce:data-[state=indeterminate]:translate-y-0 motion-reduce:data-[state=indeterminate]:animate-none rtl:data-[state=indeterminate]:data-[orientation=horizontal]:[animation-direction:reverse]', local.class)} {...others}/>;
+}
+function ProgressLinearView(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Progress.View asChild={local.asChild} data-slot="progress-linear-view" class={cn('contents', local.class)} {...others}/>;
+}
+const ProgressLinear = Object.assign(ProgressLinearRoot, {
+    Root: ProgressLinearRoot,
+    RootProvider: ProgressLinearRootProvider,
+    Context: Progress.Context,
+    Label: ProgressLinearLabel,
+    ValueText: ProgressLinearValueText,
+    Track: ProgressLinearTrack,
+    Range: ProgressLinearRange,
+    View: ProgressLinearView,
+    useProgress: useProgress,
+    useProgressContext: useProgressContext
+});
+export { ProgressLinear };

package/dist/components/progress-linear/index.d.ts

@@ -0,0 +1 @@
+export { ProgressLinear } from './ProgressLinear.js';

package/dist/components/progress-linear/index.js

@@ -0,0 +1 @@
+export { ProgressLinear } from "./ProgressLinear.js";

package/dist/components/progress-linear/index.jsx

@@ -0,0 +1 @@
+export { ProgressLinear } from "./ProgressLinear.jsx";

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

@@ -0,0 +1,19 @@
+import { QrCode as QrCodePrimitive, useQrCode, useQrCodeContext } from '@ark-ui/solid/qr-code';
+import type { ComponentProps } from 'solid-js';
+declare function QrCodeRoot(props: ComponentProps<typeof QrCodePrimitive.Root>): import("solid-js").JSX.Element;
+declare function QrCodeRootProvider(props: ComponentProps<typeof QrCodePrimitive.RootProvider>): import("solid-js").JSX.Element;
+declare function QrCodeFrame(props: ComponentProps<typeof QrCodePrimitive.Frame>): import("solid-js").JSX.Element;
+declare function QrCodePattern(props: ComponentProps<typeof QrCodePrimitive.Pattern>): import("solid-js").JSX.Element;
+declare function QrCodeOverlay(props: ComponentProps<typeof QrCodePrimitive.Overlay>): import("solid-js").JSX.Element;
+declare function QrCodeDownloadTrigger(props: ComponentProps<typeof QrCodePrimitive.DownloadTrigger>): import("solid-js").JSX.Element;
+type QrCodeComponent = typeof QrCodeRoot & {
+    Root: typeof QrCodeRoot;
+    RootProvider: typeof QrCodeRootProvider;
+    Context: typeof QrCodePrimitive.Context;
+    Frame: typeof QrCodeFrame;
+    Pattern: typeof QrCodePattern;
+    Overlay: typeof QrCodeOverlay;
+    DownloadTrigger: typeof QrCodeDownloadTrigger;
+};
+declare const QrCode: QrCodeComponent;
+export { QrCode, useQrCode, useQrCodeContext };

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

@@ -0,0 +1,129 @@
+import { createComponent, mergeProps } from "solid-js/web";
+import { QrCode, useQrCode, useQrCodeContext } from "@ark-ui/solid/qr-code";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.js";
+function QrCodeRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(QrCode.Root, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "qr-code-root",
+        get ["class"] () {
+            return cn('relative box-border inline-flex w-32 max-w-full flex-col items-center gap-3 text-foreground', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function QrCodeRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(QrCode.RootProvider, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "qr-code-root-provider",
+        get ["class"] () {
+            return cn('relative box-border inline-flex w-32 max-w-full flex-col items-center gap-3 text-foreground', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function QrCodeFrame(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(QrCode.Frame, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "qr-code-frame",
+        get ["class"] () {
+            return cn('box-border aspect-square h-auto w-full fill-current text-inherit', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function QrCodePattern(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(QrCode.Pattern, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "qr-code-pattern",
+        get ["class"] () {
+            return cn('fill-inherit', local.class);
+        }
+    }, others));
+}
+function QrCodeOverlay(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(QrCode.Overlay, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "qr-code-overlay",
+        get ["class"] () {
+            return cn('box-border inline-flex size-control-lg items-center justify-center rounded-sm bg-background p-1 text-foreground [&_img]:size-full [&_img]:object-contain [&_svg]:size-full [&_svg]:object-contain', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function QrCodeDownloadTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(QrCode.DownloadTrigger, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "qr-code-download-trigger",
+        get ["class"] () {
+            return cn('box-border inline-flex min-h-control-md cursor-pointer appearance-none items-center justify-center gap-2 rounded-md border border-border bg-background px-4 text-sm leading-5 font-medium whitespace-nowrap text-foreground transition-[border-color,background-color,color,opacity,box-shadow,transform] duration-200 ease-in-out select-none focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 data-disabled:pointer-events-none data-disabled:opacity-50 motion-reduce:transition-none [&_svg]:size-4 [&_svg]:shrink-0 [&:active:not(:disabled):not([data-disabled])]:opacity-[0.94] motion-safe:[&:active:not(:disabled):not([data-disabled])]:translate-y-px motion-safe:[&:active:not(:disabled):not([data-disabled])]:scale-[0.985] [@media(hover:hover)]:[&:not(:disabled):not([data-disabled]):hover]:bg-accent', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+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.jsx

@@ -0,0 +1,70 @@
+import { QrCode, useQrCode, useQrCodeContext } from "@ark-ui/solid/qr-code";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.jsx";
+function QrCodeRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <QrCode.Root asChild={local.asChild} data-slot="qr-code-root" class={cn('relative box-border inline-flex w-32 max-w-full flex-col items-center gap-3 text-foreground', 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={cn('relative box-border inline-flex w-32 max-w-full flex-col items-center gap-3 text-foreground', 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={cn('box-border aspect-square h-auto w-full fill-current text-inherit', 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={cn('fill-inherit', 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={cn('box-border inline-flex size-control-lg items-center justify-center rounded-sm bg-background p-1 text-foreground [&_img]:size-full [&_img]:object-contain [&_svg]:size-full [&_svg]:object-contain', 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={cn('box-border inline-flex min-h-control-md cursor-pointer appearance-none items-center justify-center gap-2 rounded-md border border-border bg-background px-4 text-sm leading-5 font-medium whitespace-nowrap text-foreground transition-[border-color,background-color,color,opacity,box-shadow,transform] duration-200 ease-in-out select-none focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 data-disabled:pointer-events-none data-disabled:opacity-50 motion-reduce:transition-none [&_svg]:size-4 [&_svg]:shrink-0 [&:active:not(:disabled):not([data-disabled])]:opacity-[0.94] motion-safe:[&:active:not(:disabled):not([data-disabled])]:translate-y-px motion-safe:[&:active:not(:disabled):not([data-disabled])]:scale-[0.985] [@media(hover:hover)]:[&:not(:disabled):not([data-disabled]):hover]:bg-accent', 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/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,158 @@
+import { createComponent, mergeProps } from "solid-js/web";
+import { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from "@ark-ui/solid/radio-group";
+import { cva } from "class-variance-authority";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.js";
+const radioGroupItemControlVariants = cva("relative inline-flex shrink-0 items-center justify-center rounded-full border border-border bg-background text-primary-foreground outline-0 transition-[background-color,border-color,border-width,color,opacity] duration-200 ease-in-out select-none before:block before:rounded-full before:bg-current before:content-[''] before:scale-[0.6] before:opacity-0 before:transition-[opacity,transform] before:duration-200 before:ease-in-out data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:before:scale-100 data-[state=checked]:before:opacity-100 data-invalid:border-destructive data-focus-visible:outline-1 data-focus-visible:outline-offset-1 data-focus-visible:outline-ring data-invalid:data-focus-visible:outline-destructive data-readonly:cursor-default data-disabled:cursor-default [@media(hover:hover)]:[&[data-state=unchecked]:not([data-readonly]):not([data-disabled]):hover]:bg-accent motion-reduce:transition-none motion-reduce:before:transition-none", {
+    variants: {
+        size: {
+            xs: 'size-3.5 before:size-1',
+            sm: 'size-4 before:size-1.5',
+            md: 'size-5 before:size-2',
+            lg: 'size-control-xs before:size-2.5',
+            xl: 'size-7 before:size-3'
+        }
+    },
+    defaultVariants: {
+        size: 'md'
+    }
+});
+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 cn('relative flex flex-col gap-2 text-foreground data-disabled:cursor-default', 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 cn('relative flex flex-col gap-2 text-foreground data-disabled:cursor-default', 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 cn('text-sm leading-5 font-semibold text-inherit', 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 cn('inline-flex w-fit cursor-pointer items-center gap-2 align-middle data-disabled:cursor-default data-disabled:opacity-50 data-readonly:cursor-default', 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 cn(radioGroupItemControlVariants({
+                size: local.size ?? 'md'
+            }), 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 cn('text-sm leading-5 font-medium text-inherit', 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 cn('pointer-events-none absolute top-[var(--top)] left-[var(--left)] h-[var(--height)] w-[var(--width)] rounded-full bg-primary opacity-[0.12] transition-[var(--transition-property,translate)] duration-200 ease-in-out motion-reduce:transition-none', 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,94 @@
+import { RadioGroup, useRadioGroup, useRadioGroupContext, useRadioGroupItemContext } from "@ark-ui/solid/radio-group";
+import { cva } from "class-variance-authority";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.jsx";
+const radioGroupItemControlVariants = cva("relative inline-flex shrink-0 items-center justify-center rounded-full border border-border bg-background text-primary-foreground outline-0 transition-[background-color,border-color,border-width,color,opacity] duration-200 ease-in-out select-none before:block before:rounded-full before:bg-current before:content-[''] before:scale-[0.6] before:opacity-0 before:transition-[opacity,transform] before:duration-200 before:ease-in-out data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:before:scale-100 data-[state=checked]:before:opacity-100 data-invalid:border-destructive data-focus-visible:outline-1 data-focus-visible:outline-offset-1 data-focus-visible:outline-ring data-invalid:data-focus-visible:outline-destructive data-readonly:cursor-default data-disabled:cursor-default [@media(hover:hover)]:[&[data-state=unchecked]:not([data-readonly]):not([data-disabled]):hover]:bg-accent motion-reduce:transition-none motion-reduce:before:transition-none", {
+    variants: {
+        size: {
+            xs: 'size-3.5 before:size-1',
+            sm: 'size-4 before:size-1.5',
+            md: 'size-5 before:size-2',
+            lg: 'size-control-xs before:size-2.5',
+            xl: 'size-7 before:size-3'
+        }
+    },
+    defaultVariants: {
+        size: 'md'
+    }
+});
+function RadioGroupRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <RadioGroup.Root asChild={local.asChild} {...others} data-slot="radio-group-root" class={cn('relative flex flex-col gap-2 text-foreground data-disabled:cursor-default', 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={cn('relative flex flex-col gap-2 text-foreground data-disabled:cursor-default', local.class)}/>;
+}
+function RadioGroupLabel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <RadioGroup.Label {...others} data-slot="radio-group-label" class={cn('text-sm leading-5 font-semibold text-inherit', 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={cn('inline-flex w-fit cursor-pointer items-center gap-2 align-middle data-disabled:cursor-default data-disabled:opacity-50 data-readonly:cursor-default', 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={cn(radioGroupItemControlVariants({
+        size: local.size ?? 'md'
+    }), local.class)}/>;
+}
+function RadioGroupItemText(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <RadioGroup.ItemText {...others} data-slot="radio-group-item-text" class={cn('text-sm leading-5 font-medium text-inherit', local.class)}/>;
+}
+function RadioGroupIndicator(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <RadioGroup.Indicator {...others} data-slot="radio-group-indicator" class={cn('pointer-events-none absolute top-[var(--top)] left-[var(--left)] h-[var(--height)] w-[var(--width)] rounded-full bg-primary opacity-[0.12] transition-[var(--transition-property,translate)] duration-200 ease-in-out motion-reduce:transition-none', 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/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";

package/dist/components/rating-group/RatingGroup.d.ts

@@ -0,0 +1,33 @@
+import { RatingGroup as RatingGroupPrimitive, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from '@ark-ui/solid/rating-group';
+import type { ComponentProps, JSX } from 'solid-js';
+type RatingGroupSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type RatingGroupRootProps = ComponentProps<typeof RatingGroupPrimitive.Root> & {
+    size?: RatingGroupSize;
+};
+type RatingGroupRootProviderProps = ComponentProps<typeof RatingGroupPrimitive.RootProvider> & {
+    size?: RatingGroupSize;
+};
+type RatingGroupItemIndicatorProps = ComponentProps<'span'>;
+declare function RatingGroupRoot(props: RatingGroupRootProps): JSX.Element;
+declare function RatingGroupRootProvider(props: RatingGroupRootProviderProps): JSX.Element;
+declare function RatingGroupLabel(props: ComponentProps<typeof RatingGroupPrimitive.Label>): JSX.Element;
+declare function RatingGroupControl(props: ComponentProps<typeof RatingGroupPrimitive.Control>): JSX.Element;
+declare function RatingGroupItem(props: ComponentProps<typeof RatingGroupPrimitive.Item>): JSX.Element;
+declare function RatingGroupItemIndicator(props: RatingGroupItemIndicatorProps): JSX.Element;
+declare function RatingGroupItems(props: {
+    children?: JSX.Element;
+}): JSX.Element;
+declare const RatingGroup: typeof RatingGroupRoot & {
+    Root: typeof RatingGroupRoot;
+    RootProvider: typeof RatingGroupRootProvider;
+    Context: (props: RatingGroupPrimitive.ContextProps) => JSX.Element;
+    HiddenInput: (props: RatingGroupPrimitive.HiddenInputProps) => JSX.Element;
+    Label: typeof RatingGroupLabel;
+    Control: typeof RatingGroupControl;
+    Item: typeof RatingGroupItem;
+    ItemContext: (props: RatingGroupPrimitive.ItemContextProps) => JSX.Element;
+    ItemIndicator: typeof RatingGroupItemIndicator;
+    Items: typeof RatingGroupItems;
+};
+export { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext };
+export type { RatingGroupItemIndicatorProps, RatingGroupRootProps, RatingGroupRootProviderProps, RatingGroupSize, };