@itcase/ui 1.9.37 → 1.9.39

package/dist/cjs/components/Response.js

@@ -8,9 +8,9 @@ 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 Button = require('../../Button_cjs_Dvh0E0zz.js');
-var Group = require('../../Group_cjs_BGVwVJwS.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Button = require('../../Button_cjs_Ivarkwy6.js');
+var Group = require('../../Group_cjs_xCUYKUcc.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
 require('lodash/camelCase');
@@ -25,19 +25,19 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_DRdjXL7T.js');
+require('../utils/mergeAppearanceKeys.js');
+require('../../Icon_cjs_D20B2YBo.js');
 require('react-inlinesvg');
-require('../../Link_cjs_CmBw4h-N.js');
-require('../../Loader_cjs_BHMB4c8f.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Loader_cjs_DMIUN6_q.js');
 
 const responseAppearanceConfirm = {
     confirm: {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Confirm,
+        imageSrc: String(index.responseIcon.Confirm),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
@@ -50,9 +50,8 @@ const responseAppearanceDanger = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Danger,
+        imageSrc: String(index.responseIcon.Danger),
         primaryButtonAppearance: 'dangerPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'dangerPrimary',
@@ -65,9 +64,8 @@ const responseAppearanceEmpty = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Empty,
+        imageSrc: String(index.responseIcon.Empty),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
@@ -80,9 +78,8 @@ const responseAppearanceError = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Error,
+        imageSrc: String(index.responseIcon.Error),
         primaryButtonAppearance: 'errorPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'errorPrimary',
@@ -95,9 +92,8 @@ const responseAppearanceFail = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Fail,
+        imageSrc: String(index.responseIcon.Fail),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
@@ -110,9 +106,8 @@ const responseAppearanceNothingFound = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.NothingFound,
+        imageSrc: String(index.responseIcon.NothingFound),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
@@ -125,9 +120,8 @@ const responseAppearanceRefresh = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Refresh,
+        imageSrc: String(index.responseIcon.Refresh),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
@@ -154,9 +148,8 @@ const responseAppearanceSuccess = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Success,
+        imageSrc: String(index.responseIcon.Success),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'accentPrimary',
@@ -169,9 +162,8 @@ const responseAppearanceUnableLoadData = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.UnableLoadData,
+        imageSrc: String(index.responseIcon.UnableLoadData),
         primaryButtonAppearance: 'accentPrimary sizeXXL solid',
         secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
@@ -184,9 +176,8 @@ const responseAppearanceWarning = {
         fill: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'xxl',
-        labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        imageSrc: index.responseIcon.Warning,
+        imageSrc: String(index.responseIcon.Warning),
         primaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         secondaryButtonAppearance: 'warningPrimary sizeXXL solid',
         svgFill: 'warningPrimary',
@@ -237,7 +228,6 @@ const Response = urlWithAssetPrefix.urlWithAssetPrefix(React.forwardRef(function
         }
         return null;
     }, [imageSrc, svgSrc, SvgImage, width, height]);
-    // @ts-expect-error
     const { styles: responseStyles, wrapper: wrapperStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { className: clsx(className, 'response', isBottomButton && `response_bottom-button`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass &&
             `border-color_hover_${borderColorHoverClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderWidthClass && `border-width_${borderWidthClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, heightClass && `height_${heightClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, isSkeleton && `response_skeleton`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, jsxRuntime.jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (jsxRuntime.jsx("div", { className: clsx('response__image', svgFillClass && `svg_fill_${svgFillClass}`, svgPathFillClass && `svg_path_fill_${svgPathFillClass}`), children: ImageComponent })), jsxRuntime.jsxs("div", { className: "response__wrapper-inner", children: [title && (jsxRuntime.jsx(Text.Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||

package/dist/cjs/components/SVGContent.js

@@ -26,7 +26,6 @@ const SVGContent = urlWithAssetPrefix.urlWithAssetPrefix(React.forwardRef(functi
     const { className, dataTestId, dataTour, src, SvgImage } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { svgFillClass, svgFillHoverClass } = propsGenerator;
-    // @ts-expect-error
     const { styles: svgContentStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { className: clsx(className, 'svg-content', svgFillClass && `svg_fill_${svgFillClass}`, svgFillHoverClass && `svg_fill_hover_${svgFillHoverClass}`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: svgContentStyles, children: [src && jsxRuntime.jsx(SVG, { src: src }), SvgImage && jsxRuntime.jsx(SvgImage, {})] }));
 }));

package/dist/cjs/components/ScrollOnDrag.js

@@ -26,7 +26,6 @@ function ScrollOnDrag(props) {
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { ref } = ScrollContainer.useScrollContainer();
     const { fillClass, fillHoverClass, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, heightClass, widthClass = 'fill', } = propsGenerator;
-    // @ts-expect-error
     const { scrollContainer: scrollContainerStyles, styles: styles } = useStyles.useStyles(props);
     const ScrollOnDragWrapper = isScrollbar ? SimpleBar : React.Fragment;
     const fixedProps = isScrollbar ? { scrollableNodeProps: { ref } } : {};

package/dist/cjs/components/ScrollToView.js

@@ -24,7 +24,6 @@ const ScrollToView = reactScroll.ScrollLink(function ScrollToView(props) {
     const { id, className, dataTestId, dataTour, styles, tag: Tag = 'div', onClick, children, } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { directionClass, justifyContentClass, alignClass, alignDirectionClass, alignItemsClass, alignSelfClass, textColorActiveClass, textColorClass, textColorHoverClass, heightClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: scrollToViewStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'scroll-to-view', alignItemsClass && `align-items_${alignItemsClass}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, textColorClass && `scroll-to-view_text-color_${textColorClass}`, textColorActiveClass &&
             `scroll-to-view_text-color_active_${textColorActiveClass}`, textColorHoverClass &&

package/dist/cjs/components/Search.js

@@ -7,8 +7,8 @@ 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 Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 var Scrollbar = require('../../Scrollbar_cjs_DHe1EK_B.js');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -26,7 +26,7 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 require('react-scrollbars-custom');
 
 const searchAppearanceDefault = {
@@ -56,7 +56,7 @@ const searchAppearanceDisabled = {
     disabledPrimary: {
         fill: 'surfaceDisabled',
         borderColor: 'surfaceBorderDisabled',
-        borderColorHover: 'surfaceBorderDisabledHover',
+        borderColorHover: 'surfaceBorderHoverQuaternary',
         iconAfterFill: 'surfaceItemPrimary',
         iconBeforeFill: 'surfaceItemPrimary',
         iconClearFill: 'surfaceItemPrimary',
@@ -222,7 +222,6 @@ const SearchInput = React.forwardRef(function SearchInput(props, ref) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, searchInputConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { size, fillClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, iconAfter, iconAfterFill, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeSize, iconBeforeSrc, iconClear, iconClearFill, iconClearSize, iconClearSrc, inputFillClass, inputTextColorClass, inputTextSizeClass, inputTextStyleClass, inputTextWeightClass, placeholderTextColor, placeholderTextSize, placeholderTextStyle, placeholderTextWeight, shapeClass, shapeStrengthClass, widthClass, } = propsGenerator;
-    //@ts-expect-error
     const { styles: searchInputStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("label", { className: clsx(className, 'search-input', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, widthClass && `width_${widthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, size && `search-input_size_${size}`, isSkeleton && `search-input_skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-before", size: iconBeforeSize, iconFill: iconBeforeFill, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && `fill_${inputFillClass}`), children: [jsxRuntime.jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
                             inputTextWeightClass ||

package/dist/cjs/components/Segmented.js

@@ -5,8 +5,8 @@ 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 Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -24,7 +24,7 @@ require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 
 const segmentedAppearanceDefault = {
     defaultPrimary: {
@@ -62,10 +62,6 @@ const segmentedAppearanceDisabled = {
         labelTextActiveColor: 'surfaceTextActiveQuaternary',
         labelTextColor: 'surfaceTextQuaternary',
         borderColor: 'surfaceBorderPrimary',
-        iconAfterFill: 'surfaceItemPrimary',
-        iconAfterFillActive: 'surfaceItemDisabled',
-        iconBeforeFill: 'surfaceItemPrimary',
-        iconBeforeFillActive: 'surfaceItemDisabled',
         iconFill: 'surfaceItemPrimary',
         iconFillActive: 'surfaceItemPrimary',
     },
@@ -89,14 +85,14 @@ const segmentedAppearanceRequire = {
     requirePrimary: {
         fill: 'warningTertiary',
         fillActive: 'accentPrimary',
-        fillActiveHover: 'accentActiveHoverPrimary',
-        fillHover: 'warningHoverSecondary',
-        labelTextActiveColor: 'warningTextActivePrimary',
+        fillActiveHover: 'accentPrimary',
+        fillHover: 'warningSecondary',
+        labelTextActiveColor: 'warningTextPrimary',
         labelTextColor: 'warningTextPrimary',
         labelTextColorHover: 'warningTextSecondary',
         borderColor: 'warningBorderSecondary',
         iconFill: 'warningItemSecondary',
-        iconFillActive: 'warningItemActiveTertiary',
+        iconFillActive: 'warningItemTertiary',
     },
 };
 

package/dist/cjs/components/Select.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var SelectContainer = require('../../SelectContainer_cjs_DlpMN8W0.js');
+var SelectContainer = require('../../SelectContainer_cjs_Bd9llsQa.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -20,18 +20,19 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('../../Group_cjs_BGVwVJwS.js');
+require('../../Group_cjs_xCUYKUcc.js');
 require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Text_cjs_BJ9NgJkx.js');
+require('../../Text_cjs_erTy2pUN.js');
 require('@itcase/icons/default');
-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('../../Loader_cjs_BHMB4c8f.js');
-require('../../Divider_cjs_DmIeh3Jq.js');
+require('../../Link_cjs_DXBqPjwm.js');
+require('../../Loader_cjs_DMIUN6_q.js');
+require('../utils/mergeAppearanceKeys.js');
+require('../../Divider_cjs_C5Ou2Kqa.js');
 
 
 

package/dist/cjs/components/Swiper.js

@@ -4,11 +4,11 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var react = require('swiper/react');
-var Group = require('../../Group_cjs_BGVwVJwS.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Group = require('../../Group_cjs_xCUYKUcc.js');
+var Text = require('../../Text_cjs_erTy2pUN.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('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -26,7 +26,7 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 
 function Swiper(props) {
     const { id, className, dataTestId, dataTour, direction, minZoom = 1, maxZoom = 5, title, titleAfter, titleSize, titleTextColor, titleWeight, activeSlideIndex = 0, allowTouchMove, autoHeight, breakpoints, forwardedRef, freeMode, items, keyboard, loop, modules, mousewheel, nextButton, normalizeSlideIndex, pagination, prevButton, preventClicks, preventClicksPropagation, simulateTouch, slidesPerView, spaceBetween, speed, swiperClass, swiperSlideClass, isChangeOnClickSlide, isInit, isNavigation = false, isScrollbar, isShowOriginalLink = false, isZoomEnabled = false, setNextBtnDisabled, setPrevBtnDisabled, onSlideNextTransitionEnd, onSlidePrevTransitionEnd, onSwiper, onUpdate, children, } = props;
@@ -73,7 +73,6 @@ function Swiper(props) {
     }, [activeSlideIndex]);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { alignClass, alignDirectionClass, fillClass, shapeClass } = propsGenerator;
-    // @ts-expect-error
     const { styles: style } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), "data-testid": dataTestId, "data-tour": dataTour, style: style, children: [title && (jsxRuntime.jsxs("div", { className: "swiper-block__wrapper", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "swiper-block__title", size: titleSize, textColor: titleTextColor, textWeight: titleWeight, children: title })), titleAfter] })), prevButton && nextButton && (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx("div", { className: "swiper-block__prev swiper-button", ref: prevRef, children: prevButton }), jsxRuntime.jsx("div", { className: "swiper-block__next swiper-button", ref: nextRef, children: nextButton })] })), jsxRuntime.jsx(react.Swiper, { className: clsx('swiper-block__swiper', swiperClass), ref: swiperRef, direction: direction, allowTouchMove: allowTouchMove, autoHeight: autoHeight ?? false, breakpoints: breakpoints, centeredSlides: true, freeMode: freeMode, init: isInit ?? true, keyboard: keyboard, loop: isLoop, modules: modules, mousewheel: mousewheel, navigation: isNavigation ? { nextEl, prevEl } : false, normalizeSlideIndex: normalizeSlideIndex, pagination: pagination, preventClicks: preventClicks, preventClicksPropagation: preventClicksPropagation, scrollbar: isScrollbar, simulateTouch: simulateTouch, slidesPerView: slidesPerView, spaceBetween: spaceBetween, speed: speed ?? 500, zoom: {
                     minRatio: minZoom,

package/dist/cjs/components/Switch.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 Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
@@ -24,9 +24,9 @@ require('lodash/maxBy');
 const switchAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceTertiary',
-        fillActive: 'successPrimary',
-        fillToggle: 'surfaceSecondary',
-        fillToggleActive: 'successActivePrimary',
+        fillActive: 'surfaceTertiary',
+        fillToggle: 'surfacePrimary',
+        fillToggleActive: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
     },
@@ -45,10 +45,10 @@ const switchAppearanceDisabled = {
 
 const switchAppearanceError = {
     errorPrimary: {
-        fill: 'errorPrimary',
+        fill: 'surfaceTertiary',
         fillActive: 'errorSecondary',
-        fillToggle: 'errorPrimary',
-        fillToggleActive: 'errorActivePrimary',
+        fillToggle: 'surfacePrimary',
+        fillToggleActive: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
     },
@@ -56,10 +56,10 @@ const switchAppearanceError = {
 
 const switchAppearanceRequire = {
     requirePrimary: {
-        fill: 'warningPrimary',
+        fill: 'surfaceTertiary',
         fillActive: 'warningSecondary',
-        fillToggle: 'warningPrimary',
-        fillToggleActive: 'warningActivePrimary',
+        fillToggle: 'surfacePrimary',
+        fillToggleActive: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
     },
@@ -101,10 +101,10 @@ const switchAppearanceStyle = {
 
 const switchAppearanceSuccess = {
     successPrimary: {
-        fill: 'successPrimary',
+        fill: 'surfaceTertiary',
         fillActive: 'successPrimary',
-        fillToggle: 'successPrimary',
-        fillToggleActive: 'successActivePrimary',
+        fillToggle: 'surfacePrimary',
+        fillToggleActive: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
     },

package/dist/cjs/components/Tab.js

@@ -3,14 +3,15 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
+var mergeAppearanceKeys = require('../utils/mergeAppearanceKeys.js');
 var useActiveClasses = require('../hooks/useActiveClasses/useActiveClasses.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 Divider = require('../../Divider_cjs_DmIeh3Jq.js');
-var Link = require('../../Link_cjs_CmBw4h-N.js');
-var Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Divider = require('../../Divider_cjs_C5Ou2Kqa.js');
+var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('../hooks/useActiveClasses/useActiveClasses.helpers.js');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -127,7 +128,7 @@ const tabAppearanceSurface = {
         borderColor: 'surfaceBorderPrimary',
         borderColorActive: 'surfaceBorderActivePrimary',
         badgeAppearance: 'accentPrimary solid circular',
-        dividerFill: 'accentPrimary',
+        dividerFill: 'surfacePrimary',
         dividerFillActive: 'accentPrimary',
         dividerFillDisabled: 'accentDisabled',
         iconFillIcon: 'surfaceItemPrimary',
@@ -216,16 +217,14 @@ function Tab(props) {
         isDisabled: isDisabled,
     });
     const { justifyContentClass, alignClass, labelTextAlign, labelTextColor, labelTextColorActive, labelTextColorHover, labelTextSize, labelTextStyle, labelTextWeight, labelTextWrap, badgeAppearance, badgeAppearanceSize, badgeShape, badgeSize, badgeTextColor, badgeTextSize, dividerFill, dividerFillActive, dividerFillActiveHover, dividerFillDisabled, dividerFillHover, dividerSize, icon, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, linkFill, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: tab } = useStyles.useStyles(props);
-    return (jsxRuntime.jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && `tab_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, justifyContentClass && `tab_justify-content_${justifyContentClass}`, isSkeleton && `tab_skeleton`, onClick && 'cursor_type_pointer'), "data-testid": dataTestId && `${dataTestId}Tab`, "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsxs(Link.Link, { className: clsx('tab__link', !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: clsx('tab__wrapper', alignClass && `align_${alignClass}`), children: [label && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (jsxRuntime.jsx(Icon.Badge, { appearance: `${badgeAppearance} ${badgeAppearanceSize}`, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "tab__icon_after", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), jsxRuntime.jsx(Divider.Divider, { className: "tab__divider", width: "fill", direction: "horizontal", size: dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
+    return (jsxRuntime.jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && `tab_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, justifyContentClass && `tab_justify-content_${justifyContentClass}`, isSkeleton && `tab_skeleton`, onClick && 'cursor_type_pointer'), "data-testid": dataTestId && `${dataTestId}Tab`, "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsxs(Link.Link, { className: clsx('tab__link', !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: clsx('tab__wrapper', alignClass && `align_${alignClass}`), children: [label && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (jsxRuntime.jsx(Icon.Badge, { appearance: mergeAppearanceKeys.mergeAppearanceKeys(badgeAppearance, badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "tab__icon_after", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), jsxRuntime.jsx(Divider.Divider, { className: "tab__divider", width: "fill", direction: "horizontal", size: dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
 }
 
 function TabGroup(props) {
     const { className, dataTestId, dataTour, horizontalScroll, style, tabAppearance, tabList, children, } = props;
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
     const { directionClass, alignClass, alignDirectionClass, fillClass, borderColorClass, borderTypeClass, borderWidthClass, widthClass, wrapClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: groupStyles, wrapper: groupWrapperStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx("div", { className: clsx(className, 'tab-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsxRuntime.jsxs("div", { className: "tab-group__wrapper", style: groupWrapperStyles, children: [tabList?.map((item) => (jsxRuntime.jsx(Tab, { appearance: tabAppearance, label: item.label, isActive: item.isActive }, item.key))), children] })) : (jsxRuntime.jsxs(React.Fragment, { children: [tabList?.map((item) => (jsxRuntime.jsx(Tab, { appearance: tabAppearance, label: item.label, badgeValue: item.badgeValue, icon: item.icon, iconSrc: item.icon, isActive: item.isActive, onClick: item.onClick }, item.key))), children] })) }));
 }

package/dist/cjs/components/Text.js

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

package/dist/cjs/components/Tile.js

@@ -5,8 +5,8 @@ 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 Text = require('../../Text_cjs_BJ9NgJkx.js');
+var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Text = require('../../Text_cjs_erTy2pUN.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
@@ -24,7 +24,7 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 
 const tileAppearanceShape = {
     circular: {
@@ -169,7 +169,6 @@ function Tile(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, tileConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, alignClass, alignDirectionClass, fillClass, titleTextAlign, titleTextColor, titleTextSize, titleTextWeight, titleTextWrap, descTextColor, descTextSize, descTextWrap, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, badgeAppearance, badgeAppearanceSize, badgeShape, badgeSize, badgeTextColor, badgeTextSize, icon, iconAppearance, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: tileStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsx("div", { className: clsx('tile', className, fillClass && `fill_${fillClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, alignClass && `align_${alignClass}`, directionClass && `direction_${directionClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `tile_size_${sizeClass}`, type && `tile_type_${type}`, badgeValue && `tile_state_badge`, widthClass && `width_${widthClass}`, isSkeleton && `tile_skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: tileStyles, onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('tile__wrapper', alignClass, alignDirectionClass), children: [before, jsxRuntime.jsxs("div", { className: "tile__header", children: [jsxRuntime.jsxs("div", { className: "tile__header-inner", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "tile__title", size: titleTextSize, textAlign: titleTextAlign, textColor: titleTextColor, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: "tile__text", size: descTextSize, textColor: descTextColor, textWrap: descTextWrap, children: desc }))] }), jsxRuntime.jsxs("div", { className: "tile__header-actions", children: [badgeValue && (jsxRuntime.jsx(Icon.Badge, { appearance: `${badgeAppearance} ${badgeAppearanceSize}`, className: "tile__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { appearance: iconAppearance, className: "tile__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] })] }), children, after] }) }));
 }

package/dist/cjs/components/Title.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/Tooltip.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/Video.js

@@ -19,7 +19,6 @@ require('../hooks/useStyles/styleAttributes.js');
 
 function Video(props) {
     const { id, className, dataTestId, dataTour, position, mp4, ogv, poster, webm, children, } = props;
-    //@ts-expect-error
     const { styles: videoStyles } = useStyles.useStyles(props);
     return (jsxRuntime.jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, position && `video_position_${position}`), "data-testid": dataTestId, "data-tour": dataTour, style: videoStyles, children: [jsxRuntime.jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsxRuntime.jsx("source", { type: 'video/webm; codecs="vp8, vorbis"', src: webm }), ogv && jsxRuntime.jsx("source", { type: 'video/ogg; codecs="theora, vorbi"', src: ogv }), mp4 && (jsxRuntime.jsx("source", { type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"', src: mp4 }))] }), children] }));
 }

package/dist/cjs/components/Warning.js

@@ -6,8 +6,8 @@ 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 Text = require('../../Text_cjs_BJ9NgJkx.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,7 +25,7 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_CmBw4h-N.js');
+require('../../Link_cjs_DXBqPjwm.js');
 
 const warningAppearanceAccent = {
     accentMutedPrimary: {
@@ -190,7 +190,6 @@ function Warning(props) {
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, warningConfig);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, labelTextColor, labelTextSize, labelTextWeight, descriptionTextColor, descriptionTextSize, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: warningStyles } = useStyles.useStyles(props);
     const [isVisible, setIsVisible] = React.useState(true);
     return (jsxRuntime.jsx(React.Fragment, { children: isVisible && (jsxRuntime.jsxs("div", { className: clsx(className, 'warning', fillClass && `fill_${fillClass}`, sizeClass && `warning_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `warning_skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: warningStyles, children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { fill: iconBeforeFill, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: 'warning__content', children: [label && (jsxRuntime.jsx(Text.Text, { size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), description && (jsxRuntime.jsx(Text.Text, { size: descriptionTextSize, textColor: descriptionTextColor, children: description })), children] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { fill: iconAfterFill, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, SvgImage: iconAfter, onClick: () => setIsVisible(false) }))] })) }));

package/dist/cjs/utils/mergeAppearanceKeys.js

@@ -0,0 +1,5 @@
+'use strict';
+
+const mergeAppearanceKeys = (...values) => values.join(' ');
+
+exports.mergeAppearanceKeys = mergeAppearanceKeys;

package/dist/cjs/utils.js

@@ -1,7 +1,9 @@
 'use strict';
 
+var mergeAppearanceKeys = require('./utils/mergeAppearanceKeys.js');
 var setViewportProperty = require('./utils/setViewportProperty.js');
 
 
 
+exports.mergeAppearanceKeys = mergeAppearanceKeys.mergeAppearanceKeys;
 exports.setViewportProperty = setViewportProperty.setViewportProperty;