@salutejs/sdds-platform-ai 0.356.0-next-sbcom.0 → 0.357.0-dev.0

package/dist/styled-components/cjs/components/Tabs/horizontal/HorizontalIconTabItem.config.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _sdds_platform_ai = require("@salutejs/sdds-themes/tokens/sdds_platform_ai");
 const config = {
     defaults: {
         view: 'divider',
@@ -17,40 +18,40 @@ const config = {
     variations: {
         view: {
             clear: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemColor}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemColor}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.itemColorActive}: var(--text-secondary-active);
+                ${_styledcomponents.tabsTokens.itemColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.itemColorActive}: ${_sdds_platform_ai.textSecondaryActive};
                 ${_styledcomponents.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColor}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedColor}: ${_sdds_platform_ai.textPrimary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: ${_sdds_platform_ai.textPrimary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_styledcomponents.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.itemSelectedDividerHeight}: 0;
 
                 ${_styledcomponents.tabsTokens.itemCursor}: pointer;
             `,
             divider: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemColor}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemColor}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.itemColorActive}: var(--text-secondary-active);
+                ${_styledcomponents.tabsTokens.itemColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.itemColorActive}: ${_sdds_platform_ai.textSecondaryActive};
                 ${_styledcomponents.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColor}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedColor}: ${_sdds_platform_ai.textPrimary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: ${_sdds_platform_ai.textPrimary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_styledcomponents.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.itemSelectedDividerHeight}: 0.125rem;
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_platform_ai.textPrimary};
 
                 ${_styledcomponents.tabsTokens.itemCursor}: pointer;
             `
@@ -63,12 +64,12 @@ const config = {
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.25rem;
             `,
-            h6: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.375rem;
-                ${_styledcomponents.tabsTokens.itemPadding}: 0rem;
-                ${_styledcomponents.tabsTokens.itemContentGap}: 0.625rem;
+            s: (0, _styledcomponents.css)`
+                ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.5rem;
+                ${_styledcomponents.tabsTokens.itemPadding}: 0.5rem 0.625rem;
+                ${_styledcomponents.tabsTokens.itemContentGap}: 0.25rem;
 
-                ${_styledcomponents.tabsTokens.actionContentMarginLeft}: -0.125rem;
+                ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.125rem;
             `,
             h5: (0, _styledcomponents.css)`
                 ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.375rem;

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

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _sdds_platform_ai = require("@salutejs/sdds-themes/tokens/sdds_platform_ai");
 const config = {
     defaults: {
         view: 'divider',
@@ -17,52 +18,52 @@ const config = {
     variations: {
         view: {
             clear: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.itemValueColor}: var(--text-tertiary);
+                ${_styledcomponents.tabsTokens.itemColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.itemValueColor}: ${_sdds_platform_ai.textTertiary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.itemColorActive}: var(--text-secondary-active);
-                ${_styledcomponents.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.itemValueColorHover}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.itemColorActive}: ${_sdds_platform_ai.textSecondaryActive};
+                ${_styledcomponents.tabsTokens.itemValueColorActive}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedValueColor}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemSelectedColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedValueColor}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedValueColorHover}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedValueColorHover}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_styledcomponents.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.itemSelectedDividerHeight}: 0rem;
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_platform_ai.textPrimary};
 
                 ${_styledcomponents.tabsTokens.itemCursor}: pointer;
             `,
             divider: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.itemValueColor}: var(--text-tertiary);
+                ${_styledcomponents.tabsTokens.itemColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.itemValueColor}: ${_sdds_platform_ai.textTertiary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.itemColorActive}: var(--text-secondary-active);
-                ${_styledcomponents.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.itemValueColorHover}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.itemColorActive}: ${_sdds_platform_ai.textSecondaryActive};
+                ${_styledcomponents.tabsTokens.itemValueColorActive}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedValueColor}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemSelectedColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedValueColor}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedValueColorHover}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedValueColorHover}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_styledcomponents.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.itemSelectedDividerHeight}: 0.125rem;
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_platform_ai.textPrimary};
 
                 ${_styledcomponents.tabsTokens.itemCursor}: pointer;
             `
