@itcase/ui 1.8.1 → 1.8.4

package/dist/{Label-DsNZ-asS.js → Label_cjs_BCjB-mxC.js}

@@ -1,13 +1,13 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+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 useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Text = require('./Text-DwIx33-P.js');
-var Tooltip = require('./Tooltip-hznDyLwa.js');
+var Text = require('./Text_cjs_D4xG0cKD.js');
+var Tooltip = require('./Tooltip_cjs_CTwksdFk.js');
 
 var labelAppearanceAccent = {
     accent: {
@@ -211,7 +211,7 @@ var labelConfig = {
     },
 };
 function Label(props) {
-    var className = props.className, type = props.type, appearance = props.appearance, label = props.label, labelTextWrap = props.labelTextWrap, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, tooltipAlignment = props.tooltipAlignment, tooltipAppearance = props.tooltipAppearance, tooltipArrowPosition = props.tooltipArrowPosition, tooltipContent = props.tooltipContent, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
+    var className = props.className, type = props.type, appearance = props.appearance, label = props.label, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
     var tooltipRef = React.useRef(null);
     var onMouseEnterLabel = React.useCallback(function () {
         var _a;
@@ -226,7 +226,7 @@ function Label(props) {
         return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
+    var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
     // @ts-expect-error
     var labelStyles = useStyles.useStyles(props).styles;
     return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), after] }));

package/dist/{Label-brG78nLi.js → Label_es_CZpanSdR.js}

