@digdir/designsystemet 1.0.7 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/dist/bin/config.d.ts +12 -0
  2. package/dist/bin/config.d.ts.map +1 -0
  3. package/dist/bin/config.js +517 -0
  4. package/dist/bin/designsystemet.js +3699 -3572
  5. package/dist/config.schema.json +1 -0
  6. package/dist/src/colors/index.d.ts +2 -2
  7. package/dist/src/colors/index.d.ts.map +1 -1
  8. package/dist/src/colors/index.js +143 -143
  9. package/dist/src/colors/theme.d.ts +1 -2
  10. package/dist/src/colors/theme.d.ts.map +1 -1
  11. package/dist/src/config.d.ts +25 -14
  12. package/dist/src/config.d.ts.map +1 -1
  13. package/dist/src/config.js +68 -24
  14. package/dist/src/index.js +431 -404
  15. package/dist/src/migrations/beta-to-v1.js +9 -2
  16. package/dist/src/migrations/codemods/css/run.js +9 -2
  17. package/dist/src/migrations/color-rename-next49.js +9 -2
  18. package/dist/src/migrations/index.js +9 -2
  19. package/dist/src/scripts/createJsonSchema.js +28 -23
  20. package/dist/src/scripts/update-template.d.ts.map +1 -1
  21. package/dist/src/scripts/update-template.js +9 -2
  22. package/dist/src/tokens/build.d.ts +1 -1
  23. package/dist/src/tokens/build.d.ts.map +1 -1
  24. package/dist/src/tokens/build.js +140 -57
  25. package/dist/src/tokens/create/generators/$designsystemet.js +13 -14
  26. package/dist/src/tokens/create/generators/color.js +21 -21
  27. package/dist/src/tokens/create/write.js +23 -17
  28. package/dist/src/tokens/create.d.ts +1 -0
  29. package/dist/src/tokens/create.d.ts.map +1 -1
  30. package/dist/src/tokens/create.js +22 -21
  31. package/dist/src/tokens/format.d.ts +1 -1
  32. package/dist/src/tokens/format.d.ts.map +1 -1
  33. package/dist/src/tokens/format.js +916 -890
  34. package/dist/src/tokens/index.d.ts +2 -2
  35. package/dist/src/tokens/index.d.ts.map +1 -1
  36. package/dist/src/tokens/index.js +308 -281
  37. package/dist/src/tokens/process/configs/color.d.ts.map +1 -1
  38. package/dist/src/tokens/process/configs/color.js +17 -15
  39. package/dist/src/tokens/process/configs/semantic.d.ts.map +1 -1
  40. package/dist/src/tokens/process/configs/semantic.js +16 -14
  41. package/dist/src/tokens/process/configs/storefront.d.ts.map +1 -1
  42. package/dist/src/tokens/process/configs/storefront.js +12 -2
  43. package/dist/src/tokens/process/configs/typography.d.ts.map +1 -1
  44. package/dist/src/tokens/process/configs/typography.js +16 -14
  45. package/dist/src/tokens/process/configs.d.ts.map +1 -1
  46. package/dist/src/tokens/process/configs.js +18 -31
  47. package/dist/src/tokens/process/formats/css/color.js +5 -3
  48. package/dist/src/tokens/process/formats/css/semantic.js +2 -2
  49. package/dist/src/tokens/process/formats/css/typography.js +1 -1
  50. package/dist/src/tokens/process/formats/css.js +8 -6
  51. package/dist/src/tokens/process/formats/js-tokens.js +12 -2
  52. package/dist/src/tokens/process/output/tailwind.d.ts +3 -0
  53. package/dist/src/tokens/process/output/tailwind.d.ts.map +1 -0
  54. package/dist/src/tokens/process/output/tailwind.js +59 -0
  55. package/dist/src/tokens/process/{theme.d.ts → output/theme.d.ts} +2 -2
  56. package/dist/src/tokens/process/output/theme.d.ts.map +1 -0
  57. package/dist/src/tokens/process/{theme.js → output/theme.js} +16 -17
  58. package/dist/src/tokens/process/platform.d.ts +6 -6
  59. package/dist/src/tokens/process/platform.d.ts.map +1 -1
  60. package/dist/src/tokens/process/platform.js +46 -19
  61. package/dist/src/tokens/process/utils/getMultidimensionalThemes.js +10 -9
  62. package/dist/src/tokens/types.d.ts +3 -3
  63. package/dist/src/tokens/types.d.ts.map +1 -1
  64. package/dist/src/tokens/utils.d.ts +2 -2
  65. package/dist/src/tokens/utils.d.ts.map +1 -1
  66. package/dist/src/tokens/utils.js +11 -1
  67. package/dist/src/utils.d.ts +1 -1
  68. package/dist/src/utils.d.ts.map +1 -1
  69. package/dist/src/utils.js +9 -2
  70. package/package.json +13 -14
  71. package/dist/src/tokens/process/theme.d.ts.map +0 -1
