@itcase/ui 1.9.24 → 1.9.26

package/dist/components/Cell.js

@@ -101,50 +101,46 @@ const cellAppearanceStyle = {
 const cellAppearanceSurface = {
     surfacePrimary: {
         fill: 'surfacePrimary',
-        fillHover: 'surfacePrimaryHover',
+        fillHover: 'surfaceHoverPrimary',
         titleIconItemFill: 'surfaceItemPrimary',
         titleLabelAppearance: 'accentPrimary',
         titleTextColor: 'surfaceTextPrimary',
-        titleTextSize: 'surfaceTextPrimary',
         labelTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderPrimary',
         valueIconItemFill: 'surfaceItemPrimary',
         valueLabelAppearance: 'accentPrimary',
         valueTextColor: 'surfaceTextPrimary',
     },
-    surfaceSecondary: {
-        fill: 'surfaceSecondary',
-        fillHover: 'surfaceSecondaryHover',
+    surfaceQuaternary: {
+        fill: 'surfaceQuaternary',
+        fillHover: 'surfaceHoverQuaternary',
         titleIconItemFill: 'surfaceItemPrimary',
         titleLabelAppearance: 'accentPrimary',
         titleTextColor: 'surfaceTextPrimary',
-        titleTextSize: 'surfaceTextPrimary',
         labelTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderPrimary',
         valueIconItemFill: 'surfaceItemPrimary',
         valueLabelAppearance: 'accentPrimary',
         valueTextColor: 'surfaceTextPrimary',
     },
-    surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
+    surfaceSecondary: {
+        fill: 'surfaceSecondary',
+        fillHover: 'surfaceHoverSecondary',
         titleIconItemFill: 'surfaceItemPrimary',
         titleLabelAppearance: 'accentPrimary',
         titleTextColor: 'surfaceTextPrimary',
-        titleTextSize: 'surfaceTextPrimary',
         labelTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderPrimary',
         valueIconItemFill: 'surfaceItemPrimary',
         valueLabelAppearance: 'accentPrimary',
         valueTextColor: 'surfaceTextPrimary',
     },
-    surfaceQuaternary: {
-        fill: 'surfaceQuaternary',
-        fillHover: 'surfaceQuaternaryHover',
+    surfaceTertiary: {
+        fill: 'surfaceTertiary',
+        fillHover: 'surfaceHoverTertiary',
         titleIconItemFill: 'surfaceItemPrimary',
         titleLabelAppearance: 'accentPrimary',
         titleTextColor: 'surfaceTextPrimary',
-        titleTextSize: 'surfaceTextPrimary',
         labelTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderPrimary',
         valueIconItemFill: 'surfaceItemPrimary',
@@ -166,7 +162,7 @@ const cellConfig = {
     },
 };
 function Cell(props) {
-    const { className, appearance, title, titleIcon, titleLabel, titleTag, showTitleLabel, showValueLabel, value, valueIcon, valueTag, before, after, isActive, isEqual, isSameWidth, onClick, onMouseEnter, } = props;
+    const { appearance, className, title, titleIcon, titleLabel, titleTag, showTitleLabel, showValueLabel, value, valueIcon, valueTag, before, after, isActive, isEqual, isSameWidth, onClick, onMouseEnter, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, cellConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, titleIconFill, titleIconFillHover, titleIconFillSize, titleIconItemFill, titleIconShape, titleIconSrc, titleLabelAppearance, titleLabelAppearanceSize, titleLabelShape, titleLabelSize, titleLabelTextSize, titleTextColor, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWrap, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, reverseClass, shapeClass, sizeClass, valueIconFill, valueIconFillHover, valueIconFillSize, valueIconItemFill, valueIconShape, valueIconSrc, valueLabel, valueLabelAppearance, valueLabelAppearanceSize, valueLabelShape, valueLabelSize, valueLabelTextSize, valueTextAlign, valueTextColor, valueTextSize, valueTextTruncate, valueTextWeight, valueTextWrap, widthClass, zeroGap, zeroPadding, } = propsGenerator;
@@ -183,7 +179,7 @@ function Cell(props) {
             ? borderColorHoverClass &&
                 `border-color_hover_${borderColorHoverClass}`
             : borderColorActiveHoverClass &&
-                `border-color_active_hover_${borderColorActiveHoverClass}`, reverseClass && `cell_reverse_${reverseClass}`, shapeClass && `cell_shape_${shapeClass}`, widthClass && `width_${widthClass}`, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsx("div", { className: "cell__before", children: before }), jsxs("div", { className: clsx('cell__wrapper', directionClass && `cell__wrapper_direction_${directionClass}`, isEqual && 'cell__wrapper-equal', isSameWidth && 'cell__wrapper-same-width'), children: [title && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsx(Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsx(Label, { className: "cell__title-label", appearance: `${titleLabelAppearance} ${titleLabelAppearanceSize}`, size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsx(Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsx(Label, { className: "cell__value-label", appearance: `${valueLabelAppearance} ${valueLabelAppearanceSize}`, size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsx("div", { className: "cell__after", children: after })] }));
+                `border-color_active_hover_${borderColorActiveHoverClass}`, reverseClass && `cell_reverse_${reverseClass}`, shapeClass && `cell_shape_${shapeClass}`, widthClass && `width_${widthClass}`, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsx("div", { className: "cell__before", children: before }), jsxs("div", { className: clsx('cell__wrapper', directionClass && `cell__wrapper_direction_${directionClass}`, isEqual && 'cell__wrapper-equal', isSameWidth && 'cell__wrapper-same-width'), children: [title && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsx(Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsx(Label, { appearance: `${titleLabelAppearance} ${titleLabelAppearanceSize}`, className: "cell__title-label", size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsx(Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsx(Label, { appearance: `${valueLabelAppearance} ${valueLabelAppearanceSize}`, className: "cell__value-label", size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsx("div", { className: "cell__after", children: after })] }));
 }
 
 export { Cell, cellAppearance, cellConfig };

package/dist/components/Chips.js

@@ -1,4 +1,4 @@
-export { C as Chips, b as ChipsGroup, a as chipsAppearance, c as chipsConfig } from '../ChipsGroup_es_DWvsJ5bu.js';
+export { C as Chips, b as ChipsGroup, a as chipsAppearance, c as chipsConfig } from '../ChipsGroup_es_CbzUWqG9.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';

package/dist/components/Code.js

@@ -46,7 +46,7 @@ const codeAppearanceError = {
         inputBorderColorHover: 'errorBorderSecondary',
         inputCaretColor: 'surfaceItemPrimary',
         inputFill: 'errorTertiary',
-        inputFillHover: 'errorTertiary',
+        inputFillHover: 'errorHoverTertiary',
         inputPlaceholderTextColor: 'surfaceTextQuaternary',
         inputTextColor: 'surfaceTextPrimary',
     },
@@ -71,21 +71,21 @@ const codeAppearanceShape = {
     rounded: {
         shape: 'rounded',
     },
-    roundedS: {
-        shape: 'rounded',
-        shapeStrength: '0_5m',
-    },
-    roundedM: {
+    roundedXL: {
         shape: 'rounded',
-        shapeStrength: '1m',
+        shapeStrength: '2m',
     },
     roundedL: {
         shape: 'rounded',
         shapeStrength: '1_5m',
     },
-    roundedXL: {
+    roundedM: {
         shape: 'rounded',
-        shapeStrength: '2m',
+        shapeStrength: '1m',
+    },
+    roundedS: {
+        shape: 'rounded',
+        shapeStrength: '0_5m',
     },
 };
 
@@ -103,19 +103,19 @@ const codeAppearanceSize = {
 };
 
 const codeAppearanceStyle = {
-    full: {
-        inputBorderColor: 'none',
-    },
-    ghost: {
+    solid: {
         inputBorderColor: 'none',
-        inputFill: 'none',
     },
     outlined: {
         inputFill: 'none',
     },
-    solid: {
+    full: {
         inputBorderColor: 'none',
     },
+    ghost: {
+        inputBorderColor: 'none',
+        inputFill: 'none',
+    },
 };
 
 const codeAppearanceSuccess = {
@@ -124,7 +124,7 @@ const codeAppearanceSuccess = {
         inputBorderColorHover: 'successBorderSecondary',
         inputCaretColor: 'surfaceItemPrimary',
         inputFill: 'successTertiary',
-        inputFillHover: 'successTertiary',
+        inputFillHover: 'successHoverTertiary',
         inputPlaceholderTextColor: 'surfaceTextQuaternary',
         inputTextColor: 'surfaceTextPrimary',
     },
@@ -148,7 +148,7 @@ const codeConfig = {
     },
 };
 function Code(props) {
-    const { className, appearance, initialValue = '', isDisabled, inputAutoFocus, inputCount = 6, inputPlaceholder, inputType = 'number', separatorComponent, before, after, isSkeleton, onBlur, onChange, onFocus, } = props;
+    const { appearance, className, initialValue = '', inputAutoFocus, inputCount = 6, inputPlaceholder, inputType = 'number', separatorComponent, before, after, isDisabled, isSkeleton, onBlur, onChange, onFocus, } = props;
     const [otp, setOtp] = useState(initialValue);
     const appearanceConfig = useAppearanceConfig(appearance, codeConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);

package/dist/components/CookiesWarning.js

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import Cookies from 'js-cookie';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { B as Button } from '../Button_es_CvRcO3xM.js';
+import { B as Button } from '../Button_es_ljlle2Pu.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';

package/dist/components/DatePeriod.js

@@ -5,17 +5,17 @@ import { DateTime } from 'luxon';
 import { DATE_PERIOD_INTERVALS } from '@itcase/common';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_DWvsJ5bu.js';
-import { D as DatePickerInput } from '../DatePicker_es_B-WPA9y9.js';
+import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_CbzUWqG9.js';
+import { D as DatePickerInput } from '../DatePicker_es_CtbVXMmy.js';
 import 'react-select';
 import '../Icon_es_CtZHchZc.js';
-import { a as SelectContainer } from '../SelectContainer_es_Bc4Laoir.js';
+import { a as SelectContainer } from '../SelectContainer_es_2ZX3VSMS.js';
 import 'lodash/camelCase';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../context/Notifications.js';
 import '../context/UIContext.js';
-import '../Group_es_BtE98Vb5.js';
+import '../Group_es_nBtACpoG.js';
 import 'lodash/castArray';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
@@ -27,7 +27,7 @@ import '../hooks/useStyles/useStyles.js';
 import '../Text_es_CU9KR5AE.js';
 import 'date-fns/locale';
 import 'react-datepicker';
-import '../Button_es_CvRcO3xM.js';
+import '../Button_es_ljlle2Pu.js';
 import '../Link_es_P2b6ya7P.js';
 import '../Loader_es_BvTBRuay.js';
 import '../Input_es_I8GPoibb.js';
@@ -37,7 +37,7 @@ import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 import 'react-select/creatable';
-import '../Divider_es_BiYozVBS.js';
+import '../Divider_es_DNJg0mQR.js';
 
 const datePeriodAppearanceShape = {
     circular: {

package/dist/components/DatePicker.js

@@ -1,4 +1,4 @@
-export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_B-WPA9y9.js';
+export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_CtbVXMmy.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -20,7 +20,7 @@ import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Button_es_CvRcO3xM.js';
+import '../Button_es_ljlle2Pu.js';
 import '../Icon_es_CtZHchZc.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';

package/dist/components/Divider.js

@@ -1,4 +1,4 @@
-export { D as Divider, a as dividerAppearance, d as dividerConfig } from '../Divider_es_BiYozVBS.js';
+export { D as Divider, a as dividerAppearance, d as dividerConfig } from '../Divider_es_DNJg0mQR.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';

package/dist/components/Drawer.js

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import ReactDrawer from 'react-modern-drawer';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { D as Divider } from '../Divider_es_BiYozVBS.js';
+import { D as Divider } from '../Divider_es_DNJg0mQR.js';
 import { I as Icon, b as Title } from '../Icon_es_CtZHchZc.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import { icons24 } from '@itcase/icons/default';

package/dist/components/Dropdown.js

@@ -1,4 +1,4 @@
-export { D as Dropdown, a as DropdownItem, d as dropdownItemAppearance, b as dropdownItemConfig } from '../DropdownItem_es_BauhVrYj.js';
+export { D as Dropdown, a as DropdownItem, d as dropdownItemAppearance, b as dropdownItemConfig } from '../DropdownItem_es_CTw07zF3.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -24,4 +24,4 @@ import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 import '../Link_es_P2b6ya7P.js';
 import '../Text_es_CU9KR5AE.js';
-import '../Divider_es_BiYozVBS.js';
+import '../Divider_es_DNJg0mQR.js';

package/dist/components/Group.js

@@ -1,4 +1,4 @@
-export { G as Group, a as groupAppearance, g as groupConfig } from '../Group_es_BtE98Vb5.js';
+export { G as Group, a as groupAppearance, g as groupConfig } from '../Group_es_nBtACpoG.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/components/Notification.js

@@ -4,7 +4,7 @@ import { L as Loader } from '../Loader_es_BvTBRuay.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { B as Button } from '../Button_es_CvRcO3xM.js';
+import { B as Button } from '../Button_es_ljlle2Pu.js';
 import { I as Icon } from '../Icon_es_CtZHchZc.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import { icons24 } from '@itcase/icons/default';

package/dist/components/Pagination.js

@@ -6,7 +6,7 @@ import ReactPaginate from 'react-paginate';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es_BauhVrYj.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es_CTw07zF3.js';
 import { I as Icon } from '../Icon_es_CtZHchZc.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import { icons14, icons24, icons16 } from '@itcase/icons/default';
@@ -23,7 +23,7 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import 'lodash/maxBy';
-import '../Divider_es_BiYozVBS.js';
+import '../Divider_es_DNJg0mQR.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';

package/dist/components/Response.js

@@ -6,8 +6,8 @@ import { urlWithAssetPrefix } from '../hoc/urlWithAssetPrefix.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { B as Button } from '../Button_es_CvRcO3xM.js';
-import { G as Group } from '../Group_es_BtE98Vb5.js';
+import { B as Button } from '../Button_es_ljlle2Pu.js';
+import { G as Group } from '../Group_es_nBtACpoG.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';

package/dist/components/Select.js

@@ -1,4 +1,4 @@
-export { a as Select, S as SelectClearIndicator, b as SelectControl, c as SelectDropdownIndicator, d as SelectGroupHeading, e as SelectIndicatorsContainer, f as SelectInput, g as SelectMenu, h as SelectMultiValueContainer, i as SelectMultiValueLabel, j as SelectMultiValueRemove, k as SelectOption, l as SelectPlaceholder, m as SelectSingleValue, n as SelectValueContainer, s as selectConfig } from '../SelectContainer_es_Bc4Laoir.js';
+export { a as Select, S as SelectClearIndicator, b as SelectControl, c as SelectDropdownIndicator, d as SelectGroupHeading, e as SelectIndicatorsContainer, f as SelectInput, g as SelectMenu, h as SelectMultiValueContainer, i as SelectMultiValueLabel, j as SelectMultiValueRemove, k as SelectOption, l as SelectPlaceholder, m as SelectSingleValue, n as SelectValueContainer, s as selectConfig } from '../SelectContainer_es_2ZX3VSMS.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -18,7 +18,7 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Group_es_BtE98Vb5.js';
+import '../Group_es_nBtACpoG.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
 import '../Text_es_CU9KR5AE.js';
@@ -29,4 +29,4 @@ import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 import '../Link_es_P2b6ya7P.js';
 import '../Loader_es_BvTBRuay.js';
-import '../Divider_es_BiYozVBS.js';
+import '../Divider_es_DNJg0mQR.js';

package/dist/components/Swiper.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useRef, useCallback, useImperativeHandle, useEffect, useState } from 'react';
 import clsx from 'clsx';
 import { Swiper as Swiper$1, SwiperSlide } from 'swiper/react';
-import { G as Group } from '../Group_es_BtE98Vb5.js';
+import { G as Group } from '../Group_es_nBtACpoG.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';

package/dist/components/Tab.js

@@ -6,7 +6,7 @@ import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceC
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
 import { B as Badge, I as Icon } from '../Icon_es_CtZHchZc.js';
-import { D as Divider } from '../Divider_es_BiYozVBS.js';
+import { D as Divider } from '../Divider_es_DNJg0mQR.js';
 import { L as Link } from '../Link_es_P2b6ya7P.js';
 import { T as Text } from '../Text_es_CU9KR5AE.js';
 import '../hooks/useActiveClasses/useActiveClasses.helpers.js';

package/dist/components/Textarea.js

@@ -22,32 +22,28 @@ const textareaAppearanceDefault = {
         fillHover: 'surfaceTertiary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
-    defaultSecondary: {
+    defaultQuaternary: {
         fill: 'surfacePrimary',
-        fillHover: 'surfaceTertiary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
-    defaultTertiary: {
+    defaultSecondary: {
         fill: 'surfacePrimary',
+        fillHover: 'surfaceTertiary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
-    defaultQuaternary: {
+    defaultTertiary: {
         fill: 'surfacePrimary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
@@ -59,7 +55,6 @@ const textareaAppearanceDisabled = {
         borderColor: 'errorBorderQuaternary',
         borderColorHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextQuaternary',
-        iconBeforeFill: 'errorItemQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
@@ -67,7 +62,6 @@ const textareaAppearanceDisabled = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',
     },
@@ -77,17 +71,15 @@ const textareaAppearanceError = {
     errorPrimary: {
         fill: 'errorTertiary',
         borderColor: 'errorBorderQuaternary',
-        borderColorHover: 'errorBorderQuaternary',
+        borderColorHover: 'errorBorderHoverQuaternary',
         textColor: 'surfaceTextPrimary',
-        iconBeforeFill: 'errorItemQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
     errorSecondary: {
         fill: 'errorSecondary',
         borderColor: 'errorBorderTertiary',
-        borderColorHover: 'errorBorderQuaternary',
-        iconBeforeFill: 'errorItemQuaternary',
+        borderColorHover: 'errorBorderHoverQuaternary',
         iconClearFill: 'errorItemPrimary',
         placeholderTextColor: 'errorTextSecondary',
     },
@@ -99,7 +91,6 @@ const textareaAppearanceRequire = {
         borderColor: 'warningBorderQuaternary',
         borderColorHover: 'warningBorderQuaternary',
         textColor: 'surfaceTextPrimary',
-        iconBeforeFill: 'warningItemQuaternary',
         iconClearFill: 'warningItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
@@ -107,7 +98,6 @@ const textareaAppearanceRequire = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',
     },
@@ -188,11 +178,10 @@ const textareaAppearanceStyle = {
 const textareaAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
-        fillHover: 'successTertiary',
+        fillHover: 'successHoverTertiary',
         borderColor: 'successBorderQuaternary',
         borderColorHover: 'successBorderQuaternary',
         textColor: 'surfaceTextPrimary',
-        iconBeforeFill: 'successItemQuaternary',
         iconClearFill: 'successItemPrimary',
         placeholderTextColor: 'surfaceTextQuaternary',
     },
@@ -200,7 +189,6 @@ const textareaAppearanceSuccess = {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         borderColorHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
         iconClearFill: 'surfaceItemPrimary',
         placeholderTextColor: 'surfaceTextSecondary',
     },
@@ -224,12 +212,12 @@ const textareaConfig = {
     },
 };
 function Textarea(props) {
-    const { id, className, appearance, isDisabled, placeholder, value, onBlur, onChange, onFocus, onKeyDown, } = props;
+    const { id, appearance, className, placeholder, value, isDisabled, onBlur, onChange, onFocus, onKeyDown, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, textareaConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, borderColorClass, borderHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
     return (jsx("div", { className: clsx('textarea', className, sizeClass && `textarea_size_${sizeClass}`), children: jsx("textarea", { id: id, className: clsx('textarea__input', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderHoverClass && `border-color_hover_${borderHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, placeholderTextColorClass &&
-                `placeholder-text-color_${placeholderTextColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textColorClass && `text-color_${textColorClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), disabled: isDisabled && 'disabled', placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }) }));
+                `placeholder-text-color_${placeholderTextColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textColorClass && `text-color_${textColorClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), disabled: isDisabled, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }) }));
 }
 
 export { Textarea, textareaAppearance, textareaConfig };

package/dist/components/Video.js

@@ -18,7 +18,7 @@ import '../hooks/useStyles/styleAttributes.js';
 function Video(props) {
     const { id, className, position, mp4, ogv, poster, webm, children } = props;
     const { styles: videoStyles } = useStyles(props);
-    return (jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, position && `video_position_${position}`), style: videoStyles, children: [jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsx("source", { type: "video/webm", src: webm, codecs: "vp8, vorbis" }), ogv && jsx("source", { type: "video/ogg", src: ogv, codecs: "theora, vorbis" }), mp4 && (jsx("source", { type: "video/mp4", src: mp4, codecs: "avc1.42E01E, mp4a.40.2" }))] }), children] }));
+    return (jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, position && `video_position_${position}`), style: videoStyles, children: [jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsx("source", { type: 'video/webm; codecs="vp8, vorbis"', src: webm }), ogv && jsx("source", { type: 'video/ogg; codecs="theora, vorbi"', src: ogv }), mp4 && (jsx("source", { type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"', src: mp4 }))] }), children] }));
 }
 
 export { Video };

package/dist/components/Warning.js

@@ -184,14 +184,14 @@ const warningConfig = {
     },
 };
 function Warning(props) {
-    const { appearance, className, label, description, isSkeleton } = props;
+    const { appearance, className, label, description, isSkeleton, children } = props;
     const appearanceConfig = useAppearanceConfig(appearance, warningConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, labelTextColor, labelTextSize, labelTextWeight, descriptionTextColor, descriptionTextSize, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
     // @ts-ignore
     const { styles: warningStyles } = useStyles(props);
     const [isVisible, setIsVisible] = useState(true);
-    return (jsx(Fragment, { children: isVisible && (jsxs("div", { className: clsx(className, 'warning', fillClass && `fill_${fillClass}`, sizeClass && `warning_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `warning_skeleton`), style: warningStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { fill: iconBeforeFill, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxs("div", { className: 'warning__content', children: [label && (jsx(Text, { size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), description && (jsx(Text, { size: descriptionTextSize, textColor: descriptionTextColor, children: description }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { fill: iconAfterFill, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, SvgImage: iconAfter, onClick: () => setIsVisible(false) }))] })) }));
+    return (jsx(Fragment, { children: isVisible && (jsxs("div", { className: clsx(className, 'warning', fillClass && `fill_${fillClass}`, sizeClass && `warning_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `warning_skeleton`), style: warningStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { fill: iconBeforeFill, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxs("div", { className: 'warning__content', children: [label && (jsx(Text, { size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), description && (jsx(Text, { size: descriptionTextSize, textColor: descriptionTextColor, children: description })), children] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { fill: iconAfterFill, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, SvgImage: iconAfter, onClick: () => setIsVisible(false) }))] })) }));
 }
 
 export { Warning, warningAppearance, warningConfig };

package/dist/css/styles/bundles.css

@@ -64762,8 +64762,8 @@ h2.react-datepicker__current-month {
       align-items: flex-start;
       &-reverse {
         display: flex;
-        align-items: flex-start;
         flex-direction: row-reverse;
+        align-items: flex-start;
       }
     }
     &_vertical {
@@ -64772,29 +64772,29 @@ h2.react-datepicker__current-month {
       align-items: flex-start;
       &-reverse {
         display: flex;
-        align-items: flex-start;
         flex-direction: column-reverse;
+        align-items: flex-start;
       }
     }
       &_row {
         display: flex;
-        align-items: flex-start;
         flex-direction: row;
+        align-items: flex-start;
       }
       &_row-reverse {
         display: flex;
-        align-items: flex-start;
         flex-direction: row-reverse;
+        align-items: flex-start;
       }
       &_column {
         display: flex;
-        align-items: flex-start;
         flex-direction: column;
+        align-items: flex-start;
       }
       &_column-reverse {
         display: flex;
-        align-items: flex-start;
         flex-direction: column-reverse;
+        align-items: flex-start;
       }
   }
 }

package/dist/snippets/Group.snippets.json

@@ -2,7 +2,7 @@
     "Group": {
         "prefix": "group",
         "body": [
-            "<Group width=\"${1|fill,auto}\" direction=\"${2|horizontal,vertical,row-reverse,column-reverse|}\">",
+            "<Group width=\"${1|fill,auto|}\" direction=\"${2|horizontal,vertical,row-reverse,column-reverse|}\">",
             "  $3",
             "</Group>"
         ],

package/dist/types/components/Button/Button.d.ts

@@ -58,7 +58,7 @@ declare const Button: React.ForwardRefExoticComponent<{
     href?: string;
     htmlType?: string;
     isDisabled?: boolean;
-    isLoading: boolean;
+    isLoading?: boolean;
     isSkeleton?: boolean;
     label?: string;
     labelTextTruncate?: boolean;

package/dist/types/components/Button/Button.interface.d.ts

@@ -62,7 +62,7 @@ type ButtonProps = ButtonAppearanceProps & StyleAttributes & {
     href?: string;
     htmlType?: string;
     isDisabled?: boolean;
-    isLoading: boolean;
+    isLoading?: boolean;
     isSkeleton?: boolean;
     label?: string;
     labelTextTruncate?: boolean;

package/dist/types/components/Cell/Cell.appearance.d.ts

@@ -1,2 +1,2 @@
-import { CellAppearanceType } from './Cell.interface';
-export declare const cellAppearance: CellAppearanceType;
+import { CellAppearance } from './Cell.interface';
+export declare const cellAppearance: CellAppearance;