@itcase/ui 1.9.36 → 1.9.38

package/dist/components/InputPassword.js

@@ -4,7 +4,7 @@ import { useState, useMemo, useCallback } from 'react';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { I as Icon } from '../Icon_es_Banbw98_.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -22,17 +22,15 @@ import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Link_es_Bt-Bhy3t.js';
-import '../Text_es_DaYcLe4H.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const inputPasswordAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
         iconRevealableShow: icons24.View.ShowValue,
@@ -41,10 +39,8 @@ const inputPasswordAppearanceDefault = {
     defaultSecondary: {
         fill: 'surfacePrimary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
-        caret: 'secondaryItemSecondary',
+        caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
         iconRevealableShow: icons24.View.ShowValue,
@@ -54,9 +50,8 @@ const inputPasswordAppearanceDefault = {
 
 const inputPasswordAppearanceDisabled = {
     disabledPrimary: {
-        fill: 'surfaceFillDisabled',
+        fill: 'surfaceDisabled',
         borderColor: 'errorBorderQuaternary',
-        borderHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
@@ -66,7 +61,6 @@ const inputPasswordAppearanceDisabled = {
     disabledSecondary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
         iconRevealableShow: icons24.View.ShowValue,
@@ -78,7 +72,6 @@ const inputPasswordAppearanceError = {
     errorPrimary: {
         fill: 'errorTertiary',
         borderColor: 'errorBorderQuaternary',
-        borderHover: 'errorBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
@@ -88,7 +81,6 @@ const inputPasswordAppearanceError = {
     errorSecondary: {
         fill: 'errorSecondary',
         borderColor: 'errorBorderTertiary',
-        borderHover: 'errorBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
         iconRevealableShow: icons24.View.ShowValue,
@@ -100,7 +92,6 @@ const inputPasswordAppearanceRequire = {
     requirePrimary: {
         fill: 'warningTertiary',
         borderColor: 'warningBorderQuaternary',
-        borderHover: 'warningBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
@@ -110,7 +101,6 @@ const inputPasswordAppearanceRequire = {
     requireSecondary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
         iconRevealableShow: icons24.View.ShowValue,
@@ -147,43 +137,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',
     },
 };
@@ -208,7 +191,6 @@ const inputPasswordAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
         borderColor: 'successBorderQuaternary',
-        borderHover: 'successBorderQuaternary',
         textColor: 'surfaceTextPrimary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
@@ -218,7 +200,6 @@ const inputPasswordAppearanceSuccess = {
     successSecondary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
         iconRevealableShow: icons24.View.ShowValue,
@@ -258,7 +239,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 (jsxs("div", { className: "input-password", children: [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 }), jsx(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 }), jsx(Icon, { className: "input-password__icon", size: iconSize, iconFill: iconFill, iconFillHover: iconFillHover, imageSrc: isRevealed ? imageRevealableHide : imageRevealableShow, shape: iconShape, SvgImage: isRevealed ? iconRevealableHide : iconRevealableShow, onClick: onClickIconReveal })] }));
 }
 
 export { InputPassword, inputPasswordAppearance, inputPasswordConfig };

package/dist/components/Label.js

@@ -1,4 +1,4 @@
-export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_DuDL0-3C.js';
+export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_CbXFs_ts.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -18,9 +18,9 @@ import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Icon_es_Banbw98_.js';
+import '../Icon_es_DNVHNKFK.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_Bt-Bhy3t.js';
-import '../Text_es_DaYcLe4H.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';

package/dist/components/Link.js

@@ -1,4 +1,4 @@
-export { L as Link, a as LinkWrapper, b as linkAppearance, l as linkConfig } from '../Link_es_Bt-Bhy3t.js';
+export { L as Link, a as LinkWrapper, b as linkAppearance, l as linkConfig } from '../Link_es_BwLH5S8y.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/components/List.js

@@ -3,7 +3,7 @@ import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { L as Link } from '../Link_es_Bt-Bhy3t.js';
+import { L as Link } from '../Link_es_BwLH5S8y.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -20,200 +20,124 @@ import '../hooks/useStyles/styleAttributes.js';
 import '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',
     },
 };
 
@@ -224,8 +148,8 @@ const listAppearance = {
     ...listAppearanceDanger,
     ...listAppearanceError,
     ...listAppearanceInfo,
-    ...listAppearancePrimary,
-    ...listAppearanceSecondary,
+    ...listAppearanceSpecial,
+    ...listAppearanceExtra,
     ...listAppearanceSuccess,
     ...listAppearanceSurface,
     ...listAppearanceWarning,
@@ -238,7 +162,6 @@ function List(props) {
     const appearanceConfig = useAppearanceConfig(appearance, listConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, bulletFillClass, bulletSizeClass, bulletTextColorClass, sizeClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: ulStyles } = useStyles(props);
     return (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 }));
@@ -248,7 +171,6 @@ function ListItem(props) {
     const { className, dataTestId, dataTour, text, href, link, before, after, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { fillClass, textColorClass, textStyleClass, textWeightClass } = propsGenerator;
-    // @ts-expect-error
     const { link: linkStyles, styles: liStyles } = useStyles(props);
     if (link) {
         return (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: jsx(Link, { className: clsx('list__item-link'), href: link || href, style: linkStyles, children: children || text }) }));

package/dist/components/Loader.js

@@ -1,4 +1,4 @@
-export { L as Loader, a as loaderAppearance, l as loaderConfig } from '../Loader_es_Csp5tr40.js';
+export { L as Loader, a as loaderAppearance, l as loaderConfig } from '../Loader_es_DFSNJsLL.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
@@ -18,4 +18,4 @@ import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Text_es_DaYcLe4H.js';
+import '../Text_es_B85LGfjW.js';

package/dist/components/Logo.js

@@ -1,11 +1,11 @@
 import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
 import clsx from 'clsx';
 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 { a as LinkWrapper } from '../Link_es_Bt-Bhy3t.js';
-import 'react';
+import { a as LinkWrapper } from '../Link_es_BwLH5S8y.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
 import 'lodash/camelCase';
@@ -27,13 +27,13 @@ const logoConfig = {
         logoConfig.appearance = appearanceConfig;
     },
 };
-const Logo = urlWithAssetPrefix(function Logo(props) {
-    const { appearance, className, dataTestId, dataTour, href, link } = props;
+const Logo = urlWithAssetPrefix(forwardRef(function Logo(props, ref) {
+    const { appearance, className, dataTestId, dataTour, href, link, isSkeleton, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, logoConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { alignClass, alignDirectionClass, alignItemsClass, src, title, alt, sizeClass, widthClass, } = propsGenerator;
     const { styles: logo } = useStyles(props);
-    return (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 ? (jsx(LinkWrapper, { className: "logo__link", href: link || href, children: jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title }) })) : (jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title })) }));
-});
+    return (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 ? (jsx(LinkWrapper, { className: "logo__link", href: link || href, children: jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title }) })) : (jsx("img", { className: "logo__image", src: src, title: title || alt, alt: alt || title })) }));
+}));
 
 export { Logo, logoConfig };

