@digdir/designsystemet 1.13.3 → 1.14.0

package/dist/bin/designsystemet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"designsystemet.d.ts","sourceRoot":"","sources":["../../bin/designsystemet.ts"],"names":[],"mappings":";AAgBA,eAAO,MAAM,WAAW,4iBASvB,CAAC"}
+{"version":3,"file":"designsystemet.d.ts","sourceRoot":"","sources":["../../bin/designsystemet.ts"],"names":[],"mappings":";AAiBA,eAAO,MAAM,WAAW,4iBASvB,CAAC"}

package/dist/bin/designsystemet.js

@@ -1,12 +1,13 @@
 #!/usr/bin/env node
 import { convertToHex } from "../src/colors/utils.js";
 import "../src/colors/index.js";
-import { cliOptions, createTokens } from "../src/tokens/create.js";
+import { cliOptions, createTokens, tokenSetDimensions } from "../src/tokens/create.js";
 import { dsfs } from "../src/utils/filesystem.js";
 import { parseCreateConfig, readConfigFile } from "./config.js";
 import migrations_default from "../src/migrations/index.js";
+import { colorNamesByCategory } from "../src/tokens/utils.js";
 import { buildTokens } from "../src/tokens/build.js";
-import { createTokenFiles } from "../src/tokens/create/files.js";
+import { createSystemTokenFiles, tokenSetsToFiles } from "../src/tokens/create/files.js";
 import { generateConfigFromTokens } from "../src/tokens/generate-config.js";
 import pc from "picocolors";
 import * as R from "ramda";
@@ -68,21 +69,25 @@ function makeTokenCommands() {
 			outdir: config.outDir
 		});
 		const outDir = dsfs.outDir;
