@moduix/react 2.5.1 → 2.7.0

package/dist/components/sidebar/Sidebar_module.css

@@ -57,7 +57,7 @@
     overflow: hidden;
   }
 
-  .panel-l44YAX[data-state="collapsed"] .menuSub-xn2r86, .panel-l44YAX[data-state="collapsed"] .groupAction-aoQPc4, .panel-l44YAX[data-state="collapsed"] .menuAction-_BDfHY, .panel-l44YAX[data-state="collapsed"] .menuBadge-GKf4u4, .panel-l44YAX[data-state="collapsed"] .input-nqDU3w {
+  .panel-l44YAX[data-state="collapsed"] .menuSub-xn2r86, .panel-l44YAX[data-state="collapsed"] .groupAction-aoQPc4, .panel-l44YAX[data-state="collapsed"] .input-nqDU3w {
     display: none;
   }
 
@@ -72,14 +72,6 @@
     padding-inline: 0;
   }
 
-  .panel-l44YAX[data-state="collapsed"] .menuButton-OAl6eQ > :not(svg):not([data-sidebar-icon]):not([data-slot="sidebar-label"]) {
-    display: none;
-  }
-
-  .panel-l44YAX[data-state="collapsed"] .menuButton-OAl6eQ > svg, .panel-l44YAX[data-state="collapsed"] .menuButton-OAl6eQ > [data-sidebar-icon] {
-    margin-inline: auto;
-  }
-
   @media (hover: hover) {
     .panel-l44YAX[data-state="collapsed"] .menuButton-OAl6eQ:hover {
       background-color: #0000;
@@ -135,12 +127,6 @@
     transform: rotate(180deg);
   }
 
-  .trigger-_fUcgc:focus-visible {
-    outline: var(--moduix-sidebar-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
-        solid var(--moduix-sidebar-focus-ring-color, var(--moduix-color-ring));
-    outline-offset: var(--moduix-sidebar-focus-ring-offset, var(--moduix-focus-ring-offset));
-  }
-
   .trigger-_fUcgc:disabled, .trigger-_fUcgc[aria-disabled="true"] {
     opacity: var(--moduix-sidebar-disabled-opacity, var(--moduix-opacity-disabled));
     pointer-events: none;
@@ -206,9 +192,17 @@
     font-weight: var(--moduix-sidebar-group-label-font-weight, var(--moduix-weight-medium));
     line-height: var(--moduix-sidebar-group-label-line-height, var(--moduix-line-height-text-xs));
     text-transform: var(--moduix-sidebar-group-label-text-transform, none);
+    flex: 1;
     margin: 0;
   }
 
+  .groupHeader-N4qFFK {
+    align-items: center;
+    gap: var(--moduix-sidebar-gap, var(--moduix-spacing-2));
+    min-width: 0;
+    display: flex;
+  }
+
   .groupAction-aoQPc4 {
     width: var(--moduix-sidebar-group-action-size, var(--moduix-size-xs));
     height: var(--moduix-sidebar-group-action-size, var(--moduix-size-xs));
@@ -220,8 +214,10 @@
       color var(--moduix-sidebar-transition, var(--moduix-transition-default));
     background-color: #0000;
     border: 0;
+    flex: none;
     justify-content: center;
     align-items: center;
+    margin-inline-end: var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2));
     padding: 0;
     display: inline-flex;
   }
@@ -231,12 +227,6 @@
     height: var(--moduix-sidebar-icon-size, var(--moduix-spacing-4));
   }
 
