npm - @salutejs/sdds-netology - Versions diffs - 0.358.0-next-sbcom.0 → 0.359.0-dev.0 - Mend

@salutejs/sdds-netology 0.358.0-next-sbcom.0 → 0.359.0-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (875) hide show

package/dist/styled-components/cjs/components/Steps/StepItem.config.js CHANGED Viewed

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _plasma_b2c = require("@salutejs/plasma-themes/tokens/plasma_b2c");
 const config = {
     defaults: {
         view: 'default'
@@ -16,54 +17,54 @@ const config = {
     variations: {
         view: {
             default: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--inverse-text-primary);
-                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--inverse-text-primary);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-solid-default);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-solid-default-hover);
-                ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-primary);
-                ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-primary-hover);
+                ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.inverseTextPrimary};
+                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.inverseTextPrimary};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfaceSolidDefault};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfaceSolidDefaultHover};
+                ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textPrimary};
+                ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textPrimaryHover};
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-solid-default);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfaceSolidDefault};
             `,
             accent: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--on-dark-text-primary);
-                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--on-dark-text-primary-hover);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-accent);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-accent-hover);
-                ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-primary);
-                ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-primary-hover);
+                ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.onDarkTextPrimary};
+                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.onDarkTextPrimaryHover};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfaceAccent};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfaceAccentHover};
+                ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textPrimary};
+                ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textPrimaryHover};
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-accent);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfaceAccent};
             `,
             negative: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--on-dark-text-primary);
-                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--on-dark-text-primary-hover);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-negative);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-negative-hover);
-                ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-negative);
-                ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-negative-hover);
+                ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.onDarkTextPrimary};
+                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.onDarkTextPrimaryHover};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfaceNegative};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfaceNegativeHover};
+                ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textNegative};
+                ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textNegativeHover};
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-negative);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfaceNegative};
             `,
             warning: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--on-dark-text-primary);
-                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--on-dark-text-primary-hover);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-warning);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-warning-hover);
-                ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-warning);
-                ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-warning-hover);
+                ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.onDarkTextPrimary};
+                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.onDarkTextPrimaryHover};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfaceWarning};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfaceWarningHover};
+                ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textWarning};
+                ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textWarningHover};
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-warning);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfaceWarning};
             `,
             positive: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--on-dark-text-primary);
-                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--on-dark-text-primary-hover);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-positive);
-                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-positive-hover);
-                ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-positive);
-                ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-positive-hover);
+                ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.onDarkTextPrimary};
+                ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.onDarkTextPrimaryHover};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfacePositive};
+                ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfacePositiveHover};
+                ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textPositive};
+                ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textPositiveHover};
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-positive);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfacePositive};
             `
         }
     }

package/dist/styled-components/cjs/components/Steps/Steps.config.js CHANGED Viewed

@@ -9,42 +9,43 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _plasma_b2c = require("@salutejs/plasma-themes/tokens/plasma_b2c");
 const baseItemView = `
