@moduix/react 2.5.1 → 2.7.0

package/dist/components/navigation-menu/NavigationMenu.js

@@ -1,123 +1,104 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { NavigationMenu, useNavigationMenu, useNavigationMenuContext } from "@ark-ui/react/navigation-menu";
 import { clsx } from "clsx";
-import { Children, forwardRef, isValidElement } from "react";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
+import { forwardRef } from "react";
 import NavigationMenu_module from "./NavigationMenu.module.js";
 const NavigationMenu_NavigationMenuRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Root, {
         ref: ref,
-        "data-slot": "navigation-menu-root",
-        className: clsx(NavigationMenu_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.root, className),
+        ...props,
+        "data-slot": "navigation-menu-root"
     });
 });
 const NavigationMenu_NavigationMenuRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.RootProvider, {
         ref: ref,
-        "data-slot": "navigation-menu-root-provider",
-        className: clsx(NavigationMenu_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.root, className),
+        ...props,
+        "data-slot": "navigation-menu-root-provider"
     });
 });
 const NavigationMenu_NavigationMenuList = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.List, {
         ref: ref,
-        "data-slot": "navigation-menu-list",
-        className: clsx(NavigationMenu_module.list, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.list, className),
+        ...props,
+        "data-slot": "navigation-menu-list"
     });
 });
 const NavigationMenu_NavigationMenuItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Item, {
         ref: ref,
-        "data-slot": "navigation-menu-item",
-        className: clsx(NavigationMenu_module.item, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.item, className),
+        ...props,
+        "data-slot": "navigation-menu-item"
     });
 });
 const NavigationMenu_NavigationMenuTrigger = /*#__PURE__*/ forwardRef(function({ asChild, className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Trigger, {
         ref: ref,
         asChild: asChild,
-        "data-slot": "navigation-menu-trigger",
-        className: clsx(!asChild && NavigationMenu_module.trigger, normalizeClassName(className)),
-        ...props
-    });
-});
-const NavigationMenu_NavigationMenuContent = /*#__PURE__*/ forwardRef(function({ asChild, className, children, ...props }, ref) {
-    if (asChild) return /*#__PURE__*/ jsx(NavigationMenu.Content, {
-        ref: ref,
-        asChild: true,
-        "data-slot": "navigation-menu-content",
-        className: clsx(NavigationMenu_module.content, normalizeClassName(className)),
+        className: clsx(!asChild && NavigationMenu_module.trigger, className),
         ...props,
-        children: children
+        "data-slot": "navigation-menu-trigger"
     });
-    const childrenArray = Children.toArray(children);
-    const indicators = childrenArray.filter((child)=>/*#__PURE__*/ isValidElement(child) && child.type === NavigationMenu_NavigationMenuIndicator);
-    const content = childrenArray.filter((child)=>!/*#__PURE__*/ isValidElement(child) || child.type !== NavigationMenu_NavigationMenuIndicator);
-    return /*#__PURE__*/ jsxs(NavigationMenu.Content, {
+});
+const NavigationMenu_NavigationMenuContent = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(NavigationMenu.Content, {
         ref: ref,
-        "data-slot": "navigation-menu-content",
-        className: clsx(NavigationMenu_module.content, normalizeClassName(className)),
+        className: clsx(NavigationMenu_module.content, className),
         ...props,
-        children: [
-            indicators,
-            /*#__PURE__*/ jsx("div", {
-                className: NavigationMenu_module.contentViewport,
-                children: content
-            })
-        ]
+        "data-slot": "navigation-menu-content"
     });
 });
 const NavigationMenu_NavigationMenuLink = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Link, {
         ref: ref,
-        "data-slot": "navigation-menu-link",
-        className: clsx(NavigationMenu_module.link, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.link, className),
+        ...props,
+        "data-slot": "navigation-menu-link"
     });
 });
 const NavigationMenu_NavigationMenuIndicator = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Indicator, {
         ref: ref,
-        "data-slot": "navigation-menu-indicator",
-        className: clsx(NavigationMenu_module.indicator, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.indicator, className),
+        ...props,
+        "data-slot": "navigation-menu-indicator"
     });
 });
 const NavigationMenu_NavigationMenuItemIndicator = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.ItemIndicator, {
         ref: ref,
-        "data-slot": "navigation-menu-item-indicator",
-        className: clsx(NavigationMenu_module.itemIndicator, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.itemIndicator, className),
+        ...props,
+        "data-slot": "navigation-menu-item-indicator"
     });
 });
 const NavigationMenu_NavigationMenuArrow = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Arrow, {
         ref: ref,
-        "data-slot": "navigation-menu-arrow",
-        className: clsx(NavigationMenu_module.arrow, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.arrow, className),
+        ...props,
+        "data-slot": "navigation-menu-arrow"
     });
 });
 const NavigationMenu_NavigationMenuViewportPositioner = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.ViewportPositioner, {
         ref: ref,
-        "data-slot": "navigation-menu-viewport-positioner",
-        className: clsx(NavigationMenu_module.viewportPositioner, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.viewportPositioner, className),
+        ...props,
+        "data-slot": "navigation-menu-viewport-positioner"
     });
 });
 const NavigationMenu_NavigationMenuViewport = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NavigationMenu.Viewport, {
         ref: ref,
-        "data-slot": "navigation-menu-viewport",
-        className: clsx(NavigationMenu_module.viewport, normalizeClassName(className)),
-        ...props
+        className: clsx(NavigationMenu_module.viewport, className),
+        ...props,
+        "data-slot": "navigation-menu-viewport"
     });
 });
 const NavigationMenu_NavigationMenu = Object.assign(NavigationMenu_NavigationMenuRoot, {

package/dist/components/navigation-menu/NavigationMenu.module.js

@@ -5,15 +5,14 @@ const NavigationMenu_module = {
     item: "item-LmKKOe",
     viewportPositioner: "viewportPositioner-hUgOWA",
     viewport: "viewport-Gtf85E",
+    indicator: "indicator-f9Famp",
+    content: "content-dvfEnJ",
     trigger: "trigger-Qt8Wrp",
     link: "link-HFA7O5",
-    content: "content-dvfEnJ",
     "navigation-menu-content-in": "navigation-menu-content-in-z6oz3S",
     navigationMenuContentIn: "navigation-menu-content-in-z6oz3S",
     "navigation-menu-content-out": "navigation-menu-content-out-PRe3xI",
     navigationMenuContentOut: "navigation-menu-content-out-PRe3xI",
-    contentViewport: "contentViewport-MCA9d7",
-    indicator: "indicator-f9Famp",
     "navigation-menu-indicator-in": "navigation-menu-indicator-in-CVxbn2",
     navigationMenuIndicatorIn: "navigation-menu-indicator-in-CVxbn2",
     "navigation-menu-indicator-out": "navigation-menu-indicator-out-rEIfTV",

package/dist/components/navigation-menu/NavigationMenu_module.css

@@ -1,7 +1,6 @@
 @layer moduix.components {
   .root-l1uCDR {
     box-sizing: border-box;
-    inline-size: -moz-fit-content;
     inline-size: fit-content;
     min-inline-size: 0;
     max-inline-size: 100%;
@@ -32,10 +31,14 @@
     position: relative;
   }
 
-  .root-l1uCDR:has( > .viewportPositioner-hUgOWA > .viewport-Gtf85E) .item-LmKKOe {
+  :is(.root-l1uCDR:has( > .viewportPositioner-hUgOWA > .viewport-Gtf85E) .item-LmKKOe, .list-vJ6fy3:has( > .indicator-f9Famp) .item-LmKKOe) {
     position: static;
   }
 
+  .list-vJ6fy3:has( > .indicator-f9Famp) .content-dvfEnJ[data-state="closed"] {
+    animation: none;
+  }
+
   .trigger-Qt8Wrp, .link-HFA7O5 {
     box-sizing: border-box;
     min-block-size: var(--moduix-navigation-menu-trigger-height, var(--moduix-size-md));
@@ -109,6 +112,8 @@
       calc(100vw - var(--moduix-spacing-6)));
     max-inline-size: min(var(--moduix-navigation-menu-content-max-width, 20rem),
       calc(100vw - var(--moduix-spacing-6)));
+    max-block-size: min(var(--moduix-navigation-menu-content-max-height, 24rem),
+      calc(100dvh - var(--moduix-spacing-6)));
     outline: var(--moduix-navigation-menu-content-border-width, var(--moduix-border-width-sm)) solid
       var(--moduix-navigation-menu-content-border-color, var(--moduix-color-border));
     border-radius: var(--moduix-navigation-menu-content-radius, var(--moduix-radius-md));
@@ -123,7 +128,7 @@
     position: absolute;
     inset-block-start: calc(100% + var(--moduix-navigation-menu-content-offset, var(--moduix-spacing-2)));
     inset-inline-start: 0;
-    overflow: visible;
+    overflow: auto;
   }
 
   .content-dvfEnJ[dir="rtl"] {
@@ -145,16 +150,6 @@
     pointer-events: none;
   }
 
-  .contentViewport-MCA9d7 {
-    z-index: 1;
-    max-block-size: min(var(--moduix-navigation-menu-content-max-height, 24rem),
-      calc(100dvh - var(--moduix-spacing-6)));
-    flex-direction: column;
-    display: flex;
-    position: relative;
-    overflow: auto;
-  }
-
   .content-dvfEnJ .link-HFA7O5 {
     margin-inline: var(--moduix-popup-highlight-inset-x, var(--moduix-spacing-1));
     border-radius: var(--moduix-navigation-menu-content-link-radius, var(--moduix-radius-sm));
@@ -187,13 +182,15 @@
   }
 
   .list-vJ6fy3 > .indicator-f9Famp {
+    z-index: calc(var(--moduix-navigation-menu-content-z-index, var(--moduix-z-popup)) + 1);
     inset-block-start: auto;
     inset-block-end: calc(-1 * var(--moduix-navigation-menu-indicator-size, var(--moduix-spacing-2-5)));
   }
 
   .arrow-oIu4Ws {
-    inline-size: var(--moduix-navigation-menu-arrow-size, var(--moduix-spacing-2-5));
-    block-size: var(--moduix-navigation-menu-arrow-size, var(--moduix-spacing-2-5));
+    --arrow-size: var(--moduix-navigation-menu-arrow-size, var(--moduix-spacing-2-5));
+    inline-size: var(--arrow-size);
+    block-size: var(--arrow-size);
     border-block-start: var(--moduix-navigation-menu-content-border-width, var(--moduix-border-width-sm))
       solid
       var(--moduix-navigation-menu-arrow-stroke-color, var(--moduix-navigation-menu-content-border-color, var(--moduix-color-border)));
@@ -230,17 +227,6 @@
     translate: 0;
   }
 
-  .viewportPositioner-hUgOWA > .indicator-f9Famp {
-    z-index: 1;
-    translate: calc(var(--trigger-x, 0px) - var(--viewport-x, 0px)) 0;
-    inset-block-start: calc(var(--moduix-navigation-menu-viewport-offset, var(--moduix-spacing-2)) -
-          var(--moduix-navigation-menu-indicator-size, var(--moduix-spacing-2-5)));
-  }
-
-  .viewportPositioner-hUgOWA[data-orientation="horizontal"] > .indicator-f9Famp {
-    overflow: hidden;
-  }
-
   .viewport-Gtf85E {
     box-sizing: border-box;
     inline-size: var(--viewport-width);
@@ -262,7 +248,7 @@
       block-size
         var(--moduix-navigation-menu-viewport-transition, var(--moduix-popup-motion-duration, var(--moduix-duration-normal))
             var(--moduix-popup-motion-easing, var(--moduix-ease-in-out)));
-    margin-block-start: var(--moduix-navigation-menu-viewport-offset, var(--moduix-spacing-2));
+    margin-block-start: var(--moduix-navigation-menu-viewport-offset, var(--moduix-navigation-menu-indicator-size, var(--moduix-spacing-2-5)));
     position: relative;
     overflow: hidden;
   }
@@ -288,6 +274,7 @@
   }
 
   .viewport-Gtf85E .content-dvfEnJ {
+    max-block-size: none;
     box-shadow: none;
     transform-origin: center;
     will-change: translate, opacity;
@@ -297,11 +284,7 @@
     margin: 0;
     position: absolute;
     inset: 0 auto auto 0;
-  }
-
-  .viewport-Gtf85E .contentViewport-MCA9d7 {
-    z-index: 2;
-    max-block-size: none;
+    overflow: visible;
   }
 
   .viewport-Gtf85E .content-dvfEnJ[data-state] {

package/dist/components/number-input/NumberInput.js

@@ -4,80 +4,79 @@ import { NumberInput, useNumberInput, useNumberInputContext } from "@ark-ui/reac
 import { clsx } from "clsx";
 import { forwardRef } from "react";
 import { MinusIcon, PlusIcon } from "../../internal/icons/ui/index.js";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import NumberInput_module from "./NumberInput.module.js";
 const NumberInput_NumberInputRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.Root, {
         ref: ref,
-        "data-slot": "number-input-root",
-        className: clsx(NumberInput_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.root, className),
+        ...props,
+        "data-slot": "number-input-root"
     });
 });
 const NumberInput_NumberInputRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.RootProvider, {
         ref: ref,
-        "data-slot": "number-input-root-provider",
-        className: clsx(NumberInput_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.root, className),
+        ...props,
+        "data-slot": "number-input-root-provider"
     });
 });
 const NumberInput_NumberInputLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.Label, {
         ref: ref,
-        "data-slot": "number-input-label",
-        className: clsx(NumberInput_module.label, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.label, className),
+        ...props,
+        "data-slot": "number-input-label"
     });
 });
 const NumberInput_NumberInputScrubber = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.Scrubber, {
         ref: ref,
-        "data-slot": "number-input-scrubber",
-        className: clsx(NumberInput_module.scrubber, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.scrubber, className),
+        ...props,
+        "data-slot": "number-input-scrubber"
     });
 });
 const NumberInput_NumberInputControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.Control, {
         ref: ref,
-        "data-slot": "number-input-control",
-        className: clsx(NumberInput_module.control, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.control, className),
+        ...props,
+        "data-slot": "number-input-control"
     });
 });
 const NumberInput_NumberInputDecrementTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.DecrementTrigger, {
         ref: ref,
-        "data-slot": "number-input-decrement-trigger",
-        className: clsx(NumberInput_module.decrementTrigger, normalizeClassName(className)),
+        className: clsx(NumberInput_module.decrementTrigger, className),
         ...props,
+        "data-slot": "number-input-decrement-trigger",
         children: children ?? /*#__PURE__*/ jsx(MinusIcon, {})
     });
 });
 const NumberInput_NumberInputInput = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.Input, {
         ref: ref,
-        "data-slot": "number-input-input",
-        className: clsx(NumberInput_module.input, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.input, className),
+        ...props,
+        "data-slot": "number-input-input"
     });
 });
 const NumberInput_NumberInputIncrementTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.IncrementTrigger, {
         ref: ref,
-        "data-slot": "number-input-increment-trigger",
-        className: clsx(NumberInput_module.incrementTrigger, normalizeClassName(className)),
+        className: clsx(NumberInput_module.incrementTrigger, className),
         ...props,
+        "data-slot": "number-input-increment-trigger",
         children: children ?? /*#__PURE__*/ jsx(PlusIcon, {})
     });
 });
 const NumberInput_NumberInputValueText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(NumberInput.ValueText, {
         ref: ref,
-        "data-slot": "number-input-value-text",
-        className: clsx(NumberInput_module.valueText, normalizeClassName(className)),
-        ...props
+        className: clsx(NumberInput_module.valueText, className),
+        ...props,
+        "data-slot": "number-input-value-text"
     });
 });
 const NumberInput_NumberInputField = /*#__PURE__*/ forwardRef(function(props, ref) {

package/dist/components/pagination/Pagination.js

@@ -3,41 +3,38 @@ import { Pagination, usePagination, usePaginationContext } from "@ark-ui/react/p
 import { clsx } from "clsx";
 import { forwardRef } from "react";
 import { ChevronLeftIcon, ChevronRightIcon } from "../../internal/icons/ui/index.js";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import Pagination_module from "./Pagination.module.js";
-const Pagination_PaginationRoot = /*#__PURE__*/ forwardRef(function({ 'aria-label': ariaLabel = 'Pagination', className, ...props }, ref) {
+const Pagination_PaginationRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.Root, {
         ref: ref,
-        "data-slot": "pagination-root",
-        "aria-label": ariaLabel,
-        className: clsx(Pagination_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(Pagination_module.root, className),
+        ...props,
+        "data-slot": "pagination-root"
     });
 });
-const Pagination_PaginationRootProvider = /*#__PURE__*/ forwardRef(function({ 'aria-label': ariaLabel = 'Pagination', className, ...props }, ref) {
+const Pagination_PaginationRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.RootProvider, {
         ref: ref,
-        "data-slot": "pagination-root-provider",
-        "aria-label": ariaLabel,
-        className: clsx(Pagination_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(Pagination_module.root, className),
+        ...props,
+        "data-slot": "pagination-root-provider"
     });
 });
 const Pagination_PaginationItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.Item, {
         ref: ref,
-        "data-slot": "pagination-item",
-        className: clsx(Pagination_module.item, normalizeClassName(className)),
-        ...props
+        className: clsx(Pagination_module.item, className),
+        ...props,
+        "data-slot": "pagination-item"
     });
 });
 const Pagination_PaginationEllipsis = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.Ellipsis, {
         ref: ref,
-        "data-slot": "pagination-ellipsis",
-        className: clsx(Pagination_module.ellipsis, normalizeClassName(className)),
+        className: clsx(Pagination_module.ellipsis, className),
         ...props,
-        children: children ?? '...'
+        "data-slot": "pagination-ellipsis",
+        children: children ?? (!props.asChild && '...')
     });
 });
 function EdgeIcon({ side }) {
@@ -54,41 +51,41 @@ function EdgeIcon({ side }) {
 const Pagination_PaginationPrevTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.PrevTrigger, {
         ref: ref,
-        "data-slot": "pagination-prev-trigger",
-        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, normalizeClassName(className)),
+        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, className),
         ...props,
-        children: children ?? /*#__PURE__*/ jsx(ChevronLeftIcon, {})
+        "data-slot": "pagination-prev-trigger",
+        children: children ?? (!props.asChild && /*#__PURE__*/ jsx(ChevronLeftIcon, {}))
     });
 });
 const Pagination_PaginationNextTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.NextTrigger, {
         ref: ref,
-        "data-slot": "pagination-next-trigger",
-        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, normalizeClassName(className)),
+        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, className),
         ...props,
