@itcase/ui 1.8.36 → 1.8.38

package/dist/{Avatar_cjs_DBoMi2WA.js → Avatar_cjs_nMPCDjk8.js}

@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Tooltip = require('./Tooltip_cjs_oS1iOamX.js');
+var Tooltip = require('./Tooltip_cjs_DHduWa-v.js');
 var Image = require('./Image_cjs_CCWqbNn4.js');
 var Text = require('./Text_cjs_C9fOm0nd.js');
 

package/dist/{Avatar_es_DHREqfOD.js → Avatar_es_B73a6TzA.js}

@@ -3,7 +3,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { I as Icon, B as Badge } from './Tooltip_es_LV5ZNg3B.js';
+import { I as Icon, B as Badge } from './Tooltip_es_ltCY-w4M.js';
 import { I as Image } from './Image_es_DZUVp0FS.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
 

package/dist/{Button_cjs_djJUZATX.js → Button_cjs_plv5-qcj.js}

@@ -4,7 +4,7 @@ var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var Tooltip = require('./Tooltip_cjs_oS1iOamX.js');
+var Tooltip = require('./Tooltip_cjs_DHduWa-v.js');
 var Link = require('./Link_cjs_DbRGq2Yk.js');
 var Loader = require('./Loader_cjs_Ca4i0sER.js');
 var Text = require('./Text_cjs_C9fOm0nd.js');
@@ -302,6 +302,15 @@ var buttonAppearanceSurface = {
         iconFillIcon: 'surfaceItemPrimary',
         loaderAppearance: 'surfacePrimary',
     },
