@moduix/solid 1.1.0 → 2.0.0

package/dist/components/sidebar/Sidebar.jsx

@@ -53,9 +53,7 @@ function toggleSidebarPanel(splitter, panelId) {
     splitter().collapsePanel(panelId);
 }
 function useSidebarConfig() {
-    const config = useContext(SidebarConfigContext);
-    if (!config) throw new Error('Sidebar components must be used within Sidebar.Root');
-    return config;
+    return useContext(SidebarConfigContext);
 }
 function SidebarRoot(props) {
     const [local, others] = splitProps(props, [
@@ -135,7 +133,7 @@ function SidebarTrigger(props) {
         if (event.defaultPrevented) return;
         toggleSidebarPanel(splitter, config.panelId());
     };
-    return <ark.button asChild={local.asChild} type={local.type ?? 'button'} aria-label={local['aria-label'] ?? 'Toggle sidebar'} aria-expanded={!collapsed()} data-scope="sidebar" data-part="trigger" data-side={config.side()} data-state={collapsed() ? 'collapsed' : 'expanded'} class={clsx(Sidebar_module.trigger, local.class)} onClick={handleClick} {...others} data-slot="sidebar-trigger">
+    return <ark.button asChild={local.asChild} type={local.type ?? 'button'} aria-label={local['aria-label'] ?? 'Toggle sidebar'} aria-expanded={!collapsed()} class={clsx(Sidebar_module.trigger, local.class)} onClick={handleClick} {...others} data-scope="sidebar" data-part="trigger" data-side={config.side()} data-state={collapsed() ? 'collapsed' : 'expanded'} data-slot="sidebar-trigger">
       {void 0 === local.children && !local.asChild ? <ChevronLeftIcon/> : local.children}
     </ark.button>;
 }
@@ -143,76 +141,76 @@ function SidebarLabel(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.span data-scope="sidebar" data-part="label" class={clsx(Sidebar_module.label, local.class)} {...others} data-slot="sidebar-label"/>;
+    return <ark.span class={clsx(Sidebar_module.label, local.class)} {...others} data-scope="sidebar" data-part="label" data-slot="sidebar-label"/>;
 }
 function SidebarHeader(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.header data-scope="sidebar" data-part="header" class={clsx(Sidebar_module.header, local.class)} {...others} data-slot="sidebar-header"/>;
+    return <ark.header class={clsx(Sidebar_module.header, local.class)} {...others} data-scope="sidebar" data-part="header" data-slot="sidebar-header"/>;
 }
 function SidebarContent(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.div data-scope="sidebar" data-part="content" class={clsx(Sidebar_module.content, local.class)} {...others} data-slot="sidebar-content"/>;
+    return <ark.div class={clsx(Sidebar_module.content, local.class)} {...others} data-scope="sidebar" data-part="content" data-slot="sidebar-content"/>;
 }
 function SidebarExpandedContent(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
     const { collapsed } = useSidebar();
-    return <ark.div data-scope="sidebar" data-part="expanded-content" class={local.class} {...others} data-slot="sidebar-expanded-content" hidden={collapsed()}/>;
+    return <ark.div class={local.class} {...others} data-scope="sidebar" data-part="expanded-content" data-slot="sidebar-expanded-content" hidden={collapsed()}/>;
 }
 function SidebarCollapsedContent(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
     const { collapsed } = useSidebar();
-    return <ark.div data-scope="sidebar" data-part="collapsed-content" class={local.class} {...others} data-slot="sidebar-collapsed-content" hidden={!collapsed()}/>;
+    return <ark.div class={local.class} {...others} data-scope="sidebar" data-part="collapsed-content" data-slot="sidebar-collapsed-content" hidden={!collapsed()}/>;
 }
 function SidebarFooter(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.footer data-scope="sidebar" data-part="footer" class={clsx(Sidebar_module.footer, local.class)} {...others} data-slot="sidebar-footer"/>;
+    return <ark.footer class={clsx(Sidebar_module.footer, local.class)} {...others} data-scope="sidebar" data-part="footer" data-slot="sidebar-footer"/>;
 }
 function SidebarGroup(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.section data-scope="sidebar" data-part="group" class={clsx(Sidebar_module.group, local.class)} {...others} data-slot="sidebar-group"/>;
+    return <ark.section class={clsx(Sidebar_module.group, local.class)} {...others} data-scope="sidebar" data-part="group" data-slot="sidebar-group"/>;
 }
 function SidebarGroupLabel(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.h3 data-scope="sidebar" data-part="group-label" class={clsx(Sidebar_module.groupLabel, local.class)} {...others} data-slot="sidebar-group-label"/>;
+    return <ark.h3 class={clsx(Sidebar_module.groupLabel, local.class)} {...others} data-scope="sidebar" data-part="group-label" data-slot="sidebar-group-label"/>;
 }
 function SidebarGroupHeader(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.div data-scope="sidebar" data-part="group-header" class={clsx(Sidebar_module.groupHeader, local.class)} {...others} data-slot="sidebar-group-header"/>;
+    return <ark.div class={clsx(Sidebar_module.groupHeader, local.class)} {...others} data-scope="sidebar" data-part="group-header" data-slot="sidebar-group-header"/>;
 }
 function SidebarGroupAction(props) {
     const [local, others] = splitProps(props, [
         'class',
         'type'
     ]);
-    return <ark.button type={local.type ?? 'button'} data-scope="sidebar" data-part="group-action" class={clsx(Sidebar_module.groupAction, local.class)} {...others} data-slot="sidebar-group-action"/>;
+    return <ark.button type={local.type ?? 'button'} class={clsx(Sidebar_module.groupAction, local.class)} {...others} data-scope="sidebar" data-part="group-action" data-slot="sidebar-group-action"/>;
 }
 function SidebarNavigationList(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.ul data-scope="sidebar" data-part="navigation-list" class={clsx(Sidebar_module.menu, local.class)} {...others} data-slot="sidebar-navigation-list"/>;
+    return <ark.ul class={clsx(Sidebar_module.menu, local.class)} {...others} data-scope="sidebar" data-part="navigation-list" data-slot="sidebar-navigation-list"/>;
 }
 function SidebarNavigationItem(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.li data-scope="sidebar" data-part="navigation-item" class={clsx(Sidebar_module.menuItem, local.class)} {...others} data-slot="sidebar-navigation-item"/>;
+    return <ark.li class={clsx(Sidebar_module.menuItem, local.class)} {...others} data-scope="sidebar" data-part="navigation-item" data-slot="sidebar-navigation-item"/>;
 }
 function SidebarNavigationButton(props) {
     const [local, others] = splitProps(props, [
@@ -223,25 +221,25 @@ function SidebarNavigationButton(props) {
         'size',
         'type'
     ]);
-    return <ark.button asChild={local.asChild} type={local.type ?? 'button'} aria-current={local['aria-current'] ?? (local.active ? 'page' : void 0)} data-scope="sidebar" data-part="navigation-button" data-active={local.active ? '' : void 0} data-size={local.size ?? 'md'} class={clsx(Sidebar_module.menuButton, local.class)} {...others} data-slot="sidebar-navigation-button"/>;
+    return <ark.button asChild={local.asChild} type={local.type ?? 'button'} aria-current={local['aria-current'] ?? (local.active ? 'page' : void 0)} class={clsx(Sidebar_module.menuButton, local.class)} {...others} data-scope="sidebar" data-part="navigation-button" data-active={local.active ? '' : void 0} data-size={local.size ?? 'md'} data-slot="sidebar-navigation-button"/>;
 }
 function SidebarNavigationBadge(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.span data-scope="sidebar" data-part="navigation-badge" class={clsx(Sidebar_module.menuBadge, local.class)} {...others} data-slot="sidebar-navigation-badge"/>;
+    return <ark.span class={clsx(Sidebar_module.menuBadge, local.class)} {...others} data-scope="sidebar" data-part="navigation-badge" data-slot="sidebar-navigation-badge"/>;
 }
 function SidebarNavigationSubList(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.ul data-scope="sidebar" data-part="navigation-sub-list" class={clsx(Sidebar_module.menuSub, local.class)} {...others} data-slot="sidebar-navigation-sub-list"/>;
+    return <ark.ul class={clsx(Sidebar_module.menuSub, local.class)} {...others} data-scope="sidebar" data-part="navigation-sub-list" data-slot="sidebar-navigation-sub-list"/>;
 }
 function SidebarNavigationSubItem(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <ark.li data-scope="sidebar" data-part="navigation-sub-item" class={clsx(Sidebar_module.menuSubItem, local.class)} {...others} data-slot="sidebar-navigation-sub-item"/>;
+    return <ark.li class={clsx(Sidebar_module.menuSubItem, local.class)} {...others} data-scope="sidebar" data-part="navigation-sub-item" data-slot="sidebar-navigation-sub-item"/>;
 }
 function SidebarNavigationSubButton(props) {
     const [local, others] = splitProps(props, [
@@ -251,7 +249,7 @@ function SidebarNavigationSubButton(props) {
         'children',
         'class'
     ]);
-    return <ark.a asChild={local.asChild} aria-current={local['aria-current'] ?? (local.active ? 'page' : void 0)} data-scope="sidebar" data-part="navigation-sub-button" data-active={local.active ? '' : void 0} class={clsx(Sidebar_module.menuSubButton, local.class)} {...others} data-slot="sidebar-navigation-sub-button">
+    return <ark.a asChild={local.asChild} aria-current={local['aria-current'] ?? (local.active ? 'page' : void 0)} class={clsx(Sidebar_module.menuSubButton, local.class)} {...others} data-scope="sidebar" data-part="navigation-sub-button" data-active={local.active ? '' : void 0} data-slot="sidebar-navigation-sub-button">
       {'string' == typeof local.children ? <span data-slot="sidebar-navigation-sub-label">{local.children}</span> : local.children}
     </ark.a>;
 }
@@ -279,13 +277,13 @@ function SidebarInput(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <Input.Root class={clsx(Sidebar_module.input, local.class)} {...others} data-slot="sidebar-input"/>;
+    return <Input.Root class={clsx(Sidebar_module.input, local.class)} {...others}/>;
 }
 function SidebarSeparator(props) {
     const [local, others] = splitProps(props, [
         'class'
     ]);
-    return <Separator.Root class={clsx(Sidebar_module.separator, local.class)} {...others} data-slot="sidebar-separator"/>;
+    return <Separator.Root class={clsx(Sidebar_module.separator, local.class)} {...others}/>;
 }
 const Sidebar = Object.assign(SidebarRoot, {
     Root: SidebarRoot,

package/dist/components/sidebar/Sidebar_module.css

@@ -382,7 +382,7 @@
     margin-inline-start: auto;
   }
 
-  .trigger-_fUcgc:focus-visible, .groupAction-aoQPc4:focus-visible, .menuButton-OAl6eQ:focus-visible {
+  .trigger-_fUcgc:focus-visible, .groupAction-aoQPc4:focus-visible, .menuButton-OAl6eQ:focus-visible, .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));

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

@@ -12,7 +12,7 @@ declare function SignaturePadControl(props: ComponentProps<typeof SignaturePadPr
 declare function SignaturePadSegment(props: ComponentProps<typeof SignaturePadPrimitive.Segment>): import("solid-js").JSX.Element;
 declare function SignaturePadGuide(props: ComponentProps<typeof SignaturePadPrimitive.Guide>): import("solid-js").JSX.Element;
 declare function SignaturePadClearTrigger(props: ComponentProps<typeof SignaturePadPrimitive.ClearTrigger>): import("solid-js").JSX.Element;
-type SignaturePadCanvasProps = Omit<ComponentProps<typeof SignaturePadPrimitive.Control>, 'children'>;
+type SignaturePadCanvasProps = Omit<ComponentProps<typeof SignaturePadPrimitive.Control>, 'asChild' | 'children'>;
 declare function SignaturePadCanvas(props: SignaturePadCanvasProps): import("solid-js").JSX.Element;
 declare const SignaturePad: typeof SignaturePadRoot & {
     Root: typeof SignaturePadRoot;

package/dist/components/slider/Slider.js

@@ -22,9 +22,6 @@ function SliderRoot(props) {
         get value () {
             return local.value;
         },
-        get ["data-readonly"] () {
-            return local.readOnly ? '' : void 0;
-        },
         get ["class"] () {
             return clsx(Slider_module.root, local.class);
         },
@@ -32,6 +29,9 @@ function SliderRoot(props) {
             return local.readOnly;
         }
     }, others, {
+        get ["data-readonly"] () {
+            return local.readOnly ? '' : void 0;
+        },
         "data-slot": "slider-root",
         get children () {
             return local.children;

package/dist/components/slider/Slider.jsx

@@ -11,7 +11,7 @@ function SliderRoot(props) {
         'readOnly',
         'value'
     ]);
-    return <Slider.Root asChild={local.asChild} defaultValue={local.defaultValue} value={local.value} data-readonly={local.readOnly ? '' : void 0} class={clsx(Slider_module.root, local.class)} readOnly={local.readOnly} {...others} data-slot="slider-root">
+    return <Slider.Root asChild={local.asChild} defaultValue={local.defaultValue} value={local.value} class={clsx(Slider_module.root, local.class)} readOnly={local.readOnly} {...others} data-readonly={local.readOnly ? '' : void 0} data-slot="slider-root">
       {local.children}
     </Slider.Root>;
 }

package/dist/components/slider/Slider_module.css

@@ -179,13 +179,10 @@
   }
 
   .markerGroup-LGDl6p {
-    justify-content: space-between;
     margin-block-start: var(--moduix-slider-marker-group-margin-top, var(--moduix-spacing-2));
-    display: flex;
   }
 
   .markerGroup-LGDl6p[data-orientation="vertical"] {
-    flex-direction: column;
     height: 100%;
     margin: 0;
   }
@@ -194,7 +191,6 @@
     color: var(--moduix-slider-marker-color, var(--moduix-color-muted-foreground));
     font-size: var(--moduix-slider-marker-font-size, var(--moduix-text-xs));
     line-height: var(--moduix-slider-marker-line-height, var(--moduix-line-height-text-xs));
-    position: relative;
   }
 
   .marker-RkqZdP:before {
@@ -222,5 +218,11 @@
     inset-inline-start: calc(-1 * var(--moduix-spacing-2));
     transform: translate(-50%, -50%);
   }
+
+  @media (prefers-reduced-motion: reduce) {
+    .thumb-dktwnB {
+      transition: none;
+    }
+  }
 }
 

package/dist/components/split-button/SplitButton.js

@@ -1,5 +1,4 @@
 import { className, createComponent, effect, insert, memo, mergeProps, setAttribute, template, use } from "solid-js/web";
-import { useFocusVisible } from "@ark-ui/solid";
 import { Menu } from "@ark-ui/solid/menu";
 import { clsx } from "clsx";
 import { children, createContext, splitProps, useContext } from "solid-js";
@@ -90,19 +89,23 @@ function SplitButtonAction(props) {
 }
 function SplitButtonTrigger(props) {
     const [local, others] = splitProps(props, [
+        'aria-label',
         'children',
         'class',
+        'ref',
         'size',
-        'variant',
-        'aria-label'
+        'variant'
     ]);
     const context = useSplitButtonContext('SplitButton.Trigger');
-    const focusVisible = useFocusVisible();
     const resolvedChildren = children(()=>local.children);
     const isIconOnly = ()=>null == resolvedChildren();
     const ariaLabel = ()=>isIconOnly() ? local['aria-label'] ?? 'More actions' : local['aria-label'];
     return createComponent(Menu.Trigger, mergeProps(others, {
         asChild: (triggerProps)=>createComponent(Button, mergeProps(triggerProps, {
+                ref (r$) {
+                    var _ref$2 = local.ref;
+                    "function" == typeof _ref$2 ? _ref$2(r$) : local.ref = r$;
+                },
                 "data-slot": "split-button-trigger",
                 get size () {
                     return local.size ?? context.size();
@@ -126,9 +129,6 @@ function SplitButtonTrigger(props) {
         },
         get ["class"] () {
             return clsx(SplitButton_module.trigger, local.class);
-        },
-        get ["data-focus-visible"] () {
-            return focusVisible() ? '' : void 0;
         }
     }));
 }

package/dist/components/split-button/SplitButton.jsx

@@ -1,4 +1,3 @@
-import { useFocusVisible } from "@ark-ui/solid";
 import { Menu } from "@ark-ui/solid/menu";
 import { clsx } from "clsx";
 import { children, createContext, splitProps, useContext } from "solid-js";
@@ -52,20 +51,20 @@ function SplitButtonAction(props) {
 }
 function SplitButtonTrigger(props) {
     const [local, others] = splitProps(props, [
+        'aria-label',
         'children',
         'class',
+        'ref',
         'size',
-        'variant',
-        'aria-label'
+        'variant'
     ]);
     const context = useSplitButtonContext('SplitButton.Trigger');
-    const focusVisible = useFocusVisible();
     const resolvedChildren = children(()=>local.children);
     const isIconOnly = ()=>null == resolvedChildren();
     const ariaLabel = ()=>isIconOnly() ? local['aria-label'] ?? 'More actions' : local['aria-label'];
-    return <Menu.Trigger {...others} asChild={(triggerProps)=><Button {...triggerProps()} data-slot="split-button-trigger" size={local.size ?? context.size()} variant={local.variant ?? context.variant()} class={clsx(SplitButton_module.trigger, local.class)} aria-label={ariaLabel()}>
+    return <Menu.Trigger {...others} asChild={(triggerProps)=><Button {...triggerProps()} ref={local.ref} data-slot="split-button-trigger" size={local.size ?? context.size()} variant={local.variant ?? context.variant()} class={clsx(SplitButton_module.trigger, local.class)} aria-label={ariaLabel()}>
           {resolvedChildren() ?? <ChevronDownIcon/>}
-        </Button>} data-slot="split-button-trigger" aria-label={ariaLabel()} class={clsx(SplitButton_module.trigger, local.class)} data-focus-visible={focusVisible() ? '' : void 0}/>;
+        </Button>} data-slot="split-button-trigger" aria-label={ariaLabel()} class={clsx(SplitButton_module.trigger, local.class)}/>;
 }
 function SplitButtonPositioner(props) {
     const [local, others] = splitProps(props, [

package/dist/components/split-button/SplitButton_module.css

@@ -11,7 +11,6 @@
 
   .trigger-DZQRcF {
     min-width: 0;
-    padding-inline: var(--moduix-split-button-trigger-padding-x-md, var(--moduix-spacing-3));
     border-start-start-radius: 0;
     border-end-start-radius: 0;
     margin-inline-start: calc(var(--moduix-button-border-width, var(--moduix-border-width-sm)) * -1);
@@ -41,6 +40,10 @@
     padding-inline: var(--moduix-split-button-trigger-padding-x-sm, var(--moduix-spacing-2-5));
   }
 
+  .trigger-DZQRcF[data-size="md"] {
+    padding-inline: var(--moduix-split-button-trigger-padding-x-md, var(--moduix-spacing-3));
+  }
+
   .trigger-DZQRcF[data-size="lg"] {
     padding-inline: var(--moduix-split-button-trigger-padding-x-lg, var(--moduix-spacing-3-5));
   }

package/dist/components/steps/Steps_module.css

@@ -264,7 +264,7 @@
     outline-offset: var(--moduix-steps-focus-ring-offset, var(--moduix-focus-ring-offset));
   }
 
-  :is(.prevTrigger-n0gQx3, .nextTrigger-y2dzVS):is(:disabled, [data-disabled]) {
+  :is(.prevTrigger-n0gQx3, .nextTrigger-y2dzVS):disabled {
     opacity: var(--moduix-steps-disabled-opacity, var(--moduix-opacity-disabled));
     cursor: default;
   }

package/dist/components/swap/Swap.js

@@ -9,13 +9,13 @@ function SwapRoot(props) {
         'class'
     ]);
     return createComponent(Swap.Root, mergeProps({
-        get ["data-animation"] () {
-            return local.animation ?? 'scale';
-        },
         get ["class"] () {
             return clsx(Swap_module.root, local.class);
         }
     }, others, {
+        get ["data-animation"] () {
+            return local.animation ?? 'scale';
+        },
         "data-slot": "swap-root"
     }));
 }
@@ -25,13 +25,13 @@ function SwapRootProvider(props) {
         'class'
     ]);
     return createComponent(Swap.RootProvider, mergeProps({
-        get ["data-animation"] () {
-            return local.animation ?? 'scale';
-        },
         get ["class"] () {
             return clsx(Swap_module.root, local.class);
         }
     }, others, {
+        get ["data-animation"] () {
+            return local.animation ?? 'scale';
+        },
         "data-slot": "swap-root-provider"
     }));
 }

package/dist/components/swap/Swap.jsx

@@ -7,14 +7,14 @@ function SwapRoot(props) {
         'animation',
         'class'
     ]);
-    return <Swap.Root data-animation={local.animation ?? 'scale'} class={clsx(Swap_module.root, local.class)} {...others} data-slot="swap-root"/>;
+    return <Swap.Root class={clsx(Swap_module.root, local.class)} {...others} data-animation={local.animation ?? 'scale'} data-slot="swap-root"/>;
 }
 function SwapRootProvider(props) {
     const [local, others] = splitProps(props, [
         'animation',
         'class'
     ]);
-    return <Swap.RootProvider data-animation={local.animation ?? 'scale'} class={clsx(Swap_module.root, local.class)} {...others} data-slot="swap-root-provider"/>;
+    return <Swap.RootProvider class={clsx(Swap_module.root, local.class)} {...others} data-animation={local.animation ?? 'scale'} data-slot="swap-root-provider"/>;
 }
 function SwapIndicator(props) {
     const [local, others] = splitProps(props, [

package/dist/components/swap/Swap_module.css

@@ -3,7 +3,6 @@
     vertical-align: middle;
     grid-template-areas: "swap";
     place-items: center;
-    display: inline-grid;
   }
 
   .root-hsHHcI[data-animation="flip"] {
@@ -48,10 +47,8 @@
 
   .indicator-S0xChs {
     color: inherit;
-    grid-area: swap;
     justify-content: center;
     align-items: center;
-    display: inline-flex;
   }
 
   @media (prefers-reduced-motion: reduce) {

package/dist/components/switch/Switch.js

@@ -14,13 +14,13 @@ function SwitchRoot(props) {
         get asChild () {
             return local.asChild;
         },
-        get ["data-size"] () {
-            return local.size ?? 'md';
-        },
         get ["class"] () {
             return clsx(Switch_module.root, local.class);
         }
     }, others, {
+        get ["data-size"] () {
+            return local.size ?? 'md';
+        },
         "data-slot": "switch-root",
         get children () {
             return local.children;
@@ -38,13 +38,13 @@ function SwitchRootProvider(props) {
         get asChild () {
             return local.asChild;
         },
-        get ["data-size"] () {
-            return local.size ?? 'md';
-        },
         get ["class"] () {
             return clsx(Switch_module.root, local.class);
         }
     }, others, {
+        get ["data-size"] () {
+            return local.size ?? 'md';
+        },
         "data-slot": "switch-root-provider",
         get children () {
             return local.children;

package/dist/components/switch/Switch.jsx

@@ -9,7 +9,7 @@ function SwitchRoot(props) {
         'class',
         'size'
     ]);
-    return <Switch.Root asChild={local.asChild} data-size={local.size ?? 'md'} class={clsx(Switch_module.root, local.class)} {...others} data-slot="switch-root">
+    return <Switch.Root asChild={local.asChild} class={clsx(Switch_module.root, local.class)} {...others} data-size={local.size ?? 'md'} data-slot="switch-root">
       {local.children}
     </Switch.Root>;
 }
@@ -20,7 +20,7 @@ function SwitchRootProvider(props) {
         'class',
         'size'
     ]);
-    return <Switch.RootProvider asChild={local.asChild} data-size={local.size ?? 'md'} class={clsx(Switch_module.root, local.class)} {...others} data-slot="switch-root-provider">
+    return <Switch.RootProvider asChild={local.asChild} class={clsx(Switch_module.root, local.class)} {...others} data-size={local.size ?? 'md'} data-slot="switch-root-provider">
       {local.children}
     </Switch.RootProvider>;
 }

package/dist/components/switch/Switch_module.css

@@ -18,9 +18,9 @@
 
   .control-_x56fO {
     box-sizing: border-box;
-    width: var(--_switch-width, 3rem);
+    width: var(--_switch-width, 2.75rem);
     height: var(--_switch-height, var(--moduix-size-xs));
-    --_switch-thumb-translate-default: calc(var(--_switch-width, 3rem) - var(--_switch-thumb-size, var(--moduix-spacing-5)) -
+    --_switch-thumb-translate-default: calc(var(--_switch-width, 2.75rem) - var(--_switch-thumb-size, var(--moduix-spacing-5)) -
         (var(--moduix-switch-padding, var(--moduix-spacing-0-5)) * 2) -
         (var(--moduix-switch-border-width, var(--moduix-border-width-sm)) * 2));
     border: var(--moduix-switch-border-width, var(--moduix-border-width-sm)) solid

package/dist/components/table/Table_module.css

@@ -84,8 +84,10 @@
     background-color: var(--moduix-table-row-bg-striped, color-mix(in oklab, var(--moduix-color-muted) 35%, transparent));
   }
 
-  .root-iUez_7[data-interactive] .body-JqLHru .row-vTGkhP:not([data-empty]):hover {
-    background-color: var(--moduix-table-row-bg-hover, var(--moduix-color-muted));
+  @media (hover: hover) {
+    .root-iUez_7[data-interactive] .body-JqLHru .row-vTGkhP:not([data-empty]):hover {
+      background-color: var(--moduix-table-row-bg-hover, var(--moduix-color-muted));
+    }
   }
 
   .root-iUez_7[data-interactive] .body-JqLHru .row-vTGkhP:not([data-empty]):focus-within {

package/dist/components/tabs/Tabs.js

@@ -10,9 +10,6 @@ function TabsRoot(props) {
         'variant'
     ]);
     return createComponent(Tabs.Root, mergeProps({
-        get ["data-variant"] () {
-            return memo(()=>'vertical' === local.orientation)() ? 'default' : local.variant ?? 'default';
-        },
         get ["class"] () {
             return clsx(Tabs_module.root, local.class);
         },
@@ -20,6 +17,9 @@ function TabsRoot(props) {
             return local.orientation;
         }
     }, others, {
+        get ["data-variant"] () {
+            return memo(()=>'vertical' === local.orientation)() ? 'default' : local.variant ?? 'default';
+        },
         "data-slot": "tabs-root"
     }));
 }
@@ -31,9 +31,6 @@ function TabsRootProvider(props) {
     ]);
     const orientation = ()=>local.value().getRootProps()['data-orientation'];
     return createComponent(Tabs.RootProvider, mergeProps({
-        get ["data-variant"] () {
-            return memo(()=>'vertical' === orientation())() ? 'default' : local.variant ?? 'default';
-        },
         get ["class"] () {
             return clsx(Tabs_module.root, local.class);
         },
@@ -41,6 +38,9 @@ function TabsRootProvider(props) {
             return local.value;
         }
     }, others, {
+        get ["data-variant"] () {
+            return memo(()=>'vertical' === orientation())() ? 'default' : local.variant ?? 'default';
+        },
         "data-slot": "tabs-root-provider"
     }));
 }

package/dist/components/tabs/Tabs.jsx

@@ -8,7 +8,7 @@ function TabsRoot(props) {
         'orientation',
         'variant'
     ]);
-    return <Tabs.Root data-variant={'vertical' === local.orientation ? 'default' : local.variant ?? 'default'} class={clsx(Tabs_module.root, local.class)} orientation={local.orientation} {...others} data-slot="tabs-root"/>;
+    return <Tabs.Root class={clsx(Tabs_module.root, local.class)} orientation={local.orientation} {...others} data-variant={'vertical' === local.orientation ? 'default' : local.variant ?? 'default'} data-slot="tabs-root"/>;
 }
 function TabsRootProvider(props) {
     const [local, others] = splitProps(props, [
@@ -17,7 +17,7 @@ function TabsRootProvider(props) {
         'variant'
     ]);
     const orientation = ()=>local.value().getRootProps()['data-orientation'];
-    return <Tabs.RootProvider data-variant={'vertical' === orientation() ? 'default' : local.variant ?? 'default'} class={clsx(Tabs_module.root, local.class)} value={local.value} {...others} data-slot="tabs-root-provider"/>;
+    return <Tabs.RootProvider class={clsx(Tabs_module.root, local.class)} value={local.value} {...others} data-variant={'vertical' === orientation() ? 'default' : local.variant ?? 'default'} data-slot="tabs-root-provider"/>;
 }
 function TabsList(props) {
     const [local, others] = splitProps(props, [

package/dist/components/tabs/Tabs_module.css

@@ -48,7 +48,7 @@
     }
   }
 
-  .root-r9cKMR[data-variant="line"]:not([data-orientation="vertical"]) .list-HWuixw {
+  .root-r9cKMR[data-variant="line"] .list-HWuixw {
     border-width: 0 0 var(--moduix-tabs-list-border-width, var(--moduix-border-width-sm));
     background-color: #0000;
     border-radius: 0;
@@ -134,7 +134,7 @@
     translate: 0 -50%;
   }
 
-  .root-r9cKMR[data-variant="line"]:not([data-orientation="vertical"]) .indicator-Eq3gMQ {
+  .root-r9cKMR[data-variant="line"] .indicator-Eq3gMQ {
     --transition-duration: var(--moduix-tabs-line-indicator-transition-duration, var(--moduix-duration-normal));
     --transition-timing-function: var(--moduix-tabs-line-indicator-transition-timing-function, var(--moduix-ease-in-out));
     height: var(--moduix-tabs-line-indicator-size, var(--moduix-spacing-0-5));

package/dist/components/tags-input/TagsInput_module.css

@@ -130,7 +130,6 @@
     height: var(--moduix-tags-input-input-height, var(--moduix-size-xs));
     padding: 0 var(--moduix-tags-input-input-padding-x, var(--moduix-spacing-1));
     color: inherit;
-    font: inherit;
     font-size: var(--moduix-tags-input-input-font-size, var(--moduix-input-font-size, var(--moduix-text-sm)));
     line-height: var(--moduix-tags-input-input-line-height, var(--moduix-input-line-height, var(--moduix-line-height-text-sm)));
     background-color: #0000;
@@ -151,7 +150,7 @@
     flex: 0 1 var(--moduix-tags-input-item-input-width, 7rem);
   }
 
-  .input-uYY2LW[data-readonly] {
+  .input-uYY2LW[data-readonly], .control-aj7rxt[data-readonly] .itemDeleteTrigger-Fx1XkC {
     display: none;
   }
 
@@ -182,8 +181,10 @@
     flex: none;
   }
 
-  .itemDeleteTrigger-Fx1XkC:hover {
-    background-color: var(--moduix-tags-input-trigger-bg-hover, color-mix(in oklab, currentColor 12%, transparent));
+  @media (hover: hover) {
+    .itemDeleteTrigger-Fx1XkC:hover {
+      background-color: var(--moduix-tags-input-trigger-bg-hover, color-mix(in oklab, currentColor 12%, transparent));
+    }
   }
 
   .itemDeleteTrigger-Fx1XkC:focus-visible {

package/dist/components/toast/Toast.module.js

@@ -1,10 +1,10 @@
 import "./Toast_module.css";
 const Toast_module = {
-    toaster: "toaster-m5bxJd",
     root: "root-p_jC2T",
     title: "title-MTy3zi",
     description: "description-AIx4K_",
     actionTrigger: "actionTrigger-ftU5e1",
-    closeTrigger: "closeTrigger-IYs7Wg"
+    closeTrigger: "closeTrigger-IYs7Wg",
+    toaster: "toaster-m5bxJd"
 };
 export default Toast_module;

package/dist/components/toast/Toast.module.jsx

@@ -1,10 +1,10 @@
 import "./Toast_module.css";
 const Toast_module = {
-    toaster: "toaster-m5bxJd",
     root: "root-p_jC2T",
     title: "title-MTy3zi",
     description: "description-AIx4K_",
     actionTrigger: "actionTrigger-ftU5e1",
-    closeTrigger: "closeTrigger-IYs7Wg"
+    closeTrigger: "closeTrigger-IYs7Wg",
+    toaster: "toaster-m5bxJd"
 };
 export default Toast_module;