@digdir/designsystemet 0.0.0-deps-tsdown-20260421103939
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/LICENSE +7 -0
- package/README.md +115 -0
- package/configs/test-tokens.config.json +82 -0
- package/dist/bin/config.d.ts +12 -0
- package/dist/bin/config.d.ts.map +1 -0
- package/dist/bin/config.js +58 -0
- package/dist/bin/designsystemet.d.ts +3 -0
- package/dist/bin/designsystemet.d.ts.map +1 -0
- package/dist/bin/designsystemet.js +156 -0
- package/dist/bin/options.d.ts +21 -0
- package/dist/bin/options.d.ts.map +1 -0
- package/dist/bin/options.js +23 -0
- package/dist/config.schema.json +209 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BorderValues.js +9 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BoxShadowTypes.js +8 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BoxShadowValues.js +13 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/ColorModifierTypes.js +10 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/ColorSpaceTypes.js +10 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/Properties.js +53 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/StrokeStyleValues.js +14 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TokenSetStatus.js +9 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TokenTypes.js +32 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TypographyValues.js +15 -0
- package/dist/node_modules/.pnpm/@tokens-studio_types@0.5.2/node_modules/@tokens-studio/types/dist/types/index.js +11 -0
- package/dist/package.js +5 -0
- package/dist/src/colors/colorMetadata.d.ts +56 -0
- package/dist/src/colors/colorMetadata.d.ts.map +1 -0
- package/dist/src/colors/colorMetadata.js +259 -0
- package/dist/src/colors/index.d.ts +5 -0
- package/dist/src/colors/index.d.ts.map +1 -0
- package/dist/src/colors/index.js +5 -0
- package/dist/src/colors/theme.d.ts +30 -0
- package/dist/src/colors/theme.d.ts.map +1 -0
- package/dist/src/colors/theme.js +111 -0
- package/dist/src/colors/types.d.ts +69 -0
- package/dist/src/colors/types.d.ts.map +1 -0
- package/dist/src/colors/types.js +24 -0
- package/dist/src/colors/utils.d.ts +128 -0
- package/dist/src/colors/utils.d.ts.map +1 -0
- package/dist/src/colors/utils.js +244 -0
- package/dist/src/config.d.ts +181 -0
- package/dist/src/config.d.ts.map +1 -0
- package/dist/src/config.js +118 -0
- package/dist/src/index.d.ts +4 -0
- package/dist/src/index.d.ts.map +1 -0
- package/dist/src/index.js +10 -0
- package/dist/src/migrations/beta-to-v1.d.ts +3 -0
- package/dist/src/migrations/beta-to-v1.d.ts.map +1 -0
- package/dist/src/migrations/beta-to-v1.js +340 -0
- package/dist/src/migrations/codemods/css/plugins.d.ts +6 -0
- package/dist/src/migrations/codemods/css/plugins.d.ts.map +1 -0
- package/dist/src/migrations/codemods/css/plugins.js +35 -0
- package/dist/src/migrations/codemods/css/run.d.ts +8 -0
- package/dist/src/migrations/codemods/css/run.d.ts.map +1 -0
- package/dist/src/migrations/codemods/css/run.js +23 -0
- package/dist/src/migrations/color-rename-next49.d.ts +3 -0
- package/dist/src/migrations/color-rename-next49.d.ts.map +1 -0
- package/dist/src/migrations/color-rename-next49.js +46 -0
- package/dist/src/migrations/index.d.ts +6 -0
- package/dist/src/migrations/index.d.ts.map +1 -0
- package/dist/src/migrations/index.js +9 -0
- package/dist/src/scripts/createJsonSchema.d.ts +2 -0
- package/dist/src/scripts/createJsonSchema.d.ts.map +1 -0
- package/dist/src/scripts/update-preview-tokens.d.ts +3 -0
- package/dist/src/scripts/update-preview-tokens.d.ts.map +1 -0
- package/dist/src/tokens/build.d.ts +4 -0
- package/dist/src/tokens/build.d.ts.map +1 -0
- package/dist/src/tokens/build.js +41 -0
- package/dist/src/tokens/create/files.d.ts +11 -0
- package/dist/src/tokens/create/files.d.ts.map +1 -0
- package/dist/src/tokens/create/files.js +44 -0
- package/dist/src/tokens/create/generators/$designsystemet.d.ts +5 -0
- package/dist/src/tokens/create/generators/$designsystemet.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/$designsystemet.js +10 -0
- package/dist/src/tokens/create/generators/$metadata.d.ts +8 -0
- package/dist/src/tokens/create/generators/$metadata.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/$metadata.js +19 -0
- package/dist/src/tokens/create/generators/$themes.d.ts +27 -0
- package/dist/src/tokens/create/generators/$themes.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/$themes.js +158 -0
- package/dist/src/tokens/create/generators/primitives/color-scheme.d.ts +5 -0
- package/dist/src/tokens/create/generators/primitives/color-scheme.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/primitives/color-scheme.js +71 -0
- package/dist/src/tokens/create/generators/primitives/globals.d.ts +3 -0
- package/dist/src/tokens/create/generators/primitives/globals.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/primitives/globals.js +142 -0
- package/dist/src/tokens/create/generators/primitives/size.d.ts +4 -0
- package/dist/src/tokens/create/generators/primitives/size.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/primitives/size.js +147 -0
- package/dist/src/tokens/create/generators/primitives/typography.d.ts +4 -0
- package/dist/src/tokens/create/generators/primitives/typography.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/primitives/typography.js +216 -0
- package/dist/src/tokens/create/generators/semantic/color-modes.d.ts +8 -0
- package/dist/src/tokens/create/generators/semantic/color-modes.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/semantic/color-modes.js +26 -0
- package/dist/src/tokens/create/generators/semantic/color.d.ts +5 -0
- package/dist/src/tokens/create/generators/semantic/color.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/semantic/color.js +46 -0
- package/dist/src/tokens/create/generators/semantic/style.d.ts +3 -0
- package/dist/src/tokens/create/generators/semantic/style.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/semantic/style.js +381 -0
- package/dist/src/tokens/create/generators/themes/theme.d.ts +3 -0
- package/dist/src/tokens/create/generators/themes/theme.d.ts.map +1 -0
- package/dist/src/tokens/create/generators/themes/theme.js +112 -0
- package/dist/src/tokens/create.d.ts +21 -0
- package/dist/src/tokens/create.d.ts.map +1 -0
- package/dist/src/tokens/create.js +47 -0
- package/dist/src/tokens/format.d.ts +15 -0
- package/dist/src/tokens/format.d.ts.map +1 -0
- package/dist/src/tokens/format.js +41 -0
- package/dist/src/tokens/generate-config.d.ts +10 -0
- package/dist/src/tokens/generate-config.d.ts.map +1 -0
- package/dist/src/tokens/generate-config.js +178 -0
- package/dist/src/tokens/index.d.ts +4 -0
- package/dist/src/tokens/index.d.ts.map +1 -0
- package/dist/src/tokens/index.js +3 -0
- package/dist/src/tokens/process/configs/color.d.ts +12 -0
- package/dist/src/tokens/process/configs/color.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/color.js +51 -0
- package/dist/src/tokens/process/configs/semantic.d.ts +3 -0
- package/dist/src/tokens/process/configs/semantic.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/semantic.js +47 -0
- package/dist/src/tokens/process/configs/shared.d.ts +10 -0
- package/dist/src/tokens/process/configs/shared.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/shared.js +19 -0
- package/dist/src/tokens/process/configs/size-mode.d.ts +3 -0
- package/dist/src/tokens/process/configs/size-mode.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/size-mode.js +28 -0
- package/dist/src/tokens/process/configs/size.d.ts +3 -0
- package/dist/src/tokens/process/configs/size.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/size.js +34 -0
- package/dist/src/tokens/process/configs/type-scale.d.ts +3 -0
- package/dist/src/tokens/process/configs/type-scale.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/type-scale.js +49 -0
- package/dist/src/tokens/process/configs/typography.d.ts +3 -0
- package/dist/src/tokens/process/configs/typography.d.ts.map +1 -0
- package/dist/src/tokens/process/configs/typography.js +64 -0
- package/dist/src/tokens/process/configs.d.ts +20 -0
- package/dist/src/tokens/process/configs.d.ts.map +1 -0
- package/dist/src/tokens/process/configs.js +90 -0
- package/dist/src/tokens/process/formats/css/color.d.ts +4 -0
- package/dist/src/tokens/process/formats/css/color.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css/color.js +63 -0
- package/dist/src/tokens/process/formats/css/semantic.d.ts +3 -0
- package/dist/src/tokens/process/formats/css/semantic.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css/semantic.js +29 -0
- package/dist/src/tokens/process/formats/css/size-mode.d.ts +4 -0
- package/dist/src/tokens/process/formats/css/size-mode.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css/size-mode.js +50 -0
- package/dist/src/tokens/process/formats/css/size.d.ts +21 -0
- package/dist/src/tokens/process/formats/css/size.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css/size.js +93 -0
- package/dist/src/tokens/process/formats/css/type-scale.d.ts +3 -0
- package/dist/src/tokens/process/formats/css/type-scale.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css/type-scale.js +55 -0
- package/dist/src/tokens/process/formats/css/typography.d.ts +3 -0
- package/dist/src/tokens/process/formats/css/typography.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css/typography.js +29 -0
- package/dist/src/tokens/process/formats/css.d.ts +11 -0
- package/dist/src/tokens/process/formats/css.d.ts.map +1 -0
- package/dist/src/tokens/process/formats/css.js +18 -0
- package/dist/src/tokens/process/output/declarations.d.ts +5 -0
- package/dist/src/tokens/process/output/declarations.d.ts.map +1 -0
- package/dist/src/tokens/process/output/declarations.js +38 -0
- 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 +45 -0
- package/dist/src/tokens/process/output/theme.d.ts +27 -0
- package/dist/src/tokens/process/output/theme.d.ts.map +1 -0
- package/dist/src/tokens/process/output/theme.js +83 -0
- package/dist/src/tokens/process/platform.d.ts +106 -0
- package/dist/src/tokens/process/platform.d.ts.map +1 -0
- package/dist/src/tokens/process/platform.js +168 -0
- package/dist/src/tokens/process/transformers.d.ts +6 -0
- package/dist/src/tokens/process/transformers.d.ts.map +1 -0
- package/dist/src/tokens/process/transformers.js +54 -0
- package/dist/src/tokens/process/utils/getMultidimensionalThemes.d.ts +36 -0
- package/dist/src/tokens/process/utils/getMultidimensionalThemes.d.ts.map +1 -0
- package/dist/src/tokens/process/utils/getMultidimensionalThemes.js +114 -0
- package/dist/src/tokens/process/utils/kebab-case.d.ts +5 -0
- package/dist/src/tokens/process/utils/kebab-case.d.ts.map +1 -0
- package/dist/src/tokens/process/utils/kebab-case.js +9 -0
- package/dist/src/tokens/types.d.ts +74 -0
- package/dist/src/tokens/types.d.ts.map +1 -0
- package/dist/src/tokens/types.js +7 -0
- package/dist/src/tokens/utils.d.ts +63 -0
- package/dist/src/tokens/utils.d.ts.map +1 -0
- package/dist/src/tokens/utils.js +121 -0
- package/dist/src/types.d.ts +6 -0
- package/dist/src/types.d.ts.map +1 -0
- package/dist/src/types.js +2 -0
- package/dist/src/utils/filesystem.d.ts +40 -0
- package/dist/src/utils/filesystem.d.ts.map +1 -0
- package/dist/src/utils/filesystem.js +115 -0
- package/package.json +87 -0
|
@@ -0,0 +1,244 @@
|
|
|
1
|
+
import chroma from "chroma-js";
|
|
2
|
+
import Colorjs from "colorjs.io";
|
|
3
|
+
import { Hsluv } from "hsluv";
|
|
4
|
+
//#region src/colors/utils.ts
|
|
5
|
+
/**
|
|
6
|
+
* Converts a HEX color '#xxxxxx' into a CSS HSL string 'hsl(x,x,x)'
|
|
7
|
+
*
|
|
8
|
+
* @param hex A hex color string
|
|
9
|
+
* @param valuesOnly If true, only the values are returned
|
|
10
|
+
* @returns A CSS HSL string
|
|
11
|
+
*/
|
|
12
|
+
const hexToCssHsl = (hex, valuesOnly = false) => {
|
|
13
|
+
const [h, s, l] = chroma(hex).hsl();
|
|
14
|
+
const cssString = `${Math.round(h)},${Math.round(s * 100)}%,${Math.round(l * 100)}%`;
|
|
15
|
+
return valuesOnly ? cssString : `hsl(${cssString})`;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* Converts a HEX string '#xxxxxx' into an array of HSL values '[h,s,l]'
|
|
19
|
+
*
|
|
20
|
+
* @param H A Hex color string
|
|
21
|
+
* @returns HSL values in an array
|
|
22
|
+
*/
|
|
23
|
+
const hexToHSL = (hex) => {
|
|
24
|
+
const [h, s, l] = chroma(hex).hsl();
|
|
25
|
+
return [
|
|
26
|
+
Math.round(h),
|
|
27
|
+
Math.round(s * 100),
|
|
28
|
+
Math.round(l * 100)
|
|
29
|
+
];
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* Converts a HEX color '#xxxxxx' into an array of HSLuv values '[h,s,l]'
|
|
33
|
+
*
|
|
34
|
+
* @param hex A hex color string
|
|
35
|
+
* @returns
|
|
36
|
+
*/
|
|
37
|
+
const hexToHsluv = (hex) => {
|
|
38
|
+
const conv = new Hsluv();
|
|
39
|
+
conv.hex = hex;
|
|
40
|
+
conv.hexToHsluv();
|
|
41
|
+
return [
|
|
42
|
+
conv.hsluv_h,
|
|
43
|
+
conv.hsluv_s,
|
|
44
|
+
conv.hsluv_l
|
|
45
|
+
];
|
|
46
|
+
};
|
|
47
|
+
/**
|
|
48
|
+
* Converts a HSL number array '[h,s,l]' into HSL CSS string 'hsl(x,x,x)'
|
|
49
|
+
*
|
|
50
|
+
* @param HSL A HSL number array '[h,s,l]'
|
|
51
|
+
* @returns A hex color string
|
|
52
|
+
*/
|
|
53
|
+
const hslArrToCss = (HSL) => {
|
|
54
|
+
return "hsl(" + HSL[0] + "," + HSL[1] + "%," + HSL[2] + "%)";
|
|
55
|
+
};
|
|
56
|
+
/**
|
|
57
|
+
* Converts a HSL CSS string 'hsl(x,x,x)' into an array of HSL values '[h,s,l]'
|
|
58
|
+
*
|
|
59
|
+
* @param h The HSL hue
|
|
60
|
+
* @param s The HSL saturation
|
|
61
|
+
* @param l The HSL lightness
|
|
62
|
+
* @returns HEX color string
|
|
63
|
+
*/
|
|
64
|
+
const HSLToHex = (h, s, l) => {
|
|
65
|
+
return chroma.hsl(h, s / 100, l / 100).hex();
|
|
66
|
+
};
|
|
67
|
+
/**
|
|
68
|
+
* Converts a HEX color '#xxxxxx' into an array of RGB values '[R, G, B]'
|
|
69
|
+
*
|
|
70
|
+
* @param hex A hex color string
|
|
71
|
+
* @param type The type of RGB values to return
|
|
72
|
+
* @returns RGB values in an array
|
|
73
|
+
*/
|
|
74
|
+
const hexToRgb = (hex, type = "255") => {
|
|
75
|
+
const rgb = chroma(hex).rgb();
|
|
76
|
+
return {
|
|
77
|
+
r: type === "255" ? rgb[0] : rgb[0] / 255,
|
|
78
|
+
g: type === "255" ? rgb[1] : rgb[1] / 255,
|
|
79
|
+
b: type === "255" ? rgb[2] : rgb[2] / 255
|
|
80
|
+
};
|
|
81
|
+
};
|
|
82
|
+
/**
|
|
83
|
+
* Get the contrast ratio between two HEX colors
|
|
84
|
+
*
|
|
85
|
+
* @param color1 The first color to compare
|
|
86
|
+
* @param color2 The second color to compare
|
|
87
|
+
* @returns
|
|
88
|
+
*/
|
|
89
|
+
const getContrastFromHex = (color1, color2) => {
|
|
90
|
+
const lum1 = chroma(color1).luminance();
|
|
91
|
+
const lum2 = chroma(color2).luminance();
|
|
92
|
+
return (Math.max(lum1, lum2) + .05) / (Math.min(lum1, lum2) + .05);
|
|
93
|
+
};
|
|
94
|
+
/**
|
|
95
|
+
* Get the contrast ratio between two colors at a specific lightness
|
|
96
|
+
*
|
|
97
|
+
* @param lightness The lightness value
|
|
98
|
+
* @param mainColor The main color
|
|
99
|
+
* @param backgroundColor The background color
|
|
100
|
+
* @returns The contrast ratio
|
|
101
|
+
*/
|
|
102
|
+
const getContrastFromLightness = (lightness, mainColor, backgroundColor) => {
|
|
103
|
+
const conv = new Hsluv();
|
|
104
|
+
conv.hex = mainColor;
|
|
105
|
+
conv.hexToHsluv();
|
|
106
|
+
conv.hsluv_l = lightness;
|
|
107
|
+
conv.hsluvToHex();
|
|
108
|
+
const lightMainColor = conv.hex;
|
|
109
|
+
const lum1 = chroma(lightMainColor).luminance();
|
|
110
|
+
const lum2 = chroma(backgroundColor).luminance();
|
|
111
|
+
return (Math.max(lum1, lum2) + .05) / (Math.min(lum1, lum2) + .05);
|
|
112
|
+
};
|
|
113
|
+
/**
|
|
114
|
+
* Check if two colors have enough contrast to be used together
|
|
115
|
+
*
|
|
116
|
+
* @param color1 The first color
|
|
117
|
+
* @param color2 The second color
|
|
118
|
+
* @returns If the colors have enough contrast
|
|
119
|
+
*/
|
|
120
|
+
const areColorsContrasting = (color1, color2, type = "aa") => {
|
|
121
|
+
const contrast = getContrastFromHex(color1, color2);
|
|
122
|
+
if (contrast !== null) {
|
|
123
|
+
if (type === "aaa") return contrast >= 7;
|
|
124
|
+
if (type === "aa") return contrast >= 4.5;
|
|
125
|
+
return contrast >= 3;
|
|
126
|
+
}
|
|
127
|
+
return false;
|
|
128
|
+
};
|
|
129
|
+
/**
|
|
130
|
+
* Check if aa string value is a HEX color
|
|
131
|
+
*
|
|
132
|
+
* @param hex The hex color
|
|
133
|
+
*/
|
|
134
|
+
const isHexColor = (hex) => {
|
|
135
|
+
return typeof hex === "string" && hex.length === 6 && !Number.isNaN(Number("0x" + hex));
|
|
136
|
+
};
|
|
137
|
+
/**
|
|
138
|
+
* Get the luminance value from a lightness value
|
|
139
|
+
*
|
|
140
|
+
* @param lightness The lightness value
|
|
141
|
+
*/
|
|
142
|
+
const getLuminanceFromLightness = (lightness) => {
|
|
143
|
+
const conv = new Hsluv();
|
|
144
|
+
conv.hsluv_l = lightness;
|
|
145
|
+
conv.hsluvToHex();
|
|
146
|
+
return chroma(conv.hex).luminance();
|
|
147
|
+
};
|
|
148
|
+
/**
|
|
149
|
+
* Get the relative luminance from any valid css color
|
|
150
|
+
*
|
|
151
|
+
* @param color
|
|
152
|
+
*/
|
|
153
|
+
const getLuminanceFromColor = (color) => {
|
|
154
|
+
return chroma(color).luminance();
|
|
155
|
+
};
|
|
156
|
+
/**
|
|
157
|
+
* Get the HSLuv lightness from a HEX color
|
|
158
|
+
*
|
|
159
|
+
* @param hex The hex color
|
|
160
|
+
*/
|
|
161
|
+
const getLightnessFromHex = (hex) => {
|
|
162
|
+
const conv = new Hsluv();
|
|
163
|
+
conv.hex = hex;
|
|
164
|
+
conv.hexToHsluv();
|
|
165
|
+
return conv.hsluv_l;
|
|
166
|
+
};
|
|
167
|
+
/**
|
|
168
|
+
*
|
|
169
|
+
* This function checks if white or black text can be used on 2 different colors at 4.5:1 contrast.
|
|
170
|
+
*
|
|
171
|
+
* @param baseDefaultColor Base default color
|
|
172
|
+
* @param baseActiveColor Base active color
|
|
173
|
+
*/
|
|
174
|
+
const canTextBeUsedOnColors = (baseDefaultColor, baseActiveColor) => {
|
|
175
|
+
const defaultAgainstWhite = getContrastFromHex(baseDefaultColor, "#ffffff");
|
|
176
|
+
const defaultAgainstBlack = getContrastFromHex(baseDefaultColor, "#000000");
|
|
177
|
+
const activeAgainstWhite = getContrastFromHex(baseActiveColor, "#ffffff");
|
|
178
|
+
const activeAgainstBlack = getContrastFromHex(baseActiveColor, "#000000");
|
|
179
|
+
if (defaultAgainstWhite >= 4.5 && activeAgainstWhite >= 4.5) return true;
|
|
180
|
+
if (defaultAgainstBlack >= 4.5 && activeAgainstBlack >= 4.5) return true;
|
|
181
|
+
return false;
|
|
182
|
+
};
|
|
183
|
+
/**
|
|
184
|
+
* Converts a color to a HEX color
|
|
185
|
+
*
|
|
186
|
+
* @param color
|
|
187
|
+
* @returns
|
|
188
|
+
*/
|
|
189
|
+
const convertToHex = (color) => {
|
|
190
|
+
if (!color) return "#000000";
|
|
191
|
+
if (/^#[0-9A-Fa-f]{6}$/.test(color)) return color;
|
|
192
|
+
return chroma(color).hex();
|
|
193
|
+
};
|
|
194
|
+
const rgbToHex = (rgb) => {
|
|
195
|
+
return `#${[
|
|
196
|
+
rgb.r,
|
|
197
|
+
rgb.g,
|
|
198
|
+
rgb.b
|
|
199
|
+
].map((x) => {
|
|
200
|
+
const hex = Math.round(x * 255).toString(16);
|
|
201
|
+
return hex.length === 1 ? "0" + hex : hex;
|
|
202
|
+
}).join("")}`;
|
|
203
|
+
};
|
|
204
|
+
/**
|
|
205
|
+
* Convert a color to a different format
|
|
206
|
+
*
|
|
207
|
+
* @param cssColor Any valid css color
|
|
208
|
+
* @param format Color space/format supported here https://colorjs.io/docs/spaces
|
|
209
|
+
*/
|
|
210
|
+
const convertColor = (cssColor, format) => {
|
|
211
|
+
const color = new Colorjs(cssColor);
|
|
212
|
+
switch (format) {
|
|
213
|
+
case "rgb":
|
|
214
|
+
case "rgba": return color.toString({
|
|
215
|
+
format: {
|
|
216
|
+
name: format,
|
|
217
|
+
coords: [
|
|
218
|
+
"<number>[0, 255]",
|
|
219
|
+
"<number>[0, 255]",
|
|
220
|
+
"<number>[0, 255]"
|
|
221
|
+
]
|
|
222
|
+
},
|
|
223
|
+
precision: 3
|
|
224
|
+
});
|
|
225
|
+
case "hex": return color.toString({
|
|
226
|
+
format,
|
|
227
|
+
precision: 3
|
|
228
|
+
});
|
|
229
|
+
case "hct": return color.to(format).toString({
|
|
230
|
+
format: {
|
|
231
|
+
name: format,
|
|
232
|
+
coords: [
|
|
233
|
+
"<number>",
|
|
234
|
+
"<number>",
|
|
235
|
+
"<number>"
|
|
236
|
+
]
|
|
237
|
+
},
|
|
238
|
+
precision: 3
|
|
239
|
+
});
|
|
240
|
+
default: return color.to(format).toString({ precision: 3 });
|
|
241
|
+
}
|
|
242
|
+
};
|
|
243
|
+
//#endregion
|
|
244
|
+
export { HSLToHex, areColorsContrasting, canTextBeUsedOnColors, convertColor, convertToHex, getContrastFromHex, getContrastFromLightness, getLightnessFromHex, getLuminanceFromColor, getLuminanceFromLightness, hexToCssHsl, hexToHSL, hexToHsluv, hexToRgb, hslArrToCss, isHexColor, rgbToHex };
|
|
@@ -0,0 +1,181 @@
|
|
|
1
|
+
import { z } from 'zod';
|
|
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>, configFilePath: string): T;
|
|
12
|
+
export declare function parseConfig<T>(configFile: string, configFilePath: string): T;
|
|
13
|
+
export declare const colorRegex: RegExp;
|
|
14
|
+
declare const overridesSchema: z.ZodOptional<z.ZodObject<{
|
|
15
|
+
colors: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodRecord<z.ZodEnum<{
|
|
16
|
+
"background-default": "background-default";
|
|
17
|
+
"background-tinted": "background-tinted";
|
|
18
|
+
"surface-default": "surface-default";
|
|
19
|
+
"surface-tinted": "surface-tinted";
|
|
20
|
+
"surface-hover": "surface-hover";
|
|
21
|
+
"surface-active": "surface-active";
|
|
22
|
+
"border-subtle": "border-subtle";
|
|
23
|
+
"border-default": "border-default";
|
|
24
|
+
"border-strong": "border-strong";
|
|
25
|
+
"text-subtle": "text-subtle";
|
|
26
|
+
"text-default": "text-default";
|
|
27
|
+
"base-default": "base-default";
|
|
28
|
+
"base-hover": "base-hover";
|
|
29
|
+
"base-active": "base-active";
|
|
30
|
+
"base-contrast-subtle": "base-contrast-subtle";
|
|
31
|
+
"base-contrast-default": "base-contrast-default";
|
|
32
|
+
}> & z.core.$partial, z.ZodObject<{
|
|
33
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
34
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
35
|
+
}, z.core.$strip>>>>;
|
|
36
|
+
severity: z.ZodOptional<z.ZodOptional<z.ZodRecord<z.ZodEnum<{
|
|
37
|
+
danger: "danger";
|
|
38
|
+
info: "info";
|
|
39
|
+
success: "success";
|
|
40
|
+
warning: "warning";
|
|
41
|
+
}> & z.core.$partial, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>>>;
|
|
42
|
+
linkVisited: z.ZodOptional<z.ZodObject<{
|
|
43
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
44
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
45
|
+
}, z.core.$strip>>;
|
|
46
|
+
focus: z.ZodOptional<z.ZodObject<{
|
|
47
|
+
inner: z.ZodOptional<z.ZodObject<{
|
|
48
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
49
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
50
|
+
}, z.core.$strip>>;
|
|
51
|
+
outer: z.ZodOptional<z.ZodObject<{
|
|
52
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
53
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
54
|
+
}, z.core.$strip>>;
|
|
55
|
+
}, z.core.$strip>>;
|
|
56
|
+
}, z.core.$strip>>;
|
|
57
|
+
declare const themeSchema: z.ZodObject<{
|
|
58
|
+
colors: z.ZodObject<{
|
|
59
|
+
main: z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
60
|
+
support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>>>;
|
|
61
|
+
neutral: z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>;
|
|
62
|
+
}, z.core.$strip>;
|
|
63
|
+
typography: z.ZodOptional<z.ZodObject<{
|
|
64
|
+
fontFamily: z.ZodString;
|
|
65
|
+
}, z.core.$strip>>;
|
|
66
|
+
borderRadius: z.ZodOptional<z.ZodNumber>;
|
|
67
|
+
overrides: z.ZodOptional<z.ZodObject<{
|
|
68
|
+
colors: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodRecord<z.ZodEnum<{
|
|
69
|
+
"background-default": "background-default";
|
|
70
|
+
"background-tinted": "background-tinted";
|
|
71
|
+
"surface-default": "surface-default";
|
|
72
|
+
"surface-tinted": "surface-tinted";
|
|
73
|
+
"surface-hover": "surface-hover";
|
|
74
|
+
"surface-active": "surface-active";
|
|
75
|
+
"border-subtle": "border-subtle";
|
|
76
|
+
"border-default": "border-default";
|
|
77
|
+
"border-strong": "border-strong";
|
|
78
|
+
"text-subtle": "text-subtle";
|
|
79
|
+
"text-default": "text-default";
|
|
80
|
+
"base-default": "base-default";
|
|
81
|
+
"base-hover": "base-hover";
|
|
82
|
+
"base-active": "base-active";
|
|
83
|
+
"base-contrast-subtle": "base-contrast-subtle";
|
|
84
|
+
"base-contrast-default": "base-contrast-default";
|
|
85
|
+
}> & z.core.$partial, z.ZodObject<{
|
|
86
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
87
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
88
|
+
}, z.core.$strip>>>>;
|
|
89
|
+
severity: z.ZodOptional<z.ZodOptional<z.ZodRecord<z.ZodEnum<{
|
|
90
|
+
danger: "danger";
|
|
91
|
+
info: "info";
|
|
92
|
+
success: "success";
|
|
93
|
+
warning: "warning";
|
|
94
|
+
}> & z.core.$partial, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>>>;
|
|
95
|
+
linkVisited: z.ZodOptional<z.ZodObject<{
|
|
96
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
97
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
98
|
+
}, z.core.$strip>>;
|
|
99
|
+
focus: z.ZodOptional<z.ZodObject<{
|
|
100
|
+
inner: z.ZodOptional<z.ZodObject<{
|
|
101
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
102
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
103
|
+
}, z.core.$strip>>;
|
|
104
|
+
outer: z.ZodOptional<z.ZodObject<{
|
|
105
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
106
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
107
|
+
}, z.core.$strip>>;
|
|
108
|
+
}, z.core.$strip>>;
|
|
109
|
+
}, z.core.$strip>>;
|
|
110
|
+
}, z.core.$strip>;
|
|
111
|
+
export declare const commonConfig: z.ZodObject<{
|
|
112
|
+
clean: z.ZodOptional<z.ZodBoolean>;
|
|
113
|
+
}, z.core.$strip>;
|
|
114
|
+
/**
|
|
115
|
+
* This defines the structure of the final configuration file
|
|
116
|
+
*/
|
|
117
|
+
export declare const configFileCreateSchema: z.ZodObject<{
|
|
118
|
+
outDir: z.ZodNonOptional<z.ZodString>;
|
|
119
|
+
themes: z.ZodNonOptional<z.ZodRecord<z.ZodString, z.ZodObject<{
|
|
120
|
+
colors: z.ZodObject<{
|
|
121
|
+
main: z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
122
|
+
support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>>>;
|
|
123
|
+
neutral: z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>;
|
|
124
|
+
}, z.core.$strip>;
|
|
125
|
+
typography: z.ZodOptional<z.ZodObject<{
|
|
126
|
+
fontFamily: z.ZodString;
|
|
127
|
+
}, z.core.$strip>>;
|
|
128
|
+
borderRadius: z.ZodOptional<z.ZodNumber>;
|
|
129
|
+
overrides: z.ZodOptional<z.ZodObject<{
|
|
130
|
+
colors: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodRecord<z.ZodEnum<{
|
|
131
|
+
"background-default": "background-default";
|
|
132
|
+
"background-tinted": "background-tinted";
|
|
133
|
+
"surface-default": "surface-default";
|
|
134
|
+
"surface-tinted": "surface-tinted";
|
|
135
|
+
"surface-hover": "surface-hover";
|
|
136
|
+
"surface-active": "surface-active";
|
|
137
|
+
"border-subtle": "border-subtle";
|
|
138
|
+
"border-default": "border-default";
|
|
139
|
+
"border-strong": "border-strong";
|
|
140
|
+
"text-subtle": "text-subtle";
|
|
141
|
+
"text-default": "text-default";
|
|
142
|
+
"base-default": "base-default";
|
|
143
|
+
"base-hover": "base-hover";
|
|
144
|
+
"base-active": "base-active";
|
|
145
|
+
"base-contrast-subtle": "base-contrast-subtle";
|
|
146
|
+
"base-contrast-default": "base-contrast-default";
|
|
147
|
+
}> & z.core.$partial, z.ZodObject<{
|
|
148
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
149
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
150
|
+
}, z.core.$strip>>>>;
|
|
151
|
+
severity: z.ZodOptional<z.ZodOptional<z.ZodRecord<z.ZodEnum<{
|
|
152
|
+
danger: "danger";
|
|
153
|
+
info: "info";
|
|
154
|
+
success: "success";
|
|
155
|
+
warning: "warning";
|
|
156
|
+
}> & z.core.$partial, z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>>>;
|
|
157
|
+
linkVisited: z.ZodOptional<z.ZodObject<{
|
|
158
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
159
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
160
|
+
}, z.core.$strip>>;
|
|
161
|
+
focus: z.ZodOptional<z.ZodObject<{
|
|
162
|
+
inner: z.ZodOptional<z.ZodObject<{
|
|
163
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
164
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
165
|
+
}, z.core.$strip>>;
|
|
166
|
+
outer: z.ZodOptional<z.ZodObject<{
|
|
167
|
+
light: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
168
|
+
dark: z.ZodOptional<z.ZodPipe<z.ZodString, z.ZodTransform<`#${string}`, string>>>;
|
|
169
|
+
}, z.core.$strip>>;
|
|
170
|
+
}, z.core.$strip>>;
|
|
171
|
+
}, z.core.$strip>>;
|
|
172
|
+
}, z.core.$strip>>>;
|
|
173
|
+
clean: z.ZodOptional<z.ZodBoolean>;
|
|
174
|
+
}, z.core.$strip>;
|
|
175
|
+
export type CommonConfigSchema = z.infer<typeof commonConfig>;
|
|
176
|
+
export type BuildConfigSchema = z.infer<typeof commonConfig>;
|
|
177
|
+
export type CreateConfigSchema = z.infer<typeof configFileCreateSchema>;
|
|
178
|
+
export type ConfigSchemaTheme = z.infer<typeof themeSchema>;
|
|
179
|
+
export type ColorOverrideSchema = z.infer<typeof overridesSchema>;
|
|
180
|
+
export {};
|
|
181
|
+
//# sourceMappingURL=config.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/config.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAuCxB;;;;;;;;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,cAAc,EAAE,MAAM,GACrB,CAAC,CAUH;AAED,wBAAgB,WAAW,CAAC,CAAC,EAAE,UAAU,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,GAAG,CAAC,CAe5E;AAWD,eAAO,MAAM,UAAU,QAA2C,CAAC;AAuEnE,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAQR,CAAC;AAEd,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAkBmG,CAAC;AAErH,eAAO,MAAM,YAAY;;iBAEvB,CAAC;AAYH;;GAEG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAqD,CAAC;AACzF,MAAM,MAAM,kBAAkB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,YAAY,CAAC,CAAC;AAC9D,MAAM,MAAM,iBAAiB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,YAAY,CAAC,CAAC;AAC7D,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;AAC5D,MAAM,MAAM,mBAAmB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,eAAe,CAAC,CAAC"}
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import { baseColorNames, colorNames } from "./colors/colorMetadata.js";
|
|
2
|
+
import { convertToHex } from "./colors/utils.js";
|
|
3
|
+
import { RESERVED_COLORS } from "./colors/theme.js";
|
|
4
|
+
import "./colors/index.js";
|
|
5
|
+
import { cliOptions } from "./tokens/create.js";
|
|
6
|
+
import pc from "picocolors";
|
|
7
|
+
import * as R from "ramda";
|
|
8
|
+
import { z } from "zod";
|
|
9
|
+
import { fromError } from "zod-validation-error";
|
|
10
|
+
//#region src/config.ts
|
|
11
|
+
function mapPathToOptionName(path) {
|
|
12
|
+
const normalisedPath = path[0] === "themes" ? ["theme", ...R.drop(2, path)] : path;
|
|
13
|
+
const option = R.path(normalisedPath, cliOptions);
|
|
14
|
+
if (typeof option !== "string") return;
|
|
15
|
+
return option;
|
|
16
|
+
}
|
|
17
|
+
function makeFriendlyError(err) {
|
|
18
|
+
try {
|
|
19
|
+
return fromError(err, { messageBuilder: (issues) => issues.map((issue) => {
|
|
20
|
+
const issuePath = issue.path.join(".");
|
|
21
|
+
const optionName = mapPathToOptionName(issue.path);
|
|
22
|
+
const errorCode = `(error code: ${issue.code})`;
|
|
23
|
+
const optionMessage = optionName ? ` or CLI option --${optionName}` : "";
|
|
24
|
+
return ` - Error in JSON value ${pc.red(issuePath)}${optionMessage}:
|
|
25
|
+
${issue.message} ${pc.dim(errorCode)}`;
|
|
26
|
+
}).join("\n") });
|
|
27
|
+
} catch (_err2) {
|
|
28
|
+
console.error(pc.red(err instanceof Error ? err.message : "Unknown error occurred while parsing config file"));
|
|
29
|
+
console.error(err instanceof Error ? err.stack : "No stack trace available");
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Validates a configuration object against a provided Zod schema.
|
|
34
|
+
*
|
|
35
|
+
* @template T - The expected type of the validated configuration.
|
|
36
|
+
* @param schema - A Zod schema used to validate the configuration object.
|
|
37
|
+
* @param unvalidatedConfig - The configuration object to validate.
|
|
38
|
+
* @returns The validated configuration object, typed as T.
|
|
39
|
+
* @throws Exits the process with code 1 if validation fails, after logging a friendly error message.
|
|
40
|
+
*/
|
|
41
|
+
function validateConfig(schema, unvalidatedConfig, configFilePath) {
|
|
42
|
+
try {
|
|
43
|
+
return schema.parse(unvalidatedConfig);
|
|
44
|
+
} catch (err) {
|
|
45
|
+
console.error(pc.redBright(`Invalid config file at ${pc.red(configFilePath)}`));
|
|
46
|
+
const validationError = makeFriendlyError(err);
|
|
47
|
+
console.error(validationError?.toString());
|
|
48
|
+
process.exit(1);
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
function parseConfig(configFile, configFilePath) {
|
|
52
|
+
if (!configFile) return {};
|
|
53
|
+
try {
|
|
54
|
+
return JSON.parse(configFile);
|
|
55
|
+
} catch (err) {
|
|
56
|
+
console.error(pc.redBright(`Failed parsing config file at ${pc.red(configFilePath)}`));
|
|
57
|
+
const validationError = makeFriendlyError(err);
|
|
58
|
+
console.error(validationError?.toString());
|
|
59
|
+
process.exit(1);
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
const hexPatterns = [
|
|
63
|
+
`#[0-9a-fA-F]{3}`,
|
|
64
|
+
`#[0-9a-fA-F]{4}`,
|
|
65
|
+
`#[0-9a-fA-F]{6}`,
|
|
66
|
+
`#[0-9a-fA-F]{8}`
|
|
67
|
+
];
|
|
68
|
+
const reservedColorsPattern = `^(?!(?:${RESERVED_COLORS.join("|")})$)`;
|
|
69
|
+
const colorRegex = new RegExp(`^${hexPatterns.join("|")}$`);
|
|
70
|
+
const colorSchema = z.string().regex(colorRegex).transform(convertToHex).describe(`A hex color, which is used for creating a color scale. Invalid color names: ${RESERVED_COLORS.join(", ")}`);
|
|
71
|
+
const colorCategorySchema = z.record(z.string().regex(new RegExp(reservedColorsPattern, "i"), { error: `Color names cannot include reserved names: ${RESERVED_COLORS.join(", ")}` }), colorSchema, { error: "Color definitions must be hex color values" }).refine((colors) => !Object.keys(colors).some((key) => RESERVED_COLORS.includes(key.toLowerCase())), { error: `Color names cannot include reserved names: ${RESERVED_COLORS.join(", ")}` }).describe("An object with one or more color definitions. The property name is used as the color name.");
|
|
72
|
+
const colorModeOverrideSchema = z.object({
|
|
73
|
+
light: colorSchema.optional().describe("A hex color that overrides light mode"),
|
|
74
|
+
dark: colorSchema.optional().describe("A hex color that overrides dark mode")
|
|
75
|
+
}).describe("Override values for semantic color tokens like \"background-subtle\", \"border-default\", etc.");
|
|
76
|
+
const colorWeightOverrideSchema = z.partialRecord(z.enum([...colorNames]), colorModeOverrideSchema).describe("The name of the color to add overrides for, e.g. \"accent\"");
|
|
77
|
+
const semanticColorOverrideSchema = z.record(z.string(), colorWeightOverrideSchema).describe("An object with color names as keys");
|
|
78
|
+
const severityColorOverrideSchema = z.partialRecord(z.enum(baseColorNames), colorSchema.describe("A hex color, which is used for creating a color scale")).optional().describe("An object with severity color names as keys");
|
|
79
|
+
const linkVisitedOverrideSchema = z.object({
|
|
80
|
+
light: colorSchema.optional().describe("A hex color that overrides light mode"),
|
|
81
|
+
dark: colorSchema.optional().describe("A hex color that overrides dark mode")
|
|
82
|
+
}).describe("Overrides for the \"link-visited\" color");
|
|
83
|
+
const focusOverrideSchema = z.object({
|
|
84
|
+
inner: z.object({
|
|
85
|
+
light: colorSchema.optional().describe("A hex color that overrides light mode"),
|
|
86
|
+
dark: colorSchema.optional().describe("A hex color that overrides dark mode")
|
|
87
|
+
}).optional().describe("Overrides for the \"focus-inner\" color"),
|
|
88
|
+
outer: z.object({
|
|
89
|
+
light: colorSchema.optional().describe("A hex color that overrides light mode"),
|
|
90
|
+
dark: colorSchema.optional().describe("A hex color that overrides dark mode")
|
|
91
|
+
}).optional().describe("Overrides for the \"focus-outer\" color")
|
|
92
|
+
}).describe("Overrides for the focus colors");
|
|
93
|
+
const overridesSchema = z.object({
|
|
94
|
+
colors: semanticColorOverrideSchema.optional(),
|
|
95
|
+
severity: severityColorOverrideSchema.optional(),
|
|
96
|
+
linkVisited: linkVisitedOverrideSchema.optional(),
|
|
97
|
+
focus: focusOverrideSchema.optional()
|
|
98
|
+
}).describe("Overrides for generated design tokens. Currently only supports colors defined in your theme").optional();
|
|
99
|
+
const themeSchema = z.object({
|
|
100
|
+
colors: z.object({
|
|
101
|
+
main: colorCategorySchema,
|
|
102
|
+
support: colorCategorySchema.optional().default({}),
|
|
103
|
+
neutral: colorSchema.describe("A hex color, which is used for creating a color scale.")
|
|
104
|
+
}).meta({ description: "Defines the colors for this theme" }),
|
|
105
|
+
typography: z.object({ fontFamily: z.string().meta({ description: "Sets the font-family for this theme" }) }).describe("Defines the typography for a given theme").optional(),
|
|
106
|
+
borderRadius: z.number().meta({ description: "Defines the border-radius for this theme" }).optional(),
|
|
107
|
+
overrides: overridesSchema
|
|
108
|
+
}).meta({ description: "An object defining a theme. The property name holding the object becomes the theme name." });
|
|
109
|
+
const commonConfig = z.object({ clean: z.boolean().meta({ description: "Delete the output directory before building or creating tokens" }).optional() });
|
|
110
|
+
/**
|
|
111
|
+
* This defines the structure of the final configuration file
|
|
112
|
+
*/
|
|
113
|
+
const configFileCreateSchema = z.object({
|
|
114
|
+
outDir: z.string().meta({ description: "Path to the output directory for the created design tokens" }),
|
|
115
|
+
themes: z.record(z.string(), themeSchema).meta({ description: "An object with one or more themes. Each property defines a theme, and the property name is used as the theme name." })
|
|
116
|
+
}).required().extend(commonConfig.shape);
|
|
117
|
+
//#endregion
|
|
118
|
+
export { colorRegex, commonConfig, configFileCreateSchema, parseConfig, validateConfig };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,OAAO,EACL,KAAK,kBAAkB,IAAI,YAAY,EACvC,sBAAsB,IAAI,YAAY,GACvC,MAAM,aAAa,CAAC;AACrB,cAAc,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { baseColorNames, baseColors, colorMetadata, colorNames, dsLinkColor, getColorMetadataByNumber } from "./colors/colorMetadata.js";
|
|
2
|
+
import { HSLToHex, areColorsContrasting, canTextBeUsedOnColors, convertColor, convertToHex, getContrastFromHex, getContrastFromLightness, getLightnessFromHex, getLuminanceFromColor, getLuminanceFromLightness, hexToCssHsl, hexToHSL, hexToHsluv, hexToRgb, hslArrToCss, isHexColor, rgbToHex } from "./colors/utils.js";
|
|
3
|
+
import { RESERVED_COLORS, generateColorContrast, generateColorScale, generateColorSchemes, getCssVariable } from "./colors/theme.js";
|
|
4
|
+
import { semanticColorMap, semanticColorNames, semanticColorNumbers } from "./colors/types.js";
|
|
5
|
+
import "./colors/index.js";
|
|
6
|
+
import { cliOptions, createTokens } from "./tokens/create.js";
|
|
7
|
+
import { configFileCreateSchema } from "./config.js";
|
|
8
|
+
import { formatThemeCSS, formatTokens } from "./tokens/format.js";
|
|
9
|
+
import "./tokens/index.js";
|
|
10
|
+
export { HSLToHex, RESERVED_COLORS, areColorsContrasting, baseColorNames, baseColors, canTextBeUsedOnColors, cliOptions, colorMetadata, colorNames, configFileCreateSchema as configSchema, convertColor, convertToHex, createTokens, dsLinkColor, formatThemeCSS, formatTokens, generateColorContrast, generateColorScale, generateColorSchemes, getColorMetadataByNumber, getContrastFromHex, getContrastFromLightness, getCssVariable, getLightnessFromHex, getLuminanceFromColor, getLuminanceFromLightness, hexToCssHsl, hexToHSL, hexToHsluv, hexToRgb, hslArrToCss, isHexColor, rgbToHex, semanticColorMap, semanticColorNames, semanticColorNumbers };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"beta-to-v1.d.ts","sourceRoot":"","sources":["../../../src/migrations/beta-to-v1.ts"],"names":[],"mappings":"yBAGgB,OAAO,MAAM;AAA7B,wBAmVK"}
|