+    surfaceQuaternary: {
+        fill: 'surfaceTertiary',
+        fillHover: 'surfaceTertiaryHover',
+        labelTextColor: 'surfaceTextPrimary',
+        iconAfterFillIcon: 'surfaceItemPrimary',
+        iconBeforeFillIcon: 'surfaceItemPrimary',
+        iconFillIcon: 'surfaceItemPrimary',
+        loaderAppearance: 'surfacePrimary',
+    },
 };
 
 var buttonAppearanceWarning = {

package/dist/{Button_es_X1DzVhok.js → Button_es_BigB2Wz6.js}

@@ -2,7 +2,7 @@ import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import clsx from 'clsx';
-import { I as Icon } from './Tooltip_es_LV5ZNg3B.js';
+import { I as Icon } from './Tooltip_es_ltCY-w4M.js';
 import { a as LinkWrapper } from './Link_es_DxtZLeKY.js';
 import { L as Loader } from './Loader_es_GYOr0UTX.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
@@ -300,6 +300,15 @@ var buttonAppearanceSurface = {
         iconFillIcon: 'surfaceItemPrimary',
         loaderAppearance: 'surfacePrimary',
     },
+    surfaceQuaternary: {
+        fill: 'surfaceTertiary',
+        fillHover: 'surfaceTertiaryHover',
+        labelTextColor: 'surfaceTextPrimary',
+        iconAfterFillIcon: 'surfaceItemPrimary',
+        iconBeforeFillIcon: 'surfaceItemPrimary',
+        iconFillIcon: 'surfaceItemPrimary',
+        loaderAppearance: 'surfacePrimary',
+    },
 };
 
 var buttonAppearanceWarning = {

package/dist/{ChipsGroup_cjs_5xsEchPo.js → ChipsGroup_cjs_DrOhD-Fc.js}

@@ -6,7 +6,7 @@ var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var React = require('react');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Tooltip = require('./Tooltip_cjs_oS1iOamX.js');
+var Tooltip = require('./Tooltip_cjs_DHduWa-v.js');
 var Text = require('./Text_cjs_C9fOm0nd.js');
 
 var chipsAppearanceAccent = {
@@ -180,9 +180,7 @@ var chipsAppearanceStyle = {
     outlined: {
         fill: 'none',
     },
-    full: {
-        borderColor: 'none',
-    },
+    full: {},
     ghost: {
         fill: 'none',
         borderColor: 'none',

package/dist/{ChipsGroup_es_4TOkv-fm.js → ChipsGroup_es_B9m4l0wN.js}

@@ -4,7 +4,7 @@ import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { useMemo } from 'react';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { I as Icon, B as Badge } from './Tooltip_es_LV5ZNg3B.js';
+import { I as Icon, B as Badge } from './Tooltip_es_ltCY-w4M.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
 
 var chipsAppearanceAccent = {
@@ -178,9 +178,7 @@ var chipsAppearanceStyle = {
     outlined: {
         fill: 'none',
     },
-    full: {
-        borderColor: 'none',
-    },
+    full: {},
     ghost: {
         fill: 'none',
         borderColor: 'none',

package/dist/{DatePicker_cjs_DffhgUnQ.js → DatePicker_cjs_DKoF73mp.js}

@@ -8,10 +8,10 @@ var locale = require('date-fns/locale');
 var DatePicker = require('react-datepicker');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Button = require('./Button_cjs_djJUZATX.js');
-var Tooltip = require('./Tooltip_cjs_oS1iOamX.js');
+var Button = require('./Button_cjs_plv5-qcj.js');
+var Tooltip = require('./Tooltip_cjs_DHduWa-v.js');
 var Input = require('./Input_cjs_CPmXkQGd.js');
-var Label = require('./Label_cjs_C88e2CIP.js');
+var Label = require('./Label_cjs_BGJfyrOL.js');
 var Text = require('./Text_cjs_C9fOm0nd.js');
 var _default = require('@itcase/icons/default');
 
@@ -100,35 +100,35 @@ function DatePickerInput(props) {
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(datePickerProps, appearanceConfig);
     var daySize = propsGenerator.daySize, dayTextColor = propsGenerator.dayTextColor, dayTextShape = propsGenerator.dayTextShape, dayTextSize = propsGenerator.dayTextSize, iconFill = propsGenerator.iconFill, iconFillHover = propsGenerator.iconFillHover, iconFillSize = propsGenerator.iconFillSize, iconItemFill = propsGenerator.iconItemFill, iconLeft = propsGenerator.iconLeft, iconRight = propsGenerator.iconRight, iconShape = propsGenerator.iconShape, monthTextColor = propsGenerator.monthTextColor, monthTextSize = propsGenerator.monthTextSize, monthTextWeight = propsGenerator.monthTextWeight, popper = propsGenerator.popper, popperPlacement = propsGenerator.popperPlacement, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, yearTextColor = propsGenerator.yearTextColor, yearTextSize = propsGenerator.yearTextSize, yearTextWeight = propsGenerator.yearTextWeight, isClearable = propsGenerator.isClearable;
     var _d = React.useMemo(function () {
-        var startDate;
+        var dateStart;
         if (value) {
             if (typeof value === 'string') {
-                startDate = new Date(value);
+                dateStart = new Date(value);
             }
             else {
-                startDate = value;
+                dateStart = value;
             }
         }
         else {
-            startDate = undefined;
+            dateStart = undefined;
         }
-        var endDate;
+        var dateEnd;
         if (endValue) {
             if (typeof endValue === 'string') {
-                endDate = new Date(endValue);
+                dateEnd = new Date(endValue);
             }
             else {
-                endDate = endValue;
+                dateEnd = endValue;
             }
         }
         else {
-            endDate = undefined;
+            dateEnd = undefined;
         }
-        return [startDate, endDate];
-    }, [value, endValue]), startDate = _d[0], endDate = _d[1];
-    var handleChange = React.useCallback(function (_a) {
-        var newStartDate = _a[0], newEndDate = _a[1];
-        onChange(newStartDate, newEndDate);
+        return [dateStart, dateEnd];
+    }, [value, endValue]), dateStart = _d[0], dateEnd = _d[1];
+    var handleChange = React.useCallback(function (valuesList) {
+        var newDateStart = valuesList[0], newDateEnd = valuesList[1];
+        onChange(newDateStart, newDateEnd);
     }, [onChange]);
     var renderDayContents = React.useCallback(function (day, date) {
         return (jsxRuntime.jsx(Button.Button, { className: "react-datepicker__day-button", size: daySize, label: date.getDate().toString(), labelTextColor: dayTextColor, labelTextSize: dayTextSize, shape: dayTextShape }));
@@ -152,7 +152,7 @@ function DatePickerInput(props) {
         yearTextWeight,
     ]);
     var datePickerStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && "datepicker_size_".concat(sizeClass), widthClass && "datepicker_width_".concat(widthClass)), style: datePickerStyles, children: jsxRuntime.jsx(DatePicker, tslib_es6.__assign({ minDate: disablePastDays ? new Date() : undefined, customInput: jsxRuntime.jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? endDate : undefined, locale: locale.ru, popperClassName: popper && "react-datepicker-popper-".concat(popper), popperPlacement: popperPlacement, ref: datepickerRef, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: startDate, startDate: startDate, onChange: selectsRange ? handleChange : onChange }, datePickerProps, { 
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && "datepicker_size_".concat(sizeClass), widthClass && "datepicker_width_".concat(widthClass)), style: datePickerStyles, children: jsxRuntime.jsx(DatePicker, tslib_es6.__assign({ minDate: disablePastDays ? new Date() : undefined, customInput: jsxRuntime.jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: locale.ru, popperClassName: popper && "react-datepicker-popper-".concat(popper), popperPlacement: popperPlacement, ref: datepickerRef, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: selectsRange ? handleChange : onChange }, datePickerProps, { 
             // Important for use custom clear button
             isClearable: false })) }));
 }

package/dist/{DatePicker_es_GmkagjKf.js → DatePicker_es_CdEYxtwj.js}

@@ -6,10 +6,10 @@ import { ru } from 'date-fns/locale';
 import DatePicker from 'react-datepicker';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { B as Button } from './Button_es_X1DzVhok.js';
-import { I as Icon } from './Tooltip_es_LV5ZNg3B.js';
+import { B as Button } from './Button_es_BigB2Wz6.js';
+import { I as Icon } from './Tooltip_es_ltCY-w4M.js';
 import { I as Input } from './Input_es_D9Y1Rj5Y.js';
-import { L as Label } from './Label_es_Bn2aRjLl.js';
+import { L as Label } from './Label_es_C4Px7b-N.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
 import { icons14 } from '@itcase/icons/default';
 
@@ -98,35 +98,35 @@ function DatePickerInput(props) {
     var propsGenerator = useDevicePropsGenerator(datePickerProps, appearanceConfig);
     var daySize = propsGenerator.daySize, dayTextColor = propsGenerator.dayTextColor, dayTextShape = propsGenerator.dayTextShape, dayTextSize = propsGenerator.dayTextSize, iconFill = propsGenerator.iconFill, iconFillHover = propsGenerator.iconFillHover, iconFillSize = propsGenerator.iconFillSize, iconItemFill = propsGenerator.iconItemFill, iconLeft = propsGenerator.iconLeft, iconRight = propsGenerator.iconRight, iconShape = propsGenerator.iconShape, monthTextColor = propsGenerator.monthTextColor, monthTextSize = propsGenerator.monthTextSize, monthTextWeight = propsGenerator.monthTextWeight, popper = propsGenerator.popper, popperPlacement = propsGenerator.popperPlacement, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, yearTextColor = propsGenerator.yearTextColor, yearTextSize = propsGenerator.yearTextSize, yearTextWeight = propsGenerator.yearTextWeight, isClearable = propsGenerator.isClearable;
     var _d = useMemo(function () {
-        var startDate;
+        var dateStart;
         if (value) {
             if (typeof value === 'string') {
-                startDate = new Date(value);
+                dateStart = new Date(value);
             }
             else {
-                startDate = value;
+                dateStart = value;
             }
         }
         else {
-            startDate = undefined;
+            dateStart = undefined;
         }
-        var endDate;
+        var dateEnd;
         if (endValue) {
             if (typeof endValue === 'string') {
-                endDate = new Date(endValue);
+                dateEnd = new Date(endValue);
             }
             else {
-                endDate = endValue;
+                dateEnd = endValue;
             }
         }
         else {
-            endDate = undefined;
+            dateEnd = undefined;
         }
-        return [startDate, endDate];
-    }, [value, endValue]), startDate = _d[0], endDate = _d[1];
-    var handleChange = useCallback(function (_a) {
-        var newStartDate = _a[0], newEndDate = _a[1];
-        onChange(newStartDate, newEndDate);
+        return [dateStart, dateEnd];
+    }, [value, endValue]), dateStart = _d[0], dateEnd = _d[1];
+    var handleChange = useCallback(function (valuesList) {
+        var newDateStart = valuesList[0], newDateEnd = valuesList[1];
+        onChange(newDateStart, newDateEnd);
     }, [onChange]);
     var renderDayContents = useCallback(function (day, date) {
         return (jsx(Button, { className: "react-datepicker__day-button", size: daySize, label: date.getDate().toString(), labelTextColor: dayTextColor, labelTextSize: dayTextSize, shape: dayTextShape }));
@@ -150,7 +150,7 @@ function DatePickerInput(props) {
         yearTextWeight,
     ]);
     var datePickerStyles = useStyles(props).styles;
-    return (jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && "datepicker_size_".concat(sizeClass), widthClass && "datepicker_width_".concat(widthClass)), style: datePickerStyles, children: jsx(DatePicker, __assign({ minDate: disablePastDays ? new Date() : undefined, customInput: jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? endDate : undefined, locale: ru, popperClassName: popper && "react-datepicker-popper-".concat(popper), popperPlacement: popperPlacement, ref: datepickerRef, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: startDate, startDate: startDate, onChange: selectsRange ? handleChange : onChange }, datePickerProps, { 
+    return (jsx("div", { className: clsx(className, 'datepicker', monthsShown && 'datepicker_multiple-months', customTimeInput && 'datepicker_button', sizeClass && "datepicker_size_".concat(sizeClass), widthClass && "datepicker_width_".concat(widthClass)), style: datePickerStyles, children: jsx(DatePicker, __assign({ minDate: disablePastDays ? new Date() : undefined, customInput: jsx(DatePickerCustomInput, { datepickerRef: datepickerRef, inputProps: inputProps, isClearable: isClearable }), endDate: selectsRange ? dateEnd : undefined, locale: ru, popperClassName: popper && "react-datepicker-popper-".concat(popper), popperPlacement: popperPlacement, ref: datepickerRef, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: dateStart, startDate: dateStart, onChange: selectsRange ? handleChange : onChange }, datePickerProps, { 
             // Important for use custom clear button
             isClearable: false })) }));
 }

package/dist/{DropdownItem_cjs_DxBpJAi9.js → DropdownItem_cjs_DQvByLbN.js}

@@ -7,7 +7,7 @@ var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDe
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
 var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var Divider = require('./Divider_cjs_BmCJj3TN.js');
-var Tooltip = require('./Tooltip_cjs_oS1iOamX.js');
+var Tooltip = require('./Tooltip_cjs_DHduWa-v.js');
 var Text = require('./Text_cjs_C9fOm0nd.js');
 
 function Dropdown(props) {

package/dist/{DropdownItem_es_Loneq6M7.js → DropdownItem_es_KppIfto7.js}

@@ -5,7 +5,7 @@ import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevi
 import { useStyles } from './hooks/useStyles/useStyles.js';
 import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { D as Divider } from './Divider_es_kY-30pft.js';
-import { I as Icon } from './Tooltip_es_LV5ZNg3B.js';
+import { I as Icon } from './Tooltip_es_ltCY-w4M.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
 
 function Dropdown(props) {

package/dist/{Label_cjs_C88e2CIP.js → Label_cjs_BGJfyrOL.js}

@@ -6,16 +6,16 @@ var React = require('react');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Tooltip = require('./Tooltip_cjs_oS1iOamX.js');
+var Tooltip = require('./Tooltip_cjs_DHduWa-v.js');
 var Text = require('./Text_cjs_C9fOm0nd.js');
 
 var labelAppearanceAccent = {
     accentMutedPrimary: {
-        fill: 'accentMutedPrimary',
-        labelTextColor: 'accentMutedTextQuaternary',
-        borderColor: 'accentMutedBorderSecondary',
-        iconAfterFillIcon: 'accentMutedItemQuaternary',
-        iconBeforeFillIcon: 'accentMutedItemQuaternary',
+        fill: 'accentTertiary',
+        labelTextColor: 'accentTextQuaternary',
+        borderColor: 'accentBorderSecondary',
+        iconAfterFillIcon: 'accentItemQuaternary',
+        iconBeforeFillIcon: 'accentItemQuaternary',
     },
     accentPrimary: {
         fill: 'accentPrimary',
@@ -32,11 +32,11 @@ var labelAppearanceAccent = {
 
 var labelAppearanceDanger = {
     dangerMutedPrimary: {
-        fill: 'dangerMutedPrimary',
-        labelTextColor: 'dangerMutedTextQuaternary',
-        borderColor: 'dangerMutedBorderQuaternary',
-        iconAfterFillIcon: 'dangerMutedItemQuaternary',
-        iconBeforeFillIcon: 'dangerMutedItemQuaternary',
+        fill: 'dangerTertiary',
+        labelTextColor: 'dangerTextQuaternary',
+        borderColor: 'dangerBorderQuaternary',
+        iconAfterFillIcon: 'dangerItemQuaternary',
+        iconBeforeFillIcon: 'dangerItemQuaternary',
     },
     dangerPrimary: {
         fill: 'dangerPrimary',
@@ -49,7 +49,7 @@ var labelAppearanceDanger = {
 
 var labelAppearanceDisable = {
     disableMutedPrimary: {
-        fill: 'disableMutedPrimary',
+        fill: 'disableMuted',
         labelTextColor: 'disableMutedTextPrimary',
         borderColor: 'disableMutedBorderSecondary',
         iconAfterFillIcon: 'disableMutedItemPrimary',
@@ -66,11 +66,11 @@ var labelAppearanceDisable = {
 
 var labelAppearanceError = {
     errorMutedPrimary: {
-        fill: 'errorMutedPrimary',
-        labelTextColor: 'errorMutedTextQuaternary',
-        borderColor: 'errorMutedBorderSecondary',
-        iconAfterFillIcon: 'errorMutedItemQuaternary',
-        iconBeforeFillIcon: 'errorMutedItemQuaternary',
+        fill: 'errorDisabled',
+        labelTextColor: 'errorTextQuaternary',
+        borderColor: 'errorBorderSecondary',
+        iconAfterFillIcon: 'errorItemQuaternary',
+        iconBeforeFillIcon: 'errorItemQuaternary',
     },
     errorPrimary: {
         fill: 'errorPrimary',
@@ -84,7 +84,7 @@ var labelAppearanceError = {
 
 var labelAppearanceInfo = {
     infoMutedPrimary: {
-        fill: 'infoMutedPrimary',
+        fill: 'infoMuted',
         labelTextColor: 'infoMutedTextPrimary',
         borderColor: 'infoMutedBorderSecondary',
         iconAfterFillIcon: 'infoMutedItemPrimary',
@@ -108,28 +108,29 @@ var labelAppearanceInfo = {
 
 var labelAppearancePrimary = {
     primaryMutedPrimary: {
-        fill: 'primaryMutedPrimary',
-        labelTextColor: 'primaryMutedTextSecondary',
-        borderColor: 'primaryMutedBorderTertiary',
-        iconAfterFillIcon: 'primaryMutedItemSecondary',
-        iconBeforeFillIcon: 'primaryMutedItemSecondary',
+        fill: 'primaryDisabled',
+        labelTextColor: 'primaryTextSecondary',
+        labelTextColorHover: 'primaryTextSecondary',
+        borderColor: 'primaryBorderTertiary',
+        iconAfterFillIcon: 'primaryItemSecondary',
+        iconBeforeFillIcon: 'primaryItemSecondary',
     },
     primaryPrimary: {
-        fill: 'primaryPrimary',
-        labelTextColor: 'primaryTextPrimary',
-        borderColor: 'primaryBorderSecondary',
-        iconAfterFillIcon: 'dangerItemPrimary',
-        iconBeforeFillIcon: 'dangerItemPrimary',
+        fill: 'primaryDisabled',
+        labelTextColor: 'primaryTextSecondary',
+        borderColor: 'primaryBorderTertiary',
+        iconAfterFillIcon: 'primaryItemSecondary',
+        iconBeforeFillIcon: 'primaryItemSecondary',
     },
 };
 
 var labelAppearanceSecondary = {
     secondaryMutedPrimary: {
-        fill: 'secondaryMutedPrimary',
-        labelTextColor: 'secondaryMutedTextQuaternary',
-        borderColor: 'secondaryMutedBorderDisabled',
-        iconAfterFillIcon: 'secondaryMutedItemQuaternary',
-        iconBeforeFillIcon: 'secondaryMutedItemQuaternary',
+        fill: 'secondaryDisabled',
+        labelTextColor: 'secondaryTextQuaternary',
+        borderColor: 'secondaryBorderDisabled',
+        iconAfterFillIcon: 'secondaryItemQuaternary',
+        iconBeforeFillIcon: 'secondaryItemQuaternary',
     },
     secondaryPrimary: {
         fill: 'secondaryPrimary',
@@ -215,11 +216,11 @@ var labelAppearanceStyle = {
 
 var labelAppearanceSuccess = {
     successMutedPrimary: {
-        fill: 'successMutedPrimary',
-        labelTextColor: 'successMutedTextPrimary',
-        borderColor: 'successMutedBorderSecondary',
-        iconAfterFillIcon: 'successMutedItemPrimary',
-        iconBeforeFillIcon: 'successMutedItemPrimary',
+        fill: 'successTertiary',
+        labelTextColor: 'successTextQuaternary',
+        borderColor: 'successBorderQuaternary',
+        iconAfterFillIcon: 'successItemQuaternary',
+        iconBeforeFillIcon: 'successItemQuaternary',
     },
     successPrimary: {
         fill: 'successPrimary',
@@ -233,11 +234,12 @@ var labelAppearanceSuccess = {
 
 var labelAppearanceSurface = {
     surfaceMutedPrimary: {
-        fill: 'surfaceMutedPrimary',
-        labelTextColor: 'surfaceMutedTextQuaternary',
-        borderColor: 'surfaceMutedBorderQuaternary',
-        iconAfterFillIcon: 'surfaceMutedItemQuaternary',
-        iconBeforeFillIcon: 'surfaceMutedItemQuaternary',
+        fill: 'surfaceSecondary',
+        labelTextColor: 'surfaceTextQuaternary',
+        labelTextColorHover: 'surfaceTextQuaternary',
+        borderColor: 'surfaceBorderQuaternary',
+        iconAfterFillIcon: 'surfaceItemQuaternary',
+        iconBeforeFillIcon: 'surfaceItemQuaternary',
     },
     surfacePrimary: {
         fill: 'surfacePrimary',
@@ -262,11 +264,11 @@ var labelAppearanceSurface = {
 
 var labelAppearanceWarning = {
     warningMutedPrimary: {
-        fill: 'warningMutedPrimary',
-        labelTextColor: 'warningMutedTextSecondary',
-        borderColor: 'warningMutedBorderSecondary',
-        iconAfterFillIcon: 'warningMutedItemSecondary',
-        iconBeforeFillIcon: 'warningMutedItemSecondary',
+        fill: 'warningTertiary',
+        labelTextColor: 'warningTextSecondary',
+        borderColor: 'warningBorderSecondary',
+        iconAfterFillIcon: 'warningItemSecondary',
+        iconBeforeFillIcon: 'warningItemSecondary',
     },
     warningPrimary: {
         fill: 'warningPrimary',

package/dist/{Label_es_Bn2aRjLl.js → Label_es_C4Px7b-N.js}

@@ -4,16 +4,16 @@ import { useRef, useCallback } from 'react';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { I as Icon, T as Tooltip } from './Tooltip_es_LV5ZNg3B.js';
+import { I as Icon, T as Tooltip } from './Tooltip_es_ltCY-w4M.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
 
 var labelAppearanceAccent = {
     accentMutedPrimary: {
-        fill: 'accentMutedPrimary',
-        labelTextColor: 'accentMutedTextQuaternary',
-        borderColor: 'accentMutedBorderSecondary',
-        iconAfterFillIcon: 'accentMutedItemQuaternary',
-        iconBeforeFillIcon: 'accentMutedItemQuaternary',
+        fill: 'accentTertiary',
+        labelTextColor: 'accentTextQuaternary',
+        borderColor: 'accentBorderSecondary',
+        iconAfterFillIcon: 'accentItemQuaternary',
+        iconBeforeFillIcon: 'accentItemQuaternary',
     },
     accentPrimary: {
         fill: 'accentPrimary',
@@ -30,11 +30,11 @@ var labelAppearanceAccent = {
 
 var labelAppearanceDanger = {
     dangerMutedPrimary: {
-        fill: 'dangerMutedPrimary',
-        labelTextColor: 'dangerMutedTextQuaternary',
-        borderColor: 'dangerMutedBorderQuaternary',
-        iconAfterFillIcon: 'dangerMutedItemQuaternary',
-        iconBeforeFillIcon: 'dangerMutedItemQuaternary',
+        fill: 'dangerTertiary',
+        labelTextColor: 'dangerTextQuaternary',
+        borderColor: 'dangerBorderQuaternary',
+        iconAfterFillIcon: 'dangerItemQuaternary',
+        iconBeforeFillIcon: 'dangerItemQuaternary',
     },
     dangerPrimary: {
         fill: 'dangerPrimary',
@@ -47,7 +47,7 @@ var labelAppearanceDanger = {
 
 var labelAppearanceDisable = {
     disableMutedPrimary: {
-        fill: 'disableMutedPrimary',
+        fill: 'disableMuted',
         labelTextColor: 'disableMutedTextPrimary',
         borderColor: 'disableMutedBorderSecondary',
         iconAfterFillIcon: 'disableMutedItemPrimary',
@@ -64,11 +64,11 @@ var labelAppearanceDisable = {
 
 var labelAppearanceError = {
     errorMutedPrimary: {
-        fill: 'errorMutedPrimary',
-        labelTextColor: 'errorMutedTextQuaternary',
-        borderColor: 'errorMutedBorderSecondary',
-        iconAfterFillIcon: 'errorMutedItemQuaternary',
-        iconBeforeFillIcon: 'errorMutedItemQuaternary',
+        fill: 'errorDisabled',
+        labelTextColor: 'errorTextQuaternary',
+        borderColor: 'errorBorderSecondary',
+        iconAfterFillIcon: 'errorItemQuaternary',
+        iconBeforeFillIcon: 'errorItemQuaternary',
     },
     errorPrimary: {
         fill: 'errorPrimary',
@@ -82,7 +82,7 @@ var labelAppearanceError = {
 
 var labelAppearanceInfo = {
     infoMutedPrimary: {
-        fill: 'infoMutedPrimary',
+        fill: 'infoMuted',
         labelTextColor: 'infoMutedTextPrimary',
         borderColor: 'infoMutedBorderSecondary',
         iconAfterFillIcon: 'infoMutedItemPrimary',
@@ -106,28 +106,29 @@ var labelAppearanceInfo = {
 
 var labelAppearancePrimary = {
     primaryMutedPrimary: {
-        fill: 'primaryMutedPrimary',
-        labelTextColor: 'primaryMutedTextSecondary',
-        borderColor: 'primaryMutedBorderTertiary',
-        iconAfterFillIcon: 'primaryMutedItemSecondary',
-        iconBeforeFillIcon: 'primaryMutedItemSecondary',
+        fill: 'primaryDisabled',
+        labelTextColor: 'primaryTextSecondary',
+        labelTextColorHover: 'primaryTextSecondary',
+        borderColor: 'primaryBorderTertiary',
+        iconAfterFillIcon: 'primaryItemSecondary',
+        iconBeforeFillIcon: 'primaryItemSecondary',
     },
     primaryPrimary: {
-        fill: 'primaryPrimary',
-        labelTextColor: 'primaryTextPrimary',
-        borderColor: 'primaryBorderSecondary',
-        iconAfterFillIcon: 'dangerItemPrimary',
-        iconBeforeFillIcon: 'dangerItemPrimary',
+        fill: 'primaryDisabled',
+        labelTextColor: 'primaryTextSecondary',
+        borderColor: 'primaryBorderTertiary',
+        iconAfterFillIcon: 'primaryItemSecondary',
+        iconBeforeFillIcon: 'primaryItemSecondary',
     },
 };
 
 var labelAppearanceSecondary = {
     secondaryMutedPrimary: {
-        fill: 'secondaryMutedPrimary',
-        labelTextColor: 'secondaryMutedTextQuaternary',
-        borderColor: 'secondaryMutedBorderDisabled',
-        iconAfterFillIcon: 'secondaryMutedItemQuaternary',
-        iconBeforeFillIcon: 'secondaryMutedItemQuaternary',
+        fill: 'secondaryDisabled',
+        labelTextColor: 'secondaryTextQuaternary',
+        borderColor: 'secondaryBorderDisabled',
+        iconAfterFillIcon: 'secondaryItemQuaternary',
+        iconBeforeFillIcon: 'secondaryItemQuaternary',
     },
     secondaryPrimary: {
         fill: 'secondaryPrimary',
@@ -213,11 +214,11 @@ var labelAppearanceStyle = {
 
 var labelAppearanceSuccess = {
     successMutedPrimary: {
-        fill: 'successMutedPrimary',
-        labelTextColor: 'successMutedTextPrimary',
-        borderColor: 'successMutedBorderSecondary',
-        iconAfterFillIcon: 'successMutedItemPrimary',
-        iconBeforeFillIcon: 'successMutedItemPrimary',
+        fill: 'successTertiary',
+        labelTextColor: 'successTextQuaternary',
+        borderColor: 'successBorderQuaternary',
+        iconAfterFillIcon: 'successItemQuaternary',
+        iconBeforeFillIcon: 'successItemQuaternary',
     },
     successPrimary: {
         fill: 'successPrimary',
@@ -231,11 +232,12 @@ var labelAppearanceSuccess = {
 
 var labelAppearanceSurface = {
     surfaceMutedPrimary: {
-        fill: 'surfaceMutedPrimary',
-        labelTextColor: 'surfaceMutedTextQuaternary',
-        borderColor: 'surfaceMutedBorderQuaternary',
-        iconAfterFillIcon: 'surfaceMutedItemQuaternary',
-        iconBeforeFillIcon: 'surfaceMutedItemQuaternary',
+        fill: 'surfaceSecondary',
+        labelTextColor: 'surfaceTextQuaternary',
+        labelTextColorHover: 'surfaceTextQuaternary',
+        borderColor: 'surfaceBorderQuaternary',
+        iconAfterFillIcon: 'surfaceItemQuaternary',
+        iconBeforeFillIcon: 'surfaceItemQuaternary',
     },
     surfacePrimary: {
         fill: 'surfacePrimary',
@@ -260,11 +262,11 @@ var labelAppearanceSurface = {
 
 var labelAppearanceWarning = {
     warningMutedPrimary: {
-        fill: 'warningMutedPrimary',
-        labelTextColor: 'warningMutedTextSecondary',
-        borderColor: 'warningMutedBorderSecondary',
-        iconAfterFillIcon: 'warningMutedItemSecondary',
-        iconBeforeFillIcon: 'warningMutedItemSecondary',
+        fill: 'warningTertiary',
+        labelTextColor: 'warningTextSecondary',
+        borderColor: 'warningBorderSecondary',
+        iconAfterFillIcon: 'warningItemSecondary',
+        iconBeforeFillIcon: 'warningItemSecondary',
     },
     warningPrimary: {
         fill: 'warningPrimary',