transform token kind to kebab-case in css var

yukukotani · Oct 14, 2024 · a84213e · a84213e
1 parent 457153f
commit a84213e
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/src/__snapshots__/sheet.test.ts.snap b/src/__snapshots__/sheet.test.ts.snap
@@ -134,6 +134,6 @@ exports[`generateSheets > generates simple single property 1`] = `
 
 exports[`generateThemeSheets > generates a token which refer the other token 1`] = `":root { --j-colors-gray: #666666; --j-colors-primary: var(--j-colors-gray); }"`;
 
-exports[`generateThemeSheets > generates multiple tokens 1`] = `":root { --j-colors-gray-200: #eeeeee; --j-colors-gray-600: #666666; --j-spaces-sm: 4px; --j-sizes-lg: 120px; --j-fontSizes-md: 16px; --j-radii-xs: 2px; }"`;
+exports[`generateThemeSheets > generates multiple tokens 1`] = `":root { --j-colors-gray-200: #eeeeee; --j-colors-gray-600: #666666; --j-spaces-sm: 4px; --j-sizes-lg: 120px; --j-font-sizes-md: 16px; --j-radii-xs: 2px; }"`;
 
 exports[`generateThemeSheets > generates single token 1`] = `":root { --j-colors-light-gray: #666666; }"`;
diff --git a/src/sheet.ts b/src/sheet.ts
@@ -59,7 +59,7 @@ export function generateThemeSheets(config: ConfigSchema) {
 
 export function transformTokenToCssVariable(token: string, kind?: string) {
 	const t = toKebabCase(token).replaceAll(".", "-");
-	return `--j${kind ? `-${kind}-` : "-"}${t}`;
+	return `--j${kind ? `-${toKebabCase(kind)}-` : "-"}${t}`;
 }
 
 export function resolvePropertyValue(value: unknown) {