@salutejs/plasma-new-hope 0.339.0-canary.2301.18868987022.0 → 0.339.0-dev.0

package/styled-components/cjs/components/Tabs/ui/horizontal/HorizontalTabs/variations/_view/base.js

@@ -12,7 +12,7 @@ var _styledcomponents = require("styled-components");
 var _tokens = require("../../../../../tokens");
 var base = (0, _styledcomponents.css)([
     "background-color:var(",
-    ");&::after{content:'';position:absolute;bottom:0.125rem;left:0.125rem;right:0.125rem;background:var(",
+    ");&::after{content:'';position:absolute;bottom:0;left:0.125rem;right:0.125rem;background:var(",
     ");height:var(",
     ");border-radius:var(",
     ");}&.",

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalIconTabItem/VerticalIconTabItem.styles.js

@@ -65,13 +65,13 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 var StyledContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalIconTabItem.styles__StyledContent",
-    componentId: "sc-4febd5c6-0"
+    componentId: "sc-7bdf76f9-0"
 })([
     "display:inline-block;width:fit-content;"
 ]);
 var ActionContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalIconTabItem.styles__ActionContent",
-    componentId: "sc-4febd5c6-1"
+    componentId: "sc-7bdf76f9-1"
 })([
     "display:flex;margin-left:var(",
     ");"
@@ -84,8 +84,8 @@ var base = (0, _styledcomponents.css)([
     ";"
 ], _tokens.tokens.itemContentGap, _tokens.tokens.itemCursorOverNotSelected, _tokens.tokens.itemCursor, (0, _mixins.addFocus)({
     outlineSize: '0.063rem',
-    outlineOffset: '-0.125rem',
+    outlineOffset: '0.063rem',
     outlineColor: "var(".concat(_tokens.tokens.outlineFocusColor, ")"),
-    outlineRadius: 'calc(var(--plasma_private-outline-radius) + 0.063rem)',
+    outlineRadius: 'var(--border-radius-m , calc(var(--plasma_private-outline-radius) + 0.063rem))',
     customFocusRules: "\n            &.focus-visible:focus,\n            &[data-focus-visible-added] {\n                &::before {\n                    z-index: 1;\n                    outline: none;\n                    box-shadow: 0 0 0 0.063rem var(".concat(_tokens.tokens.outlineFocusColor, ");\n                }\n            }\n        ")
 }));

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js

@@ -74,7 +74,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 var StyledContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalTabItem.styles__StyledContent",
-    componentId: "sc-52a7e18d-0"
+    componentId: "sc-6dc77991-0"
 })([
     "display:inline-block;width:fit-content;padding:0 var(",
     ",var(",
@@ -82,7 +82,7 @@ var StyledContent = _styledcomponents.default.div.withConfig({
 ], _tokens.tokens.itemContentPaddingClear, _tokens.tokens.itemContentPadding);
 var TabItemValue = _styledcomponents.default.span.withConfig({
     displayName: "VerticalTabItem.styles__TabItemValue",
-    componentId: "sc-52a7e18d-1"
+    componentId: "sc-6dc77991-1"
 })([
     "white-space:nowrap;color:var(",
     ");font-family:var(",
@@ -101,19 +101,19 @@ var TabItemValue = _styledcomponents.default.span.withConfig({
 ], _tokens.tokens.itemValueColor, _tokens.tokens.valueFontFamily, _tokens.tokens.fontFamily, _tokens.tokens.valueFontSize, _tokens.tokens.fontSize, _tokens.tokens.valueFontStyle, _tokens.tokens.fontStyle, _tokens.tokens.valueFontWeight, _tokens.tokens.fontWeight, _tokens.tokens.valueLetterSpacing, _tokens.tokens.letterSpacing, _tokens.tokens.valueLineHeight, _tokens.tokens.lineHeight);
 var RightContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalTabItem.styles__RightContent",
-    componentId: "sc-52a7e18d-2"
+    componentId: "sc-6dc77991-2"
 })([
     "display:flex;color:inherit;&:hover{color:inherit;}"
 ]);
 var LeftContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalTabItem.styles__LeftContent",
-    componentId: "sc-52a7e18d-3"
+    componentId: "sc-6dc77991-3"
 })([
     "display:flex;color:inherit;&:hover{color:inherit;}"
 ]);
 var ActionContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalTabItem.styles__ActionContent",
