@salutejs/sdds-cs 0.361.0-next-sbcom.0 → 0.362.0-dev.0

package/dist/emotion/cjs/components/Table/Table.config.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "config", {
         return config;
     }
 });
+const _sdds_cs = require("@salutejs/sdds-themes/tokens/sdds_cs");
 const _emotion = require("@salutejs/plasma-new-hope/emotion");
 const config = {
     defaults: {
@@ -25,12 +26,12 @@ const config = {
         },
         size: {
             l: (0, _emotion.css)`
-                ${_emotion.tableTokens.fontFamily}: var(--plasma-typo-body-l-font-family);
-                ${_emotion.tableTokens.fontSize}: var(--plasma-typo-body-l-font-size);
-                ${_emotion.tableTokens.fontStyle}: var(--plasma-typo-body-l-font-style);
-                ${_emotion.tableTokens.fontWeight}: var(--plasma-typo-body-l-font-weight);
-                ${_emotion.tableTokens.letterSpacing}: var(--plasma-typo-body-l-letter-spacing);
-                ${_emotion.tableTokens.lineHeight}: var(--plasma-typo-body-l-line-height);
+                ${_emotion.tableTokens.fontFamily}: ${_sdds_cs.bodyL.fontFamily};
+                ${_emotion.tableTokens.fontSize}: ${_sdds_cs.bodyL.fontSize};
+                ${_emotion.tableTokens.fontStyle}: ${_sdds_cs.bodyL.fontStyle};
+                ${_emotion.tableTokens.fontWeight}: ${_sdds_cs.bodyL.fontWeight};
+                ${_emotion.tableTokens.letterSpacing}: ${_sdds_cs.bodyL.letterSpacing};
+                ${_emotion.tableTokens.lineHeight}: ${_sdds_cs.bodyL.lineHeight};
 
                 ${_emotion.tableTokens.headerRowHeight}: 3.125rem;
                 ${_emotion.tableTokens.rowHeight}: 3.125rem;
@@ -40,9 +41,9 @@ const config = {
                 ${_emotion.tableTokens.checkboxTriggerBorderCheckedColor}: transparent;
                 ${_emotion.tableTokens.checkboxTriggerSize}: 1.25rem;
                 ${_emotion.tableTokens.checkboxTriggerBorderRadius}: 0.375rem;
-                ${_emotion.tableTokens.checkboxTriggerBorderColor}: var(--text-secondary);
-                ${_emotion.tableTokens.checkboxFillColor}: var(--text-accent);
-                ${_emotion.tableTokens.checkboxTriggerIconColor}: var(--on-dark-text-primary);
+                ${_emotion.tableTokens.checkboxTriggerBorderColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tableTokens.checkboxFillColor}: ${_sdds_cs.textAccent};
+                ${_emotion.tableTokens.checkboxTriggerIconColor}: ${_sdds_cs.onDarkTextPrimary};
 
                 ${_emotion.tableTokens.editableCellIconGap}: 0.5rem;
                 ${_emotion.tableTokens.editableCellIconButtonWidth}: 3rem;
@@ -57,12 +58,12 @@ const config = {
                 ${_emotion.tableTokens.filterDividerMargin}: 0.375rem 0.75rem;
 
                 ${_emotion.tableTokens.buttonHeight}: 2.5rem;
-                ${_emotion.tableTokens.buttonFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_emotion.tableTokens.buttonFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_emotion.tableTokens.buttonFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_emotion.tableTokens.buttonFontWeight}: var(--plasma-typo-body-s-bold-font-weight);
-                ${_emotion.tableTokens.buttonLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_emotion.tableTokens.buttonLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_emotion.tableTokens.buttonFontFamily}: ${_sdds_cs.bodyS.fontFamily};
+                ${_emotion.tableTokens.buttonFontSize}: ${_sdds_cs.bodyS.fontSize};
+                ${_emotion.tableTokens.buttonFontStyle}: ${_sdds_cs.bodyS.fontStyle};
+                ${_emotion.tableTokens.buttonFontWeight}: ${_sdds_cs.bodySBold.fontWeight};
+                ${_emotion.tableTokens.buttonLetterSpacing}: ${_sdds_cs.bodyS.letterSpacing};
+                ${_emotion.tableTokens.buttonLineHeight}: ${_sdds_cs.bodyS.lineHeight};
 
                 ${_emotion.tableTokens.selectPadding}: 0.125rem;
                 ${_emotion.tableTokens.selectBorderRadius}: 0.875rem;
@@ -72,12 +73,12 @@ const config = {
                 ${_emotion.tableTokens.selectItemIconMargin}: 0 0.375rem 0 0;
                 ${_emotion.tableTokens.selectItemIconSize}: 1.5rem;
                 ${_emotion.tableTokens.selectCellPadding}: 0;
-                ${_emotion.tableTokens.selectCellTitleFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_emotion.tableTokens.selectCellTitleFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_emotion.tableTokens.selectCellTitleFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_emotion.tableTokens.selectCellTitleFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_emotion.tableTokens.selectCellTitleLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_emotion.tableTokens.selectCellTitleLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_emotion.tableTokens.selectCellTitleFontFamily}: ${_sdds_cs.bodyM.fontFamily};
+                ${_emotion.tableTokens.selectCellTitleFontSize}: ${_sdds_cs.bodyM.fontSize};
+                ${_emotion.tableTokens.selectCellTitleFontStyle}: ${_sdds_cs.bodyM.fontStyle};
+                ${_emotion.tableTokens.selectCellTitleFontWeight}: ${_sdds_cs.bodyM.fontWeight};
+                ${_emotion.tableTokens.selectCellTitleLetterSpacing}: ${_sdds_cs.bodyM.letterSpacing};
+                ${_emotion.tableTokens.selectCellTitleLineHeight}: ${_sdds_cs.bodyM.lineHeight};
                 ${_emotion.tableTokens.selectCheckboxTriggerSize}: 1.25rem;
                 ${_emotion.tableTokens.selectCheckboxTriggerBorderRadius}: 0.375rem;
                 ${_emotion.tableTokens.selectCheckboxTriggerBorderWidth}: 0.125rem;
@@ -85,20 +86,20 @@ const config = {
                 ${_emotion.tableTokens.selectControlPanelPadding}: 0.5rem 0.875rem;
                 ${_emotion.tableTokens.selectControlPanelGap}: 0.5rem;
 
-                ${_emotion.tableTokens.linkButtonFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_emotion.tableTokens.linkButtonFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_emotion.tableTokens.linkButtonFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_emotion.tableTokens.linkButtonFontWeight}: var(--plasma-typo-body-s-bold-font-weight);
-                ${_emotion.tableTokens.linkButtonLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_emotion.tableTokens.linkButtonLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_emotion.tableTokens.linkButtonFontFamily}: ${_sdds_cs.bodyS.fontFamily};
+                ${_emotion.tableTokens.linkButtonFontSize}: ${_sdds_cs.bodyS.fontSize};
+                ${_emotion.tableTokens.linkButtonFontStyle}: ${_sdds_cs.bodyS.fontStyle};
+                ${_emotion.tableTokens.linkButtonFontWeight}: ${_sdds_cs.bodySBold.fontWeight};
+                ${_emotion.tableTokens.linkButtonLetterSpacing}: ${_sdds_cs.bodyS.letterSpacing};
+                ${_emotion.tableTokens.linkButtonLineHeight}: ${_sdds_cs.bodyS.lineHeight};
             `,
             m: (0, _emotion.css)`
-                ${_emotion.tableTokens.fontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_emotion.tableTokens.fontSize}: var(--plasma-typo-body-m-font-size);
-                ${_emotion.tableTokens.fontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_emotion.tableTokens.fontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_emotion.tableTokens.letterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_emotion.tableTokens.lineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_emotion.tableTokens.fontFamily}: ${_sdds_cs.bodyM.fontFamily};
+                ${_emotion.tableTokens.fontSize}: ${_sdds_cs.bodyM.fontSize};
+                ${_emotion.tableTokens.fontStyle}: ${_sdds_cs.bodyM.fontStyle};
+                ${_emotion.tableTokens.fontWeight}: ${_sdds_cs.bodyM.fontWeight};
+                ${_emotion.tableTokens.letterSpacing}: ${_sdds_cs.bodyM.letterSpacing};
+                ${_emotion.tableTokens.lineHeight}: ${_sdds_cs.bodyM.lineHeight};
 
                 ${_emotion.tableTokens.headerRowHeight}: 2.75rem;
                 ${_emotion.tableTokens.rowHeight}: 2.75rem;
@@ -108,9 +109,9 @@ const config = {
                 ${_emotion.tableTokens.checkboxTriggerBorderCheckedColor}: transparent;
                 ${_emotion.tableTokens.checkboxTriggerSize}: 1.25rem;
                 ${_emotion.tableTokens.checkboxTriggerBorderRadius}: 0.375rem;
-                ${_emotion.tableTokens.checkboxTriggerBorderColor}: var(--text-secondary);
-                ${_emotion.tableTokens.checkboxFillColor}: var(--text-accent);
-                ${_emotion.tableTokens.checkboxTriggerIconColor}: var(--on-dark-text-primary);
+                ${_emotion.tableTokens.checkboxTriggerBorderColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tableTokens.checkboxFillColor}: ${_sdds_cs.textAccent};
+                ${_emotion.tableTokens.checkboxTriggerIconColor}: ${_sdds_cs.onDarkTextPrimary};
 
                 ${_emotion.tableTokens.editableCellIconGap}: 0.375rem;
                 ${_emotion.tableTokens.editableCellIconButtonWidth}: 2.5rem;
@@ -125,12 +126,12 @@ const config = {
                 ${_emotion.tableTokens.filterDividerMargin}: 0.375rem 0.75rem;
 
                 ${_emotion.tableTokens.buttonHeight}: 2rem;
-                ${_emotion.tableTokens.buttonFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_emotion.tableTokens.buttonFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_emotion.tableTokens.buttonFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_emotion.tableTokens.buttonFontWeight}: var(--plasma-typo-body-xs-bold-font-weight);
-                ${_emotion.tableTokens.buttonLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_emotion.tableTokens.buttonLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_emotion.tableTokens.buttonFontFamily}: ${_sdds_cs.bodyXS.fontFamily};
+                ${_emotion.tableTokens.buttonFontSize}: ${_sdds_cs.bodyXS.fontSize};
+                ${_emotion.tableTokens.buttonFontStyle}: ${_sdds_cs.bodyXS.fontStyle};
+                ${_emotion.tableTokens.buttonFontWeight}: ${_sdds_cs.bodyXSBold.fontWeight};
+                ${_emotion.tableTokens.buttonLetterSpacing}: ${_sdds_cs.bodyXS.letterSpacing};
+                ${_emotion.tableTokens.buttonLineHeight}: ${_sdds_cs.bodyXS.lineHeight};
 
                 ${_emotion.tableTokens.selectPadding}: 0.125rem;
                 ${_emotion.tableTokens.selectBorderRadius}: 0.75rem;
@@ -140,12 +141,12 @@ const config = {
                 ${_emotion.tableTokens.selectItemIconMargin}: 0 0.375rem 0 0;
                 ${_emotion.tableTokens.selectItemIconSize}: 1.5rem;
                 ${_emotion.tableTokens.selectCellPadding}: 0;
-                ${_emotion.tableTokens.selectCellTitleFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_emotion.tableTokens.selectCellTitleFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_emotion.tableTokens.selectCellTitleFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_emotion.tableTokens.selectCellTitleFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_emotion.tableTokens.selectCellTitleLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_emotion.tableTokens.selectCellTitleLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_emotion.tableTokens.selectCellTitleFontFamily}: ${_sdds_cs.bodyS.fontFamily};
+                ${_emotion.tableTokens.selectCellTitleFontSize}: ${_sdds_cs.bodyS.fontSize};
+                ${_emotion.tableTokens.selectCellTitleFontStyle}: ${_sdds_cs.bodyS.fontStyle};
+                ${_emotion.tableTokens.selectCellTitleFontWeight}: ${_sdds_cs.bodyS.fontWeight};
+                ${_emotion.tableTokens.selectCellTitleLetterSpacing}: ${_sdds_cs.bodyS.letterSpacing};
+                ${_emotion.tableTokens.selectCellTitleLineHeight}: ${_sdds_cs.bodyS.lineHeight};
                 ${_emotion.tableTokens.selectCheckboxTriggerSize}: 1.25rem;
                 ${_emotion.tableTokens.selectCheckboxTriggerBorderRadius}: 0.375rem;
                 ${_emotion.tableTokens.selectCheckboxTriggerBorderWidth}: 0.125rem;
@@ -153,20 +154,20 @@ const config = {
                 ${_emotion.tableTokens.selectControlPanelPadding}: 0.25rem 0.75rem;
                 ${_emotion.tableTokens.selectControlPanelGap}: 0.625rem;
 
-                ${_emotion.tableTokens.linkButtonFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_emotion.tableTokens.linkButtonFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_emotion.tableTokens.linkButtonFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_emotion.tableTokens.linkButtonFontWeight}: var(--plasma-typo-body-xs-bold-font-weight);
-                ${_emotion.tableTokens.linkButtonLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_emotion.tableTokens.linkButtonLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_emotion.tableTokens.linkButtonFontFamily}: ${_sdds_cs.bodyXS.fontFamily};
+                ${_emotion.tableTokens.linkButtonFontSize}: ${_sdds_cs.bodyXS.fontSize};
+                ${_emotion.tableTokens.linkButtonFontStyle}: ${_sdds_cs.bodyXS.fontStyle};
+                ${_emotion.tableTokens.linkButtonFontWeight}: ${_sdds_cs.bodyXSBold.fontWeight};
+                ${_emotion.tableTokens.linkButtonLetterSpacing}: ${_sdds_cs.bodyXS.letterSpacing};
+                ${_emotion.tableTokens.linkButtonLineHeight}: ${_sdds_cs.bodyXS.lineHeight};
             `,
             s: (0, _emotion.css)`
-                ${_emotion.tableTokens.fontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_emotion.tableTokens.fontSize}: var(--plasma-typo-body-s-font-size);
-                ${_emotion.tableTokens.fontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_emotion.tableTokens.fontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_emotion.tableTokens.letterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_emotion.tableTokens.lineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_emotion.tableTokens.fontFamily}: ${_sdds_cs.bodyS.fontFamily};
+                ${_emotion.tableTokens.fontSize}: ${_sdds_cs.bodyS.fontSize};
+                ${_emotion.tableTokens.fontStyle}: ${_sdds_cs.bodyS.fontStyle};
+                ${_emotion.tableTokens.fontWeight}: ${_sdds_cs.bodyS.fontWeight};
+                ${_emotion.tableTokens.letterSpacing}: ${_sdds_cs.bodyS.letterSpacing};
+                ${_emotion.tableTokens.lineHeight}: ${_sdds_cs.bodyS.lineHeight};
 
                 ${_emotion.tableTokens.headerRowHeight}: 2.125rem;
                 ${_emotion.tableTokens.rowHeight}: 2.125rem;
@@ -176,9 +177,9 @@ const config = {
                 ${_emotion.tableTokens.checkboxTriggerBorderCheckedColor}: transparent;
                 ${_emotion.tableTokens.checkboxTriggerSize}: 0.875rem;
                 ${_emotion.tableTokens.checkboxTriggerBorderRadius}: 0.25rem;
-                ${_emotion.tableTokens.checkboxTriggerBorderColor}: var(--text-secondary);
-                ${_emotion.tableTokens.checkboxFillColor}: var(--text-accent);
-                ${_emotion.tableTokens.checkboxTriggerIconColor}: var(--on-dark-text-primary);
+                ${_emotion.tableTokens.checkboxTriggerBorderColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tableTokens.checkboxFillColor}: ${_sdds_cs.textAccent};
+                ${_emotion.tableTokens.checkboxTriggerIconColor}: ${_sdds_cs.onDarkTextPrimary};
 
                 ${_emotion.tableTokens.editableCellIconGap}: 0.25rem;
                 ${_emotion.tableTokens.editableCellIconButtonWidth}: 2rem;
@@ -193,12 +194,12 @@ const config = {
                 ${_emotion.tableTokens.filterDividerMargin}: 0.25rem 0.5rem;
 
                 ${_emotion.tableTokens.buttonHeight}: 1.5rem;
-                ${_emotion.tableTokens.buttonFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_emotion.tableTokens.buttonFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_emotion.tableTokens.buttonFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_emotion.tableTokens.buttonFontWeight}: var(--plasma-typo-body-xs-bold-font-weight);
-                ${_emotion.tableTokens.buttonLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_emotion.tableTokens.buttonLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_emotion.tableTokens.buttonFontFamily}: ${_sdds_cs.bodyXS.fontFamily};
+                ${_emotion.tableTokens.buttonFontSize}: ${_sdds_cs.bodyXS.fontSize};
+                ${_emotion.tableTokens.buttonFontStyle}: ${_sdds_cs.bodyXS.fontStyle};
+                ${_emotion.tableTokens.buttonFontWeight}: ${_sdds_cs.bodyXSBold.fontWeight};
+                ${_emotion.tableTokens.buttonLetterSpacing}: ${_sdds_cs.bodyXS.letterSpacing};
+                ${_emotion.tableTokens.buttonLineHeight}: ${_sdds_cs.bodyXS.lineHeight};
 
                 ${_emotion.tableTokens.selectPadding}: 0.125rem;
                 ${_emotion.tableTokens.selectBorderRadius}: 0.625rem;
@@ -208,12 +209,12 @@ const config = {
                 ${_emotion.tableTokens.selectItemIconMargin}: 0 0.25rem 0 0;
                 ${_emotion.tableTokens.selectItemIconSize}: 1rem;
                 ${_emotion.tableTokens.selectCellPadding}: 0;
-                ${_emotion.tableTokens.selectCellTitleFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_emotion.tableTokens.selectCellTitleFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_emotion.tableTokens.selectCellTitleFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_emotion.tableTokens.selectCellTitleFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_emotion.tableTokens.selectCellTitleLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_emotion.tableTokens.selectCellTitleLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_emotion.tableTokens.selectCellTitleFontFamily}: ${_sdds_cs.bodyXS.fontFamily};
+                ${_emotion.tableTokens.selectCellTitleFontSize}: ${_sdds_cs.bodyXS.fontSize};
+                ${_emotion.tableTokens.selectCellTitleFontStyle}: ${_sdds_cs.bodyXS.fontStyle};
+                ${_emotion.tableTokens.selectCellTitleFontWeight}: ${_sdds_cs.bodyXS.fontWeight};
+                ${_emotion.tableTokens.selectCellTitleLetterSpacing}: ${_sdds_cs.bodyXS.letterSpacing};
+                ${_emotion.tableTokens.selectCellTitleLineHeight}: ${_sdds_cs.bodyXS.lineHeight};
                 ${_emotion.tableTokens.selectCheckboxTriggerSize}: 0.875rem;
                 ${_emotion.tableTokens.selectCheckboxTriggerBorderRadius}: 0.25rem;
                 ${_emotion.tableTokens.selectCheckboxTriggerBorderWidth}: 0.125rem;
@@ -221,12 +222,12 @@ const config = {
                 ${_emotion.tableTokens.selectControlPanelPadding}: 0.25rem 0.5rem;
                 ${_emotion.tableTokens.selectControlPanelGap}: 0.25rem;
 
-                ${_emotion.tableTokens.linkButtonFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_emotion.tableTokens.linkButtonFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_emotion.tableTokens.linkButtonFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_emotion.tableTokens.linkButtonFontWeight}: var(--plasma-typo-body-xs-bold-font-weight);
-                ${_emotion.tableTokens.linkButtonLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_emotion.tableTokens.linkButtonLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_emotion.tableTokens.linkButtonFontFamily}: ${_sdds_cs.bodyXS.fontFamily};
+                ${_emotion.tableTokens.linkButtonFontSize}: ${_sdds_cs.bodyXS.fontSize};
+                ${_emotion.tableTokens.linkButtonFontStyle}: ${_sdds_cs.bodyXS.fontStyle};
+                ${_emotion.tableTokens.linkButtonFontWeight}: ${_sdds_cs.bodyXSBold.fontWeight};
+                ${_emotion.tableTokens.linkButtonLetterSpacing}: ${_sdds_cs.bodyXS.letterSpacing};
+                ${_emotion.tableTokens.linkButtonLineHeight}: ${_sdds_cs.bodyXS.lineHeight};
             `
         }
     }

package/dist/emotion/cjs/components/Tabs/horizontal/HorizontalTabItem.config.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "config", {
         return config;
     }
 });