-  .groupAction-aoQPc4:focus-visible {
-    outline: var(--moduix-sidebar-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
-        solid var(--moduix-sidebar-focus-ring-color, var(--moduix-color-ring));
-    outline-offset: var(--moduix-sidebar-focus-ring-offset, var(--moduix-focus-ring-offset));
-  }
-
   @media (hover: hover) {
     .groupAction-aoQPc4:hover {
       background-color: var(--moduix-sidebar-accent-bg, var(--moduix-color-accent));
@@ -244,39 +234,6 @@
     }
   }
 
-  .group-cwd3z7:has(.groupAction-aoQPc4) {
-    column-gap: var(--moduix-sidebar-gap, var(--moduix-spacing-2));
-    row-gap: var(--moduix-sidebar-group-gap, var(--moduix-spacing-1));
-    grid-template-columns: minmax(0, 1fr) auto;
-    display: grid;
-  }
-
-  .group-cwd3z7:has(.groupAction-aoQPc4) .groupLabel-IvBtsR {
-    min-height: var(--moduix-sidebar-group-action-size, var(--moduix-size-xs));
-    grid-column: 1;
-    align-items: center;
-    display: flex;
-  }
-
-  .group-cwd3z7:has(.groupAction-aoQPc4) .groupAction-aoQPc4 {
-    grid-column: 2;
-    align-self: center;
-    margin-inline-end: var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2));
-  }
-
-  .groupContent-_s9yul {
-    width: 100%;
-    min-width: 0;
-  }
-
-  .group-cwd3z7:has(.groupAction-aoQPc4) .groupContent-_s9yul {
-    grid-column: 1 / -1;
-  }
-
-  .group-cwd3z7:has(.groupAction-aoQPc4) .menu-UwagMF {
-    grid-column: 1 / -1;
-  }
-
   .menu-UwagMF, .menuSub-xn2r86 {
     gap: var(--moduix-sidebar-navigation-gap, var(--moduix-spacing-1));
     flex-direction: column;
@@ -288,17 +245,35 @@
     display: flex;
   }
 
-  .menuItem-ktGhRk {
+  .menuItem-ktGhRk, .menuSubItem-NeKVH5 {
     min-width: 0;
     position: relative;
   }
 
-  .menuSubItem-NeKVH5 {
-    min-width: 0;
+  :is(.menuButton-OAl6eQ:has( + .menuBadge-GKf4u4), .menuSubButton-MjeEfX:has( + .menuBadge-GKf4u4)) {
+    padding-inline-end: var(--moduix-spacing-10);
   }
 
-  .menuItem-ktGhRk > [data-scope="select"][data-part="root"] {
-    --moduix-select-width: 100%;
+  .menuBadge-GKf4u4 {
+    z-index: 1;
+    box-sizing: border-box;
+    width: var(--moduix-spacing-5);
+    height: var(--moduix-spacing-5);
+    border-radius: var(--moduix-radius-full);
+    background-color: var(--moduix-color-primary);
+    color: var(--moduix-color-primary-foreground);
+    font-size: .5625rem;
+    font-weight: var(--moduix-weight-medium);
+    font-variant-numeric: tabular-nums;
+    pointer-events: none;
+    place-items: center;
+    padding: 0;
+    line-height: 1;
+    display: inline-grid;
+    position: absolute;
+    inset-block-start: 50%;
+    inset-inline-end: var(--moduix-spacing-2-5);
+    transform: translateY(-50%);
   }
 
   .menuButton-OAl6eQ, .menuSubButton-MjeEfX {
@@ -342,12 +317,6 @@
     overflow: hidden;
   }
 
-  :is(.menuButton-OAl6eQ, .menuSubButton-MjeEfX):focus-visible {
-    outline: var(--moduix-sidebar-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
-        solid var(--moduix-sidebar-focus-ring-color, var(--moduix-color-ring));
-    outline-offset: var(--moduix-sidebar-focus-ring-offset, var(--moduix-focus-ring-offset));
-  }
-
   :is(.menuButton-OAl6eQ, .menuSubButton-MjeEfX):disabled, :is(.menuButton-OAl6eQ, .menuSubButton-MjeEfX)[aria-disabled="true"] {
     opacity: var(--moduix-sidebar-disabled-opacity, var(--moduix-opacity-disabled));
     pointer-events: none;
@@ -384,108 +353,39 @@
     min-height: var(--moduix-sidebar-navigation-button-height-lg, var(--moduix-size-lg));
   }
 
-  .menuButton-OAl6eQ > [data-slot="collapsible-indicator"], .menuButton-OAl6eQ > [data-slot="menu-indicator"], .menuButton-OAl6eQ > [data-scope="select"][data-part="indicator"] {
+  .menuButton-OAl6eQ > [data-slot="collapsible-indicator"], .menuButton-OAl6eQ > [data-slot="menu-indicator"] {
+    width: var(--moduix-sidebar-navigation-indicator-size, var(--moduix-size-xs));
+    height: var(--moduix-sidebar-navigation-indicator-size, var(--moduix-size-xs));
     margin-inline-start: auto;
   }
 
-  .menuAction-_BDfHY {
-    z-index: 1;
-    width: var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs));
-    height: var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs));
-    border-radius: var(--moduix-sidebar-navigation-button-radius, var(--moduix-radius-md));
+  .menuButton-OAl6eQ > [data-slot="collapsible-indicator"] > svg {
+    width: var(--moduix-spacing-3);
+    height: var(--moduix-spacing-3);
+  }
+
+  .menuButton-OAl6eQ > [data-slot="menu-indicator"] {
+    box-sizing: border-box;
+    width: var(--moduix-sidebar-navigation-indicator-size, var(--moduix-size-xs));
+    height: var(--moduix-sidebar-navigation-indicator-size, var(--moduix-size-xs));
     color: var(--moduix-sidebar-muted-color, var(--moduix-color-muted-foreground));
-    appearance: none;
-    cursor: pointer;
-    transition: background-color var(--moduix-sidebar-transition, var(--moduix-transition-default)),
-      color var(--moduix-sidebar-transition, var(--moduix-transition-default));
-    background-color: #0000;
-    border: 0;
-    justify-content: center;
-    align-items: center;
-    padding: 0;
-    display: inline-flex;
-    position: absolute;
-    inset-block-start: calc((var(--moduix-sidebar-navigation-button-height, var(--moduix-size-md)) -
-          var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs))) /
-        2);
-    inset-inline-end: var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2));
+    line-height: 0;
   }
 
