@itcase/ui 1.8.21 → 1.8.22

package/dist/components/Tile.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { b as Title, B as Badge } from '../Tooltip_es_D0PSqI2c.js';
+import { b as Title, B as Badge } from '../Tooltip_es_BaGfb-qC.js';
 import { T as Text } from '../Text_es_BRb3qqKM.js';
 import 'react';
 import 'lodash/camelCase';
@@ -19,132 +19,9 @@ import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
 import 'react-inlinesvg';
-import '../Link_es_CyJn7NFb.js';
-
-var tileAppearanceAccent = {
-    accent: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-    },
-    accentPrimary: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        borderColor: 'accentBorderPrimary',
-    },
-    accentSecondary: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        labelTextColor: 'accentTextSecondary',
-        labelTextColorHover: 'accentTextSecondary',
-        borderColor: 'accentBorderPrimary',
-        loaderItemFill: 'accentItemPrimary',
-    },
-};
-
-var tileAppearanceDanger = {
-    danger: {
-        fill: 'dangerPrimary',
-        fillHover: 'dangerPrimaryHover',
-    },
-};
-
-var tileAppearanceDisabled = {
-    disabledPrimary: {
-        fill: 'surfaceFillDisabled',
-        borderColor: 'errorBorderQuaternary',
-        borderHover: 'errorBorderQuaternary',
-        textColor: 'surfaceTextQuaternary',
-        iconBeforeFill: 'errorItemQuaternary',
-        iconClearFill: 'errorItemPrimary',
-        placeholderTextColor: 'surfaceTextQuaternary',
-    },
-    disabledSecondary: {
-        fill: 'surfaceSecondary',
-        borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
-        iconClearFill: 'surfaceItemPrimary',
-        placeholderTextColor: 'surfaceTextSecondary',
-    },
-};
-
-var tileAppearanceError = {
-    error: {
-        fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
-        labelTextColor: 'errorTextPrimary',
-        labelTextColorHover: 'errorTextPrimary',
-        loaderFill: 'errorPrimary',
-        loaderItemFill: 'errorItemPrimary',
-    },
-};
-
-var tileAppearanceInfo = {
-    info: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        labelTextColor: 'accentTextPrimary',
-        labelTextColorHover: 'accentTextPrimary',
-        borderColor: 'accentBorderPrimary',
-        loaderFill: 'accentPrimary',
-        loaderItemFill: 'accentItemPrimary',
-    },
-    infoSecondary: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-        labelTextColor: 'accentTextSecondary',
-        labelTextColorHover: 'accentTextSecondary',
-        borderColor: 'accentBorderPrimary',
-        loaderFill: 'accentPrimary',
-        loaderItemFill: 'accentItemPrimary',
-    },
-};
-
-var tileAppearancePrimary = {
-    primary: {
-        fill: 'primaryPrimary',
-        fillHover: 'primaryPrimaryHover',
-        labelTextColor: 'primaryTextPrimary',
-    },
-};
-
-var tileAppearanceRequire = {
-    requirePrimary: {
-        fill: 'warningTertiary',
-        borderColor: 'warningBorderQuaternary',
-        borderHover: 'warningBorderQuaternary',
-        textColor: 'surfaceTextPrimary',
-        iconBeforeFill: 'warningItemQuaternary',
-        iconClearFill: 'warningItemPrimary',
-        placeholderTextColor: 'surfaceTextQuaternary',
-    },
-    requireSecondary: {
-        fill: 'surfaceSecondary',
-        borderColor: 'surfaceBorderTertiary',
-        borderHover: 'surfaceBorderQuaternary',
-        iconBeforeFill: 'surfaceItemQuaternary',
-        iconClearFill: 'surfaceItemPrimary',
-        placeholderTextColor: 'surfaceTextSecondary',
-    },
-};
-
-var tileAppearanceSecondary = {
-    secondary: {
-        fill: 'secondaryPrimary',
-        fillHover: 'secondaryPrimaryHover',
-        labelTextColor: 'secondaryTextPrimary',
-    },
-};
+import '../Link_es_DxtZLeKY.js';
 
 var tileAppearanceSize = {
-    sizeXXL: {
-        size: 'xxl',
-        labelTextSize: 'xxl',
-        iconAfterFillSize: '24',
-        iconAfterSize: '24',
-        iconBeforeFillSize: '24',
-        iconBeforeSize: '24',
-    },
     sizeXL: {
         size: 'xl',
         labelTextSize: 'l',
@@ -188,37 +65,10 @@ var tileAppearanceSize = {
     sizeXXS: {
         size: 'xxs',
         labelTextSize: 'xs',
-        iconAfterFillSize: '14',
-        iconAfterSize: '14',
-        iconBeforeFillSize: '14',
-        iconBeforeSize: '14',
-    },
-};
-
-var tileAppearanceStyle = {
-    full: {
-        borderColor: '0',
-    },
-    ghost: {
-        fill: 'none',
-        borderColor: '0',
-    },
-    outlined: {
-        fill: 'none',
-    },
-    solid: {
-        borderColor: '0',
-    },
-};
-
-var tileAppearanceSuccess = {
-    success: {
-        fill: 'successPrimary',
-        fillHover: 'successPrimaryHover',
-        labelTextColor: 'successTextSecondary',
-        labelTextColorHover: 'successTextSecondary',
-        loaderFill: 'successPrimary',
-        loaderItemFill: 'successItemPrimary',
+        iconAfterFillSize: '16',
+        iconAfterSize: '16',
+        iconBeforeFillSize: '16',
+        iconBeforeSize: '16',
     },
 };
 
@@ -237,7 +87,6 @@ var tileAppearanceSurface = {
         fill: 'surfaceSecondary',
         fillHover: 'surfaceSecondaryHover',
         labelTextColor: 'surfaceTextPrimary',
-        loaderFill: 'surfaceSecondary',
         loaderItemFill: 'surfaceItemPrimary',
     },
     surfaceTertiary: {
@@ -247,18 +96,7 @@ var tileAppearanceSurface = {
     },
 };
 
-var tileAppearanceWarning = {
-    warning: {
-        fill: 'warningPrimary',
-        fillHover: 'warningPrimaryHover',
-        labelTextColor: 'warningTextSecondary',
-        labelTextColorHover: 'warningTextSecondary',
-        loaderFill: 'warningPrimary',
-        loaderItemFill: 'warningItemPrimary',
-    },
-};
-
-var tileAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, tileAppearanceSize), tileAppearanceDisabled), tileAppearanceRequire), tileAppearanceStyle), tileAppearanceAccent), tileAppearanceDanger), tileAppearanceError), tileAppearanceInfo), tileAppearancePrimary), tileAppearanceSecondary), tileAppearanceSuccess), tileAppearanceSurface), tileAppearanceWarning);
+var tileAppearance = __assign(__assign({}, tileAppearanceSize), tileAppearanceSurface);
 
 var tileConfig = {
     appearance: tileAppearance,
@@ -267,16 +105,16 @@ var tileConfig = {
     },
 };
 function Tile(props) {
-    var className = props.className, type = props.type, appearance = props.appearance, direction = props.direction, size = props.size, title = props.title, text = props.text, badge = props.badge, badgeAppearance = props.badgeAppearance, reverse = props.reverse, before = props.before, after = props.after, onClick = props.onClick, children = props.children;
+    var className = props.className, type = props.type, appearance = props.appearance, direction = props.direction, title = props.title, text = props.text, badge = props.badge, badgeAppearance = props.badgeAppearance, reverse = props.reverse, before = props.before, after = props.after, onClick = props.onClick, 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 = tileConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
     }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var alignClass = propsGenerator.alignClass, _a = propsGenerator.alignDirectionClass, alignDirectionClass = _a === void 0 ? 'vertical' : _a, fillClass = propsGenerator.fillClass, titleTextAlign = propsGenerator.titleTextAlign, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, titleTextWrap = propsGenerator.titleTextWrap, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWrap = propsGenerator.textWrap, badgeSize = propsGenerator.badgeSize, badgeTextColor = propsGenerator.badgeTextColor, badgeTextSize = propsGenerator.badgeTextSize, dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, shapeClass = propsGenerator.shapeClass;
