@itcase/ui 1.2.28 → 1.2.29

package/dist/components/Notification.js

@@ -1,31 +1,34 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import { useStyles } from '../hooks/useStyles.js';
+import { notificationItemAppearance } from '../appearance/Notification.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { T as Text } from '../Text-CG3xPG27.js';
-import { T as Title } from '../Title-CqwqEtm7.js';
+import { useStyles } from '../hooks/useStyles.js';
+import { T as Text } from '../Text-kxGZButz.js';
+import { T as Title } from '../Title-CQ_Fr1hO.js';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import 'react';
+import 'lodash/castArray';
 import 'lodash/camelCase';
-import 'lodash/maxBy';
-import 'lodash/upperFirst';
 import '../context/UIContext.js';
 import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
+import 'lodash/maxBy';
+import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import 'lodash/castArray';
-import '../tslib.es6-5FtW-kfi.js';
+import '../appearance/Text.js';
+import '../appearance/Title.js';
+import '../tslib.es6-w7hdJ3oZ.js';
 import 'uuid';
 
 var notificationItemConfig = {
-    appearance: {},
+    appearance: notificationItemAppearance,
     setAppearance: function (newComponent) {
         notificationItemConfig.appearance = newComponent;
     },
 };
 function NotificationItem(props) {
-    var id = props.id, appearance = props.appearance, closeButton = props.closeButton, after = props.after, before = props.before, set = props.set, status = props.status, size = props.size, dataTour = props.dataTour, text = props.text, _a = props.textSize, textSize = _a === void 0 ? 's' : _a, textColor = props.textColor, title = props.title, _b = props.titleTextSize, titleTextSize = _b === void 0 ? 'h5' : _b, titleTextColor = props.titleTextColor, onClickClose = props.onClickClose, className = props.className;
+    var id = props.id, after = props.after, appearance = props.appearance, before = props.before, className = props.className, closeButton = props.closeButton, dataTour = props.dataTour, set = props.set, size = props.size, status = props.status, text = props.text, textColor = props.textColor, _a = props.textSize, textSize = _a === void 0 ? 's' : _a, title = props.title, titleTextColor = props.titleTextColor, _b = props.titleTextSize, titleTextSize = _b === void 0 ? 'h5' : _b, onClickClose = props.onClickClose;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -38,7 +41,7 @@ function NotificationItem(props) {
     var notificationStyles = useStyles(props).styles;
     return (jsxs("div", { className: clsx('notification__item', status && "notification__item_status_".concat(status), set && "notification__item_set_".concat(set), size && "notification__item_set_".concat(size), closeButton && 'notification__item_type_close-button', widthClass, fillClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
-                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase())), style: notificationStyles, "data-tour": dataTour, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Title, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor ||
+                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase())), "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Title, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor ||
                             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor) && appearanceConfig.titleTextColor), children: title })), text && (jsx(Text, { className: "notification__item-text", size: textSize, textColor: textColor || ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor) && appearanceConfig.textColor), children: text })), closeButton && (jsx("div", { className: clsx('notification__item-close', onClickClose && 'cursor_type_pointer'), onClick: function () { return onClickClose && onClickClose(id); }, children: closeButton }))] }), after] }));
 }
 

package/dist/components/Pagination.js

@@ -4,9 +4,9 @@ import clsx from 'clsx';
 import ceil from 'lodash/ceil';
 import ReactPaginate from 'react-paginate';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem-D0dOP4NL.js';
-import { I as Icon } from '../Icon-CliIEdbp.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem-CFkRx8LX.js';
+import { I as Icon } from '../Icon-ClsRaxDk.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
@@ -18,11 +18,15 @@ import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import '../Divider-U5UdY-ef.js';
-import '../Link-CeQuavin.js';
-import '../tslib.es6-5FtW-kfi.js';
+import '../Link-CzC1kU5C.js';
+import '../tslib.es6-w7hdJ3oZ.js';
 import 'react-inlinesvg';
