@itcase/ui 1.2.29 → 1.2.31

package/dist/{Tooltip-ccRCMYQM.js → Tooltip-f5EWhsGj.js}

@@ -4,8 +4,8 @@ import clsx from 'clsx';
 import { tooltipAppearance } from './appearance/Tooltip.js';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.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 { T as Text } from './Text-DlSG_p4u.js';
+import { T as Title } from './Title-mkus84Rh.js';
 
 var tooltipConfig = {
     appearance: tooltipAppearance,
@@ -111,7 +111,23 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
     var appearanceConfig = (appearance && tooltipConfig.appearance && tooltipConfig.appearance[appearance]);
     return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
-                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass, alignClass, alignmentClass, borderWidthClass, borderColorClass, borderTypeClass, elevationClass, sizeClass, arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize, textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
+                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
+                "tooltip_shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.alignDirection) &&
+                "align_".concat(appearanceConfig.alignDirection).replace(/([A-Z])/g, '-$1').toLowerCase()), alignClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.align) &&
+                "align_".concat(appearanceConfig.align).replace(/([A-Z])/g, '-$1').toLowerCase()), alignmentClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.alignment) &&
+                "alignment_".concat(appearanceConfig.alignment).replace(/([A-Z])/g, '-$1').toLowerCase()), borderWidthClass, borderColorClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
+                "border-color_".concat(appearanceConfig.borderColor)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), borderTypeClass, elevationClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.elevation) &&
+                "elevation_".concat(appearanceConfig.elevation).replace(/([A-Z])/g, '-$1').toLowerCase()), sizeClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.size) &&
+                "tooltip_size_".concat(appearanceConfig.size).replace(/([A-Z])/g, '-$1').toLowerCase()), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
 });
 
 export { Tooltip as T, tooltipConfig as t };

package/dist/appearance/Avatar.js

@@ -0,0 +1,5 @@
+var avatarAppearance = {
+    dev: {},
+};
+
+export { avatarAppearance };

package/dist/appearance/Code.js

@@ -0,0 +1,5 @@
+var codeAppearance = {
+    dev: {},
+};
+
+export { codeAppearance };

package/dist/appearance/Divider.js

@@ -0,0 +1,5 @@
+var dividerAppearance = {
+    dev: {},
+};
+
+export { dividerAppearance };

package/dist/appearance/DropdownItem.js

@@ -0,0 +1,5 @@
+var dropdownItemAppearance = {
+    dev: {},
+};
+
+export { dropdownItemAppearance };

package/dist/appearance/Modal.js

@@ -0,0 +1,5 @@
+var modalAppearance = {
+    dev: {},
+};
+
+export { modalAppearance };

package/dist/appearance/Response.js

