@digdir/designsystemet 1.1.9 → 1.2.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.
- package/dist/bin/config.js +14 -14
- package/dist/bin/designsystemet.js +61 -63
- package/dist/src/config.d.ts +1 -1
- package/dist/src/config.d.ts.map +1 -1
- package/dist/src/config.js +8 -8
- package/dist/src/index.js +22 -22
- package/dist/src/migrations/beta-to-v1.js +5 -5
- package/dist/src/migrations/codemods/css/plugins.js +3 -3
- package/dist/src/migrations/codemods/css/run.js +2 -2
- package/dist/src/migrations/color-rename-next49.js +5 -5
- package/dist/src/migrations/index.js +5 -5
- package/dist/src/scripts/createJsonSchema.js +4 -4
- package/dist/src/scripts/update-design-tokens.js +2 -2
- package/dist/src/scripts/update-preview-tokens.js +22 -22
- package/dist/src/scripts/update-template.js +11 -11
- package/dist/src/tokens/build.js +33 -33
- package/dist/src/tokens/create/generators/$designsystemet.js +9 -9
- package/dist/src/tokens/create/write.d.ts.map +1 -1
- package/dist/src/tokens/create/write.js +18 -20
- package/dist/src/tokens/format.js +22 -22
- package/dist/src/tokens/index.js +22 -22
- package/dist/src/tokens/process/configs/color.js +2 -2
- package/dist/src/tokens/process/configs/semantic.js +2 -2
- package/dist/src/tokens/process/configs/typography.js +2 -2
- package/dist/src/tokens/process/configs.js +4 -4
- package/dist/src/tokens/process/formats/css/color.js +2 -2
- package/dist/src/tokens/process/formats/css/semantic.js +2 -2
- package/dist/src/tokens/process/formats/css/typography.js +2 -2
- package/dist/src/tokens/process/formats/css.js +2 -2
- package/dist/src/tokens/process/output/declarations.js +13 -13
- package/dist/src/tokens/process/output/theme.js +12 -12
- package/dist/src/tokens/process/platform.js +10 -10
- package/dist/src/tokens/process/utils/getMultidimensionalThemes.js +4 -4
- package/dist/src/utils.js +10 -10
- package/package.json +9 -9
package/dist/src/tokens/index.js
CHANGED
|
@@ -2423,17 +2423,17 @@ function generateTypographyGroup(themes) {
|
|
|
2423
2423
|
}
|
|
2424
2424
|
|
|
2425
2425
|
// src/tokens/process/output/theme.ts
|
|
2426
|
-
import
|
|
2426
|
+
import pc from "picocolors";
|
|
2427
2427
|
import * as R7 from "ramda";
|
|
2428
2428
|
|
|
2429
2429
|
// package.json
|
|
2430
2430
|
var package_default = {
|
|
2431
2431
|
name: "@digdir/designsystemet",
|
|
2432
|
-
version: "1.
|
|
2432
|
+
version: "1.2.0",
|
|
2433
2433
|
description: "CLI for Designsystemet",
|
|
2434
2434
|
author: "Designsystemet team",
|
|
2435
2435
|
engines: {
|
|
2436
|
-
node: ">=22.
|
|
2436
|
+
node: ">=22.18.0"
|
|
2437
2437
|
},
|
|
2438
2438
|
repository: {
|
|
2439
2439
|
type: "git",
|
|
@@ -2493,7 +2493,6 @@ var package_default = {
|
|
|
2493
2493
|
"@commander-js/extra-typings": "^14.0.0",
|
|
2494
2494
|
"@tokens-studio/sd-transforms": "1.3.0",
|
|
2495
2495
|
"apca-w3": "^0.1.9",
|
|
2496
|
-
chalk: "^5.4.1",
|
|
2497
2496
|
"change-case": "^5.4.4",
|
|
2498
2497
|
"chroma-js": "^3.1.2",
|
|
2499
2498
|
"colorjs.io": "^0.6.0-alpha.1",
|
|
@@ -2501,25 +2500,26 @@ var package_default = {
|
|
|
2501
2500
|
"fast-glob": "^3.3.3",
|
|
2502
2501
|
hsluv: "^1.0.1",
|
|
2503
2502
|
"object-hash": "^3.0.0",
|
|
2503
|
+
picocolors: "^1.1.1",
|
|
2504
2504
|
postcss: "^8.5.6",
|
|
2505
2505
|
ramda: "^0.31.3",
|
|
2506
2506
|
"style-dictionary": "^5.0.1",
|
|
2507
|
-
zod: "^
|
|
2508
|
-
"zod-validation-error": "^
|
|
2507
|
+
zod: "^4.0.17",
|
|
2508
|
+
"zod-validation-error": "^4.0.1"
|
|
2509
2509
|
},
|
|
2510
2510
|
devDependencies: {
|
|
2511
2511
|
"@tokens-studio/types": "0.5.2",
|
|
2512
2512
|
"@types/apca-w3": "^0.1.3",
|
|
2513
2513
|
"@types/chroma-js": "^3.1.1",
|
|
2514
2514
|
"@types/fs-extra": "^11.0.4",
|
|
2515
|
-
"@types/node": "^22.
|
|
2515
|
+
"@types/node": "^22.17.1",
|
|
2516
2516
|
"@types/object-hash": "^3.0.6",
|
|
2517
|
-
"@types/ramda": "^0.
|
|
2518
|
-
"fs-extra": "^11.3.
|
|
2517
|
+
"@types/ramda": "^0.31.0",
|
|
2518
|
+
"fs-extra": "^11.3.1",
|
|
2519
2519
|
tslib: "^2.8.1",
|
|
2520
2520
|
tsup: "^8.5.0",
|
|
2521
2521
|
tsx: "^4.20.3",
|
|
2522
|
-
typescript: "^5.
|
|
2522
|
+
typescript: "^5.9.2"
|
|
2523
2523
|
}
|
|
2524
2524
|
};
|
|
2525
2525
|
|
|
@@ -2559,10 +2559,10 @@ var createThemeCSSFiles = ({
|
|
|
2559
2559
|
});
|
|
2560
2560
|
if (sortIndex === -1) {
|
|
2561
2561
|
console.error(
|
|
2562
|
-
|
|
2562
|
+
pc.yellow(`WARNING: CSS section does not have a defined sort order: ${filePath.replace(".css", "")}`)
|
|
2563
2563
|
);
|
|
2564
2564
|
console.log(
|
|
2565
|
-
|
|
2565
|
+
pc.dim(
|
|
2566
2566
|
`
|
|
2567
2567
|
The section will currently be added to the end of the entry file, but the exact
|
|
2568
2568
|
order may change due to nondeterminism.`.trim()
|
|
@@ -2595,7 +2595,7 @@ ${fileHeader}
|
|
|
2595
2595
|
};
|
|
2596
2596
|
|
|
2597
2597
|
// src/tokens/process/platform.ts
|
|
2598
|
-
import
|
|
2598
|
+
import pc3 from "picocolors";
|
|
2599
2599
|
import * as R17 from "ramda";
|
|
2600
2600
|
import StyleDictionary2 from "style-dictionary";
|
|
2601
2601
|
|
|
@@ -3136,8 +3136,8 @@ var typographyVariables = ({ theme, typography: typography2 }) => {
|
|
|
3136
3136
|
};
|
|
3137
3137
|
|
|
3138
3138
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
3139
|
-
import chalk2 from "chalk";
|
|
3140
3139
|
import { kebabCase } from "change-case";
|
|
3140
|
+
import pc2 from "picocolors";
|
|
3141
3141
|
import * as R15 from "ramda";
|
|
3142
3142
|
var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
3143
3143
|
const verboseLogging = buildOptions?.verbose;
|
|
@@ -3147,8 +3147,8 @@ var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
|
3147
3147
|
const keys2 = R15.keys(grouped$themes);
|
|
3148
3148
|
const nonDependentKeys = keys2.filter((x) => ![...ALL_DEPENDENT_ON, ...dimensions].includes(x));
|
|
3149
3149
|
if (verboseLogging) {
|
|
3150
|
-
console.log(
|
|
3151
|
-
console.log(
|
|
3150
|
+
console.log(pc2.cyan(`\u{1F50E} Finding theme permutations for ${dimensions}`));
|
|
3151
|
+
console.log(pc2.cyan(` (ignoring permutations for ${nonDependentKeys})`));
|
|
3152
3152
|
}
|
|
3153
3153
|
return permutations.filter((val) => {
|
|
3154
3154
|
const filters = nonDependentKeys.map((x) => val.permutation[x] === grouped$themes[x][0].name);
|
|
@@ -3375,18 +3375,18 @@ async function processPlatform(options) {
|
|
|
3375
3375
|
const UNSAFE_DEFAULT_COLOR = process.env.UNSAFE_DEFAULT_COLOR ?? "";
|
|
3376
3376
|
if (UNSAFE_DEFAULT_COLOR) {
|
|
3377
3377
|
console.warn(
|
|
3378
|
-
|
|
3378
|
+
pc3.yellow(
|
|
3379
3379
|
`
|
|
3380
|
-
\u26A0\uFE0F UNSAFE_DEFAULT_COLOR is set to ${
|
|
3380
|
+
\u26A0\uFE0F UNSAFE_DEFAULT_COLOR is set to ${pc3.blue(UNSAFE_DEFAULT_COLOR)}. This will override the default color.`
|
|
3381
3381
|
)
|
|
3382
3382
|
);
|
|
3383
3383
|
}
|
|
3384
3384
|
const UNSAFE_COLOR_GROUPS = Array.from(process.env.UNSAFE_COLOR_GROUPS?.split(",") ?? []);
|
|
3385
3385
|
if (UNSAFE_COLOR_GROUPS.length > 0) {
|
|
3386
3386
|
console.warn(
|
|
3387
|
-
|
|
3387
|
+
pc3.yellow(
|
|
3388
3388
|
`
|
|
3389
|
-
\u26A0\uFE0F UNSAFE_COLOR_GROUPS is set to ${
|
|
3389
|
+
\u26A0\uFE0F UNSAFE_COLOR_GROUPS is set to ${pc3.blue(`[${UNSAFE_COLOR_GROUPS.join(", ")}]`)}. This will override the default color groups.`
|
|
3390
3390
|
)
|
|
3391
3391
|
);
|
|
3392
3392
|
}
|
|
@@ -3401,7 +3401,7 @@ async function processPlatform(options) {
|
|
|
3401
3401
|
}
|
|
3402
3402
|
if (buildOptions.defaultColor) {
|
|
3403
3403
|
console.log(`
|
|
3404
|
-
\u{1F3A8} Using ${
|
|
3404
|
+
\u{1F3A8} Using ${pc3.blue(buildOptions.defaultColor)} as default color`);
|
|
3405
3405
|
}
|
|
3406
3406
|
const buildAndSdConfigs = R17.map((buildConfig) => {
|
|
3407
3407
|
const sdConfigs = getConfigsForThemeDimensions(
|
|
@@ -3445,7 +3445,7 @@ async function processPlatform(options) {
|
|
|
3445
3445
|
}
|
|
3446
3446
|
if (sdConfigs.length > 0) {
|
|
3447
3447
|
console.log(`
|
|
3448
|
-
\u{1F371} Building ${
|
|
3448
|
+
\u{1F371} Building ${pc3.green(buildConfig.name ?? buildName)}`);
|
|
3449
3449
|
const results = await Promise.all(
|
|
3450
3450
|
sdConfigs.map(async (sdConfig) => {
|
|
3451
3451
|
const { config, permutation } = sdConfig;
|
|
@@ -71,7 +71,7 @@ import * as R7 from "ramda";
|
|
|
71
71
|
import { createPropertyFormatter } from "style-dictionary/utils";
|
|
72
72
|
|
|
73
73
|
// src/tokens/process/platform.ts
|
|
74
|
-
import
|
|
74
|
+
import pc2 from "picocolors";
|
|
75
75
|
import * as R6 from "ramda";
|
|
76
76
|
import StyleDictionary2 from "style-dictionary";
|
|
77
77
|
|
|
@@ -411,8 +411,8 @@ var TypographyValues;
|
|
|
411
411
|
})(TypographyValues || (TypographyValues = {}));
|
|
412
412
|
|
|
413
413
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
414
|
-
import chalk from "chalk";
|
|
415
414
|
import { kebabCase } from "change-case";
|
|
415
|
+
import pc from "picocolors";
|
|
416
416
|
import * as R4 from "ramda";
|
|
417
417
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
418
418
|
var hasUnknownProps = R4.pipe(R4.values, R4.none(R4.equals("unknown")), R4.not);
|
|
@@ -72,7 +72,7 @@ import * as R7 from "ramda";
|
|
|
72
72
|
import { createPropertyFormatter } from "style-dictionary/utils";
|
|
73
73
|
|
|
74
74
|
// src/tokens/process/platform.ts
|
|
75
|
-
import
|
|
75
|
+
import pc2 from "picocolors";
|
|
76
76
|
import * as R6 from "ramda";
|
|
77
77
|
import StyleDictionary2 from "style-dictionary";
|
|
78
78
|
|
|
@@ -439,8 +439,8 @@ var TypographyValues;
|
|
|
439
439
|
})(TypographyValues || (TypographyValues = {}));
|
|
440
440
|
|
|
441
441
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
442
|
-
import chalk from "chalk";
|
|
443
442
|
import { kebabCase } from "change-case";
|
|
443
|
+
import pc from "picocolors";
|
|
444
444
|
import * as R4 from "ramda";
|
|
445
445
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
446
446
|
var hasUnknownProps = R4.pipe(R4.values, R4.none(R4.equals("unknown")), R4.not);
|
|
@@ -71,7 +71,7 @@ import * as R8 from "ramda";
|
|
|
71
71
|
import { createPropertyFormatter } from "style-dictionary/utils";
|
|
72
72
|
|
|
73
73
|
// src/tokens/process/platform.ts
|
|
74
|
-
import
|
|
74
|
+
import pc2 from "picocolors";
|
|
75
75
|
import * as R7 from "ramda";
|
|
76
76
|
import StyleDictionary2 from "style-dictionary";
|
|
77
77
|
|
|
@@ -435,8 +435,8 @@ var TypographyValues;
|
|
|
435
435
|
})(TypographyValues || (TypographyValues = {}));
|
|
436
436
|
|
|
437
437
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
438
|
-
import chalk from "chalk";
|
|
439
438
|
import { kebabCase } from "change-case";
|
|
439
|
+
import pc from "picocolors";
|
|
440
440
|
import * as R5 from "ramda";
|
|
441
441
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
442
442
|
var hasUnknownProps = R5.pipe(R5.values, R5.none(R5.equals("unknown")), R5.not);
|
|
@@ -88,7 +88,7 @@ import * as R4 from "ramda";
|
|
|
88
88
|
import { createPropertyFormatter } from "style-dictionary/utils";
|
|
89
89
|
|
|
90
90
|
// src/tokens/process/platform.ts
|
|
91
|
-
import
|
|
91
|
+
import pc2 from "picocolors";
|
|
92
92
|
import * as R3 from "ramda";
|
|
93
93
|
import StyleDictionary from "style-dictionary";
|
|
94
94
|
|
|
@@ -256,8 +256,8 @@ var TypographyValues;
|
|
|
256
256
|
})(TypographyValues || (TypographyValues = {}));
|
|
257
257
|
|
|
258
258
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
259
|
-
import chalk from "chalk";
|
|
260
259
|
import { kebabCase } from "change-case";
|
|
260
|
+
import pc from "picocolors";
|
|
261
261
|
import * as R2 from "ramda";
|
|
262
262
|
var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
263
263
|
const verboseLogging = buildOptions?.verbose;
|
|
@@ -267,8 +267,8 @@ var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
|
267
267
|
const keys2 = R2.keys(grouped$themes);
|
|
268
268
|
const nonDependentKeys = keys2.filter((x) => ![...ALL_DEPENDENT_ON, ...dimensions].includes(x));
|
|
269
269
|
if (verboseLogging) {
|
|
270
|
-
console.log(
|
|
271
|
-
console.log(
|
|
270
|
+
console.log(pc.cyan(`\u{1F50E} Finding theme permutations for ${dimensions}`));
|
|
271
|
+
console.log(pc.cyan(` (ignoring permutations for ${nonDependentKeys})`));
|
|
272
272
|
}
|
|
273
273
|
return permutations.filter((val) => {
|
|
274
274
|
const filters = nonDependentKeys.map((x) => val.permutation[x] === grouped$themes[x][0].name);
|
|
@@ -66,7 +66,7 @@ function inlineTokens(shouldInline, tokens) {
|
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
// src/tokens/process/platform.ts
|
|
69
|
-
import
|
|
69
|
+
import pc2 from "picocolors";
|
|
70
70
|
import * as R9 from "ramda";
|
|
71
71
|
import StyleDictionary2 from "style-dictionary";
|
|
72
72
|
|
|
@@ -600,8 +600,8 @@ var TypographyValues;
|
|
|
600
600
|
})(TypographyValues || (TypographyValues = {}));
|
|
601
601
|
|
|
602
602
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
603
|
-
import chalk from "chalk";
|
|
604
603
|
import { kebabCase } from "change-case";
|
|
604
|
+
import pc from "picocolors";
|
|
605
605
|
import * as R7 from "ramda";
|
|
606
606
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
607
607
|
var hasUnknownProps = R7.pipe(R7.values, R7.none(R7.equals("unknown")), R7.not);
|
|
@@ -68,7 +68,7 @@ function inlineTokens(shouldInline, tokens) {
|
|
|
68
68
|
}
|
|
69
69
|
|
|
70
70
|
// src/tokens/process/platform.ts
|
|
71
|
-
import
|
|
71
|
+
import pc2 from "picocolors";
|
|
72
72
|
import * as R9 from "ramda";
|
|
73
73
|
import StyleDictionary2 from "style-dictionary";
|
|
74
74
|
|
|
@@ -619,8 +619,8 @@ var TypographyValues;
|
|
|
619
619
|
})(TypographyValues || (TypographyValues = {}));
|
|
620
620
|
|
|
621
621
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
622
|
-
import chalk from "chalk";
|
|
623
622
|
import { kebabCase } from "change-case";
|
|
623
|
+
import pc from "picocolors";
|
|
624
624
|
import * as R7 from "ramda";
|
|
625
625
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
626
626
|
var hasUnknownProps = R7.pipe(R7.values, R7.none(R7.equals("unknown")), R7.not);
|
|
@@ -3,7 +3,7 @@ import * as R10 from "ramda";
|
|
|
3
3
|
import { createPropertyFormatter as createPropertyFormatter3 } from "style-dictionary/utils";
|
|
4
4
|
|
|
5
5
|
// src/tokens/process/platform.ts
|
|
6
|
-
import
|
|
6
|
+
import pc2 from "picocolors";
|
|
7
7
|
import * as R9 from "ramda";
|
|
8
8
|
import StyleDictionary2 from "style-dictionary";
|
|
9
9
|
|
|
@@ -659,8 +659,8 @@ var TypographyValues;
|
|
|
659
659
|
})(TypographyValues || (TypographyValues = {}));
|
|
660
660
|
|
|
661
661
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
662
|
-
import chalk from "chalk";
|
|
663
662
|
import { kebabCase } from "change-case";
|
|
663
|
+
import pc from "picocolors";
|
|
664
664
|
import * as R7 from "ramda";
|
|
665
665
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
666
666
|
var hasUnknownProps = R7.pipe(R7.values, R7.none(R7.equals("unknown")), R7.not);
|
|
@@ -66,7 +66,7 @@ function inlineTokens(shouldInline, tokens) {
|
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
// src/tokens/process/platform.ts
|
|
69
|
-
import
|
|
69
|
+
import pc2 from "picocolors";
|
|
70
70
|
import * as R7 from "ramda";
|
|
71
71
|
import StyleDictionary2 from "style-dictionary";
|
|
72
72
|
|
|
@@ -478,8 +478,8 @@ var TypographyValues;
|
|
|
478
478
|
})(TypographyValues || (TypographyValues = {}));
|
|
479
479
|
|
|
480
480
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
481
|
-
import chalk from "chalk";
|
|
482
481
|
import { kebabCase } from "change-case";
|
|
482
|
+
import pc from "picocolors";
|
|
483
483
|
import * as R5 from "ramda";
|
|
484
484
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
485
485
|
var hasUnknownProps = R5.pipe(R5.values, R5.none(R5.equals("unknown")), R5.not);
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
// src/tokens/process/output/declarations.ts
|
|
2
|
-
import
|
|
2
|
+
import pc3 from "picocolors";
|
|
3
3
|
|
|
4
4
|
// package.json
|
|
5
5
|
var package_default = {
|
|
6
6
|
name: "@digdir/designsystemet",
|
|
7
|
-
version: "1.
|
|
7
|
+
version: "1.2.0",
|
|
8
8
|
description: "CLI for Designsystemet",
|
|
9
9
|
author: "Designsystemet team",
|
|
10
10
|
engines: {
|
|
11
|
-
node: ">=22.
|
|
11
|
+
node: ">=22.18.0"
|
|
12
12
|
},
|
|
13
13
|
repository: {
|
|
14
14
|
type: "git",
|
|
@@ -68,7 +68,6 @@ var package_default = {
|
|
|
68
68
|
"@commander-js/extra-typings": "^14.0.0",
|
|
69
69
|
"@tokens-studio/sd-transforms": "1.3.0",
|
|
70
70
|
"apca-w3": "^0.1.9",
|
|
71
|
-
chalk: "^5.4.1",
|
|
72
71
|
"change-case": "^5.4.4",
|
|
73
72
|
"chroma-js": "^3.1.2",
|
|
74
73
|
"colorjs.io": "^0.6.0-alpha.1",
|
|
@@ -76,30 +75,31 @@ var package_default = {
|
|
|
76
75
|
"fast-glob": "^3.3.3",
|
|
77
76
|
hsluv: "^1.0.1",
|
|
78
77
|
"object-hash": "^3.0.0",
|
|
78
|
+
picocolors: "^1.1.1",
|
|
79
79
|
postcss: "^8.5.6",
|
|
80
80
|
ramda: "^0.31.3",
|
|
81
81
|
"style-dictionary": "^5.0.1",
|
|
82
|
-
zod: "^
|
|
83
|
-
"zod-validation-error": "^
|
|
82
|
+
zod: "^4.0.17",
|
|
83
|
+
"zod-validation-error": "^4.0.1"
|
|
84
84
|
},
|
|
85
85
|
devDependencies: {
|
|
86
86
|
"@tokens-studio/types": "0.5.2",
|
|
87
87
|
"@types/apca-w3": "^0.1.3",
|
|
88
88
|
"@types/chroma-js": "^3.1.1",
|
|
89
89
|
"@types/fs-extra": "^11.0.4",
|
|
90
|
-
"@types/node": "^22.
|
|
90
|
+
"@types/node": "^22.17.1",
|
|
91
91
|
"@types/object-hash": "^3.0.6",
|
|
92
|
-
"@types/ramda": "^0.
|
|
93
|
-
"fs-extra": "^11.3.
|
|
92
|
+
"@types/ramda": "^0.31.0",
|
|
93
|
+
"fs-extra": "^11.3.1",
|
|
94
94
|
tslib: "^2.8.1",
|
|
95
95
|
tsup: "^8.5.0",
|
|
96
96
|
tsx: "^4.20.3",
|
|
97
|
-
typescript: "^5.
|
|
97
|
+
typescript: "^5.9.2"
|
|
98
98
|
}
|
|
99
99
|
};
|
|
100
100
|
|
|
101
101
|
// src/tokens/process/platform.ts
|
|
102
|
-
import
|
|
102
|
+
import pc2 from "picocolors";
|
|
103
103
|
import * as R10 from "ramda";
|
|
104
104
|
import StyleDictionary2 from "style-dictionary";
|
|
105
105
|
|
|
@@ -791,8 +791,8 @@ var TypographyValues;
|
|
|
791
791
|
})(TypographyValues || (TypographyValues = {}));
|
|
792
792
|
|
|
793
793
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
794
|
-
import chalk from "chalk";
|
|
795
794
|
import { kebabCase } from "change-case";
|
|
795
|
+
import pc from "picocolors";
|
|
796
796
|
import * as R8 from "ramda";
|
|
797
797
|
var processed = Symbol("Type brand for ProcessedThemeObject");
|
|
798
798
|
var hasUnknownProps = R8.pipe(R8.values, R8.none(R8.equals("unknown")), R8.not);
|
|
@@ -885,7 +885,7 @@ ${typeDeclaration}`,
|
|
|
885
885
|
};
|
|
886
886
|
function createColorTypeDeclaration(colors) {
|
|
887
887
|
console.log(`
|
|
888
|
-
\u{1F371} Building ${
|
|
888
|
+
\u{1F371} Building ${pc3.green("type declarations")}`);
|
|
889
889
|
const typeDeclaration = `
|
|
890
890
|
/* ${defaultFileHeader} */
|
|
891
891
|
import type {} from '@digdir/designsystemet/types';
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
// src/tokens/process/output/theme.ts
|
|
2
|
-
import
|
|
2
|
+
import pc from "picocolors";
|
|
3
3
|
import * as R from "ramda";
|
|
4
4
|
|
|
5
5
|
// package.json
|
|
6
6
|
var package_default = {
|
|
7
7
|
name: "@digdir/designsystemet",
|
|
8
|
-
version: "1.
|
|
8
|
+
version: "1.2.0",
|
|
9
9
|
description: "CLI for Designsystemet",
|
|
10
10
|
author: "Designsystemet team",
|
|
11
11
|
engines: {
|
|
12
|
-
node: ">=22.
|
|
12
|
+
node: ">=22.18.0"
|
|
13
13
|
},
|
|
14
14
|
repository: {
|
|
15
15
|
type: "git",
|
|
@@ -69,7 +69,6 @@ var package_default = {
|
|
|
69
69
|
"@commander-js/extra-typings": "^14.0.0",
|
|
70
70
|
"@tokens-studio/sd-transforms": "1.3.0",
|
|
71
71
|
"apca-w3": "^0.1.9",
|
|
72
|
-
chalk: "^5.4.1",
|
|
73
72
|
"change-case": "^5.4.4",
|
|
74
73
|
"chroma-js": "^3.1.2",
|
|
75
74
|
"colorjs.io": "^0.6.0-alpha.1",
|
|
@@ -77,25 +76,26 @@ var package_default = {
|
|
|
77
76
|
"fast-glob": "^3.3.3",
|
|
78
77
|
hsluv: "^1.0.1",
|
|
79
78
|
"object-hash": "^3.0.0",
|
|
79
|
+
picocolors: "^1.1.1",
|
|
80
80
|
postcss: "^8.5.6",
|
|
81
81
|
ramda: "^0.31.3",
|
|
82
82
|
"style-dictionary": "^5.0.1",
|
|
83
|
-
zod: "^
|
|
84
|
-
"zod-validation-error": "^
|
|
83
|
+
zod: "^4.0.17",
|
|
84
|
+
"zod-validation-error": "^4.0.1"
|
|
85
85
|
},
|
|
86
86
|
devDependencies: {
|
|
87
87
|
"@tokens-studio/types": "0.5.2",
|
|
88
88
|
"@types/apca-w3": "^0.1.3",
|
|
89
89
|
"@types/chroma-js": "^3.1.1",
|
|
90
90
|
"@types/fs-extra": "^11.0.4",
|
|
91
|
-
"@types/node": "^22.
|
|
91
|
+
"@types/node": "^22.17.1",
|
|
92
92
|
"@types/object-hash": "^3.0.6",
|
|
93
|
-
"@types/ramda": "^0.
|
|
94
|
-
"fs-extra": "^11.3.
|
|
93
|
+
"@types/ramda": "^0.31.0",
|
|
94
|
+
"fs-extra": "^11.3.1",
|
|
95
95
|
tslib: "^2.8.1",
|
|
96
96
|
tsup: "^8.5.0",
|
|
97
97
|
tsx: "^4.20.3",
|
|
98
|
-
typescript: "^5.
|
|
98
|
+
typescript: "^5.9.2"
|
|
99
99
|
}
|
|
100
100
|
};
|
|
101
101
|
|
|
@@ -135,10 +135,10 @@ var createThemeCSSFiles = ({
|
|
|
135
135
|
});
|
|
136
136
|
if (sortIndex === -1) {
|
|
137
137
|
console.error(
|
|
138
|
-
|
|
138
|
+
pc.yellow(`WARNING: CSS section does not have a defined sort order: ${filePath.replace(".css", "")}`)
|
|
139
139
|
);
|
|
140
140
|
console.log(
|
|
141
|
-
|
|
141
|
+
pc.dim(
|
|
142
142
|
`
|
|
143
143
|
The section will currently be added to the end of the entry file, but the exact
|
|
144
144
|
order may change due to nondeterminism.`.trim()
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// src/tokens/process/platform.ts
|
|
2
|
-
import
|
|
2
|
+
import pc2 from "picocolors";
|
|
3
3
|
import * as R10 from "ramda";
|
|
4
4
|
import StyleDictionary2 from "style-dictionary";
|
|
5
5
|
|
|
@@ -703,8 +703,8 @@ var TypographyValues;
|
|
|
703
703
|
})(TypographyValues || (TypographyValues = {}));
|
|
704
704
|
|
|
705
705
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
706
|
-
import chalk from "chalk";
|
|
707
706
|
import { kebabCase } from "change-case";
|
|
707
|
+
import pc from "picocolors";
|
|
708
708
|
import * as R8 from "ramda";
|
|
709
709
|
var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
710
710
|
const verboseLogging = buildOptions?.verbose;
|
|
@@ -714,8 +714,8 @@ var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
|
714
714
|
const keys2 = R8.keys(grouped$themes);
|
|
715
715
|
const nonDependentKeys = keys2.filter((x) => ![...ALL_DEPENDENT_ON, ...dimensions].includes(x));
|
|
716
716
|
if (verboseLogging) {
|
|
717
|
-
console.log(
|
|
718
|
-
console.log(
|
|
717
|
+
console.log(pc.cyan(`\u{1F50E} Finding theme permutations for ${dimensions}`));
|
|
718
|
+
console.log(pc.cyan(` (ignoring permutations for ${nonDependentKeys})`));
|
|
719
719
|
}
|
|
720
720
|
return permutations.filter((val) => {
|
|
721
721
|
const filters = nonDependentKeys.map((x) => val.permutation[x] === grouped$themes[x][0].name);
|
|
@@ -928,18 +928,18 @@ async function processPlatform(options) {
|
|
|
928
928
|
const UNSAFE_DEFAULT_COLOR = process.env.UNSAFE_DEFAULT_COLOR ?? "";
|
|
929
929
|
if (UNSAFE_DEFAULT_COLOR) {
|
|
930
930
|
console.warn(
|
|
931
|
-
|
|
931
|
+
pc2.yellow(
|
|
932
932
|
`
|
|
933
|
-
\u26A0\uFE0F UNSAFE_DEFAULT_COLOR is set to ${
|
|
933
|
+
\u26A0\uFE0F UNSAFE_DEFAULT_COLOR is set to ${pc2.blue(UNSAFE_DEFAULT_COLOR)}. This will override the default color.`
|
|
934
934
|
)
|
|
935
935
|
);
|
|
936
936
|
}
|
|
937
937
|
const UNSAFE_COLOR_GROUPS = Array.from(process.env.UNSAFE_COLOR_GROUPS?.split(",") ?? []);
|
|
938
938
|
if (UNSAFE_COLOR_GROUPS.length > 0) {
|
|
939
939
|
console.warn(
|
|
940
|
-
|
|
940
|
+
pc2.yellow(
|
|
941
941
|
`
|
|
942
|
-
\u26A0\uFE0F UNSAFE_COLOR_GROUPS is set to ${
|
|
942
|
+
\u26A0\uFE0F UNSAFE_COLOR_GROUPS is set to ${pc2.blue(`[${UNSAFE_COLOR_GROUPS.join(", ")}]`)}. This will override the default color groups.`
|
|
943
943
|
)
|
|
944
944
|
);
|
|
945
945
|
}
|
|
@@ -954,7 +954,7 @@ async function processPlatform(options) {
|
|
|
954
954
|
}
|
|
955
955
|
if (buildOptions.defaultColor) {
|
|
956
956
|
console.log(`
|
|
957
|
-
\u{1F3A8} Using ${
|
|
957
|
+
\u{1F3A8} Using ${pc2.blue(buildOptions.defaultColor)} as default color`);
|
|
958
958
|
}
|
|
959
959
|
const buildAndSdConfigs = R10.map((buildConfig) => {
|
|
960
960
|
const sdConfigs = getConfigsForThemeDimensions(
|
|
@@ -998,7 +998,7 @@ async function processPlatform(options) {
|
|
|
998
998
|
}
|
|
999
999
|
if (sdConfigs.length > 0) {
|
|
1000
1000
|
console.log(`
|
|
1001
|
-
\u{1F371} Building ${
|
|
1001
|
+
\u{1F371} Building ${pc2.green(buildConfig.name ?? buildName)}`);
|
|
1002
1002
|
const results = await Promise.all(
|
|
1003
1003
|
sdConfigs.map(async (sdConfig) => {
|
|
1004
1004
|
const { config, permutation } = sdConfig;
|
|
@@ -162,12 +162,12 @@ var TypographyValues;
|
|
|
162
162
|
})(TypographyValues || (TypographyValues = {}));
|
|
163
163
|
|
|
164
164
|
// src/tokens/process/utils/getMultidimensionalThemes.ts
|
|
165
|
-
import chalk2 from "chalk";
|
|
166
165
|
import { kebabCase } from "change-case";
|
|
166
|
+
import pc2 from "picocolors";
|
|
167
167
|
import * as R10 from "ramda";
|
|
168
168
|
|
|
169
169
|
// src/tokens/process/platform.ts
|
|
170
|
-
import
|
|
170
|
+
import pc from "picocolors";
|
|
171
171
|
import * as R9 from "ramda";
|
|
172
172
|
import StyleDictionary2 from "style-dictionary";
|
|
173
173
|
|
|
@@ -766,8 +766,8 @@ var getMultidimensionalThemes = (processed$themes, dimensions) => {
|
|
|
766
766
|
const keys2 = R10.keys(grouped$themes);
|
|
767
767
|
const nonDependentKeys = keys2.filter((x) => ![...ALL_DEPENDENT_ON, ...dimensions].includes(x));
|
|
768
768
|
if (verboseLogging) {
|
|
769
|
-
console.log(
|
|
770
|
-
console.log(
|
|
769
|
+
console.log(pc2.cyan(`\u{1F50E} Finding theme permutations for ${dimensions}`));
|
|
770
|
+
console.log(pc2.cyan(` (ignoring permutations for ${nonDependentKeys})`));
|
|
771
771
|
}
|
|
772
772
|
return permutations.filter((val) => {
|
|
773
773
|
const filters = nonDependentKeys.map((x) => val.permutation[x] === grouped$themes[x][0].name);
|
package/dist/src/utils.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
// src/utils.ts
|
|
2
2
|
import fs from "fs/promises";
|
|
3
|
-
import
|
|
3
|
+
import pc from "picocolors";
|
|
4
4
|
var mkdir = async (dir, dry) => {
|
|
5
5
|
if (dry) {
|
|
6
|
-
console.log(`${
|
|
6
|
+
console.log(`${pc.blue("mkdir")} ${dir}`);
|
|
7
7
|
return Promise.resolve();
|
|
8
8
|
}
|
|
9
9
|
const exists = await fs.access(dir, fs.constants.F_OK).then(() => true).catch(() => false);
|
|
@@ -14,41 +14,41 @@ var mkdir = async (dir, dry) => {
|
|
|
14
14
|
};
|
|
15
15
|
var writeFile = async (path, data, dry) => {
|
|
16
16
|
if (dry) {
|
|
17
|
-
console.log(`${
|
|
17
|
+
console.log(`${pc.blue("writeFile")} ${path}`);
|
|
18
18
|
return Promise.resolve();
|
|
19
19
|
}
|
|
20
20
|
return fs.writeFile(path, data, { encoding: "utf-8" }).catch((error) => {
|
|
21
|
-
console.error(
|
|
22
|
-
console.error(
|
|
21
|
+
console.error(pc.red(`Error writing file: ${path}`));
|
|
22
|
+
console.error(pc.red(error));
|
|
23
23
|
throw error;
|
|
24
24
|
});
|
|
25
25
|
};
|
|
26
26
|
var cp = async (src, dest, dry, filter) => {
|
|
27
27
|
if (dry) {
|
|
28
|
-
console.log(`${
|
|
28
|
+
console.log(`${pc.blue("cp")} ${src} ${dest}`);
|
|
29
29
|
return Promise.resolve();
|
|
30
30
|
}
|
|
31
31
|
return fs.cp(src, dest, { recursive: true, filter });
|
|
32
32
|
};
|
|
33
33
|
var copyFile = async (src, dest, dry) => {
|
|
34
34
|
if (dry) {
|
|
35
|
-
console.log(`${
|
|
35
|
+
console.log(`${pc.blue("copyFile")} ${src} to ${dest}`);
|
|
36
36
|
return Promise.resolve();
|
|
37
37
|
}
|
|
38
38
|
return fs.copyFile(src, dest);
|
|
39
39
|
};
|
|
40
40
|
var cleanDir = async (dir, dry) => {
|
|
41
41
|
if (dry) {
|
|
42
|
-
console.log(`${
|
|
42
|
+
console.log(`${pc.blue("cleanDir")} ${dir}`);
|
|
43
43
|
return Promise.resolve();
|
|
44
44
|
}
|
|
45
45
|
console.log(`
|
|
46
|
-
\u{1F525} Cleaning dir ${
|
|
46
|
+
\u{1F525} Cleaning dir ${pc.red(`${dir.trim()}`)} `);
|
|
47
47
|
return fs.rm(dir, { recursive: true, force: true });
|
|
48
48
|
};
|
|
49
49
|
var readFile = async (path, dry, allowFileNotFound) => {
|
|
50
50
|
if (dry) {
|
|
51
|
-
console.log(`${
|
|
51
|
+
console.log(`${pc.blue("readFile")} ${path}`);
|
|
52
52
|
return Promise.resolve("");
|
|
53
53
|
}
|
|
54
54
|
try {
|