@moduix/react 2.1.0 → 2.2.4

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

@@ -0,0 +1,157 @@
+@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: -moz-fit-content;
+    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-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

@@ -1,2 +1,2 @@
-import { RadioGroup, RadioGroupItemControlProps, RadioGroupItemControlSize, RadioGroupOptionProps, useRadioGroup } from "./RadioGroup.js";
-export { RadioGroup, type RadioGroupItemControlProps, type RadioGroupItemControlSize, type RadioGroupOptionProps, useRadioGroup };
+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/rating-group/RatingGroup.d.ts

@@ -1,30 +1,26 @@
-import { ComponentProps, ReactNode } from "react";
-import { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from "@ark-ui/react/rating-group";
-
-//#region src/components/rating-group/RatingGroup.d.ts
+import { RatingGroup as RatingGroupPrimitive, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from '@ark-ui/react/rating-group';
+import type { ComponentProps, ReactNode } from 'react';
 type RatingGroupSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-type RatingGroupRootProps = ComponentProps<typeof RatingGroup.Root> & {
-  size?: RatingGroupSize;
+type RatingGroupRootProps = ComponentProps<typeof RatingGroupPrimitive.Root> & {
+    size?: RatingGroupSize;
 };
-type RatingGroupRootProviderProps = ComponentProps<typeof RatingGroup.RootProvider> & {
-  size?: RatingGroupSize;
+type RatingGroupRootProviderProps = ComponentProps<typeof RatingGroupPrimitive.RootProvider> & {
+    size?: RatingGroupSize;
 };
 type RatingGroupItemIndicatorProps = ComponentProps<'span'>;
-declare function RatingGroupItems({
-  children
-}: {
-  children?: ReactNode;
+declare function RatingGroupItems({ children }: {
+    children?: ReactNode;
 }): import("react").JSX.Element;
-declare const RatingGroup$1: import("react").ForwardRefExoticComponent<Omit<RatingGroupRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-  Root: import("react").ForwardRefExoticComponent<Omit<RatingGroupRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  RootProvider: import("react").ForwardRefExoticComponent<Omit<RatingGroupRootProviderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Context: (props: RatingGroup.ContextProps) => ReactNode;
-  Label: import("react").ForwardRefExoticComponent<Omit<RatingGroup.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
-  Control: import("react").ForwardRefExoticComponent<Omit<RatingGroup.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Item: import("react").ForwardRefExoticComponent<Omit<RatingGroup.ItemProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
-  ItemContext: (props: RatingGroup.ItemContextProps) => ReactNode;
-  ItemIndicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
-  Items: typeof RatingGroupItems;
+declare const RatingGroup: import("react").ForwardRefExoticComponent<Omit<RatingGroupRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<RatingGroupRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<RatingGroupRootProviderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: RatingGroupPrimitive.ContextProps) => ReactNode;
+    Label: import("react").ForwardRefExoticComponent<Omit<RatingGroupPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    Control: import("react").ForwardRefExoticComponent<Omit<RatingGroupPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<RatingGroupPrimitive.ItemProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    ItemContext: (props: RatingGroupPrimitive.ItemContextProps) => ReactNode;
+    ItemIndicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Items: typeof RatingGroupItems;
 };
-//#endregion
-export { RatingGroup$1 as RatingGroup, type RatingGroupItemIndicatorProps, type RatingGroupRootProps, type RatingGroupRootProviderProps, type RatingGroupSize, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext };
+export { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext };
+export type { RatingGroupItemIndicatorProps, RatingGroupRootProps, RatingGroupRootProviderProps, RatingGroupSize, };

package/dist/components/rating-group/RatingGroup.js

@@ -1,97 +1,112 @@
-import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
-import { RatingStarIcon } from "../../lib/moduix/icons/ui/Icons.js";
-import RatingGroup_module_default from "./RatingGroup.module.js";
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from "@ark-ui/react/rating-group";
 import { clsx } from "clsx";
 import { Children, cloneElement, forwardRef } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from "@ark-ui/react/rating-group";
-//#region src/components/rating-group/RatingGroup.tsx
-const RatingGroupRoot = forwardRef(function RatingGroupRoot({ asChild, children, className, size = "md", ...props }, ref) {
-	return /* @__PURE__ */ jsx(RatingGroup.Root, {
-		ref,
-		asChild,
-		"data-slot": "rating-group-root",
-		"data-size": size,
-		className: clsx(RatingGroup_module_default.root, normalizeClassName(className)),
-		...props,
-		children: withHiddenInput(children, asChild)
-	});
+import { RatingStarIcon } from "../../internal/icons/ui/index.js";
+import { normalizeClassName } from "../../internal/normalizeClassName.js";
+import RatingGroup_module from "./RatingGroup.module.js";
+const RatingGroup_RatingGroupRoot = /*#__PURE__*/ forwardRef(function({ asChild, children, className, size = 'md', ...props }, ref) {
+    return /*#__PURE__*/ jsx(RatingGroup.Root, {
+        ref: ref,
+        asChild: asChild,
+        "data-slot": "rating-group-root",
+        "data-size": size,
+        className: clsx(RatingGroup_module.root, normalizeClassName(className)),
+        ...props,
+        children: withHiddenInput(children, asChild)
+    });
 });
-const RatingGroupRootProvider = forwardRef(function RatingGroupRootProvider({ asChild, children, className, size = "md", ...props }, ref) {
-	return /* @__PURE__ */ jsx(RatingGroup.RootProvider, {
-		ref,
-		asChild,
-		"data-slot": "rating-group-root-provider",
-		"data-size": size,
-		className: clsx(RatingGroup_module_default.root, normalizeClassName(className)),
-		...props,
-		children: withHiddenInput(children, asChild)
-	});
+const RatingGroup_RatingGroupRootProvider = /*#__PURE__*/ forwardRef(function({ asChild, children, className, size = 'md', ...props }, ref) {
+    return /*#__PURE__*/ jsx(RatingGroup.RootProvider, {
+        ref: ref,
+        asChild: asChild,
+        "data-slot": "rating-group-root-provider",
+        "data-size": size,
+        className: clsx(RatingGroup_module.root, normalizeClassName(className)),
+        ...props,
+        children: withHiddenInput(children, asChild)
+    });
 });
-const RatingGroupLabel = forwardRef(function RatingGroupLabel({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(RatingGroup.Label, {
-		ref,
-		"data-slot": "rating-group-label",
-		className: clsx(RatingGroup_module_default.label, normalizeClassName(className)),
-		...props
-	});
+const RatingGroup_RatingGroupLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(RatingGroup.Label, {
+        ref: ref,
+        "data-slot": "rating-group-label",
+        className: clsx(RatingGroup_module.label, normalizeClassName(className)),
+        ...props
+    });
 });
-const RatingGroupControl = forwardRef(function RatingGroupControl({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(RatingGroup.Control, {
-		ref,
-		"data-slot": "rating-group-control",
-		className: clsx(RatingGroup_module_default.control, normalizeClassName(className)),
-		...props
-	});
+const RatingGroup_RatingGroupControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(RatingGroup.Control, {
+        ref: ref,
+        "data-slot": "rating-group-control",
+        className: clsx(RatingGroup_module.control, normalizeClassName(className)),
+        ...props
+    });
 });
-const RatingGroupItem = forwardRef(function RatingGroupItem({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(RatingGroup.Item, {
-		ref,
-		"data-slot": "rating-group-item",
-		className: clsx(RatingGroup_module_default.item, normalizeClassName(className)),
-		...props
-	});
+const RatingGroup_RatingGroupItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(RatingGroup.Item, {
+        ref: ref,
+        "data-slot": "rating-group-item",
+        className: clsx(RatingGroup_module.item, normalizeClassName(className)),
+        ...props
+    });
 });
-const RatingGroupItemIndicator = forwardRef(function RatingGroupItemIndicator({ className, children, ...props }, ref) {
-	const { half, highlighted } = useRatingGroupItemContext();
-	return /* @__PURE__ */ jsx("span", {
-		ref,
-		"data-slot": "rating-group-item-indicator",
-		"data-half": half ? "" : void 0,
-		"data-highlighted": highlighted ? "" : void 0,
-		className: clsx(RatingGroup_module_default.itemIndicator, normalizeClassName(className)),
-		...props,
-		children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(RatingStarIcon, {
-			"data-slot": "rating-group-item-indicator-bg",
-			className: RatingGroup_module_default.iconBg
-		}), /* @__PURE__ */ jsx(RatingStarIcon, {
-			"data-slot": "rating-group-item-indicator-fg",
-			className: RatingGroup_module_default.iconFg
-		})] })
-	});
+const RatingGroup_RatingGroupItemIndicator = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
+    const { half, highlighted } = useRatingGroupItemContext();
+    return /*#__PURE__*/ jsx("span", {
+        ref: ref,
+        "data-slot": "rating-group-item-indicator",
+        "data-half": half ? '' : void 0,
+        "data-highlighted": highlighted ? '' : void 0,
+        className: clsx(RatingGroup_module.itemIndicator, normalizeClassName(className)),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ jsx(RatingStarIcon, {
+                    "data-slot": "rating-group-item-indicator-bg",
+                    className: RatingGroup_module.iconBg
+                }),
+                /*#__PURE__*/ jsx(RatingStarIcon, {
+                    "data-slot": "rating-group-item-indicator-fg",
+                    className: RatingGroup_module.iconFg
+                })
+            ]
+        })
+    });
 });
 function withHiddenInput(children, asChild) {
-	const hiddenInput = /* @__PURE__ */ jsx(RatingGroup.HiddenInput, { "data-slot": "rating-group-hidden-input" });
-	if (!asChild) return /* @__PURE__ */ jsxs(Fragment$1, { children: [children, hiddenInput] });
-	const child = Children.only(children);
-	return cloneElement(child, {}, child.props.children, hiddenInput);
+    const hiddenInput = /*#__PURE__*/ jsx(RatingGroup.HiddenInput, {
+        "data-slot": "rating-group-hidden-input"
+    });
+    if (!asChild) return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            children,
+            hiddenInput
+        ]
+    });
+    const child = Children.only(children);
+    return /*#__PURE__*/ cloneElement(child, {}, child.props.children, hiddenInput);
 }
 function RatingGroupItems({ children }) {
-	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(RatingGroup.Context, { children: ({ items }) => items.map((item) => /* @__PURE__ */ jsx(RatingGroupItem, {
-		index: item,
-		children: children ?? /* @__PURE__ */ jsx(RatingGroupItemIndicator, {})
-	}, item)) }) });
+    return /*#__PURE__*/ jsx(Fragment, {
+        children: /*#__PURE__*/ jsx(RatingGroup.Context, {
+            children: ({ items })=>items.map((item)=>/*#__PURE__*/ jsx(RatingGroup_RatingGroupItem, {
+                        index: item,
+                        children: children ?? /*#__PURE__*/ jsx(RatingGroup_RatingGroupItemIndicator, {})
+                    }, item))
+        })
+    });
 }
