@moduix/react 2.5.1 → 2.7.0

package/README.md

@@ -23,7 +23,7 @@ properties, `className`, stable `data-slot` hooks, and Ark state attributes.
 Install the package and its Ark UI peer dependency:
 
 ```bash
-npm install @moduix/react @ark-ui/react
+pnpm add @moduix/react @ark-ui/react
 ```
 
 `react`, `react-dom`, and `@ark-ui/react` are peer dependencies. moduix supports React 18 and 19.
@@ -31,7 +31,7 @@ npm install @moduix/react @ark-ui/react
 The optional `Chart` component also requires its TanStack peer dependency:
 
 ```bash
-npm install @tanstack/charts
+pnpm add @tanstack/charts
 ```
 
 ## Add styles
@@ -132,12 +132,17 @@ form. Set up `components.json` with the [Quick start](https://moduix.dev/docs/qu
 the components you need:
 
 ```bash
-npx shadcn@latest add @moduix-react/button @moduix-react/dialog
+pnpm dlx shadcn@latest add @moduix-react/button @moduix-react/dialog
 ```
 
 Generated files include the component source, CSS Modules, and required supporting files. Their
 destination paths are controlled by your `components.json` aliases.
 
+## Compatibility
+
+The package is ESM-only and ships modern JavaScript targeting ES2023. Consume it through a modern
+application bundler configured for the browsers your application supports.
+
 ## Links
 
 - [Documentation](https://moduix.dev/)
@@ -145,6 +150,22 @@ destination paths are controlled by your `components.json` aliases.
 - [Source repository](https://github.com/Blinks44/moduix)
 - [Issues](https://github.com/Blinks44/moduix/issues)
 
+## Acknowledgements
+
+moduix is possible because of the work and ideas of these projects:
+
+- [Ark UI](https://ark-ui.com/) for the accessible, state-machine-backed primitives that define the
+  behavioral foundation.
+- [Chakra UI](https://chakra-ui.com/) for Ark-aligned composition ergonomics and design-system
+  craft.
+- [shadcn/ui](https://ui.shadcn.com/) for open-code distribution, beautiful defaults, and a
+  documentation style centered on practical ownership.
+- [UnoCSS](https://unocss.dev/) and [Tailwind CSS](https://tailwindcss.com/) for the foundations
+  adapted by the optional reset.
+- [Rstack](https://rstack.rs/) for its Rust-based ecosystem: Rspress for documentation, Rslib for
+  library builds, and Rstest for tests.
+- [VoidZero](https://voidzero.dev/) for the JavaScript tooling used throughout the workspace.
+
 ## License
 
 [MIT](./LICENSE.md)

package/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,49 @@
+# Third-Party Notices
+
+moduix uses and includes portions of Lucide Icons.
+
+## Lucide
+
+ISC License
+
+Copyright (c) 2026 Lucide Icons and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+
+---
+
+The following Lucide icons are derived from the Feather project:
+
+airplay, alert-circle, alert-octagon, alert-triangle, aperture, arrow-down-circle, arrow-down-left, arrow-down-right, arrow-down, arrow-left-circle, arrow-left, arrow-right-circle, arrow-right, arrow-up-circle, arrow-up-left, arrow-up-right, arrow-up, at-sign, calendar, cast, check, chevron-down, chevron-left, chevron-right, chevron-up, chevrons-down, chevrons-left, chevrons-right, chevrons-up, circle, clipboard, clock, code, columns, command, compass, corner-down-left, corner-down-right, corner-left-down, corner-left-up, corner-right-down, corner-right-up, corner-up-left, corner-up-right, crosshair, database, divide-circle, divide-square, dollar-sign, download, external-link, feather, frown, hash, headphones, help-circle, info, italic, key, layout, life-buoy, link-2, link, loader, lock, log-in, log-out, maximize, meh, minimize, minimize-2, minus-circle, minus-square, minus, monitor, moon, more-horizontal, more-vertical, move, music, navigation-2, navigation, octagon, pause-circle, percent, plus-circle, plus-square, plus, power, radio, rss, search, server, share, shopping-bag, sidebar, smartphone, smile, square, table-2, tablet, target, terminal, trash-2, trash, triangle, tv, type, upload, x-circle, x-octagon, x-square, x, zoom-in, zoom-out
+
+The MIT License (MIT) (for the icons listed above)
+
+Copyright (c) 2013-present Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/accordion/Accordion.js

@@ -5,55 +5,54 @@ import { ark } from "@ark-ui/react/factory";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
 import { PlusIcon } from "../../internal/icons/ui/index.js";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import Accordion_module from "./Accordion.module.js";
 const Accordion_AccordionRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Accordion.Root, {
         ref: ref,
-        "data-slot": "accordion-root",
-        className: clsx(Accordion_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(Accordion_module.root, className),
+        ...props,
+        "data-slot": "accordion-root"
     });
 });
 const Accordion_AccordionRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Accordion.RootProvider, {
         ref: ref,
-        "data-slot": "accordion-root-provider",
-        className: clsx(Accordion_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(Accordion_module.root, className),
+        ...props,
+        "data-slot": "accordion-root-provider"
     });
 });
 const Accordion_AccordionItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Accordion.Item, {
         ref: ref,
-        "data-slot": "accordion-item",
-        className: clsx(Accordion_module.item, normalizeClassName(className)),
-        ...props
+        className: clsx(Accordion_module.item, className),
+        ...props,
+        "data-slot": "accordion-item"
     });
 });
 const Accordion_AccordionItemTrigger = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Accordion.ItemTrigger, {
         ref: ref,
-        "data-slot": "accordion-item-trigger",
-        className: clsx(Accordion_module.itemTrigger, normalizeClassName(className)),
-        ...props
+        className: clsx(Accordion_module.itemTrigger, className),
+        ...props,
+        "data-slot": "accordion-item-trigger"
     });
 });
 const Accordion_AccordionItemIndicator = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Accordion.ItemIndicator, {
         ref: ref,
-        "data-slot": "accordion-item-indicator",
-        className: clsx(Accordion_module.itemIndicator, normalizeClassName(className)),
+        className: clsx(Accordion_module.itemIndicator, className),
         ...props,
+        "data-slot": "accordion-item-indicator",
         children: children ?? /*#__PURE__*/ jsx(PlusIcon, {})
     });
 });
 const Accordion_AccordionItemContent = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Accordion.ItemContent, {
         ref: ref,
-        "data-slot": "accordion-item-content",
-        className: clsx(Accordion_module.itemContent, normalizeClassName(className)),
-        ...props
+        className: clsx(Accordion_module.itemContent, className),
+        ...props,
+        "data-slot": "accordion-item-content"
     });
 });
 const Accordion_AccordionItemBody = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