-import '../Tooltip-B2vv4OAX.js';
-import '../Title-CqwqEtm7.js';
+import '../appearance/Icon.js';
+import '../Tooltip-ccRCMYQM.js';
+import '../appearance/Tooltip.js';
+import '../Title-CQ_Fr1hO.js';
+import '../appearance/Title.js';
+import '../appearance/Text.js';
 
 var paginationConfig = {
     appearance: undefined,

package/dist/components/Panel.js

@@ -3,8 +3,8 @@ import React from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { G as Group } from '../Group-CVUfaHaS.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { G as Group } from '../Group-Dc70Z4_7.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
@@ -14,6 +14,8 @@ import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
+import '../appearance/Group.js';
+import '../appearance/Text.js';
 
 var panelConfig = {
     appearance: undefined,

package/dist/components/Radio.js

@@ -1,7 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
+import { radioState, radioAppearance } from '../appearance/Radio.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
@@ -9,23 +10,25 @@ import '../context/UIContext.js';
 import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
+import '../appearance/Text.js';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 
 var radioConfig = {
-    state: undefined,
-    setState: function (newComponent) {
-        radioConfig.state = newComponent;
-    },
-    appearance: undefined,
+    appearance: radioState,
     setAppearance: function (newComponent) {
         radioConfig.appearance = newComponent;
     },
+    state: radioAppearance,
+    // eslint-disable-next-line perfectionist/sort-objects
+    setState: function (newComponent) {
+        radioConfig.state = newComponent;
+    },
 };
 function Radio(props) {
-    var appearance = props.appearance, checked = props.checked, className = props.className, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, disabled = props.disabled, id = props.id, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, _a = props.tag, Tag = _a === void 0 ? 'label' : _a, onChange = props.onChange;
+    var id = props.id, appearance = props.appearance, checked = props.checked, className = props.className, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, disabled = props.disabled, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, _a = props.tag, Tag = _a === void 0 ? 'label' : _a, onChange = props.onChange;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -71,7 +74,7 @@ function Radio(props) {
                     ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.stateCheckmarkFill) &&
                         "radio_checkmark_fill_".concat(appearanceConfig.stateCheckmarkFill)
                             .replace(/([A-Z])/g, '-$1')
-                            .toLowerCase())), children: [jsx("input", { checked: checked, className: "radio__input", disabled: disabled, 
+                            .toLowerCase())), children: [jsx("input", { className: "radio__input", checked: checked, disabled: disabled, 
                         // @ts-expect-error
                         id: id, type: "radio", onChange: onChange }), jsx("div", { className: clsx('radio__state', disabled ? stateFillDisabledClass : stateFillClass, disabled
                             ? stateBorderColorDisabledClass

package/dist/components/Response.js

@@ -2,12 +2,13 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
+import { responseAppearance } from '../appearance/Response.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { B as Button } from '../Button-C0M-Ap20.js';
-import { G as Group } from '../Group-CVUfaHaS.js';
-import { T as Text } from '../Text-CG3xPG27.js';
-import { T as Title } from '../Title-CqwqEtm7.js';
+import { B as Button } from '../Button-avhviao1.js';
+import { G as Group } from '../Group-Dc70Z4_7.js';
+import { T as Text } from '../Text-kxGZButz.js';
+import { T as Title } from '../Title-CQ_Fr1hO.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
@@ -17,23 +18,29 @@ import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Icon-CliIEdbp.js';
-import '../Link-CeQuavin.js';
-import '../tslib.es6-5FtW-kfi.js';
-import '../Tooltip-B2vv4OAX.js';
-import '../Loader-CJ8ZCdwy.js';
+import '../appearance/Button.js';
+import '../Icon-ClsRaxDk.js';
+import '../appearance/Icon.js';
+import '../Link-CzC1kU5C.js';
+import '../tslib.es6-w7hdJ3oZ.js';
+import '../Tooltip-ccRCMYQM.js';
+import '../appearance/Tooltip.js';
+import '../Loader-CU_5Ydmy.js';
+import '../appearance/Loader.js';
+import '../appearance/Group.js';
+import '../appearance/Text.js';
+import '../appearance/Title.js';
 
 var responseConfig = {
-    appearance: undefined,
+    appearance: responseAppearance,
     setAppearance: function (newComponent) {
         responseConfig.appearance = newComponent;
     },
 };
 function Response(props) {
-    var after = props.after, before = props.before, appearance = props.appearance, imageSrc = props.imageSrc, className = props.className, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, message = props.message, messageTextColor = props.messageTextColor, messageTextSize = props.messageTextSize, messageTextWeight = props.messageTextWeight, primaryButton = props.primaryButton, primaryButtonAfter = props.primaryButtonAfter, primaryButtonAppearance = props.primaryButtonAppearance, primaryButtonBefore = props.primaryButtonBefore, primaryButtonFill = props.primaryButtonFill, primaryButtonFillHover = props.primaryButtonFillHover, primaryButtonLabel = props.primaryButtonLabel, primaryButtonLabelTextColor = props.primaryButtonLabelTextColor, primaryButtonLabelTextSize = props.primaryButtonLabelTextSize, primaryButtonShape = props.primaryButtonShape, primaryButtonSize = props.primaryButtonSize, primaryButtonWidth = props.primaryButtonWidth, secondaryButton = props.secondaryButton, secondaryButtonAfter = props.secondaryButtonAfter, secondaryButtonAppearance = props.secondaryButtonAppearance, secondaryButtonBefore = props.secondaryButtonBefore, secondaryButtonFill = props.secondaryButtonFill, secondaryButtonFillHover = props.secondaryButtonFillHover, secondaryButtonLabel = props.secondaryButtonLabel, secondaryButtonLabelTextColor = props.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = props.secondaryButtonLabelTextSize, secondaryButtonShape = props.secondaryButtonShape, secondaryButtonSize = props.secondaryButtonSize, secondaryButtonWidth = props.secondaryButtonWidth, set = props.set, onClickPrimaryButton = props.onClickPrimaryButton, onClickSecondaryButton = props.onClickSecondaryButton;
+    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, imageSrc = props.imageSrc, message = props.message, messageTextColor = props.messageTextColor, messageTextSize = props.messageTextSize, messageTextWeight = props.messageTextWeight, primaryButton = props.primaryButton, primaryButtonAfter = props.primaryButtonAfter, primaryButtonAppearance = props.primaryButtonAppearance, primaryButtonBefore = props.primaryButtonBefore, primaryButtonFill = props.primaryButtonFill, primaryButtonFillHover = props.primaryButtonFillHover, primaryButtonLabel = props.primaryButtonLabel, primaryButtonLabelTextColor = props.primaryButtonLabelTextColor, primaryButtonLabelTextSize = props.primaryButtonLabelTextSize, primaryButtonShape = props.primaryButtonShape, primaryButtonSize = props.primaryButtonSize, primaryButtonWidth = props.primaryButtonWidth, secondaryButton = props.secondaryButton, secondaryButtonAfter = props.secondaryButtonAfter, secondaryButtonAppearance = props.secondaryButtonAppearance, secondaryButtonBefore = props.secondaryButtonBefore, secondaryButtonFill = props.secondaryButtonFill, secondaryButtonFillHover = props.secondaryButtonFillHover, secondaryButtonLabel = props.secondaryButtonLabel, secondaryButtonLabelTextColor = props.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = props.secondaryButtonLabelTextSize, secondaryButtonShape = props.secondaryButtonShape, secondaryButtonSize = props.secondaryButtonSize, secondaryButtonWidth = props.secondaryButtonWidth, set = props.set, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClickPrimaryButton = props.onClickPrimaryButton, onClickSecondaryButton = props.onClickSecondaryButton;
     var ImageComponent = useMemo(function () {
         if (imageSrc) {
-            // eslint-disable-next-line react/prop-types
             if (imageSrc.endsWith('.svg')) {
                 return jsx(SVG, { src: imageSrc });
             }
@@ -82,7 +89,7 @@ function Response(props) {
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||
-                appearanceConfig) && (jsxs(Group, { className: "response__button", width: "fill", children: [primaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabel) ? (jsx(Button, { after: primaryButtonAfter, appearance: primaryButtonAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonAppearance) || 'dev', before: primaryButtonBefore, className: "response__button-item", fill: primaryButtonFill, fillHover: primaryButtonFillHover, label: primaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabel), labelTextColor: primaryButtonLabelTextColor, labelTextSize: primaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabelTextSize), shape: primaryButtonShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonShape), size: primaryButtonSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonSize), width: primaryButtonWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonWidth) || 'fill', onClick: onClickPrimaryButton })) : (primaryButton), secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabel) ? (jsx(Button, { after: secondaryButtonAfter, appearance: secondaryButtonAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonAppearance) || 'dev', before: secondaryButtonBefore, className: "response__button-item", fill: secondaryButtonFill, fillHover: secondaryButtonFillHover, label: secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabel), labelTextColor: secondaryButtonLabelTextColor, labelTextSize: secondaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabelTextSize), shape: secondaryButtonShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonShape), size: secondaryButtonSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonSize), width: secondaryButtonWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonWidth) || 'fill', onClick: onClickSecondaryButton })) : (secondaryButton)] })), after] }));
+                appearanceConfig) && (jsxs(Group, { className: "response__button", width: "fill", children: [primaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabel) ? (jsx(Button, { className: "response__button-item", width: primaryButtonWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonWidth) || 'fill', labelTextColor: primaryButtonLabelTextColor, labelTextSize: primaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabelTextSize), fill: primaryButtonFill, fillHover: primaryButtonFillHover, after: primaryButtonAfter, before: primaryButtonBefore, label: primaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabel), shape: primaryButtonShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonShape), size: primaryButtonSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonSize), appearance: primaryButtonAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonAppearance) || 'dev', onClick: onClickPrimaryButton })) : (primaryButton), secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabel) ? (jsx(Button, { className: "response__button-item", width: secondaryButtonWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonWidth) || 'fill', labelTextColor: secondaryButtonLabelTextColor, labelTextSize: secondaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabelTextSize), fill: secondaryButtonFill, fillHover: secondaryButtonFillHover, after: secondaryButtonAfter, before: secondaryButtonBefore, label: secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabel), shape: secondaryButtonShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonShape), size: secondaryButtonSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonSize), appearance: secondaryButtonAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonAppearance) || 'dev', onClick: onClickSecondaryButton })) : (secondaryButton)] })), after] }));
 }
 
 export { Response, responseConfig };