-        children: children ?? /*#__PURE__*/ jsx(ChevronRightIcon, {})
+        "data-slot": "pagination-next-trigger",
+        children: children ?? (!props.asChild && /*#__PURE__*/ jsx(ChevronRightIcon, {}))
     });
 });
 const Pagination_PaginationFirstTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.FirstTrigger, {
         ref: ref,
-        "data-slot": "pagination-first-trigger",
-        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, normalizeClassName(className)),
+        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, className),
         ...props,
-        children: children ?? /*#__PURE__*/ jsx(EdgeIcon, {
+        "data-slot": "pagination-first-trigger",
+        children: children ?? (!props.asChild && /*#__PURE__*/ jsx(EdgeIcon, {
             side: "left"
-        })
+        }))
     });
 });
 const Pagination_PaginationLastTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
     return /*#__PURE__*/ jsx(Pagination.LastTrigger, {
         ref: ref,
-        "data-slot": "pagination-last-trigger",
-        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, normalizeClassName(className)),
+        className: clsx(Pagination_module.trigger, null == children && Pagination_module.iconTrigger, className),
         ...props,
-        children: children ?? /*#__PURE__*/ jsx(EdgeIcon, {
+        "data-slot": "pagination-last-trigger",
+        children: children ?? (!props.asChild && /*#__PURE__*/ jsx(EdgeIcon, {
             side: "right"
-        })
+        }))
     });
 });
 const PaginationContext = Pagination.Context;