-		if (config.clean) await dsfs.cleanDir(outDir);
-		let files = [];
-		if (config.themes) for (const [name, themeWithoutName] of Object.entries(config.themes)) {
-			const theme = {
+		const files = [];
+		for (const [name, themeConfig] of Object.entries(config.themes)) {
+			const { tokenSets } = await createTokens({
 				name,
-				...themeWithoutName
-			};
-			const { tokenSets } = await createTokens(theme);
-			files = files.concat(await createTokenFiles({
-				outDir,
-				theme,
-				tokenSets,
-				themeNames
-			}));
+				...themeConfig
+			});
+			files.push(...tokenSetsToFiles(tokenSets));
 		}
+		const colors = config.themes?.[themeNames[0]]?.colors ?? {
+			main: {},
+			support: {}
+		};
+		files.push(...await createSystemTokenFiles({
+			tokenSetDimensions,
+			themeNames,
+			colors: colorNamesByCategory(colors)
+		}));
+		if (config.clean) await dsfs.cleanDir(outDir);
+		await dsfs.mkdir(outDir);
 		await dsfs.writeFiles(files, outDir);
 		console.log(`\n✅ Finished creating tokens in ${pc.green(outDir)} for themes: ${pc.blue(themeNames.join(", "))}`);
 		return Promise.resolve();

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
 var name = "@digdir/designsystemet";
-var version = "1.13.3";
+var version = "1.14.0";
 //#endregion
 export { name, version };

package/dist/src/scripts/update-preview-tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"update-preview-tokens.d.ts","sourceRoot":"","sources":["../../../src/scripts/update-preview-tokens.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAa,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAkB3D,eAAO,MAAM,WAAW,GAAU,aAAa,KAAK,kBAqEnD,CAAC"}
+{"version":3,"file":"update-preview-tokens.d.ts","sourceRoot":"","sources":["../../../src/scripts/update-preview-tokens.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAmBhD,eAAO,MAAM,WAAW,GAAU,aAAa,KAAK,kBAsEnD,CAAC"}

package/dist/src/tokens/create/files.d.ts

@@ -1,11 +1,16 @@
-import type { OutputFile, Theme, TokenSets } from '../types.js';
+import type { ColorNamesByCategory, OutputFile, TokenSetDimensions, TokenSets } from '../types.js';
 export declare const stringify: (data: unknown) => string;
 type CreateTokenFilesOptions = {
-    outDir: string;
-    theme: Theme;
-    tokenSets: TokenSets;
+    tokenSetDimensions: TokenSetDimensions;
+    colors: ColorNamesByCategory;
     themeNames: string[];
 };
-export declare const createTokenFiles: (options: CreateTokenFilesOptions) => Promise<OutputFile[]>;
+/**
+ * Creates system token files (`$themes.json`, `$metadata.json`, `$designsystemet.jsonc`) based on the provided token set dimensions and theme names.
+ *
+ * `$themes.json` and `$metadata.json` are essential for Token Studio and Style Dictionary to correctly interpret and manage the design tokens.
+ */
+export declare const createSystemTokenFiles: (options: CreateTokenFilesOptions) => Promise<OutputFile[]>;
+export declare const tokenSetsToFiles: (tokenSets: TokenSets) => OutputFile[];
 export {};
 //# sourceMappingURL=files.d.ts.map

package/dist/src/tokens/create/files.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"files.d.ts","sourceRoot":"","sources":["../../../../src/tokens/create/files.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAa,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAK3E,eAAO,MAAM,SAAS,GAAI,MAAM,OAAO,WAAkC,CAAC;AAE1E,KAAK,uBAAuB,GAAG;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,SAAS,CAAC;IACrB,UAAU,EAAE,MAAM,EAAE,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAU,SAAS,uBAAuB,0BAiCtE,CAAC"}
+{"version":3,"file":"files.d.ts","sourceRoot":"","sources":["../../../../src/tokens/create/files.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,UAAU,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAKnG,eAAO,MAAM,SAAS,GAAI,MAAM,OAAO,WAAkC,CAAC;AAE1E,KAAK,uBAAuB,GAAG;IAC7B,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,MAAM,EAAE,oBAAoB,CAAC;IAC7B,UAAU,EAAE,MAAM,EAAE,CAAC;CACtB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,GAAU,SAAS,uBAAuB,0BAiB5E,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAW,SAAS,KAAG,UAAU,EAQjE,CAAC"}

package/dist/src/tokens/create/files.js

@@ -1,24 +1,22 @@
-import { dsfs } from "../../utils/filesystem.js";
 import { generate$Designsystemet } from "./generators/$designsystemet.js";
 import { generate$Metadata } from "./generators/$metadata.js";
 import { generate$Themes } from "./generators/$themes.js";
 //#region src/tokens/create/files.ts
 const stringify = (data) => JSON.stringify(data, null, 2);
-const createTokenFiles = async (options) => {
-	const { outDir, tokenSets, theme: { colors }, themeNames } = options;
+/**
+* Creates system token files (`$themes.json`, `$metadata.json`, `$designsystemet.jsonc`) based on the provided token set dimensions and theme names.
+*
+* `$themes.json` and `$metadata.json` are essential for Token Studio and Style Dictionary to correctly interpret and manage the design tokens.
+*/
+const createSystemTokenFiles = async (options) => {
+	const { colors, themeNames, tokenSetDimensions } = options;
+	const files = [];
 	const $themesPath = "$themes.json";
 	const $metadataPath = "$metadata.json";
 	const $designsystemetPath = "$designsystemet.jsonc";
-	const sizeModes = [
-		"small",
-		"medium",
-		"large"
-	];
-	await dsfs.mkdir(outDir);
-	const $themes = await generate$Themes(["dark", "light"], themeNames, colors, sizeModes);
-	const $metadata = generate$Metadata(["dark", "light"], themeNames, colors, sizeModes);
+	const $themes = await generate$Themes(tokenSetDimensions, themeNames, colors);
+	const $metadata = generate$Metadata(tokenSetDimensions, themeNames, colors);
 	const $designsystemet = generate$Designsystemet();
-	const files = [];
 	files.push({
 		destination: $themesPath,
 		output: stringify($themes)
@@ -31,6 +29,10 @@ const createTokenFiles = async (options) => {
 		destination: $designsystemetPath,
 		output: stringify($designsystemet)
 	});
+	return files;
+};
+const tokenSetsToFiles = (tokenSets) => {
+	const files = [];
 	for (const [set, tokens] of tokenSets) {
 		const filePath = `${set}.json`;
 		files.push({
@@ -41,4 +43,4 @@ const createTokenFiles = async (options) => {
 	return files;
 };
 //#endregion
-export { createTokenFiles, stringify };
+export { createSystemTokenFiles, stringify, tokenSetsToFiles };

package/dist/src/tokens/create/generators/$metadata.d.ts

@@ -1,8 +1,12 @@
-import type { ColorScheme } from '../../../colors/types.js';
-import type { Colors, SizeModes } from '../../types.js';
+import type { ColorNamesByCategory, TokenSetDimensions } from '../../types.js';
 type Metadata = {
     tokenSetOrder: string[];
 };
-export declare function generate$Metadata(schemes: ColorScheme[], themes: string[], colors: Colors, sizeModes: SizeModes[]): Metadata;
+/**
+ * Generates metadata for the given token set dimensions, theme names, and colors.
+ *
+ * This is used to order tokens in Token Studio
+ */
+export declare function generate$Metadata(tokenSetDimensions: TokenSetDimensions, themeNames: string[], colors: ColorNamesByCategory): Metadata;
 export {};
 //# sourceMappingURL=$metadata.d.ts.map

package/dist/src/tokens/create/generators/$metadata.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"$metadata.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/$metadata.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAExD,KAAK,QAAQ,GAAG;IACd,aAAa,EAAE,MAAM,EAAE,CAAC;CACzB,CAAC;AAEF,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,WAAW,EAAE,EACtB,MAAM,EAAE,MAAM,EAAE,EAChB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EAAE,GACrB,QAAQ,CAiBV"}
+{"version":3,"file":"$metadata.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/$metadata.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAE/E,KAAK,QAAQ,GAAG;IACd,aAAa,EAAE,MAAM,EAAE,CAAC;CACzB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,iBAAiB,CAC/B,kBAAkB,EAAE,kBAAkB,EACtC,UAAU,EAAE,MAAM,EAAE,EACpB,MAAM,EAAE,oBAAoB,GAC3B,QAAQ,CAoBV"}

package/dist/src/tokens/create/generators/$metadata.js

@@ -1,17 +1,23 @@
 //#region src/tokens/create/generators/$metadata.ts
-function generate$Metadata(schemes, themes, colors, sizeModes) {
+/**
+* Generates metadata for the given token set dimensions, theme names, and colors.
+*
+* This is used to order tokens in Token Studio
+*/
+function generate$Metadata(tokenSetDimensions, themeNames, colors) {
+	const { colorSchemes, sizeModes } = tokenSetDimensions;
 	return { tokenSetOrder: [
 		"primitives/globals",
 		...sizeModes.map((size) => `primitives/modes/size/${size}`),
 		"primitives/modes/size/global",
 		...sizeModes.map((size) => `primitives/modes/typography/size/${size}`),
-		...themes.map((theme) => `primitives/modes/typography/primary/${theme}`),
-		...themes.map((theme) => `primitives/modes/typography/secondary/${theme}`),
-		...schemes.flatMap((scheme) => [...themes.map((theme) => `primitives/modes/color-scheme/${scheme}/${theme}`)]),
-		...themes.map((theme) => `themes/${theme}`),
+		...themeNames.map((theme) => `primitives/modes/typography/primary/${theme}`),
+		...themeNames.map((theme) => `primitives/modes/typography/secondary/${theme}`),
+		...colorSchemes.flatMap((scheme) => [...themeNames.map((theme) => `primitives/modes/color-scheme/${scheme}/${theme}`)]),
+		...themeNames.map((theme) => `themes/${theme}`),
 		"semantic/color",
-		...Object.entries(colors.main).map(([color]) => `semantic/modes/main-color/${color}`),
-		...Object.entries(colors.support).map(([color]) => `semantic/modes/support-color/${color}`),
+		...colors.main.map((color) => `semantic/modes/main-color/${color}`),
+		...colors.support.map((color) => `semantic/modes/support-color/${color}`),
 		"semantic/style"
 	] };
 }

package/dist/src/tokens/create/generators/$themes.d.ts

@@ -1,7 +1,5 @@
 import { type ThemeObject } from '@tokens-studio/types';
-import type { ColorScheme } from '../../../colors/types.js';
-import type { Colors, SizeModes } from '../../types.js';
-type ColorSchemes = Array<ColorScheme>;
+import type { ColorNamesByCategory, TokenSetDimensions } from '../../types.js';
 type ThemeObject_ = ThemeObject & {
     $figmaCollectionId?: string;
     $figmaModeId?: string;
@@ -22,6 +20,6 @@ type ThemeObject_ = ThemeObject & {
  - New collections/modes may cause users hitting the cap on Figma variable modes which is at time of writing 4 (or unlimited for enterprise).
 
 */
-export declare function generate$Themes(colorSchemes: ColorSchemes, themes: string[], colors: Colors, sizeModes: SizeModes[]): Promise<ThemeObject_[]>;
+export declare function generate$Themes(tokenSetDimensions: TokenSetDimensions, themeNames: string[], colors: ColorNamesByCategory): Promise<ThemeObject_[]>;
 export {};
 //# sourceMappingURL=$themes.d.ts.map

package/dist/src/tokens/create/generators/$themes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"$themes.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/$themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAkB,MAAM,sBAAsB,CAAC;AAExE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAWxD,KAAK,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC;AAEvC,KAAK,YAAY,GAAG,WAAW,GAAG;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,wBAAwB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACnD,CAAC;AAEF;;;;;;;;;;;;;;EAcE;AACF,wBAAsB,eAAe,CACnC,YAAY,EAAE,YAAY,EAC1B,MAAM,EAAE,MAAM,EAAE,EAChB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EAAE,GACrB,OAAO,CAAC,YAAY,EAAE,CAAC,CAUzB"}
+{"version":3,"file":"$themes.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/$themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAkB,MAAM,sBAAsB,CAAC;AAGxE,OAAO,KAAK,EAAE,oBAAoB,EAAa,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAa1F,KAAK,YAAY,GAAG,WAAW,GAAG;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,wBAAwB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACnD,CAAC;AAEF;;;;;;;;;;;;;;EAcE;AACF,wBAAsB,eAAe,CACnC,kBAAkB,EAAE,kBAAkB,EACtC,UAAU,EAAE,MAAM,EAAE,EACpB,MAAM,EAAE,oBAAoB,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CAWzB"}

package/dist/src/tokens/create/generators/$themes.js

@@ -21,15 +21,16 @@ async function createHash(text, algo = "SHA-1") {
 - New collections/modes may cause users hitting the cap on Figma variable modes which is at time of writing 4 (or unlimited for enterprise).
 
 */
-async function generate$Themes(colorSchemes, themes, colors, sizeModes) {
+async function generate$Themes(tokenSetDimensions, themeNames, colors) {
+	const { colorSchemes, sizeModes } = tokenSetDimensions;
 	return [
 		...generateSizeGroup(sizeModes),
-		...await generateThemesGroup(themes),
-		...generateTypographyGroup(themes),
-		...generateColorSchemesGroup(colorSchemes, themes),
+		...await generateThemesGroup(themeNames),
+		...generateTypographyGroup(themeNames),
+		...generateColorSchemesGroup(colorSchemes, themeNames),
 		generateSemanticGroup(),
-		...await generateColorGroup("main", colors),
-		...await generateColorGroup("support", colors)
+		...await generateColorGroup("main", colors.main),
+		...await generateColorGroup("support", colors.support)
 	];
 }
 function generateSizeGroup(_sizes) {
@@ -130,7 +131,7 @@ function generateSemanticGroup() {
 	};
 }
 async function generateColorGroup(group, colors) {
-	return Promise.all(Object.entries(colors[group]).map(async ([color]) => ({
+	return Promise.all(colors.map(async (color) => ({
 		id: await createHash(`${group}-${color}`),
 		name: color,
 		selectedTokenSets: { [`semantic/modes/${group}-color/${color}`]: TokenSetStatus.ENABLED },

package/dist/src/tokens/create.d.ts

@@ -1,4 +1,5 @@
-import type { Theme, TokenSets } from './types.js';
+import type { Theme, TokenSetDimensions, TokenSets } from './types.js';
+export declare const tokenSetDimensions: TokenSetDimensions;
 export declare const cliOptions: {
     readonly outDir: "out-dir";
     readonly clean: "clean";

package/dist/src/tokens/create.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create.d.ts","sourceRoot":"","sources":["../../../src/tokens/create.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAa,KAAK,EAAY,SAAS,EAAE,MAAM,YAAY,CAAC;AAExE,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,YAAY,GAAU,OAAO,KAAK;;EA4B9C,CAAC"}
+{"version":3,"file":"create.d.ts","sourceRoot":"","sources":["../../../src/tokens/create.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,KAAK,EAAY,kBAAkB,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAEjF,eAAO,MAAM,kBAAkB,EAAE,kBAGhC,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,YAAY,GAAU,OAAO,KAAK;;EA2B9C,CAAC"}

package/dist/src/tokens/create.js

@@ -7,6 +7,14 @@ import { generateColorModes } from "./create/generators/semantic/color-modes.js"
 import { generateSemanticStyle } from "./create/generators/semantic/style.js";
 import { generateTheme } from "./create/generators/themes/theme.js";
 //#region src/tokens/create.ts
+const tokenSetDimensions = {
+	colorSchemes: ["dark", "light"],
+	sizeModes: [
+		"small",
+		"medium",
+		"large"
+	]
+};
 const cliOptions = {
 	outDir: "out-dir",
 	clean: "clean",
@@ -23,12 +31,7 @@ const cliOptions = {
 };
 const createTokens = async (theme) => {
 	const { colors, typography, name, borderRadius, overrides } = theme;
-	const colorSchemes = ["light", "dark"];
-	const sizeModes = [
-		"small",
-		"medium",
-		"large"
-	];
+	const { colorSchemes, sizeModes } = tokenSetDimensions;
 	return { tokenSets: new Map([
 		["primitives/globals", generateGlobals()],
 		...sizeModes.map((size) => [`primitives/modes/size/${size}`, generateSize(size)]),
@@ -44,4 +47,4 @@ const createTokens = async (theme) => {
 	]) };
 };
 //#endregion
-export { cliOptions, createTokens };
+export { cliOptions, createTokens, tokenSetDimensions };

package/dist/src/tokens/format.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../../../src/tokens/format.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,aAAa,EAAmB,MAAM,uBAAuB,CAAC;AAE5E,OAAO,KAAK,EAAa,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnD,eAAO,MAAM,YAAY,GAAU,SAAS,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,mBAAmB,CAAC,2DAQ5F,CAAC;AAEF,eAAO,MAAM,WAAW,GAAU,aAAa,KAAK,2DAcnD,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,GAAU,aAAa,KAAK,oBAItD,CAAC"}
+{"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../../../src/tokens/format.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,aAAa,EAAmB,MAAM,uBAAuB,CAAC;AAE5E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAGxC,eAAO,MAAM,YAAY,GAAU,SAAS,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,mBAAmB,CAAC,2DAQ5F,CAAC;AAEF,eAAO,MAAM,WAAW,GAAU,aAAa,KAAK,2DAgBnD,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,GAAU,aAAa,KAAK,oBAItD,CAAC"}

package/dist/src/tokens/format.js

@@ -1,4 +1,5 @@
-import { createTokens } from "./create.js";
+import { createTokens, tokenSetDimensions } from "./create.js";
+import { colorNamesByCategory } from "./utils.js";
 import { processThemeObject } from "./process/utils/getMultidimensionalThemes.js";
 import { processPlatform } from "./process/platform.js";
 import { createThemeCSSFiles } from "./process/output/theme.js";
@@ -16,11 +17,7 @@ const formatTheme = async (themeConfig) => {
 	const { tokenSets } = await createTokens(themeConfig);
 	return await formatTokens({
 		tokenSets,
-		processed$themes: (await generate$Themes(["dark", "light"], [themeConfig.name], themeConfig.colors, [
-			"small",
-			"medium",
-			"large"
-		])).map(processThemeObject),
+		processed$themes: (await generate$Themes(tokenSetDimensions, [themeConfig.name], colorNamesByCategory(themeConfig.colors))).map(processThemeObject),
 		verbose: false
 	});
 };

package/dist/src/tokens/process/configs.js

@@ -75,6 +75,9 @@ const getConfigsForThemeDimensions = (getConfig, processed$themes, dimensions, o
 				},
 				config: {
 					...config,
+					/** Use official W3C design token format
+					@see https://v4.styledictionary.com/info/dtcg/
+					@see https://design-tokens.github.io/community-group/format/ */
 					usesDtcg: true,
 					log: {
 						...config?.log,

package/dist/src/tokens/types.d.ts

@@ -1,5 +1,6 @@
 import type { Config as SDConfig } from 'style-dictionary/types';
 import type { ConfigSchemaTheme } from '../config.js';
+import type { ColorScheme } from '../index.js';
 import type { GetStyleDictionaryConfig } from './process/configs/shared.js';
 export type Token = {
     $value: string | Record<string, string>[];
@@ -25,6 +26,7 @@ export declare const colorCategories: {
     readonly support: "support";
 };
 export type ColorCategories = keyof typeof colorCategories;
+export type ColorNamesByCategory = Record<ColorCategories, string[]>;
 export type BuiltInColors = 'neutral' | 'success' | 'warning' | 'danger' | 'info';
 export type SizeModes = 'small' | 'medium' | 'large';
 /**
@@ -40,6 +42,10 @@ export type ThemePermutation = {
     typography: string;
 };
 export type ThemeDimension = keyof ThemePermutation;
+export type TokenSetDimensions = {
+    colorSchemes: ColorScheme[];
+    sizeModes: SizeModes[];
+};
 export type GetSDConfigOptions = {
     tokensDir?: string;
     dry?: boolean;

package/dist/src/tokens/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/tokens/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/tokens/types.ts"],"names":[],"mappings":"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"}

package/dist/src/tokens/utils.d.ts

@@ -1,6 +1,6 @@
 import type { Tokens } from 'style-dictionary';
 import type { DesignToken, TransformedToken } from 'style-dictionary/types';
-import { type ColorCategories, type TokenSet } from './types.js';
+import { type ColorCategories, type ColorNamesByCategory, type Colors, type TokenSet } from './types.js';
 /**
  * Returns type based on design token format used. Read more:https://v4.styledictionary.com/info/dtcg/
  * @param token Transformed token
@@ -60,4 +60,5 @@ export declare function inlineTokens(shouldInline: (t: TransformedToken) => bool
 export declare function shortSizeName(size: string): string;
 export declare const sizeComparator: (size: string) => number;
 export declare function orderBySize(sizes: string[]): string[];
+export declare function colorNamesByCategory(colors: Colors): ColorNamesByCategory;
 //# sourceMappingURL=utils.d.ts.map

package/dist/src/tokens/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/tokens/utils.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC5E,OAAO,EAAE,KAAK,eAAe,EAAmB,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAC;AAMlF;;;;GAIG;AACH,eAAO,MAAM,OAAO,GAAI,OAAO,gBAAgB,WAAkD,CAAC;AAElG;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,EAAE,OAAO,gBAAgB,GAAG,WAAW,KAAG,CAAuC,CAAC;AAE5G;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,KAAK,EAAE,gBAAgB,KAAK,OAQ/E,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,gBAAgB,KAAK,OAAO,CAAC,GACpG,CAAC,CAAC,KAAK,EAAE,CAAC,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,KAAK,EAAE,gBAAgB,KAAK,OAAO,CAcxE,CAAC;AAEF,wBAAgB,eAAe,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO,CAEhE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO,CAEpF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO,CAEnE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,gBAAgB,EAAE,QAAQ,CAAC,EAAE,eAAe,GAAG,OAAO,CAOjG;AAED,eAAO,MAAM,OAAO,GAAI,GAAG,MAAM,YAAoB,CAAC;AAEtD;2HAC2H;AAC3H,wBAAgB,WAAW,CACzB,GAAG,EAAE,MAAM,GAAG,QAAQ,EACtB,EAAE,EAAE,CAAC,GAAG,EAAE,QAAQ,GAAG,MAAM,GAAG,WAAW,EAAE,GAAG,EAAE,MAAM,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,MAAM,KAAK,IAAI,4DAYrH;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,sBAetG;AAUD,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAElD;AAED,eAAO,MAAM,cAAc,GAAI,MAAM,MAAM,KAAG,MAG7C,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,CAErD"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/tokens/utils.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC5E,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,oBAAoB,EACzB,KAAK,MAAM,EAEX,KAAK,QAAQ,EACd,MAAM,YAAY,CAAC;AAMpB;;;;GAIG;AACH,eAAO,MAAM,OAAO,GAAI,OAAO,gBAAgB,WAAkD,CAAC;AAElG;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,EAAE,OAAO,gBAAgB,GAAG,WAAW,KAAG,CAAuC,CAAC;AAE5G;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,KAAK,EAAE,gBAAgB,KAAK,OAQ/E,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,gBAAgB,KAAK,OAAO,CAAC,GACpG,CAAC,CAAC,KAAK,EAAE,CAAC,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,KAAK,EAAE,gBAAgB,KAAK,OAAO,CAcxE,CAAC;AAEF,wBAAgB,eAAe,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO,CAEhE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO,CAEpF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO,CAEnE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,gBAAgB,EAAE,QAAQ,CAAC,EAAE,eAAe,GAAG,OAAO,CAOjG;AAED,eAAO,MAAM,OAAO,GAAI,GAAG,MAAM,YAAoB,CAAC;AAEtD;2HAC2H;AAC3H,wBAAgB,WAAW,CACzB,GAAG,EAAE,MAAM,GAAG,QAAQ,EACtB,EAAE,EAAE,CAAC,GAAG,EAAE,QAAQ,GAAG,MAAM,GAAG,WAAW,EAAE,GAAG,EAAE,MAAM,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,MAAM,KAAK,IAAI,4DAYrH;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,sBAetG;AAUD,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAElD;AAED,eAAO,MAAM,cAAc,GAAI,MAAM,MAAM,KAAG,MAG7C,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,CAErD;AAED,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,MAAM,GAAG,oBAAoB,CAMzE"}

package/dist/src/tokens/utils.js

@@ -117,5 +117,10 @@ const sizeComparator = (size) => {
 function orderBySize(sizes) {
 	return R.sortBy(sizeComparator, sizes);
 }
+function colorNamesByCategory(colors) {
+	const result = {};
+	for (const category of Object.values(colorCategories)) result[category] = Object.keys(colors[category] ?? {});
+	return result;
+}
 //#endregion
-export { getType, getValue, inlineTokens, isColorCategoryToken, isDigit, isGlobalColorToken, isSemanticColorToken, isSemanticToken, orderBySize, pathStartsWithOneOf, shortSizeName, sizeComparator, traverseObj, typeEquals };
+export { colorNamesByCategory, getType, getValue, inlineTokens, isColorCategoryToken, isDigit, isGlobalColorToken, isSemanticColorToken, isSemanticToken, orderBySize, pathStartsWithOneOf, shortSizeName, sizeComparator, traverseObj, typeEquals };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digdir/designsystemet",
-  "version": "1.13.3",
+  "version": "1.14.0",
   "description": "CLI for Designsystemet",
   "author": "Designsystemet team",
   "engines": {
@@ -45,12 +45,12 @@
     "hsluv": "^1.0.1",
     "object-hash": "^3.0.0",
     "picocolors": "^1.1.1",
-    "postcss": "^8.5.8",
+    "postcss": "^8.5.13",
     "ramda": "^0.32.0",
     "style-dictionary": "^5.4.0",
-    "zod": "^4.3.6",
+    "zod": "^4.4.2",
     "zod-validation-error": "^5.0.0",
-    "@digdir/designsystemet-types": "1.13.3"
+    "@digdir/designsystemet-types": "1.14.0"
   },
   "devDependencies": {
     "@tokens-studio/types": "0.5.2",
@@ -58,7 +58,7 @@
     "@types/node": "24.12.2",
     "@types/object-hash": "3.0.6",
     "@types/ramda": "0.31.1",
-    "tsdown": "0.21.9",
+    "tsdown": "0.21.10",
     "tsx": "4.21.0",
     "typescript": "5.9.3"
   },