@itcase/ui 1.8.58 → 1.8.61

package/dist/css/styles/align/align_horizontal.css

@@ -1,63 +1,79 @@
+%align-horizontal {
+  display: flex;
+  flex-direction: row;
+}
+
 .align {
   &_horizontal {
-    display: flex;
-    flex-direction: row;
-    &^&_top {
+    &_top {
+      @extend %align-horizontal;
       align-items: flex-start;
       &-left {
+        @extend %align-horizontal;
         align-items: flex-start;
       }
       &-center {
+        @extend %align-horizontal;
         text-align: center;
         justify-content: center;
         align-items: flex-start;
       }
       &-right {
+        @extend %align-horizontal;
         text-align: right;
         justify-content: flex-end;
         align-items: flex-start;
       }
       &-auto {
+        @extend %align-horizontal;
         text-align: right;
         justify-content: space-between;
         align-items: flex-start;
       }
     }
-    &^&_left {
+    &-left {
+      @extend %align-horizontal;
       align-items: center;
     }
-    &^&_center {
+    &-center {
+      @extend %align-horizontal;
       text-align: center;
       justify-content: center;
       align-items: center;
       &-auto {
+        @extend %align-horizontal;
         text-align: center;
         justify-content: space-between;
         align-items: center;
       }
     }
-    &^&_right {
+    &-right {
+      @extend %align-horizontal;
       text-align: right;
       justify-content: flex-end;
       align-items: center;
     }
-    &^&_bottom {
+    &_bottom {
+      @extend %align-horizontal;
       align-items: flex-end;
       &-left {
-        flex-direction: row;
+        @extend %align-horizontal;
         align-items: flex-end;
       }
       &-center {
+        @extend %align-horizontal;
         text-align: center;
         justify-content: center;
         align-items: flex-end;
       }
       &-right {
         text-align: right;
+        @extend %align-horizontal;
         justify-content: flex-end;
         align-items: flex-end;
       }
       &-auto {
+        @extend %align-horizontal;
         text-align: right;
         justify-content: space-between;
         align-items: flex-end;

package/dist/css/styles/align/align_vertical-reverse.css

@@ -1,45 +1,57 @@
+%align-vertical-reverse {
+  display: flex;
+  flex-direction: column-reverse;
+}
+
 .align {
   &_vertical-reverse {
-    display: flex;
-    flex-direction: column;
-    &^&_top {
+    &-top {
       &-left {
+        @extend %align-horizontal-reverse;
         align-items: flex-start;
       }
       &-center {
+        @extend %align-horizontal-reverse;
         text-align: center;
         align-items: center;
       }
       &-right {
+        @extend %align-horizontal-reverse;
         text-align: right;
         align-items: flex-end;
       }
     }
-    &^&_left {
+    &-left {
+      @extend %align-horizontal-reverse;
       justify-content: center;
       align-items: flex-start;
     }
-    &^&_center {
+    &-center {
+      @extend %align-horizontal-reverse;
       text-align: center;
       justify-content: center;
       align-items: center;
     }
-    &^&_right {
+    &-right {
+      @extend %align-horizontal-reverse;
       text-align: right;
       justify-content: center;
       align-items: flex-end;
     }
-    &^&_bottom {
+    &-bottom {
       &-left {
+        @extend %align-horizontal-reverse;
         justify-content: flex-end;
         align-items: flex-start;
       }
       &-center {
+        @extend %align-horizontal-reverse;
         text-align: center;
         justify-content: flex-end;
         align-items: center;
       }
       &-right {
+        @extend %align-horizontal-reverse;
         text-align: right;
         justify-content: flex-end;
         align-items: flex-end;

package/dist/css/styles/align/align_vertical.css

@@ -1,60 +1,75 @@
+%align-vertical {
+  display: flex;
+  flex-direction: column;
+}
+
 .align {
   &_vertical {
-    display: flex;
-    flex-direction: column;
-    &^&_top {
+    &-top {
       &-left {
+        @extend %align-vertical;
         align-items: flex-start;
       }
       &-center {
+        @extend %align-vertical;
         text-align: center;
         align-items: center;
       }
       &-right {
+        @extend %align-vertical;
         text-align: right;
         align-items: flex-end;
       }
       &-auto {
+        @extend %align-vertical;
         text-align: center;
         justify-content: space-between;
         align-items: center;
       }
     }
-    &^&-left {
+    &-left {
+      @extend %align-vertical;
       justify-content: center;
       align-items: flex-start;
     }
-    &^&-center {
+    &-center {
+      @extend %align-vertical;
       text-align: center;
       justify-content: center;
       align-items: center;
       &-auto {
+        @extend %align-vertical;
         text-align: center;
         justify-content: space-between;
         align-items: center;
       }
     }
-    &^&_right {
+    &-right {
+      @extend %align-vertical;
       text-align: right;
       justify-content: center;
       align-items: flex-end;
     }
-    &^&_bottom {
+    &-bottom {
       &-left {
+        @extend %align-vertical;
         justify-content: flex-end;
         align-items: flex-start;
       }
       &-center {
+        @extend %align-vertical;
         text-align: center;
         justify-content: flex-end;
         align-items: center;
       }
       &-right {
+        @extend %align-vertical;
         text-align: right;
         justify-content: flex-end;
         align-items: flex-end;
       }
       &-auto {
+        @extend %align-vertical;
         text-align: center;
         justify-content: space-between;
         align-items: center;

package/dist/stories/Overview.mdx

@@ -1,4 +1,4 @@
-import { Meta, Story } from '@storybook/blocks'
+import { Meta, Story } from '@storybook/addon-docs/blocks'
 
 import * as WarningStories from '../stories/WarningDemo.stories'
 

package/dist/stories/Playground.mdx

@@ -1,4 +1,4 @@
-import { Canvas, Controls, Meta } from '@storybook/blocks'
+import { Canvas, Controls, Meta } from '@storybook/addon-docs/blocks'
 
 import * as WarningStories from '../stories/WarningDemo.stories.tsx'
 

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

@@ -0,0 +1,25 @@
+declare const avatarAppearanceShape: {
+    circular: {
+        shape: string;
+    };
+    rounded: {
+        shape: string;
+    };
+    roundedL: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedM: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedS: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedXL: {
+        shape: string;
+        shapeStrength: string;
+    };
+};
+export { avatarAppearanceShape };

package/dist/types/components/Cell/appearance/cellSurface.d.ts

@@ -2,7 +2,10 @@ declare const cellAppearanceSurface: {
     surfacePrimary: {
         fill: string;
         fillHover: string;
+        titleTextSize: string;
         titleIconItemFill: string;
+        valueTextColor: string;
+        titleTextColor: string;
         titleLabelAppearance: string;
         labelTextColor: string;
         borderColor: string;
@@ -12,7 +15,10 @@ declare const cellAppearanceSurface: {
     surfaceSecondary: {
         fill: string;
         fillHover: string;
+        titleTextSize: string;
+        titleTextColor: string;
         titleIconItemFill: string;
+        valueTextColor: string;
         titleLabelAppearance: string;
         labelTextColor: string;
         borderColor: string;
@@ -22,7 +28,10 @@ declare const cellAppearanceSurface: {
     surfaceTertiary: {
         fill: string;
         fillHover: string;
+        titleTextSize: string;
+        titleTextColor: string;
         titleIconItemFill: string;
+        valueTextColor: string;
         titleLabelAppearance: string;
         labelTextColor: string;
         borderColor: string;
@@ -30,7 +39,10 @@ declare const cellAppearanceSurface: {
         valueLabelAppearance: string;
     };
     surfaceQuaternary: {
+        titleTextSize: string;
         fill: string;
+        valueTextColor: string;
+        titleTextColor: string;
         fillHover: string;
         titleIconItemFill: string;
         titleLabelAppearance: string;

package/dist/types/components/Chips/appearance/chipsShape.d.ts

@@ -0,0 +1,25 @@
+declare const chipsAppearanceShape: {
+    circular: {
+        shape: string;
+    };
+    rounded: {
+        shape: string;
+    };
+    roundedL: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedM: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedS: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedXL: {
+        shape: string;
+        shapeStrength: string;
+    };
+};
+export { chipsAppearanceShape };

package/dist/types/components/Chips/appearance/chipsSurface.d.ts

@@ -24,9 +24,17 @@ declare const chipsAppearanceSurface: {
     };
     surfaceSecondary: {
         fill: string;
+        fillActive: string;
+        fillActiveHover: string;
         fillHover: string;
+        labelTextActiveColor: string;
         labelTextColor: string;
+        labelTextHoverColor: string;
         borderColor: string;
+        iconAfterFillActiveIcon: string;
+        iconAfterFillIcon: string;
+        iconBeforeFillActiveIcon: string;
+        iconBeforeFillIcon: string;
     };
     surfaceTertiary: {
         fill: string;

package/dist/types/components/MenuItem/appearance/menuItemSurface.d.ts

@@ -12,6 +12,7 @@ declare const menuItemAppearanceSurface: {
         fillActive: string;
         fillActiveHover: string;
         fillHover: string;
+        labelTextHoverColor: string;
         labelTextColor: string;
         borderColor: string;
         iconAfterFillIcon: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.58",
+  "version": "1.8.61",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -103,7 +103,7 @@
     "@emotion/is-prop-valid": "^1.3.1",
     "@itcase/common": "^1.2.28",
     "@itcase/icons": "^1.2.16",
-    "@itcase/storybook-config": "^1.1.37",
+    "@itcase/storybook-config": "^1.1.50",
     "@itcase/tokens-am": "^1.1.19",
     "@itcase/tokens-baikal": "^1.1.17",
     "@itcase/tokens-palette": "^1.1.11",
@@ -142,8 +142,8 @@
     "@babel/preset-react": "^7.27.1",
     "@commitlint/cli": "^19.8.1",
     "@commitlint/config-conventional": "^19.8.1",
-    "@itcase/config": "^1.0.53",
-    "@itcase/lint": "^1.1.24",
+    "@itcase/config": "^1.0.54",
+    "@itcase/lint": "^1.1.25",
     "@itcase/types": "^1.0.6",
     "@rollup/plugin-alias": "^5.1.1",
     "@rollup/plugin-babel": "^6.0.4",