+    var alignClass = propsGenerator.alignClass, _a = propsGenerator.alignDirectionClass, alignDirectionClass = _a === void 0 ? 'vertical' : _a, fillClass = propsGenerator.fillClass, titleTextAlign = propsGenerator.titleTextAlign, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, titleTextWrap = propsGenerator.titleTextWrap, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWrap = propsGenerator.textWrap, badgeSize = propsGenerator.badgeSize, badgeTextColor = propsGenerator.badgeTextColor, badgeTextSize = propsGenerator.badgeTextSize, dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass;
     // @ts-expect-error
     var tileStyles = useStyles(props).styles;
-    return (jsx("div", { className: clsx('tile', className, fillClass && "fill_".concat(fillClass), shapeClass && "tile_shape_".concat(shapeClass), alignClass && "align_".concat(alignClass), alignDirectionClass && "align_".concat(alignDirectionClass), direction && "direction_".concat(direction), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), reverse && 'tile_reverse', size && "tile_size_".concat(size), type && "tile_type_".concat(type), badge && "tile_state_badge"), "data-testid": dataTestId, "data-tour": dataTour, style: tileStyles, onClick: onClick, children: jsxs("div", { className: clsx('tile__wrapper', alignClass, alignDirectionClass), children: [before, title && (jsx(Title, { className: "tile__title", size: titleTextSize, textAlign: titleTextAlign, textColor: titleTextColor, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), text && (jsx(Text, { className: "tile__text", size: textSize, textColor: textColor, textWrap: textWrap, children: text })), badge && (jsx(Badge, { className: "tile__badge", appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, value: badge })), children, after] }) }));
+    return (jsx("div", { className: clsx('tile', className, fillClass && "fill_".concat(fillClass), shapeClass && "tile_shape_".concat(shapeClass), alignClass && "align_".concat(alignClass), alignDirectionClass && "align_".concat(alignDirectionClass), direction && "direction_".concat(direction), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), reverse && 'tile_reverse', sizeClass && "tile_size_".concat(sizeClass), type && "tile_type_".concat(type), badge && "tile_state_badge"), "data-testid": dataTestId, "data-tour": dataTour, style: tileStyles, onClick: onClick, children: jsxs("div", { className: clsx('tile__wrapper', alignClass, alignDirectionClass), children: [before, title && (jsx(Title, { className: "tile__title", size: titleTextSize, textAlign: titleTextAlign, textColor: titleTextColor, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), text && (jsx(Text, { className: "tile__text", size: textSize, textColor: textColor, textWrap: textWrap, children: text })), badge && (jsx(Badge, { className: "tile__badge", appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, value: badge })), children, after] }) }));
 }
 
 export { Tile, tileAppearance, tileConfig };

package/dist/components/Title.js

@@ -1,4 +1,4 @@
-export { b as Title, d as titleAppearance, c as titleConfig } from '../Tooltip_es_D0PSqI2c.js';
+export { b as Title, d as titleAppearance, c as titleConfig } from '../Tooltip_es_BaGfb-qC.js';
 import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react/jsx-runtime';
 import 'react';
@@ -19,4 +19,4 @@ import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
 import '../Text_es_BRb3qqKM.js';
 import 'react-inlinesvg';
-import '../Link_es_CyJn7NFb.js';
+import '../Link_es_DxtZLeKY.js';

package/dist/components/Tooltip.js

@@ -1,4 +1,4 @@
-export { T as Tooltip, a as tooltipAppearance, t as tooltipConfig } from '../Tooltip_es_D0PSqI2c.js';
+export { T as Tooltip, a as tooltipAppearance, t as tooltipConfig } from '../Tooltip_es_BaGfb-qC.js';
 import '../tslib.es6_es_Bwu1Cn-t.js';
 import 'react/jsx-runtime';
 import 'react';
@@ -19,4 +19,4 @@ import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
 import '../Text_es_BRb3qqKM.js';
 import 'react-inlinesvg';
-import '../Link_es_CyJn7NFb.js';
+import '../Link_es_DxtZLeKY.js';

package/dist/css/components/AvatarStack/AvatarStack.css

@@ -1,4 +1,4 @@
-.avatar {
+div.avatar {
   &-stack {
     margin: 0 0 0 4px;
     display: flex;
@@ -10,20 +10,7 @@
       transition: all 0.3s ease;
       cursor: pointer;
       &:hover {
-        box-shadow: 0 4px 8px rgb(0, 0, 0, 0.16);
-        z-index: 2;
-        transition: all 0.3s ease;
-      }
-      ^^&__wrapper {
-        background: linear-gradient(
-          90deg,
-          var(--color-surface-tertiary) 0%,
-          var(--color-accent-tertiary) 100%
-        );
-      }
-      ^^&__image {
-        width: 100px;
-        height: auto;
+        z-index: 10;
         transition: all 0.3s ease;
       }
       &-text {

package/dist/css/components/Code/Code.css

@@ -19,13 +19,12 @@
 }
 .code__input {
   &_size {
-    @each $size in xxl, xl, l, m, s, xs, xxs {
+    @each $size in l, m {
       &_$(size) {
         min-width: var(--code-input-size-$(size)-width);
         min-height: var(--code-input-size-$(size)-height);
         max-width: var(--code-input-size-$(size)-width);
         max-height: var(--code-input-size-$(size)-height);
-        padding: var(--code-input-size-$(size)-padding);
       }
     }
   }
@@ -50,12 +49,10 @@
 }
 :root {
   --code-input-shape-rounded: 0;
-  @each $size, $width, $height, $padding, $gap in (xxl, xl, l, m, s, xs, xxs),
-    (0, 0, 0, 0, 0, 0, 0), (0, 0, 0, 0, 0, 0, 0), (0, 0, 0, 0, 0, 0, 0),
-    (8, 8, 8, 8, 8, 8, 8) {
+  @each $size, $width, $height, $padding, $gap in (l, m), (56px, 48px),
+    (56px, 48px), (8px, 8px) {
     --code-input-size-$(size)-width: $width;
     --code-input-size-$(size)-height: $height;
-    --code-input-size-$(size)-padding: $padding;
     --code-size-$(size)-gap: $gap;
   }
 }

package/dist/css/components/Label/Label.css

@@ -1,6 +1,7 @@
 .label {
   position: relative;
   display: inline-flex;
+  align-items: center;
   &__inner {
     width: 100%;
     font-size: 0;
@@ -8,7 +9,6 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    gap: 4px;
   }
 }
 .label {
@@ -53,9 +53,8 @@
   &_size {
     @each $size in xxl, xl, l, m, s, xs, xxs {
       &_$(size) {
-        ^^&__inner {
-          padding: var(--label-size-$(size)-padding);
-        }
+        padding: var(--label-size-$(size)-padding);
+        gap: var(--label-size-$(size)-gap);
       }
     }
   }
@@ -91,6 +90,7 @@ div.label {
   --label-size-xxs-shape-rounded: 12px;
 
   --label-size-xxl-padding: 10px 10px;
+  --label-size-xxl-gap: 8px;
   --label-size-xl-padding: 7px 8px;
   --label-size-l-padding: 4px 6px;
   --label-size-m-padding: 2px 8px;

package/dist/css/components/MenuItem/MenuItem.css

@@ -1,9 +1,15 @@
 .menu-item {
-  &__label {
+  align-items: center;
+  &__wrapper {
+    width: 100%;
     display: flex;
     align-items: center;
-    gap: 4px;
     align-content: center;
+    ^&__label {
+      display: flex;
+      align-items: center;
+      flex-grow: 1;
+    }
   }
 }
 
@@ -11,55 +17,24 @@
   &_direction {
     &_horizontal {
       display: flex;
-      ^^&__label {
-        width: 100%;
-      }
     }
     &_vertical {
       display: flex;
-      ^^&__label {
-        width: 100%;
-      }
     }
   }
 }
 
 .menu-item {
-  @each $val in flex-start, flex-end, center, space-between, space-around, space-evenly {
+  @each $val in flex-start, flex-end, center, space-between, space-around,
+    space-evenly {
     &_justify-content_$(val) {
-      & > a {
+      ^&__wrapper {
         justify-content: $(val);
       }
     }
   }
 }
 
-.menu-item {
-  &_set {
-    &_filter {
-      color: var(--color-surface-text-primary);
-      padding: var(--menu-item-set-filter-padding);
-      cursor: pointer;
-      &:not(:last-child) {
-        border-right: var(--menu-item-set-filter-border-right, initial);
-      }
-      &_active {
-        & span {
-          color: var(--menu-item-set-filter-active-color, initial);
-        }
-      }
-    }
-  }
-}
-
-.menu-item {
-  &_set {
-    &_subitem {
-      transform: translate(var(--menu-item-set-subitem-padding-left));
-    }
-  }
-}
-
 .menu-item {
   &_shape {
     &_rounded {
@@ -75,7 +50,11 @@
   &_size {
     @each $size in xxl, xl, l, m, s, xs, xxs {
       &_$(size) {
-        padding: var(--menu-item-size-$(size)-padding);
+        ^^&__wrapper {
+          min-height: var(--menu-item-size-$(size)-min-height);
+          padding: var(--menu-item-size-$(size)-padding);
+          gap: var(--menu-item-size-$(size)-gap);
+        }
       }
     }
   }
@@ -90,11 +69,8 @@
   --menu-item-size-xl-padding: 10px 8px;
   --menu-item-size-xxl-padding: 12px 10px;
 
-  --menu-item-shape-rounded: 20px;
-  --menu-item-set-subitem-padding-left: 36px;
+  --menu-item-size-m-min-height: 32px;
+  --menu-item-size-m-gap: 8px;
 
-  --menu-item-set-filter-padding: 10px 16px;
-  --menu-item-set-filter-border-right: 1px solid
-    var(--color-surface-border-tertiary);
-  --menu-item-set-filter-active-color: var(--color-surface-item-accent);
+  --menu-item-shape-rounded: 20px;
 }

package/dist/css/components/Response/Response.css

@@ -11,12 +11,15 @@
     justify-content: center;
     align-items: center;
     gap: 3m;
+    &-inner {
+      flex-direction: column;
+      width: 100%;
+      display: flex;
+      align-items: center;
+    }
   }
   &__desc {
     display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
     gap: 1m;
   }
   &__button {

package/dist/css/components/Tab/Tab.css

@@ -1,8 +1,14 @@
 .tab {
-  &__label {
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: flex-end;
+  &__wrapper {
     display: flex;
-    place-content: center center;
-    align-items: center;
+    ^&__label {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
   }
 }
 .tab-group {
@@ -10,29 +16,12 @@
   display: flex;
   flex-flow: row wrap;
   align-items: stretch;
-  & .tab {
+  &__wrapper {
     display: flex;
-    flex-flow: column nowrap;
-    justify-content: flex-end;
-    &__wrapper {
-      display: flex;
-      flex: 1;
-      justify-content: center;
-      align-items: center;
-      gap: 4px;
-    }
-    &__label {
-      display: flex;
-      flex: 1;
-      justify-content: center;
-    }
-  }
-}
-div.tab-reset {
-  & .tab__wrapper {
-    padding: 0;
-    gap: 0;
-    margin: 0;
+    flex: 1;
+    justify-content: center;
+    align-items: center;
+    gap: 4px;
   }
 }
 .tab {
@@ -69,12 +58,6 @@ div.tab-reset {
   }
 }
 :root {
-  --tab-size-normal-padding: 12px;
-  --tab-size-normal-gap: 4px;
-
-  --tab-size-compact-padding: 12px;
-  --tab-size-compact-gap: 4px;
-
   --tab-size-xxs-padding: 0px;
   --tab-size-xxs-gap: 4px;
 

package/dist/css/components/Tile/Tile.css

@@ -22,7 +22,7 @@
 }
 .tile {
   &_size {
-    @each $size in xxl, xl, l, m, s, xs, xxs, normal, compact {
+    @each $size in xl, l, m, s, xs, xxs {
       &_$(size) {
         min-width: var(--tile-size-$(size)-min-width);
         padding: var(--tile-size-$(size)-padding);
@@ -57,9 +57,11 @@
   --tile-type-icon: 0;
 
   /* Size */
-  @each $size, $value in (xxl, xl, l, m, s, xs, xxs), (0, 0, 0, 0, 0, 0, 0) {
-    --tile-size-$(size)-min-width: $value;
-    --tile-size-$(size)-padding: $value;
-    --tile-size-$(size)-gap: $value;
+  @each $size, $width, $padding, $gap in (xl, l, m, s, xs, xxs),
+    (400px, 320px, 240px, 172px, 96px, 80px), (24px, 24px, 16px, 8px, 8px, 4px),
+    (24px, 24px, 16px, 8px, 8px, 4px) {
+    --tile-size-$(size)-min-width: $width;
+    --tile-size-$(size)-padding: $padding;
+    --tile-size-$(size)-gap: $gap;
   }
 }

package/dist/css/styles/svg-color/svg_fill.css

@@ -11,21 +11,21 @@
                 stroke: none;
                 fill: var(--color-$(type)-item-$(color));
               }
-              & path,
+              /* & path,
               & circle {
                 fill: var(--color-$(type)-item-$(color));
-              }
+              } */
             }
           }
           &-$(color) {
             & svg {
               stroke: none;
-              fill: var(--color-$(type)-$(color));
+              fill: var(--color-$(type)-fill-$(color));
             }
-            & path,
+            /* & path,
             & circle {
               fill: var(--color-$(type)-item-$(color));
-            }
+            } */
           }
         }
       }

package/dist/stories/Plsyground.mdx

@@ -1,7 +1,6 @@
 import { Canvas, Controls, Meta } from '@storybook/blocks'
 
 import * as BreadcrumbsStories from '../stories/Breadcrumbs.stories'
-import * as BreadcrumbsItemStories from '../stories/BreadcrubsItem.stories'
 
 <Meta title="Atoms / Breadcrumbs / Playground" />
 

package/dist/stories/index.stories.js

@@ -1,38 +1,35 @@
-import AvatarStack from '.'
+import { AvatarStack } from '../'
 
 const meta = {
-  title: 'Atoms / Avatar Stack',
+  title: 'Molecules / Avatar Stack',
   component: AvatarStack,
   args: {
     avatarSize: 48,
-    users: [
+    avatarsList: [
       {
         id: 0,
-        src: 'https://as2.ftcdn.net/v2/jpg/07/52/13/37/1000_F_752133729_dz4GYDkaKZ6vRCNadT5Pz2EBe43ShRos.jpg',
+        src: '/avatar/Man.png',
         firstName: 'firstName',
         secondName: 'secondName',
       },
       {
         id: 1,
-        src: 'https://as2.ftcdn.net/v2/jpg/07/52/13/37/1000_F_752133729_dz4GYDkaKZ6vRCNadT5Pz2EBe43ShRos.jpg',
+        src: '/avatar/Woman.png',
         firstName: 'firstName',
         secondName: 'secondName',
       },
       {
         id: 2,
-        src: 'https://as2.ftcdn.net/v2/jpg/07/52/13/37/1000_F_752133729_dz4GYDkaKZ6vRCNadT5Pz2EBe43ShRos.jpg',
         firstName: 'firstName',
         secondName: 'secondName',
       },
       {
         id: 3,
-        src: 'https://as2.ftcdn.net/v2/jpg/07/52/13/37/1000_F_752133729_dz4GYDkaKZ6vRCNadT5Pz2EBe43ShRos.jpg',
         firstName: 'firstName',
         secondName: 'secondName',
       },
       {
         id: 4,
-        src: 'https://as2.ftcdn.net/v2/jpg/07/52/13/37/1000_F_752133729_dz4GYDkaKZ6vRCNadT5Pz2EBe43ShRos.jpg',
         firstName: 'firstName',
         secondName: 'secondName',
       },

package/dist/types/components/Avatar/appearance/avatarAccent.d.ts

@@ -1,19 +1,15 @@
 declare const avatarAppearanceAccent: {
     accent: {
         fill: string;
-        fillHover: string;
     };
     accentPrimary: {
         fill: string;
-        fillHover: string;
         borderColor: string;
     };
     accentSecondary: {
         fill: string;
-        fillHover: string;
         borderColor: string;
         textColor: string;
-        textColorHover: string;
     };
 };
 export { avatarAppearanceAccent };

package/dist/types/components/Avatar/appearance/avatarDanger.d.ts

@@ -1,7 +1,6 @@
 declare const avatarAppearanceDanger: {
     danger: {
         fill: string;
-        fillHover: string;
     };
 };
 export { avatarAppearanceDanger };