@itcase/ui 1.8.35 → 1.8.36

package/dist/{Label_es_DFSiy5sL.js → Label_es_Bn2aRjLl.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_B0nm9irO.js';
+import { I as Icon, T as Tooltip } from './Tooltip_es_LV5ZNg3B.js';
 import { T as Text } from './Text_es_BfLRfj-5.js';
 
 var labelAppearanceAccent = {
     accentMutedPrimary: {
-        fill: 'accentTertiary',
-        labelTextColor: 'accentTextQuaternary',
-        borderColor: 'accentBorderSecondary',
-        iconAfterFillIcon: 'accentItemQuaternary',
-        iconBeforeFillIcon: 'accentItemQuaternary',
+        fill: 'accentMutedPrimary',
+        labelTextColor: 'accentMutedTextQuaternary',
+        borderColor: 'accentMutedBorderSecondary',
+        iconAfterFillIcon: 'accentMutedItemQuaternary',
+        iconBeforeFillIcon: 'accentMutedItemQuaternary',
     },
     accentPrimary: {
         fill: 'accentPrimary',
@@ -30,11 +30,11 @@ var labelAppearanceAccent = {
 
 var labelAppearanceDanger = {
     dangerMutedPrimary: {
-        fill: 'dangerTertiary',
-        labelTextColor: 'dangerTextQuaternary',
-        borderColor: 'dangerBorderQuaternary',
-        iconAfterFillIcon: 'dangerItemQuaternary',
-        iconBeforeFillIcon: 'dangerItemQuaternary',
+        fill: 'dangerMutedPrimary',
+        labelTextColor: 'dangerMutedTextQuaternary',
+        borderColor: 'dangerMutedBorderQuaternary',
+        iconAfterFillIcon: 'dangerMutedItemQuaternary',
+        iconBeforeFillIcon: 'dangerMutedItemQuaternary',
     },
     dangerPrimary: {
         fill: 'dangerPrimary',
@@ -46,6 +46,13 @@ var labelAppearanceDanger = {
 };
 
 var labelAppearanceDisable = {
+    disableMutedPrimary: {
+        fill: 'disableMutedPrimary',
+        labelTextColor: 'disableMutedTextPrimary',
+        borderColor: 'disableMutedBorderSecondary',
+        iconAfterFillIcon: 'disableMutedItemPrimary',
+        iconBeforeFillIcon: 'disableMutedItemPrimary',
+    },
     disablePrimary: {
         fill: 'disablePrimary',
         labelTextColor: 'disableTextPrimary',
@@ -53,22 +60,15 @@ var labelAppearanceDisable = {
         iconAfterFillIcon: 'disableItemPrimary',
         iconBeforeFillIcon: 'disableItemPrimary',
     },
-    disableMuted: {
-        fill: 'disableMuted',
-        labelTextColor: 'disableMutedTextPrimary',
-        borderColor: 'disableMutedBorderSecondary',
-        iconAfterFillIcon: 'disableMutedItemPrimary',
-        iconBeforeFillIcon: 'disableMutedItemPrimary',
-    },
 };
 
 var labelAppearanceError = {
     errorMutedPrimary: {
-        fill: 'errorDisabled',
-        labelTextColor: 'errorTextQuaternary',
-        borderColor: 'errorBorderSecondary',
-        iconAfterFillIcon: 'errorItemQuaternary',
-        iconBeforeFillIcon: 'errorItemQuaternary',
+        fill: 'errorMutedPrimary',
+        labelTextColor: 'errorMutedTextQuaternary',
+        borderColor: 'errorMutedBorderSecondary',
+        iconAfterFillIcon: 'errorMutedItemQuaternary',
+        iconBeforeFillIcon: 'errorMutedItemQuaternary',
     },
     errorPrimary: {
         fill: 'errorPrimary',
@@ -82,7 +82,7 @@ var labelAppearanceError = {
 
 var labelAppearanceInfo = {
     infoMutedPrimary: {
-        fill: 'infoMuted',
+        fill: 'infoMutedPrimary',
         labelTextColor: 'infoMutedTextPrimary',
         borderColor: 'infoMutedBorderSecondary',
         iconAfterFillIcon: 'infoMutedItemPrimary',
@@ -106,11 +106,11 @@ var labelAppearanceInfo = {
 
 var labelAppearancePrimary = {
     primaryMutedPrimary: {
-        fill: 'primaryDisabled',
-        labelTextColor: 'primaryTextSecondary',
-        borderColor: 'primaryBorderTertiary',
-        iconAfterFillIcon: 'primaryItemSecondary',
-        iconBeforeFillIcon: 'primaryItemSecondary',
+        fill: 'primaryMutedPrimary',
+        labelTextColor: 'primaryMutedTextSecondary',
+        borderColor: 'primaryMutedBorderTertiary',
+        iconAfterFillIcon: 'primaryMutedItemSecondary',
+        iconBeforeFillIcon: 'primaryMutedItemSecondary',
     },
     primaryPrimary: {
         fill: 'primaryPrimary',
@@ -123,11 +123,11 @@ var labelAppearancePrimary = {
 
 var labelAppearanceSecondary = {
     secondaryMutedPrimary: {
-        fill: 'secondaryDisabled',
-        labelTextColor: 'secondaryTextQuaternary',
-        borderColor: 'secondaryBorderDisabled',
-        iconAfterFillIcon: 'secondaryItemQuaternary',
-        iconBeforeFillIcon: 'secondaryItemQuaternary',
+        fill: 'secondaryMutedPrimary',
+        labelTextColor: 'secondaryMutedTextQuaternary',
+        borderColor: 'secondaryMutedBorderDisabled',
+        iconAfterFillIcon: 'secondaryMutedItemQuaternary',
+        iconBeforeFillIcon: 'secondaryMutedItemQuaternary',
     },
     secondaryPrimary: {
         fill: 'secondaryPrimary',
@@ -213,11 +213,11 @@ var labelAppearanceStyle = {
 
 var labelAppearanceSuccess = {
     successMutedPrimary: {
-        fill: 'successTertiary',
-        labelTextColor: 'successTextQuaternary',
-        borderColor: 'successBorderQuaternary',
-        iconAfterFillIcon: 'successItemQuaternary',
-        iconBeforeFillIcon: 'successItemQuaternary',
+        fill: 'successMutedPrimary',
+        labelTextColor: 'successMutedTextPrimary',
+        borderColor: 'successMutedBorderSecondary',
+        iconAfterFillIcon: 'successMutedItemPrimary',
+        iconBeforeFillIcon: 'successMutedItemPrimary',
     },
     successPrimary: {
         fill: 'successPrimary',
@@ -231,11 +231,11 @@ var labelAppearanceSuccess = {
 
 var labelAppearanceSurface = {
     surfaceMutedPrimary: {
-        fill: 'surfaceSecondary',
-        labelTextColor: 'surfaceTextQuaternary',
-        borderColor: 'surfaceBorderQuaternary',
-        iconAfterFillIcon: 'surfaceItemQuaternary',
-        iconBeforeFillIcon: 'surfaceItemQuaternary',
+        fill: 'surfaceMutedPrimary',
+        labelTextColor: 'surfaceMutedTextQuaternary',
+        borderColor: 'surfaceMutedBorderQuaternary',
+        iconAfterFillIcon: 'surfaceMutedItemQuaternary',
+        iconBeforeFillIcon: 'surfaceMutedItemQuaternary',
     },
     surfacePrimary: {
         fill: 'surfacePrimary',
@@ -260,11 +260,11 @@ var labelAppearanceSurface = {
 
 var labelAppearanceWarning = {
     warningMutedPrimary: {
-        fill: 'warningTertiary',
-        labelTextColor: 'warningTextSecondary',
-        borderColor: 'warningBorderSecondary',
-        iconAfterFillIcon: 'warningItemSecondary',
-        iconBeforeFillIcon: 'warningItemSecondary',
+        fill: 'warningMutedPrimary',
+        labelTextColor: 'warningMutedTextSecondary',
+        borderColor: 'warningMutedBorderSecondary',
+        iconAfterFillIcon: 'warningMutedItemSecondary',
+        iconBeforeFillIcon: 'warningMutedItemSecondary',
     },
     warningPrimary: {
         fill: 'warningPrimary',

package/dist/{Loader_cjs_CCrbD8Em.js → Loader_cjs_Ca4i0sER.js}

@@ -105,10 +105,12 @@ function Loader(props) {
         return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = loaderConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var fillClass = propsGenerator.fillClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, heightClass = propsGenerator.heightClass, itemFillClass = propsGenerator.itemFillClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
+    var fillClass = propsGenerator.fillClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, heightClass = propsGenerator.heightClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, itemFillClass = propsGenerator.itemFillClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var loader = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs("div", { className: clsx('loader', className, widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), sizeClass && "loader_size_".concat(sizeClass), isSkeleton && "loader_skeleton", type && "loader_type_".concat(type), shapeClass && "loader_shape_".concat(shapeClass)), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
+    return (jsxRuntime.jsxs("div", { className: clsx('loader', className, widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), sizeClass && "loader_size_".concat(sizeClass), isSkeleton && "loader_skeleton", type && "loader_type_".concat(type), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
+            ? "shape-strength_".concat(shapeStrengthClass)
+            : shapeClass === 'rounded' && 'shape-strength_default'), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
 }
 
 exports.Loader = Loader;

package/dist/{Loader_es_B2auu_rc.js → Loader_es_GYOr0UTX.js}

@@ -103,10 +103,12 @@ function Loader(props) {
         return (__assign(__assign({}, resultConfig), (_a = loaderConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var fillClass = propsGenerator.fillClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, heightClass = propsGenerator.heightClass, itemFillClass = propsGenerator.itemFillClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
+    var fillClass = propsGenerator.fillClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, heightClass = propsGenerator.heightClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, itemFillClass = propsGenerator.itemFillClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var loader = useStyles(props).styles;
-    return (jsxs("div", { className: clsx('loader', className, widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), sizeClass && "loader_size_".concat(sizeClass), isSkeleton && "loader_skeleton", type && "loader_type_".concat(type), shapeClass && "loader_shape_".concat(shapeClass)), style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
+    return (jsxs("div", { className: clsx('loader', className, widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), sizeClass && "loader_size_".concat(sizeClass), isSkeleton && "loader_skeleton", type && "loader_type_".concat(type), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
+            ? "shape-strength_".concat(shapeStrengthClass)
+            : shapeClass === 'rounded' && 'shape-strength_default'), style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
 }
 
 export { Loader as L, loaderAppearance as a, loaderConfig as l };

package/dist/{Tooltip_cjs_DinScDnC.js → Tooltip_cjs_oS1iOamX.js}

@@ -1067,10 +1067,12 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
         return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = tooltipConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignmentClass = propsGenerator.alignmentClass, alignPosition = propsGenerator.alignPosition, fillClass = propsGenerator.fillClass, titleSize = propsGenerator.titleSize, titleTextColor = propsGenerator.titleTextColor, titleTextWeight = propsGenerator.titleTextWeight, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWeight = propsGenerator.textWeight, arrowPosition = propsGenerator.arrowPosition, elevationClass = propsGenerator.elevationClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
+    var alignClass = propsGenerator.alignClass, centeringClass = propsGenerator.centeringClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignmentClass = propsGenerator.alignmentClass, alignPosition = propsGenerator.alignPosition, fillClass = propsGenerator.fillClass, titleSize = propsGenerator.titleSize, titleTextColor = propsGenerator.titleTextColor, titleTextWeight = propsGenerator.titleTextWeight, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWeight = propsGenerator.textWeight, arrowPosition = propsGenerator.arrowPosition, elevationClass = propsGenerator.elevationClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var tooltipStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible ? 'tooltip_state_open' : 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), elevationClass && "elevation_".concat(elevationClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "tooltip_size_".concat(sizeClass), isSkeleton && 'tooltip_skeleton', widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [jsxRuntime.jsx("div", { className: clsx('tooltip__arrow', arrowPosition && "tooltip__arrow_position_".concat(arrowPosition), fillClass && "fill_".concat(fillClass)), children: "\u00A0" }), before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title, { className: "tooltip__title text", size: titleSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "tooltip__text", size: textSize, textColor: textColor, textWeight: textWeight, children: text })), children] }), after] }));
+    return (jsxRuntime.jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible ? 'tooltip_state_open' : 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), elevationClass && "elevation_".concat(elevationClass), centeringClass && "centering_".concat(centeringClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
+            ? "shape-strength_".concat(shapeStrengthClass)
+            : shapeClass === 'rounded' && 'shape-strength_default', alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "tooltip_size_".concat(sizeClass), isSkeleton && 'tooltip_skeleton', widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [jsxRuntime.jsx("div", { className: clsx('tooltip__arrow', arrowPosition && "tooltip__arrow_position_".concat(arrowPosition), fillClass && "fill_".concat(fillClass)), children: "\u00A0" }), before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title, { className: "tooltip__title text", size: titleSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "tooltip__text", size: textSize, textColor: textColor, textWeight: textWeight, children: text })), children] }), after] }));
 });
 
 exports.Badge = Badge;

package/dist/{Tooltip_es_B0nm9irO.js → Tooltip_es_LV5ZNg3B.js}

@@ -1065,10 +1065,12 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
         return (__assign(__assign({}, resultConfig), (_a = tooltipConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignmentClass = propsGenerator.alignmentClass, alignPosition = propsGenerator.alignPosition, fillClass = propsGenerator.fillClass, titleSize = propsGenerator.titleSize, titleTextColor = propsGenerator.titleTextColor, titleTextWeight = propsGenerator.titleTextWeight, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWeight = propsGenerator.textWeight, arrowPosition = propsGenerator.arrowPosition, elevationClass = propsGenerator.elevationClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
+    var alignClass = propsGenerator.alignClass, centeringClass = propsGenerator.centeringClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignmentClass = propsGenerator.alignmentClass, alignPosition = propsGenerator.alignPosition, fillClass = propsGenerator.fillClass, titleSize = propsGenerator.titleSize, titleTextColor = propsGenerator.titleTextColor, titleTextWeight = propsGenerator.titleTextWeight, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWeight = propsGenerator.textWeight, arrowPosition = propsGenerator.arrowPosition, elevationClass = propsGenerator.elevationClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var tooltipStyles = useStyles(props).styles;
-    return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible ? 'tooltip_state_open' : 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), elevationClass && "elevation_".concat(elevationClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "tooltip_size_".concat(sizeClass), isSkeleton && 'tooltip_skeleton', widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [jsx("div", { className: clsx('tooltip__arrow', arrowPosition && "tooltip__arrow_position_".concat(arrowPosition), fillClass && "fill_".concat(fillClass)), children: "\u00A0" }), before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title text", size: titleSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize, textColor: textColor, textWeight: textWeight, children: text })), children] }), after] }));
+    return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible ? 'tooltip_state_open' : 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), elevationClass && "elevation_".concat(elevationClass), centeringClass && "centering_".concat(centeringClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
+            ? "shape-strength_".concat(shapeStrengthClass)
+            : shapeClass === 'rounded' && 'shape-strength_default', alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "tooltip_size_".concat(sizeClass), isSkeleton && 'tooltip_skeleton', widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [jsx("div", { className: clsx('tooltip__arrow', arrowPosition && "tooltip__arrow_position_".concat(arrowPosition), fillClass && "fill_".concat(fillClass)), children: "\u00A0" }), before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title text", size: titleSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize, textColor: textColor, textWeight: textWeight, children: text })), children] }), after] }));
 });
 
 export { Badge as B, Icon as I, Tooltip as T, tooltipAppearance as a, Title as b, titleConfig as c, titleAppearance as d, iconAppearance as e, badgeAppearance as f, badgeConfig as g, iconConfig as i, tooltipConfig as t };

package/dist/cjs/components/Accordion.js

@@ -7,7 +7,7 @@ var clsx = require('clsx');
 var castArray = require('lodash/castArray');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Tooltip = require('../../Tooltip_cjs_DinScDnC.js');
+var Tooltip = require('../../Tooltip_cjs_oS1iOamX.js');
 var Divider = require('../../Divider_cjs_BmCJj3TN.js');
 var Text = require('../../Text_cjs_C9fOm0nd.js');
 var _default = require('@itcase/icons/default');

package/dist/cjs/components/Avatar.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Avatar = require('../../Avatar_cjs_kADy_b4o.js');
+var Avatar = require('../../Avatar_cjs_DBoMi2WA.js');
 require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react/jsx-runtime');
 require('react');
@@ -16,7 +16,7 @@ require('../context/UIContext.js');
 require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
 require('../utils/setViewportProperty.js');
-require('../../Tooltip_cjs_DinScDnC.js');
+require('../../Tooltip_cjs_oS1iOamX.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');

package/dist/cjs/components/AvatarStack.js

@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Avatar = require('../../Avatar_cjs_kADy_b4o.js');
+var Avatar = require('../../Avatar_cjs_DBoMi2WA.js');
 var Group = require('../../Group_cjs_Cwt0gWk4.js');
 var Text = require('../../Text_cjs_C9fOm0nd.js');
 require('react');
@@ -21,7 +21,7 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
-require('../../Tooltip_cjs_DinScDnC.js');
+require('../../Tooltip_cjs_oS1iOamX.js');
 require('react-inlinesvg');
 require('../../Link_cjs_DbRGq2Yk.js');
 require('../../Image_cjs_CCWqbNn4.js');

package/dist/cjs/components/Badge.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Tooltip = require('../../Tooltip_cjs_DinScDnC.js');
+var Tooltip = require('../../Tooltip_cjs_oS1iOamX.js');
 require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react/jsx-runtime');
 require('react');

package/dist/cjs/components/Breadcrumbs/stories/__mock__.js

@@ -1,6 +1,7 @@
 'use strict';
 
-var _default = require('@itcase/icons/default');
+var tslib_es6 = require('../../../../tslib.es6_cjs_CCZ3TN_7.js');
+var am = require('@itcase/icons/am');
 
 var breadcrumbsListMock = {
     breadcrumbsList: [
@@ -9,37 +10,43 @@ var breadcrumbsListMock = {
             key: 1,
             text: 'Text 123',
             href: '/',
-            icon: _default.icons16.Placeholder.Default,
+            icon: am.icon24.ChevronRightSmall,
         },
         {
             id: '2',
             key: 2,
             text: 'Text 123',
             href: '/',
-            icon: _default.icons16.Placeholder.Default,
+            icon: am.icon24.ChevronRightSmall,
         },
         {
             id: '3',
             key: 3,
             text: 'Text 123',
             href: '/',
-            icon: _default.icons16.Placeholder.Default,
+            icon: am.icon24.ChevronRightSmall,
         },
         {
             id: '4',
             key: 4,
             text: 'Text 123',
             href: '/',
-            icon: _default.icons16.Placeholder.Default,
+            icon: am.icon24.ChevronRightSmall,
         },
         {
             id: '5',
             key: 5,
             text: 'Text 123',
             href: '/',
-            icon: _default.icons16.Placeholder.Default,
+            icon: am.icon24.ChevronRightSmall,
         },
     ],
 };
+var breadcrumbsListMockSize = {
+    xl: breadcrumbsListMock.breadcrumbsList.map(function (item) { return (tslib_es6.__assign(tslib_es6.__assign({}, item), { icon: am.icon24.ChevronRightSmall })); }),
+    l: breadcrumbsListMock.breadcrumbsList.map(function (item) { return (tslib_es6.__assign(tslib_es6.__assign({}, item), { icon: am.icon24.ChevronRightSmall })); }),
+    m: breadcrumbsListMock.breadcrumbsList.map(function (item) { return (tslib_es6.__assign({}, item)); }),
+};
 
 exports.breadcrumbsListMock = breadcrumbsListMock;
+exports.breadcrumbsListMockSize = breadcrumbsListMockSize;

package/dist/cjs/components/Breadcrumbs.js

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
 var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
-var Tooltip = require('../../Tooltip_cjs_DinScDnC.js');
+var Tooltip = require('../../Tooltip_cjs_oS1iOamX.js');
 var Link = require('../../Link_cjs_DbRGq2Yk.js');
 var Text = require('../../Text_cjs_C9fOm0nd.js');
 require('lodash/camelCase');
@@ -107,47 +107,47 @@ var breadcrumbsAppearanceSize = {
     sizeL: {
         size: 'l',
         labelTextSize: 'l',
-        iconFillSize: '24',
-        iconSize: '24',
+        iconFillSize: '20',
+        iconSize: '20',
     },
     sizeM: {
         size: 'm',
         labelTextSize: 'm',
-        iconFillSize: '24',
-        iconSize: '24',
+        iconFillSize: '16',
+        iconSize: '16',
     },
     sizeS: {
         size: 's',
         labelTextSize: 's',
-        iconFillSize: '20',
-        iconSize: '20',
+        iconFillSize: '16',
+        iconSize: '16',
     },
     sizeXS: {
         size: 'xs',
         labelTextSize: 'xs',
-        iconFillSize: '16',
-        iconSize: '16',
+        iconFillSize: '14',
+        iconSize: '14',
     },
     sizeXXS: {
         size: 'xxs',
         labelTextSize: 'xs',
-        iconFillSize: '14',
-        iconSize: '14',
+        iconFillSize: '12',
+        iconSize: '12',
     },
 };
 
 var breadcrumbsAppearanceStyle = {
-    full: {
+    solid: {
         borderColor: '0',
     },
-    ghost: {
+    outlined: {
         fill: 'none',
+    },
+    full: {
         borderColor: '0',
     },
-    outlined: {
+    ghost: {
         fill: 'none',
-    },
-    solid: {
         borderColor: '0',
     },
 };
@@ -215,7 +215,6 @@ function Breadcrumbs(props) {
     var className = props.className, breadcrumbsAppearance = props.breadcrumbsAppearance, breadcrumbsList = props.breadcrumbsList, children = props.children;
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     var _a = propsGenerator.directionClass, directionClass = _a === void 0 ? 'horizontal' : _a, fillClass = propsGenerator.fillClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
-    console.log(breadcrumbsAppearance);
     var breadcrumbsItemsList = React.useMemo(function () {
         if (breadcrumbsList) {
             return breadcrumbsList.map(function (item, i) { return (jsxRuntime.jsx(BreadcrumbsItem, { appearance: breadcrumbsAppearance, text: item.text, icon: item.icon, iconSrc: item.icon, isActive: i + 1 === breadcrumbsList.length && true }, "breadcrumbsItem_".concat(item.key || item.id || item.text))); });
@@ -224,7 +223,7 @@ function Breadcrumbs(props) {
             return children;
         }
         return [];
-    }, [children, breadcrumbsList]);
+    }, [children, breadcrumbsList, breadcrumbsAppearance]);
     var breadcrumbsStyles = useStyles.useStyles(props).styles;
     return (jsxRuntime.jsx("div", { className: clsx(className, 'breadcrumbs', widthClass && "width_".concat(widthClass), directionClass && "direction_".concat(directionClass), fillClass && "fill_".concat(fillClass), sizeClass && "size_".concat(sizeClass), shapeClass && "breadcrumbs_shape_".concat(shapeClass)), style: breadcrumbsStyles, children: breadcrumbsItemsList }));
 }

package/dist/cjs/components/Button.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var Button = require('../../Button_cjs_CW6ENTbm.js');
+var Button = require('../../Button_cjs_djJUZATX.js');
 require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
-require('../../Tooltip_cjs_DinScDnC.js');
+require('../../Tooltip_cjs_oS1iOamX.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -23,7 +23,7 @@ require('../hooks/useStyles/styleAttributes.js');
 require('../../Text_cjs_C9fOm0nd.js');
 require('react-inlinesvg');
 require('../../Link_cjs_DbRGq2Yk.js');
-require('../../Loader_cjs_CCrbD8Em.js');
+require('../../Loader_cjs_Ca4i0sER.js');
 
 
 

package/dist/cjs/components/Cell.js

@@ -5,8 +5,8 @@ var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Tooltip = require('../../Tooltip_cjs_DinScDnC.js');
-var Label = require('../../Label_cjs_CP4b6Mg2.js');
+var Tooltip = require('../../Tooltip_cjs_oS1iOamX.js');
+var Label = require('../../Label_cjs_C88e2CIP.js');
 var Text = require('../../Text_cjs_C9fOm0nd.js');
 require('react');
 require('lodash/camelCase');

package/dist/cjs/components/Chips/stories/__mock__.js

@@ -0,0 +1,31 @@
+'use strict';
+
+var am = require('@itcase/icons/am');
+
+var chipsListMock = {
+    chipsList: [
+        {
+            id: 1,
+            label: 'Chips 1',
+            isActive: true,
+        },
+        {
+            id: 2,
+            label: 'Chips 2',
+            isActive: false,
+        },
+        {
+            id: 3,
+            label: 'Chips 3',
+            isActive: false,
+        },
+        {
+            id: 4,
+            label: 'Chips 4',
+            iconAfter: am.icon24.Check,
+            isActive: false,
+        },
+    ],
+};
+
+exports.chipsListMock = chipsListMock;

package/dist/cjs/components/Chips.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var ChipsGroup = require('../../ChipsGroup_cjs_j3QOma3U.js');
-require('../../tslib.es6_cjs_CCZ3TN_7.js');
+var ChipsGroup = require('../../ChipsGroup_cjs_5xsEchPo.js');
 require('react/jsx-runtime');
-require('react');
 require('clsx');
+require('../../tslib.es6_cjs_CCZ3TN_7.js');
+require('react');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -19,7 +19,7 @@ require('../utils/setViewportProperty.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
-require('../../Tooltip_cjs_DinScDnC.js');
+require('../../Tooltip_cjs_oS1iOamX.js');
 require('../../Text_cjs_C9fOm0nd.js');
 require('react-inlinesvg');
 require('../../Link_cjs_DbRGq2Yk.js');

package/dist/cjs/components/Choice/stories/__mock__.js

@@ -9,32 +9,32 @@ var choiceListMock = {
     choices: [
         {
             label: 'Label 1',
-            iconAfter: _default.icons24.Placeholder,
-            iconBefore: _default.icons24.Placeholder,
+            iconAfter: _default.icons24.Placeholder.Default,
+            iconBefore: _default.icons24.Placeholder.Default,
             value: 1,
         },
         {
             label: 'Label 2',
-            iconAfter: _default.icons24.Placeholder,
-            iconBefore: _default.icons24.Placeholder,
+            iconAfter: _default.icons24.Placeholder.Default,
+            iconBefore: _default.icons24.Placeholder.Default,
             value: 2,
         },
         {
             label: 'Label 3',
-            iconAfter: _default.icons24.Placeholder,
-            iconBefore: _default.icons24.Placeholder,
+            iconAfter: _default.icons24.Placeholder.Default,
+            iconBefore: _default.icons24.Placeholder.Default,
             value: 3,
         },
         {
             label: 'Label 4',
-            iconAfter: _default.icons24.Placeholder,
-            iconBefore: _default.icons24.Placeholder,
+            iconAfter: _default.icons24.Placeholder.Default,
+            iconBefore: _default.icons24.Placeholder.Default,
             value: 4,
         },
         {
             label: 'Label 5',
-            iconAfter: _default.icons24.Placeholder,
-            iconBefore: _default.icons24.Placeholder,
+            iconAfter: _default.icons24.Placeholder.Default,
+            iconBefore: _default.icons24.Placeholder.Default,
             value: 5,
         },
     ],
@@ -45,23 +45,23 @@ var choiceListIconMock = {
     },
     choices: [
         {
-            icon: _default.icons24.Placeholder,
+            icon: _default.icons24.Placeholder.Default,
             value: 1,
         },
         {
-            icon: _default.icons24.Placeholder,
+            icon: _default.icons24.Placeholder.Default,
             value: 2,
         },
         {
-            icon: _default.icons24.Placeholder,
+            icon: _default.icons24.Placeholder.Default,
             value: 3,
         },
         {
-            icon: _default.icons24.Placeholder,
+            icon: _default.icons24.Placeholder.Default,
             value: 4,
         },
         {
-            icon: _default.icons24.Placeholder,
+            icon: _default.icons24.Placeholder.Default,
             value: 5,
         },
     ],