-const RatingGroup$1 = Object.assign(RatingGroupRoot, {
-	Root: RatingGroupRoot,
-	RootProvider: RatingGroupRootProvider,
-	Context: RatingGroup.Context,
-	Label: RatingGroupLabel,
-	Control: RatingGroupControl,
-	Item: RatingGroupItem,
-	ItemContext: RatingGroup.ItemContext,
-	ItemIndicator: RatingGroupItemIndicator,
-	Items: RatingGroupItems
+const RatingGroup_RatingGroup = Object.assign(RatingGroup_RatingGroupRoot, {
+    Root: RatingGroup_RatingGroupRoot,
+    RootProvider: RatingGroup_RatingGroupRootProvider,
+    Context: RatingGroup.Context,
+    Label: RatingGroup_RatingGroupLabel,
+    Control: RatingGroup_RatingGroupControl,
+    Item: RatingGroup_RatingGroupItem,
+    ItemContext: RatingGroup.ItemContext,
+    ItemIndicator: RatingGroup_RatingGroupItemIndicator,
+    Items: RatingGroupItems
 });
-//#endregion
-export { RatingGroup$1 as RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext };
+export { RatingGroup_RatingGroup as RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext };

package/dist/components/rating-group/RatingGroup.module.js

@@ -1,13 +1,11 @@
-import './RatingGroup.css';
-//#region src/components/rating-group/RatingGroup.module.css
-var RatingGroup_module_default = {
-	"control": "Jh_n9a_control",
-	"iconBg": "Jh_n9a_iconBg",
-	"iconFg": "Jh_n9a_iconFg",
-	"item": "Jh_n9a_item",
-	"itemIndicator": "Jh_n9a_itemIndicator",
-	"label": "Jh_n9a_label",
-	"root": "Jh_n9a_root"
+import "./RatingGroup_module.css";
+const RatingGroup_module = {
+    root: "root-estfrz",
+    label: "label-UyOU8X",
+    control: "control-WjR44a",
+    item: "item-KSLnDf",
+    itemIndicator: "itemIndicator-vRie_M",
+    iconFg: "iconFg-SJSzOf",
+    iconBg: "iconBg-VMO5ZC"
 };
-//#endregion
-export { RatingGroup_module_default as default };
+export default RatingGroup_module;

package/dist/components/rating-group/RatingGroup_module.css

@@ -0,0 +1,139 @@
+@layer moduix.components {
+  .root-estfrz {
+    gap: var(--moduix-rating-group-root-gap, var(--moduix-spacing-1));
+    color: var(--moduix-rating-group-color, var(--moduix-color-muted-foreground));
+    flex-direction: column;
+    display: inline-flex;
+  }
+
+  .root-estfrz[data-size="xs"] {
+    --_rating-group-icon-size: var(--moduix-rating-group-icon-size-xs, var(--moduix-spacing-3-5));
+  }
+
+  .root-estfrz[data-size="sm"] {
+    --_rating-group-icon-size: var(--moduix-rating-group-icon-size-sm, var(--moduix-spacing-4));
+  }
+
+  .root-estfrz[data-size="md"] {
+    --_rating-group-icon-size: var(--moduix-rating-group-icon-size-md, var(--moduix-spacing-5));
+  }
+
+  .root-estfrz[data-size="lg"] {
+    --_rating-group-icon-size: var(--moduix-rating-group-icon-size-lg, var(--moduix-spacing-6));
+  }
+
+  .root-estfrz[data-size="xl"] {
+    --_rating-group-icon-size: var(--moduix-rating-group-icon-size-xl, var(--moduix-spacing-7));
+  }
+
+  .label-UyOU8X {
+    color: var(--moduix-rating-group-label-color, var(--moduix-color-foreground));
+    font-size: var(--moduix-rating-group-label-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-rating-group-label-font-weight, var(--moduix-weight-semibold));
+    line-height: var(--moduix-rating-group-label-line-height, var(--moduix-line-height-text-sm));
+    -webkit-user-select: none;
+    user-select: none;
+  }
+
+  .label-UyOU8X[data-disabled] {
+    opacity: var(--moduix-rating-group-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .control-WjR44a {
+    align-items: center;
+    gap: var(--moduix-rating-group-gap, var(--moduix-spacing-1));
+    display: inline-flex;
+  }
+
+  .control-WjR44a[data-disabled] {
+    opacity: var(--moduix-rating-group-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .item-KSLnDf {
+    border-radius: var(--moduix-radius-sm);
+    color: inherit;
+    cursor: pointer;
+    transition: color var(--moduix-rating-group-transition, var(--moduix-transition-default)),
+      opacity var(--moduix-rating-group-transition, var(--moduix-transition-default));
+    background-color: #0000;
+    border: 0;
+    justify-content: center;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+    line-height: 0;
+    display: inline-flex;
+  }
+
+  .item-KSLnDf[data-readonly], .item-KSLnDf[data-disabled] {
+    cursor: default;
+  }
+
+  .item-KSLnDf[data-disabled] {
+    pointer-events: none;
+  }
+
+  .item-KSLnDf[data-focus-visible], .item-KSLnDf:focus-visible {
+    outline: var(--moduix-rating-group-focus-ring-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm)))
+        solid var(--moduix-rating-group-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-rating-group-focus-ring-offset, var(--moduix-border-width-sm));
+  }
+
+  .itemIndicator-vRie_M {
+    width: var(--_rating-group-icon-size, var(--moduix-rating-group-icon-size-md, var(--moduix-spacing-5)));
+    height: var(--_rating-group-icon-size, var(--moduix-rating-group-icon-size-md, var(--moduix-spacing-5)));
+    color: var(--moduix-rating-group-active-color, var(--moduix-color-primary));
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+    position: relative;
+  }
+
+  .itemIndicator-vRie_M > svg {
+    width: 100%;
+    height: 100%;
+    transition: color var(--moduix-rating-group-transition, var(--moduix-transition-default)),
+        fill var(--moduix-rating-group-transition, var(--moduix-transition-default)),
+        stroke var(--moduix-rating-group-transition, var(--moduix-transition-default)),
+        clip-path var(--moduix-rating-group-transition, var(--moduix-transition-default));
+    flex: none;
+  }
+
+  .itemIndicator-vRie_M[data-half] .iconFg-SJSzOf {
+    clip-path: inset(0 50% 0 0);
+  }
+
+  .itemIndicator-vRie_M:not([data-highlighted]) .iconFg-SJSzOf {
+    clip-path: inset(0 100% 0 0);
+  }
+
+  .item-KSLnDf[data-half] .iconFg-SJSzOf {
+    clip-path: inset(0 50% 0 0);
+  }
+
+  .item-KSLnDf:not([data-highlighted]) .iconFg-SJSzOf {
+    clip-path: inset(0 100% 0 0);
+  }
+
+  .root-estfrz:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) .itemIndicator-vRie_M[data-half] .iconFg-SJSzOf, .root-estfrz:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) .item-KSLnDf[data-half] .iconFg-SJSzOf {
+    clip-path: inset(0 0 0 50%);
+  }
+
+  .iconBg-VMO5ZC {
+    color: var(--moduix-rating-group-color, var(--moduix-color-muted-foreground));
+    fill: #0000;
+    stroke: currentColor;
+    position: absolute;
+    inset: 0;
+  }
+
+  .iconFg-SJSzOf {
+    color: var(--moduix-rating-group-active-color, var(--moduix-color-primary));
+    fill: currentColor;
+    stroke: currentColor;
+    clip-path: inset(0);
+    position: absolute;
+    inset: 0;
+  }
+}
+

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

@@ -1,2 +1,2 @@
-import { RatingGroup, RatingGroupItemIndicatorProps, RatingGroupRootProps, RatingGroupRootProviderProps, RatingGroupSize, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from "./RatingGroup.js";
-export { RatingGroup, type RatingGroupItemIndicatorProps, type RatingGroupRootProps, type RatingGroupRootProviderProps, type RatingGroupSize, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext };
+export { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext, } from './RatingGroup.js';
+export type { RatingGroupItemIndicatorProps, RatingGroupRootProps, RatingGroupRootProviderProps, RatingGroupSize, } from './RatingGroup.js';

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

@@ -0,0 +1 @@
+export { RatingGroup, useRatingGroup, useRatingGroupContext, useRatingGroupItemContext } from "./RatingGroup.js";

package/dist/components/scroll-area/ScrollArea.d.ts

@@ -1,24 +1,23 @@
-import { ComponentProps } from "react";
-import { ScrollArea } from "@ark-ui/react/scroll-area";
-
-//#region src/components/scroll-area/ScrollArea.d.ts
-type ModuixScrollAreaRootProps = ComponentProps<typeof ScrollArea.Root> & {
-  fade?: boolean;
-  variant?: 'hover' | 'always';
+import { ScrollArea as ScrollAreaPrimitive, useScrollArea, useScrollAreaContext } from '@ark-ui/react/scroll-area';
+import type { ComponentProps } from 'react';
+type ModuixScrollAreaRootProps = ComponentProps<typeof ScrollAreaPrimitive.Root> & {
+    fade?: boolean;
+    variant?: 'hover' | 'always';
 };
-type ModuixScrollAreaRootProviderProps = ComponentProps<typeof ScrollArea.RootProvider> & {
-  fade?: boolean;
-  variant?: 'hover' | 'always';
+type ModuixScrollAreaRootProviderProps = ComponentProps<typeof ScrollAreaPrimitive.RootProvider> & {
+    fade?: boolean;
+    variant?: 'hover' | 'always';
 };
-declare const ScrollArea$1: import("react").ForwardRefExoticComponent<Omit<ModuixScrollAreaRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-  Root: import("react").ForwardRefExoticComponent<Omit<ModuixScrollAreaRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  RootProvider: import("react").ForwardRefExoticComponent<Omit<ModuixScrollAreaRootProviderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Viewport: import("react").ForwardRefExoticComponent<Omit<ScrollArea.ViewportProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Content: import("react").ForwardRefExoticComponent<Omit<ScrollArea.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Scrollbar: import("react").ForwardRefExoticComponent<Omit<ScrollArea.ScrollbarProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Thumb: import("react").ForwardRefExoticComponent<Omit<ScrollArea.ThumbProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Corner: import("react").ForwardRefExoticComponent<Omit<ScrollArea.CornerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  useScrollArea: (props?: import("@ark-ui/react/scroll-area").UseScrollAreaProps) => import("@ark-ui/react/scroll-area").UseScrollAreaReturn;
+declare const ScrollArea: import("react").ForwardRefExoticComponent<Omit<ModuixScrollAreaRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<ModuixScrollAreaRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<ModuixScrollAreaRootProviderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: ScrollAreaPrimitive.ContextProps) => import("react").ReactNode;
+    Viewport: import("react").ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ViewportProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Content: import("react").ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Scrollbar: import("react").ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollbarProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Thumb: import("react").ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ThumbProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Corner: import("react").ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.CornerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    useScrollArea: (props?: import("@ark-ui/react/scroll-area").UseScrollAreaProps) => import("@ark-ui/react/scroll-area").UseScrollAreaReturn;
 };
-//#endregion
-export { type ModuixScrollAreaRootProps, type ModuixScrollAreaRootProviderProps, ScrollArea$1 as ScrollArea };
+export { ScrollArea, useScrollArea, useScrollAreaContext };
+export type { ModuixScrollAreaRootProps, ModuixScrollAreaRootProviderProps };