package/dist/components/pagination/Pagination_module.css

@@ -33,10 +33,6 @@
     -webkit-user-select: none;
     user-select: none;
     white-space: nowrap;
-    transition: background-color var(--moduix-pagination-transition, var(--moduix-transition-default)),
-      border-color var(--moduix-pagination-transition, var(--moduix-transition-default)),
-      color var(--moduix-pagination-transition, var(--moduix-transition-default)),
-      opacity var(--moduix-pagination-transition, var(--moduix-transition-default));
     font-family: inherit;
     text-decoration: none;
   }
@@ -47,7 +43,7 @@
     }
   }
 
-  :is(.item-TI2iyy, .trigger-Z_SoJt):focus-visible, :is(.item-TI2iyy, .trigger-Z_SoJt)[data-focus] {
+  :is(.item-TI2iyy, .trigger-Z_SoJt):focus-visible {
     outline: var(--moduix-pagination-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
         solid var(--moduix-pagination-focus-ring-color, var(--moduix-color-ring));
     outline-offset: var(--moduix-pagination-focus-ring-offset, var(--moduix-focus-ring-inset-offset));

package/dist/components/password-input/PasswordInput.js

@@ -4,63 +4,62 @@ import { PasswordInput, usePasswordInput, usePasswordInputContext } from "@ark-u
 import { clsx } from "clsx";
 import { forwardRef } from "react";
 import { EyeClosedIcon, EyeIcon } from "../../internal/icons/ui/index.js";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import PasswordInput_module from "./PasswordInput.module.js";
 const PasswordInput_PasswordInputRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.Root, {
         ref: ref,
-        "data-slot": "password-input-root",
-        className: clsx(PasswordInput_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(PasswordInput_module.root, className),
+        ...props,
+        "data-slot": "password-input-root"
     });
 });
 const PasswordInput_PasswordInputRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.RootProvider, {
         ref: ref,
-        "data-slot": "password-input-root-provider",
-        className: clsx(PasswordInput_module.root, normalizeClassName(className)),
-        ...props
+        className: clsx(PasswordInput_module.root, className),
+        ...props,
+        "data-slot": "password-input-root-provider"
     });
 });
 const PasswordInput_PasswordInputLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.Label, {
         ref: ref,
-        "data-slot": "password-input-label",
-        className: clsx(PasswordInput_module.label, normalizeClassName(className)),
-        ...props
+        className: clsx(PasswordInput_module.label, className),
+        ...props,
+        "data-slot": "password-input-label"
     });
 });
 const PasswordInput_PasswordInputControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.Control, {
         ref: ref,
-        "data-slot": "password-input-control",
-        className: clsx(PasswordInput_module.control, normalizeClassName(className)),
-        ...props
+        className: clsx(PasswordInput_module.control, className),
+        ...props,
+        "data-slot": "password-input-control"
     });
 });
 const PasswordInput_PasswordInputInput = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.Input, {
         ref: ref,
-        "data-slot": "password-input-input",
-        className: clsx(PasswordInput_module.input, normalizeClassName(className)),
-        ...props
+        className: clsx(PasswordInput_module.input, className),
+        ...props,
+        "data-slot": "password-input-input"
     });
 });
 const PasswordInput_PasswordInputVisibilityTrigger = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.VisibilityTrigger, {
         ref: ref,
-        "data-slot": "password-input-visibility-trigger",
-        className: clsx(PasswordInput_module.visibilityTrigger, normalizeClassName(className)),
-        ...props
+        className: clsx(PasswordInput_module.visibilityTrigger, className),
+        ...props,
+        "data-slot": "password-input-visibility-trigger"
     });
 });
 const PasswordInput_PasswordInputIndicator = /*#__PURE__*/ forwardRef(function({ className, children, fallback, ...props }, ref) {
     return /*#__PURE__*/ jsx(PasswordInput.Indicator, {
         ref: ref,
-        "data-slot": "password-input-indicator",
-        className: clsx(PasswordInput_module.indicator, normalizeClassName(className)),
+        className: clsx(PasswordInput_module.indicator, className),
         fallback: fallback ?? /*#__PURE__*/ jsx(EyeClosedIcon, {}),
         ...props,
+        "data-slot": "password-input-indicator",
         children: children ?? /*#__PURE__*/ jsx(EyeIcon, {})
     });
 });