-    componentId: "sc-52a7e18d-4"
+    componentId: "sc-6dc77991-4"
 })([
     "display:flex;margin-left:var(",
     ");"
@@ -130,8 +130,8 @@ var base = (0, _styledcomponents.css)([
     "{overflow:hidden;text-overflow:ellipsis;}}"
 ], _tokens.tokens.itemContentGap, _tokens.tokens.itemPaddingOrientationVertical, _tokens.tokens.itemCursorOverNotSelected, _tokens.tokens.itemCursor, (0, _mixins.addFocus)({
     outlineSize: '0.063rem',
-    outlineOffset: '-0.125rem',
+    outlineOffset: '0.063rem',
     outlineColor: "var(".concat(_tokens.tokens.outlineFocusColor, ")"),
-    outlineRadius: 'calc(var(--plasma_private-outline-radius) + 0.063rem)',
+    outlineRadius: 'var(--border-radius-m , calc(var(--plasma_private-outline-radius) + 0.063rem))',
     customFocusRules: "\n            &.focus-visible:focus,\n            &[data-focus-visible-added] {\n                &::before {\n                    z-index: 1;\n                    outline: none;\n                    box-shadow: 0 0 0 0.063rem var(".concat(_tokens.tokens.outlineFocusColor, ");\n                }\n            }\n        ")
 }), _tokens.classes.tabsTruncate, StyledContent, TabItemValue);

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.styles.js

@@ -71,22 +71,22 @@ var base = (0, _styledcomponents.css)([
 ]);
 var StyledContent = _styledcomponents.default.div.withConfig({
     displayName: "VerticalTabs.styles__StyledContent",
-    componentId: "sc-47b291a4-0"
+    componentId: "sc-785d61e-0"
 })([
     "display:inline-flex;flex-direction:column;align-items:flex-start;"
 ]);
 var StyledContentWrapper = _styledcomponents.default.div.withConfig({
     displayName: "VerticalTabs.styles__StyledContentWrapper",
-    componentId: "sc-47b291a4-1"
+    componentId: "sc-785d61e-1"
 })([
-    "padding:0.125rem 0.25rem;box-sizing:border-box;position:relative;height:100%;width:100%;display:flex;align-items:center;z-index:1;&.",
+    "box-sizing:border-box;position:relative;height:100%;width:100%;display:flex;align-items:center;z-index:1;&.",
     "{overflow:scroll;scrollbar-width:none;::-webkit-scrollbar{display:none;}",
     "{margin-top:auto;}}&.",
     "{overflow:visible;}"
 ], _tokens.classes.tabsClipScroll, StyledContent, _tokens.classes.tabsClipShowAll);
 var StyledArrow = _styledcomponents.default.button.withConfig({
     displayName: "VerticalTabs.styles__StyledArrow",
-    componentId: "sc-47b291a4-2"
+    componentId: "sc-785d61e-2"
 })([
     "display:flex;cursor:pointer;border:none;background-color:transparent;padding:0;outline:none;transform:rotate(90deg);",
     ";&[disabled]{cursor:not-allowed;}color:var(",
@@ -95,7 +95,7 @@ var StyledArrow = _styledcomponents.default.button.withConfig({
     ");}"
 ], (0, _mixins.addFocus)({
     outlineSize: '0.063rem',
-    outlineOffset: '-0.125rem',
+    outlineOffset: '0.063rem',
     outlineColor: "var(".concat(_tokens.tokens.outlineFocusColor, ")"),
     outlineRadius: 'calc(var(--plasma_private-outline-radius) - 0.063rem)'
 }), _tokens.tokens.arrowColor, _tokens.tokens.arrowColorHover, _tokens.tokens.arrowColorActive);

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabs/variations/_view/base.js

@@ -12,7 +12,7 @@ var _styledcomponents = require("styled-components");
 var _tokens = require("../../../../../tokens");
 var base = (0, _styledcomponents.css)([
     "background-color:var(",
-    ");&::after{content:'';position:absolute;top:0.125rem;bottom:0.125rem;left:0.25rem;background:var(",
+    ");&::after{content:'';position:absolute;top:0.125rem;bottom:0.125rem;left:0;background:var(",
     ");width:var(",
     ");border-radius:var(",
     ");}&.",

package/styled-components/cjs/examples/components/Combobox/Combobox.js

@@ -1 +1,16 @@
 "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Combobox", {
+    enumerable: true,
+    get: function() {
+        return Combobox;
+    }
+});
+var _engines = require("../../../engines");
+var _ = require("../../..");
+var _Comboboxconfig = require("./Combobox.config");
+var mergedConfig = (0, _engines.mergeConfig)(_.comboboxNewConfig, _Comboboxconfig.config);
+var ComboboxComponent = (0, _engines.component)(mergedConfig);
+var Combobox = ComboboxComponent;

package/styled-components/cjs/examples/components/LinkButton/LinkButton.config.js

@@ -25,8 +25,9 @@ var config = {
                 ":var(--surface-transparent-clear);",
                 ":var(--text-primary-hover);",
                 ":var(--text-primary-active);",
-                ":var(--surface-accent);"
-            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor),
+                ":var(--surface-accent);",
+                ":var(--text-primary-hover);"
+            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor, _LinkButton.linkButtonTokens.linkButtonTextColorHover),
             accent: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-accent);",
@@ -35,8 +36,9 @@ var config = {
                 ":var(---surface-transparent-clear);",
                 ":var(--text-accent-hover);",
                 ":var(--text-accent-active);",
-                ":var(--surface-accent);"
-            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor),
+                ":var(--surface-accent);",
+                ":var(--text-accent-hover);"
+            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor, _LinkButton.linkButtonTokens.linkButtonTextColorHover),
             secondary: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-secondary);",
@@ -45,8 +47,9 @@ var config = {
                 ":var(--surface-transparent-clear);",
                 ":var(--text-secondary-hover);",
                 ":var(--text-secondary-active);",
-                ":var(--surface-accent);"
-            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor),
+                ":var(--surface-accent);",
+                ":var(--text-secondary-hover);"
+            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor, _LinkButton.linkButtonTokens.linkButtonTextColorHover),
             positive: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-positive);",
