@itcase/ui 1.9.36 → 1.9.37

package/dist/cjs/components/Chips.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var ChipsGroup = require('../../ChipsGroup_cjs_C-oThNwF.js');
+var ChipsGroup = require('../../ChipsGroup_cjs_CT4DME-7.js');
 require('react/jsx-runtime');
 require('clsx');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
@@ -20,12 +20,12 @@ require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-require('../../Icon_cjs_CQxDPPGY.js');
+require('../../Icon_cjs_DRdjXL7T.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DqNtNI23.js');
-require('../../Text_cjs_Co2XdYF-.js');
+require('../../Link_cjs_CmBw4h-N.js');
+require('../../Text_cjs_BJ9NgJkx.js');
 
 
 

package/dist/cjs/components/Choice.js

@@ -6,9 +6,9 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_CQxDPPGY.js');
-var Loader = require('../../Loader_cjs_CP1xKwb-.js');
-var Text = require('../../Text_cjs_Co2XdYF-.js');
+var Icon = require('../../Icon_cjs_DRdjXL7T.js');
+var Loader = require('../../Loader_cjs_BHMB4c8f.js');
+var Text = require('../../Text_cjs_BJ9NgJkx.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -25,7 +25,7 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DqNtNI23.js');
+require('../../Link_cjs_CmBw4h-N.js');
 
 const choiceAppearanceDefault = {
     defaultMutedPrimary: {
@@ -49,7 +49,7 @@ const choiceAppearanceDefault = {
         fill: 'surfaceSecondary',
         fillItem: 'surfaceSecondary',
         fillItemActive: 'accentPrimary',
-        fillItemActiveHover: 'accentHoverPrimary',
+        fillItemActiveHover: 'accentActiveHoverPrimary',
         fillItemHover: 'surfaceTertiary',
         labelTextColor: 'surfaceTextPrimary',
         labelTextColorActive: 'accentTextPrimary',
@@ -66,30 +66,29 @@ const choiceAppearanceDefault = {
 
 const choiceAppearanceDisabled = {
     disabledPrimary: {
-        fill: 'surfaceDisabled',
-        fillItem: 'surfaceDisabled',
+        fill: 'disabledTertiary',
+        fillItem: 'disabledTertiary',
         fillItemActive: 'surfaceDisabled',
         fillItemActiveHover: 'surfaceDisabled',
         fillItemHover: 'surfaceTertiary',
-        labelTextColor: 'surfaceTextQuaternary',
         labelTextActiveColor: 'surfaceTextQuaternary',
-        borderColor: 'surfaceBorderDisabled',
+        labelTextColor: 'surfaceTextQuaternary',
+        borderColor: 'surfaceBorderPrimary',
         iconAfterFill: 'surfaceItemPrimary',
-        iconAfterFillActive: 'surfaceItemDisabled',
+        iconAfterFillActive: 'surfaceItemActiveDisabled',
         iconBeforeFill: 'surfaceItemPrimary',
-        iconBeforeFillActive: 'surfaceItemDisabled',
+        iconBeforeFillActive: 'surfaceItemActiveDisabled',
         iconFill: 'surfaceItemPrimary',
-        iconFillActive: 'surfaceItemDisabled',
+        iconFillActive: 'surfaceActiveItemDisabled',
     },
 };
 
 const choiceAppearanceError = {
     errorPrimary: {
         fill: 'errorTertiary',
-        fillItem: 'errorItemTertiary',
-        fillItemActive: 'errorItemSecondary',
-        fillItemHover: 'errorItemHover',
-        labelTextActiveColor: 'errorTextPrimary',
+        fillItem: 'errorTertiary',
+        fillItemActive: 'errorSecondary',
+        fillItemHover: 'errorHoverPrimary',
         labelTextColor: 'errorTextSecondary',
         borderColor: 'errorBorderQuaternary',
         iconAfterFill: 'errorItemSecondary',
@@ -105,17 +104,17 @@ const choiceAppearanceRequire = {
     requirePrimary: {
         fill: 'warningTertiary',
         fillItem: 'warningTertiary',
-        fillItemActive: 'warningItemSecondary',
-        fillItemHover: 'warningItemHover',
-        labelTextActiveColor: 'warningTextPrimary',
+        fillItemActive: 'warningSecondary',
+        fillItemHover: 'warningHoverPrimary',
         labelTextColor: 'warningTextSecondary',
+        labelTextColorActive: 'warningTextActivePrimary',
         borderColor: 'warningBorderSecondary',
         iconAfterFill: 'warningItemSecondary',
-        iconAfterFillActive: 'warningTertiary',
+        iconAfterFillActive: 'warningItemActiveTertiary',
         iconBeforeFill: 'warningItemSecondary',
-        iconBeforeFillActive: 'warningTertiary',
+        iconBeforeFillActive: 'warningItemActiveTertiary',
         iconFill: 'warningItemSecondary',
-        iconFillActive: 'warningTertiary',
+        iconFillActive: 'warningItemActiveTertiary',
     },
 };
 
@@ -126,21 +125,21 @@ const choiceAppearanceShape = {
     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',
     },
 };
 
@@ -180,17 +179,17 @@ const choiceAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
         fillItem: 'successTertiary',
-        fillItemActive: 'successItemSecondary',
-        fillItemHover: 'successItemHover',
-        labelTextActiveColor: 'successTextPrimary',
+        fillItemActive: 'successSecondary',
+        fillItemHover: 'successHoverPrimary',
         labelTextColor: 'successTextSecondary',
+        labelTextColorActive: 'successTextActivePrimary',
         borderColor: 'successBorderSecondary',
         iconAfterFill: 'successItemSecondary',
-        iconAfterFillActive: 'successTertiary',
+        iconAfterFillActive: 'successItemActiveTertiary',
         iconBeforeFill: 'successItemSecondary',
-        iconBeforeFillActive: 'successTertiary',
+        iconBeforeFillActive: 'successItemActiveTertiary',
         iconFill: 'successItemSecondary',
-        iconFillActive: 'successTertiary',
+        iconFillActive: 'successItemActiveTertiary',
     },
 };
 
@@ -222,8 +221,9 @@ function Choice(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, choiceConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { size, fillClass, fillItemActiveClass, fillItemActiveDisabledClass, fillItemActiveHoverClass, fillItemClass, fillItemDisabledClass, fillItemHoverClass, labelTextColor, labelTextColorActive, labelTextColorActiveHover, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, iconAfterFill, iconAfterFillActive, iconAfterFillDisabled, iconAfterSize, iconBeforeFill, iconBeforeFillActive, iconBeforeFillDisabled, iconBeforeSize, iconFill, iconFillActive, iconFillDisabled, iconSize, shapeClass, shapeStrengthClass, wrapClass, } = propsGenerator;
+    //@ts-expect-error
     const { styles } = useStyles.useStyles(props);
-    return (jsxRuntime.jsxs("div", { id: id, className: clsx(className, 'choice', size && `choice_size_${size}`, fillClass && `fill_${fillClass}`, wrapClass && `choice_wrap_${wrapClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `choice_skeleton`), ref: controlRef, "data-testid": dataTestId && `${dataTestId}Choice`, "data-tour": dataTour, style: styles, children: [before && jsxRuntime.jsx("div", { className: "choice__before", children: before }), isLoading ? (jsxRuntime.jsx(Loader.Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemAccent" })) : (jsxRuntime.jsx(React.Fragment, { children: options.map((item) => {
+    return (jsxRuntime.jsxs("div", { id: id, className: clsx(className, 'choice', size && `choice_size_${size}`, fillClass && `fill_${fillClass}`, wrapClass && `choice_wrap_${wrapClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `choice_skeleton`), ref: controlRef, "data-testid": dataTestId && `${dataTestId}Choice`, "data-tour": dataTour, style: styles, children: [before && jsxRuntime.jsx("div", { className: "choice__before", children: before }), isLoading ? (jsxRuntime.jsx(Loader.Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemPrimary" })) : (jsxRuntime.jsx(React.Fragment, { children: options.map((item) => {
                     const isActive = typeof active === 'object'
                         ? String(item.value) === String(active.value)
                         : String(item.value) === String(active);

package/dist/cjs/components/Code.js

@@ -155,7 +155,6 @@ function Code(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, codeConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { inputBorderColorClass, inputBorderColorHoverClass, inputBorderFocusColorClass, inputBorderWidthClass, inputCaretColorClass, inputFillClass, inputFillHoverClass, inputPlaceholderTextColorClass, inputSizeClass, inputTextColorClass, inputTextSizeClass, inputTextWeightClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
-    // NOTE: too many dependencies for "useCallback" and possible too many checks
     const renderInput = (otpInputProps, index) => {
         return (jsxRuntime.jsx("input", { ...otpInputProps, className: clsx('code__input', inputCaretColorClass && `caret-color_${inputCaretColorClass}`, inputFillClass && `fill_${inputFillClass}`, inputFillHoverClass && `fill_hover_${inputFillHoverClass}`, inputPlaceholderTextColorClass &&
                 `placeholder-text-color_${inputPlaceholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, inputTextSizeClass && `text_size_${inputTextSizeClass}`, inputTextColorClass && `text-color_${inputTextColorClass}`, inputTextWeightClass && `text-weight_${inputTextWeightClass}`, inputBorderWidthClass && `border-width_${inputBorderWidthClass}`, inputBorderColorClass && `border-color_${inputBorderColorClass}`, inputBorderColorHoverClass &&
@@ -170,7 +169,7 @@ function Code(props) {
     };
     React.useEffect(() => {
         onChange && onChange(otp);
-    }, [otp]);
+    }, [onChange, otp]);
     return (jsxRuntime.jsxs("div", { className: clsx(className, 'code', widthClass, sizeClass && `code_size_${sizeClass}`), "data-testid": dataTestId, "data-tour": dataTour, children: [before, jsxRuntime.jsx(OtpInput, { containerStyle: clsx(className, 'code__wrapper'), inputType: inputType, numInputs: inputCount, placeholder: inputPlaceholder, renderInput: renderInput, renderSeparator: separatorComponent || null, shouldAutoFocus: inputAutoFocus, value: otp, onChange: setOtp }), after] }));
 }
 

package/dist/cjs/components/CookiesWarning.js

@@ -6,8 +6,8 @@ var clsx = require('clsx');
 var Cookies = require('js-cookie');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Button = require('../../Button_cjs_BLuRWxbc.js');
-var Text = require('../../Text_cjs_Co2XdYF-.js');
+var Button = require('../../Button_cjs_Dvh0E0zz.js');
+var Text = require('../../Text_cjs_BJ9NgJkx.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -22,22 +22,22 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_CQxDPPGY.js');
+require('../../Icon_cjs_DRdjXL7T.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DqNtNI23.js');
-require('../../Loader_cjs_CP1xKwb-.js');
+require('../../Link_cjs_CmBw4h-N.js');
+require('../../Loader_cjs_BHMB4c8f.js');
 
 const cookiesWarningAppearanceDefault = {
     defaultPrimary: {
         fill: 'accentPrimary',
-        fillHover: 'accentHover',
-        messageTextSize: 's',
+        fillHover: 'accentHoverPrimary',
         messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 's',
+        elevation: '8',
         buttonAppearance: 'accentPrimary sizeXL',
         buttonWidth: 'fill',
-        elevation: 8,
     },
 };
 
@@ -66,13 +66,12 @@ function CookiesWarning(props) {
         return () => {
             window.removeEventListener('scroll', closeCookiesWarning, true);
         };
-    }, []);
+    }, [closeCookiesWarning, isHideOnScroll]);
     React.useEffect(() => {
-        // isHideOnScroll &&
         if (!isOpen) {
             window.removeEventListener('scroll', closeCookiesWarning, true);
         }
-    }, [isOpen]);
+    }, [closeCookiesWarning, isOpen]);
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, cookiesWarningConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, messageTextColor, messageTextSize, buttonAppearance, buttonFill, buttonFillHover, buttonLabel, buttonLabelSize, buttonLabelTextColor, buttonShape, buttonSize, buttonWidth, elevationClass, } = propsGenerator;

package/dist/cjs/components/Dadata.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var reactDadata = require('react-dadata');
-var Input = require('../../Input_cjs_BUtZUZYh.js');
+var Input = require('../../Input_cjs_B13aeHfj.js');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 require('lodash/camelCase');
@@ -25,26 +25,23 @@ function Dadata(props) {
     const dadataInputProps = React.useMemo(() => {
         return {
             ...inputProps,
-            className: clsx('react-dadata__input', meta.active && 'input_state_focus', meta.error &&
-                meta.touched &&
+            className: clsx('react-dadata__input', meta?.active && 'input_state_focus', meta?.error &&
+                meta?.touched &&
                 `input_state_${meta.error.key || 'error'}`),
-            // https://www.npmjs.com/package/react-dadata
-            // "Свойство value игнорируется."
-            // value: input.value,
-            inputValue: input.value,
-            onBlur: input.onBlur,
-            onChange: input.onChange,
-            onFocus: input.onFocus,
+            inputValue: input?.value,
+            onBlur: input?.onBlur,
+            onChange: input?.onChange,
+            onFocus: input?.onFocus,
         };
     }, [
         inputProps,
-        meta.active,
-        meta.error,
-        meta.touched,
-        input.value,
-        input.onFocus,
-        input.onBlur,
-        input.onChange,
+        meta?.active,
+        meta?.error,
+        meta?.touched,
+        input?.value,
+        input?.onFocus,
+        input?.onBlur,
+        input?.onChange,
     ]);
     return (jsxRuntime.jsx(reactDadata.PartySuggestions, { minChars: 3, customInput: DadataCustomInput, "data-testid": dataTestId, "data-tour": dataTour, delay: delay || 750, inputProps: dadataInputProps, token: token, onChange: setValue }));
 }

package/dist/cjs/components/DatePeriod.js

@@ -7,17 +7,17 @@ var luxon = require('luxon');
 var common = require('@itcase/common');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var ChipsGroup = require('../../ChipsGroup_cjs_C-oThNwF.js');
-var DatePicker = require('../../DatePicker_cjs_CHxK5Rw8.js');
+var ChipsGroup = require('../../ChipsGroup_cjs_CT4DME-7.js');
+var DatePicker = require('../../DatePicker_cjs_DFbSO6Me.js');
 require('react-select');
-require('../../Icon_cjs_CQxDPPGY.js');
-var SelectContainer = require('../../SelectContainer_cjs_B2fgWgCE.js');
+require('../../Icon_cjs_DRdjXL7T.js');
+var SelectContainer = require('../../SelectContainer_cjs_DlpMN8W0.js');
 require('lodash/camelCase');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../context/Notifications.js');
 require('../context/UIContext.js');
-require('../../Group_cjs_CcDdC0Ua.js');
+require('../../Group_cjs_BGVwVJwS.js');
 require('lodash/castArray');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
@@ -26,53 +26,53 @@ require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks/useStyles/useStyles.js');
-require('../../Text_cjs_Co2XdYF-.js');
+require('../../Text_cjs_BJ9NgJkx.js');
 require('date-fns/locale');
 require('react-datepicker');
-require('../../Button_cjs_BLuRWxbc.js');
-require('../../Link_cjs_DqNtNI23.js');
-require('../../Loader_cjs_CP1xKwb-.js');
-require('../../Input_cjs_BUtZUZYh.js');
-require('../../Label_cjs_eckLVQqh.js');
+require('../../Button_cjs_Dvh0E0zz.js');
+require('../../Link_cjs_CmBw4h-N.js');
+require('../../Loader_cjs_BHMB4c8f.js');
+require('../../Input_cjs_B13aeHfj.js');
+require('../../Label_cjs_Kf3sYviA.js');
 require('@itcase/icons/default');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
 require('react-select/creatable');
-require('../../Divider_cjs_1fwsCxEb.js');
+require('../../Divider_cjs_DmIeh3Jq.js');
 
 const datePeriodAppearanceShape = {
     circular: {
         shape: 'circular',
     },
     rounded: {
-        shape: 'rounded',
         chipsShape: 'rounded',
         selectShape: 'rounded',
+        shape: 'rounded',
     },
     roundedXL: {
-        shape: 'rounded',
-        shapeStrength: '2m',
         chipsShape: 'rounded',
         selectShape: 'rounded',
+        shape: 'rounded',
+        shapeStrength: '2m',
     },
     roundedL: {
-        shape: 'rounded',
-        shapeStrength: '1_5m',
         chipsShape: 'rounded',
         selectShape: 'rounded',
+        shape: 'rounded',
+        shapeStrength: '1_5m',
     },
     roundedM: {
-        shape: 'rounded',
-        shapeStrength: '1m',
         chipsShape: 'rounded',
         selectShape: 'rounded',
+        shape: 'rounded',
+        shapeStrength: '1m',
     },
     roundedS: {
-        shape: 'rounded',
-        shapeStrength: '0_5m',
         chipsShape: 'rounded',
         selectShape: 'rounded',
+        shape: 'rounded',
+        shapeStrength: '0_5m',
     },
 };
 
@@ -137,7 +137,7 @@ function DatePeriod(props) {
     const onClickPeriodChips = React.useCallback((selectedPeriodItem) => {
         const dateStartIso = selectedPeriodItem.dateIntervalsList[0];
         const dateEndIso = selectedPeriodItem.dateIntervalsList[1];
-        onChangeDatePeriod(new Date(dateStartIso), new Date(dateEndIso));
+        onChangeDatePeriod?.(new Date(dateStartIso), new Date(dateEndIso));
     }, [onChangeDatePeriod]);
     const checkIsChipsActive = React.useCallback((targetPeriodItem) => {
         const dateStartIso = targetPeriodItem.dateIntervalsList[0];

package/dist/cjs/components/DatePicker.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var DatePicker = require('../../DatePicker_cjs_CHxK5Rw8.js');
+var DatePicker = require('../../DatePicker_cjs_DFbSO6Me.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -22,16 +22,16 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Button_cjs_BLuRWxbc.js');
-require('../../Icon_cjs_CQxDPPGY.js');
+require('../../Button_cjs_Dvh0E0zz.js');
+require('../../Icon_cjs_DRdjXL7T.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DqNtNI23.js');
-require('../../Text_cjs_Co2XdYF-.js');
-require('../../Loader_cjs_CP1xKwb-.js');
-require('../../Input_cjs_BUtZUZYh.js');
-require('../../Label_cjs_eckLVQqh.js');
+require('../../Link_cjs_CmBw4h-N.js');
+require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Loader_cjs_BHMB4c8f.js');
+require('../../Input_cjs_B13aeHfj.js');
+require('../../Label_cjs_Kf3sYviA.js');
 require('@itcase/icons/default');
 
 

package/dist/cjs/components/Divider.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Divider = require('../../Divider_cjs_1fwsCxEb.js');
+var Divider = require('../../Divider_cjs_DmIeh3Jq.js');
 require('react/jsx-runtime');
 require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');

package/dist/cjs/components/Drawer.js

@@ -6,9 +6,9 @@ var clsx = require('clsx');
 var ReactDrawer = require('react-modern-drawer');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Divider = require('../../Divider_cjs_1fwsCxEb.js');
-var Icon = require('../../Icon_cjs_CQxDPPGY.js');
-var Text = require('../../Text_cjs_Co2XdYF-.js');
+var Divider = require('../../Divider_cjs_DmIeh3Jq.js');
+var Icon = require('../../Icon_cjs_DRdjXL7T.js');
+var Text = require('../../Text_cjs_BJ9NgJkx.js');
 var _default = require('@itcase/icons/default');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -27,43 +27,23 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DqNtNI23.js');
+require('../../Link_cjs_CmBw4h-N.js');
 
 const drawerAppearanceSize = {
     sizeH3: {
         titleTextSize: 'h3',
         descTextSize: 's',
         dividerSize: 's',
-        iconSize: 24,
     },
 };
 
 const drawerAppearanceSurface = {
     surfacePrimary: {
-        fill: 'surfacePrimary',
-        fillHover: 'surfacePrimaryHover',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
         closeIcon: _default.icons24.Action.Close,
         closeIconFillIcon: 'surfaceItemPrimary',
     },
-    surfaceSecondary: {
-        fill: 'surfaceSecondary',
-        fillHover: 'surfaceSecondaryHover',
-        labelTextColor: 'surfaceTextPrimary',
-        loaderFill: 'surfaceSecondary',
-        loaderItemFill: 'surfaceItemPrimary',
-    },
-    surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
-        labelTextColor: 'surfaceTextPrimary',
-    },
-    surfaceQuaternary: {
-        fill: 'surfaceQuaternary',
-        fillHover: 'surfaceQuaternaryHover',
-        labelTextColor: 'surfaceTextPrimary',
-    },
 };
 
 const drawerAppearance = {
@@ -71,12 +51,10 @@ const drawerAppearance = {
     ...drawerAppearanceSurface,
 };
 
-// https://github.com/Farzin-Firoozi/react-modern-drawer
-const ANIMATION_DURATION = 300; // default value is 300
+const ANIMATION_DURATION = 300;
 const ANIMATION_STATE_SNAPSHOTS = {
     DEFAULT: {
         isInDOM: true,
-        // start from 'false' to trigger 'enter' animation
         isOpen: false,
     },
     ENTER_FINISH: {
@@ -97,8 +75,7 @@ const drawerConfig = {
 };
 function Drawer(props) {
     const { appearance, className, dataTestId, dataTour, type, title, desc, enableOverlay, lockBackgroundScroll = true, stickyButton, before, after, close, isOpen, isOpenModal, onClickClose, onClose, children, } = props;
-    // compatibility with old 'closeModal' prop
-    const _onClickClose = onClickClose ?? props.closeModal;
+    const _onClickClose = onClickClose ?? onClose;
     const _isOpen = isOpen ?? isOpenModal;
     const isOpenPrevRef = React.useRef(Boolean(_isOpen));
     const isFirstRenderRef = React.useRef(true);
@@ -121,14 +98,12 @@ function Drawer(props) {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [_isOpen, onClose]);
-    // manage 'enter' and 'exit' animations
     React.useEffect(() => {
         if (isFirstRenderRef.current) {
             isFirstRenderRef.current = false;
             return;
         }
         setAnimationState(ANIMATION_STATE_SNAPSHOTS.DEFAULT);
-        // 16ms delay to prevent react from batching updates
         const startTransitionDelay = 16;
         const timeoutDelay = _isOpen ? startTransitionDelay : ANIMATION_DURATION;
         const timeout = setTimeout(() => {
@@ -143,9 +118,7 @@ function Drawer(props) {
     if (!animationState.isInDOM) {
         return null;
     }
-    return (jsxRuntime.jsxs(ReactDrawer, { className: clsx('drawer', type && `drawer_type_${type}`, className, dataTour && `dataTour-${dataTour}`, stickyButton && 'drawer_sticky-button', zeroPadding && 'drawer_reset-padding'), direction: direction || 'right', size: size || 600, 
-        // Drawer set prefix "EZDrawer" for any id
-        customIdSuffix: dataTestId ? `_${dataTestId}` : undefined, "data-testid": dataTestId, "data-tour": dataTour, duration: ANIMATION_DURATION, enableOverlay: enableOverlay, lockBackgroundScroll: lockBackgroundScroll, overlayClassName: "drawer__overlay", open: animationState.isOpen, onClose: _onClickClose, children: [before && jsxRuntime.jsx("div", { className: "drawer__before", children: before }), !close && (closeIcon || closeIconSrc) && (jsxRuntime.jsx("div", { className: "drawer__close", children: jsxRuntime.jsx(Icon.Icon, { className: "cursor_type_pointer", fill: closeIconFill, fillSize: closeIconFillSize, iconFill: closeIconFillIcon, iconSize: closeIconSize, imageSrc: closeIconSrc, shape: closeIconShape, SvgImage: closeIcon, onClick: _onClickClose }) })), (title || desc) && (jsxRuntime.jsxs("div", { className: "drawer__header", children: [jsxRuntime.jsx(Icon.Title, { className: "drawer__header-title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title }), jsxRuntime.jsx(Text.Text, { className: "drawer__header-desc", size: descTextSize, textColor: descTextColor, children: desc })] })), divider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", size: dividerSize, fill: "surfaceTertiary" })), children && jsxRuntime.jsx("div", { className: "drawer__wrapper", children: children }), after && jsxRuntime.jsx("div", { className: "drawer__after", children: after })] }));
+    return (jsxRuntime.jsxs(ReactDrawer, { className: clsx('drawer', type && `drawer_type_${type}`, className, dataTour && `dataTour-${dataTour}`, stickyButton && 'drawer_sticky-button', zeroPadding && 'drawer_reset-padding'), direction: direction || 'right', size: size || 600, customIdSuffix: dataTestId ? `_${dataTestId}` : undefined, "data-testid": dataTestId, "data-tour": dataTour, duration: ANIMATION_DURATION, enableOverlay: enableOverlay, lockBackgroundScroll: lockBackgroundScroll, overlayClassName: "drawer__overlay", open: animationState.isOpen, onClose: _onClickClose, children: [before && jsxRuntime.jsx("div", { className: "drawer__before", children: before }), !close && (closeIcon || closeIconSrc) && (jsxRuntime.jsx("div", { className: "drawer__close", children: jsxRuntime.jsx(Icon.Icon, { className: "cursor_type_pointer", fill: closeIconFill, fillSize: closeIconFillSize, iconFill: closeIconFillIcon, iconSize: closeIconSize, imageSrc: closeIconSrc, shape: closeIconShape, SvgImage: closeIcon, onClick: _onClickClose }) })), (title || desc) && (jsxRuntime.jsxs("div", { className: "drawer__header", children: [jsxRuntime.jsx(Icon.Title, { className: "drawer__header-title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title }), jsxRuntime.jsx(Text.Text, { className: "drawer__header-desc", size: descTextSize, textColor: descTextColor, children: desc })] })), divider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", size: dividerSize, fill: "surfaceTertiary" })), children && jsxRuntime.jsx("div", { className: "drawer__wrapper", children: children }), after && jsxRuntime.jsx("div", { className: "drawer__after", children: after })] }));
 }
 
 exports.Drawer = Drawer;

package/dist/cjs/components/Dropdown.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var DropdownItem = require('../../DropdownItem_cjs_DUtEvTHI.js');
+var DropdownItem = require('../../DropdownItem_cjs_Aun30hgm.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -20,13 +20,13 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_CQxDPPGY.js');
+require('../../Icon_cjs_DRdjXL7T.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DqNtNI23.js');
-require('../../Text_cjs_Co2XdYF-.js');
-require('../../Divider_cjs_1fwsCxEb.js');
+require('../../Link_cjs_CmBw4h-N.js');
+require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Divider_cjs_DmIeh3Jq.js');
 
 
 

package/dist/cjs/components/Flex.js

@@ -25,7 +25,7 @@ function Flex(props) {
     const { directionClass, justifyContentClass, alignContentClass, alignItemsClass, fillClass, borderColorClass, borderTypeClass, flowClass, positionClass, shapeClass, widthClass, wrapClass, } = propsGenerator;
     // @ts-expect-error
     const { styles: flexStyles, wrapper: flexWrapperStyles } = useStyles.useStyles(props);
-    return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'flex', widthClass && `width_${widthClass}`, alignContentClass && `flex_align-content_${alignContentClass}`, alignItemsClass && `flex_align-items_${alignItemsClass}`, directionClass && `flex_direction_${directionClass}`, fillClass && `fill_${fillClass}`, flowClass && `flex_flow_${flowClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, positionClass && `position_${positionClass}`, justifyContentClass && `flex_justify-content_${justifyContentClass}`, shapeClass && `flex_shape_${shapeClass}`, type && `flex_type_${type}`, print === false && 'no-print', print === true && 'print', wrapClass && `flex_wrap_${wrapClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, flexStyles, style), onClick: onClick, children: jsxRuntime.jsx("div", { className: "flex__wrapper", style: flexWrapperStyles, children: children }) }));
+    return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'flex', widthClass && `width_${widthClass}`, alignContentClass && `flex_align-content_${alignContentClass}`, alignItemsClass && `flex_align-items_${alignItemsClass}`, directionClass && `flex_direction_${directionClass}`, fillClass && `fill_${fillClass}`, flowClass && `flex_flow_${flowClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, positionClass && `position_${positionClass}`, justifyContentClass && `flex_justify-content_${justifyContentClass}`, shapeClass && `flex_shape_${shapeClass}`, type && `flex_type_${type}`, !print && 'no-print', print && 'print', wrapClass && `flex_wrap_${wrapClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, flexStyles, style), onClick: onClick, children: jsxRuntime.jsx("div", { className: "flex__wrapper", style: flexWrapperStyles, children: children }) }));
 }
 
 function FlexItem(props) {
@@ -35,7 +35,7 @@ function FlexItem(props) {
     // @ts-expect-error
     const { styles: flexItemStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx(Tag, { className: clsx(className, 'flex__item', positionClass && `position_${positionClass}`, alignItemsClass && `flex__item_align-items_${alignItemsClass}`, alignSelfClass && `flex__item_align-self_${alignSelfClass}`, directionClass && `flex__item_direction_${directionClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, growClass && `flex__item_grow_${growClass}`, justifyContentClass &&
-            `flex__item_justify-content_${justifyContentClass}`, shapeClass && `flex__item_shape_${shapeClass}`, print === false && 'no-print', print === true && 'print', widthClass && `width_${widthClass}`, wrapClass && `flex__item_wrap_${wrapClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, flexItemStyles, style), children: children }));
+            `flex__item_justify-content_${justifyContentClass}`, shapeClass && `flex__item_shape_${shapeClass}`, !print && 'no-print', print && 'print', widthClass && `width_${widthClass}`, wrapClass && `flex__item_wrap_${wrapClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, flexItemStyles, style), children: children }));
 }
 
 exports.Flex = Flex;

package/dist/cjs/components/Grid.js

@@ -25,7 +25,7 @@ function Grid(props) {
     const { justifyContentClass, justifyItemsClass, alignContentClass, alignItemsClass, fillClass, fillHoverClass, borderColorClass, columnGapClass, columnsClass, heightClass, rowGapClass, rowsClass, widthClass, } = propsGenerator;
     // @ts-expect-error
     const { styles: gridStyles } = useStyles.useStyles(props);
-    return (jsxRuntime.jsxs(Tag, { id: id, className: clsx(className, 'grid', widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, useGridSystem && `grid_state_system`, horizontalScroll && `grid_scroll_horizontal`, type && `grid_type_${type}`, columnsClass && `grid_columns_${columnsClass}`, rowsClass && `grid_rows_${rowsClass}`, rowGapClass && `grid_row-gap_${rowGapClass}`, columnGapClass && `grid_column-gap_${columnGapClass}`, alignContentClass && `grid_align-content_${alignContentClass}`, alignItemsClass && `grid_align-items_${alignItemsClass}`, borderColorClass && `border-color_${borderColorClass}`, justifyContentClass && `grid_justify-content_${justifyContentClass}`, justifyItemsClass && `grid_justify-items_${justifyItemsClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, horizontalResizing && `grid_horizontal-resizing_${horizontalResizing}`, verticalResizing && `grid_vertical-resizing_${verticalResizing}`, print === false && 'no-print', print === true && 'print'), "data-testid": dataTestId, "data-tour": dataTour, style: gridStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before && jsxRuntime.jsx("div", { className: "grid__before", children: before }), children, after && jsxRuntime.jsx("div", { className: "grid__after", children: after })] }));
+    return (jsxRuntime.jsxs(Tag, { id: id, className: clsx(className, 'grid', widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, useGridSystem && `grid_state_system`, horizontalScroll && `grid_scroll_horizontal`, type && `grid_type_${type}`, columnsClass && `grid_columns_${columnsClass}`, rowsClass && `grid_rows_${rowsClass}`, rowGapClass && `grid_row-gap_${rowGapClass}`, columnGapClass && `grid_column-gap_${columnGapClass}`, alignContentClass && `grid_align-content_${alignContentClass}`, alignItemsClass && `grid_align-items_${alignItemsClass}`, borderColorClass && `border-color_${borderColorClass}`, justifyContentClass && `grid_justify-content_${justifyContentClass}`, justifyItemsClass && `grid_justify-items_${justifyItemsClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, horizontalResizing && `grid_horizontal-resizing_${horizontalResizing}`, verticalResizing && `grid_vertical-resizing_${verticalResizing}`, !print && 'no-print', print && 'print'), "data-testid": dataTestId, "data-tour": dataTour, style: gridStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before && jsxRuntime.jsx("div", { className: "grid__before", children: before }), children, after && jsxRuntime.jsx("div", { className: "grid__after", children: after })] }));
 }
 
 function GridItem(props) {
@@ -43,7 +43,7 @@ function GridRow(props) {
     const { fillClass, fillHoverClass, borderColorClass, heightClass, widthClass, } = propsGenerator;
     // @ts-expect-error
     const { styles: gridRowStyles } = useStyles.useStyles(props);
-    return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'grid__row', widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, print === false && 'no-print', print === true && 'print', borderColorClass && `border-color_${borderColorClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: gridRowStyles, onClick: onClick, children: children }));
+    return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'grid__row', widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, !print && 'no-print', print && 'print', borderColorClass && `border-color_${borderColorClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: gridRowStyles, onClick: onClick, children: children }));
 }
 
 exports.Grid = Grid;