-    ${_styledcomponents.stepsTokens.activeTitleColor}: var(--text-primary);
-    ${_styledcomponents.stepsTokens.activeTitleColorHover}: var(--text-primary-hover);
-    ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid var(--surface-solid-default);
-    ${_styledcomponents.stepsTokens.activeIndicatorColor}: var(--text-primary);
-    ${_styledcomponents.stepsTokens.activeIndicatorBackground}: var(--surface-clear);
+    ${_styledcomponents.stepsTokens.activeTitleColor}: ${_plasma_b2c.textPrimary};
+    ${_styledcomponents.stepsTokens.activeTitleColorHover}: ${_plasma_b2c.textPrimaryHover};
+    ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid ${_plasma_b2c.surfaceSolidDefault};
+    ${_styledcomponents.stepsTokens.activeIndicatorColor}: ${_plasma_b2c.textPrimary};
+    ${_styledcomponents.stepsTokens.activeIndicatorBackground}: ${_plasma_b2c.surfaceClear};
-    ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--inverse-text-primary);
-    ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--inverse-text-primary);
-    ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-solid-default);
-    ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-solid-default-hover);
-    ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-primary);
-    ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-primary-hover);
+    ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.inverseTextPrimary};
+    ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.inverseTextPrimary};
+    ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfaceSolidDefault};
+    ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfaceSolidDefaultHover};
+    ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textPrimary};
+    ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textPrimaryHover};
-    ${_styledcomponents.stepsTokens.inactiveTitleColor}: var(--text-secondary);
-    ${_styledcomponents.stepsTokens.inactiveTitleColorHover}: var(--text-secondary-hover);
-    ${_styledcomponents.stepsTokens.inactiveIndicatorColor}: var(--text-secondary);
-    ${_styledcomponents.stepsTokens.inactiveIndicatorColorHover}: var(--text-secondary);
-    ${_styledcomponents.stepsTokens.inactiveIndicatorBackground}: var(--surface-transparent-secondary);
-    ${_styledcomponents.stepsTokens.inactiveIndicatorBackgroundHover}: var(--surface-transparent-secondary-hover);
+    ${_styledcomponents.stepsTokens.inactiveTitleColor}: ${_plasma_b2c.textSecondary};
+    ${_styledcomponents.stepsTokens.inactiveTitleColorHover}: ${_plasma_b2c.textSecondaryHover};
+    ${_styledcomponents.stepsTokens.inactiveIndicatorColor}: ${_plasma_b2c.textSecondary};
+    ${_styledcomponents.stepsTokens.inactiveIndicatorColorHover}: ${_plasma_b2c.textSecondary};
+    ${_styledcomponents.stepsTokens.inactiveIndicatorBackground}: ${_plasma_b2c.surfaceTransparentSecondary};
+    ${_styledcomponents.stepsTokens.inactiveIndicatorBackgroundHover}: ${_plasma_b2c.surfaceTransparentSecondaryHover};
-    ${_styledcomponents.stepsTokens.contentColor}: var(--text-secondary);
-    ${_styledcomponents.stepsTokens.focusColor}: var(--surface-accent);
+    ${_styledcomponents.stepsTokens.contentColor}: ${_plasma_b2c.textSecondary};
+    ${_styledcomponents.stepsTokens.focusColor}: ${_plasma_b2c.surfaceAccent};
     ${_styledcomponents.stepsTokens.disabledOpacity}: 0.4;
 `;
 const accentConfig = `
-    ${_styledcomponents.stepsTokens.completedTitleColor}: var(--text-primary);
-    ${_styledcomponents.stepsTokens.completedTitleColorHover}: var(--text-primary-hover);
+    ${_styledcomponents.stepsTokens.completedTitleColor}: ${_plasma_b2c.textPrimary};
+    ${_styledcomponents.stepsTokens.completedTitleColorHover}: ${_plasma_b2c.textPrimaryHover};
-    ${_styledcomponents.stepsTokens.completedIndicatorBackground}: var(--surface-accent);
-    ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: var(--surface-accent-hover);
+    ${_styledcomponents.stepsTokens.completedIndicatorBackground}: ${_plasma_b2c.surfaceAccent};
+    ${_styledcomponents.stepsTokens.completedIndicatorBackgroundHover}: ${_plasma_b2c.surfaceAccentHover};
     // Цвет контента внутри элемента Step
-    ${_styledcomponents.stepsTokens.completedIndicatorColor}: var(--on-dark-text-primary);
-    ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: var(--on-dark-text-primary-hover);
+    ${_styledcomponents.stepsTokens.completedIndicatorColor}: ${_plasma_b2c.onDarkTextPrimary};
+    ${_styledcomponents.stepsTokens.completedIndicatorColorHover}: ${_plasma_b2c.onDarkTextPrimaryHover};
 `;
 const config = {
     defaults: {
@@ -54,10 +55,10 @@ const config = {
     variations: {
         view: {
             default: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-solid-default);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfaceSolidDefault};
             `,
             accent: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.dividerColor}: var(--surface-accent);
+                ${_styledcomponents.stepsTokens.dividerColor}: ${_plasma_b2c.surfaceAccent};
             `
         },
         itemView: {
@@ -67,26 +68,26 @@ const config = {
             negative: (0, _styledcomponents.css)`
                 ${baseItemView};
