@digdir/designsystemet 1.12.1 → 1.13.1

package/dist/bin/designsystemet.js

@@ -1,9 +1,10 @@
 #!/usr/bin/env node
 
 // bin/designsystemet.ts
+import path4 from "path";
 import { Argument, createCommand, program } from "@commander-js/extra-typings";
-import pc12 from "picocolors";
-import * as R29 from "ramda";
+import pc11 from "picocolors";
+import * as R28 from "ramda";
 
 // src/colors/colorMetadata.ts
 import * as R from "ramda";
@@ -392,7 +393,7 @@ var cssClassRename = (dictionary) => ({
 var cssVarRename = (dictionary) => ({
   postcssPlugin: `Replaces CSS variables ${hash(dictionary)}`,
   Declaration(decl) {
-    const { value, prop: prop4 } = decl;
+    const { value, prop: prop3 } = decl;
     const deleted = /* @__PURE__ */ new Set();
     for (const [from, to] of Object.entries(dictionary)) {
       if (R4.isNotEmpty(to)) {
@@ -403,8 +404,8 @@ var cssVarRename = (dictionary) => ({
           decl.value = value.replace(from, to);
           continue;
         }
-        if (R4.includes(from, prop4) && decl.variable) {
-          decl.prop = prop4.replace(from, to);
+        if (R4.includes(from, prop3) && decl.variable) {
+          decl.prop = prop3.replace(from, to);
         }
       }
     }
@@ -415,58 +416,133 @@ var cssVarRename = (dictionary) => ({
 });
 
 // src/migrations/codemods/css/run.ts
-import fs2 from "fs";
 import glob from "fast-glob";
 import postcss from "postcss";
 
-// src/utils.ts
+// src/utils/filesystem.ts
 import fs from "fs/promises";
+import path from "path";
 import pc2 from "picocolors";
-var mkdir = async (dir, dry) => {
-  if (dry) {
-    console.log(`${pc2.blue("mkdir")} ${dir}`);
-    return Promise.resolve();
-  }
-  const exists = await fs.access(dir, fs.constants.F_OK).then(() => true).catch(() => false);
-  if (exists) {
-    return Promise.resolve();
-  }
-  return fs.mkdir(dir, { recursive: true });
-};
-var writeFile = async (path6, data, dry) => {
-  if (dry) {
-    console.log(`${pc2.blue("writeFile")} ${path6}`);
-    return Promise.resolve();
-  }
-  return fs.writeFile(path6, data, { encoding: "utf-8" }).catch((error) => {
-    console.error(pc2.red(`Error writing file: ${path6}`));
-    console.error(pc2.red(error));
-    throw error;
-  });
-};
-var cleanDir = async (dir, dry) => {
-  if (dry) {
-    console.log(`${pc2.blue("cleanDir")} ${dir}`);
-    return Promise.resolve();
+var FileSystem = class {
+  isInitialized = false;
+  dry = false;
+  verbose = false;
+  /** Default working directory is where the process was started */
+  workingDir = process.cwd();
+  outDir = this.workingDir;
+  /** Initialize the file system */
+  init({ dry, outdir, verbose }) {
+    if (this.isInitialized) {
+      console.warn(pc2.yellow("FileSystem is already initialized. Ignoring subsequent init call."));
+      return;
+    }
+    if (dry) {
+      console.log(pc2.blue("Initializing FileSystem in dry-run mode. No files will be written."));
+    }
+    this.dry = dry ?? false;
+    this.verbose = verbose ?? false;
+    this.outDir = outdir ? path.isAbsolute(outdir) ? outdir : path.join(this.workingDir, outdir) : this.workingDir;
+    if (this.verbose) {
+      console.log(
+        `FileSystem initialized with workingDir: ${pc2.green(this.workingDir)}, outDir: ${pc2.green(this.outDir)}`
+      );
+    }
+    this.isInitialized = true;
   }
-  console.log(`
+  /**
+   * Creates a directory if it does not already exist.
+   *
+   * @param dir - The path of the directory to create.
+   *
+   * @returns A promise that resolves when the operation is complete.
+   * If the directory already exists or `dry` is `true`, the promise resolves immediately.
+   */
+  mkdir = async (dir) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("mkdir")} ${dir}`);
+      return Promise.resolve();
+    }
+    const exists = await fs.access(dir, fs.constants.F_OK).then(() => true).catch(() => false);
+    if (exists) {
+      return Promise.resolve();
+    }
+    return fs.mkdir(dir, { recursive: true });
+  };
+  writeFile = async (path5, data) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("writeFile")} ${path5}`);
+      return Promise.resolve();
+    }
+    return fs.writeFile(path5, data, { encoding: "utf-8" }).catch((error) => {
+      console.error(pc2.red(`Error writing file: ${path5}`));
+      console.error(pc2.red(error));
+      throw error;
+    });
+  };
+  cp = async (src, dest, filter) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("cp")} ${src} ${dest}`);
+      return Promise.resolve();
+    }
+    return fs.cp(src, dest, { recursive: true, filter });
+  };
+  copyFile = async (src, dest) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("copyFile")} ${src} to ${dest}`);
+      return Promise.resolve();
+    }
+    return fs.copyFile(src, dest);
+  };
+  cleanDir = async (dir) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("cleanDir")} ${dir}`);
+      return Promise.resolve();
+    }
+    console.log(`
 \u{1F525} Cleaning dir ${pc2.red(`${dir.trim()}`)} `);
-  return fs.rm(dir, { recursive: true, force: true });
-};
-var readFile = async (path6, dry, allowFileNotFound) => {
-  if (dry) {
-    console.log(`${pc2.blue("readFile")} ${path6}`);
-    return Promise.resolve("");
-  }
-  try {
-    return await fs.readFile(path6, "utf-8");
-  } catch (error) {
-    if (allowFileNotFound && error.code === "ENOENT") {
-      return "";
+    return fs.rm(dir, { recursive: true, force: true });
+  };
+  readFile = async (path5, allowFileNotFound) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("readFile")} ${path5}`);
     }
-    throw error;
-  }
+    try {
+      return await fs.readFile(path5, "utf-8");
+    } catch (error) {
+      if (allowFileNotFound && error.code === "ENOENT") {
+        return "";
+      }
+      throw error;
+    }
+  };
+  readdir = async (path5) => {
+    if (this.dry) {
+      console.log(`${pc2.blue("readdir")} ${path5}`);
+    }
+    try {
+      return await fs.readdir(path5);
+    } catch (error) {
+      if (error.code === "ENOENT") {
+        return [];
+      }
+      throw error;
+    }
+  };
+  writeFiles = async (files, outDir, log) => {
+    for (const { destination: filename, output } of files) {
+      if (filename) {
+        const filePath = path.join(outDir, filename);
+        const fileDir = path.dirname(filePath);
+        if (log) {
+          console.log(filename);
+        }
+        await this.mkdir(fileDir);
+        await this.writeFile(filePath, output);
+      }
+    }
+  };
 };
+var dsfs = new FileSystem();
 
 // src/migrations/codemods/css/run.ts
 var runCssCodemod = async ({ plugins = [], globPattern = "./**/*.css" }) => {
@@ -482,9 +558,9 @@ var runCssCodemod = async ({ plugins = [], globPattern = "./**/*.css" }) => {
       if (file.includes("node_modules") || file.includes("dist")) {
         return;
       }
-      const contents = readFile(file).toString();
-      const result = await processor.process(contents, { from: file });
-      fs2.writeFileSync(file, result.css);
+      const contents = await dsfs.readFile(file);
+      const result = await processor.process(contents.toString(), { from: file });
+      await dsfs.writeFile(file, result.css);
     });
     await Promise.all(filePromises);
   };
@@ -874,7 +950,6 @@ var migrations_default = {
 };
 
 // src/tokens/build.ts
-import path from "path";
 import pc7 from "picocolors";
 import * as R22 from "ramda";
 
@@ -884,11 +959,11 @@ import pc5 from "picocolors";
 // package.json
 var package_default = {
   name: "@digdir/designsystemet",
-  version: "1.12.1",
+  version: "1.13.1",
   description: "CLI for Designsystemet",
   author: "Designsystemet team",
   engines: {
-    node: ">=20 <25"
+    node: ">=20.20.1"
   },
   repository: {
     type: "git",
@@ -952,16 +1027,16 @@ var package_default = {
     hsluv: "^1.0.1",
     "object-hash": "^3.0.0",
     picocolors: "^1.1.1",
-    postcss: "^8.5.6",
+    postcss: "^8.5.8",
     ramda: "^0.32.0",
-    "style-dictionary": "^5.3.0",
+    "style-dictionary": "^5.3.3",
     zod: "^4.3.6",
     "zod-validation-error": "^5.0.0"
   },
   devDependencies: {
     "@tokens-studio/types": "0.5.2",
     "@types/chroma-js": "^3.1.2",
-    "@types/node": "^24.10.13",
+    "@types/node": "^24.12.0",
     "@types/object-hash": "^3.0.6",
     "@types/ramda": "^0.31.1",
     tsup: "^8.5.1",
@@ -1007,8 +1082,8 @@ var pathStartsWithOneOf = R6.curry(
     }
     const tokenPath = mapToLowerCase(token.path);
     const matchPathsStartingWith = R6.map((pathOrString) => {
-      const path6 = typeof pathOrString === "string" ? [pathOrString] : pathOrString;
-      return R6.startsWith(mapToLowerCase(path6), tokenPath);
+      const path5 = typeof pathOrString === "string" ? [pathOrString] : pathOrString;
+      return R6.startsWith(mapToLowerCase(path5), tokenPath);
     }, paths);
     return hasAnyTruth(matchPathsStartingWith);
   }
@@ -1033,11 +1108,11 @@ function isColorCategoryToken(token, category) {
 var isDigit = (s) => /^\d+$/.test(s);
 function traverseObj(obj, fn) {
   for (const key in obj) {
-    const prop4 = obj[key];
-    if (prop4 != null) {
-      fn.apply(null, [obj, key, prop4]);
-      if (typeof prop4 === "object") {
-        traverseObj(prop4, fn);
+    const prop3 = obj[key];
+    if (prop3 != null) {
+      fn.apply(null, [obj, key, prop3]);
+      if (typeof prop3 === "object") {
+        traverseObj(prop3, fn);
       }
     }
   }
@@ -2449,8 +2524,8 @@ ${dynamicColors}`;
 import pc6 from "picocolors";
 import * as R21 from "ramda";
 var defaultFileHeader2 = `build: v${package_default.version}`;
-var getFileNameWithoutExtension = (path6) => {
-  const pathSegments = path6.split("/");
+var getFileNameWithoutExtension = (path5) => {
+  const pathSegments = path5.split("/");
   return pathSegments[pathSegments.length - 1].split(".").slice(0, -1).join(".");
 };
 var createThemeCSSFiles = ({
@@ -2530,25 +2605,13 @@ ${fileHeader}
 };
 
 // src/tokens/build.ts
-async function write(files, outDir, dry) {
-  for (const { destination, output } of files) {
-    if (destination) {
-      const filePath = path.join(outDir, destination);
-      const fileDir = path.dirname(filePath);
-      console.log(destination);
-      await mkdir(fileDir, dry);
-      await writeFile(filePath, output, dry);
-    }
-  }
-}
 var buildTokens = async (options) => {
-  const outDir = path.resolve(options.outDir);
-  const tokensDir = path.resolve(options.tokensDir);
-  const $themes = JSON.parse(await readFile(`${tokensDir}/$themes.json`));
+  const tokensDir = options.tokensDir;
+  const $themes = JSON.parse(await dsfs.readFile(`${tokensDir}/$themes.json`));
   const processed$themes = $themes.map(processThemeObject);
   let $designsystemet;
   try {
-    const $designsystemetContent = await readFile(`${tokensDir}/$designsystemet.jsonc`);
+    const $designsystemetContent = await dsfs.readFile(`${tokensDir}/$designsystemet.jsonc`);
     $designsystemet = JSON.parse($designsystemetContent);
   } catch (_error) {
   }
@@ -2556,7 +2619,6 @@ var buildTokens = async (options) => {
 \u{1F3D7}\uFE0F Start building tokens in ${pc7.green(tokensDir)}`);
   const processedBuilds = await processPlatform({
     ...options,
-    outDir,
     tokensDir,
     type: "build",
     processed$themes,
@@ -2575,19 +2637,9 @@ design-tokens: v${$designsystemet.version}` : ""
     const tailwindFiles = createTailwindCSSFiles(cssFiles);
     files = files.concat(tailwindFiles.filter(Boolean));
   }
-  console.log(`
-\u{1F4BE} Writing build to ${pc7.green(outDir)}`);
-  await write(files, outDir, options.dry);
-  console.log(`
-\u2705 Finished building tokens!`);
-  return processedBuilds;
+  return files;
 };
 
-// src/tokens/create/write.ts
-import path2 from "path";
-import pc8 from "picocolors";
-import * as R23 from "ramda";
-
 // src/tokens/create/generators/$designsystemet.ts
 function generate$Designsystemet() {
   return {
@@ -2783,56 +2835,36 @@ function generateTypographyGroup(themes) {
   ];
 }
 
-// src/tokens/create/write.ts
+// src/tokens/create/files.ts
 var stringify = (data) => JSON.stringify(data, null, 2);
-var writeTokens = async (options) => {
+var createTokenFiles = async (options) => {
   const {
     outDir,
     tokenSets,
-    theme: { name: themeName, colors: colors2 },
-    dry
+    theme: { colors: colors2 },
+    themeNames
   } = options;
-  const targetDir = path2.resolve(process.cwd(), String(outDir));
-  const $themesPath = path2.join(targetDir, "$themes.json");
-  const $metadataPath = path2.join(targetDir, "$metadata.json");
-  const $designsystemetPath = path2.join(targetDir, "$designsystemet.jsonc");
-  let themeObjects = [];
+  const $themesPath = "$themes.json";
+  const $metadataPath = "$metadata.json";
+  const $designsystemetPath = "$designsystemet.jsonc";
   const sizeModes2 = ["small", "medium", "large"];
-  await mkdir(targetDir, dry);
-  try {
-    const $themes2 = await readFile($themesPath);
-    if ($themes2) {
-      themeObjects = JSON.parse($themes2);
-    }
-  } catch (_error) {
-  }
-  const concatThemeNames = R23.pipe(
-    R23.filter((obj) => R23.toLower(obj.group || "") === "theme"),
-    R23.map(R23.prop("name")),
-    // New theme is added to the end of the list so we keep the same order from config and Token Studio
-    R23.append(themeName),
-    R23.uniq
-  );
-  const themes = concatThemeNames(themeObjects);
-  console.log(`
-Themes: ${pc8.blue(themes.join(", "))}`);
-  const $themes = await generate$Themes(["dark", "light"], themes, colors2, sizeModes2);
-  const $metadata = generate$Metadata(["dark", "light"], themes, colors2, sizeModes2);
+  await dsfs.mkdir(outDir);
+  const $themes = await generate$Themes(["dark", "light"], themeNames, colors2, sizeModes2);
+  const $metadata = generate$Metadata(["dark", "light"], themeNames, colors2, sizeModes2);
   const $designsystemet = generate$Designsystemet();
-  await writeFile($themesPath, stringify($themes), dry);
-  await writeFile($metadataPath, stringify($metadata), dry);
-  await writeFile($designsystemetPath, stringify($designsystemet), dry);
+  const files = [];
+  files.push({ destination: $themesPath, output: stringify($themes) });
+  files.push({ destination: $metadataPath, output: stringify($metadata) });
+  files.push({ destination: $designsystemetPath, output: stringify($designsystemet) });
   for (const [set4, tokens] of tokenSets) {
-    const fileDir = path2.join(targetDir, path2.dirname(set4));
-    await mkdir(fileDir, dry);
-    const filePath = path2.join(targetDir, `${set4}.json`);
-    await writeFile(filePath, stringify(tokens), dry);
+    const filePath = `${set4}.json`;
+    files.push({ destination: filePath, output: stringify(tokens) });
   }
-  console.log(`Finished creating Designsystem design tokens in ${pc8.green(outDir)} for theme ${pc8.blue(themeName)}`);
+  return files;
 };
 
 // src/tokens/create/generators/primitives/color-scheme.ts
-import * as R24 from "ramda";
+import * as R23 from "ramda";
 var generateColor = (colorArray, overrides) => {
   const obj = {};
   const $type = "color";
@@ -2869,11 +2901,11 @@ var generateColorScheme = (themeName, colorScheme2, colors2, overrides) => {
     });
     return Object.keys(positionOverrides).length > 0 ? positionOverrides : void 0;
   };
-  const main = R24.mapObjIndexed(
+  const main = R23.mapObjIndexed(
     (color, colorName) => generateColor(generateColorScale(color, colorScheme2), createColorOverrides(colorName)),
     colors2.main
   );
-  const support = R24.mapObjIndexed(
+  const support = R23.mapObjIndexed(
     (color, colorName) => generateColor(generateColorScale(color, colorScheme2), createColorOverrides(colorName)),
     colors2.support
   );
@@ -2883,7 +2915,7 @@ var generateColorScheme = (themeName, colorScheme2, colors2, overrides) => {
     ...baseColors,
     ...overrides?.severity
   };
-  const globalColors = R24.mapObjIndexed(
+  const globalColors = R23.mapObjIndexed(
     (color, colorName) => generateColor(generateColorScale(color, colorScheme2), createColorOverrides(colorName)),
     baseColorsWithOverrides
   );
@@ -3435,7 +3467,7 @@ var fontSizes = {
 };
 
 // src/tokens/create/generators/semantic/color.ts
-import * as R25 from "ramda";
+import * as R24 from "ramda";
 var generateSemanticColors = (colors2, _themeName) => {
   const mainColorNames = Object.keys(colors2.main);
   const supportColorNames = Object.keys(colors2.support);
@@ -3474,7 +3506,7 @@ var baseColorTemplate = {
 };
 var generateColorScaleTokens = (colorName) => {
   const colorScale = {};
-  for (const [colorSemantic, colorNumber] of R25.toPairs(semanticColorMap)) {
+  for (const [colorSemantic, colorNumber] of R24.toPairs(semanticColorMap)) {
     colorScale[colorSemantic] = {
       $type: "color",
       $value: `{color.${colorName}.${colorNumber}}`
@@ -3902,7 +3934,7 @@ function generateSemanticStyle() {
 }
 
 // src/tokens/create/generators/themes/theme.ts
-import * as R26 from "ramda";
+import * as R25 from "ramda";
 var generateTheme = (colors2, themeName, borderRadius) => {
   const mainColorNames = Object.keys(colors2.main);
   const supportColorNames = Object.keys(colors2.support);
@@ -3934,8 +3966,8 @@ var generateTheme = (colors2, themeName, borderRadius) => {
     },
     ...remainingThemeFile
   };
-  const baseBorderRadius = R26.lensPath(["border-radius", "base", "$value"]);
-  const updatedThemeFile = R26.set(baseBorderRadius, String(borderRadius), themeFile);
+  const baseBorderRadius = R25.lensPath(["border-radius", "base", "$value"]);
+  const updatedThemeFile = R25.set(baseBorderRadius, String(borderRadius), themeFile);
   const token = JSON.parse(
     JSON.stringify(
       updatedThemeFile,
@@ -4007,7 +4039,7 @@ var generateBase = (themeName) => ({
 });
 var generateColorScaleTokens3 = (colorName, themeName) => {
   const colorScale = {};
-  for (const [_, colorNumber] of R26.toPairs(semanticColorMap)) {
+  for (const [_, colorNumber] of R25.toPairs(semanticColorMap)) {
     colorScale[colorNumber] = {
       $type: "color",
       $value: `{${themeName}.${colorName}.${colorNumber}}`
@@ -4062,12 +4094,11 @@ var createTokens = async (theme) => {
 };
 
 // src/tokens/generate-config.ts
-import fs3 from "fs/promises";
-import path3 from "path";
-import pc9 from "picocolors";
+import path2 from "path";
+import pc8 from "picocolors";
 async function readJsonFile(filePath) {
   try {
-    const content = await fs3.readFile(filePath, "utf-8");
+    const content = await dsfs.readFile(filePath);
     return JSON.parse(content);
   } catch (err) {
     throw new Error(`Failed to read token file at ${filePath}: ${err instanceof Error ? err.message : String(err)}`);
@@ -4083,21 +4114,21 @@ function extractBaseColor(colorScale) {
   return null;
 }
 async function discoverThemes(tokensDir) {
-  const lightModePath = path3.join(tokensDir, "themes");
+  const lightModePath = path2.join(tokensDir, "themes");
   try {
-    const files = await fs3.readdir(lightModePath);
+    const files = await dsfs.readdir(lightModePath);
     const themes = files.filter((file) => file.endsWith(".json")).map((file) => file.replace(".json", ""));
     return themes;
   } catch {
-    throw new Error(`Could not find themes. Make sure ${pc9.blue(lightModePath)} exists and contains theme JSON files.`);
+    throw new Error(`Could not find themes. Make sure ${pc8.blue(lightModePath)} exists and contains theme JSON files.`);
   }
 }
 async function readThemeTokens(tokensDir, themeName) {
-  const themePath = path3.join(tokensDir, "primitives", "modes", "color-scheme", "light", `${themeName}.json`);
+  const themePath = path2.join(tokensDir, "primitives", "modes", "color-scheme", "light", `${themeName}.json`);
   return readJsonFile(themePath);
 }
 async function readThemeConfig(tokensDir, themeName) {
-  const themeConfigPath = path3.join(tokensDir, "themes", `${themeName}.json`);
+  const themeConfigPath = path2.join(tokensDir, "themes", `${themeName}.json`);
   try {
     return await readJsonFile(themeConfigPath);
   } catch {
@@ -4131,7 +4162,7 @@ function extractFontFamily(themeConfig) {
   return void 0;
 }
 async function readTypographyConfig(tokensDir, themeName) {
-  const typographyConfigPath = path3.join(
+  const typographyConfigPath = path2.join(
     tokensDir,
     "primitives",
     "modes",
@@ -4191,33 +4222,33 @@ function categorizeColors(themeTokens, themeName) {
   return { main, support, neutral };
 }
 async function generateConfigFromTokens(options) {
-  const { tokensDir, dry = false } = options;
+  const { tokensDir } = options;
   console.log(`
-Reading tokens from ${pc9.blue(tokensDir)}`);
+Reading tokens from ${pc8.blue(tokensDir)}`);
   const themes = await discoverThemes(tokensDir);
   if (themes.length === 0) {
     throw new Error(`
-No themes found in ${pc9.blue(tokensDir)}`);
+No themes found in ${pc8.blue(tokensDir)}`);
   }
   console.log(`
-Found ${pc9.green(String(themes.length))} theme(s): ${themes.map((t) => pc9.cyan(t)).join(", ")}`);
+Found ${pc8.green(String(themes.length))} theme(s): ${themes.map((t) => pc8.cyan(t)).join(", ")}`);
   const config = {
     outDir: tokensDir,
     themes: {}
   };
   for (const themeName of themes) {
     console.log(`
-Processing theme ${pc9.cyan(themeName)}...`);
+Processing theme ${pc8.cyan(themeName)}...`);
     const themeTokens = await readThemeTokens(tokensDir, themeName);
     const themeConfig = await readThemeConfig(tokensDir, themeName);
     const typographyConfig = await readTypographyConfig(tokensDir, themeName);
     const { main, support, neutral } = categorizeColors(themeTokens, themeName);
     if (Object.keys(main).length === 0) {
-      console.warn(pc9.yellow(`
+      console.warn(pc8.yellow(`
 Warning: No main colors found for theme ${themeName}`));
     }
     if (!neutral) {
-      console.warn(pc9.yellow(`
+      console.warn(pc8.yellow(`
 Warning: No neutral color found for theme ${themeName}`));
       continue;
     }
@@ -4234,46 +4265,38 @@ Warning: No neutral color found for theme ${themeName}`));
     };
     console.log(
       `
-\u2705 Main colors: ${Object.keys(main).map((c) => pc9.cyan(c)).join(", ") || pc9.dim("none")}`
+\u2705 Main colors: ${Object.keys(main).map((c) => pc8.cyan(c)).join(", ") || pc8.dim("none")}`
     );
     console.log(
       `
-\u2705 Support colors: ${Object.keys(support).map((c) => pc9.cyan(c)).join(", ") || pc9.dim("none")}`
+\u2705 Support colors: ${Object.keys(support).map((c) => pc8.cyan(c)).join(", ") || pc8.dim("none")}`
     );
     console.log(`
-\u2705 Neutral: ${pc9.cyan(neutral)}`);
+\u2705 Neutral: ${pc8.cyan(neutral)}`);
     if (borderRadius !== void 0) {
       console.log(`
-\u2705 Border radius: ${pc9.cyan(String(borderRadius))}`);
+\u2705 Border radius: ${pc8.cyan(String(borderRadius))}`);
     }
     if (fontFamily) {
       console.log(`
-\u2705 Font family: ${pc9.cyan(fontFamily)}`);
+\u2705 Font family: ${pc8.cyan(fontFamily)}`);
     }
   }
-  if (!dry && options.outFile) {
-    const configJson = JSON.stringify(config, null, 2);
-    await fs3.writeFile(options.outFile, configJson, "utf-8");
-    console.log();
-    console.log(`
-\u2705 Config file written to ${pc9.blue(options.outFile)}`);
-  }
   return config;
 }
 
 // bin/config.ts
-import path5 from "path";
-import pc11 from "picocolors";
-import * as R28 from "ramda";
-
-// src/config.ts
 import pc10 from "picocolors";
 import * as R27 from "ramda";
+
+// src/config.ts
+import pc9 from "picocolors";
+import * as R26 from "ramda";
 import { z } from "zod";
 import { fromError } from "zod-validation-error";
-function mapPathToOptionName(path6) {
-  const normalisedPath = path6[0] === "themes" ? ["theme", ...R27.drop(2, path6)] : path6;
-  const option = R27.path(normalisedPath, cliOptions);
+function mapPathToOptionName(path5) {
+  const normalisedPath = path5[0] === "themes" ? ["theme", ...R26.drop(2, path5)] : path5;
+  const option = R26.path(normalisedPath, cliOptions);
   if (typeof option !== "string") {
     return;
   }
@@ -4287,33 +4310,33 @@ function makeFriendlyError(err) {
         const optionName = mapPathToOptionName(issue.path);
         const errorCode = `(error code: ${issue.code})`;
         const optionMessage = optionName ? ` or CLI option --${optionName}` : "";
-        return `  - Error in JSON value ${pc10.red(issuePath)}${optionMessage}:
-      ${issue.message} ${pc10.dim(errorCode)}`;
+        return `  - Error in JSON value ${pc9.red(issuePath)}${optionMessage}:
+      ${issue.message} ${pc9.dim(errorCode)}`;
       }).join("\n")
     });
   } catch (_err2) {
-    console.error(pc10.red(err instanceof Error ? err.message : "Unknown error occurred while parsing config file"));
+    console.error(pc9.red(err instanceof Error ? err.message : "Unknown error occurred while parsing config file"));
     console.error(err instanceof Error ? err.stack : "No stack trace available");
   }
 }
-function validateConfig(schema, unvalidatedConfig, configPath) {
+function validateConfig(schema, unvalidatedConfig, configFilePath) {
   try {
     return schema.parse(unvalidatedConfig);
   } catch (err) {
-    console.error(pc10.redBright(`Invalid config file at ${pc10.red(configPath)}`));
+    console.error(pc9.redBright(`Invalid config file at ${pc9.red(configFilePath)}`));
     const validationError = makeFriendlyError(err);
     console.error(validationError?.toString());
     process.exit(1);
   }
 }
-function parseConfig(configFile, configPath) {
+function parseConfig(configFile, configFilePath) {
   if (!configFile) {
     return {};
   }
   try {
     return JSON.parse(configFile);
   } catch (err) {
-    console.error(pc10.redBright(`Failed parsing config file at ${pc10.red(configPath)}`));
+    console.error(pc9.redBright(`Failed parsing config file at ${pc9.red(configFilePath)}`));
     const validationError = makeFriendlyError(err);
     console.error(validationError?.toString());
     process.exit(1);
@@ -4404,32 +4427,31 @@ var getDefaultCliOption = getOptionIfMatchingSource("default");
 var getCliOption = getOptionIfMatchingSource("cli", "default");
 
 // bin/config.ts
-async function readConfigFile(configPath, allowFileNotFound = true) {
-  const resolvedPath = path5.resolve(process.cwd(), configPath);
+async function readConfigFile(configFilePath, allowFileNotFound = true) {
   let configFile;
   try {
-    configFile = await readFile(resolvedPath, false, allowFileNotFound);
+    configFile = await dsfs.readFile(configFilePath, allowFileNotFound);
   } catch (err) {
     if (allowFileNotFound) {
       return "";
     }
-    console.error(pc11.redBright(`Could not read config file at ${pc11.blue(resolvedPath)}`));
+    console.error(pc10.redBright(`Could not read config file at ${pc10.blue(configFilePath)}`));
     throw err;
   }
   if (configFile) {
-    console.log(`Found config file: ${pc11.green(resolvedPath)}`);
+    console.log(`Found config file: ${pc10.green(configFilePath)}`);
   }
   return configFile;
 }
 async function parseCreateConfig(configFile, options) {
-  const { cmd, theme = "theme", configPath } = options;
-  const configParsed = parseConfig(configFile, configPath);
+  const { cmd, theme = "theme", configFilePath } = options;
+  const configParsed = parseConfig(configFile, configFilePath);
   const themeColors = Object.values(configParsed?.themes ?? {}).map(
-    (x) => /* @__PURE__ */ new Set([...R28.keys(x.colors.main), ...R28.keys(x.colors.support)])
+    (x) => /* @__PURE__ */ new Set([...R27.keys(x.colors.main), ...R27.keys(x.colors.support)])
   );
-  if (!R28.all(R28.equals(R28.__, themeColors[0]), themeColors)) {
-    console.error(pc11.redBright(`In config, all themes must have the same custom color names, but we found:`));
-    const themeNames = R28.keys(configParsed.themes ?? {});
+  if (!R27.all(R27.equals(R27.__, themeColors[0]), themeColors)) {
+    console.error(pc10.redBright(`In config, all themes must have the same custom color names, but we found:`));
+    const themeNames = R27.keys(configParsed.themes ?? {});
     themeColors.forEach((colors2, index) => {
       const colorNames2 = Array.from(colors2);
       console.log(`  - ${themeNames[index]}: ${colorNames2.join(", ")}`);
@@ -4437,7 +4459,7 @@ async function parseCreateConfig(configFile, options) {
     console.log();
     process.exit(1);
   }
-  const noUndefined = R28.reject(R28.isNil);
+  const noUndefined = R27.reject(R27.isNil);
   const getThemeOptions = (optionGetter) => noUndefined({
     colors: noUndefined({
       main: optionGetter(cmd, "mainColors"),
@@ -4453,10 +4475,10 @@ async function parseCreateConfig(configFile, options) {
   const unvalidatedConfig = noUndefined({
     outDir: configParsed?.outDir ?? getCliOption(cmd, "outDir"),
     clean: configParsed?.clean ?? getCliOption(cmd, "clean"),
-    themes: configParsed?.themes ? R28.map((jsonThemeValues) => {
+    themes: configParsed?.themes ? R27.map((jsonThemeValues) => {
       const defaultThemeValues = getThemeOptions(getDefaultCliOption);
       const cliThemeValues = getThemeOptions(getSuppliedCliOption);
-      const mergedConfigs = R28.mergeDeepRight(defaultThemeValues, R28.mergeDeepRight(jsonThemeValues, cliThemeValues));
+      const mergedConfigs = R27.mergeDeepRight(defaultThemeValues, R27.mergeDeepRight(jsonThemeValues, cliThemeValues));
       return mergedConfigs;
     }, configParsed.themes) : (
       // If there are no themes specified in the JSON config, we use both explicit
@@ -4466,11 +4488,7 @@ async function parseCreateConfig(configFile, options) {
       }
     )
   });
-  return validateConfig(configFileCreateSchema, unvalidatedConfig, configPath);
-}
-async function parseBuildConfig(configFile, { configPath }) {
-  const configParsed = parseConfig(configFile, configPath);
-  return validateConfig(commonConfig, configParsed, configPath);
+  return validateConfig(configFileCreateSchema, unvalidatedConfig, configFilePath);
 }
 
 // bin/designsystemet.ts
@@ -4489,81 +4507,104 @@ var DEFAULT_TOKENS_CREATE_DIR = "./design-tokens";
 var DEFAULT_TOKENS_BUILD_DIR = "./design-tokens-build";
 var DEFAULT_FONT = "Inter";
 var DEFAULT_THEME_NAME = "theme";
-var DEFAULT_CONFIG_FILE = "designsystemet.config.json";
+var DEFAULT_CONFIG_FILEPATH = "designsystemet.config.json";
 function makeTokenCommands() {
   const tokenCmd = createCommand("tokens");
-  tokenCmd.command("build").description("Build Designsystemet tokens").option("-t, --tokens <string>", `Path to ${pc12.blue("design-tokens")}`, DEFAULT_TOKENS_CREATE_DIR).option(
+  tokenCmd.command("build").description("Build Designsystemet tokens").option("-t, --tokens <string>", `Path to ${pc11.blue("design-tokens")}`, DEFAULT_TOKENS_CREATE_DIR).option(
     "-o, --out-dir <string>",
-    `Output directory for built ${pc12.blue("design-tokens")}`,
+    `Output directory for built ${pc11.blue("design-tokens")}`,
     DEFAULT_TOKENS_BUILD_DIR
-  ).option(`--${cliOptions.clean} [boolean]`, "Clean output directory before building tokens", parseBoolean, false).option("--dry [boolean]", `Dry run for built ${pc12.blue("design-tokens")}`, parseBoolean, false).option("--verbose", "Enable verbose output", false).option("--config <string>", `Path to config file (default: "${DEFAULT_CONFIG_FILE}")`).option("--experimental-tailwind", "Generate Tailwind CSS classes for tokens", false).action(async (opts) => {
+  ).option(`--${cliOptions.clean} [boolean]`, "Clean output directory before building tokens", parseBoolean, false).option("--dry [boolean]", `Dry run for built ${pc11.blue("design-tokens")}`, parseBoolean, false).option("--verbose", "Enable verbose output", false).option("--config <string>", `Path to config file (default: "${DEFAULT_CONFIG_FILEPATH}")`).option("--experimental-tailwind", "Generate Tailwind CSS classes for tokens", false).action(async (opts) => {
     console.log(figletAscii);
-    const { verbose, clean, dry, experimentalTailwind } = opts;
-    const tokensDir = typeof opts.tokens === "string" ? opts.tokens : DEFAULT_TOKENS_CREATE_DIR;
-    const outDir = typeof opts.outDir === "string" ? opts.outDir : "./dist/tokens";
-    const { configFile, configPath } = await getConfigFile(opts.config);
-    const config = await parseBuildConfig(configFile, { configPath });
-    if (dry) {
-      console.log(`Performing dry run, no files will be written`);
-    }
+    const { verbose, clean, dry, experimentalTailwind, tokens } = opts;
+    dsfs.init({ dry, outdir: opts.outDir, verbose });
+    const outDir = dsfs.outDir;
     if (clean) {
-      await cleanDir(outDir, dry);
+      await dsfs.cleanDir(outDir);
     }
-    await buildTokens({ tokensDir, outDir, verbose, dry, tailwind: experimentalTailwind, ...config });
+    const files = await buildTokens({
+      tokensDir: tokens,
+      verbose,
+      tailwind: experimentalTailwind
+    });
+    console.log(`
+\u{1F4BE} Writing build to ${pc11.green(outDir)}`);
+    await dsfs.writeFiles(files, outDir, true);
+    console.log(`
+\u2705 Finished building tokens in ${pc11.green(outDir)}`);
     return Promise.resolve();
   });
   tokenCmd.command("create").description("Create Designsystemet tokens").option(`-m, --${cliOptions.theme.colors.main} <name:hex...>`, `Main colors`, parseColorValues).option(`-s, --${cliOptions.theme.colors.support} <name:hex...>`, `Support colors`, parseColorValues).option(`-n, --${cliOptions.theme.colors.neutral} <hex>`, `Neutral hex color`, convertToHex).option(
     `-o, --${cliOptions.outDir} <string>`,
-    `Output directory for created ${pc12.blue("design-tokens")}`,
+    `Output directory for created ${pc11.blue("design-tokens")}`,
     DEFAULT_TOKENS_CREATE_DIR
-  ).option(`--${cliOptions.clean} [boolean]`, "Clean output directory before creating tokens", parseBoolean, false).option("--dry [boolean]", `Dry run for created ${pc12.blue("design-tokens")}`, parseBoolean, false).option(`-f, --${cliOptions.theme.typography.fontFamily} <string>`, `Font family (experimental)`, DEFAULT_FONT).option(
+  ).option(`--${cliOptions.clean} [boolean]`, "Clean output directory before creating tokens", parseBoolean, false).option("--dry [boolean]", `Dry run for created ${pc11.blue("design-tokens")}`, parseBoolean, false).option(`-f, --${cliOptions.theme.typography.fontFamily} <string>`, `Font family (experimental)`, DEFAULT_FONT).option(
     `-b, --${cliOptions.theme.borderRadius} <number>`,
     `Unitless base border-radius in px`,
     (radiusAsString) => Number(radiusAsString),
     4
-  ).option("--theme <string>", "Theme name (ignored when using JSON config file)", DEFAULT_THEME_NAME).option("--config <string>", `Path to config file (default: "${DEFAULT_CONFIG_FILE}")`).action(async (opts, cmd) => {
+  ).option("--theme <string>", "Theme name (ignored when using JSON config file)", DEFAULT_THEME_NAME).option("--config <string>", `Path to config file (default: "${DEFAULT_CONFIG_FILEPATH}")`).action(async (opts, cmd) => {
     console.log(figletAscii);
     if (opts.dry) {
       console.log(`Performing dry run, no files will be written`);
     }
-    const { configFile, configPath } = await getConfigFile(opts.config);
+    const themeName = opts.theme;
+    const { configFile, configFilePath } = await getConfigFile(opts.config);
     const config = await parseCreateConfig(configFile, {
-      theme: opts.theme,
+      theme: themeName,
       cmd,
-      configPath
+      configFilePath
     });
+    const themeNames = Object.keys(config.themes);
+    if (themeNames.length > 0) {
+      console.log(`Using themes from config file: ${pc11.blue(themeNames.join(", "))}`);
+    }
+    dsfs.init({ dry: opts.dry, outdir: config.outDir });
+    const outDir = dsfs.outDir;
     if (config.clean) {
-      await cleanDir(config.outDir, opts.dry);
+      await dsfs.cleanDir(outDir);
     }
+    let files = [];
     if (config.themes) {
       for (const [name, themeWithoutName] of Object.entries(config.themes)) {
         const theme = { name, ...themeWithoutName };
         const { tokenSets } = await createTokens(theme);
-        await writeTokens({ outDir: config.outDir, theme, dry: opts.dry, tokenSets });
+        files = files.concat(await createTokenFiles({ outDir, theme, tokenSets, themeNames }));
       }
     }
+    await dsfs.writeFiles(files, outDir);
+    console.log(`
+\u2705 Finished creating tokens in ${pc11.green(outDir)} for themes: ${pc11.blue(themeNames.join(", "))}`);
+    return Promise.resolve();
   });
   return tokenCmd;
 }
 program.addCommand(makeTokenCommands());
-program.command("generate-config-from-tokens").description("Generate a config file from existing design tokens. Will not include overrides.").option("-d, --dir <string>", "Path to design tokens directory", DEFAULT_TOKENS_CREATE_DIR).option("-o, --out <string>", "Output path for config file", DEFAULT_CONFIG_FILE).option("--dry [boolean]", "Dry run - show config without writing file", parseBoolean, false).action(async (opts) => {
+program.command("generate-config-from-tokens").description("Generate a config file from existing design tokens. Will not include overrides.").option("-d, --dir <string>", "Path to design tokens directory", DEFAULT_TOKENS_CREATE_DIR).option("-o, --out <string>", "Output path for config file", DEFAULT_CONFIG_FILEPATH).option("--dry [boolean]", "Dry run - show config without writing file", parseBoolean, false).action(async (opts) => {
   console.log(figletAscii);
   const { dry } = opts;
-  const tokensDir = typeof opts.dir === "string" ? opts.dir : DEFAULT_TOKENS_CREATE_DIR;
-  const outFile = typeof opts.out === "string" ? opts.out : DEFAULT_CONFIG_FILE;
+  const tokensDir = path4.resolve(opts.dir);
+  const configFilePath = path4.resolve(opts.out);
+  dsfs.init({ dry, outdir: path4.dirname(configFilePath) });
   try {
     const config = await generateConfigFromTokens({
       tokensDir,
-      outFile: dry ? void 0 : outFile,
-      dry
+      outFile: configFilePath
     });
     if (dry) {
       console.log();
       console.log("Generated config (dry run):");
       console.log(JSON.stringify(config, null, 2));
     }
+    if (configFilePath) {
+      const configJson = JSON.stringify(config, null, 2);
+      await dsfs.writeFile(configFilePath, configJson);
+      console.log();
+      console.log(`
+\u2705 Config file written to ${pc11.blue(configFilePath)}`);
+    }
   } catch (error) {
-    console.error(pc12.redBright("Error generating config:"));
+    console.error(pc11.redBright("Error generating config:"));
     console.error(error instanceof Error ? error.message : String(error));
     process.exit(1);
   }
@@ -4581,8 +4622,8 @@ program.command("migrate").description("run a Designsystemet migration").addArgu
       console.error("Migration not found!");
       throw "Aborting";
     }
-    console.log(`Applying migration ${pc12.blue(migrationKey)} with glob: ${pc12.green(glob2)}`);
-    migration?.(glob2).then(() => console.log(`Migration ${pc12.blue(migrationKey)} finished`)).catch((error) => console.log(error));
+    console.log(`Applying migration ${pc11.blue(migrationKey)} with glob: ${pc11.green(glob2)}`);
+    migration?.(glob2).then(() => console.log(`Migration ${pc11.blue(migrationKey)} finished`)).catch((error) => console.log(error));
   } else {
     console.log("Migrate: please specify a migration name or --list");
   }
@@ -4596,11 +4637,11 @@ function parseColorValues(value, previous = {}) {
 function parseBoolean(value) {
   return value === "true" || value === true;
 }
-async function getConfigFile(config) {
-  const allowFileNotFound = R29.isNil(config) || config === DEFAULT_CONFIG_FILE;
-  const configPath = config ?? DEFAULT_CONFIG_FILE;
-  const configFile = await readConfigFile(configPath, allowFileNotFound);
-  return { configFile, configPath };
+async function getConfigFile(userConfigFilePath) {
+  const allowFileNotFound = R28.isNil(userConfigFilePath) || userConfigFilePath === DEFAULT_CONFIG_FILEPATH;
+  const configFilePath = userConfigFilePath ?? DEFAULT_CONFIG_FILEPATH;
+  const configFile = await readConfigFile(configFilePath, allowFileNotFound);
+  return { configFile, configFilePath };
 }
 export {
   figletAscii