@digdir/designsystemet 0.1.0-next.31 → 1.0.0-next.33

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/tokens/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,MAAM,KAAK,GAAG;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AACtD,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AAC/C,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;AACpD,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC;AACpE,MAAM,MAAM,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC;AAE7D,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,SAAS,CAAC;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;CAC1B,CAAC;AAGF,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC;AAGzC,MAAM,MAAM,MAAM,GAAG;IACnB,MAAM,EAAE;QACN,KAAK,EAAE,eAAe,CAAC;QACvB,IAAI,EAAE,eAAe,CAAC;QACtB,QAAQ,EAAE,eAAe,CAAC;KAC3B,CAAC;IACF,UAAU,EAAE;QACV,OAAO,EAAE,SAAS,CAAC;KACpB,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;AACnD,MAAM,MAAM,UAAU,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACjD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,WAAW,CAAC;AAEtD,MAAM,MAAM,IAAI,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ,CAAC"}

package/dist/types/src/tokens/write/generate$metadata.d.ts

@@ -0,0 +1,8 @@
+import type { ColorMode } from '../../colors/types.js';
+type ColorModes = Array<ColorMode>;
+type Metadata = {
+    tokenSetOrder: string[];
+};
+export declare function generateMetadataJson(modes: ColorModes, themes: string[]): Metadata;
+export {};
+//# sourceMappingURL=generate$metadata.d.ts.map

package/dist/types/src/tokens/write/generate$metadata.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate$metadata.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/write/generate$metadata.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,KAAK,UAAU,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;AAEnC,KAAK,QAAQ,GAAG;IACd,aAAa,EAAE,MAAM,EAAE,CAAC;CACzB,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,CAiBlF"}

package/dist/types/src/tokens/write/generate$themes.d.ts

@@ -0,0 +1,10 @@
+import { type ThemeObject } from '@tokens-studio/types';
+import type { ColorMode } from '../../colors/types.js';
+type ColorModes = Array<ColorMode>;
+type ThemeObject_ = ThemeObject & {
+    $figmaCollectionId?: string;
+    $figmaModeId?: string;
+};
+export declare function generateThemesJson(modes: ColorModes, themes: string[]): ThemeObject_[];
+export {};
+//# sourceMappingURL=generate$themes.d.ts.map

package/dist/types/src/tokens/write/generate$themes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate$themes.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/write/generate$themes.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,WAAW,EAAkB,MAAM,sBAAsB,CAAC;AAExE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAQvD,KAAK,UAAU,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;AAEnC,KAAK,YAAY,GAAG,WAAW,GAAG;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,YAAY,EAAE,CAQtF"}

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

@@ -0,0 +1,10 @@
+import type { Tokens } from './types.js';
+export declare const stringify: (data: unknown) => string;
+type WriteTokensOptions = {
+    writeDir: string;
+    tokens: Tokens;
+    themeName: string;
+};
+export declare const writeTokens: (options: WriteTokensOptions) => Promise<void>;
+export {};
+//# sourceMappingURL=write.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"write.d.ts","sourceRoot":"","sources":["../../../../src/tokens/write.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAoB,MAAM,EAA8B,MAAM,YAAY,CAAC;AAQvF,eAAO,MAAM,SAAS,SAAU,OAAO,WAAkC,CAAC;AAyB1E,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,WAAW,YAAmB,kBAAkB,kBA6D5D,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digdir/designsystemet",
-  "version": "0.1.0-next.31",
+  "version": "1.0.0-next.33",
   "description": "CLI for Designsystemet",
   "author": "Designsystemet team",
   "repository": {
@@ -20,9 +20,9 @@
       "types": "./dist/types/src/colors/index.d.ts",
       "import": "./dist/src/colors/index.js"
     },
