@itcase/ui 1.9.37 → 1.9.39

package/dist/components/Flex.js

@@ -21,7 +21,6 @@ function Flex(props) {
     const { id, className, dataTestId, dataTour, type, dataId, print, style, tag: Tag = 'div', onClick, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { directionClass, justifyContentClass, alignContentClass, alignItemsClass, fillClass, borderColorClass, borderTypeClass, flowClass, positionClass, shapeClass, widthClass, wrapClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: flexStyles, wrapper: flexWrapperStyles } = useStyles(props);
     return (jsx(Tag, { id: id, className: clsx(className, 'flex', widthClass && `width_${widthClass}`, alignContentClass && `flex_align-content_${alignContentClass}`, alignItemsClass && `flex_align-items_${alignItemsClass}`, directionClass && `flex_direction_${directionClass}`, fillClass && `fill_${fillClass}`, flowClass && `flex_flow_${flowClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, positionClass && `position_${positionClass}`, justifyContentClass && `flex_justify-content_${justifyContentClass}`, shapeClass && `flex_shape_${shapeClass}`, type && `flex_type_${type}`, !print && 'no-print', print && 'print', wrapClass && `flex_wrap_${wrapClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, flexStyles, style), onClick: onClick, children: jsx("div", { className: "flex__wrapper", style: flexWrapperStyles, children: children }) }));
 }
@@ -30,7 +29,6 @@ function FlexItem(props) {
     const { className, htmlFor, print, style, tag: Tag = 'div', children } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { dataTestId, dataTour, directionClass, justifyContentClass, alignItemsClass, alignSelfClass, fillClass, fillHoverClass, dataId, growClass, positionClass, shapeClass, widthClass, wrapClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: flexItemStyles } = useStyles(props);
     return (jsx(Tag, { className: clsx(className, 'flex__item', positionClass && `position_${positionClass}`, alignItemsClass && `flex__item_align-items_${alignItemsClass}`, alignSelfClass && `flex__item_align-self_${alignSelfClass}`, directionClass && `flex__item_direction_${directionClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, growClass && `flex__item_grow_${growClass}`, justifyContentClass &&
             `flex__item_justify-content_${justifyContentClass}`, shapeClass && `flex__item_shape_${shapeClass}`, !print && 'no-print', print && 'print', widthClass && `width_${widthClass}`, wrapClass && `flex__item_wrap_${wrapClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, flexItemStyles, style), children: children }));

package/dist/components/Grid.js

@@ -21,7 +21,6 @@ function Grid(props) {
     const { id, className, dataTestId, dataTour, type, horizontalResizing, horizontalScroll, print, tag: Tag = 'div', useGridSystem, verticalResizing, before, after, onClick, onDoubleClick, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { justifyContentClass, justifyItemsClass, alignContentClass, alignItemsClass, fillClass, fillHoverClass, borderColorClass, columnGapClass, columnsClass, heightClass, rowGapClass, rowsClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: gridStyles } = useStyles(props);
     return (jsxs(Tag, { id: id, className: clsx(className, 'grid', widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, useGridSystem && `grid_state_system`, horizontalScroll && `grid_scroll_horizontal`, type && `grid_type_${type}`, columnsClass && `grid_columns_${columnsClass}`, rowsClass && `grid_rows_${rowsClass}`, rowGapClass && `grid_row-gap_${rowGapClass}`, columnGapClass && `grid_column-gap_${columnGapClass}`, alignContentClass && `grid_align-content_${alignContentClass}`, alignItemsClass && `grid_align-items_${alignItemsClass}`, borderColorClass && `border-color_${borderColorClass}`, justifyContentClass && `grid_justify-content_${justifyContentClass}`, justifyItemsClass && `grid_justify-items_${justifyItemsClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, horizontalResizing && `grid_horizontal-resizing_${horizontalResizing}`, verticalResizing && `grid_vertical-resizing_${verticalResizing}`, !print && 'no-print', print && 'print'), "data-testid": dataTestId, "data-tour": dataTour, style: gridStyles, onClick: onClick, onDoubleClick: onDoubleClick, children: [before && jsx("div", { className: "grid__before", children: before }), children, after && jsx("div", { className: "grid__after", children: after })] }));
 }
@@ -30,7 +29,6 @@ function GridItem(props) {
     const { id, className, dataTestId, dataTour, print, style, onClick, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { directionClass, justifySelfClass, alignSelfClass, fillClass, fillHoverClass, columnEndClass, columnGapClass, columnSpanClass, columnStartClass, gapClass, heightClass, orderClass, rowEndClass, rowGapClass, rowSpanClass, rowStartClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: gridItemStyles } = useStyles(props);
     return (jsx("div", { id: id, className: clsx(className, 'grid__item', orderClass && `order_${orderClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, alignSelfClass && `grid__item_align-self_${alignSelfClass}`, justifySelfClass && `grid__item_justify-self_${justifySelfClass}`, columnStartClass && `grid__item_column-start_${columnStartClass}`, columnEndClass && `grid__item_column-end_${columnEndClass}`, columnSpanClass && `grid__item_column-span_${columnSpanClass}`, rowStartClass && `grid__item_row-start_${rowStartClass}`, rowEndClass && `grid__item_row-end_${rowEndClass}`, rowSpanClass && `grid__item_row-span_${rowSpanClass}`, directionClass && `direction_${directionClass}`, gapClass && `gap_${gapClass}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, rowGapClass && `row-gap_${rowGapClass}`, !print && 'no-print', print && 'print', columnGapClass && `column-gap_${columnGapClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, gridItemStyles, style), onClick: onClick, children: children }));
 }
@@ -39,7 +37,6 @@ function GridRow(props) {
     const { id, className, dataTestId, dataTour, dataId, htmlFor, print, tag: Tag = 'div', onClick, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { fillClass, fillHoverClass, borderColorClass, heightClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: gridRowStyles } = useStyles(props);
     return (jsx(Tag, { id: id, className: clsx(className, 'grid__row', widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, !print && 'no-print', print && 'print', borderColorClass && `border-color_${borderColorClass}`), "data-id": dataId, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: gridRowStyles, onClick: onClick, children: children }));
 }

package/dist/components/Group.js

@@ -1,4 +1,4 @@
-export { G as Group, a as groupAppearance, g as groupConfig } from '../Group_es_CrDAyR_E.js';
+export { G as Group, a as groupAppearance, g as groupConfig } from '../Group_es_BVpRj4LR.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/components/HTMLContent.js

@@ -21,7 +21,6 @@ function HTMLContent(props) {
     const { className, dataTestId, dataTour, content, style, onClick, children } = props;
     const propsGenerator = 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(props);
     return (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/components/HeroTitle.js

@@ -4,7 +4,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 { I as Icon } from '../Icon_es_BoUAbwyu.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -21,8 +21,8 @@ import 'lodash/maxBy';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const heroTitleAppearanceSize = {
     sizeH1: {
@@ -60,7 +60,6 @@ function HeroTitle(props) {
     const appearanceConfig = useAppearanceConfig(appearance, heroTitleConfig, isDisabled);
     const propsGenerator = 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(props);
     const Tag = useMemo(() => {
         if (tag) {

package/dist/components/Icon.js

@@ -1,4 +1,4 @@
-export { I as Icon, e as iconAppearance, i as iconConfig } from '../Icon_es_BoUAbwyu.js';
+export { I as Icon, e as iconAppearance, i as iconConfig } from '../Icon_es_DNVHNKFK.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -21,5 +21,5 @@ import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';

package/dist/components/Image.js

@@ -1,4 +1,4 @@
-export { I as Image } from '../Image_es_CTXiU4L4.js';
+export { I as Image } from '../Image_es_DbD3JzLa.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/components/Input.js

@@ -1,4 +1,4 @@
-export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_BUJJnw5X.js';
+export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_CYUPx5I_.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';

package/dist/components/InputNumber.js

@@ -3,7 +3,7 @@ import { useState, useCallback } from 'react';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { B as Button } from '../Button_es_BDrXGgUw.js';
+import { B as Button } from '../Button_es_ul2sDicM.js';
 import { icons24 } from '@itcase/icons/default';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -17,15 +17,16 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
+import '../utils/mergeAppearanceKeys.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Icon_es_BoUAbwyu.js';
+import '../Icon_es_DNVHNKFK.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
-import '../Loader_es_CcFl-K-t.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
+import '../Loader_es_DFSNJsLL.js';
 
 const inputNumberAppearanceShape = {
     circular: {

package/dist/components/InputPassword.js

@@ -4,7 +4,7 @@ import { useState, useMemo, useCallback } from 'react';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { I as Icon } from '../Icon_es_BoUAbwyu.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -22,15 +22,14 @@ import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const inputPasswordAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         borderColor: 'surfaceBorderTertiary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
         caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,
@@ -41,7 +40,6 @@ const inputPasswordAppearanceDefault = {
         fill: 'surfacePrimary',
         borderColor: 'surfaceBorderTertiary',
         textColor: 'surfaceTextPrimary',
-        textColorDisabled: 'surfaceTextDisabled',
         caret: 'extraItemSecondary',
         iconFill: 'surfaceItemQuaternary',
         iconRevealableHide: icons24.View.HideValue,

package/dist/components/Label.js

@@ -1,4 +1,4 @@
-export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_DTsS8xDD.js';
+export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_CbXFs_ts.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -18,9 +18,9 @@ import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
-import '../Icon_es_BoUAbwyu.js';
+import '../Icon_es_DNVHNKFK.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';

package/dist/components/Link.js

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

package/dist/components/List.js

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

package/dist/components/Loader.js

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

package/dist/components/Logo.js

@@ -5,7 +5,7 @@ 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_OpkyzWe6.js';
+import { a as LinkWrapper } from '../Link_es_BwLH5S8y.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
 import 'lodash/camelCase';
@@ -32,7 +32,6 @@ const Logo = urlWithAssetPrefix(forwardRef(function Logo(props, ref) {
     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', 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 })) }));
 }));

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_BoUAbwyu.js';
-import { L as Link } from '../Link_es_OpkyzWe6.js';
-import { T as Text } from '../Text_es_DR4Alx-v.js';
+import { I as Icon, T as Tooltip } from '../Icon_es_DNVHNKFK.js';
+import { L as Link } from '../Link_es_BwLH5S8y.js';
+import { T as Text } from '../Text_es_B85LGfjW.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -232,7 +232,6 @@ function MenuItem(props) {
     const appearanceConfig = useAppearanceConfig(appearance, menuItemConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorDisabled, labelTextColorHover, labelTextSize, labelWeight, labelWrap, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, tooltipFill, tooltipShape, tooltipShapeStrength, tooltipSize, tooltipText, tooltipTextColor, tooltipTextSize, tooltipTitle, tooltipTitleTextColor, typeClass, widthClass, isSkeleton, } = propsGenerator;
-    // @ts-expect-error
     const { styles: menuItem } = useStyles(props);
     return (jsxs("div", { className: clsx('menu-item', easing && `easing_${easing}`, isActive && 'menu-item_state_active', isDisabled && `menu-item_state_disabled`, directionClass && `menu-item_direction_${directionClass}`, className, (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc) &&
             'menu-item_label-icon', sizeClass && `menu-item_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, !isActive

package/dist/components/Modal.js

@@ -3,12 +3,13 @@ import React, { useState, useRef, useCallback, startTransition, useEffect, useLa
 import clsx from 'clsx';
 import ReactDOM from 'react-dom';
 import { icons24, icons32, icons40 } from '@itcase/icons/default';
+import { mergeAppearanceKeys } from '../utils/mergeAppearanceKeys.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 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 { b as Title, I as Icon } from '../Icon_es_DNVHNKFK.js';
+import { O as Overlay } from '../Overlay_es_Dx6UIr2X.js';
+import { L as Loader } from '../Loader_es_DFSNJsLL.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -25,8 +26,8 @@ import 'lodash/maxBy';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const modalAppearanceShape = {
     circular: {
@@ -178,11 +179,11 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         setIsOpen(false);
         onCloseModal && onCloseModal();
     }, [modalElement, onCloseModal]);
-    const handleClickOverlay = useCallback(() => {
+    const handleClickOverlay = useCallback((event) => {
         if (isCloseOnBlur) {
             closeModal();
         }
-        onClickOverlay && onClickOverlay();
+        onClickOverlay && onClickOverlay(event);
     }, [closeModal, isCloseOnBlur, onClickOverlay]);
     useEffect(() => {
         if (!modalElement) {
@@ -201,7 +202,7 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         if (element) {
             addModalProps(element);
         }
-    }, [addModalProps, className, modalIdQuerySelector]);
+    }, [addModalProps, className, modalIdQuerySelector, print]);
     useEffect(() => {
         if (!isCloseOnBlur || !isOpen) {
             return;
@@ -226,10 +227,9 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     const appearanceConfig = useAppearanceConfig(appearance, modalConfig, isDisabled);
     const propsGenerator = 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(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: [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", 
+        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: mergeAppearanceKeys(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_BoUAbwyu.js';
+import { b as Title } from '../Icon_es_DNVHNKFK.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -22,8 +22,8 @@ import 'lodash/maxBy';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_OpkyzWe6.js';
-import '../Text_es_DR4Alx-v.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const modalSheetBottomAppearanceSize = {
     sizeL: {
@@ -59,7 +59,6 @@ const ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
     const appearanceConfig = useAppearanceConfig(appearance, modalSheetBottomConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, zeroPadding, } = propsGenerator;
-    // @ts-expect-error
     const { styles } = useStyles(props);
     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 })] }));
 });

package/dist/components/Notification.js

@@ -1,12 +1,13 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
+import { mergeAppearanceKeys } from '../utils/mergeAppearanceKeys.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_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 { B as Button } from '../Button_es_ul2sDicM.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.js';
+import { L as Loader } from '../Loader_es_DFSNJsLL.js';
+import { T as Text } from '../Text_es_B85LGfjW.js';
 import { icons24 } from '@itcase/icons/default';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import '../context/UIContext.js';
@@ -22,7 +23,7 @@ import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
-import '../Link_es_OpkyzWe6.js';
+import '../Link_es_BwLH5S8y.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
@@ -180,9 +181,8 @@ function Notification(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 = '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] }));
+    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: mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsx(Icon, { appearance: mergeAppearanceKeys(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] }));
 }
 
 function NotificationWrapper(props) {

package/dist/components/Overlay.js

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

package/dist/components/Pagination.js

@@ -6,9 +6,9 @@ import ReactPaginate from 'react-paginate';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es_CgVFMUyM.js';
-import { I as Icon } from '../Icon_es_BoUAbwyu.js';
-import { T as Text } from '../Text_es_DR4Alx-v.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es__mygSEH6.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.js';
+import { T as Text } from '../Text_es_B85LGfjW.js';
 import { icons14, icons16, icons24 } from '@itcase/icons/default';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -23,11 +23,11 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import 'lodash/maxBy';
-import '../Divider_es_Cod0xv2q.js';
+import '../Divider_es_BR7ZO8w0.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_OpkyzWe6.js';
+import '../Link_es_BwLH5S8y.js';
 
 const paginationAppearanceAccent = {
     accentPrimary: {
@@ -112,7 +112,7 @@ const paginationAppearanceSize = {
         pageCountDropdownItemDividerSize: 'xxs',
         pageCountDropdownItemLabelSize: 'm',
         pageCountDropdownItemSize: 'l',
-        pageCountDropdownItemWidth: '64',
+        pageCountDropdownItemWidth: '64px',
         pageCountInputIcon: icons14.Arrow.ChevronDownSmall,
         pageCountInputIconFillSize: '24',
         pageCountInputTextSize: 'l',
@@ -274,7 +274,6 @@ function Pagination(props) {
     const appearanceConfig = useAppearanceConfig(appearance, paginationConfig, isDisabled);
     const propsGenerator = 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(props);
     const minPageSize = Math.min(perPageCount, ...pageCountList);
     const isPaginationDisplayed = allItemsCount > minPageSize;

package/dist/components/Radio.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { T as Text } from '../Text_es_DR4Alx-v.js';
+import { T as Text } from '../Text_es_B85LGfjW.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';

package/dist/components/RangeSlider.js

@@ -22,7 +22,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(props);
     const { fillClass, fillHandleClass, fillHandleDraggingClass, fillHandleDraggingHoverClass, fillHandleHoverClass, fillRailClass, fillTrackClass, shapeClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: rangeSliderStyles } = useStyles(props);
     return (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 &&