package/dist/components/ScrollOnDrag.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
+import { a as __assign } from '../tslib.es6-w7hdJ3oZ.js';
 import { jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
 import clsx from 'clsx';

package/dist/components/Search.js

@@ -1,10 +1,11 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useCallback } from 'react';
 import clsx from 'clsx';
+import { searchAppearance } from '../appearance/Search.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { I as Icon } from '../Icon-CliIEdbp.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { I as Icon } from '../Icon-ClsRaxDk.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import { S as Scrollbar } from '../Scrollbar-CrGXCZ_F.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
@@ -16,20 +17,24 @@ import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import 'react-inlinesvg';
-import '../Link-CeQuavin.js';
-import '../tslib.es6-5FtW-kfi.js';
-import '../Tooltip-B2vv4OAX.js';
-import '../Title-CqwqEtm7.js';
+import '../appearance/Icon.js';
+import '../Link-CzC1kU5C.js';
+import '../tslib.es6-w7hdJ3oZ.js';
+import '../Tooltip-ccRCMYQM.js';
+import '../appearance/Tooltip.js';
+import '../Title-CQ_Fr1hO.js';
+import '../appearance/Title.js';
+import '../appearance/Text.js';
 import 'react-scrollbars-custom';
 
 var searchInputConfig = {
-    appearance: undefined,
+    appearance: searchAppearance,
     setAppearance: function (newComponent) {
         searchInputConfig.appearance = newComponent;
     },
 };
 var SearchInput = React.forwardRef(function SearchInput(props, ref) {
-    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, size = props.size, dataTour = props.dataTour, iconAfter = props.iconAfter, iconAfterSrc = props.iconAfterSrc, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, iconBefore = props.iconBefore, iconBeforeSrc = props.iconBeforeSrc, iconBeforeFill = props.iconBeforeFill, iconBeforeSize = props.iconBeforeSize, iconClear = props.iconClear, iconClearSrc = props.iconClearSrc, iconClearFill = props.iconClearFill, iconClearSize = props.iconClearSize, placeholder = props.placeholder, placeholderTextColor = props.placeholderTextColor, placeholderTextSize = props.placeholderTextSize, placeholderTextStyle = props.placeholderTextStyle, placeholderTextWeight = props.placeholderTextWeight, type = props.type, value = props.value, onChange = props.onChange, onClickClean = props.onClickClean, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
+    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconClear = props.iconClear, iconClearFill = props.iconClearFill, iconClearSize = props.iconClearSize, iconClearSrc = props.iconClearSrc, placeholder = props.placeholder, placeholderTextColor = props.placeholderTextColor, placeholderTextSize = props.placeholderTextSize, placeholderTextStyle = props.placeholderTextStyle, placeholderTextWeight = props.placeholderTextWeight, size = props.size, type = props.type, value = props.value, onChange = props.onChange, onClickClean = props.onClickClean, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
     var onChangeSearchInput = useCallback(function (event) {
         onChange && onChange(event.target.value);
     }, [onChange]);
@@ -118,8 +123,8 @@ SearchInput.DEFAULT_REF_STATE = {
     input: null,
 };
 SearchInput.defaultProps = {
-    placeholderTextSize: 'm',
     inputTextSize: 'm',
+    placeholderTextSize: 'm',
     size: 'normal',
 };
 

package/dist/components/Segmented.js

@@ -1,27 +1,29 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React, { useRef, useMemo, createRef, useCallback, useEffect } from 'react';
 import clsx from 'clsx';
+import { segmentedAppearance } from '../appearance/Segmented.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
 import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
+import '../appearance/Text.js';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 
 var segmentedConfig = {
-    appearance: undefined,
+    appearance: segmentedAppearance,
     setAppearance: function (newComponent) {
         segmentedConfig.appearance = newComponent;
     },
 };
 var Segmented = React.forwardRef(function (props, ref) {
-    var appearance = props.appearance, name = props.name, className = props.className, type = props.type, segments = props.segments, activeSegment = props.activeSegment, setActiveSegment = props.setActiveSegment, size = props.size, labelTextColor = props.labelTextColor, labelTextActiveColor = props.labelTextActiveColor, labelTextSize = props.labelTextSize, labelTextWrap = props.labelTextWrap, onChange = props.onChange;
+    var isDisabled = props.isDisabled, _a = props.activeSegment, activeSegment = _a === void 0 ? {} : _a, appearance = props.appearance, className = props.className, labelTextActiveColor = props.labelTextActiveColor, labelTextActiveHoverColor = props.labelTextActiveHoverColor, labelTextColor = props.labelTextColor, labelTextHoverColor = props.labelTextHoverColor, labelTextSize = props.labelTextSize, labelTextWrap = props.labelTextWrap, name = props.name, segments = props.segments, setActiveSegment = props.setActiveSegment, size = props.size, type = props.type, onChange = props.onChange;
     var controlRef = useRef(null);
     var segmentsRefs = useMemo(function () { return new Map(segments.map(function (item) { return [item.value, createRef()]; })); }, [segments]);
     var onChangeValue = useCallback(function (item) {
@@ -81,22 +83,26 @@ var Segmented = React.forwardRef(function (props, ref) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
                 "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), widthClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.width) &&
-                "segmented_width_".concat(appearanceConfig.width).replace(/([A-Z])/g, '-$1').toLowerCase()), size && "segmented_size_".concat(size), type && "segmented_type_".concat(type), borderColorClass, borderWidthClass, borderTypeClass), 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, i) { return (jsxs("div", { className: clsx('segmented__item', fillHoverClass ||
+                "segmented_width_".concat(appearanceConfig.width).replace(/([A-Z])/g, '-$1').toLowerCase()), size
+            ? "segmented_size_".concat(size)
+            : (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.size) &&
+                "segmented_size_".concat(appearanceConfig.size).replace(/([A-Z])/g, '-$1').toLowerCase(), type
+            ? "segmented_type_".concat(type)
+            : (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.type) &&
+                "segmented_type_".concat(appearanceConfig.type).replace(/([A-Z])/g, '-$1').toLowerCase(), borderColorClass, borderWidthClass, borderTypeClass), 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, i) { return (jsxs("div", { className: clsx('segmented__item', fillHoverClass ||
                             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
                                 "fill_hover_".concat(appearanceConfig.fillHover)
                                     .replace(/([A-Z])/g, '-$1')
-                                    .toLowerCase()), item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value) && 'segmented__item_active'), ref: segmentsRefs.get(item.value), children: [jsx("input", { checked: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value), className: "segmented__item-radio", id: item.label, name: name, type: "radio", value: item.value, onChange: function () { return onChangeValue(item); } }), jsx("label", { className: clsx('segmented__item-label'), htmlFor: item.label, children: jsx(Text, { className: clsx('segmented__item-label-text', labelTextWrap && "word-wrap_".concat(labelTextWrap)), size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColor: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value)
+                                    .toLowerCase()), item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value) && 'segmented__item_active', onChange && 'cursor_type_pointer', isDisabled && 'cursor_type_default'), ref: segmentsRefs.get(item.value), children: [jsx("input", { className: "segmented__item-radio", name: name, checked: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value), id: item.label, type: "radio", value: item.value, onChange: function () { return onChangeValue(item); } }), jsx("label", { className: clsx('segmented__item-label'), htmlFor: item.label, children: jsx(Text, { className: clsx('segmented__item-label-text', labelTextWrap && "word-wrap_".concat(labelTextWrap)), size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColor: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value)
                                         ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor)
-                                        : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), children: item.label }) })] }, item.value)); }), jsx("div", { className: clsx('segmented__indicator', indicatorFillClass ||
+                                        : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value)
+                                        ? labelTextActiveHoverColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveHoverColor)
+                                        : labelTextHoverColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextHoverColor), children: item.label }) })] }, item.value)); }), jsx("div", { className: clsx('segmented__indicator', indicatorFillClass ||
                             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.indicatorFill) &&
                                 "fill_".concat(appearanceConfig.indicatorFill)
                                     .replace(/([A-Z])/g, '-$1')
                                     .toLowerCase())), children: "\u00A0" })] }) }) }));
 });
 Segmented.displayName = 'Segmented';