-                ${_styledcomponents.stepsTokens.activeTitleColor}: var(--surface-negative);
-                ${_styledcomponents.stepsTokens.activeTitleColorHover}: var(--surface-negative-hover);
-                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid var(--surface-negative);
-                ${_styledcomponents.stepsTokens.activeIndicatorColor}: var(--text-negative);
+                ${_styledcomponents.stepsTokens.activeTitleColor}: ${_plasma_b2c.surfaceNegative};
+                ${_styledcomponents.stepsTokens.activeTitleColorHover}: ${_plasma_b2c.surfaceNegativeHover};
+                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid ${_plasma_b2c.surfaceNegative};
+                ${_styledcomponents.stepsTokens.activeIndicatorColor}: ${_plasma_b2c.textNegative};
             `,
             warning: (0, _styledcomponents.css)`
                 ${baseItemView};
-                ${_styledcomponents.stepsTokens.activeTitleColor}: var(--surface-warning);
-                ${_styledcomponents.stepsTokens.activeTitleColorHover}: var(--surface-warning-hover);
-                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid var(--surface-warning);
-                ${_styledcomponents.stepsTokens.activeIndicatorColor}: var(--text-warning);
+                ${_styledcomponents.stepsTokens.activeTitleColor}: ${_plasma_b2c.surfaceWarning};
+                ${_styledcomponents.stepsTokens.activeTitleColorHover}: ${_plasma_b2c.surfaceWarningHover};
+                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid ${_plasma_b2c.surfaceWarning};
+                ${_styledcomponents.stepsTokens.activeIndicatorColor}: ${_plasma_b2c.textWarning};
             `,
             positive: (0, _styledcomponents.css)`
                 ${baseItemView};
-                ${_styledcomponents.stepsTokens.activeTitleColor}: var(--surface-positive);
-                ${_styledcomponents.stepsTokens.activeTitleColorHover}: var(--surface-positive-hover);
-                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid var(--surface-positive);
-                ${_styledcomponents.stepsTokens.activeIndicatorColor}: var(--text-positive);
+                ${_styledcomponents.stepsTokens.activeTitleColor}: ${_plasma_b2c.surfacePositive};
+                ${_styledcomponents.stepsTokens.activeTitleColorHover}: ${_plasma_b2c.surfacePositiveHover};
+                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid ${_plasma_b2c.surfacePositive};
+                ${_styledcomponents.stepsTokens.activeIndicatorColor}: ${_plasma_b2c.textPositive};
             `
         },
         size: {
@@ -102,33 +103,33 @@ const config = {
                 ${_styledcomponents.stepsTokens.contentVerticalPadding}: 1.0625rem;
                 ${_styledcomponents.stepsTokens.verticalContentPaddingLeft}: 0.75rem;
-                ${_styledcomponents.stepsTokens.indicatorFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.indicatorFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.indicatorFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.indicatorFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.indicatorLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.indicatorFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.indicatorFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.indicatorFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.indicatorFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.indicatorLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
-                ${_styledcomponents.stepsTokens.titleFontFamily}: var(--plasma-typo-body-l-font-family);
-                ${_styledcomponents.stepsTokens.titleFontSize}: var(--plasma-typo-body-l-font-size);
-                ${_styledcomponents.stepsTokens.titleFontStyle}: var(--plasma-typo-body-l-font-style);
-                ${_styledcomponents.stepsTokens.titleFontWeight}: var(--plasma-typo-body-l-font-weight);
-                ${_styledcomponents.stepsTokens.titleLetterSpacing}: var(--plasma-typo-body-l-letter-spacing);
-                ${_styledcomponents.stepsTokens.titleLineHeight}: var(--plasma-typo-body-l-line-height);
+                ${_styledcomponents.stepsTokens.titleFontFamily}: ${_plasma_b2c.bodyL.fontFamily};
+                ${_styledcomponents.stepsTokens.titleFontSize}: ${_plasma_b2c.bodyL.fontSize};
+                ${_styledcomponents.stepsTokens.titleFontStyle}: ${_plasma_b2c.bodyL.fontStyle};
+                ${_styledcomponents.stepsTokens.titleFontWeight}: ${_plasma_b2c.bodyL.fontWeight};
+                ${_styledcomponents.stepsTokens.titleLetterSpacing}: ${_plasma_b2c.bodyL.letterSpacing};
+                ${_styledcomponents.stepsTokens.titleLineHeight}: ${_plasma_b2c.bodyL.lineHeight};
-                ${_styledcomponents.stepsTokens.contentFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.stepsTokens.contentFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.stepsTokens.contentFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.stepsTokens.contentFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.stepsTokens.contentLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.stepsTokens.contentLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.stepsTokens.contentFontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.stepsTokens.contentFontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.stepsTokens.contentFontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.stepsTokens.contentFontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.stepsTokens.contentLetterSpacing}: ${_plasma_b2c.bodyM.letterSpacing};
+                ${_styledcomponents.stepsTokens.contentLineHeight}: ${_plasma_b2c.bodyM.lineHeight};
                 ${_styledcomponents.stepsTokens.dividerThickness}: 0.125rem;
             `,