+const _sdds_cs = require("@salutejs/sdds-themes/tokens/sdds_cs");
 const _emotion = require("@salutejs/plasma-new-hope/emotion");
 const config = {
     defaults: {
@@ -17,109 +18,109 @@ const config = {
     variations: {
         view: {
             clear: (0, _emotion.css)`
-                ${_emotion.tabsTokens.itemColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColor}: var(--text-tertiary);
+                ${_emotion.tabsTokens.itemColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColor}: ${_sdds_cs.textTertiary};
                 ${_emotion.tabsTokens.itemBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_emotion.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorActive}: var(--text-secondary-active);
-                ${_emotion.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColorHover}: ${_sdds_cs.textSecondaryHover};
+                ${_emotion.tabsTokens.itemValueColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorActive}: ${_sdds_cs.textSecondaryActive};
+                ${_emotion.tabsTokens.itemValueColorActive}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_emotion.tabsTokens.itemSelectedColor}: var(--text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemSelectedColor}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.itemSelectedColorHover}: var(--text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColorHover}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemSelectedColorHover}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColorHover}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_emotion.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.itemSelectedDividerHeight}: 0rem;
-                ${_emotion.tabsTokens.itemSelectedDividerColor}: var(--surface-solid-default);
-                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: var(--surface-solid-default-hover);
+                ${_emotion.tabsTokens.itemSelectedDividerColor}: ${_sdds_cs.surfaceSolidDefault};
+                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_cs.surfaceSolidDefaultHover};
 
                 ${_emotion.tabsTokens.itemCursor}: default;
                 ${_emotion.tabsTokens.itemCursorOverNotSelected}: pointer;
             `,
             secondary: (0, _emotion.css)`
-                ${_emotion.tabsTokens.itemColor}: var(--text-primary);
-                ${_emotion.tabsTokens.itemValueColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColor}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemValueColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_emotion.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorActive}: var(--text-secondary-active);
-                ${_emotion.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColorHover}: ${_sdds_cs.textSecondaryHover};
+                ${_emotion.tabsTokens.itemValueColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorActive}: ${_sdds_cs.textSecondaryActive};
+                ${_emotion.tabsTokens.itemValueColorActive}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_emotion.tabsTokens.itemSelectedColor}: var(--text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemSelectedColor}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedBackgroundColor}: var(--surface-transparent-card);
-                ${_emotion.tabsTokens.itemSelectedColorHover}: var(--text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColorHover}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemSelectedColorHover}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColorHover}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedBackgroundColorHover}: var(--surface-transparent-card);
                 ${_emotion.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
                 ${_emotion.tabsTokens.itemMarginLeftFilled}: 0.125rem;
 
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.itemSelectedDividerHeight}: 0rem;
-                ${_emotion.tabsTokens.itemSelectedDividerColor}: var(--surface-solid-default);
-                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: var(--surface-solid-default-hover);
+                ${_emotion.tabsTokens.itemSelectedDividerColor}: ${_sdds_cs.surfaceSolidDefault};
+                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_cs.surfaceSolidDefaultHover};
 
                 ${_emotion.tabsTokens.itemCursor}: default;
                 ${_emotion.tabsTokens.itemCursorOverNotSelected}: pointer;
             `,
             divider: (0, _emotion.css)`
-                ${_emotion.tabsTokens.itemColor}: var(--text-accent);
-                ${_emotion.tabsTokens.itemValueColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColor}: ${_sdds_cs.textAccent};
+                ${_emotion.tabsTokens.itemValueColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.itemColorHover}: var(--text-accent-minor);
-                ${_emotion.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorActive}: var(--text-accent-active);
-                ${_emotion.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColorHover}: ${_sdds_cs.textAccentMinor};
+                ${_emotion.tabsTokens.itemValueColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorActive}: ${_sdds_cs.textAccentActive};
+                ${_emotion.tabsTokens.itemValueColorActive}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_emotion.tabsTokens.itemSelectedColor}: var(--text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemSelectedColor}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.itemSelectedColorHover}: var(--text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColorHover}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemSelectedColorHover}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColorHover}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedBackgroundColorHover}: transparent;
                 ${_emotion.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.itemSelectedDividerHeight}: 0.125rem;
-                ${_emotion.tabsTokens.itemSelectedDividerColor}: var(--surface-solid-default);
-                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: var(--surface-solid-default-hover);
+                ${_emotion.tabsTokens.itemSelectedDividerColor}: ${_sdds_cs.surfaceSolidDefault};
+                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_cs.surfaceSolidDefaultHover};
 
                 ${_emotion.tabsTokens.itemCursor}: default;
                 ${_emotion.tabsTokens.itemCursorOverNotSelected}: pointer;
             `,
             default: (0, _emotion.css)`
-                ${_emotion.tabsTokens.itemColor}: var(--text-primary);
-                ${_emotion.tabsTokens.itemValueColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColor}: ${_sdds_cs.textPrimary};
+                ${_emotion.tabsTokens.itemValueColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.itemColorHover}: var(--text-secondary-hover);
-                ${_emotion.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorActive}: var(--text-secondary-active);
-                ${_emotion.tabsTokens.itemValueColorActive}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColorHover}: ${_sdds_cs.textSecondaryHover};
+                ${_emotion.tabsTokens.itemValueColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorActive}: ${_sdds_cs.textSecondaryActive};
+                ${_emotion.tabsTokens.itemValueColorActive}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemBackgroundColorHover}: transparent;
-                ${_emotion.tabsTokens.itemSelectedColor}: var(--inverse-text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColor}: var(--on-dark-text-secondary);
-                ${_emotion.tabsTokens.itemSelectedBackgroundColor}: var(--surface-solid-default);
-                ${_emotion.tabsTokens.itemSelectedColorHover}: var(--inverse-text-primary);
-                ${_emotion.tabsTokens.itemSelectedValueColorHover}: var(--on-dark-text-secondary);
-                ${_emotion.tabsTokens.itemSelectedBackgroundColorHover}: var(--surface-solid-default);
+                ${_emotion.tabsTokens.itemSelectedColor}: ${_sdds_cs.inverseTextPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColor}: ${_sdds_cs.onDarkTextSecondary};
+                ${_emotion.tabsTokens.itemSelectedBackgroundColor}: ${_sdds_cs.surfaceSolidDefault};
+                ${_emotion.tabsTokens.itemSelectedColorHover}: ${_sdds_cs.inverseTextPrimary};
+                ${_emotion.tabsTokens.itemSelectedValueColorHover}: ${_sdds_cs.onDarkTextSecondary};
+                ${_emotion.tabsTokens.itemSelectedBackgroundColorHover}: ${_sdds_cs.surfaceSolidDefault};
                 ${_emotion.tabsTokens.itemBackgroundTransition}: background-color 0.3s ease-in-out;
 
                 ${_emotion.tabsTokens.itemMarginLeftFilled}: 0.125rem;
 
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.itemSelectedDividerHeight}: 0rem;
-                ${_emotion.tabsTokens.itemSelectedDividerColor}: var(--surface-solid-default);
-                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: var(--surface-solid-default-hover);
+                ${_emotion.tabsTokens.itemSelectedDividerColor}: ${_sdds_cs.surfaceSolidDefault};
+                ${_emotion.tabsTokens.itemSelectedDividerColorHover}: ${_sdds_cs.surfaceSolidDefaultHover};
 
                 ${_emotion.tabsTokens.itemCursor}: default;
                 ${_emotion.tabsTokens.itemCursorOverNotSelected}: pointer;
@@ -136,32 +137,32 @@ const config = {
                 ${_emotion.tabsTokens.itemContentGap}: 0.25rem;
                 ${_emotion.tabsTokens.itemContentPadding}: 0.125rem;
 
-                ${_emotion.tabsTokens.fontFamily}: var(--plasma-typo-body-m-bold-font-family);
-                ${_emotion.tabsTokens.fontSize}: var(--plasma-typo-body-m-bold-font-size);
-                ${_emotion.tabsTokens.fontStyle}: var(--plasma-typo-body-m-bold-font-style);
-                ${_emotion.tabsTokens.fontWeight}: var(--plasma-typo-body-m-bold-font-weight);
-                ${_emotion.tabsTokens.letterSpacing}: var(--plasma-typo-body-m-bold-letter-spacing);
-                ${_emotion.tabsTokens.lineHeight}: var(--plasma-typo-body-m-bold-line-height);
+                ${_emotion.tabsTokens.fontFamily}: ${_sdds_cs.bodyMBold.fontFamily};
+                ${_emotion.tabsTokens.fontSize}: ${_sdds_cs.bodyMBold.fontSize};
+                ${_emotion.tabsTokens.fontStyle}: ${_sdds_cs.bodyMBold.fontStyle};
+                ${_emotion.tabsTokens.fontWeight}: ${_sdds_cs.bodyMBold.fontWeight};
+                ${_emotion.tabsTokens.letterSpacing}: ${_sdds_cs.bodyMBold.letterSpacing};
+                ${_emotion.tabsTokens.lineHeight}: ${_sdds_cs.bodyMBold.lineHeight};
 
-                ${_emotion.tabsTokens.valueFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_emotion.tabsTokens.valueFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_emotion.tabsTokens.valueFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_emotion.tabsTokens.valueFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_emotion.tabsTokens.valueLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_emotion.tabsTokens.valueLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_emotion.tabsTokens.valueFontFamily}: ${_sdds_cs.bodyM.fontFamily};
+                ${_emotion.tabsTokens.valueFontSize}: ${_sdds_cs.bodyM.fontSize};
+                ${_emotion.tabsTokens.valueFontStyle}: ${_sdds_cs.bodyM.fontStyle};
+                ${_emotion.tabsTokens.valueFontWeight}: ${_sdds_cs.bodyM.fontWeight};
+                ${_emotion.tabsTokens.valueLetterSpacing}: ${_sdds_cs.bodyM.letterSpacing};
+                ${_emotion.tabsTokens.valueLineHeight}: ${_sdds_cs.bodyM.lineHeight};
 
                 ${_emotion.tabsTokens.actionContentMarginLeft}: 0.125rem;
             `
         },
         disabled: {
             true: (0, _emotion.css)`
-                ${_emotion.tabsTokens.itemColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorActive}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColorActive}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemSelectedColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.itemColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorActive}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColorActive}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemSelectedColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedDividerColor}: none;
                 ${_emotion.tabsTokens.itemSelectedDividerColorHover}: none;
             `

package/dist/emotion/cjs/components/Tabs/horizontal/HorizontalTabs.config.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "config", {
         return config;
     }
 });
+const _sdds_cs = require("@salutejs/sdds-themes/tokens/sdds_cs");
 const _emotion = require("@salutejs/plasma-new-hope/emotion");
 const config = {
     defaults: {
@@ -17,36 +18,36 @@ const config = {
     variations: {
         view: {
             clear: (0, _emotion.css)`
-                ${_emotion.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.arrowColorHover}: var(--text-secondary-hover);
-                ${_emotion.tabsTokens.arrowColorActive}: var(---text-secondary-active);
+                ${_emotion.tabsTokens.arrowColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.arrowColorHover}: ${_sdds_cs.textSecondaryHover};
+                ${_emotion.tabsTokens.arrowColorActive}: ${_sdds_cs.textSecondaryActive};
                 ${_emotion.tabsTokens.tabsBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.tabsDividerHeight}: 0rem;
                 ${_emotion.tabsTokens.tabsDividerColor}: transparent;
                 ${_emotion.tabsTokens.tabsDividerBorderRadius}: 0rem;
             `,
             filled: (0, _emotion.css)`
-                ${_emotion.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.arrowColorHover}: var(--text-secondary-hover);
-                ${_emotion.tabsTokens.arrowColorActive}: var(---text-secondary-active);
+                ${_emotion.tabsTokens.arrowColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.arrowColorHover}: ${_sdds_cs.textSecondaryHover};
+                ${_emotion.tabsTokens.arrowColorActive}: ${_sdds_cs.textSecondaryActive};
                 ${_emotion.tabsTokens.tabsBackgroundColor}: var(--surface-transparent-primary);
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.tabsDividerHeight}: 0rem;
                 ${_emotion.tabsTokens.tabsDividerColor}: transparent;
                 ${_emotion.tabsTokens.tabsDividerBorderRadius}: 0rem;
             `,
             divider: (0, _emotion.css)`
-                ${_emotion.tabsTokens.arrowColor}: var(--text-accent);
-                ${_emotion.tabsTokens.arrowColorHover}: var(--text-accent-minor);
-                ${_emotion.tabsTokens.arrowColorActive}: var(--text-accent-active);
+                ${_emotion.tabsTokens.arrowColor}: ${_sdds_cs.textAccent};
+                ${_emotion.tabsTokens.arrowColorHover}: ${_sdds_cs.textAccentMinor};
+                ${_emotion.tabsTokens.arrowColorActive}: ${_sdds_cs.textAccentActive};
                 ${_emotion.tabsTokens.tabsBackgroundColor}: transparent;
-                ${_emotion.tabsTokens.outlineFocusColor}: var(--surface-accent);
+                ${_emotion.tabsTokens.outlineFocusColor}: ${_sdds_cs.surfaceAccent};
 
                 ${_emotion.tabsTokens.tabsDividerHeight}: 0.0625rem;
-                ${_emotion.tabsTokens.tabsDividerColor}: var(--outline-solid-primary);
+                ${_emotion.tabsTokens.tabsDividerColor}: ${_sdds_cs.outlineSolidPrimary};
                 ${_emotion.tabsTokens.tabsDividerBorderRadius}: 0.0625rem;
             `
         },
@@ -122,14 +123,14 @@ const config = {
         },
         disabled: {
             true: (0, _emotion.css)`
-                ${_emotion.tabsTokens.arrowColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColor}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColorHover}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemColorActive}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemValueColorActive}: var(--text-secondary);
-                ${_emotion.tabsTokens.itemSelectedColor}: var(--text-secondary);
+                ${_emotion.tabsTokens.arrowColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColor}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColorHover}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemColorActive}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemValueColorActive}: ${_sdds_cs.textSecondary};
+                ${_emotion.tabsTokens.itemSelectedColor}: ${_sdds_cs.textSecondary};
                 ${_emotion.tabsTokens.itemSelectedDividerColor}: none;
                 ${_emotion.tabsTokens.itemSelectedDividerColorHover}: none;
                 ${_emotion.tabsTokens.tabsDividerColor}: transparent;