@itcase/ui 1.9.36 → 1.9.38

package/dist/cjs/components/InputPassword.js

@@ -6,7 +6,7 @@ var React = require('react');
 var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Icon = require('../../Icon_cjs_CQxDPPGY.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -24,17 +24,15 @@ require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Link_cjs_DqNtNI23.js');
-require('../../Text_cjs_Co2XdYF-.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 const inputPasswordAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
         iconRevealableShow: _default.icons24.View.ShowValue,
@@ -43,10 +41,8 @@ const inputPasswordAppearanceDefault = {
     defaultSecondary: {
         fill: 'surfacePrimary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
         iconRevealableShow: _default.icons24.View.ShowValue,
@@ -56,9 +52,8 @@ const inputPasswordAppearanceDefault = {
 
 const inputPasswordAppearanceDisabled = {
     disabledPrimary: {
-        fill: 'surfaceFillDisabled',
+        fill: 'surfaceDisabled',
         borderColor: 'errorBorderQuaternary',
-        borderHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
@@ -68,7 +63,6 @@ const inputPasswordAppearanceDisabled = {
     disabledSecondary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
         iconRevealableShow: _default.icons24.View.ShowValue,
@@ -80,7 +74,6 @@ const inputPasswordAppearanceError = {
     errorPrimary: {
         fill: 'errorTertiary',
         borderColor: 'errorBorderQuaternary',
-        borderHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
@@ -90,7 +83,6 @@ const inputPasswordAppearanceError = {
     errorSecondary: {
         fill: 'errorSecondary',
         borderColor: 'errorBorderTertiary',
-        borderHover: 'errorBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
         iconRevealableShow: _default.icons24.View.ShowValue,
@@ -102,7 +94,6 @@ const inputPasswordAppearanceRequire = {
     requirePrimary: {
         fill: 'warningTertiary',
         borderColor: 'warningBorderQuaternary',
-        borderHover: 'warningBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
@@ -112,7 +103,6 @@ const inputPasswordAppearanceRequire = {
     requireSecondary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
         iconRevealableShow: _default.icons24.View.ShowValue,
@@ -149,43 +139,36 @@ const inputPasswordAppearanceSize = {
     sizeXXL: {
         size: 'xxl',
         textSize: 'l',
-        iconFillSize: '24',
         iconSize: '24',
     },
     sizeXL: {
         size: 'xl',
         textSize: 's',
-        iconFillSize: '24',
         iconSize: '24',
     },
     sizeL: {
         size: 'l',
         textSize: 's',
-        iconFillSize: '24',
         iconSize: '24',
     },
     sizeM: {
         size: 'm',
         textSize: 'm',
-        iconFillSize: '24',
         iconSize: '24',
     },
     sizeS: {
         size: 's',
         textSize: 's',
-        iconFillSize: '24',
         iconSize: '24',
     },
     sizeXS: {
         size: 'xs',
         textSize: 's',
-        iconFillSize: '24',
         iconSize: '24',
     },
     sizeXXS: {
         size: 'xxs',
         textSize: 's',
-        iconFillSize: '24',
         iconSize: '24',
     },
 };
@@ -210,7 +193,6 @@ const inputPasswordAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
         borderColor: 'successBorderQuaternary',
-        borderHover: 'successBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
@@ -220,7 +202,6 @@ const inputPasswordAppearanceSuccess = {
     successSecondary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
         iconRevealableShow: _default.icons24.View.ShowValue,
@@ -260,7 +241,7 @@ function InputPassword(props) {
     const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, iconFill, iconFillHover, iconRevealableHide, iconRevealableShow, iconShape, iconSize, imageRevealableHide, imageRevealableShow, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
     return (jsxRuntime.jsxs("div", { className: "input-password", children: [jsxRuntime.jsx("input", { id: String(id), className: clsx(className, 'input-password__input', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass &&
                     `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
-                    `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input-password__input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: inputType, "data-testid": dataTestId || (name ? `${name}-input-password` : 'input-password'), "data-tour": dataTour, disabled: isDisabled, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }), jsxRuntime.jsx(Icon.Icon, { className: "input-password__icon", size: iconSize, iconFill: iconFill, iconFillHover: iconFillHover, imageSrc: isRevealed ? imageRevealableHide : imageRevealableShow, shape: iconShape, SvgImage: isRevealed ? iconRevealableHide : iconRevealableShow, onClick: onClickIconReveal })] }));
+                    `placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input-password__input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: inputType, "data-testid": dataTestId || (name ? `${name}-input-password` : 'input-password'), "data-tour": dataTour, "date-testid": dataTestId, disabled: isDisabled, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }), jsxRuntime.jsx(Icon.Icon, { className: "input-password__icon", size: iconSize, iconFill: iconFill, iconFillHover: iconFillHover, imageSrc: isRevealed ? imageRevealableHide : imageRevealableShow, shape: iconShape, SvgImage: isRevealed ? iconRevealableHide : iconRevealableShow, onClick: onClickIconReveal })] }));
 }
 
 exports.InputPassword = InputPassword;

package/dist/cjs/components/Label.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Label = require('../../Label_cjs_eckLVQqh.js');
+var Label = require('../../Label_cjs_DlbcXQX4.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -20,12 +20,12 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_CQxDPPGY.js');
+require('../../Icon_cjs_D20B2YBo.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_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 
 

package/dist/cjs/components/Link.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Link = require('../../Link_cjs_DqNtNI23.js');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');

package/dist/cjs/components/List.js

@@ -5,7 +5,7 @@ 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 Link = require('../../Link_cjs_DqNtNI23.js');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -22,200 +22,124 @@ require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 
 const listAppearanceAccent = {
-    accent: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-    },
     accentPrimary: {
         fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
+        fillHover: 'accentHoverPrimary',
         borderColor: 'accentBorderPrimary',
     },
-    accentSecondary: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        labelTextColor: 'accentTextSecondary',
-        labelTextColorHover: 'accentTextSecondary',
-        borderColor: 'accentBorderPrimary',
-        loaderFill: 'accentPrimary',
-        loaderItemFill: 'accentItemPrimary',
-    },
 };
 
 const listAppearanceDanger = {
-    danger: {
+    dangerPrimary: {
         fill: 'dangerPrimary',
-        fillHover: 'dangerPrimaryHover',
+        fillHover: 'dangerHoverPrimary',
     },
 };
 
 const listAppearanceError = {
-    error: {
+    errorPrimary: {
         fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
-        labelTextColor: 'errorTextPrimary',
-        labelTextColorHover: 'errorTextPrimary',
-        loaderFill: 'errorPrimary',
-        loaderItemFill: 'errorItemPrimary',
+        fillHover: 'errorHoverPrimary',
+    },
+};
+
+const listAppearanceExtra = {
+    extraPrimary: {
+        fill: 'extraPrimary',
+        fillHover: 'extraHoverPrimary',
     },
 };
 
 const listAppearanceInfo = {
-    info: {
+    infoPrimary: {
         fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        labelTextColor: 'accentTextPrimary',
-        labelTextColorHover: 'accentTextPrimary',
+        fillHover: 'accentHoverPrimary',
         borderColor: 'accentBorderPrimary',
-        loaderFill: 'accentPrimary',
-        loaderItemFill: 'accentItemPrimary',
     },
     infoSecondary: {
         fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        labelTextColor: 'accentTextSecondary',
-        labelTextColorHover: 'accentTextSecondary',
+        fillHover: 'accentHoverPrimary',
         borderColor: 'accentBorderPrimary',
-        loaderFill: 'accentPrimary',
-        loaderItemFill: 'accentItemPrimary',
-    },
-};
-
-const listAppearancePrimary = {
-    primary: {
-        fill: 'primaryPrimary',
-        fillHover: 'primaryPrimaryHover',
-        labelTextColor: 'primaryTextPrimary',
-    },
-};
-
-const listAppearanceSecondary = {
-    secondary: {
-        fill: 'secondaryPrimary',
-        fillHover: 'secondaryPrimaryHover',
-        labelTextColor: 'secondaryTextPrimary',
     },
 };
 
 const listAppearanceSize = {
     sizeXXL: {
         size: 'xxl',
-        labelTextSize: 'xxl',
-        iconAfterFillSize: '24',
-        iconAfterSize: '24',
-        iconBeforeFillSize: '24',
-        iconBeforeSize: '24',
     },
     sizeXL: {
         size: 'xl',
-        labelTextSize: 'l',
-        iconAfterFillSize: '20',
-        iconAfterSize: '20',
-        iconBeforeFillSize: '20',
-        iconBeforeSize: '20',
     },
     sizeL: {
         size: 'l',
-        labelTextSize: 'l',
-        iconAfterFillSize: '18',
-        iconAfterSize: '18',
-        iconBeforeFillSize: '18',
-        iconBeforeSize: '18',
     },
     sizeM: {
         size: 'm',
-        labelTextSize: 'm',
-        iconAfterFillSize: '16',
-        iconAfterSize: '16',
-        iconBeforeFillSize: '16',
-        iconBeforeSize: '16',
     },
     sizeS: {
         size: 's',
-        labelTextSize: 's',
-        iconAfterFillSize: '14',
-        iconAfterSize: '14',
-        iconBeforeFillSize: '14',
-        iconBeforeSize: '14',
     },
     sizeXS: {
         size: 'xs',
-        labelTextSize: 'xs',
-        iconAfterFillSize: '12',
-        iconAfterSize: '12',
-        iconBeforeFillSize: '12',
-        iconBeforeSize: '12',
     },
     sizeXXS: {
         size: 'xxs',
-        labelTextSize: 'xs',
-        iconAfterFillSize: '10',
-        iconAfterSize: '10',
-        iconBeforeFillSize: '10',
-        iconBeforeSize: '10',
     },
 };
 
-const listAppearanceStyle = {
-    full: {
-        borderColor: '0',
+const listAppearanceSpecial = {
+    specialPrimary: {
+        fill: 'specialPrimary',
+        fillHover: 'specialHoverPrimary',
     },
-    ghost: {
-        fill: 'none',
-        borderColor: '0',
+};
+
+const listAppearanceStyle = {
+    solid: {
+        borderColor: 'none',
     },
     outlined: {
         fill: 'none',
     },
-    solid: {
-        borderColor: '0',
+    full: {
+        borderColor: 'none',
+    },
+    ghost: {
+        fill: 'none',
+        borderColor: 'none',
     },
 };
 
 const listAppearanceSuccess = {
-    success: {
+    successPrimary: {
         fill: 'successPrimary',
-        fillHover: 'successPrimaryHover',
-        labelTextColor: 'successTextSecondary',
-        labelTextColorHover: 'successTextSecondary',
-        loaderFill: 'successPrimary',
-        loaderItemFill: 'successItemPrimary',
+        fillHover: 'successHoverPrimary',
     },
 };
 
 const listAppearanceSurface = {
     surfacePrimary: {
         fill: 'surfacePrimary',
-        fillHover: 'surfacePrimaryHover',
-        labelTextColor: 'surfaceTextPrimary',
+        fillHover: 'surfaceHoverPrimary',
     },
     surfaceQuaternary: {
         fill: 'surfaceQuaternary',
-        fillHover: 'surfaceQuaternaryHover',
-        labelTextColor: 'surfaceTextPrimary',
+        fillHover: 'surfaceHoverQuaternary',
     },
     surfaceSecondary: {
         fill: 'surfaceSecondary',
-        fillHover: 'surfaceSecondaryHover',
-        labelTextColor: 'surfaceTextPrimary',
-        loaderFill: 'surfaceSecondary',
-        loaderItemFill: 'surfaceItemPrimary',
+        fillHover: 'surfaceHoverSecondary',
     },
     surfaceTertiary: {
         fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
-        labelTextColor: 'surfaceTextPrimary',
+        fillHover: 'surfaceHoverTertiary',
     },
 };
 
 const listAppearanceWarning = {
-    warning: {
+    warningPrimary: {
         fill: 'warningPrimary',
-        fillHover: 'warningPrimaryHover',
-        labelTextColor: 'warningTextSecondary',
-        labelTextColorHover: 'warningTextSecondary',
-        loaderFill: 'warningPrimary',
-        loaderItemFill: 'warningItemPrimary',
+        fillHover: 'warningHoverPrimary',
     },
 };
 
@@ -226,8 +150,8 @@ const listAppearance = {
     ...listAppearanceDanger,
     ...listAppearanceError,
     ...listAppearanceInfo,
-    ...listAppearancePrimary,
-    ...listAppearanceSecondary,
+    ...listAppearanceSpecial,
+    ...listAppearanceExtra,
     ...listAppearanceSuccess,
     ...listAppearanceSurface,
     ...listAppearanceWarning,
@@ -240,7 +164,6 @@ function List(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, listConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, bulletFillClass, bulletSizeClass, bulletTextColorClass, sizeClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: ulStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx("ul", { className: clsx(className, 'list', bulletSizeClass && `list_bullet-size_${bulletSizeClass}`, bulletFillClass && `list_bullet-fill_${bulletFillClass}`, bulletTextColorClass &&
             `list_bullet-text-color_${bulletTextColorClass}`, directionClass && `list_direction_${directionClass}`, sizeClass && `list_size_${sizeClass}`, style && `list_style_${style}`, type && `list_type_${type}`), "data-testid": dataTestId, "data-tour": dataTour, style: ulStyles, children: children }));
@@ -250,7 +173,6 @@ function ListItem(props) {
     const { className, dataTestId, dataTour, text, href, link, before, after, children, } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { fillClass, textColorClass, textStyleClass, textWeightClass } = propsGenerator;
-    // @ts-expect-error
     const { link: linkStyles, styles: liStyles } = useStyles.useStyles(props);
     if (link) {
         return (jsxRuntime.jsx("li", { className: clsx(className, 'list__item', 'list__item_type_link', textStyleClass && `text text-style_${textStyleClass}`, textWeightClass && `text text-weight_${textWeightClass}`, textColorClass && `text-color_${textColorClass}`, fillClass && `fill_${fillClass}`), style: liStyles, children: jsxRuntime.jsx(Link.Link, { className: clsx('list__item-link'), href: link || href, style: linkStyles, children: children || text }) }));

package/dist/cjs/components/Loader.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Loader = require('../../Loader_cjs_CP1xKwb-.js');
+var Loader = require('../../Loader_cjs_DMIUN6_q.js');
 require('react/jsx-runtime');
 require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
@@ -20,7 +20,7 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Text_cjs_Co2XdYF-.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 
 

package/dist/cjs/components/Logo.js

@@ -1,13 +1,13 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var clsx = require('clsx');
 var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Link = require('../../Link_cjs_DqNtNI23.js');
-require('react');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
 require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
 require('lodash/camelCase');
@@ -29,14 +29,14 @@ const logoConfig = {
         logoConfig.appearance = appearanceConfig;
     },
 };
-const Logo = urlWithAssetPrefix.urlWithAssetPrefix(function Logo(props) {
-    const { appearance, className, dataTestId, dataTour, href, link } = props;
+const Logo = urlWithAssetPrefix.urlWithAssetPrefix(React.forwardRef(function Logo(props, ref) {
+    const { appearance, className, dataTestId, dataTour, href, link, isSkeleton, } = props;
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, logoConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { alignClass, alignDirectionClass, alignItemsClass, src, title, alt, sizeClass, widthClass, } = propsGenerator;
     const { styles: logo } = useStyles.useStyles(props);
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'logo', alignClass && `align_${alignClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignItemsClass && `logo_align-items_${alignItemsClass}`, sizeClass && `logo_size_${sizeClass}`, widthClass && `width_${widthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: logo, children: link || href ? (jsxRuntime.jsx(Link.LinkWrapper, { className: "logo__link", href: link || href, children: jsxRuntime.jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title }) })) : (jsxRuntime.jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title })) }));
-});
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'logo', isSkeleton && 'logo_mode_skeleton', alignClass && `align_${alignClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignItemsClass && `logo_align-items_${alignItemsClass}`, sizeClass && `logo_size_${sizeClass}`, widthClass && `width_${widthClass}`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: logo, children: link || href ? (jsxRuntime.jsx(Link.LinkWrapper, { className: "logo__link", href: link || href, children: jsxRuntime.jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title }) })) : (jsxRuntime.jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title })) }));
+}));
 
 exports.Logo = Logo;
 exports.logoConfig = logoConfig;

package/dist/cjs/components/MenuItem.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 Link = require('../../Link_cjs_DqNtNI23.js');
-var Text = require('../../Text_cjs_Co2XdYF-.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -29,7 +29,7 @@ require('../context/UrlAssetPrefix.js');
 const menuItemAppearanceAccent = {
     accentMutedPrimary: {
         fill: 'accentTertiary',
-        fillHover: 'accentTertiaryHover',
+        fillHover: 'accentTertiary',
         labelTextColor: 'accentTextQuaternary',
         borderColor: 'accentBorderSecondary',
         iconAfterFillIcon: 'accentItemQuaternary',
@@ -55,7 +55,7 @@ const menuItemAppearanceAccent = {
 
 const menuItemAppearanceError = {
     errorMutedPrimary: {
-        fill: 'errorDisabled',
+        fill: 'errorTertiary',
         labelTextColor: 'errorTextQuaternary',
         labelTextColorHover: 'errorTextQuaternary',
         iconAfterFillIcon: 'errorItemQuaternary',
@@ -63,7 +63,7 @@ const menuItemAppearanceError = {
     },
     errorPrimary: {
         fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
+        fillHover: 'errorPrimary',
         labelTextColor: 'errorTextPrimary',
         labelTextColorHover: 'errorTextPrimary',
         borderColor: 'errorBorderSecondary',
@@ -162,7 +162,7 @@ const menuItemAppearanceSurface = {
     surfaceMutedPrimary: {
         fill: 'surfaceSecondary',
         fillActive: 'surfacePrimary',
-        fillActiveHover: 'surfaceHover',
+        fillActiveHover: 'surfacePrimary',
         labelTextColor: 'surfaceTextQuaternary',
         iconAfterFillIcon: 'surfaceItemQuaternary',
         iconBeforeFillIcon: 'surfaceItemQuaternary',
@@ -170,7 +170,7 @@ const menuItemAppearanceSurface = {
     surfacePrimary: {
         fill: 'surfacePrimary',
         fillActive: 'surfaceSecondary',
-        fillActiveHover: 'surfaceTertiary',
+        fillActiveHover: 'surfaceSecondary',
         fillHover: 'surfaceSecondary',
         labelTextActiveColor: 'accentTextSecondary',
         labelTextActiveColorHover: 'accentTextSecondary',
@@ -182,13 +182,13 @@ const menuItemAppearanceSurface = {
     },
     surfaceQuaternary: {
         fill: 'surfaceQuaternary',
-        fillHover: 'surfaceQuaternaryHover',
+        fillHover: 'surfaceQuaternary',
         labelTextColor: 'surfaceTextPrimary',
     },
     surfaceSecondary: {
         fill: 'surfacePrimary',
-        fillActive: 'surfaceHover',
-        fillActiveHover: 'surfaceHover',
+        fillActive: 'surfaceSecondary',
+        fillActiveHover: 'surfaceTertiary',
         fillHover: 'surfaceSecondary',
         labelTextActiveColor: 'accentTextSecondary',
         labelTextActiveColorHover: 'surfaceTextPrimary',
@@ -197,8 +197,8 @@ const menuItemAppearanceSurface = {
         iconBeforeFillIcon: 'surfaceItemPrimary',
     },
     surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
+        fill: 'surfaceSecondary',
+        fillHover: 'surfaceTertiary',
         labelTextColor: 'surfaceTextPrimary',
     },
 };
@@ -214,8 +214,8 @@ const menuItemAppearance = {
 
 const menuItemConfig = {
     appearance: menuItemAppearance,
-    setAppearance: (appearanceConfig) => {
-        MenuItemConfig.appearance = appearanceConfig;
+    setAppearance: function (appearanceConfig) {
+        this.appearance = appearanceConfig;
     },
 };
 function MenuItem(props) {
@@ -234,7 +234,6 @@ function MenuItem(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, menuItemConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorDisabled, labelTextColorHover, labelTextSize, labelWeight, labelWrap, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, tooltipFill, tooltipShape, tooltipShapeStrength, tooltipSize, tooltipText, tooltipTextColor, tooltipTextSize, tooltipTitle, tooltipTitleTextColor, typeClass, widthClass, isSkeleton, } = propsGenerator;
-    // @ts-expect-error
     const { styles: menuItem } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { className: clsx('menu-item', easing && `easing_${easing}`, isActive && 'menu-item_state_active', isDisabled && `menu-item_state_disabled`, directionClass && `menu-item_direction_${directionClass}`, className, (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc) &&
             'menu-item_label-icon', sizeClass && `menu-item_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, !isActive