@@ -144,33 +145,33 @@ const config = {
                 ${_styledcomponents.stepsTokens.contentVerticalPadding}: 0.875rem;
                 ${_styledcomponents.stepsTokens.verticalContentPaddingLeft}: 0.75rem;
-                ${_styledcomponents.stepsTokens.indicatorFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.indicatorFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.indicatorFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.indicatorFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.indicatorLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.indicatorFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.indicatorFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.indicatorFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.indicatorFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.indicatorLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
-                ${_styledcomponents.stepsTokens.titleFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.stepsTokens.titleFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.stepsTokens.titleFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.stepsTokens.titleFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.stepsTokens.titleLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.stepsTokens.titleLineHeight}: var(--plasma-typo-body-m-line-height);
+                ${_styledcomponents.stepsTokens.titleFontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.stepsTokens.titleFontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.stepsTokens.titleFontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.stepsTokens.titleFontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.stepsTokens.titleLetterSpacing}: ${_plasma_b2c.bodyM.letterSpacing};
+                ${_styledcomponents.stepsTokens.titleLineHeight}: ${_plasma_b2c.bodyM.lineHeight};
-                ${_styledcomponents.stepsTokens.contentFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.stepsTokens.contentFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.stepsTokens.contentFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.stepsTokens.contentFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.stepsTokens.contentLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.stepsTokens.contentLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.stepsTokens.contentFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.stepsTokens.contentFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.stepsTokens.contentFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.stepsTokens.contentFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.stepsTokens.contentLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.stepsTokens.contentLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
                 ${_styledcomponents.stepsTokens.dividerThickness}: 0.125rem;
             `,
@@ -186,33 +187,33 @@ const config = {
                 ${_styledcomponents.stepsTokens.contentVerticalPadding}: 0.6875rem;
                 ${_styledcomponents.stepsTokens.verticalContentPaddingLeft}: 0.75rem;
-                ${_styledcomponents.stepsTokens.indicatorFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.indicatorFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.indicatorFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.indicatorFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.indicatorLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.indicatorFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.indicatorFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.indicatorFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.indicatorFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.indicatorLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.titleFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.stepsTokens.titleFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.stepsTokens.titleFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.stepsTokens.titleFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.stepsTokens.titleLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.stepsTokens.titleLineHeight}: var(--plasma-typo-body-s-line-height);
+                ${_styledcomponents.stepsTokens.titleFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.stepsTokens.titleFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.stepsTokens.titleFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.stepsTokens.titleFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.stepsTokens.titleLetterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.stepsTokens.titleLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
-                ${_styledcomponents.stepsTokens.contentFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.contentFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.contentFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.contentFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.contentLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.contentLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.contentFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.contentFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.contentFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.contentFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.contentLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.contentLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
                 ${_styledcomponents.stepsTokens.dividerThickness}: 0.125rem;
             `,
@@ -228,33 +229,33 @@ const config = {
                 ${_styledcomponents.stepsTokens.contentVerticalPadding}: 0.5625rem;
                 ${_styledcomponents.stepsTokens.verticalContentPaddingLeft}: 0.75rem;
-                ${_styledcomponents.stepsTokens.indicatorFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.indicatorFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.indicatorFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.indicatorFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.indicatorLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.indicatorFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.indicatorFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.indicatorFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.indicatorFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.indicatorLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.indicatorLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.activeIndicatorFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.activeIndicatorFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.activeIndicatorLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.activeIndicatorLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.titleFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.titleFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.titleFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.titleFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.titleLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.titleLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.titleFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.titleFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.titleFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.titleFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.titleLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.titleLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
-                ${_styledcomponents.stepsTokens.contentFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.stepsTokens.contentFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.stepsTokens.contentFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.stepsTokens.contentFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.stepsTokens.contentLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
-                ${_styledcomponents.stepsTokens.contentLineHeight}: var(--plasma-typo-body-xs-line-height);
+                ${_styledcomponents.stepsTokens.contentFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.stepsTokens.contentFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.stepsTokens.contentFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.stepsTokens.contentFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.stepsTokens.contentLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
+                ${_styledcomponents.stepsTokens.contentLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
                 ${_styledcomponents.stepsTokens.dividerThickness}: 0.125rem;
             `
@@ -265,8 +266,8 @@ const config = {
             view: 'accent',
             itemView: 'default',
             style: (0, _styledcomponents.css)`
-                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid var(--text-accent);
-                ${_styledcomponents.stepsTokens.activeIndicatorColor}: var(--text-accent);
+                ${_styledcomponents.stepsTokens.activeIndicatorBorder}: solid ${_plasma_b2c.textAccent};
+                ${_styledcomponents.stepsTokens.activeIndicatorColor}: ${_plasma_b2c.textAccent};
                 ${accentConfig};
             `

package/dist/styled-components/cjs/components/Switch/Switch.config.js CHANGED Viewed

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "config", {
     }
 });
 const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _plasma_b2c = require("@salutejs/plasma-themes/tokens/plasma_b2c");
 const config = {
     defaults: {
         view: 'default',
@@ -20,50 +21,50 @@ const config = {
     variations: {
         size: {
             s: (0, _styledcomponents.css)`
-                ${_styledcomponents.switchTokens.fontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.switchTokens.fontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.switchTokens.fontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.switchTokens.lineHeight}: var(--plasma-typo-body-s-line-height);
-                ${_styledcomponents.switchTokens.fontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.switchTokens.letterSpacing}: var(--plasma-typo-body-s-letter-spacing);
-                ${_styledcomponents.switchTokens.descriptionFontFamily}: var(--plasma-typo-body-xs-font-family);
-                ${_styledcomponents.switchTokens.descriptionFontStyle}: var(--plasma-typo-body-xs-font-style);
-                ${_styledcomponents.switchTokens.descriptionFontWeight}: var(--plasma-typo-body-xs-font-weight);
-                ${_styledcomponents.switchTokens.descriptionLineHeight}: var(--plasma-typo-body-xs-line-height);
-                ${_styledcomponents.switchTokens.descriptionFontSize}: var(--plasma-typo-body-xs-font-size);
-                ${_styledcomponents.switchTokens.descriptionLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
+                ${_styledcomponents.switchTokens.fontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.switchTokens.fontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.switchTokens.fontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.switchTokens.lineHeight}: ${_plasma_b2c.bodyS.lineHeight};
+                ${_styledcomponents.switchTokens.fontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.switchTokens.letterSpacing}: ${_plasma_b2c.bodyS.letterSpacing};
+                ${_styledcomponents.switchTokens.descriptionFontFamily}: ${_plasma_b2c.bodyXS.fontFamily};
+                ${_styledcomponents.switchTokens.descriptionFontStyle}: ${_plasma_b2c.bodyXS.fontStyle};
+                ${_styledcomponents.switchTokens.descriptionFontWeight}: ${_plasma_b2c.bodyXS.fontWeight};
+                ${_styledcomponents.switchTokens.descriptionLineHeight}: ${_plasma_b2c.bodyXS.lineHeight};
+                ${_styledcomponents.switchTokens.descriptionFontSize}: ${_plasma_b2c.bodyXS.fontSize};
+                ${_styledcomponents.switchTokens.descriptionLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
                 ${_styledcomponents.switchTokens.verticalGap}: 0.25rem;
                 ${_styledcomponents.switchTokens.labelOffset}: 0.75rem;
             `,
             m: (0, _styledcomponents.css)`
-                ${_styledcomponents.switchTokens.fontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.switchTokens.fontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.switchTokens.fontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.switchTokens.lineHeight}: var(--plasma-typo-body-m-line-height);
-                ${_styledcomponents.switchTokens.fontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.switchTokens.letterSpacing}: var(--plasma-typo-body-m-letter-spacing);
-                ${_styledcomponents.switchTokens.descriptionFontFamily}: var(--plasma-typo-body-s-font-family);
-                ${_styledcomponents.switchTokens.descriptionFontStyle}: var(--plasma-typo-body-s-font-style);
-                ${_styledcomponents.switchTokens.descriptionFontWeight}: var(--plasma-typo-body-s-font-weight);
-                ${_styledcomponents.switchTokens.descriptionLineHeight}: var(--plasma-typo-body-s-line-height);
-                ${_styledcomponents.switchTokens.descriptionFontSize}: var(--plasma-typo-body-s-font-size);
-                ${_styledcomponents.switchTokens.descriptionLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
+                ${_styledcomponents.switchTokens.fontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.switchTokens.fontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.switchTokens.fontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.switchTokens.lineHeight}: ${_plasma_b2c.bodyM.lineHeight};
+                ${_styledcomponents.switchTokens.fontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.switchTokens.letterSpacing}: ${_plasma_b2c.bodyM.letterSpacing};
+                ${_styledcomponents.switchTokens.descriptionFontFamily}: ${_plasma_b2c.bodyS.fontFamily};
+                ${_styledcomponents.switchTokens.descriptionFontStyle}: ${_plasma_b2c.bodyS.fontStyle};
+                ${_styledcomponents.switchTokens.descriptionFontWeight}: ${_plasma_b2c.bodyS.fontWeight};
+                ${_styledcomponents.switchTokens.descriptionLineHeight}: ${_plasma_b2c.bodyS.lineHeight};
+                ${_styledcomponents.switchTokens.descriptionFontSize}: ${_plasma_b2c.bodyS.fontSize};
+                ${_styledcomponents.switchTokens.descriptionLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
                 ${_styledcomponents.switchTokens.verticalGap}: 0.25rem;
                 ${_styledcomponents.switchTokens.labelOffset}: 0.75rem;
             `,
             l: (0, _styledcomponents.css)`
-                ${_styledcomponents.switchTokens.fontFamily}: var(--plasma-typo-body-l-font-family);
-                ${_styledcomponents.switchTokens.fontStyle}: var(--plasma-typo-body-l-font-style);
-                ${_styledcomponents.switchTokens.fontWeight}: var(--plasma-typo-body-l-font-weight);
-                ${_styledcomponents.switchTokens.lineHeight}: var(--plasma-typo-body-l-line-height);
-                ${_styledcomponents.switchTokens.fontSize}: var(--plasma-typo-body-l-font-size);
-                ${_styledcomponents.switchTokens.letterSpacing}: var(--plasma-typo-body-l-letter-spacing);
-                ${_styledcomponents.switchTokens.descriptionFontFamily}: var(--plasma-typo-body-m-font-family);
-                ${_styledcomponents.switchTokens.descriptionFontStyle}: var(--plasma-typo-body-m-font-style);
-                ${_styledcomponents.switchTokens.descriptionFontWeight}: var(--plasma-typo-body-m-font-weight);
-                ${_styledcomponents.switchTokens.descriptionLineHeight}: var(--plasma-typo-body-m-line-height);
-                ${_styledcomponents.switchTokens.descriptionFontSize}: var(--plasma-typo-body-m-font-size);
-                ${_styledcomponents.switchTokens.descriptionLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
+                ${_styledcomponents.switchTokens.fontFamily}: ${_plasma_b2c.bodyL.fontFamily};
+                ${_styledcomponents.switchTokens.fontStyle}: ${_plasma_b2c.bodyL.fontStyle};
+                ${_styledcomponents.switchTokens.fontWeight}: ${_plasma_b2c.bodyL.fontWeight};
+                ${_styledcomponents.switchTokens.lineHeight}: ${_plasma_b2c.bodyL.lineHeight};
+                ${_styledcomponents.switchTokens.fontSize}: ${_plasma_b2c.bodyL.fontSize};
+                ${_styledcomponents.switchTokens.letterSpacing}: ${_plasma_b2c.bodyL.letterSpacing};
+                ${_styledcomponents.switchTokens.descriptionFontFamily}: ${_plasma_b2c.bodyM.fontFamily};
+                ${_styledcomponents.switchTokens.descriptionFontStyle}: ${_plasma_b2c.bodyM.fontStyle};
+                ${_styledcomponents.switchTokens.descriptionFontWeight}: ${_plasma_b2c.bodyM.fontWeight};
+                ${_styledcomponents.switchTokens.descriptionLineHeight}: ${_plasma_b2c.bodyM.lineHeight};
+                ${_styledcomponents.switchTokens.descriptionFontSize}: ${_plasma_b2c.bodyM.fontSize};
+                ${_styledcomponents.switchTokens.descriptionLetterSpacing}: ${_plasma_b2c.bodyXS.letterSpacing};
                 ${_styledcomponents.switchTokens.verticalGap}: 0.25rem;
                 ${_styledcomponents.switchTokens.labelOffset}: 0.75rem;
             `
@@ -92,17 +93,17 @@ const config = {
         },
         view: {
             default: (0, _styledcomponents.css)`
-                ${_styledcomponents.switchTokens.labelColor}: var(--text-primary);
-                ${_styledcomponents.switchTokens.descriptionColor}: var(--text-secondary);
+                ${_styledcomponents.switchTokens.labelColor}: ${_plasma_b2c.textPrimary};
+                ${_styledcomponents.switchTokens.descriptionColor}: ${_plasma_b2c.textSecondary};
                 ${_styledcomponents.switchTokens.descriptionMaxLines}: initial;
-                ${_styledcomponents.switchTokens.trackBackgroundColorOn}: var(--surface-accent);
-                ${_styledcomponents.switchTokens.trackBackgroundColorOnHover}: var(--surface-accent-hover);
-                ${_styledcomponents.switchTokens.trackBackgroundColorOff}: var(--surface-transparent-tertiary);
-                ${_styledcomponents.switchTokens.trackBackgroundColorOffHover}: var(--surface-transparent-tertiary-hover);
+                ${_styledcomponents.switchTokens.trackBackgroundColorOn}: ${_plasma_b2c.surfaceAccent};
+                ${_styledcomponents.switchTokens.trackBackgroundColorOnHover}: ${_plasma_b2c.surfaceAccentHover};
+                ${_styledcomponents.switchTokens.trackBackgroundColorOff}: ${_plasma_b2c.surfaceTransparentTertiary};
+                ${_styledcomponents.switchTokens.trackBackgroundColorOffHover}: ${_plasma_b2c.surfaceTransparentTertiaryHover};
                 ${_styledcomponents.switchTokens.trackBorderWidthOn}: 0;
                 ${_styledcomponents.switchTokens.trackBorderWidthOff}: 0;
-                ${_styledcomponents.switchTokens.thumbBackgroundColorOn}: var(--on-dark-surface-solid-default);
-                ${_styledcomponents.switchTokens.thumbBackgroundColorOff}: var(--on-dark-surface-solid-default);
+                ${_styledcomponents.switchTokens.thumbBackgroundColorOn}: ${_plasma_b2c.onDarkSurfaceSolidDefault};
+                ${_styledcomponents.switchTokens.thumbBackgroundColorOff}: ${_plasma_b2c.onDarkSurfaceSolidDefault};
                 ${_styledcomponents.switchTokens.thumbBoxShadow}: 0 1px 1px rgba(0, 0, 0, 0.11);
             `
         },
@@ -113,7 +114,7 @@ const config = {
         },
         focused: {
             true: (0, _styledcomponents.css)`
-                ${_styledcomponents.switchTokens.trackFocusColor}: var(--surface-accent);
+                ${_styledcomponents.switchTokens.trackFocusColor}: ${_plasma_b2c.surfaceAccent};
             `
         }
     }