@@ -61,9 +60,9 @@ const Accordion_AccordionItemBody = /*#__PURE__*/ forwardRef(function({ classNam
         ref: ref,
         "data-scope": "accordion",
         "data-part": "item-body",
-        "data-slot": "accordion-item-body",
-        className: clsx(Accordion_module.itemBody, normalizeClassName(className)),
-        ...props
+        className: clsx(Accordion_module.itemBody, className),
+        ...props,
+        "data-slot": "accordion-item-body"
     });
 });
 const Accordion_Accordion = Object.assign(Accordion_AccordionRoot, {

package/dist/components/alert/Alert.js

@@ -2,18 +2,17 @@ import { jsx } from "react/jsx-runtime";
 import { ark } from "@ark-ui/react/factory";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import Alert_module from "./Alert.module.js";
 const Alert_AlertRoot = /*#__PURE__*/ forwardRef(function({ children, className, role, status = 'info', ...props }, ref) {
     return /*#__PURE__*/ jsx(ark.div, {
         ref: ref,
-        role: role ?? ('error' === status ? 'alert' : 'status'),
+        role: role,
         "data-scope": "alert",
         "data-part": "root",
-        "data-slot": "alert-root",
         "data-status": status,
-        className: clsx(Alert_module.root, normalizeClassName(className)),
+        className: clsx(Alert_module.root, className),
         ...props,
+        "data-slot": "alert-root",
         children: children
     });
 });
@@ -22,10 +21,10 @@ const Alert_AlertIndicator = /*#__PURE__*/ forwardRef(function({ className, ...p
         ref: ref,
         "data-scope": "alert",
         "data-part": "indicator",
-        "data-slot": "alert-indicator",
         "aria-hidden": "true",
-        className: clsx(Alert_module.indicator, normalizeClassName(className)),
-        ...props
+        className: clsx(Alert_module.indicator, className),
+        ...props,
+        "data-slot": "alert-indicator"
     });
 });
 const Alert_AlertContent = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
@@ -33,9 +32,9 @@ const Alert_AlertContent = /*#__PURE__*/ forwardRef(function({ className, ...pro
         ref: ref,
         "data-scope": "alert",
         "data-part": "content",
-        "data-slot": "alert-content",
-        className: clsx(Alert_module.content, normalizeClassName(className)),
-        ...props
+        className: clsx(Alert_module.content, className),
+        ...props,
+        "data-slot": "alert-content"
     });
 });
 const Alert_AlertTitle = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