-    "./tokens": {
-      "types": "./dist/types/src/tokens/index.d.ts",
-      "import": "./dist/src/tokens/index.js"
+    "./tokens/*": {
+      "types": "./dist/types/src/tokens/*",
+      "import": "./dist/src/tokens/*"
     }
   },
   "publishConfig": {
@@ -36,7 +36,8 @@
     "build:swc": "yarn clean && swc src bin --copy-files -d dist && yarn build:types",
     "build:types": "tsc --emitDeclarationOnly --declaration",
     "clean": "rimraf dist",
-    "clean:theme": "yarn workspace @digdir/designsystemet-theme clean"
+    "clean:theme": "yarn workspace @digdir/designsystemet-theme clean",
+    "update:template": "tsx ./src/tokens/template.ts"
   },
   "dependencies": {
     "@adobe/leonardo-contrast-colors": "^1.0.0",

package/dist/src/tokens/create/README.md

@@ -1,3 +0,0 @@
-```sh
-yarn workspace @digdir/designsystemet designsystemet tokens create --accent AD00BA --neutral 749ACB --brand1 D03539 --brand2 20E53A --brand3 F2F51E --font-family Arial --write ./../../../sandbox/test-tokens-august/design-tokens
-```

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

@@ -1,150 +0,0 @@
-import fs from "node:fs/promises";
-import path from "node:path";
-import * as R from "ramda";
-import { baseColors, generateScaleForColor } from "../../colors/index.js";
-import generateMetadataJson from "../../init/generateMetadataJson.js";
-import generateThemesJson from "../../init/generateThemesJson.js";
-const DIRNAME = import.meta.dirname || __dirname;
-const DEFAULT_FILES_PATH = path.join(DIRNAME, "../../init/template/default-files/design-tokens/");
-const createColorTokens = (colorArray) => {
-  const obj = {};
-  const $type = "color";
-  for (let i = 0; i < colorArray.length; i++) {
-    if (i === 13 && colorArray.length >= 14) {
-      obj["contrast-1"] = {
-        $type,
-        $value: colorArray[i].hex
-      };
-    } else if (i === 14 && colorArray.length >= 15) {
-      obj["contrast-2"] = {
-        $type,
-        $value: colorArray[i].hex
-      };
-    } else {
-      obj[i + 1] = { $type, $value: colorArray[i].hex };
-    }
-  }
-  return obj;
-};
-const generateTypographyTokens = ({ family }) => {
-  return {
-    theme: {
-      main: {
-        $type: "fontFamilies",
-        $value: family
-      },
-      bold: {
-        $type: "fontWeights",
-        $value: "Medium"
-      },
-      "extra-bold": {
-        $type: "fontWeights",
-        $value: "Semi bold"
-      },
-      regular: {
-        $type: "fontWeights",
-        $value: "Regular"
-      }
-    }
-  };
-};
-const generateThemeTokens = (theme, colors) => {
-  const accentColors = generateScaleForColor(colors.accent, theme);
-  const neutralColors = generateScaleForColor(colors.neutral, theme);
-  const brand1Colors = generateScaleForColor(colors.brand1, theme);
-  const brand2Colors = generateScaleForColor(colors.brand2, theme);
-  const brand3Colors = generateScaleForColor(colors.brand3, theme);
-  return {
-    theme: {
-      accent: createColorTokens(accentColors),
-      neutral: createColorTokens(neutralColors),
-      brand1: createColorTokens(brand1Colors),
-      brand2: createColorTokens(brand2Colors),
-      brand3: createColorTokens(brand3Colors)
-    }
-  };
-};
-const generateColorModeFile = (folder, name, tokens, outPath) => {
-  const path2 = `${outPath}/primitives/modes/colors/${folder}`;
-  return {
-    data: JSON.stringify(tokens, null, 2),
-    path: path2,
-    filePath: `${path2}/${name}.json`
-  };
-};
-const generateTypographyFile = (folder, name, tokens, outPath) => {
-  const path2 = `${outPath}/primitives/modes/typography/${folder}`;
-  return {
-    data: JSON.stringify(tokens, null, 2),
-    path: path2,
-    filePath: `${path2}/${name}.json`
-  };
-};
-const generateGlobalTokens = (theme) => {
-  const blueScale = generateScaleForColor(baseColors.blue, theme);
-  const greenScale = generateScaleForColor(baseColors.green, theme);
-  const orangeScale = generateScaleForColor(baseColors.orange, theme);
-  const purpleScale = generateScaleForColor(baseColors.purple, theme);
-  const redScale = generateScaleForColor(baseColors.red, theme);
-  const yellowScale = generateScaleForColor(baseColors.yellow, theme);
-  return {
-    global: {
-      blue: createColorTokens(blueScale),
-      green: createColorTokens(greenScale),
-      orange: createColorTokens(orangeScale),
-      purple: createColorTokens(purpleScale),
-      red: createColorTokens(redScale),
-      yellow: createColorTokens(yellowScale)
-    }
-  };
-};
-const createTokens = async (opts) => {
-  const { colors, write, typography } = opts;
-  const tokens = {
-    colors: {
-      light: {
-        theme: generateThemeTokens("light", colors),
-        global: generateGlobalTokens("light")
-      },
-      dark: { theme: generateThemeTokens("dark", colors), global: generateGlobalTokens("dark") },
-      contrast: { theme: generateThemeTokens("contrast", colors), global: generateGlobalTokens("contrast") }
-    },
-    typography: {
-      primary: generateTypographyTokens(typography)
-    }
-  };
-  if (R.isNotNil(write)) {
-    const targetDir = path.resolve(process.cwd(), String(write));
-    await fs.mkdir(targetDir, { recursive: true });
-    console.log("Generating metadata and themes files");
-    const $theme = generateThemesJson(["Light", "Dark", "Contrast"], ["theme"]);
-    const $metadata = generateMetadataJson(["Light", "Dark", "Contrast"], ["theme"]);
-    await fs.writeFile(path.join(targetDir, "$themes.json"), JSON.stringify($theme, null, 2));
-    await fs.writeFile(path.join(targetDir, "$metadata.json"), JSON.stringify($metadata, null, 2));
-    console.log(`Copying default files to ${targetDir}`);
-    await fs.cp(DEFAULT_FILES_PATH, targetDir, {
-      recursive: true
-    });
-    const files = [
-      generateColorModeFile("light", "theme", tokens.colors.light.theme, targetDir),
-      generateColorModeFile("light", "global", tokens.colors.light.global, targetDir),
-      generateColorModeFile("dark", "theme", tokens.colors.dark.theme, targetDir),
-      generateColorModeFile("dark", "global", tokens.colors.dark.global, targetDir),
-      generateColorModeFile("contrast", "theme", tokens.colors.contrast.theme, targetDir),
-      generateColorModeFile("contrast", "global", tokens.colors.contrast.global, targetDir),
-      generateTypographyFile("primary", "theme", tokens.typography.primary, targetDir),
-      generateTypographyFile("secondary", "theme", tokens.typography.primary, targetDir)
-    ];
-    for (const file of files) {
-      const dirPath = path.resolve(file.path);
-      const filePath = path.resolve(file.filePath);
-      console.log(`Writing file ${filePath}`);
-      await fs.mkdir(dirPath, { recursive: true });
-      await fs.writeFile(filePath, file.data, { encoding: "utf-8" });
-    }
-  }
-  return tokens;
-};
-export {
-  createTokens
-};

package/dist/src/tokens/index.js

@@ -1,4 +0,0 @@
-import { createTokens } from "./create/index.js";
-export {
-  createTokens
-};

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/build/index.ts"],"names":[],"mappings":"AAaA,KAAK,OAAO,GAAG;IACb,0BAA0B;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,GAAG,EAAE,MAAM,CAAC;IACZ,8BAA8B;IAC9B,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAMF,wBAAsB,WAAW,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CA4FjE"}

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

@@ -1,64 +0,0 @@
-import type { CssColor } from '@adobe/leonardo-contrast-colors';
-import type { ThemeColors } from '../../colors/index.js';
-type Colors = Record<ThemeColors, CssColor>;
-type Typography = Record<string, string>;
-type CreateTokens = {
-    colors: Colors;
-    typography: Typography;
-    write?: string;
-};
-type DesignTokens = Record<string, {
-    $value: string;
-    $type: string;
-}>;
-type Tokens2ary = Record<string, Record<string, DesignTokens>>;
-type Tokens1ary = Record<string, DesignTokens>;
-type Tokens = Tokens1ary | Tokens2ary;
-export declare const createTokens: (opts: CreateTokens) => Promise<{
-    colors: {
-        light: {
-            theme: Tokens;
-            global: {
-                global: {
-                    blue: DesignTokens;
-                    green: DesignTokens;
-                    orange: DesignTokens;
-                    purple: DesignTokens;
-                    red: DesignTokens;
-                    yellow: DesignTokens;
-                };
-            };
-        };
-        dark: {
-            theme: Tokens;
-            global: {
-                global: {
-                    blue: DesignTokens;
-                    green: DesignTokens;
-                    orange: DesignTokens;
-                    purple: DesignTokens;
-                    red: DesignTokens;
-                    yellow: DesignTokens;
-                };
-            };
-        };
-        contrast: {
-            theme: Tokens;
-            global: {
-                global: {
-                    blue: DesignTokens;
-                    green: DesignTokens;
-                    orange: DesignTokens;
-                    purple: DesignTokens;
-                    red: DesignTokens;
-                    yellow: DesignTokens;
-                };
-            };
-        };
-    };
-    typography: {
-        primary: Tokens;
-    };
-}>;
-export {};
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAGhE,OAAO,KAAK,EAAwB,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAI/E,KAAK,MAAM,GAAG,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;AAC5C,KAAK,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAGzC,KAAK,YAAY,GAAG;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,UAAU,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAQF,KAAK,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AACtE,KAAK,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC;AAC/D,KAAK,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;AAC/C,KAAK,MAAM,GAAG,UAAU,GAAG,UAAU,CAAC;AA2GtC,eAAO,MAAM,YAAY,SAAgB,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuDpD,CAAC"}

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

@@ -1,2 +0,0 @@
-export { createTokens } from './create/index.js';
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/tokens/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC"}