@@ -1,27 +1,6 @@
1
1
  // src/tokens/create/generators/color.ts
2
2
  import * as R3 from "ramda";
3
3
 
4
- // src/colors/utils.ts
5
- import chroma from "chroma-js";
6
- import Colorjs from "colorjs.io";
7
- import { Hsluv } from "hsluv";
8
- var getLuminanceFromLightness = (lightness) => {
9
- const conv = new Hsluv();
10
- conv.hsluv_l = lightness;
11
- conv.hsluvToHex();
12
- return chroma(conv.hex).luminance();
13
- };
14
- var getLightnessFromHex = (hex) => {
15
- const conv = new Hsluv();
16
- conv.hex = hex;
17
- conv.hexToHsluv();
18
- return conv.hsluv_l;
19
- };
20
-
21
- // src/colors/theme.ts
22
- import chroma2 from "chroma-js";
23
- import * as R2 from "ramda";
24
-
25
4
  // src/colors/colorMetadata.ts
26
5
  import * as R from "ramda";
27
6
  var baseColors = {
@@ -275,6 +254,27 @@ var colorMetadata = {
275
254
  };
276
255
  var colorMetadataByNumber = R.indexBy((metadata) => metadata.number, Object.values(colorMetadata));
277
256
 
257
+ // src/colors/theme.ts
258
+ import chroma2 from "chroma-js";
259
+ import * as R2 from "ramda";
260
+
261
+ // src/colors/utils.ts
262
+ import chroma from "chroma-js";
263
+ import Colorjs from "colorjs.io";
264
+ import { Hsluv } from "hsluv";
265
+ var getLuminanceFromLightness = (lightness) => {
266
+ const conv = new Hsluv();
267
+ conv.hsluv_l = lightness;
268
+ conv.hsluvToHex();
269
+ return chroma(conv.hex).luminance();
270
+ };
271
+ var getLightnessFromHex = (hex) => {
272
+ const conv = new Hsluv();
273
+ conv.hex = hex;
274
+ conv.hexToHsluv();
275
+ return conv.hsluv_l;
276
+ };
277
+
278
278
  // src/colors/theme.ts
279
279
  var generateColorScale = (color, colorScheme) => {
280
280
  let interpolationColor = color;
@@ -28,18 +28,25 @@ var writeFile = async (path2, data, dry) => {
28
28
  throw error;
29
29
  });
30
30
  };