@@ -78,31 +79,33 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemContentGap}: 0.375rem;
                 ${_styledcomponents.tabsTokens.itemContentPadding}: 0.125rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-body-m-bold-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.bodyM.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.bodyM.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.bodyM.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.bodyMBold.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.bodyM.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.bodyM.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.25rem;
             `,
-            h6: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.375rem;
+            s: (0, _styledcomponents.css)`
+                ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.5rem;
                 ${_styledcomponents.tabsTokens.itemWidth}: auto;
-                ${_styledcomponents.tabsTokens.itemHeight}: 3rem;
+                ${_styledcomponents.tabsTokens.itemHeight}: 2.5rem;
                 ${_styledcomponents.tabsTokens.itemPadding}: 0 0.125rem;
+                ${_styledcomponents.tabsTokens.itemPaddingPilled}: 0 0.5rem;
                 ${_styledcomponents.tabsTokens.itemMarginLeft}: 1.5rem;
-                ${_styledcomponents.tabsTokens.itemContentGap}: 0.625rem;
+                ${_styledcomponents.tabsTokens.itemContentGap}: 0.25rem;
+                ${_styledcomponents.tabsTokens.itemContentPadding}: 0.125rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-h6-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-h6-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-h6-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-h6-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-h6-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-h6-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.bodyS.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.bodyS.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.bodyS.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.bodySBold.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.bodyS.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.bodyS.lineHeight};
 
-                ${_styledcomponents.tabsTokens.actionContentMarginLeft}: -0.125rem;
+                ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.125rem;
             `,
             h5: (0, _styledcomponents.css)`
                 ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.375rem;
@@ -112,12 +115,12 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemMarginLeft}: 1.5rem;
                 ${_styledcomponents.tabsTokens.itemContentGap}: 0.625rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-h5-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-h5-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-h5-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-h5-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-h5-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-h5-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.h5.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.h5.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.h5.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.h5.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.h5.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.h5.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: -0.125rem;
             `,
@@ -129,12 +132,12 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemMarginLeft}: 1.75rem;
                 ${_styledcomponents.tabsTokens.itemContentGap}: 0.625rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-h4-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-h4-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-h4-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-h4-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-h4-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-h4-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.h4.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.h4.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.h4.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.h4.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.h4.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.h4.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: -0.125rem;
             `,
@@ -146,12 +149,12 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemMarginLeft}: 2rem;
                 ${_styledcomponents.tabsTokens.itemContentGap}: 0.75rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-h3-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-h3-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-h3-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-h3-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-h3-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-h3-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.h3.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.h3.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.h3.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.h3.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.h3.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.h3.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: -0.125rem;
             `,
@@ -163,12 +166,12 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemMarginLeft}: 2.25rem;
                 ${_styledcomponents.tabsTokens.itemContentGap}: 0.875rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-h2-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-h2-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-h2-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-h2-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-h2-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-h2-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.h2.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.h2.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.h2.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.h2.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.h2.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.h2.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: -0.125rem;
             `,
@@ -180,12 +183,12 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemMarginLeft}: 3.25rem;
                 ${_styledcomponents.tabsTokens.itemContentGap}: 1rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-h1-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-h1-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-h1-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-h1-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-h1-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-h1-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.h1.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.h1.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.h1.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.h1.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.h1.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.h1.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0;
             `

package/dist/styled-components/cjs/components/Tabs/horizontal/HorizontalTabs.config.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _sdds_platform_ai = require("@salutejs/sdds-themes/tokens/sdds_platform_ai");
 const config = {
     defaults: {
         view: 'filled',
@@ -17,36 +18,36 @@ const config = {
     variations: {
         view: {
             clear: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.arrowColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.arrowColorActive}: var(---text-secondary-active);
+                ${_styledcomponents.tabsTokens.arrowColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.arrowColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.arrowColorActive}: ${_sdds_platform_ai.textSecondaryActive};
                 ${_styledcomponents.tabsTokens.tabsBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.tabsDividerHeight}: 0rem;
                 ${_styledcomponents.tabsTokens.tabsDividerColor}: transparent;
                 ${_styledcomponents.tabsTokens.tabsDividerBorderRadius}: 0rem;
             `,
             filled: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.arrowColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.arrowColorActive}: var(---text-secondary-active);
