@itcase/ui 1.9.37 → 1.9.38

package/dist/cjs/components/Group.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Group = require('../../Group_cjs_BGVwVJwS.js');
+var Group = require('../../Group_cjs_xCUYKUcc.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');

package/dist/cjs/components/HTMLContent.js

@@ -23,7 +23,6 @@ function HTMLContent(props) {
     const { className, dataTestId, dataTour, content, style, onClick, children } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { directionClass, flexGrowClass, justifyContentClass, alignClass, alignDirectionClass, fillClass, fillHoverClass, borderColorClass, borderTypeClass, borderWidthClass, textColorClass, textWeightClass, columnsClass, elevationClass, heightClass, shapeClass, widthClass, wrapClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: htmlContentStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx("div", { className: clsx(className, 'html-content', alignClass && `align_${alignClass}`, alignDirectionClass && `align_${alignDirectionClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderWidthClass && `border-width_${borderWidthClass}`, columnsClass && `html-content_columns_${columnsClass}`, directionClass && `html-content_direction_${directionClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, flexGrowClass && `flex-grow_${flexGrowClass}`, heightClass && `height_${heightClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, shapeClass && `html-content_shape_${shapeClass}`, textColorClass && `text-color_${textColorClass}`, textWeightClass && `text-weight_${textWeightClass}`, wrapClass && `html-content_wrap_${wrapClass}`, widthClass && `width_${widthClass}`), dangerouslySetInnerHTML: { __html: content }, "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, htmlContentStyles, style), onClick: onClick, children: children }));
 }

package/dist/cjs/components/HeroTitle.js

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -23,8 +23,8 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 const heroTitleAppearanceSize = {
     sizeH1: {
@@ -62,7 +62,6 @@ function HeroTitle(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, heroTitleConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, size, fillClass, textAlignClass, textColorActiveClass, textColorClass, textColorGradientClass, textColorHoverClass, textFontClass, textStyleClass, textTruncateClass, textWeightClass, textWrap, heightClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, svgFillClass, svgFillHoverClass, typeClass, widthClass, wrapperDirectionClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: heroTitleStyles, wrapper: heroTitleWrapperStyles } = useStyles.useStyles(props);
     const Tag = React.useMemo(() => {
         if (tag) {

package/dist/cjs/components/Icon.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -23,8 +23,8 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 
 

package/dist/cjs/components/Image.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Image = require('../../Image_cjs_Dvojc8Dw.js');
+var Image = require('../../Image_cjs_JfkEyfgx.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');

package/dist/cjs/components/Input.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Input = require('../../Input_cjs_B13aeHfj.js');
+var Input = require('../../Input_cjs_BQIi1N63.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');

package/dist/cjs/components/InputNumber.js

@@ -5,7 +5,7 @@ var React = require('react');
 var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Button = require('../../Button_cjs_Dvh0E0zz.js');
+var Button = require('../../Button_cjs_Ivarkwy6.js');
 var _default = require('@itcase/icons/default');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -19,15 +19,16 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
+require('../utils/mergeAppearanceKeys.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_DRdjXL7T.js');
+require('../../Icon_cjs_D20B2YBo.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
-require('../../Loader_cjs_BHMB4c8f.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
+require('../../Loader_cjs_DMIUN6_q.js');
 
 const inputNumberAppearanceShape = {
     circular: {

package/dist/cjs/components/InputPassword.js

@@ -6,7 +6,7 @@ var React = require('react');
 var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -24,15 +24,14 @@ require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 const inputPasswordAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
         caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,
@@ -43,7 +42,6 @@ const inputPasswordAppearanceDefault = {
         fill: 'surfacePrimary',
         borderColor: 'surfaceBorderTertiary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
         caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: _default.icons24.View.HideValue,

package/dist/cjs/components/Label.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Label = require('../../Label_cjs_Kf3sYviA.js');
+var Label = require('../../Label_cjs_DlbcXQX4.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -20,12 +20,12 @@ require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_DRdjXL7T.js');
+require('../../Icon_cjs_D20B2YBo.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 
 

package/dist/cjs/components/Link.js

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

package/dist/cjs/components/List.js

@@ -5,7 +5,7 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Link = require('../../Link_cjs_CmBw4h-N.js');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -164,7 +164,6 @@ function List(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, listConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, bulletFillClass, bulletSizeClass, bulletTextColorClass, sizeClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: ulStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx("ul", { className: clsx(className, 'list', bulletSizeClass && `list_bullet-size_${bulletSizeClass}`, bulletFillClass && `list_bullet-fill_${bulletFillClass}`, bulletTextColorClass &&
             `list_bullet-text-color_${bulletTextColorClass}`, directionClass && `list_direction_${directionClass}`, sizeClass && `list_size_${sizeClass}`, style && `list_style_${style}`, type && `list_type_${type}`), "data-testid": dataTestId, "data-tour": dataTour, style: ulStyles, children: children }));
@@ -174,7 +173,6 @@ function ListItem(props) {
     const { className, dataTestId, dataTour, text, href, link, before, after, children, } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { fillClass, textColorClass, textStyleClass, textWeightClass } = propsGenerator;
-    // @ts-expect-error
     const { link: linkStyles, styles: liStyles } = useStyles.useStyles(props);
     if (link) {
         return (jsxRuntime.jsx("li", { className: clsx(className, 'list__item', 'list__item_type_link', textStyleClass && `text text-style_${textStyleClass}`, textWeightClass && `text text-weight_${textWeightClass}`, textColorClass && `text-color_${textColorClass}`, fillClass && `fill_${fillClass}`), style: liStyles, children: jsxRuntime.jsx(Link.Link, { className: clsx('list__item-link'), href: link || href, style: linkStyles, children: children || text }) }));

package/dist/cjs/components/Loader.js

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

package/dist/cjs/components/Logo.js

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

package/dist/cjs/components/MenuItem.js

@@ -6,9 +6,9 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
-var Link = require('../../Link_cjs_CmBw4h-N.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -234,7 +234,6 @@ function MenuItem(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, menuItemConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorDisabled, labelTextColorHover, labelTextSize, labelWeight, labelWrap, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, tooltipFill, tooltipShape, tooltipShapeStrength, tooltipSize, tooltipText, tooltipTextColor, tooltipTextSize, tooltipTitle, tooltipTitleTextColor, typeClass, widthClass, isSkeleton, } = propsGenerator;
-    // @ts-expect-error
     const { styles: menuItem } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { className: clsx('menu-item', easing && `easing_${easing}`, isActive && 'menu-item_state_active', isDisabled && `menu-item_state_disabled`, directionClass && `menu-item_direction_${directionClass}`, className, (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc) &&
             'menu-item_label-icon', sizeClass && `menu-item_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, !isActive

package/dist/cjs/components/Modal.js

@@ -5,12 +5,13 @@ var React = require('react');
 var clsx = require('clsx');
 var ReactDOM = require('react-dom');
 var _default = require('@itcase/icons/default');
+var mergeAppearanceKeys = require('../utils/mergeAppearanceKeys.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
-var Overlay = require('../../Overlay_cjs_2az7kviY.js');
-var Loader = require('../../Loader_cjs_BHMB4c8f.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Overlay = require('../../Overlay_cjs_BK_0yTLw.js');
+var Loader = require('../../Loader_cjs_DMIUN6_q.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -27,8 +28,8 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 const modalAppearanceShape = {
     circular: {
@@ -180,11 +181,11 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         setIsOpen(false);
         onCloseModal && onCloseModal();
     }, [modalElement, onCloseModal]);
-    const handleClickOverlay = React.useCallback(() => {
+    const handleClickOverlay = React.useCallback((event) => {
         if (isCloseOnBlur) {
             closeModal();
         }
-        onClickOverlay && onClickOverlay();
+        onClickOverlay && onClickOverlay(event);
     }, [closeModal, isCloseOnBlur, onClickOverlay]);
     React.useEffect(() => {
         if (!modalElement) {
@@ -203,7 +204,7 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         if (element) {
             addModalProps(element);
         }
-    }, [addModalProps, className, modalIdQuerySelector]);
+    }, [addModalProps, className, modalIdQuerySelector, print]);
     React.useEffect(() => {
         if (!isCloseOnBlur || !isOpen) {
             return;
@@ -228,10 +229,9 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, modalConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, overlayFill, overlayOpacity, shapeClass, shapeStrengthClass, sizeClass, closeIconAppearance, closeIconAppearanceSize, closeIconFillSize, closeIconImage, closeIconShape, closeIconSize, } = propsGenerator;
-    // @ts-expect-error
     const { styles: modalStyles } = useStyles.useStyles(props);
     return (modalElement &&
-        ReactDOM.createPortal(isOpen ? (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.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) && (jsxRuntime.jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (jsxRuntime.jsx(Icon.Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (jsxRuntime.jsx("div", { className: "modal__close", onClick: closeModal, children: jsxRuntime.jsx(Icon.Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? _default.icons24.Action.Close }) }))] })), jsxRuntime.jsx("div", { className: "modal__content-wrapper", children: children }), after] }), jsxRuntime.jsx(Overlay.Overlay, { className: "modal__overlay", 
+        ReactDOM.createPortal(isOpen ? (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.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) && (jsxRuntime.jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (jsxRuntime.jsx(Icon.Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (jsxRuntime.jsx("div", { className: "modal__close", onClick: closeModal, children: jsxRuntime.jsx(Icon.Icon, { appearance: mergeAppearanceKeys.mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? _default.icons24.Action.Close }) }))] })), jsxRuntime.jsx("div", { className: "modal__content-wrapper", children: children }), after] }), jsxRuntime.jsx(Overlay.Overlay, { className: "modal__overlay", 
                     // ref={modalOverlayRef}
                     fill: overlayFill, opacity: overlayOpacity, isOverlay: isOverlay, onClick: handleClickOverlay })] })) : null, 
         // A DOM element

package/dist/cjs/components/ModalSheetBottom.js

@@ -7,7 +7,7 @@ var reactModalSheet = require('react-modal-sheet');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -24,8 +24,8 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Text_cjs_erTy2pUN.js');
 
 const modalSheetBottomAppearanceSize = {
     sizeL: {
@@ -61,7 +61,6 @@ const ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, modalSheetBottomConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, zeroPadding, } = propsGenerator;
-    // @ts-expect-error
     const { styles } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs(reactModalSheet.Sheet, { ...props, className: "modal-sheet-bottom", "data-testid": dataTestId, "data-tour": dataTour, isOpen: isOpen, onClose: closeModalSheetBottom, children: [jsxRuntime.jsxs(reactModalSheet.Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsxRuntime.jsx(reactModalSheet.Sheet.Header, { className: "modal-sheet-bottom__header", children: closeButton && (jsxRuntime.jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })) }), jsxRuntime.jsx(reactModalSheet.Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxRuntime.jsxs("div", { className: clsx('modal-sheet-bottom__content-wrapper', zeroPadding && 'modal-sheet-bottom__content-reset-padding'), children: [title && (jsxRuntime.jsx(Icon.Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), children] }) })] }), jsxRuntime.jsx(reactModalSheet.Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] }));
 });