31
- var readFile = async (path2, dry) => {
31
+ var readFile = async (path2, dry, allowFileNotFound) => {
32
32
  if (dry) {
33
33
  console.log(`${chalk.blue("readFile")} ${path2}`);
34
34
  return Promise.resolve("");
35
35
  }
36
- return fs.readFile(path2, "utf-8");
36
+ try {
37
+ return await fs.readFile(path2, "utf-8");
38
+ } catch (error) {
39
+ if (allowFileNotFound && error.code === "ENOENT") {
40
+ return "";
41
+ }
42
+ throw error;
43
+ }
37
44
  };
38
45
 
39
46
  // package.json
40
47
  var package_default = {
41
48
  name: "@digdir/designsystemet",
42
- version: "1.0.7",
49
+ version: "1.1.0",
43
50
  description: "CLI for Designsystemet",
44
51
  author: "Designsystemet team",
45
52
  engines: {
@@ -49,7 +56,7 @@ var package_default = {
49
56
  type: "git",
50
57
  url: "git+https://github.com/digdir/designsystemet.git"
51
58
  },
52
- homepage: "https://github.com/digdir/designsystemet/tree/main/scripts/cli",
59
+ homepage: "https://github.com/digdir/designsystemet/tree/main/packages/cli",
53
60
  license: "MIT",
54
61
  type: "module",
55
62
  main: "./dist/src/index.js",
@@ -74,8 +81,6 @@ var package_default = {
74
81
  },
75
82
  scripts: {
76
83
  designsystemet: "tsx ./bin/designsystemet.ts",
77
- "build:tokens": "pnpm run designsystemet tokens build -p -t ../../internal/design-tokens -o ../../packages/theme/brand --clean",
78
- "build:tokens:debug": "tsx --inspect-brk ./bin/designsystemet.ts tokens build -p -t ../../internal/design-tokens -o ../../packages/theme/brand --clean",
79
84
  build: "tsup && pnpm build:types && pnpm build:json-schema",
80
85
  "build:types": "tsc --emitDeclarationOnly --declaration",
81
86
  "build:json-schema": "tsx ./src/scripts/createJsonSchema.ts",
@@ -83,17 +88,20 @@ var package_default = {
83
88
  "test:tokens-create-options": 'pnpm run designsystemet tokens create -m dominant:"#007682" -n "#003333" -b 99 -o ./temp/options/design-tokens --theme options --clean',
84
89
  "test:tokens-create-config": "pnpm run designsystemet tokens create --config ./configs/test-tokens.config.json",
85
90
  "test:tokens-build": "pnpm run designsystemet tokens build -t ./temp/options/design-tokens -o ./temp/options/build --clean",
91
+ "test:tokens-build-tailwind": "pnpm run designsystemet tokens build -t ./temp/options/design-tokens -o ./temp/options/build --clean --experimental-tailwind",
86
92
  "test:tokens-build-config": "pnpm run designsystemet tokens build -t ./temp/config/design-tokens -o ./temp/config/build --clean",
93
+ "test:tokens-build-config-tailwind": "pnpm run designsystemet tokens build -t ./temp/config/design-tokens -o ./temp/config/build --clean --experimental-tailwind",
87
94
  "test:tokens-create-and-build-options": "pnpm test:tokens-create-options && pnpm test:tokens-build",
88
95
  "test:tokens-create-and-build-config": "pnpm test:tokens-create-config && pnpm test:tokens-build-config",
89
96
  test: "pnpm test:tokens-create-and-build-options && pnpm test:tokens-create-and-build-config",
97
+ "digdir:tokens-build": "pnpm run designsystemet tokens build -t ../../internal/design-tokens -o ../../packages/theme/brand --clean --experimental-tailwind",
90
98
  "digdir:tokens-create": "pnpm run designsystemet tokens create --config ./configs/digdir.config.json",
91
99
  "update:template": "tsx ./src/scripts/update-template.ts",
92
- "update:design-tokens": "pnpm digdir:tokens-create && tsx ./src/scripts/update-design-tokens.ts",
93
- verify: "pnpm test && pnpm update:template && pnpm update:design-tokens"
100
+ "update:theme-digdir": "pnpm digdir:tokens-create && tsx ./src/scripts/update-design-tokens.ts && pnpm digdir:tokens-build",
101
+ verify: "pnpm test && pnpm update:template && pnpm update:theme-digdir && pnpm build:tokens"
94
102
  },
95
103
  dependencies: {
96
- "@commander-js/extra-typings": "^13.1.0",
104
+ "@commander-js/extra-typings": "^14.0.0",
97
105
  "@tokens-studio/sd-transforms": "1.3.0",
98
106
  "apca-w3": "^0.1.9",
99
107
  chalk: "^5.4.1",
@@ -104,11 +112,11 @@ var package_default = {
104
112
  "fast-glob": "^3.3.3",
105
113
  hsluv: "^1.0.1",
106
114
  "object-hash": "^3.0.0",
107
- postcss: "^8.5.3",
115
+ postcss: "^8.5.5",
108
116
  ramda: "^0.30.1",
109
117
  "style-dictionary": "^4.4.0",
110
- zod: "^3.25.30",
111
- "zod-validation-error": "^3.4.1"
118
+ zod: "^3.25.64",
119
+ "zod-validation-error": "^3.5.0"
112
120
  },
113
121
  devDependencies: {
114
122
  "@tokens-studio/types": "0.5.2",
@@ -116,15 +124,13 @@ var package_default = {
116
124
  "@types/chroma-js": "^3.1.1",
117
125
  "@types/fs-extra": "^11.0.4",
118
126
  "@types/glob": "^8.1.0",
119
- "@types/jscodeshift": "^0.12.0",
120
- "@types/node": "^22.15.21",
127
+ "@types/node": "^22.15.31",
121
128
  "@types/object-hash": "^3.0.6",
122
129
  "@types/ramda": "^0.30.2",
123
130
  "fs-extra": "^11.3.0",
124
- "ts-toolbelt": "^9.6.0",
125
131
  tslib: "^2.8.1",
126
132
  tsup: "^8.5.0",
127
- tsx: "^4.19.4",
133
+ tsx: "^4.20.3",
128
134
  typescript: "^5.8.3"
129
135
  }
130
136
  };
@@ -515,7 +521,7 @@ var writeTokens = async (options) => {
515
521
  if ($themes2) {
516
522
  themeObjects = JSON.parse($themes2);
517
523
  }
518
- } catch (error) {
524
+ } catch (_error) {
519
525
  }
520
526
  const concatThemeNames = R.pipe(
521
527
  R.filter((obj) => R.toLower(obj.group || "") === "theme"),
@@ -2,6 +2,7 @@ import type { Theme, TokenSets } from './types.js';
2
2
  export declare const cliOptions: {
3
3
  readonly outDir: "out-dir";
4
4
  readonly clean: "clean";
5
+ readonly tailwind: "tailwind";
5
6
  readonly theme: {
6
7
  readonly colors: {
7
8
  readonly main: "main-colors";
@@ -1 +1 @@
1
- {"version":3,"file":"create.d.ts","sourceRoot":"","sources":["../../../src/tokens/create.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,KAAK,EAAY,SAAS,EAAE,MAAM,YAAY,CAAC;AAE7D,eAAO,MAAM,UAAU;;;;;;;;;;;;;;CAcb,CAAC;AAEX,eAAO,MAAM,YAAY,GAAU,MAAM,KAAK;;EAiC7C,CAAC"}
1
+ {"version":3,"file":"create.d.ts","sourceRoot":"","sources":["../../../src/tokens/create.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,KAAK,EAAY,SAAS,EAAE,MAAM,YAAY,CAAC;AAE7D,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAeb,CAAC;AAEX,eAAO,MAAM,YAAY,GAAU,MAAM,KAAK;;EAiC7C,CAAC"}
@@ -992,27 +992,6 @@ var getDefaultToken = (tokenPath) => {
992
992
  // src/tokens/create/generators/color.ts
993
993
  import * as R4 from "ramda";
994
994
 
995
- // src/colors/utils.ts
996
- import chroma from "chroma-js";
997
- import Colorjs from "colorjs.io";
998
- import { Hsluv } from "hsluv";
999
- var getLuminanceFromLightness = (lightness) => {
1000
- const conv = new Hsluv();
1001
- conv.hsluv_l = lightness;
1002
- conv.hsluvToHex();
1003
- return chroma(conv.hex).luminance();
1004
- };
1005
- var getLightnessFromHex = (hex) => {
1006
- const conv = new Hsluv();
1007
- conv.hex = hex;
1008
- conv.hexToHsluv();
1009
- return conv.hsluv_l;
1010
- };
1011
-
1012
- // src/colors/theme.ts
1013
- import chroma2 from "chroma-js";
1014
- import * as R3 from "ramda";
1015
-
1016
995
  // src/colors/colorMetadata.ts
1017
996
  import * as R2 from "ramda";
1018
997
  var baseColors = {
@@ -1266,6 +1245,27 @@ var colorMetadata = {
1266
1245
  };
1267
1246
  var colorMetadataByNumber = R2.indexBy((metadata) => metadata.number, Object.values(colorMetadata));
1268
1247
 
1248
+ // src/colors/theme.ts
1249
+ import chroma2 from "chroma-js";
1250
+ import * as R3 from "ramda";
1251
+
1252
+ // src/colors/utils.ts
1253
+ import chroma from "chroma-js";
1254
+ import Colorjs from "colorjs.io";
1255
+ import { Hsluv } from "hsluv";
1256
+ var getLuminanceFromLightness = (lightness) => {
1257
+ const conv = new Hsluv();
1258
+ conv.hsluv_l = lightness;
1259
+ conv.hsluvToHex();
1260
+ return chroma(conv.hex).luminance();
1261
+ };
1262
+ var getLightnessFromHex = (hex) => {
1263
+ const conv = new Hsluv();
1264
+ conv.hex = hex;
1265
+ conv.hexToHsluv();
1266
+ return conv.hsluv_l;
1267
+ };
1268
+
1269
1269
  // src/colors/theme.ts
1270
1270
  var generateColorScale = (color, colorScheme) => {
1271
1271
  let interpolationColor = color;
@@ -2043,6 +2043,7 @@ var generateTypography = (themeName, { fontFamily }) => {
2043
2043
  var cliOptions = {
2044
2044
  outDir: "out-dir",
2045
2045
  clean: "clean",
2046
+ tailwind: "tailwind",
2046
2047
  theme: {
2047
2048
  colors: {
2048
2049
  main: "main-colors",
@@ -1,6 +1,6 @@
1
1
  import { type FormatOptions } from './process/platform.js';
2
2
  import type { Theme } from './types.js';
3
- export declare const formatTokens: (options: Omit<FormatOptions, "process">) => Promise<import("./process/platform.js").ProcessReturn>;
3
+ export declare const formatTokens: (options: Omit<FormatOptions, "type">) => Promise<import("./process/platform.js").ProcessReturn>;
4
4
  export declare const formatTheme: (themeConfig: Theme) => Promise<import("./process/platform.js").ProcessReturn>;
5
5
  /**
6
6
  * Formats a theme configuration into CSS.
@@ -1 +1 @@
1
- {"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../../../src/tokens/format.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAmB,MAAM,uBAAuB,CAAC;AAE5E,OAAO,KAAK,EAAc,KAAK,EAAE,MAAM,YAAY,CAAC;AAEpD,eAAO,MAAM,YAAY,GAAU,SAAS,IAAI,CAAC,aAAa,EAAE,SAAS,CAAC,2DAOzE,CAAC;AAEF,eAAO,MAAM,WAAW,GAAU,aAAa,KAAK,2DAYnD,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,GAAU,aAAa,KAAK,oBAItD,CAAC"}
1
+ {"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../../../src/tokens/format.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,aAAa,EAAmB,MAAM,uBAAuB,CAAC;AAC5E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAExC,eAAO,MAAM,YAAY,GAAU,SAAS,IAAI,CAAC,aAAa,EAAE,MAAM,CAAC,2DAOtE,CAAC;AAEF,eAAO,MAAM,WAAW,GAAU,aAAa,KAAK,2DAYnD,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,GAAU,aAAa,KAAK,oBAItD,CAAC"}