-  .menuAction-_BDfHY > svg {
+  .menuButton-OAl6eQ > [data-slot="menu-indicator"] > svg {
     width: var(--moduix-sidebar-icon-size, var(--moduix-spacing-4));
     height: var(--moduix-sidebar-icon-size, var(--moduix-spacing-4));
+    display: block;
   }
 
-  .menuAction-_BDfHY:focus-visible {
-    outline: var(--moduix-sidebar-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
-        solid var(--moduix-sidebar-focus-ring-color, var(--moduix-color-ring));
-    outline-offset: var(--moduix-sidebar-focus-ring-offset, var(--moduix-focus-ring-offset));
-  }
-
-  @media (hover: hover) {
-    .menuAction-_BDfHY:hover {
-      background-color: var(--moduix-sidebar-accent-bg, var(--moduix-color-accent));
-      color: var(--moduix-sidebar-accent-color, var(--moduix-color-accent-foreground));
-    }
-  }
-
-  .menuBadge-GKf4u4 {
-    z-index: 1;
-    min-width: var(--moduix-sidebar-navigation-badge-min-width, 1.125rem);
-    min-height: var(--moduix-sidebar-navigation-badge-min-width, 1.125rem);
-    padding-inline: var(--moduix-sidebar-navigation-badge-padding-x, var(--moduix-spacing-0-5));
-    border-radius: var(--moduix-radius-full);
-    background-color: var(--moduix-sidebar-accent-bg, var(--moduix-color-accent));
-    color: var(--moduix-sidebar-accent-color, var(--moduix-color-accent-foreground));
-    font-size: var(--moduix-sidebar-navigation-badge-font-size, .625rem);
-    font-weight: var(--moduix-sidebar-navigation-badge-font-weight, var(--moduix-weight-medium));
-    font-variant-numeric: tabular-nums;
-    justify-content: center;
-    align-items: center;
-    line-height: 1;
-    display: inline-flex;
-    position: absolute;
-    inset-block-start: calc((var(--moduix-sidebar-navigation-button-height, var(--moduix-size-md)) -
-          var(--moduix-sidebar-navigation-badge-min-width, 1.125rem)) /
-        2);
-    inset-inline-end: calc(var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2)) +
-        (var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs)) -
-          var(--moduix-sidebar-navigation-badge-min-width, 1.125rem)) /
-        2);
-  }
-
-  .menuItem-ktGhRk:has(.menuAction-_BDfHY) .menuButton-OAl6eQ {
-    padding-inline-end: calc(var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs)) +
-        var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2)) * 2);
-  }
-
-  .menuItem-ktGhRk:has(.menuBadge-GKf4u4) .menuButton-OAl6eQ {
-    padding-inline-end: calc(var(--moduix-sidebar-navigation-badge-min-width, 1.125rem) +
-        var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2)) * 2 +
-        (var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs)) -
-          var(--moduix-sidebar-navigation-badge-min-width, 1.125rem)) /
-        2);
-  }
-
-  .menuItem-ktGhRk:has(.menuAction-_BDfHY):has(.menuBadge-GKf4u4) .menuButton-OAl6eQ {
-    padding-inline-end: calc(var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs)) +
-          var(--moduix-sidebar-navigation-badge-min-width, 1.125rem) +
-          var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2)) * 3 +
-          (var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs)) -
-            var(--moduix-sidebar-navigation-badge-min-width, 1.125rem)) /
-          2);
-  }
-
-  .menuItem-ktGhRk:has(.menuAction-_BDfHY):has(.menuBadge-GKf4u4) .menuAction-_BDfHY {
-    inset-inline-end: calc(var(--moduix-sidebar-navigation-badge-min-width, 1.125rem) +
-          var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2)) * 2 +
-          (var(--moduix-sidebar-navigation-action-size, var(--moduix-size-xs)) -
-            var(--moduix-sidebar-navigation-badge-min-width, 1.125rem)) /
-          2);
+  .menuButton-OAl6eQ > [data-scope="select"][data-part="indicator"] {
+    margin-inline-start: auto;
   }
 