@@ -55,8 +58,9 @@ var config = {
                 ":var(--surface-transparent-clear);",
                 ":var(--text-positive-hover);",
                 ":var(--text-positive-active);",
-                ":var(--surface-accent);"
-            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor),
+                ":var(--surface-accent);",
+                ":var(--text-positive-hover);"
+            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor, _LinkButton.linkButtonTokens.linkButtonTextColorHover),
             warning: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-warning);",
@@ -65,8 +69,9 @@ var config = {
                 ":var(--surface-transparent-clear);",
                 ":var(--text-warning-hover);",
                 ":var(--text-warning-active);",
-                ":var(--surface-accent);"
-            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor),
+                ":var(--surface-accent);",
+                ":var(--text-warning-hover);"
+            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor, _LinkButton.linkButtonTokens.linkButtonTextColorHover),
             negative: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-negative);",
@@ -75,8 +80,9 @@ var config = {
                 ":var(--surface-transparent-clear);",
                 ":var(--text-negative-hover);",
                 ":var(--text-negative-active);",
-                ":var(--surface-accent);"
-            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor)
+                ":var(--surface-accent);",
+                ":var(--text-negative-hover);"
+            ], _LinkButton.linkButtonTokens.linkButtonColor, _LinkButton.linkButtonTokens.linkButtonIconColor, _LinkButton.linkButtonTokens.linkButtonTextColor, _LinkButton.linkButtonTokens.linkButtonBackgroundColor, _LinkButton.linkButtonTokens.linkButtonColorHover, _LinkButton.linkButtonTokens.linkButtonColorActive, _LinkButton.linkButtonTokens.linkButtonFocusColor, _LinkButton.linkButtonTokens.linkButtonTextColorHover)
         },
         size: {
             xl: (0, _styledcomponents.css)([

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

@@ -12,7 +12,7 @@ var _styledcomponents = require("styled-components");
 var _Tabs = require("../../../../components/Tabs");
 var config = {
     defaults: {
-        view: 'default',
+        view: 'divider',
         size: 'xs'
     },
     variations: {
@@ -34,14 +34,12 @@ var config = {
                 ":var(--text-secondary);",
                 ":transparent;",
                 ":background-color 0.3s ease-in-out;",
-                ":0;",
-                ":0;",
                 ":var(--surface-accent);",
                 ":0rem;",
                 ":var(--text-primary);",
                 ":var(--text-primary);",
                 ":pointer;"
-            ], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover, _Tabs.tabsTokens.itemCursor),
+            ], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover, _Tabs.tabsTokens.itemCursor),
             secondary: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-primary);",
@@ -83,14 +81,12 @@ var config = {
                 ":var(--text-secondary);",
                 ":transparent;",
                 ":background-color 0.3s ease-in-out;",
-                ":0;",
-                ":0;",
                 ":var(--surface-accent);",
                 ":0.125rem;",
                 ":var(--text-primary);",
                 ":var(--text-primary);",
                 ":pointer;"
-            ], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.itemPaddingClear, _Tabs.tabsTokens.itemContentPaddingClear, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover, _Tabs.tabsTokens.itemCursor),
+            ], _Tabs.tabsTokens.itemColor, _Tabs.tabsTokens.itemValueColor, _Tabs.tabsTokens.itemBackgroundColor, _Tabs.tabsTokens.itemColorHover, _Tabs.tabsTokens.itemValueColorHover, _Tabs.tabsTokens.itemColorActive, _Tabs.tabsTokens.itemValueColorActive, _Tabs.tabsTokens.itemBackgroundColorHover, _Tabs.tabsTokens.itemSelectedColor, _Tabs.tabsTokens.itemSelectedValueColor, _Tabs.tabsTokens.itemSelectedBackgroundColor, _Tabs.tabsTokens.itemSelectedColorHover, _Tabs.tabsTokens.itemSelectedValueColorHover, _Tabs.tabsTokens.itemSelectedBackgroundColorHover, _Tabs.tabsTokens.itemBackgroundTransition, _Tabs.tabsTokens.outlineFocusColor, _Tabs.tabsTokens.itemSelectedDividerHeight, _Tabs.tabsTokens.itemSelectedDividerColor, _Tabs.tabsTokens.itemSelectedDividerColorHover, _Tabs.tabsTokens.itemCursor),
             default: (0, _styledcomponents.css)([
                 "",
                 ":var(--text-primary);",
@@ -122,9 +118,9 @@ var config = {
                 ":0.375rem;",
                 ":auto;",
                 ":2rem;",
-                ":0 0.5rem;",
+                ":0 0.125rem;",
                 ":0 0.375rem;",
-                ":1.75rem;",
+                ":1.5rem;",
                 ":0.25rem;",
                 ":0.125rem;",
                 ":var(--plasma-typo-body-xs-font-family);",
@@ -140,9 +136,9 @@ var config = {
                 ":0.5rem;",
                 ":auto;",
                 ":2.5rem;",
-                ":0 0.625rem;",
+                ":0 0.125rem;",
                 ":0 0.5rem;",
-                ":1.75rem;",
+                ":1.5rem;",
                 ":0.25rem;",
                 ":0.125rem;",
                 ":var(--plasma-typo-body-s-font-family);",
@@ -158,9 +154,9 @@ var config = {
                 ":0.625rem;",
                 ":auto;",
                 ":3rem;",
-                ":0 0.625rem;",
+                ":0 0.125rem;",
                 ":0 0.5rem;",
-                ":1.75rem;",
+                ":1.5rem;",
                 ":0.375rem;",
                 ":0.125rem;",
                 ":var(--plasma-typo-body-m-font-family);",
@@ -176,9 +172,9 @@ var config = {
                 ":0.75rem;",
                 ":auto;",
                 ":3.5rem;",
-                ":0 0.875rem;",
+                ":0 0.125rem;",
                 ":0 0.75rem;",
-                ":1.75rem;",
+                ":1.5rem;",
                 ":0.5rem;",
                 ":0.125rem;",
                 ":var(--plasma-typo-body-l-font-family);",
@@ -194,8 +190,8 @@ var config = {
                 ":0.375rem;",
                 ":auto;",
                 ":3rem;",
-                ":0rem;",
-                ":1.75rem;",
+                ":0 0.125rem;",
+                ":1.5rem;",
                 ":0.625rem;",
                 ":var(--plasma-typo-h5-font-family);",
                 ":var(--plasma-typo-h5-font-size);",
@@ -210,8 +206,8 @@ var config = {
                 ":0.375rem;",
                 ":auto;",
                 ":3.25rem;",
-                ":0rem;",
-                ":2rem;",
+                ":0 0.125rem;",
+                ":1.75rem;",
                 ":0.625rem;",
                 ":var(--plasma-typo-h4-font-family);",
                 ":var(--plasma-typo-h4-font-size);",
@@ -226,8 +222,8 @@ var config = {
                 ":0.5rem;",
                 ":auto;",
                 ":3.875rem;",
-                ":0rem;",
-                ":2.25rem;",
+                ":0 0.125rem;",
+                ":2rem;",
                 ":0.75rem;",
                 ":var(--plasma-typo-h3-font-family);",
                 ":var(--plasma-typo-h3-font-size);",
@@ -242,8 +238,8 @@ var config = {
                 ":0.625rem;",
                 ":auto;",
                 ":4.5rem;",
-                ":0rem;",
-                ":2.5rem;",
+                ":0 0.125rem;",
+                ":2.25rem;",
                 ":0.875rem;",
                 ":var(--plasma-typo-h2-font-family);",
                 ":var(--plasma-typo-h2-font-size);",
@@ -258,8 +254,8 @@ var config = {
                 ":0.75rem;",
                 ":auto;",
                 ":5.75rem;",
-                ":0rem;",
-                ":3.5rem;",
+                ":0 0.125rem;",
+                ":3.25rem;",
                 ":1rem;",
                 ":var(--plasma-typo-h1-font-family);",
                 ":var(--plasma-typo-h1-font-size);",

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

@@ -17,14 +17,14 @@ export var base = css([
 }));
 export var StyledAdditionalContent = styled.div.withConfig({
     displayName: "LinkButton.styles__StyledAdditionalContent",
-    componentId: "sc-b0f8868c-0"
+    componentId: "sc-2c073fa1-0"
 })([
     "display:flex;align-items:center;margin:var(",
     ");"
 ], tokens.linkButtonAdditionalContentMargin);
 export var LoadWrap = styled.div.withConfig({
     displayName: "LinkButton.styles__LoadWrap",
-    componentId: "sc-b0f8868c-1"
+    componentId: "sc-2c073fa1-1"
 })([
     "opacity:",
     ";display:flex;align-items:inherit;justify-content:inherit;height:100%;width:100%;"
@@ -34,13 +34,13 @@ export var LoadWrap = styled.div.withConfig({
 });
 export var Loader = styled.div.withConfig({
     displayName: "LinkButton.styles__Loader",
-    componentId: "sc-b0f8868c-2"
+    componentId: "sc-2c073fa1-2"
 })([
     "position:absolute;"
 ]);
 export var StyledSpinner = styled(Spinner).withConfig({
     displayName: "LinkButton.styles__StyledSpinner",
-    componentId: "sc-b0f8868c-3"
+    componentId: "sc-2c073fa1-3"
 })([
     "",
     ":var(",
@@ -50,16 +50,17 @@ export var StyledSpinner = styled(Spinner).withConfig({
 ], spinnerTokens.size, tokens.linkButtonSpinnerSize, spinnerTokens.color, tokens.linkButtonSpinnerColor);
 export var LinkButtonText = styled.span.withConfig({
     displayName: "LinkButton.styles__LinkButtonText",
-    componentId: "sc-b0f8868c-4"
+    componentId: "sc-2c073fa1-4"
 })([
     "padding:var(",
     ");color:var(",
     ");",
-    ""
-], tokens.linkButtonTextPadding, tokens.linkButtonTextColor, applyEllipsis());
+    " &:hover{color:var(",
+    ");}"
+], tokens.linkButtonTextPadding, tokens.linkButtonTextColor, applyEllipsis(), tokens.linkButtonTextColorHover);
 export var StyledContentLeft = styled.div.withConfig({
     displayName: "LinkButton.styles__StyledContentLeft",
-    componentId: "sc-b0f8868c-5"
+    componentId: "sc-2c073fa1-5"
 })([
     "line-height:0;color:var(",
     ");margin:var(",
@@ -67,7 +68,7 @@ export var StyledContentLeft = styled.div.withConfig({
 ], tokens.linkButtonIconColor, tokens.linkButtonLeftContentMargin);
 export var StyledContentRight = styled.div.withConfig({
     displayName: "LinkButton.styles__StyledContentRight",
-    componentId: "sc-b0f8868c-6"
+    componentId: "sc-2c073fa1-6"
 })([
     "line-height:0;color:var(",
     ");margin:var(",

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

@@ -5,6 +5,7 @@ export var tokens = {
     linkButtonBackgroundColor: '--plasma-link-button-background-color',
     linkButtonColorHover: '--plasma-link-button-color-hover',
     linkButtonColorActive: '--plasma-link-button-color-active',
+    linkButtonTextColorHover: '--plasma-link-button-text-color-hover',
     linkButtonPadding: '--plasma-link-button-padding',
     linkButtonHeight: '--plasma-link-button-height',
     linkButtonWidth: '--plasma-link-button-width',

package/styled-components/es/components/Tabs/ui/horizontal/HorizontalIconTabItem/HorizontalIconTabItem.styles.js

@@ -4,13 +4,13 @@ import { addFocus } from "../../../../../mixins";
 import { tokens } from "../../../tokens";
 export var StyledContent = styled.div.withConfig({
     displayName: "HorizontalIconTabItem.styles__StyledContent",
-    componentId: "sc-d0381a92-0"
+    componentId: "sc-31eb40a5-0"
 })([
     "display:inline-block;width:fit-content;"
 ]);
 export var ActionContent = styled.div.withConfig({
     displayName: "HorizontalIconTabItem.styles__ActionContent",
-    componentId: "sc-d0381a92-1"
+    componentId: "sc-31eb40a5-1"
 })([
     "display:flex;margin-left:var(",
     ");"
@@ -23,8 +23,8 @@ export var base = css([
     ";"
 ], tokens.itemContentGap, tokens.itemCursorOverNotSelected, tokens.itemCursor, addFocus({
     outlineSize: '0.063rem',
-    outlineOffset: '-0.125rem',
+    outlineOffset: '0.063rem',
     outlineColor: "var(".concat(tokens.outlineFocusColor, ")"),
-    outlineRadius: 'calc(var(--plasma_private-outline-radius) + 0.063rem)',
+    outlineRadius: 'var(--border-radius-m , calc(var(--plasma_private-outline-radius) + 0.063rem))',
     customFocusRules: "\n            &.focus-visible:focus,\n            &[data-focus-visible-added] {\n                &::before {\n                    z-index: 1;\n                    outline: none;\n                    box-shadow: 0 0 0 0.063rem var(".concat(tokens.outlineFocusColor, ");\n                }\n            }\n        ")
 }));

package/styled-components/es/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.styles.js

@@ -4,7 +4,7 @@ import { addFocus } from "../../../../../mixins";
 import { classes, tokens } from "../../../tokens";
 export var StyledContent = styled.div.withConfig({
     displayName: "HorizontalTabItem.styles__StyledContent",
-    componentId: "sc-6029f576-0"
+    componentId: "sc-e31694f-0"
 })([
     "display:inline-block;width:fit-content;padding:0 var(",
     ",var(",
@@ -12,7 +12,7 @@ export var StyledContent = styled.div.withConfig({
 ], tokens.itemContentPaddingClear, tokens.itemContentPadding);
 export var TabItemValue = styled.span.withConfig({
     displayName: "HorizontalTabItem.styles__TabItemValue",
-    componentId: "sc-6029f576-1"
+    componentId: "sc-e31694f-1"
 })([
     "color:var(",
     ");font-family:var(",
@@ -31,19 +31,19 @@ export var TabItemValue = styled.span.withConfig({
 ], tokens.itemValueColor, tokens.valueFontFamily, tokens.fontFamily, tokens.valueFontSize, tokens.fontSize, tokens.valueFontStyle, tokens.fontStyle, tokens.valueFontWeight, tokens.fontWeight, tokens.valueLetterSpacing, tokens.letterSpacing, tokens.valueLineHeight, tokens.lineHeight);
 export var RightContent = styled.div.withConfig({
     displayName: "HorizontalTabItem.styles__RightContent",
-    componentId: "sc-6029f576-2"
+    componentId: "sc-e31694f-2"
 })([
     "display:flex;color:inherit;&:hover{color:inherit;}"
 ]);
 export var LeftContent = styled.div.withConfig({
     displayName: "HorizontalTabItem.styles__LeftContent",
-    componentId: "sc-6029f576-3"
+    componentId: "sc-e31694f-3"
 })([
     "display:flex;color:inherit;&:hover{color:inherit;}"
 ]);
 export var ActionContent = styled.div.withConfig({
     displayName: "HorizontalTabItem.styles__ActionContent",
-    componentId: "sc-6029f576-4"
+    componentId: "sc-e31694f-4"
 })([
     "display:flex;margin-left:var(",
     ");"
@@ -61,8 +61,8 @@ export var base = css([
     "{overflow:hidden;text-overflow:ellipsis;}}"
 ], tokens.itemContentGap, tokens.itemPaddingClear, tokens.itemPadding, tokens.itemCursorOverNotSelected, tokens.itemCursor, addFocus({
     outlineSize: '0.063rem',
-    outlineOffset: '-0.125rem',
+    outlineOffset: '0.063rem',
     outlineColor: "var(".concat(tokens.outlineFocusColor, ")"),
-    outlineRadius: 'calc(var(--plasma_private-outline-radius) + 0.063rem)',
+    outlineRadius: 'var(--border-radius-m , calc(var(--plasma_private-outline-radius) + 0.063rem))',
     customFocusRules: "\n            &.focus-visible:focus,\n            &[data-focus-visible-added] {\n                &::before {\n                    z-index: 1;\n                    outline: none;\n                    box-shadow: 0 0 0 0.063rem var(".concat(tokens.outlineFocusColor, ");\n                }\n            }\n        ")
 }), classes.tabsTruncate, StyledContent, TabItemValue);

package/styled-components/es/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.styles.js

@@ -7,21 +7,21 @@ export var base = css([
 ]);
 export var StyledContent = styled.div.withConfig({
     displayName: "HorizontalTabs.styles__StyledContent",
-    componentId: "sc-93ada113-0"
+    componentId: "sc-e818e527-0"
 })([
     "display:inline-flex;flex-direction:row;align-items:center;"
 ]);
 export var StyledContentWrapper = styled.div.withConfig({
     displayName: "HorizontalTabs.styles__StyledContentWrapper",
-    componentId: "sc-93ada113-1"
+    componentId: "sc-e818e527-1"
 })([
-    "margin:-0.125rem;padding:0.25rem;box-sizing:content-box;position:relative;height:100%;width:100%;display:flex;align-items:center;z-index:1;&.",
+    "box-sizing:content-box;position:relative;height:100%;width:100%;display:flex;align-items:center;z-index:1;&.",
     "{overflow:scroll;scrollbar-width:none;::-webkit-scrollbar{display:none;}}&.",
     "{overflow:visible;}"
 ], classes.tabsClipScroll, classes.tabsClipShowAll);
 export var StyledArrow = styled.button.withConfig({
     displayName: "HorizontalTabs.styles__StyledArrow",
-    componentId: "sc-93ada113-2"
+    componentId: "sc-e818e527-2"
 })([
     "display:flex;cursor:pointer;border:none;background-color:transparent;padding:0;outline:none;",
     ";&[disabled]{cursor:not-allowed;}--plasma_private-outer-padding:",

package/styled-components/es/components/Tabs/ui/horizontal/HorizontalTabs/variations/_view/base.js

@@ -2,7 +2,7 @@ import { css } from "styled-components";
 import { classes, tokens } from "../../../../../tokens";
 export var base = css([
     "background-color:var(",
-    ");&::after{content:'';position:absolute;bottom:0.125rem;left:0.125rem;right:0.125rem;background:var(",
+    ");&::after{content:'';position:absolute;bottom:0;left:0.125rem;right:0.125rem;background:var(",
     ");height:var(",
     ");border-radius:var(",
     ");}&.",

package/styled-components/es/components/Tabs/ui/vertical/VerticalIconTabItem/VerticalIconTabItem.styles.js

@@ -4,13 +4,13 @@ import { addFocus } from "../../../../../mixins";
 import { tokens } from "../../../tokens";
 export var StyledContent = styled.div.withConfig({
     displayName: "VerticalIconTabItem.styles__StyledContent",
-    componentId: "sc-4febd5c6-0"
+    componentId: "sc-7bdf76f9-0"
 })([
     "display:inline-block;width:fit-content;"
 ]);
 export var ActionContent = styled.div.withConfig({
     displayName: "VerticalIconTabItem.styles__ActionContent",
-    componentId: "sc-4febd5c6-1"
+    componentId: "sc-7bdf76f9-1"
 })([
     "display:flex;margin-left:var(",
     ");"
@@ -23,8 +23,8 @@ export var base = css([
     ";"
 ], tokens.itemContentGap, tokens.itemCursorOverNotSelected, tokens.itemCursor, addFocus({
     outlineSize: '0.063rem',
-    outlineOffset: '-0.125rem',
+    outlineOffset: '0.063rem',
     outlineColor: "var(".concat(tokens.outlineFocusColor, ")"),
-    outlineRadius: 'calc(var(--plasma_private-outline-radius) + 0.063rem)',
+    outlineRadius: 'var(--border-radius-m , calc(var(--plasma_private-outline-radius) + 0.063rem))',
     customFocusRules: "\n            &.focus-visible:focus,\n            &[data-focus-visible-added] {\n                &::before {\n                    z-index: 1;\n                    outline: none;\n                    box-shadow: 0 0 0 0.063rem var(".concat(tokens.outlineFocusColor, ");\n                }\n            }\n        ")
 }));