@itcase/ui 1.8.42 → 1.8.44

package/dist/components/Logo.js

@@ -1,10 +1,11 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { urlWithAssetPrefix } from '../hoc/urlWithAssetPrefix.js';
+import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { a as LinkWrapper } from '../Link_es_DxtZLeKY.js';
+import { a as LinkWrapper } from '../Link_es_BnUIX0QT.js';
+import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
@@ -28,10 +29,7 @@ var logoConfig = {
 };
 var Logo = urlWithAssetPrefix(function Logo(props) {
     var className = props.className, appearance = props.appearance, size = props.size, href = props.href, link = props.link, mode = props.mode;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = logoConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, logoConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignItemsClass = propsGenerator.alignItemsClass, src = propsGenerator.src, title = propsGenerator.title, alt = propsGenerator.alt, widthClass = propsGenerator.widthClass;
     // @ts-expect-error

package/dist/components/MenuItem.js

@@ -1,12 +1,13 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 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 '../Tooltip_es_Y2aoFQW7.js';
-import { L as Link } from '../Link_es_DxtZLeKY.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { I as Icon, T as Tooltip } from '../Icon_es_k9bHSLyL.js';
+import { L as Link } from '../Link_es_BnUIX0QT.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -24,6 +25,14 @@ import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 
 var menuItemAppearanceAccent = {
+    accentMutedPrimary: {
+        fill: 'accentTertiary',
+        fillHover: 'accentTertiaryHover',
+        labelTextColor: 'accentTextQuaternary',
+        borderColor: 'accentBorderSecondary',
+        iconAfterFillIcon: 'accentItemQuaternary',
+        iconBeforeFillIcon: 'accentItemQuaternary',
+    },
     accentPrimary: {
         fill: 'accentPrimary',
         fillHover: 'accentPrimaryHover',
@@ -43,6 +52,13 @@ var menuItemAppearanceAccent = {
 };
 
 var menuItemAppearanceError = {
+    errorMutedPrimary: {
+        fill: 'errorDisabled',
+        labelTextColor: 'errorTextQuaternary',
+        labelTextColorHover: 'errorTextQuaternary',
+        iconAfterFillIcon: 'errorItemQuaternary',
+        iconBeforeFillIcon: 'errorItemQuaternary',
+    },
     errorPrimary: {
         fill: 'errorPrimary',
         fillHover: 'errorPrimaryHover',
@@ -114,6 +130,14 @@ var menuItemAppearanceStyle = {
 };
 
 var menuItemAppearanceSurface = {
+    surfaceMutedPrimary: {
+        fill: 'surfaceSecondary',
+        fillActive: 'surfacePrimary',
+        fillActiveHover: 'surfaceHover',
+        labelTextColor: 'surfaceTextQuaternary',
+        iconAfterFillIcon: 'surfaceItemQuaternary',
+        iconBeforeFillIcon: 'surfaceItemQuaternary',
+    },
     surfacePrimary: {
         fill: 'surfacePrimary',
         fillActive: 'surfaceHover',
@@ -156,10 +180,7 @@ var menuItemConfig = {
 };
 function MenuItem(props) {
     var className = props.className, appearance = props.appearance, label = props.label, isDisabled = props.isDisabled, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, target = props.target, underline = props.underline, before = props.before, after = props.after, isActive = props.isActive, onClick = props.onClick, onMouseEnter = props.onMouseEnter, children = props.children;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = menuItemConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, menuItemConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelStyle = propsGenerator.labelStyle, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveColorDisabled = propsGenerator.labelTextActiveColorDisabled, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextActiveHoverColorDisabled = propsGenerator.labelTextActiveHoverColorDisabled, labelTextColor = propsGenerator.labelTextColor, labelTextColorDisabled = propsGenerator.labelTextColorDisabled, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextHoverColorDisabled = propsGenerator.labelTextHoverColorDisabled, labelTextSize = propsGenerator.labelTextSize, labelWeight = propsGenerator.labelWeight, labelWrap = propsGenerator.labelWrap, borderColorClass = propsGenerator.borderColorClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBadgeAppearance = propsGenerator.iconBadgeAppearance, iconBadgeShape = propsGenerator.iconBadgeShape, iconBadgeSize = propsGenerator.iconBadgeSize, iconBadgeTextColor = propsGenerator.iconBadgeTextColor, iconBadgeTextSize = propsGenerator.iconBadgeTextSize, iconBadgeValue = propsGenerator.iconBadgeValue, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipFill = propsGenerator.tooltipFill, tooltipShapeStrength = propsGenerator.tooltipShapeStrength, tooltipText = propsGenerator.tooltipText, tooltipTextColor = propsGenerator.tooltipTextColor, tooltipTitleTextColor = propsGenerator.tooltipTitleTextColor, typeClass = propsGenerator.typeClass, widthClass = propsGenerator.widthClass, isSkeleton = propsGenerator.isSkeleton;
     // @ts-expect-error

package/dist/components/Modal.js

@@ -1,13 +1,14 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useState, useRef, useCallback, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
 import clsx from 'clsx';
 import ReactDOM from 'react-dom';
+import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { O as Overlay } from '../Overlay_es_DczPjVL9.js';
-import { b as Title } from '../Tooltip_es_Y2aoFQW7.js';
-import { L as Loader } from '../Loader_es_GYOr0UTX.js';
+import { O as Overlay } from '../Overlay_es_D_izIIUB.js';
+import { b as Title } from '../Icon_es_k9bHSLyL.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
+import { L as Loader } from '../Loader_es_BDb87cdb.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -20,11 +21,11 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Text_es_BfLRfj-5.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../Link_es_BnUIX0QT.js';
+import '../Text_es_Ffjr5J1k.js';
 
 var modalAppearanceSurface = {
     surfacePrimary: {
@@ -63,7 +64,7 @@ var getOrCreateModalElement = function (modalQuerySelector, className) {
 };
 // Modal component that is an abstraction around the portal API.
 var Modal = React.forwardRef(function Modal(props, ref) {
-    var id = props.id, className = props.className, appearance = props.appearance, title = props.title, contentClassName = props.contentClassName, dataTestId = props.dataTestId, dataTour = props.dataTour, _a = props.modalQuerySelector, modalQuerySelector = _a === void 0 ? '#modal-global' : _a, overlayClassName = props.overlayClassName, closeButton = props.closeButton, _b = props.isCloseOnBlur, isCloseOnBlur = _b === void 0 ? true : _b, _c = props.isOpen, initialIsOpen = _c === void 0 ? false : _c, _d = props.isOverlay, isOverlay = _d === void 0 ? true : _d, _e = props.isScrollOnOpen, isScrollOnOpen = _e === void 0 ? true : _e, _f = props.isSetFocusOnOpen, isSetFocusOnOpen = _f === void 0 ? true : _f, isSkeleton = props.isSkeleton, onClickOverlay = props.onClickOverlay, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal, scroll = props.scroll, children = props.children;
+    var id = props.id, className = props.className, appearance = props.appearance, title = props.title, contentClassName = props.contentClassName, dataTestId = props.dataTestId, dataTour = props.dataTour, _a = props.modalQuerySelector, modalQuerySelector = _a === void 0 ? '#modal-global' : _a, overlayClassName = props.overlayClassName, scroll = props.scroll, closeButton = props.closeButton, _b = props.isCloseOnBlur, isCloseOnBlur = _b === void 0 ? true : _b, _c = props.isOpen, initialIsOpen = _c === void 0 ? false : _c, _d = props.isOverlay, isOverlay = _d === void 0 ? true : _d, _e = props.isScrollOnOpen, isScrollOnOpen = _e === void 0 ? true : _e, _f = props.isSetFocusOnOpen, isSetFocusOnOpen = _f === void 0 ? true : _f, isSkeleton = props.isSkeleton, onClickOverlay = props.onClickOverlay, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal, children = props.children;
     // Query DOM element
     var _g = useState(null), modalElement = _g[0], setModalElement = _g[1];
     var _h = useState(initialIsOpen), isOpen = _h[0], setIsOpen = _h[1];
@@ -145,10 +146,7 @@ var Modal = React.forwardRef(function Modal(props, ref) {
     }, [addModalProps, className, modalQuerySelector]);
     // Save ref things
     useImperativeHandle(ref, function () { return ({ modalElement: modalElement, openModal: openModal, closeModal: closeModal, isOpen: isOpen }); }, [isOpen, openModal, closeModal, modalElement]);
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = modalConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, modalConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, titleTextColor = propsGenerator.titleTextColor, titleTextColorHover = propsGenerator.titleTextColorHover, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWidth = propsGenerator.titleTextWidth, titleTextWrap = propsGenerator.titleTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, elevationClass = propsGenerator.elevationClass, overlayFill = propsGenerator.overlayFill, overlayFillGradient = propsGenerator.overlayFillGradient, overlayOpacity = propsGenerator.overlayOpacity, shapeClass = propsGenerator.shapeClass;
     // @ts-expect-error

package/dist/components/Notification.js

@@ -1,10 +1,11 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 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 { useStyles } from '../hooks/useStyles/useStyles.js';
-import { I as Icon } from '../Tooltip_es_Y2aoFQW7.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { I as Icon } from '../Icon_es_k9bHSLyL.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { icons20 } from '@itcase/icons/default';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import '../context/UIContext.js';
@@ -22,7 +23,7 @@ import '../hooks/useStyles/styleAttributes.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../Link_es_BnUIX0QT.js';
 
 var notificationAppearanceDefault = {
     defaultPrimary: {
@@ -130,10 +131,7 @@ var notificationConfig = {
 };
 function Notification(props) {
     var id = props.id, className = props.className, appearance = props.appearance, title = props.title, desc = props.desc, dataTestId = props.dataTestId, dataTour = props.dataTour, before = props.before, after = props.after, close = props.close, isSkeleton = props.isSkeleton, onClickClose = props.onClickClose;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = notificationConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, notificationConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, elevationClass = propsGenerator.elevationClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass, closeIcon = propsGenerator.closeIcon, closeIconFill = propsGenerator.closeIconFill, closeIconFillIcon = propsGenerator.closeIconFillIcon, closeIconFillSize = propsGenerator.closeIconFillSize, closeIconShape = propsGenerator.closeIconShape, closeIconSize = propsGenerator.closeIconSize, closeIconSrc = propsGenerator.closeIconSrc;
     // @ts-expect-error

package/dist/components/Overlay.js

@@ -1,9 +1,10 @@
-export { O as Overlay, a as overlayAppearance, o as overlayConfig } from '../Overlay_es_DczPjVL9.js';
-import '../tslib.es6_es_Bwu1Cn-t.js';
+export { O as Overlay, a as overlayAppearance, o as overlayConfig } from '../Overlay_es_D_izIIUB.js';
 import 'react/jsx-runtime';
 import 'clsx';
-import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
+import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
+import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react';
+import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';

package/dist/components/Pagination.js

@@ -1,14 +1,15 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useMemo, useState, useCallback } from 'react';
 import clsx from 'clsx';
 import ceil from 'lodash/ceil';
 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_JVT4f6Nb.js';
-import { I as Icon } from '../Tooltip_es_Y2aoFQW7.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es_BBxfR35q.js';
+import { I as Icon } from '../Icon_es_k9bHSLyL.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { icons14, icons24, icons16 } from '@itcase/icons/default';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -22,11 +23,11 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Divider_es_kY-30pft.js';
+import '../Divider_es_CiRU0sTz.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../Link_es_BnUIX0QT.js';
 
 var paginationAppearanceAccent = {
     accent: {
@@ -256,10 +257,7 @@ function Pagination(props) {
         }
         return 0;
     }, [pageNumber]);
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = paginationConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, paginationConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var justifyContentClass = propsGenerator.justifyContentClass, fillActiveClass = propsGenerator.fillActiveClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, fillInputClass = propsGenerator.fillInputClass, fillInputHoverClass = propsGenerator.fillInputHoverClass, textColorClass = propsGenerator.textColorClass, textSizeClass = propsGenerator.textSizeClass, builderIcon = propsGenerator.builderIcon, builderIconFill = propsGenerator.builderIconFill, builderIconFillIcon = propsGenerator.builderIconFillIcon, builderIconFillSize = propsGenerator.builderIconFillSize, builderIconSize = propsGenerator.builderIconSize, marginPagesDisplayed = propsGenerator.marginPagesDisplayed, nextIcon = propsGenerator.nextIcon, nextIconFill = propsGenerator.nextIconFill, nextIconFillIcon = propsGenerator.nextIconFillIcon, nextIconFillSize = propsGenerator.nextIconFillSize, nextIconSize = propsGenerator.nextIconSize, pageCountDescTextColor = propsGenerator.pageCountDescTextColor, pageCountDescTextSize = propsGenerator.pageCountDescTextSize, pageCountDropdownAlignment = propsGenerator.pageCountDropdownAlignment, pageCountDropdownElevation = propsGenerator.pageCountDropdownElevation, pageCountDropdownFill = propsGenerator.pageCountDropdownFill, pageCountDropdownItemDividerFill = propsGenerator.pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize = propsGenerator.pageCountDropdownItemDividerSize, pageCountDropdownItemFill = propsGenerator.pageCountDropdownItemFill, pageCountDropdownItemFillActive = propsGenerator.pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover = propsGenerator.pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover = propsGenerator.pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign = propsGenerator.pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor = propsGenerator.pageCountDropdownItemLabelColor, pageCountDropdownItemLabelColorActive = propsGenerator.pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActiveHover = propsGenerator.pageCountDropdownItemLabelColorActiveHover, pageCountDropdownItemLabelColorHover = propsGenerator.pageCountDropdownItemLabelColorHover, pageCountDropdownItemLabelSize = propsGenerator.pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap = propsGenerator.pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider = propsGenerator.pageCountDropdownItemShowDivider, pageCountDropdownItemSize = propsGenerator.pageCountDropdownItemSize, pageCountDropdownItemWidth = propsGenerator.pageCountDropdownItemWidth, pageCountDropdownShape = propsGenerator.pageCountDropdownShape, pageCountInputIcon = propsGenerator.pageCountInputIcon, pageCountInputIconColor = propsGenerator.pageCountInputIconColor, pageCountInputIconFillSize = propsGenerator.pageCountInputIconFillSize, pageCountInputIconSrc = propsGenerator.pageCountInputIconSrc, pageCountInputTextColor = propsGenerator.pageCountInputTextColor, pageCountInputTextSize = propsGenerator.pageCountInputTextSize, pageRangeDisplayed = propsGenerator.pageRangeDisplayed, previousIcon = propsGenerator.previousIcon, previousIconFill = propsGenerator.previousIconFill, previousIconFillIcon = propsGenerator.previousIconFillIcon, previousIconFillSize = propsGenerator.previousIconFillSize, previousIconSize = propsGenerator.previousIconSize, sizeClass = propsGenerator.sizeClass;
     var paginationStyles = useStyles(props).styles;

package/dist/components/Radio.js

@@ -1,8 +1,9 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 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_BfLRfj-5.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -120,10 +121,7 @@ var radioConfig = {
 };
 function Radio(props) {
     var id = props.id, className = props.className, appearance = props.appearance, label = props.label, desc = props.desc, isDisabled = props.isDisabled, checked = props.checked, _a = props.tag, Tag = _a === void 0 ? 'label' : _a, isSkeleton = props.isSkeleton, onChange = props.onChange;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = radioConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, radioConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillCheckmarkClass = propsGenerator.fillCheckmarkClass, fillClass = propsGenerator.fillClass, fillRadioActiveClass = propsGenerator.fillRadioActiveClass, fillRadioActiveHoverClass = propsGenerator.fillRadioActiveHoverClass, fillRadioClass = propsGenerator.fillRadioClass, fillRadioHoverClass = propsGenerator.fillRadioHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorRadioActiveClass = propsGenerator.borderColorRadioActiveClass, borderColorRadioActiveHoverClass = propsGenerator.borderColorRadioActiveHoverClass, borderColorRadioClass = propsGenerator.borderColorRadioClass, borderColorRadioHoverClass = propsGenerator.borderColorRadioHoverClass, _b = propsGenerator.shapeClass, shapeClass = _b === void 0 ? 'circular' : _b, sizeClass = propsGenerator.sizeClass;
     return (jsxs(Tag, { className: clsx(className, 'radio', fillClass && "fill_".concat(fillClass), borderColorClass && "border-color_".concat(borderColorClass), isSkeleton && 'radio_skeleton', sizeClass && "radio_size_".concat(sizeClass)), htmlFor: id, children: [jsxs("div", { className: "radio__item", children: [jsx("input", { id: id, className: "radio__input", type: "radio", disabled: isDisabled && 'disabled', checked: checked, onChange: onChange }), jsx("div", { className: clsx('radio__state', !checked

package/dist/components/Response.js

@@ -4,11 +4,12 @@ import { useMemo } from 'react';
 import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
 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 { B as Button } from '../Button_es_DhCLxWhq.js';
-import { G as Group } from '../Group_es_CYW2Hquh.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { B as Button } from '../Button_es_XnWb2XF3.js';
+import { G as Group } from '../Group_es_DSZxyI1e.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
 import 'lodash/camelCase';
@@ -22,9 +23,9 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Tooltip_es_Y2aoFQW7.js';
-import '../Link_es_DxtZLeKY.js';
-import '../Loader_es_GYOr0UTX.js';
+import '../Icon_es_k9bHSLyL.js';
+import '../Link_es_BnUIX0QT.js';
+import '../Loader_es_BDb87cdb.js';
 
 var responseAppearanceConfirm = {
     confirm: {
@@ -146,10 +147,7 @@ var responseConfig = {
 };
 var Response = urlWithAssetPrefix(function Response(props) {
     var className = props.className, appearance = props.appearance, width = props.width, height = props.height, title = props.title, desc = props.desc, primaryButton = props.primaryButton, onClickSecondaryButton = props.onClickSecondaryButton, secondaryButton = props.secondaryButton, before = props.before, after = props.after, isSkeleton = props.isSkeleton;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = responseConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, responseConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, onClickPrimaryButton = propsGenerator.onClickPrimaryButton, primaryButtonAfter = propsGenerator.primaryButtonAfter, primaryButtonAppearance = propsGenerator.primaryButtonAppearance, primaryButtonBefore = propsGenerator.primaryButtonBefore, primaryButtonFill = propsGenerator.primaryButtonFill, primaryButtonFillHover = propsGenerator.primaryButtonFillHover, primaryButtonLabel = propsGenerator.primaryButtonLabel, primaryButtonLabelTextColor = propsGenerator.primaryButtonLabelTextColor, primaryButtonLabelTextSize = propsGenerator.primaryButtonLabelTextSize, primaryButtonShape = propsGenerator.primaryButtonShape, primaryButtonSize = propsGenerator.primaryButtonSize, primaryButtonWidth = propsGenerator.primaryButtonWidth, secondaryButtonAfter = propsGenerator.secondaryButtonAfter, secondaryButtonAppearance = propsGenerator.secondaryButtonAppearance, secondaryButtonBefore = propsGenerator.secondaryButtonBefore, secondaryButtonFill = propsGenerator.secondaryButtonFill, secondaryButtonFillHover = propsGenerator.secondaryButtonFillHover, secondaryButtonLabel = propsGenerator.secondaryButtonLabel, secondaryButtonLabelTextColor = propsGenerator.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = propsGenerator.secondaryButtonLabelTextSize, secondaryButtonShape = propsGenerator.secondaryButtonShape, secondaryButtonSize = propsGenerator.secondaryButtonSize, secondaryButtonWidth = propsGenerator.secondaryButtonWidth, dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, imageSrc = propsGenerator.imageSrc, shapeClass = propsGenerator.shapeClass, svgFillClass = propsGenerator.svgFillClass, SvgImage = propsGenerator.SvgImage, svgPathFillClass = propsGenerator.svgPathFillClass, svgSrc = propsGenerator.svgSrc;
     // TODO: use Icon instead?

package/dist/components/Search.js

@@ -3,10 +3,11 @@ import { icons16, icons24 } from '@itcase/icons/default';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useCallback } from 'react';
 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 '../Tooltip_es_Y2aoFQW7.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { I as Icon } from '../Icon_es_k9bHSLyL.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
 import { S as Scrollbar } from '../Scrollbar_es_CThJeCLF.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -23,7 +24,7 @@ import '../hooks/useStyles/styleAttributes.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../Link_es_BnUIX0QT.js';
 import 'react-scrollbars-custom';
 
 var searchAppearanceDefault = {
@@ -173,10 +174,7 @@ var SearchInput = React.forwardRef(function SearchInput(props, ref) {
             onClickClean();
         }
     }, [onChange, onClickClean]);
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = searchInputConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, searchInputConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var size = propsGenerator.size, fillClass = propsGenerator.fillClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, iconClear = propsGenerator.iconClear, iconClearFill = propsGenerator.iconClearFill, iconClearSize = propsGenerator.iconClearSize, iconClearSrc = propsGenerator.iconClearSrc, inputFillClass = propsGenerator.inputFillClass, inputShapeClass = propsGenerator.inputShapeClass, inputTextColorClass = propsGenerator.inputTextColorClass, inputTextSizeClass = propsGenerator.inputTextSizeClass, inputTextStyleClass = propsGenerator.inputTextStyleClass, inputTextWeightClass = propsGenerator.inputTextWeightClass, placeholderTextColor = propsGenerator.placeholderTextColor, placeholderTextSize = propsGenerator.placeholderTextSize, placeholderTextStyle = propsGenerator.placeholderTextStyle, placeholderTextWeight = propsGenerator.placeholderTextWeight, shapeClass = propsGenerator.shapeClass, widthClass = propsGenerator.widthClass;
     var searchInputStyles = useStyles(props).styles;

package/dist/components/Segmented.js

@@ -1,26 +1,27 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React, { useRef, useMemo, createRef, useCallback, useEffect } from 'react';
 import clsx from 'clsx';
-import { I as Icon } from '../Tooltip_es_Y2aoFQW7.js';
+import { I as Icon } from '../Icon_es_k9bHSLyL.js';
+import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
+import 'react-inlinesvg';
+import '../hoc/urlWithAssetPrefix.js';
+import '@itcase/common';
+import '../context/UrlAssetPrefix.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/camelCase';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../context/Notifications.js';
 import 'uuid';
-import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'react-inlinesvg';
-import '../hoc/urlWithAssetPrefix.js';
-import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../Link_es_BnUIX0QT.js';
 import 'lodash/castArray';
 
 var segmentedAppearanceDefault = {
@@ -205,10 +206,7 @@ var Segmented = React.forwardRef(function (props) {
         // controlRef.current.style.setProperty('--segmented-active-x-pos', `${offsetLeft - 2}px`)
         (_b = controlRef.current) === null || _b === void 0 ? void 0 : _b.style.setProperty('--segmented-active-x-pos', "".concat(offsetLeft, "px"));
     }, [activeSegment, segmentsRefs]);
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = segmentedConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, segmentedConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, iconFillDisabled = propsGenerator.iconFillDisabled, iconFill = propsGenerator.iconFill, iconFillActive = propsGenerator.iconFillActive, iconSize = propsGenerator.iconSize, indicatorFillClass = propsGenerator.indicatorFillClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     return (jsx("div", { className: clsx(className, 'segmented', shapeClass && "segmented_shape_".concat(shapeClass), fillClass && "fill_".concat(fillClass), widthClass && "segmented_width_".concat(widthClass), sizeClass && "segmented_size_".concat(sizeClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), isSkeleton && "segmented_skeleton"), ref: controlRef, children: jsx("div", { className: "segmented__wrapper", children: jsxs("div", { className: clsx('segmented__wrapper-inner'), children: [segments === null || segments === void 0 ? void 0 : segments.map(function (item) {

package/dist/components/Select.js

@@ -1,30 +1,31 @@
 import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import Select, { components } from 'react-select';
-import { I as Icon, B as Badge } from '../Tooltip_es_Y2aoFQW7.js';
+import { I as Icon, B as Badge } from '../Icon_es_k9bHSLyL.js';
 import React, { useRef, useCallback, useEffect, useMemo } from 'react';
 import clsx from 'clsx';
 import CreatableSelect from 'react-select/creatable';
+import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
-import { G as Group } from '../Group_es_CYW2Hquh.js';
-import { D as Divider } from '../Divider_es_kY-30pft.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { G as Group } from '../Group_es_DSZxyI1e.js';
+import { D as Divider } from '../Divider_es_CiRU0sTz.js';
+import 'react-inlinesvg';
+import '../hoc/urlWithAssetPrefix.js';
+import '@itcase/common';
+import '../context/UrlAssetPrefix.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/camelCase';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../context/Notifications.js';
 import 'uuid';
-import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'react-inlinesvg';
-import '../hoc/urlWithAssetPrefix.js';
-import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../Link_es_BnUIX0QT.js';
 import 'lodash/castArray';
 
 // interface ClearIndicatorProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>>
@@ -217,15 +218,7 @@ var SelectContainer = React.forwardRef(function SelectContainer(props, ref) {
             },
         });
     }, [minWidth, width]);
-    var appearanceConfig = useMemo(function () {
-        if (appearance) {
-            return appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-                var _a;
-                return (__assign(__assign({}, resultConfig), (_a = selectConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-            }, {});
-        }
-        return {};
-    }, [appearance]);
+    var appearanceConfig = useAppearanceConfig(appearance, selectConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, elevation = propsGenerator.elevation, badgeTextSize = propsGenerator.badgeTextSize, clearIconFill = propsGenerator.clearIconFill, dividerFill = propsGenerator.dividerFill, dropdownFillHover = propsGenerator.dropdownFillHover, dropdownIconFill = propsGenerator.dropdownIconFill, dropdownIconShape = propsGenerator.dropdownIconShape, headingFillClass = propsGenerator.headingFillClass, headingFillHoverClass = propsGenerator.headingFillHoverClass, headingTextColorClass = propsGenerator.headingTextColorClass, headingTextSizeClass = propsGenerator.headingTextSizeClass, headingTextWeightClass = propsGenerator.headingTextWeightClass, inputBorderColorClass = propsGenerator.inputBorderColorClass, inputBorderColorHoverClass = propsGenerator.inputBorderColorHoverClass, inputCaretColorClass = propsGenerator.inputCaretColorClass, inputFillClass = propsGenerator.inputFillClass, inputShapeClass = propsGenerator.inputShapeClass, inputTextColorClass = propsGenerator.inputTextColorClass, inputTextSizeClass = propsGenerator.inputTextSizeClass, multipleItemFill = propsGenerator.multipleItemFill, multipleItemFillHover = propsGenerator.multipleItemFillHover, multipleItemIcon = propsGenerator.multipleItemIcon, multipleItemIconFill = propsGenerator.multipleItemIconFill, multipleItemTextColorClass = propsGenerator.multipleItemTextColorClass, multipleItemTextSizeClass = propsGenerator.multipleItemTextSizeClass, noOptionsTextColorClass = propsGenerator.noOptionsTextColorClass, noOptionsTextSizeClass = propsGenerator.noOptionsTextSizeClass, optionBorderClass = propsGenerator.optionBorderClass, optionBorderTypeClass = propsGenerator.optionBorderTypeClass, optionFillClass = propsGenerator.optionFillClass, optionFillHoverClass = propsGenerator.optionFillHoverClass, optionShapeClass = propsGenerator.optionShapeClass, optionTextColorClass = propsGenerator.optionTextColorClass, optionTextSizeClass = propsGenerator.optionTextSizeClass, placeholderTextColor = propsGenerator.placeholderTextColor, placeholderTextSize = propsGenerator.placeholderTextSize, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     return (jsx(SelectComponent, { className: clsx(className, 'select', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "select_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), sizeClass && "select_size_".concat(sizeClass), hideValueContainer && 'select_state_hide-value-container', set && "select_set_".concat(set), widthClass && "select_width_".concat(widthClass)), elevation: elevation, isDisabled: isDisabled, badgeAppearance: badgeAppearance, badgeSize: badgeSize, badgeTextSize: badgeTextSize, classNamePrefix: "select", clearIcon: clearIcon, clearIconFill: clearIconFill, components: {

package/dist/components/Swiper.js

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import { Swiper as Swiper$1, SwiperSlide } from 'swiper/react';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { b as Title } from '../Tooltip_es_Y2aoFQW7.js';
+import { b as Title } from '../Icon_es_k9bHSLyL.js';
 import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -18,11 +18,12 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Text_es_BfLRfj-5.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_DxtZLeKY.js';
+import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
+import '../Link_es_BnUIX0QT.js';
+import '../Text_es_Ffjr5J1k.js';
 
 function Swiper(props) {
     var id = props.id, className = props.className, direction = props.direction, title = props.title, titleAfter = props.titleAfter, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleWeight = props.titleWeight, setNextBtnDisabled = props.setNextBtnDisabled, setPrevBtnDisabled = props.setPrevBtnDisabled, _a = props.activeSlideIndex, activeSlideIndex = _a === void 0 ? 0 : _a, allowTouchMove = props.allowTouchMove, autoHeight = props.autoHeight, breakpoints = props.breakpoints, forwardedRef = props.forwardedRef, // https://github.com/vercel/next.js/issues/4957

package/dist/components/Switch.js

@@ -1,9 +1,10 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
 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_BfLRfj-5.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -117,10 +118,7 @@ var switchConfig = {
 };
 var Switch = React.forwardRef(function Switch(props, ref) {
     var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, title = props.title, desc = props.desc, disabled = props.disabled, checked = props.checked, isActive = props.isActive, onChange = props.onChange;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = switchConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, switchConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var size = propsGenerator.size, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, fillToggleActiveClass = propsGenerator.fillToggleActiveClass, fillToggleActiveHoverClass = propsGenerator.fillToggleActiveHoverClass, fillToggleClass = propsGenerator.fillToggleClass, fillToggleHoverClass = propsGenerator.fillToggleHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize;
     return (jsxs("div", { className: clsx('switch', className, align && "switch_align_".concat(align), size && "switch_size_".concat(size)), children: [title && (jsx(Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsx(Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc })), jsxs("div", { className: 'switch__item', children: [jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", disabled: disabled, checked: checked || isActive, 

package/dist/components/Tab.js

@@ -1,13 +1,14 @@
-import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 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 { B as Badge, I as Icon } from '../Tooltip_es_Y2aoFQW7.js';
-import { D as Divider } from '../Divider_es_kY-30pft.js';
-import { L as Link } from '../Link_es_DxtZLeKY.js';
-import { T as Text } from '../Text_es_BfLRfj-5.js';
+import { B as Badge, I as Icon } from '../Icon_es_k9bHSLyL.js';
+import { D as Divider } from '../Divider_es_CiRU0sTz.js';
+import { L as Link } from '../Link_es_BnUIX0QT.js';
+import { T as Text } from '../Text_es_Ffjr5J1k.js';
+import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -196,10 +197,7 @@ var tabConfig = {
 };
 function Tab(props) {
     var className = props.className, appearance = props.appearance, label = props.label, _a = props.isDisabled, isDisabled = _a === void 0 ? false : _a, badgeValue = props.badgeValue, dataTour = props.dataTour, href = props.href, link = props.link, rel = props.rel, target = props.target, before = props.before, after = props.after, _b = props.isActive, isActive = _b === void 0 ? false : _b, isSkeleton = props.isSkeleton, onClick = props.onClick, onMouseEnter = props.onMouseEnter, children = props.children;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (__assign(__assign({}, resultConfig), (_a = tabConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
+    var appearanceConfig = useAppearanceConfig(appearance, tabConfig);
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextAlign = propsGenerator.labelTextAlign, labelTextColor = propsGenerator.labelTextColor, labelTextColorActive = propsGenerator.labelTextColorActive, labelTextColorActiveHover = propsGenerator.labelTextColorActiveHover, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextStyle = propsGenerator.labelTextStyle, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorActiveClass = propsGenerator.borderColorActiveClass, borderColorActiveHoverClass = propsGenerator.borderColorActiveHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, dividerFillDisabled = propsGenerator.dividerFillDisabled, badgeAppearance = propsGenerator.badgeAppearance, badgeShape = propsGenerator.badgeShape, badgeSize = propsGenerator.badgeSize, badgeTextColor = propsGenerator.badgeTextColor, badgeTextSize = propsGenerator.badgeTextSize, dividerFill = propsGenerator.dividerFill, dividerFillActive = propsGenerator.dividerFillActive, dividerFillActiveHover = propsGenerator.dividerFillActiveHover, dividerFillHover = propsGenerator.dividerFillHover, dividerSize = propsGenerator.dividerSize, icon = propsGenerator.icon, iconFill = propsGenerator.iconFill, iconFillIcon = propsGenerator.iconFillIcon, iconFillSize = propsGenerator.iconFillSize, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, iconSrc = propsGenerator.iconSrc, linkFill = propsGenerator.linkFill, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error

package/dist/components/Text.js

@@ -1,9 +1,10 @@
-export { T as Text, a as textAppearance, t as textConfig } from '../Text_es_BfLRfj-5.js';
-import '../tslib.es6_es_Bwu1Cn-t.js';
+export { T as Text, a as textAppearance, t as textConfig } from '../Text_es_Ffjr5J1k.js';
 import 'react/jsx-runtime';
 import 'clsx';
-import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
+import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
+import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react';
+import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';