-  :is(.panel-l44YAX[data-state="collapsed"] .menuItem-ktGhRk:has(.menuAction-_BDfHY) .menuButton-OAl6eQ, .panel-l44YAX[data-state="collapsed"] .menuItem-ktGhRk:has(.menuBadge-GKf4u4) .menuButton-OAl6eQ) {
-    padding-inline-end: 0;
+  .trigger-_fUcgc:focus-visible, .groupAction-aoQPc4:focus-visible, .menuButton-OAl6eQ:focus-visible {
+    outline: var(--moduix-sidebar-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
+      solid var(--moduix-sidebar-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-sidebar-focus-ring-offset, var(--moduix-focus-ring-offset));
   }
 
   .menuSub-xn2r86 {
@@ -507,13 +407,17 @@
   }
 
   @container (width <= 7rem) {
-    .groupAction-aoQPc4, .menuAction-_BDfHY, .menuBadge-GKf4u4, [data-slot="collapsible-indicator"], [data-slot="menu-indicator"], [data-slot="select-indicator"] {
+    .groupAction-aoQPc4, .menuBadge-GKf4u4, [data-slot="collapsible-indicator"], [data-slot="menu-indicator"], [data-slot="select-indicator"] {
       display: none;
     }
 
-    :is(.menuItem-ktGhRk:has(.menuAction-_BDfHY) .menuButton-OAl6eQ, .menuItem-ktGhRk:has(.menuBadge-GKf4u4) .menuButton-OAl6eQ) {
+    .menuButton-OAl6eQ:has( + .menuBadge-GKf4u4) {
       padding-inline-end: var(--moduix-sidebar-navigation-button-padding-x, var(--moduix-spacing-2));
     }
+
+    .menuSubButton-MjeEfX:has( + .menuBadge-GKf4u4) {
+      padding-inline-end: var(--moduix-sidebar-navigation-sub-button-padding-x, var(--moduix-spacing-2));
+    }
   }
 
   .input-nqDU3w {
@@ -525,7 +429,7 @@
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .panel-l44YAX, .trigger-_fUcgc, .groupAction-aoQPc4, .menuButton-OAl6eQ, .menuAction-_BDfHY, .menuSubButton-MjeEfX {
+    .panel-l44YAX, .trigger-_fUcgc, .groupAction-aoQPc4, .menuButton-OAl6eQ, .menuSubButton-MjeEfX {
       transition: none;
     }
   }

package/dist/components/signature-pad/SignaturePad.d.ts

@@ -1,13 +1,10 @@
 import { SignaturePad as SignaturePadPrimitive, useSignaturePad as useSignaturePadPrimitive, useSignaturePadContext } from '@ark-ui/react/signature-pad';
-import type { ReactNode } from 'react';
-type SignaturePadFormProps = {
-    getFormValue?: (paths: string[]) => string;
-};
 declare function useSignaturePad(props?: Parameters<typeof useSignaturePadPrimitive>[0]): ReturnType<typeof useSignaturePadPrimitive>;
-declare const SignaturePad: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement> & SignaturePadFormProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-    Root: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement> & SignaturePadFormProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    RootProvider: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement> & SignaturePadFormProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Context: (props: SignaturePadPrimitive.ContextProps) => ReactNode;
+declare const SignaturePad: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: SignaturePadPrimitive.ContextProps) => import("react").ReactNode;
+    HiddenInput: import("react").ForwardRefExoticComponent<SignaturePadPrimitive.HiddenInputProps & import("react").RefAttributes<HTMLInputElement>>;
     Label: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
     Control: import("react").ForwardRefExoticComponent<Omit<SignaturePadPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Canvas: import("react").ForwardRefExoticComponent<Omit<Omit<SignaturePadPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "children">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/signature-pad/SignaturePad.js

@@ -1,98 +1,88 @@
 "use client";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useFieldContext } from "@ark-ui/react/field";
 import { SignaturePad, useSignaturePad, useSignaturePadContext } from "@ark-ui/react/signature-pad";
 import { clsx } from "clsx";
-import { Children, cloneElement, createContext, forwardRef, useContext } from "react";
+import { createContext, forwardRef, useContext } from "react";
 import { RotateCcwIcon } from "../../internal/icons/ui/index.js";
-import { normalizeClassName } from "../../internal/normalizeClassName.js";
 import { CloseButton } from "../close-button/index.js";
 import SignaturePad_module from "./SignaturePad.module.js";
 const SignaturePadReadOnlyContext = /*#__PURE__*/ createContext(false);
 const signaturePadReadOnly = Symbol();
-const SignaturePad_SignaturePadRoot = /*#__PURE__*/ forwardRef(function({ asChild, children, className, getFormValue, ...props }, ref) {
+const SignaturePad_SignaturePadRoot = /*#__PURE__*/ forwardRef(function({ asChild, children, className, ...props }, ref) {
     const field = useFieldContext();
     const readOnly = props.readOnly ?? field?.readOnly ?? false;
     return /*#__PURE__*/ jsx(SignaturePadReadOnlyContext.Provider, {
         value: readOnly,
         children: /*#__PURE__*/ jsx(SignaturePad.Root, {
             ref: ref,
-            "data-slot": "signature-pad-root",
-            className: clsx(SignaturePad_module.root, normalizeClassName(className)),
+            className: clsx(SignaturePad_module.root, className),
             asChild: asChild,
             ...props,
-            children: withHiddenInput(children, asChild, getFormValue)
+            "data-slot": "signature-pad-root",
+            children: children
         })
     });
 });
-const SignaturePad_SignaturePadRootProvider = /*#__PURE__*/ forwardRef(function({ asChild, children, className, getFormValue, ...props }, ref) {
+const SignaturePad_SignaturePadRootProvider = /*#__PURE__*/ forwardRef(function({ asChild, children, className, ...props }, ref) {
     const readOnly = props.value[signaturePadReadOnly] ?? false;
     return /*#__PURE__*/ jsx(SignaturePadReadOnlyContext.Provider, {
         value: readOnly,
         children: /*#__PURE__*/ jsx(SignaturePad.RootProvider, {
             ref: ref,
-            "data-slot": "signature-pad-root-provider",
-            className: clsx(SignaturePad_module.root, normalizeClassName(className)),
+            className: clsx(SignaturePad_module.root, className),
             asChild: asChild,
             ...props,
-            children: withHiddenInput(children, asChild, getFormValue)
+            "data-slot": "signature-pad-root-provider",
+            children: children
         })
     });
 });
 const SignaturePad_SignaturePadLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(SignaturePad.Label, {
         ref: ref,
-        "data-slot": "signature-pad-label",
-        className: clsx(SignaturePad_module.label, normalizeClassName(className)),
-        ...props
+        className: clsx(SignaturePad_module.label, className),
+        ...props,
+        "data-slot": "signature-pad-label"
     });
 });
 const SignaturePad_SignaturePadControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(SignaturePad.Control, {
         ref: ref,
-        "data-slot": "signature-pad-control",
-        className: clsx(SignaturePad_module.control, normalizeClassName(className)),
-        ...props
+        className: clsx(SignaturePad_module.control, className),
+        ...props,
+        "data-slot": "signature-pad-control"
     });
 });
 const SignaturePad_SignaturePadSegment = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(SignaturePad.Segment, {
         ref: ref,
-        "data-slot": "signature-pad-segment",
-        className: clsx(SignaturePad_module.segment, normalizeClassName(className)),
-        ...props
+        className: clsx(SignaturePad_module.segment, className),
+        ...props,
+        "data-slot": "signature-pad-segment"
     });
 });
 const SignaturePad_SignaturePadGuide = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsx(SignaturePad.Guide, {
         ref: ref,
-        "data-slot": "signature-pad-guide",
-        className: clsx(SignaturePad_module.guide, normalizeClassName(className)),
-        ...props
+        className: clsx(SignaturePad_module.guide, className),
+        ...props,
+        "data-slot": "signature-pad-guide"
     });
 });
 const SignaturePad_SignaturePadClearTrigger = /*#__PURE__*/ forwardRef(function({ asChild, className, children, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...props }, ref) {
     const readOnly = useContext(SignaturePadReadOnlyContext);
-    const triggerClassName = clsx(SignaturePad_module.clearTrigger, normalizeClassName(className));
-    if (asChild) return /*#__PURE__*/ jsx(SignaturePad.ClearTrigger, {
-        ref: ref,
-        asChild: true,
-        "data-slot": "signature-pad-clear-trigger",
-        className: triggerClassName,
-        "aria-label": ariaLabel,
-        "aria-labelledby": ariaLabelledBy,
-        ...props,
-        disabled: readOnly || props.disabled,
-        children: children
-    });
+    const triggerClassName = clsx(SignaturePad_module.clearTrigger, className);
     return /*#__PURE__*/ jsx(SignaturePad.ClearTrigger, {
         ref: ref,
         asChild: true,
-        "data-slot": "signature-pad-clear-trigger",
         className: triggerClassName,
+        "aria-label": asChild ? ariaLabel : void 0,
+        "aria-labelledby": asChild ? ariaLabelledBy : void 0,
         ...props,
+        "data-slot": "signature-pad-clear-trigger",
         disabled: readOnly || props.disabled,
-        children: /*#__PURE__*/ jsx(CloseButton.Root, {
+        children: asChild ? children : /*#__PURE__*/ jsx(CloseButton.Root, {
             "aria-label": ariaLabel,
             "aria-labelledby": ariaLabelledBy,
             children: children ?? /*#__PURE__*/ jsx(RotateCcwIcon, {
@@ -101,26 +91,6 @@ const SignaturePad_SignaturePadClearTrigger = /*#__PURE__*/ forwardRef(function(
         })
     });
 });
-function withHiddenInput(children, asChild, getFormValue) {
-    const hiddenInput = /*#__PURE__*/ jsx(SignaturePadFormInput, {
-        getFormValue: getFormValue
-    });
-    if (!asChild) return /*#__PURE__*/ jsxs(Fragment, {
-        children: [
-            children,
-            hiddenInput
-        ]
-    });
-    const child = Children.only(children);
-    return /*#__PURE__*/ cloneElement(child, {}, child.props.children, hiddenInput);
-}
-function SignaturePadFormInput({ getFormValue }) {
-    const signaturePad = useSignaturePadContext();
-    return /*#__PURE__*/ jsx(SignaturePad.HiddenInput, {
-        "data-slot": "signature-pad-hidden-input",
-        value: getFormValue?.(signaturePad.paths) ?? signaturePad.paths.join(' ')
-    });
-}
 const SignaturePad_SignaturePadCanvas = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
     return /*#__PURE__*/ jsxs(SignaturePad_SignaturePadControl, {
         ref: ref,
@@ -150,6 +120,7 @@ const SignaturePad_SignaturePad = Object.assign(SignaturePad_SignaturePadRoot, {
     Root: SignaturePad_SignaturePadRoot,
     RootProvider: SignaturePad_SignaturePadRootProvider,
     Context: SignaturePad.Context,
+    HiddenInput: SignaturePad.HiddenInput,
     Label: SignaturePad_SignaturePadLabel,
     Control: SignaturePad_SignaturePadControl,
     Canvas: SignaturePad_SignaturePadCanvas,

package/dist/components/signature-pad/SignaturePad_module.css

@@ -77,7 +77,6 @@
     --moduix-close-button-color: var(--moduix-signature-pad-clear-trigger-color, var(--moduix-color-muted-foreground));
     --moduix-close-button-color-hover: var(--moduix-signature-pad-clear-trigger-color-hover, var(--moduix-color-foreground));
     --moduix-close-button-icon-size: var(--moduix-signature-pad-clear-trigger-icon-size, var(--moduix-spacing-4));
-    --moduix-close-button-transition: var(--moduix-signature-pad-transition, var(--moduix-transition-default));
     --moduix-close-button-focus-ring-width: var(--moduix-signature-pad-clear-trigger-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)));
     --moduix-close-button-focus-ring-color: var(--moduix-signature-pad-clear-trigger-focus-ring-color, var(--moduix-color-ring));
     --moduix-close-button-focus-ring-offset: var(--moduix-signature-pad-clear-trigger-focus-ring-offset, var(--moduix-spacing-1));

package/dist/components/simple-grid/SimpleGrid.js

@@ -2,9 +2,8 @@ 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";
 const SimpleGrid_SimpleGridRoot = /*#__PURE__*/ forwardRef(function({ asChild, className, style, columns, minChildWidth, gap, rowGap, columnGap, ...props }, ref) {
-    if (null != columns && (!Number.isFinite(columns) || !Number.isInteger(columns) || columns <= 0)) throw new Error('SimpleGrid `columns` must be a finite positive integer.');
+    if (null != columns && (!Number.isInteger(columns) || columns <= 0)) throw new Error('SimpleGrid `columns` must be a finite positive integer.');
     if ('number' == typeof minChildWidth && (!Number.isFinite(minChildWidth) || minChildWidth < 0)) throw new Error('SimpleGrid `minChildWidth` must be a finite non-negative number.');
     let gridTemplateColumns = 'minmax(0, 1fr)';
     if (null != columns) gridTemplateColumns = `repeat(${columns}, minmax(0, 1fr))`;
@@ -14,12 +13,18 @@ const SimpleGrid_SimpleGridRoot = /*#__PURE__*/ forwardRef(function({ asChild, c
     }
     const rootStyle = {
         display: 'grid',
-        gridTemplateColumns
+        gridTemplateColumns,
+        ...null == gap ? {} : {
+            gap
+        },
+        ...null == rowGap ? {} : {
+            rowGap
+        },
+        ...null == columnGap ? {} : {
+            columnGap
+        },
+        ...style
     };
-    if (null != gap) rootStyle.gap = gap;
-    if (null != rowGap) rootStyle.rowGap = rowGap;
-    if (null != columnGap) rootStyle.columnGap = columnGap;
-    Object.assign(rootStyle, style);
     return /*#__PURE__*/ jsx(ark.div, {
         ...props,
         ref: ref,
@@ -27,7 +32,7 @@ const SimpleGrid_SimpleGridRoot = /*#__PURE__*/ forwardRef(function({ asChild, c
         "data-scope": "simple-grid",
         "data-part": "root",
         "data-slot": "simple-grid-root",
-        className: clsx(normalizeClassName(className)),
+        className: clsx(className),
         style: rootStyle
     });
 });

package/dist/components/skeleton/Skeleton.d.ts

@@ -1,6 +1,6 @@
 declare const Skeleton: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
     loading?: boolean;
-    variant?: "pulse" | "none";
+    variant?: 'pulse' | 'none';
     width?: number | string;
     height?: number | string;
     boxSize?: number | string;
@@ -8,7 +8,7 @@ declare const Skeleton: import("react").ForwardRefExoticComponent<Omit<import("r
 } & import("react").RefAttributes<HTMLDivElement>> & {
     Root: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
         loading?: boolean;
-        variant?: "pulse" | "none";
+        variant?: 'pulse' | 'none';
         width?: number | string;
         height?: number | string;
         boxSize?: number | string;

package/dist/components/skeleton/Skeleton.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 Skeleton_module from "./Skeleton.module.js";
 const toCssValue = (value)=>'number' == typeof value ? `${value}px` : value;
 const Skeleton_SkeletonRoot = /*#__PURE__*/ forwardRef(function({ 'aria-hidden': ariaHidden, asChild, borderRadius, boxSize, className, height, loading = true, style, variant = 'pulse', width, ...props }, ref) {
@@ -17,7 +16,7 @@ const Skeleton_SkeletonRoot = /*#__PURE__*/ forwardRef(function({ 'aria-hidden':
         "data-loading": loading ? '' : void 0,
         "data-variant": variant,
         "aria-hidden": ariaHidden ?? (loading ? true : void 0),
-        className: clsx(Skeleton_module.root, normalizeClassName(className)),
+        className: clsx(Skeleton_module.root, className),
         style: {
             width: toCssValue(width ?? boxSize),
             height: toCssValue(height ?? boxSize),

package/dist/components/slider/Slider.d.ts

@@ -1,17 +1,17 @@
 import { Slider as SliderPrimitive, useSlider, useSliderContext } from '@ark-ui/react/slider';
-import type { ReactNode } from 'react';
 declare function SliderThumbs({ className }: {
     className?: string;
 }): import("react").JSX.Element[];
 declare const Slider: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
     Root: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     RootProvider: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Context: (props: SliderPrimitive.ContextProps) => ReactNode;
+    Context: (props: SliderPrimitive.ContextProps) => import("react").ReactNode;
     useSlider: (props?: import("@ark-ui/react/slider").UseSliderProps) => import("@ark-ui/react/slider").UseSliderReturn;
     useSliderContext: () => import("@ark-ui/react/slider").UseSliderContext;
     Label: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
     ValueText: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.ValueTextProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Control: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    HiddenInput: import("react").ForwardRefExoticComponent<SliderPrimitive.HiddenInputProps & import("react").RefAttributes<HTMLInputElement>>;
     Track: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.TrackProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Range: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.RangeProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Thumb: import("react").ForwardRefExoticComponent<Omit<SliderPrimitive.ThumbProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;