@itcase/ui 1.8.57 → 1.8.58

package/dist/cjs/components/Accordion.js

@@ -34,48 +34,48 @@ var accordionAppearanceSize = {
         titleTextSize: 'h3',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'xxl',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
     sizeXL: {
         size: 'xl',
         titleTextSize: 'h3',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'l',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
     sizeL: {
         size: 'l',
         titleTextSize: 'h4',
         badgeAppearanceSize: 'sizeXS',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
     sizeM: {
         size: 'm',
         titleTextSize: 'h5',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'm',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
     sizeS: {
         size: 's',
         titleTextSize: 'h6',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 's',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
     sizeXS: {
         size: 'xs',
         titleTextSize: 'h6',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'xs',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
     sizeXXS: {
         size: 'xxs',
         titleTextSize: 'h6',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'xs',
-        icon: _default.icons16.Arrow.Chevron_Down,
+        icon: _default.icons16.Arrow.ChevronDown,
     },
 };
 

package/dist/cjs/components/MenuItem.js

@@ -181,20 +181,33 @@ var menuItemConfig = {
     },
 };
 function MenuItem(props) {
-    var className = props.className, appearance = props.appearance, label = props.label, isDisabled = props.isDisabled, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, target = props.target, underline = props.underline, before = props.before, after = props.after, isActive = props.isActive, onClick = props.onClick, onMouseEnter = props.onMouseEnter, children = props.children;
+    var className = props.className, appearance = props.appearance, label = props.label, isDisabled = props.isDisabled, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, showTooltip = props.showTooltip, target = props.target, tooltipAppearance = props.tooltipAppearance, underline = props.underline, before = props.before, after = props.after, isActive = props.isActive, onClick = props.onClick, children = props.children;
+    var tooltipRef = React.useRef(null);
+    var onMouseEnter = React.useCallback(function () {
+        var _a;
+        if (showTooltip) {
+            (_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.openTooltip();
+        }
+    }, [showTooltip]);
+    var onMouseLeave = React.useCallback(function () {
+        var _a;
+        if (showTooltip) {
+            (_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.closeTooltip();
+        }
+    }, [showTooltip]);
     var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, menuItemConfig);
     var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelStyle = propsGenerator.labelStyle, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextColorDisabled = propsGenerator.labelTextColorDisabled, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelWeight = propsGenerator.labelWeight, labelWrap = propsGenerator.labelWrap, borderColorClass = propsGenerator.borderColorClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipFill = propsGenerator.tooltipFill, tooltipShapeStrength = propsGenerator.tooltipShapeStrength, tooltipText = propsGenerator.tooltipText, tooltipTextColor = propsGenerator.tooltipTextColor, tooltipTitleTextColor = propsGenerator.tooltipTitleTextColor, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, isSkeleton = propsGenerator.isSkeleton;
+    var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelStyle = propsGenerator.labelStyle, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextColorDisabled = propsGenerator.labelTextColorDisabled, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelWeight = propsGenerator.labelWeight, labelWrap = propsGenerator.labelWrap, borderColorClass = propsGenerator.borderColorClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipFill = propsGenerator.tooltipFill, tooltipShapeStrength = propsGenerator.tooltipShapeStrength, tooltipText = propsGenerator.tooltipText, tooltipTextColor = propsGenerator.tooltipTextColor, tooltipTitleTextColor = propsGenerator.tooltipTitleTextColor, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, isSkeleton = propsGenerator.isSkeleton;
     // @ts-expect-error
     var menuItem = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsx("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isDisabled && "menu-item_state_disabled", directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), borderColorClass && "border-color_".concat(borderColorClass), !isActive
+    return (jsxRuntime.jsxs("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isDisabled && "menu-item_state_disabled", directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), borderColorClass && "border-color_".concat(borderColorClass), !isActive
             ? fillClass && "fill_".concat(fillClass)
             : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive
             ? fillHoverClass && "fill_hover_".concat(fillHoverClass)
             : fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
             ? "shape-strength_".concat(shapeStrengthClass)
             : shapeClass === 'rounded' && 'shape-strength_default', typeClass && "menu-item_type_".concat(typeClass), widthClass && "width_".concat(widthClass), justifyContentClass &&
-            "menu-item_justify-content_".concat(justifyContentClass), isSkeleton && "menu-item_skeleton"), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsxs(Link.Link, { className: clsx('menu-item__wrapper', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), href: link || href, LinkComponent: LinkComponent, rel: rel, target: target, underline: underline, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('menu-item__icon_before', iconBadgeValue && 'menu-item__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), label && (jsxRuntime.jsx(Text.Text, { className: "menu-item__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveHoverColor, textColorDisabled: labelTextColorDisabled, textColorHover: labelTextHoverColor, textStyle: labelStyle, textWeight: labelWeight, textWrap: labelWrap, isDisabled: isDisabled, isActive: isActive, children: label })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('menu-item__icon_after', iconBadgeValue && 'menu-item__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] })), after, jsxRuntime.jsx(Icon.Tooltip, { className: "menu-item__tooltip", appearance: tooltipAppearance, minWidth: "auto", fill: tooltipFill, left: "100%", zIndex: "100", titleTextColor: tooltipTitleTextColor, text: tooltipText, textColor: tooltipTextColor, centering: "vertical", shapeStrength: tooltipShapeStrength })] }) }));
+            "menu-item_justify-content_".concat(justifyContentClass), isSkeleton && "menu-item_skeleton"), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, children: [jsxRuntime.jsxs(Link.Link, { className: clsx('menu-item__wrapper', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), href: link || href, LinkComponent: LinkComponent, rel: rel, target: target, underline: underline, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('menu-item__icon_before', iconBadgeValue && 'menu-item__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), label && (jsxRuntime.jsx(Text.Text, { className: "menu-item__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveHoverColor, textColorDisabled: labelTextColorDisabled, textColorHover: labelTextHoverColor, textStyle: labelStyle, textWeight: labelWeight, textWrap: labelWrap, isDisabled: isDisabled, isActive: isActive, children: label })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('menu-item__icon_after', iconBadgeValue && 'menu-item__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] })), after] }), showTooltip && (jsxRuntime.jsx(Icon.Tooltip, { className: "menu-item__tooltip", appearance: tooltipAppearance, minWidth: "auto", fill: tooltipFill, left: "100%", zIndex: "100", titleTextColor: tooltipTitleTextColor, text: tooltipText, textColor: tooltipTextColor, centering: "vertical", ref: tooltipRef, shapeStrength: tooltipShapeStrength }))] }));
 }
 
 exports.MenuItem = MenuItem;