-Segmented.defaultProps = {
-    activeSegment: {},
-    size: 'normal',
-};
 
 export { Segmented, segmentedConfig };

package/dist/components/Select.js

@@ -1,16 +1,18 @@
-import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
+import { selectAppearance } from '../appearance/Select.js';
+import { a as __assign } from '../tslib.es6-w7hdJ3oZ.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import Select, { components } from 'react-select';
-import { I as Icon } from '../Icon-CliIEdbp.js';
+import { I as Icon } from '../Icon-ClsRaxDk.js';
 import React, { useMemo, useRef, useCallback, useEffect } from 'react';
 import clsx from 'clsx';
 import CreatableSelect from 'react-select/creatable';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { T as Text } from '../Text-CG3xPG27.js';
-import { B as Badge } from '../Badge-CrhdvxY6.js';
-import { G as Group } from '../Group-CVUfaHaS.js';
+import { T as Text } from '../Text-kxGZButz.js';
+import { B as Badge } from '../Badge-BZYBmgBK.js';
+import { G as Group } from '../Group-Dc70Z4_7.js';
 import { D as Divider } from '../Divider-U5UdY-ef.js';
 import 'react-inlinesvg';
+import '../appearance/Icon.js';
 import '../hooks/useStyles.js';
 import 'lodash/camelCase';
 import 'lodash/maxBy';
