@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.
- package/dist/bin/config.d.ts +12 -0
- package/dist/bin/config.d.ts.map +1 -0
- package/dist/bin/config.js +517 -0
- package/dist/bin/designsystemet.js +3699 -3572
- package/dist/config.schema.json +1 -0
- package/dist/src/colors/index.d.ts +2 -2
- package/dist/src/colors/index.d.ts.map +1 -1
- package/dist/src/colors/index.js +143 -143
- package/dist/src/colors/theme.d.ts +1 -2
- package/dist/src/colors/theme.d.ts.map +1 -1
- package/dist/src/config.d.ts +25 -14
- package/dist/src/config.d.ts.map +1 -1
- package/dist/src/config.js +68 -24
- package/dist/src/index.js +431 -404
- package/dist/src/migrations/beta-to-v1.js +9 -2
- package/dist/src/migrations/codemods/css/run.js +9 -2
- package/dist/src/migrations/color-rename-next49.js +9 -2
- package/dist/src/migrations/index.js +9 -2
- package/dist/src/scripts/createJsonSchema.js +28 -23
- package/dist/src/scripts/update-template.d.ts.map +1 -1
- package/dist/src/scripts/update-template.js +9 -2
- package/dist/src/tokens/build.d.ts +1 -1
- package/dist/src/tokens/build.d.ts.map +1 -1
- package/dist/src/tokens/build.js +140 -57
- package/dist/src/tokens/create/generators/$designsystemet.js +13 -14
- package/dist/src/tokens/create/generators/color.js +21 -21
- package/dist/src/tokens/create/write.js +23 -17
- package/dist/src/tokens/create.d.ts +1 -0
- package/dist/src/tokens/create.d.ts.map +1 -1
- package/dist/src/tokens/create.js +22 -21
- package/dist/src/tokens/format.d.ts +1 -1
- package/dist/src/tokens/format.d.ts.map +1 -1
- package/dist/src/tokens/format.js +916 -890
- package/dist/src/tokens/index.d.ts +2 -2
- package/dist/src/tokens/index.d.ts.map +1 -1
- package/dist/src/tokens/index.js +308 -281
- package/dist/src/tokens/process/configs/color.d.ts.map +1 -1
- package/dist/src/tokens/process/configs/color.js +17 -15
- package/dist/src/tokens/process/configs/semantic.d.ts.map +1 -1
- package/dist/src/tokens/process/configs/semantic.js +16 -14
- package/dist/src/tokens/process/configs/storefront.d.ts.map +1 -1
- package/dist/src/tokens/process/configs/storefront.js +12 -2
- package/dist/src/tokens/process/configs/typography.d.ts.map +1 -1
- package/dist/src/tokens/process/configs/typography.js +16 -14
- package/dist/src/tokens/process/configs.d.ts.map +1 -1
- package/dist/src/tokens/process/configs.js +18 -31
- package/dist/src/tokens/process/formats/css/color.js +5 -3
- package/dist/src/tokens/process/formats/css/semantic.js +2 -2
- package/dist/src/tokens/process/formats/css/typography.js +1 -1
- package/dist/src/tokens/process/formats/css.js +8 -6
- package/dist/src/tokens/process/formats/js-tokens.js +12 -2
- package/dist/src/tokens/process/output/tailwind.d.ts +3 -0
- package/dist/src/tokens/process/output/tailwind.d.ts.map +1 -0
- package/dist/src/tokens/process/output/tailwind.js +59 -0
- package/dist/src/tokens/process/{theme.d.ts → output/theme.d.ts} +2 -2
- package/dist/src/tokens/process/output/theme.d.ts.map +1 -0
- package/dist/src/tokens/process/{theme.js → output/theme.js} +16 -17
- package/dist/src/tokens/process/platform.d.ts +6 -6
- package/dist/src/tokens/process/platform.d.ts.map +1 -1
- package/dist/src/tokens/process/platform.js +46 -19
- package/dist/src/tokens/process/utils/getMultidimensionalThemes.js +10 -9
- package/dist/src/tokens/types.d.ts +3 -3
- package/dist/src/tokens/types.d.ts.map +1 -1
- package/dist/src/tokens/utils.d.ts +2 -2
- package/dist/src/tokens/utils.d.ts.map +1 -1
- package/dist/src/tokens/utils.js +11 -1
- package/dist/src/utils.d.ts +1 -1
- package/dist/src/utils.d.ts.map +1 -1
- package/dist/src/utils.js +9 -2
- package/package.json +13 -14
- package/dist/src/tokens/process/theme.d.ts.map +0 -1
package/dist/config.schema.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/colors/index.ts"],"names":[],"mappings":"AAAA,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/colors/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC"}
|
package/dist/src/colors/index.js
CHANGED
|
@@ -1,146 +1,3 @@
|
|
|
1
|
-
// src/colors/utils.ts
|
|
2
|
-
import chroma from "chroma-js";
|
|
3
|
-
import Colorjs from "colorjs.io";
|
|
4
|
-
import { Hsluv } from "hsluv";
|
|
5
|
-
var hexToCssHsl = (hex, valuesOnly = false) => {
|
|
6
|
-
const [h, s, l] = chroma(hex).hsl();
|
|
7
|
-
const hRounded = Math.round(h);
|
|
8
|
-
const sRounded = Math.round(s * 100);
|
|
9
|
-
const lRounded = Math.round(l * 100);
|
|
10
|
-
const cssString = `${hRounded},${sRounded}%,${lRounded}%`;
|
|
11
|
-
return valuesOnly ? cssString : `hsl(${cssString})`;
|
|
12
|
-
};
|
|
13
|
-
var hexToHSL = (hex) => {
|
|
14
|
-
const [h, s, l] = chroma(hex).hsl();
|
|
15
|
-
return [Math.round(h), Math.round(s * 100), Math.round(l * 100)];
|
|
16
|
-
};
|
|
17
|
-
var hexToHsluv = (hex) => {
|
|
18
|
-
const conv = new Hsluv();
|
|
19
|
-
conv.hex = hex;
|
|
20
|
-
conv.hexToHsluv();
|
|
21
|
-
return [conv.hsluv_h, conv.hsluv_s, conv.hsluv_l];
|
|
22
|
-
};
|
|
23
|
-
var hslArrToCss = (HSL) => {
|
|
24
|
-
return "hsl(" + HSL[0] + "," + HSL[1] + "%," + HSL[2] + "%)";
|
|
25
|
-
};
|
|
26
|
-
var HSLToHex = (h, s, l) => {
|
|
27
|
-
return chroma.hsl(h, s / 100, l / 100).hex();
|
|
28
|
-
};
|
|
29
|
-
var hexToRgb = (hex, type = "255") => {
|
|
30
|
-
const rgb = chroma(hex).rgb();
|
|
31
|
-
return {
|
|
32
|
-
r: type === "255" ? rgb[0] : rgb[0] / 255,
|
|
33
|
-
g: type === "255" ? rgb[1] : rgb[1] / 255,
|
|
34
|
-
b: type === "255" ? rgb[2] : rgb[2] / 255
|
|
35
|
-
};
|
|
36
|
-
};
|
|
37
|
-
var getContrastFromHex = (color1, color2) => {
|
|
38
|
-
const lum1 = chroma(color1).luminance();
|
|
39
|
-
const lum2 = chroma(color2).luminance();
|
|
40
|
-
return (Math.max(lum1, lum2) + 0.05) / (Math.min(lum1, lum2) + 0.05);
|
|
41
|
-
};
|
|
42
|
-
var getContrastFromLightness = (lightness, mainColor, backgroundColor) => {
|
|
43
|
-
const conv = new Hsluv();
|
|
44
|
-
conv.hex = mainColor;
|
|
45
|
-
conv.hexToHsluv();
|
|
46
|
-
conv.hsluv_l = lightness;
|
|
47
|
-
conv.hsluvToHex();
|
|
48
|
-
const lightMainColor = conv.hex;
|
|
49
|
-
const lum1 = chroma(lightMainColor).luminance();
|
|
50
|
-
const lum2 = chroma(backgroundColor).luminance();
|
|
51
|
-
const ratio = (Math.max(lum1, lum2) + 0.05) / (Math.min(lum1, lum2) + 0.05);
|
|
52
|
-
return ratio;
|
|
53
|
-
};
|
|
54
|
-
var areColorsContrasting = (color1, color2, type = "aa") => {
|
|
55
|
-
const contrast = getContrastFromHex(color1, color2);
|
|
56
|
-
if (contrast !== null) {
|
|
57
|
-
if (type === "aaa") {
|
|
58
|
-
return contrast >= 7;
|
|
59
|
-
}
|
|
60
|
-
if (type === "aa") {
|
|
61
|
-
return contrast >= 4.5;
|
|
62
|
-
}
|
|
63
|
-
return contrast >= 3;
|
|
64
|
-
}
|
|
65
|
-
return false;
|
|
66
|
-
};
|
|
67
|
-
var isHexColor = (hex) => {
|
|
68
|
-
return typeof hex === "string" && hex.length === 6 && !Number.isNaN(Number("0x" + hex));
|
|
69
|
-
};
|
|
70
|
-
var getLuminanceFromLightness = (lightness) => {
|
|
71
|
-
const conv = new Hsluv();
|
|
72
|
-
conv.hsluv_l = lightness;
|
|
73
|
-
conv.hsluvToHex();
|
|
74
|
-
return chroma(conv.hex).luminance();
|
|
75
|
-
};
|
|
76
|
-
var getLuminanceFromColor = (color) => {
|
|
77
|
-
return chroma(color).luminance();
|
|
78
|
-
};
|
|
79
|
-
var getLightnessFromHex = (hex) => {
|
|
80
|
-
const conv = new Hsluv();
|
|
81
|
-
conv.hex = hex;
|
|
82
|
-
conv.hexToHsluv();
|
|
83
|
-
return conv.hsluv_l;
|
|
84
|
-
};
|
|
85
|
-
var canTextBeUsedOnColors = (baseDefaultColor, baseActiveColor) => {
|
|
86
|
-
const defaultAgainstWhite = getContrastFromHex(baseDefaultColor, "#ffffff");
|
|
87
|
-
const defaultAgainstBlack = getContrastFromHex(baseDefaultColor, "#000000");
|
|
88
|
-
const activeAgainstWhite = getContrastFromHex(baseActiveColor, "#ffffff");
|
|
89
|
-
const activeAgainstBlack = getContrastFromHex(baseActiveColor, "#000000");
|
|
90
|
-
if (defaultAgainstWhite >= 4.5 && activeAgainstWhite >= 4.5) {
|
|
91
|
-
return true;
|
|
92
|
-
}
|
|
93
|
-
if (defaultAgainstBlack >= 4.5 && activeAgainstBlack >= 4.5) {
|
|
94
|
-
return true;
|
|
95
|
-
}
|
|
96
|
-
return false;
|
|
97
|
-
};
|
|
98
|
-
var convertToHex = (color) => {
|
|
99
|
-
if (!color) {
|
|
100
|
-
return "#000000";
|
|
101
|
-
}
|
|
102
|
-
if (/^#[0-9A-Fa-f]{6}$/.test(color)) {
|
|
103
|
-
return color;
|
|
104
|
-
}
|
|
105
|
-
return chroma(color).hex();
|
|
106
|
-
};
|
|
107
|
-
var rgbToHex = (rgb) => {
|
|
108
|
-
return `#${[rgb.r, rgb.g, rgb.b].map((x) => {
|
|
109
|
-
const hex = Math.round(x * 255).toString(16);
|
|
110
|
-
return hex.length === 1 ? "0" + hex : hex;
|
|
111
|
-
}).join("")}`;
|
|
112
|
-
};
|
|
113
|
-
var convertColor = (cssColor, format) => {
|
|
114
|
-
const color = new Colorjs(cssColor);
|
|
115
|
-
switch (format) {
|
|
116
|
-
case "rgb":
|
|
117
|
-
case "rgba":
|
|
118
|
-
return color.toString({
|
|
119
|
-
format: {
|
|
120
|
-
name: format,
|
|
121
|
-
coords: ["<number>[0, 255]", "<number>[0, 255]", "<number>[0, 255]"]
|
|
122
|
-
},
|
|
123
|
-
precision: 3
|
|
124
|
-
});
|
|
125
|
-
case "hex":
|
|
126
|
-
return color.toString({ format, precision: 3 });
|
|
127
|
-
case "hct":
|
|
128
|
-
return color.to(format).toString({
|
|
129
|
-
format: {
|
|
130
|
-
name: format,
|
|
131
|
-
coords: ["<number>", "<number>", "<number>"]
|
|
132
|
-
},
|
|
133
|
-
precision: 3
|
|
134
|
-
});
|
|
135
|
-
default:
|
|
136
|
-
return color.to(format).toString({ precision: 3 });
|
|
137
|
-
}
|
|
138
|
-
};
|
|
139
|
-
|
|
140
|
-
// src/colors/theme.ts
|
|
141
|
-
import chroma2 from "chroma-js";
|
|
142
|
-
import * as R2 from "ramda";
|
|
143
|
-
|
|
144
1
|
// src/colors/colorMetadata.ts
|
|
145
2
|
import * as R from "ramda";
|
|
146
3
|
var baseColors = {
|
|
@@ -397,6 +254,149 @@ var getColorMetadataByNumber = (number) => {
|
|
|
397
254
|
return colorMetadataByNumber[number];
|
|
398
255
|
};
|
|
399
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 hexToCssHsl = (hex, valuesOnly = false) => {
|
|
266
|
+
const [h, s, l] = chroma(hex).hsl();
|
|
267
|
+
const hRounded = Math.round(h);
|
|
268
|
+
const sRounded = Math.round(s * 100);
|
|
269
|
+
const lRounded = Math.round(l * 100);
|
|
270
|
+
const cssString = `${hRounded},${sRounded}%,${lRounded}%`;
|
|
271
|
+
return valuesOnly ? cssString : `hsl(${cssString})`;
|
|
272
|
+
};
|
|
273
|
+
var hexToHSL = (hex) => {
|
|
274
|
+
const [h, s, l] = chroma(hex).hsl();
|
|
275
|
+
return [Math.round(h), Math.round(s * 100), Math.round(l * 100)];
|
|
276
|
+
};
|
|
277
|
+
var hexToHsluv = (hex) => {
|
|
278
|
+
const conv = new Hsluv();
|
|
279
|
+
conv.hex = hex;
|
|
280
|
+
conv.hexToHsluv();
|
|
281
|
+
return [conv.hsluv_h, conv.hsluv_s, conv.hsluv_l];
|
|
282
|
+
};
|
|
283
|
+
var hslArrToCss = (HSL) => {
|
|
284
|
+
return "hsl(" + HSL[0] + "," + HSL[1] + "%," + HSL[2] + "%)";
|
|
285
|
+
};
|
|
286
|
+
var HSLToHex = (h, s, l) => {
|
|
287
|
+
return chroma.hsl(h, s / 100, l / 100).hex();
|
|
288
|
+
};
|
|
289
|
+
var hexToRgb = (hex, type = "255") => {
|
|
290
|
+
const rgb = chroma(hex).rgb();
|
|
291
|
+
return {
|
|
292
|
+
r: type === "255" ? rgb[0] : rgb[0] / 255,
|
|
293
|
+
g: type === "255" ? rgb[1] : rgb[1] / 255,
|
|
294
|
+
b: type === "255" ? rgb[2] : rgb[2] / 255
|
|
295
|
+
};
|
|
296
|
+
};
|
|
297
|
+
var getContrastFromHex = (color1, color2) => {
|
|
298
|
+
const lum1 = chroma(color1).luminance();
|
|
299
|
+
const lum2 = chroma(color2).luminance();
|
|
300
|
+
return (Math.max(lum1, lum2) + 0.05) / (Math.min(lum1, lum2) + 0.05);
|
|
301
|
+
};
|
|
302
|
+
var getContrastFromLightness = (lightness, mainColor, backgroundColor) => {
|
|
303
|
+
const conv = new Hsluv();
|
|
304
|
+
conv.hex = mainColor;
|
|
305
|
+
conv.hexToHsluv();
|
|
306
|
+
conv.hsluv_l = lightness;
|
|
307
|
+
conv.hsluvToHex();
|
|
308
|
+
const lightMainColor = conv.hex;
|
|
309
|
+
const lum1 = chroma(lightMainColor).luminance();
|
|
310
|
+
const lum2 = chroma(backgroundColor).luminance();
|
|
311
|
+
const ratio = (Math.max(lum1, lum2) + 0.05) / (Math.min(lum1, lum2) + 0.05);
|
|
312
|
+
return ratio;
|
|
313
|
+
};
|
|
314
|
+
var areColorsContrasting = (color1, color2, type = "aa") => {
|
|
315
|
+
const contrast = getContrastFromHex(color1, color2);
|
|
316
|
+
if (contrast !== null) {
|
|
317
|
+
if (type === "aaa") {
|
|
318
|
+
return contrast >= 7;
|
|
319
|
+
}
|
|
320
|
+
if (type === "aa") {
|
|
321
|
+
return contrast >= 4.5;
|
|
322
|
+
}
|
|
323
|
+
return contrast >= 3;
|
|
324
|
+
}
|
|
325
|
+
return false;
|
|
326
|
+
};
|
|
327
|
+
var isHexColor = (hex) => {
|
|
328
|
+
return typeof hex === "string" && hex.length === 6 && !Number.isNaN(Number("0x" + hex));
|
|
329
|
+
};
|
|
330
|
+
var getLuminanceFromLightness = (lightness) => {
|
|
331
|
+
const conv = new Hsluv();
|
|
332
|
+
conv.hsluv_l = lightness;
|
|
333
|
+
conv.hsluvToHex();
|
|
334
|
+
return chroma(conv.hex).luminance();
|
|
335
|
+
};
|
|
336
|
+
var getLuminanceFromColor = (color) => {
|
|
337
|
+
return chroma(color).luminance();
|
|
338
|
+
};
|
|
339
|
+
var getLightnessFromHex = (hex) => {
|
|
340
|
+
const conv = new Hsluv();
|
|
341
|
+
conv.hex = hex;
|
|
342
|
+
conv.hexToHsluv();
|
|
343
|
+
return conv.hsluv_l;
|
|
344
|
+
};
|
|
345
|
+
var canTextBeUsedOnColors = (baseDefaultColor, baseActiveColor) => {
|
|
346
|
+
const defaultAgainstWhite = getContrastFromHex(baseDefaultColor, "#ffffff");
|
|
347
|
+
const defaultAgainstBlack = getContrastFromHex(baseDefaultColor, "#000000");
|
|
348
|
+
const activeAgainstWhite = getContrastFromHex(baseActiveColor, "#ffffff");
|
|
349
|
+
const activeAgainstBlack = getContrastFromHex(baseActiveColor, "#000000");
|
|
350
|
+
if (defaultAgainstWhite >= 4.5 && activeAgainstWhite >= 4.5) {
|
|
351
|
+
return true;
|
|
352
|
+
}
|
|
353
|
+
if (defaultAgainstBlack >= 4.5 && activeAgainstBlack >= 4.5) {
|
|
354
|
+
return true;
|
|
355
|
+
}
|
|
356
|
+
return false;
|
|
357
|
+
};
|
|
358
|
+
var convertToHex = (color) => {
|
|
359
|
+
if (!color) {
|
|
360
|
+
return "#000000";
|
|
361
|
+
}
|
|
362
|
+
if (/^#[0-9A-Fa-f]{6}$/.test(color)) {
|
|
363
|
+
return color;
|
|
364
|
+
}
|
|
365
|
+
return chroma(color).hex();
|
|
366
|
+
};
|
|
367
|
+
var rgbToHex = (rgb) => {
|
|
368
|
+
return `#${[rgb.r, rgb.g, rgb.b].map((x) => {
|
|
369
|
+
const hex = Math.round(x * 255).toString(16);
|
|
370
|
+
return hex.length === 1 ? "0" + hex : hex;
|
|
371
|
+
}).join("")}`;
|
|
372
|
+
};
|
|
373
|
+
var convertColor = (cssColor, format) => {
|
|
374
|
+
const color = new Colorjs(cssColor);
|
|
375
|
+
switch (format) {
|
|
376
|
+
case "rgb":
|
|
377
|
+
case "rgba":
|
|
378
|
+
return color.toString({
|
|
379
|
+
format: {
|
|
380
|
+
name: format,
|
|
381
|
+
coords: ["<number>[0, 255]", "<number>[0, 255]", "<number>[0, 255]"]
|
|
382
|
+
},
|
|
383
|
+
precision: 3
|
|
384
|
+
});
|
|
385
|
+
case "hex":
|
|
386
|
+
return color.toString({ format, precision: 3 });
|
|
387
|
+
case "hct":
|
|
388
|
+
return color.to(format).toString({
|
|
389
|
+
format: {
|
|
390
|
+
name: format,
|
|
391
|
+
coords: ["<number>", "<number>", "<number>"]
|
|
392
|
+
},
|
|
393
|
+
precision: 3
|
|
394
|
+
});
|
|
395
|
+
default:
|
|
396
|
+
return color.to(format).toString({ precision: 3 });
|
|
397
|
+
}
|
|
398
|
+
};
|
|
399
|
+
|
|
400
400
|
// src/colors/theme.ts
|
|
401
401
|
var RESERVED_COLORS = [
|
|
402
402
|
"neutral",
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import type { CssColor } from './types.js';
|
|
2
|
-
import type { Color, ColorNumber, ColorScheme, ThemeInfo } from './types.js';
|
|
1
|
+
import type { Color, ColorNumber, ColorScheme, CssColor, ThemeInfo } from './types.js';
|
|
3
2
|
export declare const RESERVED_COLORS: string[];
|
|
4
3
|
/**
|
|
5
4
|
* Generates a color scale based on a base color and a color mode.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/colors/theme.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/colors/theme.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAGvF,eAAO,MAAM,eAAe,UAW3B,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,GAAI,OAAO,QAAQ,EAAE,aAAa,WAAW,KAAG,KAAK,EAiCnF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,GAAI,OAAO,QAAQ,KAAG,SAIrD,CAAC;AAgCH;;;;;GAKG;AACH,eAAO,MAAM,qBAAqB,GAAI,OAAO,QAAQ,EAAE,MAAM,SAAS,GAAG,QAAQ,KAAG,QAgBnF,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,GAAI,WAAW,MAAM,EAAE,aAAa,WAAW,WAEzE,CAAC"}
|
package/dist/src/config.d.ts
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
import { z } from 'zod/v4';
|
|
2
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Validates a configuration object against a provided Zod schema.
|
|
4
|
+
*
|
|
5
|
+
* @template T - The expected type of the validated configuration.
|
|
6
|
+
* @param schema - A Zod schema used to validate the configuration object.
|
|
7
|
+
* @param unvalidatedConfig - The configuration object to validate.
|
|
8
|
+
* @returns The validated configuration object, typed as T.
|
|
9
|
+
* @throws Exits the process with code 1 if validation fails, after logging a friendly error message.
|
|
10
|
+
*/
|
|
11
|
+
export declare function validateConfig<T>(schema: z.ZodType<T>, unvalidatedConfig: Record<string, unknown>, configPath: string): T;
|
|
12
|
+
export declare function parseConfig<T>(schema: z.ZodType<T>, configFile: string, configPath: string): T;
|
|
3
13
|
export declare const colorRegex: RegExp;
|
|
4
14
|
declare const themeSchema: z.ZodObject<{
|
|
5
15
|
colors: z.ZodObject<{
|
|
@@ -12,13 +22,13 @@ declare const themeSchema: z.ZodObject<{
|
|
|
12
22
|
}, z.core.$strip>>;
|
|
13
23
|
borderRadius: z.ZodOptional<z.ZodNumber>;
|
|
14
24
|
}, z.core.$strip>;
|
|
15
|
-
|
|
16
|
-
* This defines the structure of the JSON config file
|
|
17
|
-
*/
|
|
18
|
-
export declare const configFileSchema: z.ZodObject<{
|
|
19
|
-
outDir: z.ZodOptional<z.ZodString>;
|
|
25
|
+
export declare const configFileBuildSchema: z.ZodObject<{
|
|
20
26
|
clean: z.ZodOptional<z.ZodBoolean>;
|
|
21
|
-
|
|
27
|
+
}, z.core.$strip>;
|
|
28
|
+
export declare const configFileCreateSchema: z.ZodObject<{
|
|
29
|
+
outDir: z.ZodNonOptional<z.ZodString>;
|
|
30
|
+
clean: z.ZodNonOptional<z.ZodOptional<z.ZodBoolean>>;
|
|
31
|
+
themes: z.ZodNonOptional<z.ZodRecord<z.ZodString, z.ZodObject<{
|
|
22
32
|
colors: z.ZodObject<{
|
|
23
33
|
main: z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
24
34
|
support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>>>;
|
|
@@ -28,15 +38,13 @@ export declare const configFileSchema: z.ZodObject<{
|
|
|
28
38
|
fontFamily: z.ZodString;
|
|
29
39
|
}, z.core.$strip>>;
|
|
30
40
|
borderRadius: z.ZodOptional<z.ZodNumber>;
|
|
31
|
-
}, z.core.$strip
|
|
41
|
+
}, z.core.$strip>>>;
|
|
32
42
|
}, z.core.$strip>;
|
|
33
43
|
/**
|
|
34
|
-
* This defines the structure of the final configuration
|
|
35
|
-
* command-line options and default values.
|
|
44
|
+
* This defines the structure of the final configuration file
|
|
36
45
|
*/
|
|
37
46
|
export declare const combinedConfigSchema: z.ZodObject<{
|
|
38
|
-
outDir: z.ZodNonOptional<z.
|
|
39
|
-
clean: z.ZodNonOptional<z.ZodOptional<z.ZodBoolean>>;
|
|
47
|
+
outDir: z.ZodNonOptional<z.ZodString>;
|
|
40
48
|
themes: z.ZodNonOptional<z.ZodRecord<z.ZodString, z.ZodObject<{
|
|
41
49
|
colors: z.ZodObject<{
|
|
42
50
|
main: z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
@@ -48,8 +56,11 @@ export declare const combinedConfigSchema: z.ZodObject<{
|
|
|
48
56
|
}, z.core.$strip>>;
|
|
49
57
|
borderRadius: z.ZodOptional<z.ZodNumber>;
|
|
50
58
|
}, z.core.$strip>>>;
|
|
59
|
+
clean: z.ZodOptional<z.ZodBoolean>;
|
|
51
60
|
}, z.core.$strip>;
|
|
52
|
-
export type
|
|
53
|
-
export type
|
|
61
|
+
export type ConfigSchema = z.infer<typeof combinedConfigSchema>;
|
|
62
|
+
export type ConfigSchemaBuild = z.infer<typeof configFileBuildSchema>;
|
|
63
|
+
export type ConfigSchemaCreate = z.infer<typeof configFileCreateSchema>;
|
|
64
|
+
export type ConfigSchemaTheme = z.infer<typeof themeSchema>;
|
|
54
65
|
export {};
|
|
55
66
|
//# sourceMappingURL=config.d.ts.map
|
package/dist/src/config.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/config.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/config.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAiC3B;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAC9B,MAAM,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EACpB,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC1C,UAAU,EAAE,MAAM,GACjB,CAAC,CASH;AAED,wBAAgB,WAAW,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,CAAC,CAc9F;AAWD,eAAO,MAAM,UAAU,QAA2C,CAAC;AAyBnE,QAAA,MAAM,WAAW;;;;;;;;;;iBAiBmG,CAAC;AAErH,eAAO,MAAM,qBAAqB;;iBAEhC,CAAC;AAEH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;iBAYtB,CAAC;AAEd;;GAEG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;iBAA6D,CAAC;AAC/F,MAAM,MAAM,YAAY,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC;AAChE,MAAM,MAAM,iBAAiB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,qBAAqB,CAAC,CAAC;AACtE,MAAM,MAAM,kBAAkB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,sBAAsB,CAAC,CAAC;AACxE,MAAM,MAAM,iBAAiB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,WAAW,CAAC,CAAC"}
|
package/dist/src/config.js
CHANGED
|
@@ -1,24 +1,8 @@
|
|
|
1
1
|
// src/config.ts
|
|
2
|
+
import chalk from "chalk";
|
|
2
3
|
import * as R7 from "ramda";
|
|
3
4
|
import { z } from "zod/v4";
|
|
4
|
-
|
|
5
|
-
// src/colors/utils.ts
|
|
6
|
-
import chroma from "chroma-js";
|
|
7
|
-
import Colorjs from "colorjs.io";
|
|
8
|
-
import { Hsluv } from "hsluv";
|
|
9
|
-
var convertToHex = (color) => {
|
|
10
|
-
if (!color) {
|
|
11
|
-
return "#000000";
|
|
12
|
-
}
|
|
13
|
-
if (/^#[0-9A-Fa-f]{6}$/.test(color)) {
|
|
14
|
-
return color;
|
|
15
|
-
}
|
|
16
|
-
return chroma(color).hex();
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
// src/colors/theme.ts
|
|
20
|
-
import chroma2 from "chroma-js";
|
|
21
|
-
import * as R2 from "ramda";
|
|
5
|
+
import { fromError } from "zod-validation-error";
|
|
22
6
|
|
|
23
7
|
// src/colors/colorMetadata.ts
|
|
24
8
|
import * as R from "ramda";
|
|
@@ -266,6 +250,24 @@ var colorMetadata = {
|
|
|
266
250
|
};
|
|
267
251
|
var colorMetadataByNumber = R.indexBy((metadata) => metadata.number, Object.values(colorMetadata));
|
|
268
252
|
|
|
253
|
+
// src/colors/theme.ts
|
|
254
|
+
import chroma2 from "chroma-js";
|
|
255
|
+
import * as R2 from "ramda";
|
|
256
|
+
|
|
257
|
+
// src/colors/utils.ts
|
|
258
|
+
import chroma from "chroma-js";
|
|
259
|
+
import Colorjs from "colorjs.io";
|
|
260
|
+
import { Hsluv } from "hsluv";
|
|
261
|
+
var convertToHex = (color) => {
|
|
262
|
+
if (!color) {
|
|
263
|
+
return "#000000";
|
|
264
|
+
}
|
|
265
|
+
if (/^#[0-9A-Fa-f]{6}$/.test(color)) {
|
|
266
|
+
return color;
|
|
267
|
+
}
|
|
268
|
+
return chroma(color).hex();
|
|
269
|
+
};
|
|
270
|
+
|
|
269
271
|
// src/colors/theme.ts
|
|
270
272
|
var RESERVED_COLORS = [
|
|
271
273
|
"neutral",
|
|
@@ -296,6 +298,7 @@ import * as R6 from "ramda";
|
|
|
296
298
|
var cliOptions = {
|
|
297
299
|
outDir: "out-dir",
|
|
298
300
|
clean: "clean",
|
|
301
|
+
tailwind: "tailwind",
|
|
299
302
|
theme: {
|
|
300
303
|
colors: {
|
|
301
304
|
main: "main-colors",
|
|
@@ -318,6 +321,42 @@ function mapPathToOptionName(path2) {
|
|
|
318
321
|
}
|
|
319
322
|
return option;
|
|
320
323
|
}
|
|
324
|
+
function makeFriendlyError(err) {
|
|
325
|
+
return fromError(err, {
|
|
326
|
+
messageBuilder: (issues) => issues.map((issue) => {
|
|
327
|
+
const issuePath = issue.path.join(".");
|
|
328
|
+
const optionName = mapPathToOptionName(issue.path);
|
|
329
|
+
const errorCode = `(error code: ${issue.code})`;
|
|
330
|
+
const optionMessage = optionName ? ` or CLI option --${optionName}` : "";
|
|
331
|
+
return ` - Error in JSON value ${chalk.red(issuePath)}${optionMessage}:
|
|
332
|
+
${issue.message} ${chalk.dim(errorCode)}`;
|
|
333
|
+
}).join("\n")
|
|
334
|
+
});
|
|
335
|
+
}
|
|
336
|
+
function validateConfig(schema, unvalidatedConfig, configPath) {
|
|
337
|
+
try {
|
|
338
|
+
return schema.parse(unvalidatedConfig);
|
|
339
|
+
} catch (err) {
|
|
340
|
+
console.error(chalk.redBright(`Invalid config file at ${chalk.red(configPath)}`));
|
|
341
|
+
const validationError = makeFriendlyError(err);
|
|
342
|
+
console.error(validationError.toString());
|
|
343
|
+
process.exit(1);
|
|
344
|
+
}
|
|
345
|
+
}
|
|
346
|
+
function parseConfig(schema, configFile, configPath) {
|
|
347
|
+
if (!configFile) {
|
|
348
|
+
return {};
|
|
349
|
+
}
|
|
350
|
+
try {
|
|
351
|
+
const parsedConfig = JSON.parse(configFile);
|
|
352
|
+
return schema.parse(parsedConfig);
|
|
353
|
+
} catch (err) {
|
|
354
|
+
console.error(chalk.redBright(`Failed parsing config file at ${chalk.red(configPath)}`));
|
|
355
|
+
const validationError = makeFriendlyError(err);
|
|
356
|
+
console.error(validationError.toString());
|
|
357
|
+
process.exit(1);
|
|
358
|
+
}
|
|
359
|
+
}
|
|
321
360
|
var hexPatterns = [
|
|
322
361
|
// Hex colors: #000, #0000, #000000, #00000000
|
|
323
362
|
`#[0-9a-fA-F]{3}`,
|
|
@@ -352,17 +391,22 @@ var themeSchema = z.object({
|
|
|
352
391
|
}).describe("Defines the typography for a given theme").optional(),
|
|
353
392
|
borderRadius: z.number().meta({ description: "Defines the border-radius for this theme" }).optional()
|
|
354
393
|
}).meta({ description: "An object defining a theme. The property name holding the object becomes the theme name." });
|
|
355
|
-
var
|
|
356
|
-
|
|
394
|
+
var configFileBuildSchema = z.object({
|
|
395
|
+
clean: z.boolean().meta({ description: "Delete the output directory before building or creating tokens" }).optional()
|
|
396
|
+
});
|
|
397
|
+
var configFileCreateSchema = z.object({
|
|
398
|
+
outDir: z.string().meta({ description: "Path to the output directory for the created design tokens" }),
|
|
357
399
|
clean: z.boolean().meta({ description: "Delete the output directory before building or creating tokens" }).optional(),
|
|
358
400
|
themes: z.record(z.string(), themeSchema).meta({
|
|
359
401
|
description: "An object with one or more themes. Each property defines a theme, and the property name is used as the theme name."
|
|
360
402
|
})
|
|
361
|
-
});
|
|
362
|
-
var combinedConfigSchema =
|
|
403
|
+
}).required();
|
|
404
|
+
var combinedConfigSchema = configFileCreateSchema.extend(configFileBuildSchema.shape);
|
|
363
405
|
export {
|
|
364
406
|
colorRegex,
|
|
365
407
|
combinedConfigSchema,
|
|
366
|
-
|
|
367
|
-
|
|
408
|
+
configFileBuildSchema,
|
|
409
|
+
configFileCreateSchema,
|
|
410
|
+
parseConfig,
|
|
411
|
+
validateConfig
|
|
368
412
|
};
|