@salutejs/plasma-new-hope 0.335.0-canary.2194.17367251959.0 → 0.335.0-canary.2195.17430179093.0

package/styled-components/cjs/examples/components/Tabs/horizontal/HorizontalTabItem.config.js

@@ -132,8 +132,9 @@ var config = {
                 ":var(--plasma-typo-body-xs-font-style);",
                 ":var(--plasma-typo-body-xs-font-weight);",
                 ":var(--plasma-typo-body-xs-letter-spacing);",
-                ":var(--plasma-typo-body-xs-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             s: (0, _styledcomponents.css)([
                 "",
                 ":0.5rem;",
@@ -149,8 +150,9 @@ var config = {
                 ":var(--plasma-typo-body-s-font-style);",
                 ":var(--plasma-typo-body-s-font-weight);",
                 ":var(--plasma-typo-body-s-letter-spacing);",
-                ":var(--plasma-typo-body-s-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-s-line-height);",
+                ":0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             m: (0, _styledcomponents.css)([
                 "",
                 ":0.625rem;",
@@ -166,8 +168,9 @@ var config = {
                 ":var(--plasma-typo-body-m-font-style);",
                 ":var(--plasma-typo-body-m-font-weight);",
                 ":var(--plasma-typo-body-m-letter-spacing);",
-                ":var(--plasma-typo-body-m-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-m-line-height);",
+                ":0.25rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             l: (0, _styledcomponents.css)([
                 "",
                 ":0.75rem;",
@@ -183,8 +186,9 @@ var config = {
                 ":var(--plasma-typo-body-l-font-style);",
                 ":var(--plasma-typo-body-l-font-weight);",
                 ":var(--plasma-typo-body-l-letter-spacing);",
-                ":var(--plasma-typo-body-l-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-l-line-height);",
+                ":0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             h5: (0, _styledcomponents.css)([
                 "",
                 ":0.375rem;",
@@ -198,8 +202,9 @@ var config = {
                 ":var(--plasma-typo-h5-font-style);",
                 ":var(--plasma-typo-h5-font-weight);",
                 ":var(--plasma-typo-h5-letter-spacing);",
-                ":var(--plasma-typo-h5-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-h5-line-height);",
+                ":-0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             h4: (0, _styledcomponents.css)([
                 "",
                 ":0.375rem;",
@@ -213,8 +218,9 @@ var config = {
                 ":var(--plasma-typo-h4-font-style);",
                 ":var(--plasma-typo-h4-font-weight);",
                 ":var(--plasma-typo-h4-letter-spacing);",
-                ":var(--plasma-typo-h4-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-h4-line-height);",
+                ":-0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             h3: (0, _styledcomponents.css)([
                 "",
                 ":0.5rem;",
@@ -228,8 +234,9 @@ var config = {
                 ":var(--plasma-typo-h3-font-style);",
                 ":var(--plasma-typo-h3-font-weight);",
                 ":var(--plasma-typo-h3-letter-spacing);",
-                ":var(--plasma-typo-h3-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-h3-line-height);",
+                ":-0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             h2: (0, _styledcomponents.css)([
                 "",
                 ":0.625rem;",
@@ -243,8 +250,9 @@ var config = {
                 ":var(--plasma-typo-h2-font-style);",
                 ":var(--plasma-typo-h2-font-weight);",
                 ":var(--plasma-typo-h2-letter-spacing);",
-                ":var(--plasma-typo-h2-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-h2-line-height);",
+                ":-0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             h1: (0, _styledcomponents.css)([
                 "",
                 ":0.75rem;",
@@ -258,8 +266,9 @@ var config = {
                 ":var(--plasma-typo-h1-font-style);",
                 ":var(--plasma-typo-h1-font-weight);",
                 ":var(--plasma-typo-h1-letter-spacing);",
-                ":var(--plasma-typo-h1-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight)
+                ":var(--plasma-typo-h1-line-height);",
+                ":0;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft)
         },
         disabled: {
             true: (0, _styledcomponents.css)([

package/styled-components/cjs/examples/components/Tabs/vertical/VerticalIconTabItem.config.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "config", {
+    enumerable: true,
+    get: function() {
+        return config;
+    }
+});
+var _styledcomponents = require("styled-components");
+var _Tabs = require("../../../../components/Tabs");
+var config = {
+    defaults: {
+        view: 'divider',
+        size: 'xs'
+    },
+    variations: {
+        view: {
+            divider: (0, _styledcomponents.css)([
+                "",
+                ":var(--text-secondary);",
+                ":transparent;",
+                ":var(--text-secondary-hover);",
+                ":var(--text-secondary-active);",
+                ":transparent;",
+                ":var(--text-primary);",
+                ":transparent;",
+                ":var(--text-primary);",
+                ":transparent;",
+                ":background-color 0.3s ease-in-out;",
+                ":var(--surface-accent);",
+                ":0.125rem;",
+                ":var(--text-primary);",
+                ":var(--text-primary);",
+                ":pointer;"
+            ], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerWidth, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover, _Tabs.tabsTokens.itemCursor)
+        },
+        size: {
+            xs: (0, _styledcomponents.css)([
+                "",
+                ":0.375rem;",
+                ":0.5rem 0.625rem;",
+                ":0.25rem;",
+                ":0.125rem;",
+                ":0;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.actionContentMarginLeft),
+            s: (0, _styledcomponents.css)([
+                "",
+                ":0.5rem;",
+                ":0.5rem 0.625rem;",
+                ":0.25rem;",
+                ":0.125rem;",
+                ":0.25rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.actionContentMarginLeft),
+            m: (0, _styledcomponents.css)([
+                "",
+                ":0.625rem;",
+                ":0.75rem 0.875rem;",
+                ":0.375rem;",
+                ":0.125rem;",
+                ":0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.actionContentMarginLeft),
+            l: (0, _styledcomponents.css)([
+                "",
+                ":0.75rem;",
+                ":1rem 1.125rem;",
+                ":0.5rem;",
+                ":0.125rem;",
+                ":0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.actionContentMarginLeft)
+        },
+        disabled: {
+            true: (0, _styledcomponents.css)([
+                "",
+                ":0.4;"
+            ], _Tabs.tabsTokens.disabledOpacity)
+        }
+    }
+};

package/styled-components/cjs/examples/components/Tabs/vertical/VerticalTabItem.config.js

@@ -61,8 +61,9 @@ var config = {
                 ":var(--plasma-typo-body-xs-font-style);",
                 ":var(--plasma-typo-body-xs-font-weight);",
                 ":var(--plasma-typo-body-xs-letter-spacing);",
-                ":var(--plasma-typo-body-xs-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             s: (0, _styledcomponents.css)([
                 "",
                 ":0.5rem;",
@@ -79,8 +80,9 @@ var config = {
                 ":var(--plasma-typo-body-s-font-style);",
                 ":var(--plasma-typo-body-s-font-weight);",
                 ":var(--plasma-typo-body-s-letter-spacing);",
-                ":var(--plasma-typo-body-s-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-s-line-height);",
+                ":0.25rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             m: (0, _styledcomponents.css)([
                 "",
                 ":0.625rem;",
@@ -97,8 +99,9 @@ var config = {
                 ":var(--plasma-typo-body-m-font-style);",
                 ":var(--plasma-typo-body-m-font-weight);",
                 ":var(--plasma-typo-body-m-letter-spacing);",
-                ":var(--plasma-typo-body-m-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight),
+                ":var(--plasma-typo-body-m-line-height);",
+                ":0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft),
             l: (0, _styledcomponents.css)([
                 "",
                 ":0.75rem;",
@@ -115,8 +118,9 @@ var config = {
                 ":var(--plasma-typo-body-l-font-style);",
                 ":var(--plasma-typo-body-l-font-weight);",
                 ":var(--plasma-typo-body-l-letter-spacing);",
-                ":var(--plasma-typo-body-l-line-height);"
-            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight)
+                ":var(--plasma-typo-body-l-line-height);",
+                ":0.125rem;"
+            ], _Tabs.tabsTokens.itemBorderRadius, _Tabs.tabsTokens.itemWidth, _Tabs.tabsTokens.itemHeight, _Tabs.tabsTokens.itemPadding, _Tabs.tabsTokens.itemPaddingPilled, _Tabs.tabsTokens.itemPaddingOrientationVertical, _Tabs.tabsTokens.itemMarginLeft, _Tabs.tabsTokens.itemContentGap, _Tabs.tabsTokens.itemContentPadding, _Tabs.tabsTokens.fontFamily, _Tabs.tabsTokens.fontSize, _Tabs.tabsTokens.fontStyle, _Tabs.tabsTokens.fontWeight, _Tabs.tabsTokens.letterSpacing, _Tabs.tabsTokens.lineHeight, _Tabs.tabsTokens.actionContentMarginLeft)
         },
         disabled: {
             true: (0, _styledcomponents.css)([

package/styled-components/cjs/index.js

@@ -85,6 +85,7 @@ _export_star(require("./components/CodeField"), exports);
 _export_star(require("./components/Tour"), exports);
 _export_star(require("./components/EmbedIconButton"), exports);
 _export_star(require("./components/InformationWrapper"), exports);
+_export_star(require("./components/NavigationDrawer"), exports);
 function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {

package/styled-components/es/components/Autocomplete/Autocomplete.js

@@ -111,7 +111,7 @@ import { useKeyNavigation } from "./hooks/useKeyboardNavigation";
  * Компонент Autocomplete. Поле ввода с подсказками в выпадающем списке.
  */ export var autocompleteRoot = function(Root) {
     return /*#__PURE__*/ forwardRef(function(_param, ref) {
-        var outerValue = _param.value, defaultValue = _param.defaultValue, onChange = _param.onChange, suggestions = _param.suggestions, view = _param.view, size = _param.size, labelPlacement = _param.labelPlacement, keepPlaceholder = _param.keepPlaceholder, disabled = _param.disabled, readOnly = _param.readOnly, label = _param.label, leftHelper = _param.leftHelper, contentLeft = _param.contentLeft, contentRight = _param.contentRight, textBefore = _param.textBefore, textAfter = _param.textAfter, onScroll = _param.onScroll, _param_listMaxHeight = _param.listMaxHeight, listMaxHeight = _param_listMaxHeight === void 0 ? '25rem' : _param_listMaxHeight, listWidth = _param.listWidth, portal = _param.portal, zIndex = _param.zIndex, filter = _param.filter, onSuggestionSelect = _param.onSuggestionSelect, _param_threshold = _param.threshold, threshold = _param_threshold === void 0 ? 2 : _param_threshold, renderList = _param.renderList, renderListEnd = _param.renderListEnd, renderItem = _param.renderItem, onSearch = _param.onSearch, hintText = _param.hintText, _param_hintView = _param.hintView, hintView = _param_hintView === void 0 ? 'default' : _param_hintView, _param_hintSize = _param.hintSize, hintSize = _param_hintSize === void 0 ? 'm' : _param_hintSize, beforeList = _param.beforeList, afterList = _param.afterList, _param_virtual = _param.virtual, virtual = _param_virtual === void 0 ? false : _param_virtual, // @ts-ignore
+        var outerValue = _param.value, defaultValue = _param.defaultValue, onChange = _param.onChange, suggestions = _param.suggestions, view = _param.view, size = _param.size, labelPlacement = _param.labelPlacement, keepPlaceholder = _param.keepPlaceholder, disabled = _param.disabled, readOnly = _param.readOnly, label = _param.label, leftHelper = _param.leftHelper, contentLeft = _param.contentLeft, contentRight = _param.contentRight, textBefore = _param.textBefore, textAfter = _param.textAfter, onScroll = _param.onScroll, _param_listMaxHeight = _param.listMaxHeight, listMaxHeight = _param_listMaxHeight === void 0 ? '25rem' : _param_listMaxHeight, listWidth = _param.listWidth, portal = _param.portal, zIndex = _param.zIndex, filter = _param.filter, onSuggestionSelect = _param.onSuggestionSelect, _param_threshold = _param.threshold, threshold = _param_threshold === void 0 ? 2 : _param_threshold, renderList = _param.renderList, renderListEnd = _param.renderListEnd, renderItem = _param.renderItem, onSearch = _param.onSearch, hintText = _param.hintText, _param_hintView = _param.hintView, hintView = _param_hintView === void 0 ? 'default' : _param_hintView, _param_hintSize = _param.hintSize, hintSize = _param_hintSize === void 0 ? 'm' : _param_hintSize, beforeList = _param.beforeList, afterList = _param.afterList, _param_virtual = _param.virtual, virtual = _param_virtual === void 0 ? false : _param_virtual, _param_flip = _param.flip, flip = _param_flip === void 0 ? false : _param_flip, // @ts-ignore
         _offset = _param._offset, rest = _object_without_properties(_param, [
             "value",
             "defaultValue",
@@ -147,6 +147,7 @@ import { useKeyNavigation } from "./hooks/useKeyboardNavigation";
             "beforeList",
             "afterList",
             "virtual",
+            "flip",
             "_offset"
         ]);
         var _useReducer = _sliced_to_array(useReducer(focusedReducer, null), 2), focused = _useReducer[0], dispatchFocused = _useReducer[1];
@@ -221,6 +222,7 @@ import { useKeyNavigation } from "./hooks/useKeyboardNavigation";
             zIndex: zIndex,
             listWidth: listWidth,
             offset: _offset,
+            flip: flip,
             target: function(referenceRef) {
                 return /*#__PURE__*/ React.createElement(StyledTextField, _object_spread({
                     ref: ref,

package/styled-components/es/components/Autocomplete/FloatingPopover.js

@@ -1,3 +1,11 @@
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_without_holes(arr) {
+    if (Array.isArray(arr)) return _array_like_to_array(arr);
+}
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -11,6 +19,12 @@ function _define_property(obj, key, value) {
     }
     return obj;
 }
+function _iterable_to_array(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+function _non_iterable_spread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
 function _object_spread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
@@ -50,11 +64,22 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
+function _to_consumable_array(arr) {
+    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
 import { flip, shift, size, useFloating, FloatingPortal, autoUpdate, offset as offsetMiddleware } from "@floating-ui/react";
 import React, { forwardRef } from "react";
 import { safeUseId } from "../../utils";
 var FloatingPopover = /*#__PURE__*/ forwardRef(function(param, ref) {
-    var target = param.target, children = param.children, opened = param.opened, portal = param.portal, zIndex = param.zIndex, listWidth = param.listWidth, offset = param.offset;
+    var target = param.target, children = param.children, opened = param.opened, portal = param.portal, zIndex = param.zIndex, listWidth = param.listWidth, offset = param.offset, flipFlag = param.flip;
     var _useFloating = useFloating({
         whileElementsMounted: function whileElementsMounted(referenceEl, floatingEl, update) {
             return autoUpdate(referenceEl, floatingEl, update, {
@@ -69,10 +94,12 @@ var FloatingPopover = /*#__PURE__*/ forwardRef(function(param, ref) {
             offsetMiddleware({
                 mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || 0,
                 alignmentAxis: (offset === null || offset === void 0 ? void 0 : offset[0]) || 0
-            }),
+            })
+        ].concat(_to_consumable_array(flipFlag ? [
             flip({
                 fallbackAxisSideDirection: 'end'
-            }),
+            })
+        ] : []), [
             shift(),
             size({
                 apply: function apply(param) {
@@ -82,7 +109,7 @@ var FloatingPopover = /*#__PURE__*/ forwardRef(function(param, ref) {
                     });
                 }
             })
-        ]
+        ])
     }), refs = _useFloating.refs, floatingStyles = _useFloating.floatingStyles;
     var wrappedId = safeUseId();
     // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.

package/styled-components/es/components/Button/Button.js

@@ -78,6 +78,7 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 import React, { forwardRef } from "react";
+import cls from "classnames";
 import { convertRoundnessMatrix } from "../../utils/roundness";
 import { cx } from "../../utils";
 import { base as viewCSS } from "./variations/_view/base";
@@ -86,11 +87,11 @@ import { base as disabledCSS } from "./variations/_disabled/base";
 import { base as focusedCSS } from "./variations/_focused/base";
 import { base as stretchingCSS } from "./variations/_stretching/base";
 import { base as blurredCSS } from "./variations/_blurred/base";
-import { base, ButtonText, ButtonValue, Loader, LoadWrap, StyledContentLeft, StyledContentRight, StyledSpinner } from "./Button.styles";
+import { base, ButtonText, ButtonValue, Loader, LoadWrap, StyledAdditionalContent, StyledContentLeft, StyledContentRight, StyledSpinner } from "./Button.styles";
 import { classes, tokens } from "./Button.tokens";
 export var buttonRoot = function(Root) {
     return /*#__PURE__*/ forwardRef(function(props, ref) {
-        var children = props.children, view = props.view, size = props.size, text = props.text, value = props.value, contentLeft = props.contentLeft, contentRight = props.contentRight, _props_contentPlacing = props.contentPlacing, contentPlacing = _props_contentPlacing === void 0 ? 'default' : _props_contentPlacing, isLoading = props.isLoading, loader = props.loader, stretch = props.stretch, square = props.square, pin = props.pin, disabled = props.disabled, focused = props.focused, outlined = props.outlined, className = props.className, blur = props.blur, style = props.style, _props_stretching = props.stretching, stretching = _props_stretching === void 0 ? 'auto' : _props_stretching, rest = _object_without_properties(props, [
+        var children = props.children, view = props.view, size = props.size, text = props.text, value = props.value, contentLeft = props.contentLeft, contentRight = props.contentRight, _props_contentPlacing = props.contentPlacing, contentPlacing = _props_contentPlacing === void 0 ? 'default' : _props_contentPlacing, isLoading = props.isLoading, loader = props.loader, stretch = props.stretch, square = props.square, pin = props.pin, disabled = props.disabled, focused = props.focused, outlined = props.outlined, className = props.className, blur = props.blur, style = props.style, _props_stretching = props.stretching, stretching = _props_stretching === void 0 ? 'auto' : _props_stretching, additionalContent = props.additionalContent, rest = _object_without_properties(props, [
             "children",
             "view",
             "size",
@@ -110,7 +111,8 @@ export var buttonRoot = function(Root) {
             "className",
             "blur",
             "style",
-            "stretching"
+            "stretching",
+            "additionalContent"
         ]);
         var txt = typeof children === 'string' ? children : text;
         var hasRightContentMargin = Boolean(children || txt || value || contentRight);
@@ -143,9 +145,9 @@ export var buttonRoot = function(Root) {
             isLoading: isLoading
         }, contentLeft && /*#__PURE__*/ React.createElement(StyledContentLeft, {
             hasContentMargin: hasRightContentMargin
-        }, contentLeft), txt ? /*#__PURE__*/ React.createElement(ButtonText, {
-            className: contentRelaxedClass
-        }, txt) : children, value && /*#__PURE__*/ React.createElement(ButtonValue, null, value), contentRight && /*#__PURE__*/ React.createElement(StyledContentRight, {
+        }, contentLeft), txt ? /*#__PURE__*/ React.createElement(ButtonText, null, txt) : children, additionalContent && /*#__PURE__*/ React.createElement(StyledAdditionalContent, {
+            className: cls(contentRelaxedClass, _define_property({}, classes.buttonHasValue, Boolean(value)))
+        }, additionalContent), value && /*#__PURE__*/ React.createElement(ButtonValue, null, value), contentRight && /*#__PURE__*/ React.createElement(StyledContentRight, {
             hasContentMargin: hasLeftContentMargin
         }, contentRight)), isLoading && /*#__PURE__*/ React.createElement(Loader, null, loader || /*#__PURE__*/ React.createElement(StyledSpinner, null)));
     });

package/styled-components/es/components/Button/Button.styles.js

@@ -9,16 +9,25 @@ var mergedConfig = mergeConfig(spinnerConfig);
 var Spinner = component(mergedConfig);
 export var ButtonText = styled.span.withConfig({
     displayName: "Button.styles__ButtonText",
-    componentId: "sc-63bce397-0"
+    componentId: "sc-46d80f27-0"
 })([
     "min-width:4ch;flex-shrink:2;color:var(",
     ");",
-    " &.",
-    "{text-align:start;flex-grow:2;}"
-], tokens.buttonTextColor, applyEllipsis(), String(classes.contentRelaxed));
+    ""
+], tokens.buttonTextColor, applyEllipsis());
+export var StyledAdditionalContent = styled.div.withConfig({
+    displayName: "Button.styles__StyledAdditionalContent",
+    componentId: "sc-46d80f27-1"
+})([
+    "display:flex;align-items:center;margin:var(",
+    ");&.",
+    "{text-align:start;flex-grow:2;}&.",
+    "{margin-right:var(",
+    ");}"
+], tokens.buttonAdditionalContentMargin, String(classes.contentRelaxed), classes.buttonHasValue, tokens.buttonAdditionalContentMarginRightWidthValue);
 export var ButtonValue = styled.span.withConfig({
     displayName: "Button.styles__ButtonValue",
-    componentId: "sc-63bce397-1"
+    componentId: "sc-46d80f27-2"
 })([
     "color:var(",
     ");margin:var(",
@@ -28,7 +37,7 @@ export var ButtonValue = styled.span.withConfig({
 // TODO: #720
 export var LoadWrap = styled.div.withConfig({
     displayName: "Button.styles__LoadWrap",
-    componentId: "sc-63bce397-2"
+    componentId: "sc-46d80f27-3"
 })([
     "opacity:",
     ";display:flex;align-items:inherit;justify-content:",
@@ -42,13 +51,13 @@ export var LoadWrap = styled.div.withConfig({
 });
 export var Loader = styled.div.withConfig({
     displayName: "Button.styles__Loader",
-    componentId: "sc-63bce397-3"
+    componentId: "sc-46d80f27-4"
 })([
     "position:absolute;"
 ]);
 export var StyledSpinner = styled(Spinner).withConfig({
     displayName: "Button.styles__StyledSpinner",
-    componentId: "sc-63bce397-4"
+    componentId: "sc-46d80f27-5"
 })([
     "",
     ":var(",
@@ -58,7 +67,7 @@ export var StyledSpinner = styled(Spinner).withConfig({
 ], spinnerTokens.size, tokens.buttonSpinnerSize, spinnerTokens.color, tokens.buttonSpinnerColor);
 export var StyledContentLeft = styled.div.withConfig({
     displayName: "Button.styles__StyledContentLeft",
-    componentId: "sc-63bce397-5"
+    componentId: "sc-46d80f27-6"
 })([
     "display:flex;align-self:var(",
     ");color:var(",
@@ -70,7 +79,7 @@ export var StyledContentLeft = styled.div.withConfig({
 });
 export var StyledContentRight = styled.div.withConfig({
     displayName: "Button.styles__StyledContentRight",
-    componentId: "sc-63bce397-6"
+    componentId: "sc-46d80f27-7"
 })([
     "display:flex;align-self:var(",
     ");color:var(",

package/styled-components/es/components/Button/Button.tokens.js

@@ -6,7 +6,8 @@ export var classes = {
     contentRelaxed: 'button-content-relaxed',
     buttonSquare: 'button-square',
     buttonItem: 'button-item',
-    buttonLoading: 'button-loading'
+    buttonLoading: 'button-loading',
+    buttonHasValue: 'button-has-value'
 };
 export var tokens = {
     buttonColor: '--plasma-button-color',
@@ -36,7 +37,9 @@ export var tokens = {
     buttonLeftContentAlignSelf: '--plasma-button-left-content-align-self',
     buttonRightContentMargin: '--plasma-button-right-content-margin',
     buttonRightContentAlignSelf: '--plasma-button-right-content-align-self',
+    buttonAdditionalContentMargin: '--plasma-button-additional-content-margin',
     buttonValueMargin: '--plasma-button-value-margin',
+    buttonAdditionalContentMarginRightWidthValue: '--plasma-button-additional-content-margin-right-width-value',
     buttonDisabledOpacity: '--plasma-button-disabled-opacity',
     buttonFocusColor: '--plasma-button-focus-color',
     buttonSpinnerColor: '--plasma-button-spinner-color',

package/styled-components/es/components/Calendar/Calendar.tokens.js

@@ -71,6 +71,7 @@ export var tokens = {
     /* Токены шапки календаря */ calendarHeaderWrapperPadding: '--plasma-calendar-header-wrapper-padding',
     calendarHeaderArrowGap: '--plasma-calendar-arrow-container-gap',
     calendarHeaderArrowPadding: '--plasma-calendar-arrow-container-padding',
+    calendarArrowHeaderCustomSize: '--plasma-calendar-arrow-custom-size',
     calendarHeaderPadding: '--plasma-calendar-header-padding',
     calendarHeaderDateGap: '--plasma-calendar-header-date-gap',
     calendarHeaderFontFamily: '--plasma-calendar-header-font-family',

package/styled-components/es/components/Calendar/ui/CalendarHeader/CalendarHeader.js

@@ -2,7 +2,7 @@ import React from "react";
 import { IconDisclosureLeft, IconDisclosureRight } from "../../../_Icon";
 import { CalendarState } from "../../store/types";
 import { getCalendarType, MONTH_NAMES, YEAR_RENDER_COUNT, I18N } from "../../utils";
-import { classes } from "../../Calendar.tokens";
+import { classes, tokens } from "../../Calendar.tokens";
 import { sizeMap } from "../../store/reducer";
 import { cx } from "../../../../utils";
 import { StyledArrow, StyledArrows, StyledCalendarHeader, StyledDoubleHeaderWrapper, StyledHeader, StyledHeaderDate, StyledHeaderDouble, StyledNavigation, StyledHeaderArrow } from "./CalendarHeader.styles";
@@ -63,7 +63,7 @@ import { StyledArrow, StyledArrows, StyledCalendarHeader, StyledDoubleHeaderWrap
             onClick: handlePrev
         }, /*#__PURE__*/ React.createElement(IconDisclosureLeft, {
             color: "inherit",
-            size: size === 'xs' ? 'xs' : 's'
+            sizeCustomProperty: tokens.calendarArrowHeaderCustomSize
         }));
     };
     var NextButton = function() {
@@ -72,7 +72,7 @@ import { StyledArrow, StyledArrows, StyledCalendarHeader, StyledDoubleHeaderWrap
             onClick: handleNext
         }, /*#__PURE__*/ React.createElement(IconDisclosureRight, {
             color: "inherit",
-            size: size === 'xs' ? 'xs' : 's'
+            sizeCustomProperty: tokens.calendarArrowHeaderCustomSize
         }));
     };
     return /*#__PURE__*/ React.createElement(StyledCalendarHeader, null, isDouble ? /*#__PURE__*/ React.createElement(StyledNavigation, null, /*#__PURE__*/ React.createElement(StyledDoubleHeaderWrapper, null, /*#__PURE__*/ React.createElement(PreviousButton, null), /*#__PURE__*/ React.createElement(StyledHeaderDouble, {