-                ${_styledcomponents.tabsTokens.tabsBackgroundColor}: var(--surface-transparent-primary);
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.arrowColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.arrowColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.arrowColorActive}: ${_sdds_platform_ai.textSecondaryActive};
+                ${_styledcomponents.tabsTokens.tabsBackgroundColor}: ${_sdds_platform_ai.surfaceTransparentPrimary};
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.tabsDividerHeight}: 0rem;
                 ${_styledcomponents.tabsTokens.tabsDividerColor}: transparent;
                 ${_styledcomponents.tabsTokens.tabsDividerBorderRadius}: 0rem;
             `,
             divider: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.arrowColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.arrowColorActive}: var(---text-secondary-active);
+                ${_styledcomponents.tabsTokens.arrowColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.arrowColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.arrowColorActive}: ${_sdds_platform_ai.textSecondaryActive};
                 ${_styledcomponents.tabsTokens.tabsBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.tabsDividerHeight}: 0.0625rem;
-                ${_styledcomponents.tabsTokens.tabsDividerColor}: var(--surface-transparent-tertiary);
+                ${_styledcomponents.tabsTokens.tabsDividerColor}: ${_sdds_platform_ai.surfaceTransparentTertiary};
                 ${_styledcomponents.tabsTokens.tabsDividerBorderRadius}: 0.0625rem;
             `
         },

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

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _sdds_platform_ai = require("@salutejs/sdds-themes/tokens/sdds_platform_ai");
 const config = {
     defaults: {
         view: 'divider',
@@ -17,22 +18,22 @@ const config = {
     variations: {
         view: {
             divider: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemColor}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemColor}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.itemColorActive}: var(--text-secondary-active);
+                ${_styledcomponents.tabsTokens.itemColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.itemColorActive}: ${_sdds_platform_ai.textSecondaryActive};
                 ${_styledcomponents.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColor}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedColor}: ${_sdds_platform_ai.textPrimary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: ${_sdds_platform_ai.textPrimary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_styledcomponents.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.itemSelectedDividerWidth}: 0.125rem;
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_platform_ai.textPrimary};
 
                 ${_styledcomponents.tabsTokens.itemCursor}: pointer;
             `
@@ -45,6 +46,14 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemContentPadding}: 0.125rem;
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.125rem;
+            `,
+            s: (0, _styledcomponents.css)`
+                ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.5rem;
+                ${_styledcomponents.tabsTokens.itemPaddingOrientationVertical}: 0.5rem 0.625rem;
+                ${_styledcomponents.tabsTokens.itemContentGap}: 0.25rem;
+                ${_styledcomponents.tabsTokens.itemContentPadding}: 0.125rem;
+
+                ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.25rem;
             `
         },
         disabled: {

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

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _sdds_platform_ai = require("@salutejs/sdds-themes/tokens/sdds_platform_ai");
 const config = {
     defaults: {
         view: 'divider',
@@ -17,31 +18,31 @@ const config = {
     variations: {
         view: {
             divider: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.itemColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.itemValueColor}: var(--text-tertiary);
+                ${_styledcomponents.tabsTokens.itemColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.itemValueColor}: ${_sdds_platform_ai.textTertiary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.itemColorActive}: var(--text-secondary-active);
-                ${_styledcomponents.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.itemValueColorHover}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.itemColorActive}: ${_sdds_platform_ai.textSecondaryActive};
+                ${_styledcomponents.tabsTokens.itemValueColorActive}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedValueColor}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemSelectedColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedValueColor}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedValueColorHover}: var(--text-secondary);
+                ${_styledcomponents.tabsTokens.itemSelectedColorHover}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedValueColorHover}: ${_sdds_platform_ai.textSecondary};
                 ${_styledcomponents.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_styledcomponents.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
                 ${_styledcomponents.tabsTokens.itemPaddingClear}: 0;
                 ${_styledcomponents.tabsTokens.itemContentPaddingClear}: 0;
 
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.itemSelectedDividerWidth}: 0.125rem;
                 ${_styledcomponents.tabsTokens.itemSelectedDividerHeight}: 0.125rem;
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: var(--text-primary);
-                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: var(--text-primary);
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColor}: ${_sdds_platform_ai.textPrimary};
+                ${_styledcomponents.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_platform_ai.textPrimary};
 
                 ${_styledcomponents.tabsTokens.itemCursor}: pointer;
             `
@@ -58,14 +59,34 @@ const config = {
                 ${_styledcomponents.tabsTokens.itemContentGap}: 0.375rem;
                 ${_styledcomponents.tabsTokens.itemContentPadding}: 0.125rem;
 
-                ${_styledcomponents.tabsTokens.fontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.tabsTokens.fontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.tabsTokens.fontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.tabsTokens.fontWeight}: var(--plasma-typo-body-m-bold-font-weight);
-                ${_styledcomponents.tabsTokens.letterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.tabsTokens.lineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.bodyM.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.bodyM.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.bodyM.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.bodyMBold.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.bodyM.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.bodyM.lineHeight};
 
                 ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.125rem;
+            `,
+            s: (0, _styledcomponents.css)`
+                ${_styledcomponents.tabsTokens.itemBorderRadius}: 0.5rem;
+                ${_styledcomponents.tabsTokens.itemWidth}: auto;
+                ${_styledcomponents.tabsTokens.itemHeight}: 2.5rem;
+                ${_styledcomponents.tabsTokens.itemPadding}: 0 0.625rem;
+                ${_styledcomponents.tabsTokens.itemPaddingPilled}: 0 0.5rem;
+                ${_styledcomponents.tabsTokens.itemPaddingOrientationVertical}: 0.5rem 1rem;
+                ${_styledcomponents.tabsTokens.itemMarginLeft}: 0.75rem;
+                ${_styledcomponents.tabsTokens.itemContentGap}: 0.25rem;
+                ${_styledcomponents.tabsTokens.itemContentPadding}: 0.125rem;
+
+                ${_styledcomponents.tabsTokens.fontFamily}: ${_sdds_platform_ai.bodyS.fontFamily};
+                ${_styledcomponents.tabsTokens.fontSize}: ${_sdds_platform_ai.bodyS.fontSize};
+                ${_styledcomponents.tabsTokens.fontStyle}: ${_sdds_platform_ai.bodyS.fontStyle};
+                ${_styledcomponents.tabsTokens.fontWeight}: ${_sdds_platform_ai.bodySBold.fontWeight};
+                ${_styledcomponents.tabsTokens.letterSpacing}: ${_sdds_platform_ai.bodyS.letterSpacing};
+                ${_styledcomponents.tabsTokens.lineHeight}: ${_sdds_platform_ai.bodyS.lineHeight};
+
+                ${_styledcomponents.tabsTokens.actionContentMarginLeft}: 0.25rem;
             `
         },
         disabled: {

package/dist/styled-components/cjs/components/Tabs/vertical/VerticalTabs.config.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _sdds_platform_ai = require("@salutejs/sdds-themes/tokens/sdds_platform_ai");
 const config = {
     defaults: {
         view: 'divider',
@@ -17,15 +18,15 @@ const config = {
     variations: {
         view: {
             divider: (0, _styledcomponents.css)`
-                ${_styledcomponents.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_styledcomponents.tabsTokens.arrowColorHover}: var(--text-secondary-hover);
-                ${_styledcomponents.tabsTokens.arrowColorActive}: var(---text-secondary-active);
+                ${_styledcomponents.tabsTokens.arrowColor}: ${_sdds_platform_ai.textSecondary};
+                ${_styledcomponents.tabsTokens.arrowColorHover}: ${_sdds_platform_ai.textSecondaryHover};
+                ${_styledcomponents.tabsTokens.arrowColorActive}: ${_sdds_platform_ai.textSecondaryActive};
                 ${_styledcomponents.tabsTokens.tabsBackgroundColor}: transparent;
-                ${_styledcomponents.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_styledcomponents.tabsTokens.outlineFocusColor}: ${_sdds_platform_ai.surfaceAccent};
 
                 ${_styledcomponents.tabsTokens.tabsDividerWidth}: 0.0625rem;
                 ${_styledcomponents.tabsTokens.tabsDividerHeight}: 0.0625rem;
-                ${_styledcomponents.tabsTokens.tabsDividerColor}: var(--surface-transparent-tertiary);
+                ${_styledcomponents.tabsTokens.tabsDividerColor}: ${_sdds_platform_ai.surfaceTransparentTertiary};
                 ${_styledcomponents.tabsTokens.tabsDividerBorderRadius}: 0.0625rem;
             `
         },