@@ -20,10 +22,15 @@ import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/styleAttributes.js';
-import '../Link-CeQuavin.js';
-import '../Tooltip-B2vv4OAX.js';
-import '../Title-CqwqEtm7.js';
+import '../Link-CzC1kU5C.js';
+import '../Tooltip-ccRCMYQM.js';
+import '../appearance/Tooltip.js';
+import '../Title-CQ_Fr1hO.js';
+import '../appearance/Title.js';
 import 'lodash/castArray';
+import '../appearance/Text.js';
+import '../appearance/Badge.js';
+import '../appearance/Group.js';
 
 // interface ClearIndicatorProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>>
 //   extends DefaultClearIndicatorProps<Option, IsMulti, Group> {}
@@ -309,7 +316,7 @@ SelectContainer.defaultProps = {
 };
 
 var selectConfig = {
-    appearance: {},
+    appearance: selectAppearance,
     setAppearance: function (newComponent) {
         selectConfig.appearance = newComponent;
     },

package/dist/components/SiteMenu.js

@@ -3,22 +3,26 @@ import { useCallback } from 'react';
 import clsx from 'clsx';
 import { useSiteMenuContext } from '../context/UIContext.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { I as Icon } from '../Icon-CliIEdbp.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { I as Icon } from '../Icon-ClsRaxDk.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import 'react-inlinesvg';
+import '../appearance/Icon.js';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Link-CeQuavin.js';
-import '../tslib.es6-5FtW-kfi.js';
-import '../Tooltip-B2vv4OAX.js';
-import '../Title-CqwqEtm7.js';
+import '../Link-CzC1kU5C.js';
+import '../tslib.es6-w7hdJ3oZ.js';
+import '../Tooltip-ccRCMYQM.js';
+import '../appearance/Tooltip.js';
+import '../Title-CQ_Fr1hO.js';
+import '../appearance/Title.js';
+import '../appearance/Text.js';
 
 function SiteMenu(props) {
     var children = props.children, className = props.className, closeText = props.closeText, closeTextSize = props.closeTextSize, closeTextColor = props.closeTextColor, closeTextColorHover = props.closeTextColorHover, iconCloseBgFill = props.iconCloseBgFill, iconCloseFill = props.iconCloseFill, iconCloseSize = props.iconCloseSize, iconClose = props.iconClose, onClose = props.onClose;

package/dist/components/Swiper.js

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import { Swiper as Swiper$1, SwiperSlide } from 'swiper/react';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { T as Title } from '../Title-CqwqEtm7.js';
+import { T as Title } from '../Title-CQ_Fr1hO.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
@@ -14,6 +14,7 @@ import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
+import '../appearance/Title.js';
 
 function Swiper(props) {
     var activeSlideIndex = props.activeSlideIndex, autoHeight = props.autoHeight, breakpoints = props.breakpoints, children = props.children, className = props.className, direction = props.direction, allowTouchMove = props.allowTouchMove, swiperSlideClass = props.swiperSlideClass, preventClicks = props.preventClicks, preventClicksPropagation = props.preventClicksPropagation, simulateTouch = props.simulateTouch, forwardedRef = props.forwardedRef, // https://github.com/vercel/next.js/issues/4957

package/dist/components/Tab.js

@@ -1,12 +1,13 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import clsx from 'clsx';
+import { tabAppearance } from '../appearance/Tab.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { B as Badge } from '../Badge-CrhdvxY6.js';
+import { B as Badge } from '../Badge-BZYBmgBK.js';
 import { D as Divider } from '../Divider-U5UdY-ef.js';
-import { L as Link } from '../Link-CeQuavin.js';
-import { T as Text } from '../Text-CG3xPG27.js';
+import { L as Link } from '../Link-CzC1kU5C.js';
+import { T as Text } from '../Text-kxGZButz.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
@@ -16,16 +17,18 @@ import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../tslib.es6-5FtW-kfi.js';
+import '../appearance/Badge.js';
+import '../tslib.es6-w7hdJ3oZ.js';
+import '../appearance/Text.js';
 
 var tabConfig = {
-    appearance: undefined,
+    appearance: tabAppearance,
     setAppearance: function (newComponent) {
         tabConfig.appearance = newComponent;
     },
 };
 function Tab(props) {
-    var children = props.children, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isHover, isHover = _c === void 0 ? false : _c, after = props.after, appearance = props.appearance, badgeAppearance = props.badgeAppearance, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, badgeValue = props.badgeValue, before = props.before, className = props.className, dataTour = props.dataTour, _d = props.dividerDirection, dividerDirection = _d === void 0 ? 'horizontal' : _d, dividerFill = props.dividerFill, dividerFillActive = props.dividerFillActive, dividerFillActiveHover = props.dividerFillActiveHover, dividerFillDisabled = props.dividerFillDisabled, dividerFillHover = props.dividerFillHover, dividerSize = props.dividerSize, href = props.href, label = props.label, labelColor = props.labelColor, labelColorActive = props.labelColorActive, labelColorDisabled = props.labelColorDisabled, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextAlign = props.labelTextAlign, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, reset = props.reset, set = props.set, target = props.target, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
+    var children = props.children, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isHover, isHover = _c === void 0 ? false : _c, after = props.after, appearance = props.appearance, badgeAppearance = props.badgeAppearance, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, badgeValue = props.badgeValue, before = props.before, className = props.className, dataTour = props.dataTour, _d = props.dividerDirection, dividerDirection = _d === void 0 ? 'horizontal' : _d, dividerFill = props.dividerFill, dividerFillActive = props.dividerFillActive, dividerFillActiveHover = props.dividerFillActiveHover, dividerFillDisabled = props.dividerFillDisabled, dividerFillHover = props.dividerFillHover, dividerSize = props.dividerSize, href = props.href, label = props.label, labelColor = props.labelColor, labelColorActive = props.labelColorActive, labelColorDisabled = props.labelColorDisabled, labelTextAlign = props.labelTextAlign, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, reset = props.reset, set = props.set, target = props.target, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
     var alignDirectionClass = useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -77,7 +80,7 @@ function Tab(props) {
     // @ts-expect-error
     var tab = useStyles(props).styles;
     var appearanceConfig = appearance && tabConfig.appearance && tabConfig.appearance[appearance];
-    return (jsx("div", { "data-tour": dataTour, style: tab, className: clsx('tab', isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', isHover && 'tab_state_hover', fillClass ||
+    return (jsx("div", { className: clsx('tab', isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', isHover && 'tab_state_hover', fillClass ||
             (isDisabled
                 ? fillDisabledClass ||
                     ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillDisabled) &&
@@ -92,9 +95,9 @@ function Tab(props) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.size) &&
                 "tab_size_".concat(appearanceConfig.size).replace(/([A-Z])/g, '-$1').toLowerCase()), fillActiveClass, fillActiveHoverClass, shapeClass, typeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.type) &&
-                "tab_type_".concat(appearanceConfig.type).replace(/([A-Z])/g, '-$1').toLowerCase()), widthClass, reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass, onClick && 'cursor_type_pointer'), onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { fill: linkFill, className: clsx('tab__link', alignDirectionClass, alignClass), href: link || href, rel: rel, target: target, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [jsxs("div", { className: "tab__wrapper", children: [(label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "tab__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColorHover: labelTextColorHover, textColor: isDisabled
+                "tab_type_".concat(appearanceConfig.type).replace(/([A-Z])/g, '-$1').toLowerCase()), widthClass, reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass, onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { className: clsx('tab__link', alignDirectionClass, alignClass), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [jsxs("div", { className: "tab__wrapper", children: [(label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "tab__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textAlign: labelTextAlign, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, textColor: isDisabled
                                             ? labelColorDisabled || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorDisabled)
-                                            : labelColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColor), textColorActive: isActive && (labelColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorActive)), textColorGradient: labelTextGradient, textStyle: labelTextStyle, textAlign: labelTextAlign, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue)) && (jsx(Badge, { appearance: badgeAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeAppearance), size: badgeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeSize), textColor: badgeTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextColor), textSize: badgeTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextSize), value: badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue) }))] }), jsx(Divider, { width: "fill", fill: isDisabled
+                                            : labelColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColor), textColorActive: isActive && (labelColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorActive)), children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue)) && (jsx(Badge, { appearance: badgeAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeAppearance), size: badgeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeSize), textColor: badgeTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextColor), textSize: badgeTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextSize), value: badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue) }))] }), jsx(Divider, { width: "fill", fill: isDisabled
                                     ? dividerFillDisabled || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillDisabled)
                                     : dividerFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFill), fillHover: isHover && (dividerFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillHover)), direction: dividerDirection, fillActive: isActive && (dividerFillActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillActive)), fillActiveHover: dividerFillActiveHover, size: dividerSize })] })), after] }) }) }));
 }
