feat(plasma-tokens-utils): Add kebab case fot typoe and color tokens

salute-developers · Jan 16, 2024 · 325709c · 325709c
1 parent 987d9e2
commit 325709c
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 6 deletions.
diff --git a/utils/plasma-tokens-utils/src/generators/generateColorThemes.ts b/utils/plasma-tokens-utils/src/generators/generateColorThemes.ts
@@ -18,6 +18,7 @@ export const generateColorThemes = (
 ) => {
     const files: GeneratedFiles = [];
     let indexContent = '';
+    const withKebabCase = true;
 
     for (const [fileName, themeItem] of Object.entries(colorThemes)) {
         const themeData = extractTokenData(themeItem);
@@ -35,9 +36,9 @@ export const generateColorThemes = (
             generateFile(
                 fileName,
                 attachToRoot({
-                    ...objectToCSSVariables(themeData, 'colors'),
-                    ...objectToCSSVariables(mixin),
-                    ...objectToCSSVariables(fallbackThemeData, '', false, true),
+                    ...objectToCSSVariables(themeData, 'colors', true, withKebabCase),
+                    ...objectToCSSVariables(mixin, '', true, withKebabCase),
+                    ...objectToCSSVariables(fallbackThemeData, '', false, withKebabCase),
                     color: themeData.text,
                     backgroundColor: themeData.background,
                 }),

diff --git a/utils/plasma-tokens-utils/src/generators/generateTypoSystem.ts b/utils/plasma-tokens-utils/src/generators/generateTypoSystem.ts
@@ -14,6 +14,8 @@ export const generateTypoSystem = (
     mixin: DataObject = {},
 ) => {
     const files: GeneratedFiles = [];
+    const withPrefixDesign = true;
+    const withKebabCase = true;
     let indexContent = '';
 
     for (const [fileName, { theme, scale = 1 }] of Object.entries(typoThemes)) {
@@ -23,8 +25,8 @@ export const generateTypoSystem = (
             generateFile(
                 fileName,
                 attachToRoot({
-                    ...objectToCSSVariables(theme, 'typo'),
-                    ...objectToCSSVariables(mixin),
+                    ...objectToCSSVariables(theme, 'typo', withPrefixDesign, withKebabCase),
+                    ...objectToCSSVariables(mixin, '', withPrefixDesign, withKebabCase),
                     ...{
                         '--plasma-typo-overflow-wrap': 'break-word',
                         '--plasma-typo-hyphens': 'auto',

diff --git a/utils/plasma-tokens-utils/src/utils/objectToCSSVariables.ts b/utils/plasma-tokens-utils/src/utils/objectToCSSVariables.ts
@@ -45,7 +45,7 @@ export const objectToCSSVariables = (
 
             vars = {
                 ...vars,
-                ...objectToCSSVariables(value, name, withPrefixDesign),
+                ...objectToCSSVariables(value, name, withPrefixDesign, withKebabCase),
             };
 
             return vars;