@itcase/ui 1.9.36 → 1.9.37

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_OpkyzWe6.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,

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_CcFl-K-t.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_DR4Alx-v.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_OpkyzWe6.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
 import 'lodash/camelCase';
@@ -27,13 +27,14 @@ 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;
+    //@ts-expect-error
     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_BoUAbwyu.js';
+import { L as Link } from '../Link_es_OpkyzWe6.js';
+import { T as Text } from '../Text_es_DR4Alx-v.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) {

package/dist/components/Modal.js

@@ -6,9 +6,9 @@ import { icons24, icons32, icons40 } from '@itcase/icons/default';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { b as Title, I as Icon } from '../Icon_es_Banbw98_.js';
-import { O as Overlay } from '../Overlay_es_dNz3djDB.js';
-import { L as Loader } from '../Loader_es_Csp5tr40.js';
+import { b as Title, I as Icon } from '../Icon_es_BoUAbwyu.js';
+import { O as Overlay } from '../Overlay_es_Du0WjVgO.js';
+import { L as Loader } from '../Loader_es_CcFl-K-t.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -25,8 +25,8 @@ import 'lodash/maxBy';
 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_OpkyzWe6.js';
+import '../Text_es_DR4Alx-v.js';
 
 const modalAppearanceShape = {
     circular: {
@@ -135,7 +135,7 @@ const getOrCreateModalElement = (modalIdQuerySelector, className = '') => {
 };
 // Modal component that is an abstraction around the portal API.
 const Modal = React.forwardRef(function Modal(props, ref) {
-    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon = true, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
+    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, before, after, closeIcon = true, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
     // Query DOM element
     const [modalElement, setModalElement] = useState(null);
     const [isOpen, setIsOpen] = useState(initialIsOpen);
@@ -192,7 +192,7 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     }, [isOpen]); // eslint-disable-line
     useLayoutEffect(() => {
         let classNameModal = className;
-        if (print === false) {
+        if (!print) {
             classNameModal = clsx(className, 'no-print');
         }
         const element = getOrCreateModalElement(modalIdQuerySelector, classNameModal);
@@ -229,7 +229,7 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     // @ts-expect-error
     const { styles: modalStyles } = useStyles(props);
     return (modalElement &&
-        ReactDOM.createPortal(isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { id: id, className: clsx('modal__content', absoluteHeader && 'modal__content-absolute-header', !title && !closeIcon && 'modal__content-no-header', fillClass && `fill_${fillClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `modal_size_${sizeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, scroll && `modal-scroll_${scroll}`, stickyHeader && 'modal-scroll_header_sticky', isSkeleton && 'modal_skeleton'), ref: modalContentRef, "data-testid": dataTestId, "data-tour": dataTour, style: modalStyles, tabIndex: 0, children: [(title || closeIcon) && (jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (jsx(Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (jsx("div", { className: "modal__close", onClick: closeModal, children: jsx(Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? icons24.Action.Close }) }))] })), jsx("div", { className: "modal__content-wrapper", children: children })] }), jsx(Overlay, { className: "modal__overlay", 
+        ReactDOM.createPortal(isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { id: id, className: clsx('modal__content', absoluteHeader && 'modal__content-absolute-header', !title && !closeIcon && 'modal__content-no-header', fillClass && `fill_${fillClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `modal_size_${sizeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, scroll && `modal-scroll_${scroll}`, stickyHeader && 'modal-scroll_header_sticky', isSkeleton && 'modal_skeleton'), ref: modalContentRef, "data-testid": dataTestId, "data-tour": dataTour, style: modalStyles, tabIndex: 0, children: [before, (title || closeIcon) && (jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (jsx(Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (jsx("div", { className: "modal__close", onClick: closeModal, children: jsx(Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? icons24.Action.Close }) }))] })), jsx("div", { className: "modal__content-wrapper", children: children }), after] }), jsx(Overlay, { className: "modal__overlay", 
                     // ref={modalOverlayRef}
                     fill: overlayFill, opacity: overlayOpacity, isOverlay: isOverlay, onClick: handleClickOverlay })] })) : null, 
         // A DOM element

package/dist/components/ModalSheetBottom.js

@@ -5,7 +5,7 @@ import { Sheet } from 'react-modal-sheet';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { b as Title } from '../Icon_es_Banbw98_.js';
+import { b as Title } from '../Icon_es_BoUAbwyu.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -22,16 +22,14 @@ import 'lodash/maxBy';
 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_OpkyzWe6.js';
+import '../Text_es_DR4Alx-v.js';
 
 const modalSheetBottomAppearanceSize = {
     sizeL: {
-        size: 'l',
         titleTextSize: 'h4',
     },
     sizeM: {
-        size: 'm',
         titleTextSize: 'h5',
     },
 };
@@ -53,7 +51,6 @@ const ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
         setIsOpen(false);
         onCloseModalSheetBottom && onCloseModalSheetBottom();
     }, [onCloseModalSheetBottom]);