@@ -1,11 +1,11 @@
-import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useRef, useCallback } from 'react';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { T as Text } from './Text-aaWArShm.js';
-import { T as Tooltip } from './Tooltip-DP32J5V6.js';
+import { T as Text } from './Text_es_FJGduy7Z.js';
+import { T as Tooltip } from './Tooltip_es_H976MIb7.js';
 
 var labelAppearanceAccent = {
     accent: {
@@ -209,7 +209,7 @@ var labelConfig = {
     },
 };
 function Label(props) {
-    var className = props.className, type = props.type, appearance = props.appearance, label = props.label, labelTextWrap = props.labelTextWrap, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, tooltipAlignment = props.tooltipAlignment, tooltipAppearance = props.tooltipAppearance, tooltipArrowPosition = props.tooltipArrowPosition, tooltipContent = props.tooltipContent, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
+    var className = props.className, type = props.type, appearance = props.appearance, label = props.label, cursor = props.cursor, dataTour = props.dataTour, mode = props.mode, showTooltip = props.showTooltip, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, children = props.children;
     var tooltipRef = useRef(null);
     var onMouseEnterLabel = useCallback(function () {
         var _a;
@@ -224,7 +224,7 @@ function Label(props) {
         return (__assign(__assign({}, resultConfig), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
+    var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
     // @ts-expect-error
     var labelStyles = useStyles(props).styles;
     return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), after] }));

package/dist/{Link-CZ8o5lGW.js → Link_cjs_yht44xJv.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');

package/dist/{Link-Cn7hiWmM.js → Link_es_DkW06IM-.js}

@@ -1,4 +1,4 @@
-import { b as __rest, _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { b as __rest, _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import clsx from 'clsx';

package/dist/{Loader-CjT6-r3I.js → Loader_cjs_D753D3li.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Text = require('./Text-DwIx33-P.js');
+var Text = require('./Text_cjs_D4xG0cKD.js');
 
 var loaderAppearanceAccent = {
     accentPrimary: {

package/dist/{Loader-Dquhwxz4.js → Loader_es_BE4nyzXi.js}

@@ -1,9 +1,9 @@
-import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { T as Text } from './Text-aaWArShm.js';
+import { T as Text } from './Text_es_FJGduy7Z.js';
 
 var loaderAppearanceAccent = {
     accentPrimary: {

package/dist/{Overlay-BoIJ-g58.js → Overlay_cjs_BTSfcGrM.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
@@ -24,7 +24,6 @@ function Overlay(props) {
     }, {});
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, fillGradientClass = propsGenerator.fillGradientClass, opacityClass = propsGenerator.opacityClass;
-    // @ts-expect-error
     var overlayStyles = useStyles.useStyles(props).styles;
     return (jsxRuntime.jsx("div", { className: clsx(className, 'overlay', opacityClass && "opacity_".concat(opacityClass), isOverlay && 'overlay_state_visible', type && "".concat(className, "_type_").concat(type), fillClass && "fill_".concat(fillClass), fillGradientClass && "fill-gradient_".concat(fillGradientClass)), "data-testid": dataTestId, "data-tour": dataTour, style: overlayStyles, onClick: onClick, children: "\u00A0" }));
 }

package/dist/{Overlay-Be9UCtR9.js → Overlay_es_CR7d-ISF.js}

@@ -1,4 +1,4 @@
-import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
@@ -22,7 +22,6 @@ function Overlay(props) {
     }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, fillGradientClass = propsGenerator.fillGradientClass, opacityClass = propsGenerator.opacityClass;
-    // @ts-expect-error
     var overlayStyles = useStyles(props).styles;
     return (jsx("div", { className: clsx(className, 'overlay', opacityClass && "opacity_".concat(opacityClass), isOverlay && 'overlay_state_visible', type && "".concat(className, "_type_").concat(type), fillClass && "fill_".concat(fillClass), fillGradientClass && "fill-gradient_".concat(fillGradientClass)), "data-testid": dataTestId, "data-tour": dataTour, style: overlayStyles, onClick: onClick, children: "\u00A0" }));
 }

package/dist/{Text-DwIx33-P.js → Text_cjs_D4xG0cKD.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
@@ -20,7 +20,7 @@ var textConfig = {
     },
 };
 function Text(props) {
-    var className = props.className, type = props.type, appearance = props.appearance, cursor = props.cursor, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, onClick = props.onClick, onDoubleClick = props.onDoubleClick, children = props.children;
+    var className = props.className, type = props.type, appearance = props.appearance, cursor = props.cursor, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, onDoubleClick = props.onDoubleClick, children = props.children;
     var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
         var _a;
         return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = textConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
@@ -29,7 +29,7 @@ function Text(props) {
     var textAlignClass = propsGenerator.textAlignClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorClass = propsGenerator.textColorClass, textColorGradientClass = propsGenerator.textColorGradientClass, textColorHoverClass = propsGenerator.textColorHoverClass, textStyleClass = propsGenerator.textStyleClass, textTruncateClass = propsGenerator.textTruncateClass, textWeightClass = propsGenerator.textWeightClass, textWrapClass = propsGenerator.textWrapClass, cursorClass = propsGenerator.cursorClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var textStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs(Tag, { className: clsx(className, 'text', sizeClass && "text_size_".concat(sizeClass), textWeightClass && "text-weight_".concat(textWeightClass), textAlignClass && "text-align_".concat(textAlignClass), textColorClass && "text-color_".concat(textColorClass), textColorActiveClass && "text-color_active_".concat(textColorActiveClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textColorGradientClass && "text-gradient_".concat(textColorGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWrapClass && "word-wrap_".concat(textWrapClass), textTruncateClass && "text-truncate_".concat(textTruncateClass), type && "text_type_".concat(type), mode && "text_mode_".concat(mode), widthClass && "width_".concat(widthClass), cursorClass && "cursor_".concat(cursorClass), onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
+    return (jsxRuntime.jsxs(Tag, { className: clsx(className, 'text', sizeClass && "text_size_".concat(sizeClass), textWeightClass && "text-weight_".concat(textWeightClass), textAlignClass && "text-align_".concat(textAlignClass), textColorClass && "text-color_".concat(textColorClass), textColorActiveClass && "text-color_active_".concat(textColorActiveClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textColorGradientClass && "text-gradient_".concat(textColorGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWrapClass && "word-wrap_".concat(textWrapClass), textTruncateClass && "text-truncate_".concat(textTruncateClass), type && "text_type_".concat(type), mode && "text_mode_".concat(mode), isSkeleton && 'text_skeleton', widthClass && "width_".concat(widthClass), cursorClass && "cursor_".concat(cursorClass), onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
 }
 
 exports.Text = Text;

package/dist/{Text-aaWArShm.js → Text_es_FJGduy7Z.js}

@@ -1,4 +1,4 @@
-import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
@@ -18,7 +18,7 @@ var textConfig = {
     },
 };
 function Text(props) {
-    var className = props.className, type = props.type, appearance = props.appearance, cursor = props.cursor, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, onClick = props.onClick, onDoubleClick = props.onDoubleClick, children = props.children;
+    var className = props.className, type = props.type, appearance = props.appearance, cursor = props.cursor, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a === void 0 ? 'span' : _a, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick, onDoubleClick = props.onDoubleClick, children = props.children;
     var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
         var _a;
         return (__assign(__assign({}, resultConfig), (_a = textConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
@@ -27,7 +27,7 @@ function Text(props) {
     var textAlignClass = propsGenerator.textAlignClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorClass = propsGenerator.textColorClass, textColorGradientClass = propsGenerator.textColorGradientClass, textColorHoverClass = propsGenerator.textColorHoverClass, textStyleClass = propsGenerator.textStyleClass, textTruncateClass = propsGenerator.textTruncateClass, textWeightClass = propsGenerator.textWeightClass, textWrapClass = propsGenerator.textWrapClass, cursorClass = propsGenerator.cursorClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var textStyles = useStyles(props).styles;
-    return (jsxs(Tag, { className: clsx(className, 'text', sizeClass && "text_size_".concat(sizeClass), textWeightClass && "text-weight_".concat(textWeightClass), textAlignClass && "text-align_".concat(textAlignClass), textColorClass && "text-color_".concat(textColorClass), textColorActiveClass && "text-color_active_".concat(textColorActiveClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textColorGradientClass && "text-gradient_".concat(textColorGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWrapClass && "word-wrap_".concat(textWrapClass), textTruncateClass && "text-truncate_".concat(textTruncateClass), type && "text_type_".concat(type), mode && "text_mode_".concat(mode), widthClass && "width_".concat(widthClass), cursorClass && "cursor_".concat(cursorClass), onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
+    return (jsxs(Tag, { className: clsx(className, 'text', sizeClass && "text_size_".concat(sizeClass), textWeightClass && "text-weight_".concat(textWeightClass), textAlignClass && "text-align_".concat(textAlignClass), textColorClass && "text-color_".concat(textColorClass), textColorActiveClass && "text-color_active_".concat(textColorActiveClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textColorGradientClass && "text-gradient_".concat(textColorGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWrapClass && "word-wrap_".concat(textWrapClass), textTruncateClass && "text-truncate_".concat(textTruncateClass), type && "text_type_".concat(type), mode && "text_mode_".concat(mode), isSkeleton && 'text_skeleton', widthClass && "width_".concat(widthClass), cursorClass && "cursor_".concat(cursorClass), onClick && (cursor || 'cursor_type_pointer')), "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before, children, after] }));
 }
 
 export { Text as T, textAppearance as a, textConfig as t };

package/dist/{Title-ByfOyy-n.js → Title_cjs_iuyln-ab.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');

package/dist/{Title--_epIXkC.js → Title_es_ke3YylFm.js}

@@ -1,4 +1,4 @@
-import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import clsx from 'clsx';

package/dist/{Tooltip-hznDyLwa.js → Tooltip_cjs_CTwksdFk.js}

@@ -1,13 +1,13 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
+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 useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Text = require('./Text-DwIx33-P.js');
-var Title = require('./Title-ByfOyy-n.js');
+var Text = require('./Text_cjs_D4xG0cKD.js');
+var Title = require('./Title_cjs_iuyln-ab.js');
 
 var tooltipAppearance = {
     surfacePrimary: {

package/dist/{Tooltip-DP32J5V6.js → Tooltip_es_H976MIb7.js}

@@ -1,11 +1,11 @@
-import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
+import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useRef, useState, useCallback, useImperativeHandle } from 'react';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from './hooks/useStyles/useStyles.js';
-import { T as Text } from './Text-aaWArShm.js';
-import { T as Title } from './Title--_epIXkC.js';
+import { T as Text } from './Text_es_FJGduy7Z.js';
+import { T as Title } from './Title_es_ke3YylFm.js';
 
 var tooltipAppearance = {
     surfacePrimary: {

package/dist/cjs/components/Accordion.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
@@ -8,9 +8,9 @@ var castArray = require('lodash/castArray');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
 var _default = require('@itcase/icons/default');
-var Divider = require('../../Divider-BQIfjvPR.js');
-var Icon = require('../../Icon-D_BDlSSb.js');
-var Text = require('../../Text-DwIx33-P.js');
+var Divider = require('../../Divider_cjs_DakITdTv.js');
+var Icon = require('../../Icon_cjs_DSzfNqif.js');
+var Text = require('../../Text_cjs_D4xG0cKD.js');
 require('lodash/camelCase');
 require('lodash/upperFirst');
 require('../context/Notifications.js');
@@ -23,9 +23,9 @@ require('../utils/setViewportProperty.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
 require('react-inlinesvg');
-require('../../Link-CZ8o5lGW.js');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Title-ByfOyy-n.js');
+require('../../Link_cjs_yht44xJv.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Title_cjs_iuyln-ab.js');
 
 var accordionAppearance = {
     dev: {},

package/dist/cjs/components/Avatar.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+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 useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Icon = require('../../Icon-D_BDlSSb.js');
-var Image = require('../../Image-DuIBtUq5.js');
-var Text = require('../../Text-DwIx33-P.js');
+var Icon = require('../../Icon_cjs_DSzfNqif.js');
+var Image = require('../../Image_cjs_DuIBtUq5.js');
+var Text = require('../../Text_cjs_D4xG0cKD.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -22,9 +22,9 @@ require('react-inlinesvg');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
-require('../../Link-CZ8o5lGW.js');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Title-ByfOyy-n.js');
+require('../../Link_cjs_yht44xJv.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Title_cjs_iuyln-ab.js');
 
 var avatarAppearance = {
     dev: {},
@@ -37,7 +37,7 @@ var avatarConfig = {
     },
 };
 function Avatar(props) {
-    var className = props.className, type = props.type, appearance = props.appearance, _a = props.size, size = _a === void 0 ? '96' : _a, src = props.src, Dot = props.Dot, _b = props.firstName, firstName = _b === void 0 ? '' : _b, icon = props.icon, mode = props.mode, _c = props.secondName, secondName = _c === void 0 ? '' : _c, before = props.before, after = props.after, onClick = props.onClick;
+    var className = props.className, type = props.type, appearance = props.appearance, _a = props.size, size = _a === void 0 ? '96' : _a, src = props.src, Dot = props.Dot, _b = props.firstName, firstName = _b === void 0 ? '' : _b, icon = props.icon, _c = props.secondName, secondName = _c === void 0 ? '' : _c, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick;
     var avatarChars = React.useMemo(function () {
         var firstChar = ((firstName === null || firstName === void 0 ? void 0 : firstName[0]) || '').toUpperCase();
         var secondChar = ((secondName === null || secondName === void 0 ? void 0 : secondName[0]) || '').toUpperCase();
@@ -49,7 +49,7 @@ function Avatar(props) {
     }, {});
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, _d = propsGenerator.textColor, textColor = _d === void 0 ? 'surfaceTextTertiary' : _d, _e = propsGenerator.textSize, textSize = _e === void 0 ? 'l' : _e, _f = propsGenerator.textWeight, textWeight = _f === void 0 ? '600' : _f, iconFill = propsGenerator.iconFill, iconFillHover = propsGenerator.iconFillHover, iconFillSize = propsGenerator.iconFillSize, iconItemFill = propsGenerator.iconItemFill, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, iconSrc = propsGenerator.iconSrc, shapeClass = propsGenerator.shapeClass;
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass && "avatar_shape_".concat(shapeClass), mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", src: src, shape: "geometric" })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize, textColor: textColor, textWeight: textWeight, children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill, fillHover: iconFillHover, fillSize: iconFillSize, iconFill: iconItemFill, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), Dot, after] }) }));
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass && "avatar_shape_".concat(shapeClass), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', isSkeleton && "avatar_skeleton", onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", src: src, shape: "geometric" })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize, textColor: textColor, textWeight: textWeight, children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill, fillHover: iconFillHover, fillSize: iconFillSize, iconFill: iconItemFill, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), Dot, after] }) }));
 }
 
 exports.Avatar = Avatar;

package/dist/cjs/components/Badge.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var Badge = require('../../Badge-Df7Zxjnk.js');
-require('../../tslib.es6-CCZ3TN_7.js');
+var Badge = require('../../Badge_cjs_DrG2tUjI.js');
+require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react/jsx-runtime');
 require('clsx');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
@@ -19,12 +19,12 @@ require('../utils/setViewportProperty.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
-require('../../Icon-D_BDlSSb.js');
+require('../../Icon_cjs_DSzfNqif.js');
 require('react-inlinesvg');
-require('../../Link-CZ8o5lGW.js');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Text-DwIx33-P.js');
-require('../../Title-ByfOyy-n.js');
+require('../../Link_cjs_yht44xJv.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Text_cjs_D4xG0cKD.js');
+require('../../Title_cjs_iuyln-ab.js');
 
 
 

package/dist/cjs/components/Breadcrumbs.js

@@ -1,15 +1,15 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+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 camelCase = require('lodash/camelCase');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon-D_BDlSSb.js');
-var Link = require('../../Link-CZ8o5lGW.js');
-var Text = require('../../Text-DwIx33-P.js');
+var Icon = require('../../Icon_cjs_DSzfNqif.js');
+var Link = require('../../Link_cjs_yht44xJv.js');
+var Text = require('../../Text_cjs_D4xG0cKD.js');
 require('lodash/castArray');
 require('lodash/upperFirst');
 require('../context/Notifications.js');
@@ -22,8 +22,8 @@ require('../utils/setViewportProperty.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
 require('react-inlinesvg');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Title-ByfOyy-n.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Title_cjs_iuyln-ab.js');
 
 function BreadcrumbsItem(props) {
     var className = props.className, text = props.text, textColor = props.textColor, textColorHover = props.textColorHover, textSize = props.textSize, cursor = props.cursor, href = props.href, iconAfter = props.iconAfter, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, _a = props.set, set = _a === void 0 ? 'default' : _a, onClick = props.onClick, children = props.children;

package/dist/cjs/components/Button.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var Button = require('../../Button-CWPTzaG2.js');
-require('../../tslib.es6-CCZ3TN_7.js');
+var Button = require('../../Button_cjs_B7OmqizJ.js');
+require('../../tslib.es6_cjs_CCZ3TN_7.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
-require('../../Icon-D_BDlSSb.js');
+require('../../Icon_cjs_DSzfNqif.js');
 require('react-inlinesvg');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 require('lodash/camelCase');
@@ -21,11 +21,11 @@ require('../utils/setViewportProperty.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
-require('../../Link-CZ8o5lGW.js');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Text-DwIx33-P.js');
-require('../../Title-ByfOyy-n.js');
-require('../../Loader-CjT6-r3I.js');
+require('../../Link_cjs_yht44xJv.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Text_cjs_D4xG0cKD.js');
+require('../../Title_cjs_iuyln-ab.js');
+require('../../Loader_cjs_D753D3li.js');
 
 
 

package/dist/cjs/components/Cell.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 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 Icon = require('../../Icon-D_BDlSSb.js');
-var Label = require('../../Label-DsNZ-asS.js');
-var Text = require('../../Text-DwIx33-P.js');
+var Icon = require('../../Icon_cjs_DSzfNqif.js');
+var Label = require('../../Label_cjs_BCjB-mxC.js');
+var Text = require('../../Text_cjs_D4xG0cKD.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -22,9 +22,9 @@ require('../utils/setViewportProperty.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
 require('react-inlinesvg');
-require('../../Link-CZ8o5lGW.js');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Title-ByfOyy-n.js');
+require('../../Link_cjs_yht44xJv.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Title_cjs_iuyln-ab.js');
 
 var cellAppearance = {
     dev: {},

package/dist/cjs/components/Checkbox.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Text = require('../../Text-DwIx33-P.js');
+var Text = require('../../Text_cjs_D4xG0cKD.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');

package/dist/cjs/components/Checkmark.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');

package/dist/cjs/components/Chips.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
+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 useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon-D_BDlSSb.js');
-var Text = require('../../Text-DwIx33-P.js');
+var Icon = require('../../Icon_cjs_DSzfNqif.js');
+var Text = require('../../Text_cjs_D4xG0cKD.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -21,9 +21,9 @@ require('../utils/setViewportProperty.js');
 require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
 require('react-inlinesvg');
-require('../../Link-CZ8o5lGW.js');
-require('../../Tooltip-hznDyLwa.js');
-require('../../Title-ByfOyy-n.js');
+require('../../Link_cjs_yht44xJv.js');
+require('../../Tooltip_cjs_CTwksdFk.js');
+require('../../Title_cjs_iuyln-ab.js');
 
 var chipsAppearanceAccent = {
     accent: {
@@ -79,7 +79,7 @@ var chipsAppearanceSurface = {
         fill: 'surfacePrimary',
         fillActive: 'accentPrimary',
         fillActiveHover: 'accentSecondary',
-        fillHover: 'surfacePrimaryHover',
+        fillHover: 'surfaceHover',
         labelTextActiveColor: 'accentTextPrimary',
         labelTextColor: 'surfaceTextPrimary',
         labelTextHoverColor: 'surfaceTextPrimary',
@@ -87,13 +87,13 @@ var chipsAppearanceSurface = {
     },
     surfaceSecondary: {
         fill: 'surfaceSecondary',
-        fillHover: 'surfaceSecondaryHover',
+        fillHover: 'surfaceHover',
         labelTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderSecondary',
     },
     surfaceTertiary: {
         fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
+        fillHover: 'surfaceHover',
         labelTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderTertiary',
     },
@@ -131,9 +131,9 @@ function Chips(props) {
     var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, cursorClass = propsGenerator.cursorClass, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass;
     // @ts-expect-error
     var chipsStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'chips', isActive && 'chips_state_active', fillClass && !isActive
-            ? "fill_".concat(fillClass)
-            : "fill_active_".concat(fillActiveClass), !isActive
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'chips', isActive && 'chips_state_active', !isActive
+            ? fillClass && "fill_".concat(fillClass)
+            : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive
             ? fillHoverClass && "fill_hover_".concat(fillHoverClass)
             : fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "chips_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "chips_size_".concat(sizeClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), isDisabled && "chips_state_disabled", cursorClass && "cursor_".concat(cursorClass), onClick && 'cursor_type_pointer'), "data-testid": dataTestId && "".concat(dataTestId, "Chips"), "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxRuntime.jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColor: labelTextColor, textColorActive: isActive && labelTextActiveColor, textColorHover: !isDisabled && !isActive
                         ? labelTextHoverColor