@moduix/react 2.2.0 → 2.2.4

package/dist/components/native-select/{NativeSelect.css → NativeSelect_module.css}

@@ -1,5 +1,6 @@
 @layer moduix.components {
-  .mei8Eq_control {
+  .control-D7osAi {
+    width: -moz-fit-content;
     width: fit-content;
     min-width: 0;
     max-width: 100%;
@@ -7,7 +8,7 @@
     position: relative;
   }
 
-  .mei8Eq_root {
+  .root-ZCXVuV {
     box-sizing: border-box;
     width: var(--moduix-select-width, 14rem);
     max-width: var(--moduix-select-max-width, 100%);
@@ -34,36 +35,38 @@
     padding-inline-end: calc(var(--moduix-select-action-offset-right, var(--moduix-spacing-1)) +
         var(--moduix-select-action-size, var(--moduix-spacing-6)) +
         var(--moduix-select-trigger-padding-x-start, var(--moduix-spacing-3)));
+  }
 
-    &:focus-visible {
-      border-color: var(--moduix-select-focus-ring-color, var(--moduix-color-ring));
-      outline-color: var(--moduix-select-focus-ring-color, var(--moduix-color-ring));
-    }
+  .root-ZCXVuV:focus-visible {
+    border-color: var(--moduix-select-focus-ring-color, var(--moduix-color-ring));
+    outline-color: var(--moduix-select-focus-ring-color, var(--moduix-color-ring));
+  }
 
-    &:is([data-invalid], [aria-invalid="true"]) {
-      border-color: var(--moduix-select-invalid-color, var(--moduix-color-destructive));
-      outline-color: var(--moduix-select-invalid-color, var(--moduix-color-destructive));
-    }
+  .root-ZCXVuV:is([data-invalid], [aria-invalid="true"]) {
+    border-color: var(--moduix-select-invalid-color, var(--moduix-color-destructive));
+    outline-color: var(--moduix-select-invalid-color, var(--moduix-color-destructive));
+  }
 
-    &:is([data-disabled], :disabled) {
-      pointer-events: none;
-      opacity: var(--moduix-select-disabled-opacity, var(--moduix-opacity-disabled));
-    }
+  .root-ZCXVuV:is([data-disabled], :disabled) {
+    pointer-events: none;
+    opacity: var(--moduix-select-disabled-opacity, var(--moduix-opacity-disabled));
+  }
 
-    &:is([multiple], [size]:not([size="1"])) {
-      height: auto;
-      padding-block: var(--moduix-spacing-2);
-      padding-inline: var(--moduix-select-trigger-padding-x-start, var(--moduix-spacing-3));
-      appearance: auto;
-    }
+  .root-ZCXVuV:is([multiple], [size]:not([size="0"], [size="1"])) {
+    height: auto;
+    padding-block: var(--moduix-spacing-2);
+    padding-inline: var(--moduix-select-trigger-padding-x-start, var(--moduix-spacing-3));
+    appearance: auto;
+  }
 
-    @media (forced-colors: active) {
+  @media (forced-colors: active) {
+    .root-ZCXVuV {
       appearance: auto;
       padding-inline-end: var(--moduix-select-trigger-padding-x-start, var(--moduix-spacing-3));
     }
   }
 
-  .mei8Eq_indicator {
+  .indicator-oW5rXf {
     top: 50%;
     width: var(--moduix-select-action-size, var(--moduix-spacing-6));
     height: var(--moduix-select-action-size, var(--moduix-spacing-6));
@@ -81,30 +84,33 @@
     position: absolute;
     inset-inline-end: var(--moduix-select-action-offset-right, var(--moduix-spacing-2));
     transform: translateY(-50%);
+  }
 
-    & > svg {
-      width: var(--moduix-select-icon-size, var(--moduix-spacing-4));
-      height: var(--moduix-select-icon-size, var(--moduix-spacing-4));
-      display: block;
-    }
+  .indicator-oW5rXf > svg {
+    width: var(--moduix-select-icon-size, var(--moduix-spacing-4));
+    height: var(--moduix-select-icon-size, var(--moduix-spacing-4));
+    display: block;
+  }
 
-    @media (forced-colors: active) {
+  @media (forced-colors: active) {
+    .indicator-oW5rXf {
       display: none;
     }
   }
 
-  .mei8Eq_root:is([data-disabled], :disabled) + .mei8Eq_indicator {
+  .root-ZCXVuV:is([data-disabled], :disabled) + .indicator-oW5rXf {
     opacity: var(--moduix-select-disabled-opacity, var(--moduix-opacity-disabled));
   }
 
-  .mei8Eq_root:not(:disabled, [data-disabled]):hover + .mei8Eq_indicator {
-    @media (hover: hover) {
+  @media (hover: hover) {
+    .root-ZCXVuV:not(:disabled, [data-disabled]):hover + .indicator-oW5rXf {
       background-color: var(--moduix-select-action-bg-hover, var(--moduix-color-muted));
       color: var(--moduix-select-action-color-hover, var(--moduix-color-foreground));
     }
   }
 
-  .mei8Eq_root:is([multiple], [size]:not([size="1"])) + .mei8Eq_indicator {
+  .root-ZCXVuV:is([multiple], [size]:not([size="0"], [size="1"])) + .indicator-oW5rXf {
     display: none;
   }
 }
+

package/dist/components/native-select/index.d.ts

@@ -1,2 +1 @@
-import { NativeSelect } from "./NativeSelect.js";
-export { NativeSelect };
+export * from './NativeSelect.js';

package/dist/components/native-select/index.js

@@ -0,0 +1 @@
+export * from "./NativeSelect.js";

package/dist/components/number-input/NumberInput.d.ts

@@ -1,21 +1,18 @@
-import { ComponentProps } from "react";
-import { NumberInput, useNumberInput, useNumberInputContext } from "@ark-ui/react/number-input";
-
-//#region src/components/number-input/NumberInput.d.ts
-declare const NumberInputControl: import("react").ForwardRefExoticComponent<Omit<NumberInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+import { NumberInput as NumberInputPrimitive, useNumberInput, useNumberInputContext } from '@ark-ui/react/number-input';
+import type { ComponentProps } from 'react';
+declare const NumberInputControl: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 type NumberInputFieldProps = Omit<ComponentProps<typeof NumberInputControl>, 'asChild' | 'children'>;
-declare const NumberInput$1: import("react").ForwardRefExoticComponent<Omit<NumberInput.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-  Root: import("react").ForwardRefExoticComponent<Omit<NumberInput.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  RootProvider: import("react").ForwardRefExoticComponent<Omit<NumberInput.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Context: (props: NumberInput.ContextProps) => import("react").ReactNode;
-  Label: import("react").ForwardRefExoticComponent<Omit<NumberInput.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
-  Scrubber: import("react").ForwardRefExoticComponent<Omit<NumberInput.ScrubberProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Control: import("react").ForwardRefExoticComponent<Omit<NumberInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Field: import("react").ForwardRefExoticComponent<Omit<NumberInputFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  DecrementTrigger: import("react").ForwardRefExoticComponent<Omit<NumberInput.DecrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  Input: import("react").ForwardRefExoticComponent<Omit<NumberInput.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
-  IncrementTrigger: import("react").ForwardRefExoticComponent<Omit<NumberInput.IncrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  ValueText: import("react").ForwardRefExoticComponent<Omit<NumberInput.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+declare const NumberInput: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: NumberInputPrimitive.ContextProps) => import("react").ReactNode;
+    Label: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    Scrubber: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.ScrubberProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Control: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Field: import("react").ForwardRefExoticComponent<Omit<NumberInputFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    DecrementTrigger: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.DecrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Input: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+    IncrementTrigger: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.IncrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    ValueText: import("react").ForwardRefExoticComponent<Omit<NumberInputPrimitive.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 };
-//#endregion
-export { NumberInput$1 as NumberInput, useNumberInput, useNumberInputContext };
+export { NumberInput, useNumberInput, useNumberInputContext };

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

@@ -1,108 +1,107 @@
-import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
-import { MinusIcon, PlusIcon } from "../../lib/moduix/icons/ui/Icons.js";
-import NumberInput_module_default from "./NumberInput.module.js";
-import { clsx } from "clsx";
-import { forwardRef } from "react";
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { NumberInput, useNumberInput, useNumberInputContext } from "@ark-ui/react/number-input";
-//#region src/components/number-input/NumberInput.tsx
-const NumberInputRoot = forwardRef(function NumberInputRoot({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.Root, {
-		ref,
-		"data-slot": "number-input-root",
-		className: clsx(NumberInput_module_default.root, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputRootProvider = forwardRef(function NumberInputRootProvider({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.RootProvider, {
-		ref,
-		"data-slot": "number-input-root-provider",
-		className: clsx(NumberInput_module_default.root, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputLabel = forwardRef(function NumberInputLabel({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.Label, {
-		ref,
-		"data-slot": "number-input-label",
-		className: clsx(NumberInput_module_default.label, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputScrubber = forwardRef(function NumberInputScrubber({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.Scrubber, {
-		ref,
-		"data-slot": "number-input-scrubber",
-		className: clsx(NumberInput_module_default.scrubber, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputControl = forwardRef(function NumberInputControl({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.Control, {
-		ref,
-		"data-slot": "number-input-control",
-		className: clsx(NumberInput_module_default.control, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputDecrementTrigger = forwardRef(function NumberInputDecrementTrigger({ className, children, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.DecrementTrigger, {
-		ref,
-		"data-slot": "number-input-decrement-trigger",
-		className: clsx(NumberInput_module_default.decrementTrigger, normalizeClassName(className)),
-		...props,
-		children: children ?? /* @__PURE__ */ jsx(MinusIcon, {})
-	});
+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)),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx(MinusIcon, {})
+    });
 });
-const NumberInputInput = forwardRef(function NumberInputInput({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.Input, {
-		ref,
-		"data-slot": "number-input-input",
-		className: clsx(NumberInput_module_default.input, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputIncrementTrigger = forwardRef(function NumberInputIncrementTrigger({ className, children, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.IncrementTrigger, {
-		ref,
-		"data-slot": "number-input-increment-trigger",
-		className: clsx(NumberInput_module_default.incrementTrigger, normalizeClassName(className)),
-		...props,
-		children: children ?? /* @__PURE__ */ jsx(PlusIcon, {})
-	});
+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)),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx(PlusIcon, {})
+    });
 });
-const NumberInputValueText = forwardRef(function NumberInputValueText({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(NumberInput.ValueText, {
-		ref,
-		"data-slot": "number-input-value-text",
-		className: clsx(NumberInput_module_default.valueText, normalizeClassName(className)),
-		...props
-	});
+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
+    });
 });
-const NumberInputField = forwardRef(function NumberInputField(props, ref) {
-	return /* @__PURE__ */ jsxs(NumberInputControl, {
-		ref,
-		...props,
-		children: [
-			/* @__PURE__ */ jsx(NumberInputDecrementTrigger, {}),
-			/* @__PURE__ */ jsx(NumberInputInput, {}),
-			/* @__PURE__ */ jsx(NumberInputIncrementTrigger, {})
-		]
-	});
+const NumberInput_NumberInputField = /*#__PURE__*/ forwardRef(function(props, ref) {
+    return /*#__PURE__*/ jsxs(NumberInput_NumberInputControl, {
+        ref: ref,
+        ...props,
+        children: [
+            /*#__PURE__*/ jsx(NumberInput_NumberInputDecrementTrigger, {}),
+            /*#__PURE__*/ jsx(NumberInput_NumberInputInput, {}),
+            /*#__PURE__*/ jsx(NumberInput_NumberInputIncrementTrigger, {})
+        ]
+    });
 });
-const NumberInput$1 = Object.assign(NumberInputRoot, {
-	Root: NumberInputRoot,
-	RootProvider: NumberInputRootProvider,
-	Context: NumberInput.Context,
-	Label: NumberInputLabel,
-	Scrubber: NumberInputScrubber,
-	Control: NumberInputControl,
-	Field: NumberInputField,
-	DecrementTrigger: NumberInputDecrementTrigger,
-	Input: NumberInputInput,
-	IncrementTrigger: NumberInputIncrementTrigger,
-	ValueText: NumberInputValueText
+const NumberInput_NumberInput = Object.assign(NumberInput_NumberInputRoot, {
+    Root: NumberInput_NumberInputRoot,
+    RootProvider: NumberInput_NumberInputRootProvider,
+    Context: NumberInput.Context,
+    Label: NumberInput_NumberInputLabel,
+    Scrubber: NumberInput_NumberInputScrubber,
+    Control: NumberInput_NumberInputControl,
+    Field: NumberInput_NumberInputField,
+    DecrementTrigger: NumberInput_NumberInputDecrementTrigger,
+    Input: NumberInput_NumberInputInput,
+    IncrementTrigger: NumberInput_NumberInputIncrementTrigger,
+    ValueText: NumberInput_NumberInputValueText
 });
-//#endregion
-export { NumberInput$1 as NumberInput, useNumberInput, useNumberInputContext };
+export { NumberInput_NumberInput as NumberInput, useNumberInput, useNumberInputContext };

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

@@ -1,14 +1,12 @@
-import './NumberInput.css';
-//#region src/components/number-input/NumberInput.module.css
-var NumberInput_module_default = {
-	"control": "ZjEX8G_control",
-	"decrementTrigger": "ZjEX8G_decrementTrigger",
-	"incrementTrigger": "ZjEX8G_incrementTrigger",
-	"input": "ZjEX8G_input",
-	"label": "ZjEX8G_label",
-	"root": "ZjEX8G_root",
-	"scrubber": "ZjEX8G_scrubber",
-	"valueText": "ZjEX8G_valueText"
+import "./NumberInput_module.css";
+const NumberInput_module = {
+    root: "root-J5l339",
+    label: "label-V0iygT",
+    scrubber: "scrubber-ZbVoIs",
+    control: "control-IKvJFM",
+    decrementTrigger: "decrementTrigger-gr_J6_",
+    incrementTrigger: "incrementTrigger-AZRSzr",
+    input: "input-MggWIT",
+    valueText: "valueText-lP90vp"
 };
-//#endregion
-export { NumberInput_module_default as default };
+export default NumberInput_module;

package/dist/components/number-input/{NumberInput.css → NumberInput_module.css}

@@ -1,43 +1,44 @@
 @layer moduix.components {
-  .ZjEX8G_root {
+  .root-J5l339 {
     align-items: flex-start;
     gap: var(--moduix-number-input-gap, var(--moduix-spacing-1));
     width: var(--moduix-number-input-width, auto);
     max-width: var(--moduix-number-input-max-width, none);
     flex-direction: column;
     display: flex;
+  }
 
-    &[data-disabled] {
-      opacity: var(--moduix-number-input-disabled-opacity, var(--moduix-opacity-disabled));
-    }
+  .root-J5l339[data-disabled] {
+    opacity: var(--moduix-number-input-disabled-opacity, var(--moduix-opacity-disabled));
   }
 
-  .ZjEX8G_label {
+  .label-V0iygT {
     color: var(--moduix-number-input-label-color, var(--moduix-color-foreground));
     font-size: var(--moduix-number-input-label-font-size, var(--moduix-text-sm));
     line-height: var(--moduix-number-input-label-line-height, var(--moduix-line-height-text-sm));
     font-weight: var(--moduix-number-input-label-font-weight, var(--moduix-weight-medium));
   }
 
-  .ZjEX8G_scrubber {
+  .scrubber-ZbVoIs {
     align-items: center;
     gap: var(--moduix-number-input-scrubber-gap, var(--moduix-spacing-2));
     color: var(--moduix-number-input-scrubber-color, var(--moduix-color-foreground));
+    -webkit-user-select: none;
     user-select: none;
     cursor: ew-resize;
     display: inline-flex;
+  }
 
-    &[data-disabled] {
-      cursor: default;
-    }
+  .scrubber-ZbVoIs[data-disabled] {
+    cursor: default;
   }
 
-  .ZjEX8G_control {
+  .control-IKvJFM {
     align-items: stretch;
     display: inline-flex;
   }
 
-  .ZjEX8G_decrementTrigger, .ZjEX8G_incrementTrigger {
+  .decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr {
     --_number-input-focus-ring-width: var(--moduix-number-input-focus-ring-width, var(--moduix-number-input-border-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm))));
     box-sizing: border-box;
     width: var(--moduix-number-input-control-height, var(--moduix-size-md));
@@ -48,6 +49,7 @@
       var(--moduix-number-input-border-color, var(--moduix-color-border));
     background-color: var(--moduix-number-input-button-bg, var(--moduix-color-background));
     color: var(--moduix-number-input-button-color, var(--moduix-color-foreground));
+    -webkit-user-select: none;
     user-select: none;
     cursor: pointer;
     transition: background-color var(--moduix-transition-default),
@@ -60,52 +62,52 @@
     margin: 0;
     padding: 0;
     display: inline-flex;
+  }
 
-    @media (hover: hover) {
-      &:hover {
-        background-color: var(--moduix-number-input-button-bg-hover, var(--moduix-color-accent));
-      }
+  @media (hover: hover) {
+    :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr):hover {
+      background-color: var(--moduix-number-input-button-bg-hover, var(--moduix-color-accent));
     }
+  }
 
-    &:active {
-      background-color: var(--moduix-number-input-button-bg-active, var(--moduix-number-input-button-bg-hover, var(--moduix-color-accent)));
-    }
+  :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr):active {
+    background-color: var(--moduix-number-input-button-bg-active, var(--moduix-number-input-button-bg-hover, var(--moduix-color-accent)));
+  }
 
-    &:focus-visible, &[data-focus] {
-      outline: var(--_number-input-focus-ring-width) solid
+  :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr):focus-visible, :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr)[data-focus] {
+    outline: var(--_number-input-focus-ring-width) solid
         var(--moduix-number-input-focus-ring-color, var(--moduix-color-ring));
-      outline-offset: calc(var(--_number-input-focus-ring-width) * -1);
-      z-index: 1;
-    }
+    outline-offset: calc(var(--_number-input-focus-ring-width) * -1);
+    z-index: 1;
+  }
 
-    &:is([data-disabled], :disabled) {
-      pointer-events: none;
-    }
+  :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr):is([data-disabled], :disabled) {
+    pointer-events: none;
+  }
 
-    &[data-invalid], .ZjEX8G_root[data-invalid] & {
-      border-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
-    }
+  :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr)[data-invalid], .root-J5l339[data-invalid] :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr) {
+    border-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
+  }
 
-    & > svg {
-      width: var(--moduix-number-input-icon-size, var(--moduix-spacing-3-5));
-      height: var(--moduix-number-input-icon-size, var(--moduix-spacing-3-5));
-      flex-shrink: 0;
-    }
+  :is(.decrementTrigger-gr_J6_, .incrementTrigger-AZRSzr) > svg {
+    width: var(--moduix-number-input-icon-size, var(--moduix-spacing-3-5));
+    height: var(--moduix-number-input-icon-size, var(--moduix-spacing-3-5));
+    flex-shrink: 0;
   }
 
-  .ZjEX8G_decrementTrigger {
+  .decrementTrigger-gr_J6_ {
     border-inline-end: 0;
     border-start-start-radius: var(--moduix-number-input-radius, var(--moduix-radius-md));
     border-end-start-radius: var(--moduix-number-input-radius, var(--moduix-radius-md));
   }
 
-  .ZjEX8G_incrementTrigger {
+  .incrementTrigger-AZRSzr {
     border-inline-start: 0;
     border-start-end-radius: var(--moduix-number-input-radius, var(--moduix-radius-md));
     border-end-end-radius: var(--moduix-number-input-radius, var(--moduix-radius-md));
   }
 
-  .ZjEX8G_input {
+  .input-MggWIT {
     --_number-input-focus-ring-width: var(--moduix-number-input-focus-ring-width, var(--moduix-number-input-border-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm))));
     box-sizing: border-box;
     width: var(--moduix-number-input-input-width, 6rem);
@@ -133,26 +135,27 @@
     border-inline: 0;
     border-radius: 0;
     margin: 0;
+  }
 
-    &:focus-visible, &[data-focus] {
-      outline-color: var(--moduix-number-input-focus-ring-color, var(--moduix-color-ring));
-      z-index: 1;
-    }
+  .input-MggWIT:focus-visible, .input-MggWIT[data-focus] {
+    outline-color: var(--moduix-number-input-focus-ring-color, var(--moduix-color-ring));
+    z-index: 1;
+  }
 
-    &[data-invalid], .ZjEX8G_root[data-invalid] & {
-      border-top-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
-      border-bottom-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
+  .input-MggWIT[data-invalid], .root-J5l339[data-invalid] .input-MggWIT {
+    border-top-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
+    border-bottom-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
+  }
 
-      &:focus-visible, &[data-focus] {
-        outline-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
-      }
-    }
+  :is(.input-MggWIT[data-invalid], .root-J5l339[data-invalid] .input-MggWIT):focus-visible, :is(.input-MggWIT[data-invalid], .root-J5l339[data-invalid] .input-MggWIT)[data-focus] {
+    outline-color: var(--moduix-number-input-border-color-invalid, var(--moduix-color-destructive));
   }
 
-  .ZjEX8G_valueText {
+  .valueText-lP90vp {
     color: var(--moduix-number-input-value-text-color, var(--moduix-color-muted-foreground));
     font-size: var(--moduix-number-input-value-text-font-size, var(--moduix-text-sm));
     line-height: var(--moduix-number-input-value-text-line-height, var(--moduix-line-height-text-sm));
     font-variant-numeric: tabular-nums;
   }
 }
+

package/dist/components/number-input/index.d.ts

@@ -1,2 +1 @@
-import { NumberInput, useNumberInput, useNumberInputContext } from "./NumberInput.js";
-export { NumberInput, useNumberInput, useNumberInputContext };
+export { NumberInput, useNumberInput, useNumberInputContext } from './NumberInput.js';

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

@@ -0,0 +1 @@
+export { NumberInput, useNumberInput, useNumberInputContext } from "./NumberInput.js";