-    // Save ref things
     useImperativeHandle(ref, () => ({
         openModal: openModalSheetBottom,
         closeModal: closeModalSheetBottom,
@@ -64,7 +61,7 @@ const ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
     const { titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, zeroPadding, } = propsGenerator;
     // @ts-expect-error
     const { styles } = useStyles(props);
-    return (jsxs(Sheet, { className: "modal-sheet-bottom", "data-testid": dataTestId, "data-tour": dataTour, isOpen: isOpen, onClose: closeModalSheetBottom, ...props, children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsx(Sheet.Header, { className: "modal-sheet-bottom__header", children: closeButton && (jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })) }), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxs("div", { className: clsx('modal-sheet-bottom__content-wrapper', zeroPadding && 'modal-sheet-bottom__content-reset-padding'), children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), children] }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] }));
+    return (jsxs(Sheet, { ...props, className: "modal-sheet-bottom", "data-testid": dataTestId, "data-tour": dataTour, isOpen: isOpen, onClose: closeModalSheetBottom, children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsx(Sheet.Header, { className: "modal-sheet-bottom__header", children: closeButton && (jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })) }), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxs("div", { className: clsx('modal-sheet-bottom__content-wrapper', zeroPadding && 'modal-sheet-bottom__content-reset-padding'), children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), children] }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] }));
 });
 
 export { ModalSheetBottom, modalSheetBottomAppearance };

package/dist/components/Notification.js

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import { L as Loader } from '../Loader_es_Csp5tr40.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { B as Button } from '../Button_es_DH8hqqdN.js';
-import { I as Icon } from '../Icon_es_Banbw98_.js';
-import { T as Text } from '../Text_es_DaYcLe4H.js';
+import { B as Button } from '../Button_es_BDrXGgUw.js';
+import { I as Icon } from '../Icon_es_BoUAbwyu.js';
+import { L as Loader } from '../Loader_es_CcFl-K-t.js';
+import { T as Text } from '../Text_es_DR4Alx-v.js';
 import { icons24 } from '@itcase/icons/default';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import '../context/UIContext.js';
@@ -22,7 +22,7 @@ import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
-import '../Link_es_Bt-Bhy3t.js';
+import '../Link_es_OpkyzWe6.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
@@ -30,7 +30,7 @@ import '../context/UrlAssetPrefix.js';
 const notificationAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfacePrimary',
-        fillHover: 'surfacePrimaryHover',
+        fillHover: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderPrimary',
@@ -45,7 +45,7 @@ const notificationAppearanceDefault = {
 const notificationAppearanceError = {
     errorPrimary: {
         fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
+        fillHover: 'errorPrimary',
         titleTextColor: 'errorTextPrimary',
         descTextColor: 'errorTextPrimary',
         borderColor: 'errorBorderPrimary',
@@ -60,7 +60,7 @@ const notificationAppearanceError = {
 const notificationAppearanceInfo = {
     infoPrimary: {
         fill: 'infoPrimary',
-        fillHover: 'infoPrimaryHover',
+        fillHover: 'infoPrimary',
         titleTextColor: 'infoTextPrimary',
         descTextColor: 'infoTextPrimary',
         borderColor: 'infoBorderPrimary',
@@ -102,17 +102,15 @@ const notificationAppearanceSize = {
         size: 'm',
         titleTextSize: 'xxl',
         descTextSize: 'm',
-        iconSize: 24,
         loaderAppearanceSize: 'sizeS',
-        closeIconAppearanceSize: 'size_24_24',
+        closeIconAppearanceSize: 'size24_24',
     },
     sizeS: {
         size: 'm',
         titleTextSize: 'xl',
         descTextSize: 'm',
-        iconSize: 24,
         loaderAppearanceSize: 'sizeS',
-        closeIconAppearanceSize: 'size_24_24',
+        closeIconAppearanceSize: 'size24_24',
     },
 };
 
@@ -133,7 +131,7 @@ const notificationAppearanceStyle = {
 const notificationAppearanceSuccess = {
     successPrimary: {
         fill: 'successPrimary',
-        fillHover: 'successPrimaryHover',
+        fillHover: 'successPrimary',
         titleTextColor: 'successTextPrimary',
         descTextColor: 'successTextPrimary',
         borderColor: 'successBorderPrimary',
@@ -148,7 +146,7 @@ const notificationAppearanceSuccess = {
 const notificationAppearanceWarning = {
     warningPrimary: {
         fill: 'warningPrimary',
-        fillHover: 'warningPrimaryHover',
+        fillHover: 'warningPrimary',
         titleTextColor: 'warningTextPrimary',
         descTextColor: 'warningTextPrimary',
         borderColor: 'surfaceBorderPrimary',
@@ -181,7 +179,7 @@ function Notification(props) {
     const { id, appearance, className, dataTestId, dataTour, type = 'float', title, text, before, after, isSkeleton, isLoading, onClickButton, onClickClose, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, notificationConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'hug', shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconAppearanceSize, closeIconSrc, } = propsGenerator;
+    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'dot', shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconAppearanceSize, closeIconSrc, } = propsGenerator;
     // @ts-expect-error
     const { styles: notificationStyles } = useStyles(props);
     return (jsxs("div", { className: clsx('notification__item', `notification__item_${type}`, widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, type && `notification__item_type_${type}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsx(Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsx(Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));

package/dist/components/Overlay.js

@@ -1,4 +1,4 @@
-export { O as Overlay, a as overlayAppearance, o as overlayConfig } from '../Overlay_es_dNz3djDB.js';
+export { O as Overlay, a as overlayAppearance, o as overlayConfig } from '../Overlay_es_Du0WjVgO.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';