@@ -43,9 +42,9 @@ const Alert_AlertTitle = /*#__PURE__*/ forwardRef(function({ className, ...props
         ref: ref,
         "data-scope": "alert",
         "data-part": "title",
-        "data-slot": "alert-title",
-        className: clsx(Alert_module.title, normalizeClassName(className)),
-        ...props
+        className: clsx(Alert_module.title, className),
+        ...props,
+        "data-slot": "alert-title"
     });
 });
 const Alert_AlertDescription = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
@@ -53,9 +52,9 @@ const Alert_AlertDescription = /*#__PURE__*/ forwardRef(function({ className, ..
         ref: ref,
         "data-scope": "alert",
         "data-part": "description",
-        "data-slot": "alert-description",
-        className: clsx(Alert_module.description, normalizeClassName(className)),
-        ...props
+        className: clsx(Alert_module.description, className),
+        ...props,
+        "data-slot": "alert-description"
     });
 });
 const Alert_AlertActions = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
@@ -63,9 +62,9 @@ const Alert_AlertActions = /*#__PURE__*/ forwardRef(function({ className, ...pro
         ref: ref,
         "data-scope": "alert",
         "data-part": "actions",
-        "data-slot": "alert-actions",
-        className: clsx(Alert_module.actions, normalizeClassName(className)),
-        ...props
+        className: clsx(Alert_module.actions, className),
+        ...props,
+        "data-slot": "alert-actions"
     });
 });
 const Alert = Object.assign(Alert_AlertRoot, {

package/dist/components/alert/Alert_module.css

@@ -2,8 +2,7 @@
   .root-QHB4Xj {
     box-sizing: border-box;
     align-items: start;
-    row-gap: var(--moduix-alert-content-gap, var(--moduix-spacing-1));
-    column-gap: var(--moduix-alert-gap, var(--moduix-spacing-3));
+    gap: var(--moduix-alert-gap, var(--moduix-spacing-3));
     border: var(--moduix-alert-border-width, var(--moduix-border-width-sm)) solid
       var(--moduix-alert-border-color, var(--_alert-border-color-default, var(--moduix-color-border)));
     border-radius: var(--moduix-alert-radius, var(--moduix-radius-lg));
@@ -17,12 +16,7 @@
     --_alert-border-color-default: var(--moduix-alert-info-border-color, var(--moduix-color-border));
     --_alert-color-default: var(--moduix-alert-info-color, var(--moduix-color-card-foreground));
     --_alert-indicator-color-default: var(--moduix-alert-info-indicator-color, var(--moduix-color-muted-foreground));
-    grid-template-columns: auto minmax(0, 1fr);
-    display: grid;
-  }
-
-  .root-QHB4Xj > [data-part="title"], .root-QHB4Xj > [data-part="description"] {
-    grid-column: 2;
+    display: flex;
   }
 
   .root-QHB4Xj[data-status="success"] {
@@ -46,14 +40,6 @@
     --_alert-indicator-color-default: var(--moduix-alert-error-indicator-color, var(--moduix-color-destructive));
   }
 
-  .root-QHB4Xj:not(:has( > [data-part="indicator"])) {
-    grid-template-columns: minmax(0, 1fr);
-  }
-
-  .root-QHB4Xj:not(:has( > [data-part="indicator"])) > [data-part="content"], .root-QHB4Xj:not(:has( > [data-part="indicator"])) > [data-part="title"], .root-QHB4Xj:not(:has( > [data-part="indicator"])) > [data-part="description"] {
-    grid-column: 1;
-  }
-
   .indicator-FFj13M {
     width: var(--moduix-alert-indicator-size, var(--moduix-spacing-4));
     height: var(--moduix-alert-indicator-size, var(--moduix-spacing-4));
@@ -73,6 +59,7 @@
 
   .content-wQ3ew3 {
     gap: var(--moduix-alert-content-gap, var(--moduix-spacing-1));
+    flex: 1;
     min-width: 0;
     display: grid;
   }

package/dist/components/angle-slider/AngleSlider.d.ts

@@ -6,19 +6,13 @@ type AngleSliderMarksProps = Omit<ComponentProps<typeof AngleSliderPrimitive.Mar
 declare function AngleSliderMarks({ values, ...props }: AngleSliderMarksProps): import("react").JSX.Element;
 type AngleSliderDialProps = Omit<ComponentProps<typeof AngleSliderPrimitive.Control>, 'asChild' | 'children'> & {
     children?: ReactNode;
-    thumbClassName?: string;
 };
-declare function AngleSliderDial({ children, thumbClassName, ...props }: AngleSliderDialProps): import("react").JSX.Element;
-declare const AngleSlider: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement> & {
-    form?: string;
-}, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-    Root: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement> & {
-        form?: string;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    RootProvider: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement> & {
-        form?: string;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare function AngleSliderDial({ children, ...props }: AngleSliderDialProps): import("react").JSX.Element;
+declare const AngleSlider: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Context: (props: AngleSliderPrimitive.ContextProps) => ReactNode;
+    HiddenInput: import("react").ForwardRefExoticComponent<AngleSliderPrimitive.HiddenInputProps & import("react").RefAttributes<HTMLInputElement>>;
     Label: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
     Control: import("react").ForwardRefExoticComponent<Omit<AngleSliderPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Dial: typeof AngleSliderDial;

package/dist/components/angle-slider/AngleSlider.js

@@ -1,105 +1,64 @@
 "use client";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { AngleSlider, useAngleSlider, useAngleSliderContext } from "@ark-ui/react/angle-slider";
 import { clsx } from "clsx";
-import { Children, cloneElement, forwardRef, useEffect, useRef } from "react";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
+import { forwardRef } from "react";
 import AngleSlider_module from "./AngleSlider.module.js";
-const AngleSlider_AngleSliderRoot = /*#__PURE__*/ forwardRef(function({ asChild, children, className, defaultValue, form, value, ...props }, ref) {
+const AngleSlider_AngleSliderRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.Root, {
         ref: ref,
-        "data-slot": "angle-slider-root",
-        className: clsx(AngleSlider_module.root, normalizeClassName(className)),
-        asChild: asChild,
-        defaultValue: defaultValue,
-        value: value,
+        className: clsx(AngleSlider_module.root, className),
         ...props,
-        children: withHiddenInput(children, asChild, form, void 0 === value ? defaultValue ?? 0 : void 0)
+        "data-slot": "angle-slider-root"
     });
 });
 const AngleSlider_AngleSliderLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.Label, {
         ref: ref,
-        "data-slot": "angle-slider-label",
-        className: clsx(AngleSlider_module.label, normalizeClassName(className)),
-        ...props
+        className: clsx(AngleSlider_module.label, className),
+        ...props,
+        "data-slot": "angle-slider-label"
     });
 });
-const AngleSlider_AngleSliderRootProvider = /*#__PURE__*/ forwardRef(function({ asChild, children, className, form, value, ...props }, ref) {
-    const initialValue = useRef(value.value);
+const AngleSlider_AngleSliderRootProvider = /*#__PURE__*/ forwardRef(function({ className, value, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.RootProvider, {
         ref: ref,
-        "data-slot": "angle-slider-root-provider",
-        className: clsx(AngleSlider_module.root, normalizeClassName(className)),
-        asChild: asChild,
+        className: clsx(AngleSlider_module.root, className),
         value: value,
         ...props,
-        children: withHiddenInput(children, asChild, form, initialValue.current)
+        "data-slot": "angle-slider-root-provider"
     });
 });
-function AngleSliderHiddenInput({ form, resetValue }) {
-    const angleSlider = useAngleSliderContext();
-    const inputRef = useRef(null);
-    useEffect(()=>{
-        const formElement = inputRef.current?.form;
-        if (!formElement || void 0 === resetValue) return;
-        const handleReset = ()=>angleSlider.setValue(resetValue);
-        formElement.addEventListener('reset', handleReset);
-        return ()=>formElement.removeEventListener('reset', handleReset);
-    }, [
-        angleSlider,
-        resetValue
-    ]);
-    return /*#__PURE__*/ jsx(AngleSlider.HiddenInput, {
-        ref: inputRef,
-        "data-slot": "angle-slider-hidden-input",
-        form: form
-    });
-}
-function withHiddenInput(children, asChild, form, resetValue) {
-    const hiddenInput = /*#__PURE__*/ jsx(AngleSliderHiddenInput, {
-        form: form,
-        resetValue: resetValue
-    });
-    if (!asChild) return /*#__PURE__*/ jsxs(Fragment, {
-        children: [
-            children,
-            hiddenInput
-        ]
-    });
-    const child = Children.only(children);
-    return /*#__PURE__*/ cloneElement(child, {}, child.props.children, hiddenInput);
-}
 const AngleSlider_AngleSliderControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.Control, {
         ref: ref,
-        "data-slot": "angle-slider-control",
-        className: clsx(AngleSlider_module.control, normalizeClassName(className)),
-        ...props
+        className: clsx(AngleSlider_module.control, className),
+        ...props,
+        "data-slot": "angle-slider-control"
     });
 });
 const AngleSlider_AngleSliderThumb = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.Thumb, {
         ref: ref,
-        "data-slot": "angle-slider-thumb",
-        className: clsx(AngleSlider_module.thumb, normalizeClassName(className)),
-        ...props
+        className: clsx(AngleSlider_module.thumb, className),
+        ...props,
+        "data-slot": "angle-slider-thumb"
     });
 });
 const AngleSlider_AngleSliderMarkerGroup = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.MarkerGroup, {
         ref: ref,
-        "data-slot": "angle-slider-marker-group",
-        className: clsx(AngleSlider_module.markerGroup, normalizeClassName(className)),
-        ...props
+        className: clsx(AngleSlider_module.markerGroup, className),
+        ...props,
+        "data-slot": "angle-slider-marker-group"
     });
 });
 const AngleSlider_AngleSliderMarker = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.Marker, {
         ref: ref,
-        "data-slot": "angle-slider-marker",
-        className: clsx(AngleSlider_module.marker, normalizeClassName(className)),
-        ...props
+        className: clsx(AngleSlider_module.marker, className),
+        ...props,
+        "data-slot": "angle-slider-marker"
     });
 });
 function AngleSliderMarks({ values, ...props }) {
@@ -110,29 +69,28 @@ function AngleSliderMarks({ values, ...props }) {
             }, `${value}-${index}`))
     });
 }
