@techsio/ui-kit 0.6.0 → 0.9.0

package/dist/atoms/badge.js

@@ -39,19 +39,19 @@ const badgeVariants = tv({
         },
         size: {
             sm: [
-                "text-badge-sm font-badge-sm",
+                "font-badge-sm text-badge-sm",
                 "p-badge-sm"
             ],
             md: [
-                "text-badge-md font-badge-md",
+                "font-badge-md text-badge-md",
                 "p-badge-md"
             ],
             lg: [
-                "text-badge-lg font-badge-lg",
+                "font-badge-lg text-badge-lg",
                 "p-badge-lg"
             ],
             xl: [
-                "text-badge-xl font-badge-xl",
+                "font-badge-xl text-badge-xl",
                 "p-badge-xl"
             ]
         }
@@ -68,7 +68,7 @@ function Badge({ variant, size, className, children, style, ...props }) {
         ...style,
         backgroundColor: bgColor,
         color: fgColor,
-        borderColor: borderColor
+        borderColor
     } : style;
     return /*#__PURE__*/ jsx("span", {
         className: badgeVariants({

package/dist/atoms/button.js

@@ -23,8 +23,8 @@ const buttonVariants = tv({
         theme: {
             solid: "disabled:bg-button-bg-disabled",
             light: "disabled:bg-button-bg-disabled",
-            borderless: "bg-button-bg-borderless hover:bg-button-bg-borderless-hover active:bg-button-bg-borderless-active disabled:hover:bg-button-bg-borderless",
-            outlined: "border bg-button-bg-outlined disabled:border-button-border-disabled disabled:hover:bg-button-bg-outlined",
+            borderless: "bg-button-bg-borderless-base hover:bg-button-bg-borderless-hover active:bg-button-bg-borderless-active disabled:hover:bg-button-bg-borderless-base",
+            outlined: "border bg-button-bg-outlined disabled:border-0 disabled:bg-button-bg-disabled disabled:hover:bg-button-bg-disabled",
             unstyled: ""
         },
         uppercase: {
@@ -45,7 +45,7 @@ const buttonVariants = tv({
             variant: "primary",
             theme: "solid",
             className: [
-                "bg-button-bg-primary",
+                "bg-button-bg-primary-base",
                 "hover:bg-button-bg-primary-hover",
                 "active:bg-button-bg-primary-active",
                 "text-button-fg-primary"
@@ -55,7 +55,7 @@ const buttonVariants = tv({
             variant: "secondary",
             theme: "solid",
             className: [
-                "bg-button-bg-secondary",
+                "bg-button-bg-secondary-base",
                 "hover:bg-button-bg-secondary-hover",
                 "active:bg-button-bg-secondary-active",
                 "text-button-fg-secondary"
@@ -65,7 +65,7 @@ const buttonVariants = tv({
             variant: "tertiary",
             theme: "solid",
             className: [
-                "bg-button-bg-tertiary",
+                "bg-button-bg-tertiary-base",
                 "hover:bg-button-bg-tertiary-hover",
                 "active:bg-button-bg-tertiary-active",
                 "text-button-fg-tertiary"
@@ -75,7 +75,7 @@ const buttonVariants = tv({
             variant: "warning",
             theme: "solid",
             className: [
-                "bg-button-bg-warning",
+                "bg-button-bg-warning-base",
                 "hover:bg-button-bg-warning-hover",
                 "active:bg-button-bg-warning-active",
                 "text-button-fg-warning"
@@ -85,7 +85,7 @@ const buttonVariants = tv({
             variant: "danger",
             theme: "solid",
             className: [
-                "bg-button-bg-danger",
+                "bg-button-bg-danger-base",
                 "hover:bg-button-bg-danger-hover",
                 "active:bg-button-bg-danger-active",
                 "text-button-fg-danger"
@@ -95,7 +95,7 @@ const buttonVariants = tv({
             variant: "primary",
             theme: "light",
             className: [
-                "bg-button-bg-primary-light",
+                "bg-button-bg-primary-light-base",
                 "hover:bg-button-bg-primary-light-hover",
                 "active:bg-button-bg-primary-light-active",
                 "text-button-fg-primary-light"
@@ -105,7 +105,7 @@ const buttonVariants = tv({
             variant: "secondary",
             theme: "light",
             className: [
-                "bg-button-bg-secondary-light",
+                "bg-button-bg-secondary-light-base",
                 "hover:bg-button-bg-secondary-light-hover",
                 "active:bg-button-bg-secondary-light-active",
                 "text-button-fg-secondary-light"
@@ -115,7 +115,7 @@ const buttonVariants = tv({
             variant: "tertiary",
             theme: "light",
             className: [
-                "bg-button-bg-tertiary-light",
+                "bg-button-bg-tertiary-light-base",
                 "hover:bg-button-bg-tertiary-light-hover",
                 "active:bg-button-bg-tertiary-light-active",
                 "text-button-fg-tertiary-light"
@@ -125,7 +125,7 @@ const buttonVariants = tv({
             variant: "warning",
             theme: "light",
             className: [
-                "bg-button-bg-warning-light",
+                "bg-button-bg-warning-light-base",
                 "hover:bg-button-bg-warning-light-hover",
                 "active:bg-button-bg-warning-light-active",
                 "text-button-fg-warning-light"
@@ -135,7 +135,7 @@ const buttonVariants = tv({
             variant: "danger",
             theme: "light",
             className: [
-                "bg-button-bg-danger-light",
+                "bg-button-bg-danger-light-base",
                 "hover:bg-button-bg-danger-light-hover",
                 "active:bg-button-bg-danger-light-active",
                 "text-button-fg-danger-light"
@@ -229,17 +229,17 @@ const buttonVariants = tv({
         {
             theme: "outlined",
             size: "sm",
-            className: "border-(length:--border-button-width-sm)"
+            className: "border-(length:--border-width-button-sm)"
         },
         {
             theme: "outlined",
             size: "md",
-            className: "border-(length:--border-button-width-md)"
+            className: "border-(length:--border-width-button-md)"
         },
         {
             theme: "outlined",
             size: "lg",
-            className: "border-(length:--border-button-width-lg)"
+            className: "border-(length:--border-width-button-lg)"
         }
     ],
     defaultVariants: {

package/dist/atoms/checkbox.js

@@ -4,8 +4,8 @@ const checkboxVariants = tv({
     base: [
         "relative shrink-0 cursor-pointer appearance-none",
         "size-checkbox",
-        "rounded-checkbox border border-checkbox-border",
-        "bg-checkbox-bg",
+        "rounded-checkbox border border-checkbox-border-base",
+        "bg-checkbox-bg-base",
         "after:-translate-x-1/2 after:-translate-y-1/2 after:absolute after:top-1/2 after:left-1/2",
         "checked:bg-checkbox-bg-checked",
         "checked:border-checkbox-border-checked",

package/dist/atoms/figma/image.figma.js

@@ -14,8 +14,8 @@ code_connect.connect(Image, "https://www.figma.com/design/12xb1pqXKwE2vbOByN3ntg
         })
     },
     example: ({ size })=>/*#__PURE__*/ jsx(Image, {
-            src: "/image.jpg",
             alt: "Description",
-            size: size
+            size: size,
+            src: "/image.jpg"
         })
 });

package/dist/atoms/figma/numeric-input.figma.js

@@ -31,9 +31,9 @@ code_connect.connect(NumericInput, "https://www.figma.com/design/12xb1pqXKwE2vbO
         })
     },
     example: ({ disabled, invalid, readOnly, size })=>/*#__PURE__*/ jsx(NumericInput, {
-            id: "quantity",
             defaultValue: 42,
             disabled: disabled,
+            id: "quantity",
             invalid: invalid,
             readOnly: readOnly,
             size: size,

package/dist/atoms/figma/textarea.figma.js

@@ -30,9 +30,9 @@ code_connect.connect(Textarea, "https://www.figma.com/design/12xb1pqXKwE2vbOByN3
         })
     },
     example: ({ size, variant, disabled, readonly })=>/*#__PURE__*/ jsx(Textarea, {
-            size: size,
-            variant: variant,
             disabled: disabled,
-            readonly: readonly
+            readonly: readonly,
+            size: size,
+            variant: variant
         })
 });

package/dist/atoms/input.js

@@ -4,15 +4,15 @@ const inputVariants = tv({
     base: [
         "block w-full",
         "font-normal",
-        "bg-input",
+        "bg-input-bg-base",
         "text-input-fg",
         "placeholder:font-normal",
         "placeholder:text-input-fg-placeholder",
-        "border-(length:--border-width-input) border-input-border",
+        "border-(length:--border-width-input) border-input-border-base",
         "rounded-input",
         "transition-all duration-200 motion-reduce:transition-none",
-        "hover:border-input-border-hover hover:bg-input-hover",
-        "focus:border-input-border-focus focus:bg-input-focus",
+        "hover:border-input-border-hover hover:bg-input-bg-hover",
+        "focus:border-input-border-focus focus:bg-input-bg-focus",
         "focus-visible:outline-(style:--default-ring-style) focus-visible:outline-(length:--default-ring-width)",
         "focus-visible:outline-input-ring",
         "focus-visible:outline-offset-(length:--default-ring-offset)",
@@ -28,27 +28,27 @@ const inputVariants = tv({
             default: "",
             error: [
                 "border-(length:--border-width-validation)",
-                "border-input-border-danger",
+                "border-input-border-danger-base",
                 "hover:border-input-border-danger-hover",
                 "focus:border-input-border-danger-focus"
             ],
             success: [
                 "border-(length:--border-width-validation)",
-                "border-input-border-success",
+                "border-input-border-success-base",
                 "hover:border-input-border-success-hover",
                 "focus:border-input-border-success-focus"
             ],
             warning: [
                 "border-(length:--border-width-validation)",
-                "border-input-border-warning",
+                "border-input-border-warning-base",
                 "hover:border-input-border-warning-hover",
                 "focus:border-input-border-warning-focus"
             ]
         },
         withButtonInside: {
             false: "",
-            right: "pe-with-button",
-            left: "ps-with-button"
+            right: "pe-input-with-button",
+            left: "ps-input-with-button"
         },
         hideSearchClear: {
             true: "[&::-ms-clear]:hidden [&::-webkit-search-cancel-button]:hidden"

package/dist/atoms/numeric-input.js

@@ -19,9 +19,9 @@ const numericInputVariants = tv({
             "data-disabled:bg-numeric-input-bg-disabled",
             "data-disabled:border-numeric-input-border-disabled",
             "data-disabled:text-numeric-input-fg-disabled",
-            "data-invalid:bg-numeric-input-invalid-bg",
+            "data-invalid:bg-numeric-input-bg-invalid",
             "data-invalid:border-(length:--border-width-validation)",
-            "data-invalid:border-numeric-input-invalid-border",
+            "data-invalid:border-numeric-input-border-invalid",
             "text-numeric-input-fg",
             "has-[input:not(:disabled):hover]:bg-numeric-input-input-bg-hover",
             "has-[input:focus]:bg-numeric-input-input-bg-focus",
@@ -57,19 +57,19 @@ const numericInputVariants = tv({
     variants: {
         size: {
             sm: {
-                root: "gap-numeric-input-root-sm text-numeric-input-sm",
+                root: "gap-numeric-input-sm text-numeric-input-sm",
                 container: "h-form-control-sm rounded-numeric-input-sm",
                 trigger: "text-numeric-input-sm",
                 input: "pl-numeric-input-input-sm text-numeric-input-sm"
             },
             md: {
-                root: "gap-numeric-input-root-md text-numeric-input-md",
+                root: "gap-numeric-input-md text-numeric-input-md",
                 container: "h-form-control-md rounded-numeric-input-md",
                 trigger: "text-numeric-input-md",
                 input: "pl-numeric-input-input-md text-numeric-input-md"
             },
             lg: {
-                root: "gap-numeric-input-root-lg text-numeric-input-lg",
+                root: "gap-numeric-input-lg text-numeric-input-lg",
                 container: "h-form-control-lg rounded-numeric-input-lg",
                 trigger: "text-numeric-input-lg",
                 input: "pl-numeric-input-input-lg text-numeric-input-lg"

package/dist/atoms/rating.js

@@ -21,7 +21,7 @@ const rating = tv({
         item: [
             "cursor-pointer transition-colors duration-200",
             "cursor-pointer transition-colors duration-200 motion-reduce:transition-none",
-            "text-rating-fg",
+            "text-rating-fg-base",
             "data-highlighted:text-rating-fg-active",
             "data-disabled:cursor-not-allowed",
             "data-disabled:data-highlighted:text-rating-fg-disabled",

package/dist/atoms/status-text.js

@@ -11,24 +11,24 @@ const statusTextVariants = tv({
             error: "text-status-text-fg-error",
             success: "text-status-text-fg-success",
             warning: "text-status-text-fg-warning",
-            default: "text-status-text-fg-default"
+            default: "text-status-text-fg"
         },
         align: {
             start: {
-                icon: "mt-status-text-icon-long-text self-start"
+                icon: "mt-status-text-icon-offset-long-text self-start"
             },
             center: {}
         },
         size: {
             sm: {
-                base: "gap-status-text-icon-gap-sm text-status-text-sm"
+                base: "gap-status-text-sm text-status-text-sm"
             },
             md: {
-                base: "gap-status-text-icon-gap-md text-status-text-md"
+                base: "gap-status-text-md text-status-text-md"
             },
             lg: {
-                base: "items-start gap-status-text-icon-gap-lg text-status-text-lg",
-                icon: "mt-status-text-icon"
+                base: "items-start gap-status-text-lg text-status-text-lg",
+                icon: "mt-status-text-icon-offset"
             }
         }
     },

package/dist/atoms/textarea.js

@@ -7,8 +7,8 @@ const textareaVariants = tv({
         "bg-textarea-bg",
         "text-textarea-fg",
         "placeholder:font-normal",
-        "placeholder:text-textarea-placeholder",
-        "border-(length:--border-textarea-width) border-textarea-border",
+        "placeholder:text-textarea-fg-placeholder",
+        "border-(length:--border-width-textarea) border-textarea-border",
         "rounded-textarea",
         "transition-all duration-200 motion-reduce:transition-none",
         "hover:border-textarea-border-hover hover:bg-textarea-bg-hover",
@@ -23,20 +23,20 @@ const textareaVariants = tv({
             default: "",
             error: [
                 "border-(length:--border-width-validation)",
-                "border-textarea-border-danger",
+                "border-textarea-border-danger-base",
                 "hover:border-textarea-border-danger-hover",
                 "focus:border-textarea-border-danger-focus",
                 "placeholder:text-textarea-placeholder-danger"
             ],
             success: [
                 "border-(length:--border-width-validation)",
-                "border-textarea-border-success",
+                "border-textarea-border-success-base",
                 "hover:border-textarea-border-success-hover",
                 "focus:border-textarea-border-success-focus"
             ],
             warning: [
                 "border-(length:--border-width-validation)",
-                "border-textarea-border-warning",
+                "border-textarea-border-warning-base",
                 "hover:border-textarea-border-warning-hover",
                 "focus:border-textarea-border-warning-focus"
             ],

package/dist/atoms/tooltip.js

@@ -12,7 +12,7 @@ const tooltipVariants = tv({
             "[--arrow-size:var(--tooltip-arrow-size)]",
             "[--arrow-background:var(--tooltip-arrow-background)]",
             "bg-tooltip-bg",
-            "rounded-tooltip shadow-tooltip"
+            "rounded-tooltip"
         ],
         positioner: [
             "relative"
@@ -23,8 +23,8 @@ const tooltipVariants = tv({
         variant: {
             default: {},
             outline: {
-                content: "border border-tooltip-border",
-                arrow: "border-tooltip-border border-s border-t"
+                content: "border border-tooltip-border-outline",
+                arrow: "border-tooltip-border-outline border-s border-t"
             }
         },
         size: {

package/dist/molecules/slider.js

@@ -114,23 +114,125 @@ const sliderVariants = tv({
         size: "md"
     }
 });
+const resolveFiniteNumber = (value, fallbackValue)=>{
+    if ("number" != typeof value || Number.isNaN(value) || !Number.isFinite(value)) return fallbackValue;
+    return value;
+};
+const clampNumber = (value, min, max)=>{
+    if (!Number.isFinite(value)) return min;
+    return Math.max(min, Math.min(max, value));
+};
+const countDecimals = (value)=>{
+    if (!Number.isFinite(value)) return 0;
+    const [, decimalPart = ""] = value.toString().split(".");
+    return decimalPart.length;
+};
+const roundToStepPrecision = (value, step)=>{
+    const precision = countDecimals(step);
+    if (precision <= 0) return Math.round(value);
+    return Number(value.toFixed(precision));
+};
+const snapToStep = (value, min, step)=>{
+    const snappedValue = Math.round((value - min) / step) * step + min;
+    return roundToStepPrecision(snappedValue, step);
+};
+const resolveThumbCount = (value, defaultValue)=>{
+    if (Array.isArray(value) && value.length > 0) return value.length;
+    if (Array.isArray(defaultValue) && defaultValue.length > 0) return defaultValue.length;
+    return 2;
+};
+const resolveSliderConfig = (min, max, step, minStepsBetweenThumbs, thumbCount)=>{
+    const resolvedMin = resolveFiniteNumber(min, 0);
+    const resolvedStepCandidate = resolveFiniteNumber(step, 1);
+    const resolvedStep = resolvedStepCandidate > 0 ? resolvedStepCandidate : 1;
+    const maxCandidate = resolveFiniteNumber(max, resolvedMin + resolvedStep);
+    const resolvedMax = maxCandidate > resolvedMin ? maxCandidate : resolvedMin + resolvedStep;
+    const span = resolvedMax - resolvedMin;
+    const stepsInSpan = Math.max(0, Math.floor((span + Number.EPSILON) / resolvedStep));
+    const maxMinStepsBetweenThumbs = thumbCount > 1 ? Math.floor(stepsInSpan / (thumbCount - 1)) : 0;
+    const normalizedMinSteps = Math.trunc(resolveFiniteNumber(minStepsBetweenThumbs, 0));
+    const resolvedMinStepsBetweenThumbs = clampNumber(normalizedMinSteps, 0, maxMinStepsBetweenThumbs);
+    return {
+        min: resolvedMin,
+        max: resolvedMax,
+        step: resolvedStep,
+        minStepsBetweenThumbs: resolvedMinStepsBetweenThumbs
+    };
+};
+const createFallbackValues = (thumbCount, min, max)=>{
+    if (thumbCount <= 1) return [
+        min
+    ];
+    if (2 === thumbCount) return [
+        min,
+        max
+    ];
+    const span = max - min;
+    return Array.from({
+        length: thumbCount
+    }, (_, index)=>{
+        const ratio = index / (thumbCount - 1);
+        return min + span * ratio;
+    });
+};
+const normalizeSliderValues = (values, fallbackValues, config)=>{
+    const sourceValues = Array.isArray(values) && values.length > 0 ? values : fallbackValues;
+    const normalizedValues = sourceValues.slice(0, fallbackValues.length).map((rawValue, index)=>{
+        const fallbackValue = fallbackValues[index] ?? config.min;
+        const safeValue = resolveFiniteNumber(rawValue, fallbackValue);
+        const snappedValue = snapToStep(safeValue, config.min, config.step);
+        return clampNumber(snappedValue, config.min, config.max);
+    });
+    while(normalizedValues.length < fallbackValues.length)normalizedValues.push(fallbackValues[normalizedValues.length] ?? config.min);
+    normalizedValues.sort((left, right)=>left - right);
+    const gap = config.minStepsBetweenThumbs * config.step;
+    for(let index = 0; index < normalizedValues.length; index += 1){
+        const currentValue = normalizedValues[index] ?? config.min;
+        const minAllowed = 0 === index ? config.min : (normalizedValues[index - 1] ?? config.min) + gap;
+        normalizedValues[index] = Math.max(currentValue, minAllowed);
+    }
+    for(let index = normalizedValues.length - 1; index >= 0; index -= 1){
+        const currentValue = normalizedValues[index] ?? config.max;
+        const maxAllowed = index === normalizedValues.length - 1 ? config.max : (normalizedValues[index + 1] ?? config.max) - gap;
+        normalizedValues[index] = Math.min(currentValue, maxAllowed);
+    }
+    return normalizedValues.map((rawValue, index)=>{
+        const minAllowed = 0 === index ? config.min : (normalizedValues[index - 1] ?? config.min) + gap;
+        const maxAllowed = index === normalizedValues.length - 1 ? config.max : (normalizedValues[index + 1] ?? config.max) - gap;
+        const safeValue = rawValue ?? fallbackValues[index] ?? config.min;
+        const snappedValue = snapToStep(safeValue, config.min, config.step);
+        return clampNumber(snappedValue, minAllowed, maxAllowed);
+    });
+};
+const apiValueFallback = (value, defaultValue, fallbackValues)=>{
+    if (Array.isArray(value) && value.length > 0) return value;
+    if (Array.isArray(defaultValue) && defaultValue.length > 0) return defaultValue;
+    return fallbackValues;
+};
 function Slider({ id, name, label, validateStatus, helpText, showHelpTextIcon = true, value, origin, thumbAlignment = "center", defaultValue = [
     25,
     75
 ], min = 0, max = 100, step = 1, minStepsBetweenThumbs = 0, disabled = false, readOnly = false, dir = "ltr", orientation = "horizontal", size = "md", showMarkers = false, markerCount = 5, showValueText = false, formatRangeText, formatValue = (val)=>val.toString(), className, onChange, onChangeEnd }) {
     const generatedId = useId();
     const uniqueId = id || generatedId;
+    const thumbCount = resolveThumbCount(value, defaultValue);
+    const resolvedConfig = resolveSliderConfig(min, max, step, minStepsBetweenThumbs, thumbCount);
+    const fallbackValues = createFallbackValues(thumbCount, resolvedConfig.min, resolvedConfig.max);
+    const isControlled = void 0 !== value;
+    const resolvedValue = isControlled ? normalizeSliderValues(value, fallbackValues, resolvedConfig) : void 0;
+    const resolvedDefaultValue = isControlled ? void 0 : normalizeSliderValues(defaultValue, fallbackValues, resolvedConfig);
+    const valueTextValues = apiValueFallback(resolvedValue, resolvedDefaultValue, fallbackValues);
     const service = useMachine(machine, {
         id: uniqueId,
         name,
-        value,
-        defaultValue,
-        min,
-        max,
+        value: resolvedValue,
+        defaultValue: resolvedDefaultValue,
+        min: resolvedConfig.min,
+        max: resolvedConfig.max,
         origin,
         thumbAlignment,
-        step,
-        minStepsBetweenThumbs,
+        step: resolvedConfig.step,
+        minStepsBetweenThumbs: resolvedConfig.minStepsBetweenThumbs,
         disabled,
         readOnly,
         dir,
@@ -162,7 +264,7 @@ function Slider({ id, name, label, validateStatus, helpText, showHelpTextIcon =
                         ...api.getValueTextProps(),
                         children: [
                             /*#__PURE__*/ jsx("b", {
-                                children: formatRangeText ? formatRangeText(api.value || defaultValue) : api.value && 2 === api.value.length && void 0 !== api.value[0] && void 0 !== api.value[1] ? `${formatValue(api.value[0])} - ${formatValue(api.value[1])}` : ""
+                                children: formatRangeText ? formatRangeText(api.value || valueTextValues) : api.value && 2 === api.value.length && void 0 !== api.value[0] && void 0 !== api.value[1] ? `${formatValue(api.value[0])} - ${formatValue(api.value[1])}` : ""
                             }),
                             " "
                         ]
@@ -189,7 +291,7 @@ function Slider({ id, name, label, validateStatus, helpText, showHelpTextIcon =
                                 children: Array.from({
                                     length: markerCount
                                 }).map((_, index)=>{
-                                    const markerValue = 1 === markerCount ? min : min + (max - min) / (markerCount - 1) * index;
+                                    const markerValue = 1 === markerCount ? resolvedConfig.min : resolvedConfig.min + (resolvedConfig.max - resolvedConfig.min) / (markerCount - 1) * index;
                                     return /*#__PURE__*/ jsxs("div", {
                                         className: marker(),
                                         ...api.getMarkerProps({

package/dist/molecules/tabs.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { normalizeProps, useMachine } from "@zag-js/react";
+import { mergeProps, normalizeProps, useMachine } from "@zag-js/react";
 import { connect, machine } from "@zag-js/tabs";
 import { createContext, useContext, useId } from "react";
 import { Button } from "../atoms/button.js";
@@ -167,21 +167,22 @@ Tabs.List = function({ children, ref, className, ...props }) {
         children: children
     });
 };
-Tabs.Trigger = function({ value, disabled, children, ref, className, ...props }) {
+Tabs.Trigger = function({ value, disabled, children, ref, className, size = "current", theme = "unstyled", type = "button", ...props }) {
     const { api, styles } = useTabsContext();
+    const triggerProps = mergeProps(props, api.getTriggerProps({
+        value,
+        disabled
+    }));
     return /*#__PURE__*/ jsx(Button, {
+        ...triggerProps,
         className: styles.trigger({
             className
         }),
-        ref: ref,
-        theme: "borderless",
-        type: "button",
-        ...api.getTriggerProps({
-            value,
-            disabled
-        }),
         "data-disabled": disabled || void 0,
-        ...props,
+        ref: ref,
+        size: size,
+        theme: theme,
+        type: type,
         children: children
     });
 };

package/dist/src/atoms/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/atoms/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAE5C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qDA+OzB,CAAA;AAEF,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,EAC/D,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC/B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,SAAS,CAAA;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,KAAK,EACL,IAAI,EACJ,KAAK,EACL,SAAS,EACT,WAAW,EACX,IAAI,EACJ,YAAqB,EACrB,QAAQ,EACR,SAAiB,EACjB,QAAQ,EACR,SAAS,EACT,QAAQ,EAAE,YAAY,EACtB,GAAG,KAAK,EACT,EAAE,WAAW,GAAG;IAAE,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAA;CAAE,2CA8BhD"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/atoms/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAE5C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qDA+OzB,CAAA;AAEF,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,EAC/D,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC/B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,SAAS,CAAA;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,KAAK,EACL,IAAI,EACJ,KAAK,EACL,SAAS,EACT,WAAW,EACX,IAAI,EACJ,YAAqB,EACrB,QAAQ,EACR,SAAiB,EACjB,QAAQ,EACR,SAAS,EACT,QAAQ,EAAE,YAAY,EACtB,GAAG,KAAK,EACT,EAAE,WAAW,GAAG;IAAE,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAA;CAAE,2CAkChD"}

package/dist/src/atoms/link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/atoms/link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC7E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAGrD,QAAA,MAAM,YAAY,gLAIhB,CAAA;AAEF,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,YAAY,CAAC;IACtE,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,eACf,SAAQ,aAAa,EACnB,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,MAAM,aAAa,CAAC;IAC1D,EAAE,CAAC,EAAE,KAAK,CAAA;CACX;AAED,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,WAAW,GAAG,GAAG,IAAI,aAAa,GAChE,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,aAAa,CAAC,GAAG;IACvD,EAAE,CAAC,EAAE,CAAC,CAAA;CACP,CAAA;AAEH,wBAAgB,IAAI,CAAC,CAAC,SAAS,WAAW,GAAG,GAAG,EAAE,EAChD,EAAE,EACF,QAAQ,EACR,QAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,CAAC,CAAC,2CAsBd"}
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/atoms/link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC7E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAGrD,QAAA,MAAM,YAAY,gLAIhB,CAAA;AAEF,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,YAAY,CAAC;IACtE,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,eACf,SAAQ,aAAa,EACnB,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,MAAM,aAAa,CAAC;IAC1D,EAAE,CAAC,EAAE,KAAK,CAAA;CACX;AAED,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,WAAW,GAAG,GAAG,IAAI,aAAa,GAChE,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,aAAa,CAAC,GAAG;IACvD,EAAE,CAAC,EAAE,CAAC,CAAA;CACP,CAAA;AAEH,wBAAgB,IAAI,CAAC,CAAC,SAAS,WAAW,GAAG,GAAG,EAAE,EAChD,EAAE,EACF,QAAQ,EACR,QAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,CAAC,CAAC,2CAqBd"}

package/dist/src/atoms/status-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"status-text.d.ts","sourceRoot":"","sources":["../../../src/atoms/status-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAE5C,QAAA,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAqCtB,CAAA;AASF,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,cAAc,CAAC,GAC1D,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAC1C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAA;IACzB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,QAAgB,EAChB,MAAkB,EAClB,IAAW,EACX,KAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,2CA0BjB"}
+{"version":3,"file":"status-text.d.ts","sourceRoot":"","sources":["../../../src/atoms/status-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAE5C,QAAA,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAqCtB,CAAA;AASF,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,cAAc,CAAC,GAC1D,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IACxC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAA;IACzB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAEH,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,QAAgB,EAChB,MAAkB,EAClB,IAAW,EACX,KAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,2CA0BjB"}

package/dist/src/molecules/slider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../src/molecules/slider.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAKrD,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CA2FlB,CAAA;AAEF,MAAM,WAAW,WAAY,SAAQ,YAAY,CAAC,OAAO,cAAc,CAAC;IACtE,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,cAAc,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAA;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;IACnB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACnC,cAAc,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IACrC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,MAAM,CAAA;IAC9C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACvC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACrC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CACzC;AAED,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,cAAc,EACd,QAAQ,EACR,gBAAuB,EACvB,KAAK,EACL,MAAM,EACN,cAAyB,EACzB,YAAuB,EACvB,GAAO,EACP,GAAS,EACT,IAAQ,EACR,qBAAyB,EACzB,QAAgB,EAChB,QAAgB,EAChB,GAAW,EACX,WAA0B,EAC1B,IAAW,EACX,WAAmB,EACnB,WAAe,EACf,aAAqB,EACrB,eAAe,EACf,WAA6C,EAC7C,SAAS,EACT,QAAQ,EACR,WAAW,GACZ,EAAE,WAAW,2CAkIb"}
+{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../src/molecules/slider.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAKrD,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CA2FlB,CAAA;AAEF,MAAM,WAAW,WAAY,SAAQ,YAAY,CAAC,OAAO,cAAc,CAAC;IACtE,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,cAAc,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAA;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;IACnB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACnC,cAAc,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IACrC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,MAAM,CAAA;IAC9C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACvC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACrC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CACzC;AAqMD,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,cAAc,EACd,QAAQ,EACR,gBAAuB,EACvB,KAAK,EACL,MAAM,EACN,cAAyB,EACzB,YAAuB,EACvB,GAAO,EACP,GAAS,EACT,IAAQ,EACR,qBAAyB,EACzB,QAAgB,EAChB,QAAgB,EAChB,GAAW,EACX,WAA0B,EAC1B,IAAW,EACX,WAAmB,EACnB,WAAe,EACf,aAAqB,EACrB,eAAe,EACf,WAA6C,EAC7C,SAAS,EACT,QAAQ,EACR,WAAW,GACZ,EAAE,WAAW,2CA8Jb"}

package/dist/src/molecules/tabs.d.ts

@@ -1,5 +1,6 @@
 import { type ComponentPropsWithoutRef, type Ref } from "react";
 import type { VariantProps } from "tailwind-variants";
+import { type ButtonProps } from "../atoms/button";
 declare const tabsVariants: import("tailwind-variants").TVReturnType<{
     variant: {
         default: {
@@ -183,7 +184,7 @@ export interface TabsProps extends VariantProps<typeof tabsVariants>, Omit<Compo
 export declare function Tabs({ id, defaultValue, value, orientation, dir, activationMode, loopFocus, onValueChange, variant, size, fitted, justify, children, ref, className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Tabs {
     var List: ({ children, ref, className, ...props }: TabsListProps) => import("react/jsx-runtime").JSX.Element;
-    var Trigger: ({ value, disabled, children, ref, className, ...props }: TabsTriggerProps) => import("react/jsx-runtime").JSX.Element;
+    var Trigger: ({ value, disabled, children, ref, className, size, theme, type, ...props }: TabsTriggerProps) => import("react/jsx-runtime").JSX.Element;
     var Content: ({ value, children, ref, className, ...props }: TabsContentProps) => import("react/jsx-runtime").JSX.Element;
     var Indicator: ({ ref, className, ...props }: TabsIndicatorProps) => import("react/jsx-runtime").JSX.Element;
     var displayName: string;
@@ -191,11 +192,10 @@ export declare namespace Tabs {
 interface TabsListProps extends ComponentPropsWithoutRef<"div"> {
     ref?: Ref<HTMLDivElement>;
 }
-interface TabsTriggerProps extends ComponentPropsWithoutRef<"button"> {
+type TabsTriggerProps = Omit<ButtonProps, "value"> & {
     value: string;
-    disabled?: boolean;
     ref?: Ref<HTMLButtonElement>;
-}
+};
 interface TabsContentProps extends ComponentPropsWithoutRef<"div"> {
     value: string;
     ref?: Ref<HTMLDivElement>;