package/dist/cjs/components/Notification.js

@@ -2,13 +2,14 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
+var mergeAppearanceKeys = require('../utils/mergeAppearanceKeys.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Button = require('../../Button_cjs_Dvh0E0zz.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
-var Loader = require('../../Loader_cjs_BHMB4c8f.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Button = require('../../Button_cjs_Ivarkwy6.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Loader = require('../../Loader_cjs_DMIUN6_q.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 var _default = require('@itcase/icons/default');
 var Notifications = require('../context/Notifications.js');
 require('../context/UIContext.js');
@@ -24,7 +25,7 @@ require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('lodash/maxBy');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
@@ -182,9 +183,8 @@ function Notification(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, notificationConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     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.useStyles(props);
-    return (jsxRuntime.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, jsxRuntime.jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsxRuntime.jsx(Text.Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsxRuntime.jsx(Loader.Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsxRuntime.jsx(Icon.Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsxRuntime.jsx(Button.Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
+    return (jsxRuntime.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, jsxRuntime.jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsxRuntime.jsx(Text.Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsxRuntime.jsx(Loader.Loader, { appearance: mergeAppearanceKeys.mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsxRuntime.jsx(Icon.Icon, { appearance: mergeAppearanceKeys.mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsxRuntime.jsx(Button.Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
 }
 
 function NotificationWrapper(props) {

package/dist/cjs/components/Overlay.js

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

package/dist/cjs/components/Pagination.js

@@ -8,9 +8,9 @@ var ReactPaginate = require('react-paginate');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var DropdownItem = require('../../DropdownItem_cjs_Aun30hgm.js');
-var Icon = require('../../Icon_cjs_DRdjXL7T.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var DropdownItem = require('../../DropdownItem_cjs_nZbgMgqg.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 var _default = require('@itcase/icons/default');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -25,11 +25,11 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
-require('../../Divider_cjs_DmIeh3Jq.js');
+require('../../Divider_cjs_C5Ou2Kqa.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 
 const paginationAppearanceAccent = {
     accentPrimary: {
@@ -114,7 +114,7 @@ const paginationAppearanceSize = {
         pageCountDropdownItemDividerSize: 'xxs',
         pageCountDropdownItemLabelSize: 'm',
         pageCountDropdownItemSize: 'l',
-        pageCountDropdownItemWidth: '64',
+        pageCountDropdownItemWidth: '64px',
         pageCountInputIcon: _default.icons14.Arrow.ChevronDownSmall,
         pageCountInputIconFillSize: '24',
         pageCountInputTextSize: 'l',
@@ -276,7 +276,6 @@ function Pagination(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, paginationConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { justifyContentClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, fillInputClass, fillInputHoverClass, fillInputShapeClass, fillInputShapeStrengthClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorHoverClass, textSizeClass, builderIcon, builderIconFill, builderIconFillIcon, builderIconFillSize, builderIconSize, marginPagesDisplayed, nextIcon, nextIconFill, nextIconFillIcon, nextIconFillSize, nextIconSize, pageCountDescTextColor, pageCountDescTextSize, pageCountDropdownAlignment, pageCountDropdownElevation, pageCountDropdownFill, pageCountDropdownFillHover, pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize, pageCountDropdownItemFill, pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor, pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActiveHover, pageCountDropdownItemLabelColorHover, pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider, pageCountDropdownItemSize, pageCountDropdownItemWidth, pageCountDropdownShape, pageCountDropdownShapeStrength, pageCountInputIcon, pageCountInputIconColor, pageCountInputIconFillSize, pageCountInputIconSrc, pageCountInputTextColor, pageCountInputTextSize, pageRangeDisplayed, previousIcon, previousIconFill, previousIconFillIcon, previousIconFillSize, previousIconSize, sizeClass, } = propsGenerator;
-    //@ts-expect-error
     const { styles: paginationStyles } = useStyles.useStyles(props);
     const minPageSize = Math.min(perPageCount, ...pageCountList);
     const isPaginationDisplayed = allItemsCount > minPageSize;

package/dist/cjs/components/Radio.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');

package/dist/cjs/components/RangeSlider.js

@@ -24,7 +24,6 @@ function RangeSlider(props) {
     const { className, dataTestId, dataTour, min, max, disabled, pushable, range, step, value, vertical, before, after, set, onChangeSlider, children, } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { fillClass, fillHandleClass, fillHandleDraggingClass, fillHandleDraggingHoverClass, fillHandleHoverClass, fillRailClass, fillTrackClass, shapeClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: rangeSliderStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { className: clsx(className, 'range-slider', set && `range-slider_set_${set}`, fillClass && `fill_${fillClass}`, fillTrackClass && `range-slider-track-fill_${fillTrackClass}`, fillRailClass && `range-slider-rail-fill_${fillRailClass}`, fillHandleClass && `range-slider-handle-fill_${fillHandleClass}`, fillHandleHoverClass &&
             `range-slider-handle-fill-hover_${fillHandleHoverClass}`, fillHandleDraggingClass &&