-function AngleSliderDial({ children, thumbClassName, ...props }) {
+function AngleSliderDial({ children, ...props }) {
     return /*#__PURE__*/ jsxs(AngleSlider_AngleSliderControl, {
         ...props,
         children: [
             children,
-            /*#__PURE__*/ jsx(AngleSlider_AngleSliderThumb, {
-                className: thumbClassName
-            })
+            /*#__PURE__*/ jsx(AngleSlider_AngleSliderThumb, {})
         ]
     });
 }
 const AngleSlider_AngleSliderValueText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(AngleSlider.ValueText, {
         ref: ref,
-        "data-slot": "angle-slider-value-text",
-        className: clsx(AngleSlider_module.valueText, normalizeClassName(className)),
-        ...props
+        className: clsx(AngleSlider_module.valueText, className),
+        ...props,
+        "data-slot": "angle-slider-value-text"
     });
 });
 const AngleSlider_AngleSlider = Object.assign(AngleSlider_AngleSliderRoot, {
     Root: AngleSlider_AngleSliderRoot,
     RootProvider: AngleSlider_AngleSliderRootProvider,
     Context: AngleSlider.Context,
+    HiddenInput: AngleSlider.HiddenInput,
     Label: AngleSlider_AngleSliderLabel,
     Control: AngleSlider_AngleSliderControl,
     Dial: AngleSliderDial,

package/dist/components/aspect-ratio/AspectRatio.js

@@ -2,7 +2,6 @@ import { jsx } from "react/jsx-runtime";
 import { ark } from "@ark-ui/react/factory";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import AspectRatio_module from "./AspectRatio.module.js";
 const AspectRatio_AspectRatioRoot = /*#__PURE__*/ forwardRef(function({ ratio, className, style, ...props }, ref) {
     if (!Number.isFinite(ratio) || ratio <= 0) throw new RangeError('AspectRatio `ratio` must be a finite number greater than zero.');
@@ -12,7 +11,7 @@ const AspectRatio_AspectRatioRoot = /*#__PURE__*/ forwardRef(function({ ratio, c
         "data-scope": "aspect-ratio",
         "data-part": "root",
         "data-slot": "aspect-ratio-root",
-        className: clsx(AspectRatio_module.root, normalizeClassName(className)),
+        className: clsx(AspectRatio_module.root, className),
         style: {
             ...style,
             '--_aspect-ratio-value': ratio

package/dist/components/aspect-ratio/AspectRatio_module.css

@@ -4,21 +4,8 @@
     box-sizing: border-box;
     width: 100%;
     aspect-ratio: var(--_aspect-ratio-value);
-    border-radius: var(--moduix-aspect-ratio-radius, var(--moduix-radius-md));
     display: block;
     position: relative;
-    overflow: hidden;
-  }
-
-  .root-_8OMdK > :where(img, video, iframe, canvas, svg) {
-    box-sizing: border-box;
-    width: 100%;
-    height: 100%;
-    display: block;
-  }
-
-  .root-_8OMdK > iframe {
-    border: 0;
   }
 }
 

package/dist/components/avatar/Avatar.d.ts

@@ -1,5 +1,5 @@
 import { Avatar as AvatarPrimitive, useAvatar, useAvatarContext } from '@ark-ui/react/avatar';
-import { type ComponentProps, type ReactNode } from 'react';
+import { type ComponentProps } from 'react';
 type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 type AvatarRootProps = ComponentProps<typeof AvatarPrimitive.Root> & {
     size?: AvatarSize;
@@ -7,14 +7,11 @@ type AvatarRootProps = ComponentProps<typeof AvatarPrimitive.Root> & {
 type AvatarRootProviderProps = ComponentProps<typeof AvatarPrimitive.RootProvider> & {
     size?: AvatarSize;
 };
-type AvatarFallbackProps = ComponentProps<typeof AvatarPrimitive.Fallback> & {
-    name?: string;
-};
 declare const Avatar: import("react").ForwardRefExoticComponent<Omit<AvatarRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
     Root: import("react").ForwardRefExoticComponent<Omit<AvatarRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     RootProvider: import("react").ForwardRefExoticComponent<Omit<AvatarRootProviderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Context: (props: AvatarPrimitive.ContextProps) => ReactNode;
+    Context: (props: AvatarPrimitive.ContextProps) => import("react").ReactNode;
     Image: import("react").ForwardRefExoticComponent<Omit<AvatarPrimitive.ImageProps & import("react").RefAttributes<HTMLImageElement>, "ref"> & import("react").RefAttributes<HTMLImageElement>>;
-    Fallback: import("react").ForwardRefExoticComponent<Omit<AvatarFallbackProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Fallback: import("react").ForwardRefExoticComponent<Omit<AvatarPrimitive.FallbackProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 };
 export { Avatar, useAvatar, useAvatarContext };