package/dist/cjs/hoc/urlWithAssetPrefix.js

@@ -14,11 +14,10 @@ var urlWithAssetPrefix = function (WrappedComponent) {
             var url = props[propKey];
             if (url && typeof url === 'string') {
                 if (assetPrefix) {
-                    var cleanUrl = common.formatURL(url);
-                    var isNeedAssetPrefix = checkIsNeedAssetPrefix(cleanUrl, assetPrefix, ignorePathsList);
+                    var isNeedAssetPrefix = checkIsNeedAssetPrefix(url, assetPrefix, ignorePathsList);
                     if (isNeedAssetPrefix) {
                         var prefixPath = common.formatURL(assetPrefix).slice(0, -1);
-                        url = "".concat(prefixPath).concat(cleanUrl);
+                        url = "".concat(prefixPath).concat(url);
                     }
                 }
                 resultProps[propKey] = url;
@@ -52,7 +51,7 @@ var checkIsNeedAssetPrefix = function (url, assetPrefix, ignorePathsList) {
             }
         }
         else {
-            if (url.startsWith(common.formatURL(urlPath))) {
+            if (common.formatURL(url).startsWith(common.formatURL(urlPath))) {
                 return false;
             }
         }

package/dist/components/Accordion.js

@@ -32,48 +32,48 @@ var accordionAppearanceSize = {
         titleTextSize: 'h3',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'xxl',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
     sizeXL: {
         size: 'xl',
         titleTextSize: 'h3',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'l',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
     sizeL: {
         size: 'l',
         titleTextSize: 'h4',
         badgeAppearanceSize: 'sizeXS',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
     sizeM: {
         size: 'm',
         titleTextSize: 'h5',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'm',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
     sizeS: {
         size: 's',
         titleTextSize: 'h6',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 's',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
     sizeXS: {
         size: 'xs',
         titleTextSize: 'h6',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'xs',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
     sizeXXS: {
         size: 'xxs',
         titleTextSize: 'h6',
         badgeAppearanceSize: 'sizeXS',
         contentTextSize: 'xs',
-        icon: icons16.Arrow.Chevron_Down,
+        icon: icons16.Arrow.ChevronDown,
     },
 };
 

package/dist/components/MenuItem.js

@@ -1,5 +1,5 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React, { useRef, useCallback } from 'react';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
@@ -179,20 +179,33 @@ var menuItemConfig = {
     },
 };
 function MenuItem(props) {
-    var className = props.className, appearance = props.appearance, label = props.label, isDisabled = props.isDisabled, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, target = props.target, underline = props.underline, before = props.before, after = props.after, isActive = props.isActive, onClick = props.onClick, onMouseEnter = props.onMouseEnter, children = props.children;
+    var className = props.className, appearance = props.appearance, label = props.label, isDisabled = props.isDisabled, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, showTooltip = props.showTooltip, target = props.target, tooltipAppearance = props.tooltipAppearance, underline = props.underline, before = props.before, after = props.after, isActive = props.isActive, onClick = props.onClick, children = props.children;
+    var tooltipRef = useRef(null);
+    var onMouseEnter = useCallback(function () {
+        var _a;
+        if (showTooltip) {
+            (_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.openTooltip();
+        }
+    }, [showTooltip]);
+    var onMouseLeave = useCallback(function () {
+        var _a;
+        if (showTooltip) {
+            (_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.closeTooltip();
+        }
+    }, [showTooltip]);
     var appearanceConfig = useAppearanceConfig(appearance, menuItemConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelStyle = propsGenerator.labelStyle, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextColorDisabled = propsGenerator.labelTextColorDisabled, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelWeight = propsGenerator.labelWeight, labelWrap = propsGenerator.labelWrap, borderColorClass = propsGenerator.borderColorClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipFill = propsGenerator.tooltipFill, tooltipShapeStrength = propsGenerator.tooltipShapeStrength, tooltipText = propsGenerator.tooltipText, tooltipTextColor = propsGenerator.tooltipTextColor, tooltipTitleTextColor = propsGenerator.tooltipTitleTextColor, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, isSkeleton = propsGenerator.isSkeleton;
+    var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelStyle = propsGenerator.labelStyle, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextColorDisabled = propsGenerator.labelTextColorDisabled, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelWeight = propsGenerator.labelWeight, labelWrap = propsGenerator.labelWrap, borderColorClass = propsGenerator.borderColorClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipFill = propsGenerator.tooltipFill, tooltipShapeStrength = propsGenerator.tooltipShapeStrength, tooltipText = propsGenerator.tooltipText, tooltipTextColor = propsGenerator.tooltipTextColor, tooltipTitleTextColor = propsGenerator.tooltipTitleTextColor, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, isSkeleton = propsGenerator.isSkeleton;
     // @ts-expect-error
     var menuItem = useStyles(props).styles;
-    return (jsx("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isDisabled && "menu-item_state_disabled", directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), borderColorClass && "border-color_".concat(borderColorClass), !isActive
+    return (jsxs("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isDisabled && "menu-item_state_disabled", directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), borderColorClass && "border-color_".concat(borderColorClass), !isActive
             ? fillClass && "fill_".concat(fillClass)
             : fillActiveClass && "fill_active_".concat(fillActiveClass), !isActive
             ? fillHoverClass && "fill_hover_".concat(fillHoverClass)
             : fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass
             ? "shape-strength_".concat(shapeStrengthClass)
             : shapeClass === 'rounded' && 'shape-strength_default', typeClass && "menu-item_type_".concat(typeClass), widthClass && "width_".concat(widthClass), justifyContentClass &&
-            "menu-item_justify-content_".concat(justifyContentClass), isSkeleton && "menu-item_skeleton"), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxs(Link, { className: clsx('menu-item__wrapper', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), href: link || href, LinkComponent: LinkComponent, rel: rel, target: target, underline: underline, children: [before, children || (jsxs(React.Fragment, { children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('menu-item__icon_before', iconBadgeValue && 'menu-item__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), label && (jsx(Text, { className: "menu-item__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveHoverColor, textColorDisabled: labelTextColorDisabled, textColorHover: labelTextHoverColor, textStyle: labelStyle, textWeight: labelWeight, textWrap: labelWrap, isDisabled: isDisabled, isActive: isActive, children: label })), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('menu-item__icon_after', iconBadgeValue && 'menu-item__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] })), after, jsx(Tooltip, { className: "menu-item__tooltip", appearance: tooltipAppearance, minWidth: "auto", fill: tooltipFill, left: "100%", zIndex: "100", titleTextColor: tooltipTitleTextColor, text: tooltipText, textColor: tooltipTextColor, centering: "vertical", shapeStrength: tooltipShapeStrength })] }) }));
+            "menu-item_justify-content_".concat(justifyContentClass), isSkeleton && "menu-item_skeleton"), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, children: [jsxs(Link, { className: clsx('menu-item__wrapper', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), href: link || href, LinkComponent: LinkComponent, rel: rel, target: target, underline: underline, children: [before, children || (jsxs(React.Fragment, { children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('menu-item__icon_before', iconBadgeValue && 'menu-item__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), label && (jsx(Text, { className: "menu-item__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveHoverColor, textColorDisabled: labelTextColorDisabled, textColorHover: labelTextHoverColor, textStyle: labelStyle, textWeight: labelWeight, textWrap: labelWrap, isDisabled: isDisabled, isActive: isActive, children: label })), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('menu-item__icon_after', iconBadgeValue && 'menu-item__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] })), after] }), showTooltip && (jsx(Tooltip, { className: "menu-item__tooltip", appearance: tooltipAppearance, minWidth: "auto", fill: tooltipFill, left: "100%", zIndex: "100", titleTextColor: tooltipTitleTextColor, text: tooltipText, textColor: tooltipTextColor, centering: "vertical", ref: tooltipRef, shapeStrength: tooltipShapeStrength }))] }));
 }
 
 export { MenuItem, menuItemAppearance, menuItemConfig };

package/dist/css/components/MenuItem/MenuItem.css

@@ -1,4 +1,5 @@
 .menu-item {
+  position: relative;
   display: flex;
   align-items: center;
   &:hover {
@@ -10,7 +11,7 @@
   }
   &__wrapper {
     width: 100%;
-    position: relative;
+    position: relative !important;
     display: flex;
     align-items: center;
     align-content: center;

package/dist/hoc/urlWithAssetPrefix.js

@@ -12,11 +12,10 @@ var urlWithAssetPrefix = function (WrappedComponent) {
             var url = props[propKey];
             if (url && typeof url === 'string') {
                 if (assetPrefix) {
-                    var cleanUrl = formatURL(url);
-                    var isNeedAssetPrefix = checkIsNeedAssetPrefix(cleanUrl, assetPrefix, ignorePathsList);
+                    var isNeedAssetPrefix = checkIsNeedAssetPrefix(url, assetPrefix, ignorePathsList);
                     if (isNeedAssetPrefix) {
                         var prefixPath = formatURL(assetPrefix).slice(0, -1);
-                        url = "".concat(prefixPath).concat(cleanUrl);
+                        url = "".concat(prefixPath).concat(url);
                     }
                 }
                 resultProps[propKey] = url;
@@ -50,7 +49,7 @@ var checkIsNeedAssetPrefix = function (url, assetPrefix, ignorePathsList) {
             }
         }
         else {
-            if (url.startsWith(formatURL(urlPath))) {
+            if (formatURL(url).startsWith(formatURL(urlPath))) {
                 return false;
             }
         }

package/dist/types/components/Accordion/appearance/accordionSize.d.ts

@@ -4,48 +4,48 @@ declare const accordionAppearanceSize: {
         titleTextSize: string;
         badgeAppearanceSize: string;
         contentTextSize: string;
-        icon: any;
+        icon: string;
     };
     sizeXL: {
         size: string;
         titleTextSize: string;
         badgeAppearanceSize: string;
         contentTextSize: string;
-        icon: any;
+        icon: string;
     };
     sizeL: {
         size: string;
         titleTextSize: string;
         badgeAppearanceSize: string;
-        icon: any;
+        icon: string;
     };
     sizeM: {
         size: string;
         titleTextSize: string;
         badgeAppearanceSize: string;
         contentTextSize: string;
-        icon: any;
+        icon: string;
     };
     sizeS: {
         size: string;
         titleTextSize: string;
         badgeAppearanceSize: string;
         contentTextSize: string;
-        icon: any;
+        icon: string;
     };
     sizeXS: {
         size: string;
         titleTextSize: string;
         badgeAppearanceSize: string;
         contentTextSize: string;
-        icon: any;
+        icon: string;
     };
     sizeXXS: {
         size: string;
         titleTextSize: string;
         badgeAppearanceSize: string;
         contentTextSize: string;
-        icon: any;
+        icon: string;
     };
 };
 export { accordionAppearanceSize };

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

@@ -55,6 +55,7 @@ export interface MenuItemProps extends MenuItemThemeColor, StyleAttributes {
     label?: string;
     link?: string;
     rel?: string;
+    showTooltip: boolean;
     style?: CSSProperties;
     target?: string;
     type?: string;
@@ -62,7 +63,6 @@ export interface MenuItemProps extends MenuItemThemeColor, StyleAttributes {
     isHover?: boolean;
     isSkeleton?: boolean;
     onClick?: () => void;
-    onMouseEnter?: () => void;
     set?: string;
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.57",
+  "version": "1.8.58",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",