@@ -143,7 +146,7 @@ function TabGroup(props) {
     });
     // @ts-expect-error
     var _a = useStyles(props), groupStyles = _a.styles, groupWrapperStyles = _a.wrapper;
-    return (jsx("div", { className: clsx(className, 'tab-group', 'group', widthClass, contentAlignClass, alignDirectionClass, directionClass, alignClass, fillClass, set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', wrapClass, borderColorClass, borderWidthClass, borderTypeClass), "data-tour": dataTour, id: id, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsx("div", { className: "group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
+    return (jsx("div", { className: clsx(className, 'tab-group', 'group', widthClass, contentAlignClass, alignDirectionClass, directionClass, alignClass, fillClass, set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', wrapClass, borderColorClass, borderWidthClass, borderTypeClass), "data-tour": dataTour, id: id, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsx("div", { className: "tab-group__wrapper group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
 }
 
 export { Tab, TabGroup, tabConfig };

package/dist/components/Text.js

@@ -1,6 +1,7 @@
-export { T as Text, t as textConfig } from '../Text-CG3xPG27.js';
+export { T as Text, t as textConfig } from '../Text-kxGZButz.js';
 import 'react/jsx-runtime';
 import 'clsx';
+import '../appearance/Text.js';
 import '../hooks/useDeviceTargetClass.js';
 import 'react';
 import 'lodash/castArray';