package/dist/components/MenuItem.js

@@ -4,9 +4,9 @@ import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { I as Icon, T as Tooltip } from '../Icon_es_Banbw98_.js';
-import { L as Link } from '../Link_es_Bt-Bhy3t.js';
-import { T as Text } from '../Text_es_DaYcLe4H.js';
+import { I as Icon, T as Tooltip } from '../Icon_es_DNVHNKFK.js';
+import { L as Link } from '../Link_es_BwLH5S8y.js';
+import { T as Text } from '../Text_es_B85LGfjW.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -27,7 +27,7 @@ import '../context/UrlAssetPrefix.js';
 const menuItemAppearanceAccent = {
     accentMutedPrimary: {
         fill: 'accentTertiary',
-        fillHover: 'accentTertiaryHover',
+        fillHover: 'accentTertiary',
         labelTextColor: 'accentTextQuaternary',
         borderColor: 'accentBorderSecondary',
         iconAfterFillIcon: 'accentItemQuaternary',
@@ -53,7 +53,7 @@ const menuItemAppearanceAccent = {
 
 const menuItemAppearanceError = {
     errorMutedPrimary: {
-        fill: 'errorDisabled',
+        fill: 'errorTertiary',
         labelTextColor: 'errorTextQuaternary',
         labelTextColorHover: 'errorTextQuaternary',
         iconAfterFillIcon: 'errorItemQuaternary',
@@ -61,7 +61,7 @@ const menuItemAppearanceError = {
     },
     errorPrimary: {
         fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
+        fillHover: 'errorPrimary',
         labelTextColor: 'errorTextPrimary',
         labelTextColorHover: 'errorTextPrimary',
         borderColor: 'errorBorderSecondary',
@@ -160,7 +160,7 @@ const menuItemAppearanceSurface = {
     surfaceMutedPrimary: {
         fill: 'surfaceSecondary',
         fillActive: 'surfacePrimary',
-        fillActiveHover: 'surfaceHover',
+        fillActiveHover: 'surfacePrimary',
         labelTextColor: 'surfaceTextQuaternary',
         iconAfterFillIcon: 'surfaceItemQuaternary',
         iconBeforeFillIcon: 'surfaceItemQuaternary',
@@ -168,7 +168,7 @@ const menuItemAppearanceSurface = {
     surfacePrimary: {
         fill: 'surfacePrimary',
         fillActive: 'surfaceSecondary',
-        fillActiveHover: 'surfaceTertiary',
+        fillActiveHover: 'surfaceSecondary',
         fillHover: 'surfaceSecondary',
         labelTextActiveColor: 'accentTextSecondary',
         labelTextActiveColorHover: 'accentTextSecondary',
@@ -180,13 +180,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',
@@ -195,8 +195,8 @@ const menuItemAppearanceSurface = {
         iconBeforeFillIcon: 'surfaceItemPrimary',
     },
     surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
+        fill: 'surfaceSecondary',
+        fillHover: 'surfaceTertiary',
         labelTextColor: 'surfaceTextPrimary',
     },
 };
@@ -212,8 +212,8 @@ const menuItemAppearance = {
 
 const menuItemConfig = {
     appearance: menuItemAppearance,
-    setAppearance: (appearanceConfig) => {
-        MenuItemConfig.appearance = appearanceConfig;
+    setAppearance: function (appearanceConfig) {
+        this.appearance = appearanceConfig;
     },
 };
 function MenuItem(props) {
@@ -232,7 +232,6 @@ function MenuItem(props) {
     const appearanceConfig = useAppearanceConfig(appearance, menuItemConfig, isDisabled);
     const propsGenerator = 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(props);
     return (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