package/dist/components/pin-input/PinInput.d.ts

@@ -1,5 +1,5 @@
 import { PinInput as PinInputPrimitive, usePinInputContext, type UsePinInputProps } from '@ark-ui/react/pin-input';
-import type { ComponentProps, ReactNode } from 'react';
+import type { ComponentProps } from 'react';
 declare function PinInputInputs({ className }: {
     className?: string;
 }): import("react").JSX.Element[];
@@ -8,7 +8,8 @@ declare function usePinInput(props?: UsePinInputProps): import("@ark-ui/react/pi
 declare const PinInput: import("react").ForwardRefExoticComponent<Omit<PinInputPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
     Root: import("react").ForwardRefExoticComponent<Omit<PinInputPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     RootProvider: import("react").ForwardRefExoticComponent<Omit<PinInputPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Context: (props: PinInputPrimitive.ContextProps) => ReactNode;
+    Context: (props: PinInputPrimitive.ContextProps) => import("react").ReactNode;
+    HiddenInput: import("react").ForwardRefExoticComponent<PinInputPrimitive.HiddenInputProps & import("react").RefAttributes<HTMLInputElement>>;
     Label: import("react").ForwardRefExoticComponent<Omit<PinInputPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
     Control: import("react").ForwardRefExoticComponent<Omit<PinInputPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Input: import("react").ForwardRefExoticComponent<Omit<PinInputPrimitive.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;