@@ -1,91 +1,165 @@
 var responseAppearance = {
     dev: {
+        imageSrc: '/img/response/Search.svg',
         fill: 'surfaceSecondary',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
+        messageTextSize: 'm',
         primaryButtonAppearance: 'surfaceTertiary',
-        primaryButtonLabel: 'primary Button',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'surfaceTertiary',
-        secondaryButtonLabel: 'secondary Button',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
-    error: {
+    custom: {
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
-        primaryButtonAppearance: 'secondary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'accent',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'secondary',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
-    fail: {
+    error: {
+        imageSrc: '/img/response/Error.svg',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
-        primaryButtonAppearance: 'surfaceTertiary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'secondary',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'surfaceTertiary',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
     success: {
+        imageSrc: '/img/response/Success.svg',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
+        messageTextSize: 'm',
         primaryButtonAppearance: 'accent',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'accent',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
     warning: {
+        imageSrc: '/img/response/Warning.svg',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
+        messageTextSize: 'm',
         primaryButtonAppearance: 'primary',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'primary',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    fail: {
+        imageSrc: '/img/response/Fail.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    search: {
+        imageSrc: '/img/response/Search.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    cantLoadData: {
+        imageSrc: '/img/response/CantLoadData.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    refresh: {
+        imageSrc: '/img/response/Refresh.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
 };
 

package/dist/appearance/SiteMenu.js

@@ -0,0 +1,5 @@
+var siteMenuAppearance = {
+    dev: {},
+};
+
+export { siteMenuAppearance };

package/dist/appearance/Switch.js

@@ -0,0 +1,5 @@
+var switchAppearance = {
+    dev: {},
+};
+
+export { switchAppearance };

package/dist/appearance/Tile.js

@@ -0,0 +1,5 @@
+var tileAppearance = {
+    dev: {},
+};
+
+export { tileAppearance };

package/dist/cjs/appearance/Avatar.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var avatarAppearance = {
+    dev: {},
+};
+
+exports.avatarAppearance = avatarAppearance;

package/dist/cjs/appearance/Code.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var codeAppearance = {
+    dev: {},
+};
+
+exports.codeAppearance = codeAppearance;

package/dist/cjs/appearance/Divider.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var dividerAppearance = {
+    dev: {},
+};
+
+exports.dividerAppearance = dividerAppearance;

package/dist/cjs/appearance/DropdownItem.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var dropdownItemAppearance = {
+    dev: {},
+};
+
+exports.dropdownItemAppearance = dropdownItemAppearance;

package/dist/cjs/appearance/Modal.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var modalAppearance = {
+    dev: {},
+};
+
+exports.modalAppearance = modalAppearance;

package/dist/cjs/appearance/Response.js

@@ -2,92 +2,166 @@
 
 var responseAppearance = {
     dev: {
+        imageSrc: '/img/response/Search.svg',
         fill: 'surfaceSecondary',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
+        messageTextSize: 'm',
         primaryButtonAppearance: 'surfaceTertiary',
-        primaryButtonLabel: 'primary Button',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'surfaceTertiary',
-        secondaryButtonLabel: 'secondary Button',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
-    error: {
+    custom: {
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
-        primaryButtonAppearance: 'secondary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'accent',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'secondary',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
-    fail: {
+    error: {
+        imageSrc: '/img/response/Error.svg',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
-        primaryButtonAppearance: 'surfaceTertiary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'secondary',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'surfaceTertiary',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
     success: {
+        imageSrc: '/img/response/Success.svg',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
+        messageTextSize: 'm',
         primaryButtonAppearance: 'accent',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'accent',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
     warning: {
+        imageSrc: '/img/response/Warning.svg',
         messageTextColor: 'surfaceTextPrimary',
-        messageTextSize: 'xxl',
+        messageTextSize: 'm',
         primaryButtonAppearance: 'primary',
         primaryButtonLabelTextSize: 'l',
         primaryButtonShape: 'rounded',
         primaryButtonSize: 'xxl',
         primaryButtonWidth: 'fill',
-        secondaryButtonAppearance: 'primary',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    fail: {
+        imageSrc: '/img/response/Fail.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    search: {
+        imageSrc: '/img/response/Search.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    cantLoadData: {
+        imageSrc: '/img/response/CantLoadData.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
+        secondaryButtonLabelTextSize: 'l',
+        secondaryButtonShape: 'rounded',
+        secondaryButtonSize: 'xxl',
+        secondaryButtonWidth: 'fill',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'h2',
+        titleTextWeight: 400,
+    },
+    refresh: {
+        imageSrc: '/img/response/Refresh.svg',
+        messageTextColor: 'surfaceTextPrimary',
+        messageTextSize: 'm',
+        primaryButtonAppearance: 'surfaceTertiary',
+        primaryButtonLabelTextSize: 'l',
+        primaryButtonShape: 'rounded',
+        primaryButtonSize: 'xxl',
+        primaryButtonWidth: 'fill',
+        secondaryButtonAppearance: 'surfaceSecondary',
         secondaryButtonLabelTextSize: 'l',
         secondaryButtonShape: 'rounded',
         secondaryButtonSize: 'xxl',
         secondaryButtonWidth: 'fill',
         titleTextColor: 'surfaceTextPrimary',
         titleTextSize: 'h2',
-        titleTextWeight: 600,
+        titleTextWeight: 400,
     },
 };
 

package/dist/cjs/appearance/SiteMenu.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var siteMenuAppearance = {
+    dev: {},
+};
+
+exports.siteMenuAppearance = siteMenuAppearance;

package/dist/cjs/appearance/Switch.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var switchAppearance = {
+    dev: {},
+};
+
+exports.switchAppearance = switchAppearance;

package/dist/cjs/appearance/Tile.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var tileAppearance = {
+    dev: {},
+};
+
+exports.tileAppearance = tileAppearance;

package/dist/cjs/components/Accordion.js

@@ -7,23 +7,23 @@ var clsx = require('clsx');
 var castArray = require('lodash/castArray');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 var useStyles = require('../hooks/useStyles.js');
-var Divider = require('../../Divider-BjB5MD6u.js');
-var Icon = require('../../Icon-B2BwTQnP.js');
-var Text = require('../../Text-CC0xnhmx.js');
+var Divider = require('../../Divider-3upWnf8a.js');
+var Icon = require('../../Icon-PoesVPJn.js');
+var Text = require('../../Text-1b-Bk7yG.js');
 require('lodash/camelCase');
 require('../context/UIContext.js');
-require('prop-types');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
+require('../appearance/Divider.js');
 require('react-inlinesvg');
 require('../appearance/Icon.js');
 require('../../Link-CqWzwh8V.js');
-require('../../Tooltip-PrwacZFC.js');
+require('../../Tooltip-CNJN2lf5.js');
 require('../appearance/Tooltip.js');
-require('../../Title-Ze_OL1Co.js');
+require('../../Title-o5ofk8ge.js');
 require('../appearance/Title.js');
 require('../appearance/Text.js');
 

package/dist/cjs/components/Avatar.js

@@ -3,16 +3,17 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
+var index = require('../appearance/Avatar.js');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var Icon = require('../../Icon-B2BwTQnP.js');
+var Icon = require('../../Icon-PoesVPJn.js');
 var Image = require('../../Image-DrUlRMHa.js');
-var Text = require('../../Text-CC0xnhmx.js');
+var Text = require('../../Text-1b-Bk7yG.js');
 require('lodash/castArray');
 require('lodash/camelCase');
 require('../context/UIContext.js');
-require('prop-types');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
+require('../../tslib.es6-CCZ3TN_7.js');
 require('react-inlinesvg');
 require('../appearance/Icon.js');
 require('../hooks/useStyles.js');
@@ -20,15 +21,20 @@ require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
 require('../../Link-CqWzwh8V.js');
-require('../../tslib.es6-CCZ3TN_7.js');
-require('../../Tooltip-PrwacZFC.js');
+require('../../Tooltip-CNJN2lf5.js');
 require('../appearance/Tooltip.js');
-require('../../Title-Ze_OL1Co.js');
+require('../../Title-o5ofk8ge.js');
 require('../appearance/Title.js');
 require('../appearance/Text.js');
 
+var avatarConfig = {
+    appearance: index.avatarAppearance,
+    setAppearance: function (newComponent) {
+        avatarConfig.appearance = newComponent;
+    },
+};
 function Avatar(props) {
-    var className = props.className, Dot = props.Dot, icon = props.icon, _a = props.size, size = _a === void 0 ? '96' : _a, after = props.after, before = props.before, src = props.src, type = props.type, mode = props.mode, onClick = props.onClick, _b = props.textSize, textSize = _b === void 0 ? 'l' : _b, _c = props.textColor, textColor = _c === void 0 ? 'surfaceTextTertiary' : _c, _d = props.textWeight, textWeight = _d === void 0 ? '600' : _d, iconSrc = props.iconSrc, iconItemFill = props.iconItemFill, iconShape = props.iconShape, iconSize = props.iconSize, iconFill = props.iconFill, iconFillHover = props.iconFillHover, iconFillSize = props.iconFillSize, _e = props.firstName, firstName = _e === void 0 ? '' : _e, _f = props.secondName, secondName = _f === void 0 ? '' : _f;
+    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, Dot = props.Dot, _a = props.firstName, firstName = _a === void 0 ? '' : _a, icon = props.icon, iconFill = props.iconFill, iconFillHover = props.iconFillHover, iconFillSize = props.iconFillSize, iconItemFill = props.iconItemFill, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, mode = props.mode, _b = props.secondName, secondName = _b === void 0 ? '' : _b, _c = props.size, size = _c === void 0 ? '96' : _c, src = props.src, _d = props.textColor, textColor = _d === void 0 ? 'surfaceTextTertiary' : _d, _e = props.textSize, textSize = _e === void 0 ? 'l' : _e, _f = props.textWeight, textWeight = _f === void 0 ? '600' : _f, type = props.type, onClick = props.onClick;
     var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -46,7 +52,15 @@ function Avatar(props) {
         var secondChar = ((secondName === null || secondName === void 0 ? void 0 : secondName[0]) || '').toUpperCase();
         return "".concat(firstChar).concat(secondChar);
     }, [firstName, secondName]);
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass, mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass, fillHoverClass), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", shape: "geometric", src: src })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize, textColor: textColor, textWeight: textWeight, children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill, fillHover: iconFillHover, fillSize: iconFillSize, iconFill: iconItemFill, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), Dot, after] }) }));
+    var appearanceConfig = appearance && avatarConfig.appearance && avatarConfig.appearance[appearance];
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
+                "avatar_shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
+                    "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
+                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
+                    "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase())), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", shape: "geometric", src: src })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textWeight: textWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textWeight), children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), fillHover: iconFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillHover), fillSize: iconFillSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillSize), iconFill: iconItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconItemFill), iconSize: iconSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSize), imageSrc: iconSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSrc), shape: iconShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconShape), SvgImage: icon || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.icon) })), Dot, after] }) }));
 }
 
 exports.Avatar = Avatar;
+exports.avatarConfig = avatarConfig;