react-mcu 1.3.1 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +38 -38
  2. package/dist/cli.js +828 -0
  3. package/dist/index.d.ts +94 -67
  4. package/dist/index.js +229 -129
  5. package/dist/tailwind.css +157 -143
  6. package/package.json +5 -6
  7. package/src/tailwind.css +157 -143
  8. package/src/cli.ts +0 -116
package/src/tailwind.css CHANGED
@@ -1,167 +1,181 @@
1
1
  @import "tailwindcss";
2
2
 
3
3
  @theme inline {
4
- --color-background: var(--mcu-background);
5
- --color-on-background: var(--mcu-on-background);
6
- --color-surface: var(--mcu-surface);
7
- --color-surface-dim: var(--mcu-surface-dim);
8
- --color-surface-bright: var(--mcu-surface-bright);
9
- --color-surface-container-lowest: var(--mcu-surface-container-lowest);
10
- --color-surface-container-low: var(--mcu-surface-container-low);
11
- --color-surface-container: var(--mcu-surface-container);
12
- --color-surface-container-high: var(--mcu-surface-container-high);
13
- --color-surface-container-highest: var(--mcu-surface-container-highest);
14
- --color-on-surface: var(--mcu-on-surface);
15
- --color-on-surface-variant: var(--mcu-on-surface-variant);
16
- --color-outline: var(--mcu-outline);
17
- --color-outline-variant: var(--mcu-outline-variant);
18
- --color-inverse-surface: var(--mcu-inverse-surface);
19
- --color-inverse-on-surface: var(--mcu-inverse-on-surface);
20
- --color-primary: var(--mcu-primary);
21
- --color-on-primary: var(--mcu-on-primary);
22
- --color-primary-container: var(--mcu-primary-container);
23
- --color-on-primary-container: var(--mcu-on-primary-container);
24
- --color-primary-fixed: var(--mcu-primary-fixed);
25
- --color-primary-fixed-dim: var(--mcu-primary-fixed-dim);
26
- --color-on-primary-fixed: var(--mcu-on-primary-fixed);
27
- --color-on-primary-fixed-variant: var(--mcu-on-primary-fixed-variant);
28
- --color-inverse-primary: var(--mcu-inverse-primary);
29
- --color-secondary: var(--mcu-secondary);
30
- --color-on-secondary: var(--mcu-on-secondary);
31
- --color-secondary-container: var(--mcu-secondary-container);
32
- --color-on-secondary-container: var(--mcu-on-secondary-container);
33
- --color-secondary-fixed: var(--mcu-secondary-fixed);
34
- --color-secondary-fixed-dim: var(--mcu-secondary-fixed-dim);
35
- --color-on-secondary-fixed: var(--mcu-on-secondary-fixed);
36
- --color-on-secondary-fixed-variant: var(--mcu-on-secondary-fixed-variant);
37
- --color-tertiary: var(--mcu-tertiary);
38
- --color-on-tertiary: var(--mcu-on-tertiary);
39
- --color-tertiary-container: var(--mcu-tertiary-container);
40
- --color-on-tertiary-container: var(--mcu-on-tertiary-container);
41
- --color-tertiary-fixed: var(--mcu-tertiary-fixed);
42
- --color-tertiary-fixed-dim: var(--mcu-tertiary-fixed-dim);
43
- --color-on-tertiary-fixed: var(--mcu-on-tertiary-fixed);
44
- --color-on-tertiary-fixed-variant: var(--mcu-on-tertiary-fixed-variant);
45
- --color-error: var(--mcu-error);
46
- --color-on-error: var(--mcu-on-error);
47
- --color-error-container: var(--mcu-error-container);
48
- --color-on-error-container: var(--mcu-on-error-container);
49
- --color-scrim: var(--mcu-scrim);
50
- --color-shadow: var(--mcu-shadow);
4
+ --color-background: var(--md-sys-color-background);
5
+ --color-on-background: var(--md-sys-color-on-background);
6
+ --color-surface: var(--md-sys-color-surface);
7
+ --color-surface-dim: var(--md-sys-color-surface-dim);
8
+ --color-surface-bright: var(--md-sys-color-surface-bright);
9
+ --color-surface-container-lowest: var(
10
+ --md-sys-color-surface-container-lowest
11
+ );
12
+ --color-surface-container-low: var(--md-sys-color-surface-container-low);
13
+ --color-surface-container: var(--md-sys-color-surface-container);
14
+ --color-surface-container-high: var(--md-sys-color-surface-container-high);
15
+ --color-surface-container-highest: var(
16
+ --md-sys-color-surface-container-highest
17
+ );
18
+ --color-on-surface: var(--md-sys-color-on-surface);
19
+ --color-on-surface-variant: var(--md-sys-color-on-surface-variant);
20
+ --color-outline: var(--md-sys-color-outline);
21
+ --color-outline-variant: var(--md-sys-color-outline-variant);
22
+ --color-inverse-surface: var(--md-sys-color-inverse-surface);
23
+ --color-inverse-on-surface: var(--md-sys-color-inverse-on-surface);
24
+ --color-primary: var(--md-sys-color-primary);
25
+ --color-on-primary: var(--md-sys-color-on-primary);
26
+ --color-primary-container: var(--md-sys-color-primary-container);
27
+ --color-on-primary-container: var(--md-sys-color-on-primary-container);
28
+ --color-primary-fixed: var(--md-sys-color-primary-fixed);
29
+ --color-primary-fixed-dim: var(--md-sys-color-primary-fixed-dim);
30
+ --color-on-primary-fixed: var(--md-sys-color-on-primary-fixed);
31
+ --color-on-primary-fixed-variant: var(
32
+ --md-sys-color-on-primary-fixed-variant
33
+ );
34
+ --color-inverse-primary: var(--md-sys-color-inverse-primary);
35
+ --color-secondary: var(--md-sys-color-secondary);
36
+ --color-on-secondary: var(--md-sys-color-on-secondary);
37
+ --color-secondary-container: var(--md-sys-color-secondary-container);
38
+ --color-on-secondary-container: var(--md-sys-color-on-secondary-container);
39
+ --color-secondary-fixed: var(--md-sys-color-secondary-fixed);
40
+ --color-secondary-fixed-dim: var(--md-sys-color-secondary-fixed-dim);
41
+ --color-on-secondary-fixed: var(--md-sys-color-on-secondary-fixed);
42
+ --color-on-secondary-fixed-variant: var(
43
+ --md-sys-color-on-secondary-fixed-variant
44
+ );
45
+ --color-tertiary: var(--md-sys-color-tertiary);
46
+ --color-on-tertiary: var(--md-sys-color-on-tertiary);
47
+ --color-tertiary-container: var(--md-sys-color-tertiary-container);
48
+ --color-on-tertiary-container: var(--md-sys-color-on-tertiary-container);
49
+ --color-tertiary-fixed: var(--md-sys-color-tertiary-fixed);
50
+ --color-tertiary-fixed-dim: var(--md-sys-color-tertiary-fixed-dim);
51
+ --color-on-tertiary-fixed: var(--md-sys-color-on-tertiary-fixed);
52
+ --color-on-tertiary-fixed-variant: var(
53
+ --md-sys-color-on-tertiary-fixed-variant
54
+ );
55
+ --color-error: var(--md-sys-color-error);
56
+ --color-on-error: var(--md-sys-color-on-error);
57
+ --color-error-container: var(--md-sys-color-error-container);
58
+ --color-on-error-container: var(--md-sys-color-on-error-container);
59
+ --color-scrim: var(--md-sys-color-scrim);
60
+ --color-shadow: var(--md-sys-color-shadow);
51
61
 
52
62
  /* Shades */
53
63
 
54
- --color-primary-50: var(--mcu-primary-95);
55
- --color-primary-100: var(--mcu-primary-90);
56
- --color-primary-200: var(--mcu-primary-80);
57
- --color-primary-300: var(--mcu-primary-70);
58
- --color-primary-400: var(--mcu-primary-60);
59
- --color-primary-500: var(--mcu-primary-50);
60
- --color-primary-600: var(--mcu-primary-40);
61
- --color-primary-700: var(--mcu-primary-30);
62
- --color-primary-800: var(--mcu-primary-20);
63
- --color-primary-900: var(--mcu-primary-10);
64
- --color-primary-950: var(--mcu-primary-5);
64
+ --color-primary-50: var(--md-ref-palette-primary-95);
65
+ --color-primary-100: var(--md-ref-palette-primary-90);
66
+ --color-primary-200: var(--md-ref-palette-primary-80);
67
+ --color-primary-300: var(--md-ref-palette-primary-70);
68
+ --color-primary-400: var(--md-ref-palette-primary-60);
69
+ --color-primary-500: var(--md-ref-palette-primary-50);
70
+ --color-primary-600: var(--md-ref-palette-primary-40);
71
+ --color-primary-700: var(--md-ref-palette-primary-30);
72
+ --color-primary-800: var(--md-ref-palette-primary-20);
73
+ --color-primary-900: var(--md-ref-palette-primary-10);
74
+ --color-primary-950: var(--md-ref-palette-primary-5);
65
75
 
66
- --color-secondary-50: var(--mcu-secondary-95);
67
- --color-secondary-100: var(--mcu-secondary-90);
68
- --color-secondary-200: var(--mcu-secondary-80);
69
- --color-secondary-300: var(--mcu-secondary-70);
70
- --color-secondary-400: var(--mcu-secondary-60);
71
- --color-secondary-500: var(--mcu-secondary-50);
72
- --color-secondary-600: var(--mcu-secondary-40);
73
- --color-secondary-700: var(--mcu-secondary-30);
74
- --color-secondary-800: var(--mcu-secondary-20);
75
- --color-secondary-900: var(--mcu-secondary-10);
76
- --color-secondary-950: var(--mcu-secondary-5);
76
+ --color-secondary-50: var(--md-ref-palette-secondary-95);
77
+ --color-secondary-100: var(--md-ref-palette-secondary-90);
78
+ --color-secondary-200: var(--md-ref-palette-secondary-80);
79
+ --color-secondary-300: var(--md-ref-palette-secondary-70);
80
+ --color-secondary-400: var(--md-ref-palette-secondary-60);
81
+ --color-secondary-500: var(--md-ref-palette-secondary-50);
82
+ --color-secondary-600: var(--md-ref-palette-secondary-40);
83
+ --color-secondary-700: var(--md-ref-palette-secondary-30);
84
+ --color-secondary-800: var(--md-ref-palette-secondary-20);
85
+ --color-secondary-900: var(--md-ref-palette-secondary-10);
86
+ --color-secondary-950: var(--md-ref-palette-secondary-5);
77
87
 
78
- --color-tertiary-50: var(--mcu-tertiary-95);
79
- --color-tertiary-100: var(--mcu-tertiary-90);
80
- --color-tertiary-200: var(--mcu-tertiary-80);
81
- --color-tertiary-300: var(--mcu-tertiary-70);
82
- --color-tertiary-400: var(--mcu-tertiary-60);
83
- --color-tertiary-500: var(--mcu-tertiary-50);
84
- --color-tertiary-600: var(--mcu-tertiary-40);
85
- --color-tertiary-700: var(--mcu-tertiary-30);
86
- --color-tertiary-800: var(--mcu-tertiary-20);
87
- --color-tertiary-900: var(--mcu-tertiary-10);
88
- --color-tertiary-950: var(--mcu-tertiary-5);
88
+ --color-tertiary-50: var(--md-ref-palette-tertiary-95);
89
+ --color-tertiary-100: var(--md-ref-palette-tertiary-90);
90
+ --color-tertiary-200: var(--md-ref-palette-tertiary-80);
91
+ --color-tertiary-300: var(--md-ref-palette-tertiary-70);
92
+ --color-tertiary-400: var(--md-ref-palette-tertiary-60);
93
+ --color-tertiary-500: var(--md-ref-palette-tertiary-50);
94
+ --color-tertiary-600: var(--md-ref-palette-tertiary-40);
95
+ --color-tertiary-700: var(--md-ref-palette-tertiary-30);
96
+ --color-tertiary-800: var(--md-ref-palette-tertiary-20);
97
+ --color-tertiary-900: var(--md-ref-palette-tertiary-10);
98
+ --color-tertiary-950: var(--md-ref-palette-tertiary-5);
89
99
 
90
- --color-error-50: var(--mcu-error-95);
91
- --color-error-100: var(--mcu-error-90);
92
- --color-error-200: var(--mcu-error-80);
93
- --color-error-300: var(--mcu-error-70);
94
- --color-error-400: var(--mcu-error-60);
95
- --color-error-500: var(--mcu-error-50);
96
- --color-error-600: var(--mcu-error-40);
97
- --color-error-700: var(--mcu-error-30);
98
- --color-error-800: var(--mcu-error-20);
99
- --color-error-900: var(--mcu-error-10);
100
- --color-error-950: var(--mcu-error-5);
100
+ --color-error-50: var(--md-ref-palette-error-95);
101
+ --color-error-100: var(--md-ref-palette-error-90);
102
+ --color-error-200: var(--md-ref-palette-error-80);
103
+ --color-error-300: var(--md-ref-palette-error-70);
104
+ --color-error-400: var(--md-ref-palette-error-60);
105
+ --color-error-500: var(--md-ref-palette-error-50);
106
+ --color-error-600: var(--md-ref-palette-error-40);
107
+ --color-error-700: var(--md-ref-palette-error-30);
108
+ --color-error-800: var(--md-ref-palette-error-20);
109
+ --color-error-900: var(--md-ref-palette-error-10);
110
+ --color-error-950: var(--md-ref-palette-error-5);
101
111
 
102
- --color-neutral-50: var(--mcu-neutral-95);
103
- --color-neutral-100: var(--mcu-neutral-90);
104
- --color-neutral-200: var(--mcu-neutral-80);
105
- --color-neutral-300: var(--mcu-neutral-70);
106
- --color-neutral-400: var(--mcu-neutral-60);
107
- --color-neutral-500: var(--mcu-neutral-50);
108
- --color-neutral-600: var(--mcu-neutral-40);
109
- --color-neutral-700: var(--mcu-neutral-30);
110
- --color-neutral-800: var(--mcu-neutral-20);
111
- --color-neutral-900: var(--mcu-neutral-10);
112
- --color-neutral-950: var(--mcu-neutral-5);
112
+ --color-neutral-50: var(--md-ref-palette-neutral-95);
113
+ --color-neutral-100: var(--md-ref-palette-neutral-90);
114
+ --color-neutral-200: var(--md-ref-palette-neutral-80);
115
+ --color-neutral-300: var(--md-ref-palette-neutral-70);
116
+ --color-neutral-400: var(--md-ref-palette-neutral-60);
117
+ --color-neutral-500: var(--md-ref-palette-neutral-50);
118
+ --color-neutral-600: var(--md-ref-palette-neutral-40);
119
+ --color-neutral-700: var(--md-ref-palette-neutral-30);
120
+ --color-neutral-800: var(--md-ref-palette-neutral-20);
121
+ --color-neutral-900: var(--md-ref-palette-neutral-10);
122
+ --color-neutral-950: var(--md-ref-palette-neutral-5);
113
123
 
114
- --color-neutral-variant-50: var(--mcu-neutral-variant-95);
115
- --color-neutral-variant-100: var(--mcu-neutral-variant-90);
116
- --color-neutral-variant-200: var(--mcu-neutral-variant-80);
117
- --color-neutral-variant-300: var(--mcu-neutral-variant-70);
118
- --color-neutral-variant-400: var(--mcu-neutral-variant-60);
119
- --color-neutral-variant-500: var(--mcu-neutral-variant-50);
120
- --color-neutral-variant-600: var(--mcu-neutral-variant-40);
121
- --color-neutral-variant-700: var(--mcu-neutral-variant-30);
122
- --color-neutral-variant-800: var(--mcu-neutral-variant-20);
123
- --color-neutral-variant-900: var(--mcu-neutral-variant-10);
124
- --color-neutral-variant-950: var(--mcu-neutral-variant-5);
124
+ --color-neutral-variant-50: var(--md-ref-palette-neutral-variant-95);
125
+ --color-neutral-variant-100: var(--md-ref-palette-neutral-variant-90);
126
+ --color-neutral-variant-200: var(--md-ref-palette-neutral-variant-80);
127
+ --color-neutral-variant-300: var(--md-ref-palette-neutral-variant-70);
128
+ --color-neutral-variant-400: var(--md-ref-palette-neutral-variant-60);
129
+ --color-neutral-variant-500: var(--md-ref-palette-neutral-variant-50);
130
+ --color-neutral-variant-600: var(--md-ref-palette-neutral-variant-40);
131
+ --color-neutral-variant-700: var(--md-ref-palette-neutral-variant-30);
132
+ --color-neutral-variant-800: var(--md-ref-palette-neutral-variant-20);
133
+ --color-neutral-variant-900: var(--md-ref-palette-neutral-variant-10);
134
+ --color-neutral-variant-950: var(--md-ref-palette-neutral-variant-5);
125
135
 
126
136
  /*
127
137
  * Custom colors
128
138
  */
129
139
 
130
- --color-myCustomColor1: var(--mcu-my-custom-color-1);
131
- --color-on-myCustomColor1: var(--mcu-on-my-custom-color-1);
132
- --color-myCustomColor1-container: var(--mcu-my-custom-color-1-container);
140
+ --color-myCustomColor1: var(--md-sys-color-my-custom-color-1);
141
+ --color-on-myCustomColor1: var(--md-sys-color-on-my-custom-color-1);
142
+ --color-myCustomColor1-container: var(
143
+ --md-sys-color-my-custom-color-1-container
144
+ );
133
145
  --color-on-myCustomColor1-container: var(
134
- --mcu-on-my-custom-color-1-container
146
+ --md-sys-color-on-my-custom-color-1-container
135
147
  );
136
148
  /* Shades */
137
- --color-myCustomColor1-50: var(--mcu-my-custom-color-1-95);
138
- --color-myCustomColor1-100: var(--mcu-my-custom-color-1-90);
139
- --color-myCustomColor1-200: var(--mcu-my-custom-color-1-80);
140
- --color-myCustomColor1-300: var(--mcu-my-custom-color-1-70);
141
- --color-myCustomColor1-400: var(--mcu-my-custom-color-1-60);
142
- --color-myCustomColor1-500: var(--mcu-my-custom-color-1-50);
143
- --color-myCustomColor1-600: var(--mcu-my-custom-color-1-40);
144
- --color-myCustomColor1-700: var(--mcu-my-custom-color-1-30);
145
- --color-myCustomColor1-800: var(--mcu-my-custom-color-1-20);
146
- --color-myCustomColor1-900: var(--mcu-my-custom-color-1-10);
147
- --color-myCustomColor1-950: var(--mcu-my-custom-color-1-5);
149
+ --color-myCustomColor1-50: var(--md-ref-palette-my-custom-color-1-95);
150
+ --color-myCustomColor1-100: var(--md-ref-palette-my-custom-color-1-90);
151
+ --color-myCustomColor1-200: var(--md-ref-palette-my-custom-color-1-80);
152
+ --color-myCustomColor1-300: var(--md-ref-palette-my-custom-color-1-70);
153
+ --color-myCustomColor1-400: var(--md-ref-palette-my-custom-color-1-60);
154
+ --color-myCustomColor1-500: var(--md-ref-palette-my-custom-color-1-50);
155
+ --color-myCustomColor1-600: var(--md-ref-palette-my-custom-color-1-40);
156
+ --color-myCustomColor1-700: var(--md-ref-palette-my-custom-color-1-30);
157
+ --color-myCustomColor1-800: var(--md-ref-palette-my-custom-color-1-20);
158
+ --color-myCustomColor1-900: var(--md-ref-palette-my-custom-color-1-10);
159
+ --color-myCustomColor1-950: var(--md-ref-palette-my-custom-color-1-5);
148
160
 
149
- --color-myCustomColor2: var(--mcu-my-custom-color-2);
150
- --color-on-myCustomColor2: var(--mcu-on-my-custom-color-2);
151
- --color-myCustomColor2-container: var(--mcu-my-custom-color-2-container);
161
+ --color-myCustomColor2: var(--md-sys-color-my-custom-color-2);
162
+ --color-on-myCustomColor2: var(--md-sys-color-on-my-custom-color-2);
163
+ --color-myCustomColor2-container: var(
164
+ --md-sys-color-my-custom-color-2-container
165
+ );
152
166
  --color-on-myCustomColor2-container: var(
153
- --mcu-on-my-custom-color-2-container
167
+ --md-sys-color-on-my-custom-color-2-container
154
168
  );
155
169
  /* Shades */
156
- --color-myCustomColor2-50: var(--mcu-my-custom-color-2-95);
157
- --color-myCustomColor2-100: var(--mcu-my-custom-color-2-90);
158
- --color-myCustomColor2-200: var(--mcu-my-custom-color-2-80);
159
- --color-myCustomColor2-300: var(--mcu-my-custom-color-2-70);
160
- --color-myCustomColor2-400: var(--mcu-my-custom-color-2-60);
161
- --color-myCustomColor2-500: var(--mcu-my-custom-color-2-50);
162
- --color-myCustomColor2-600: var(--mcu-my-custom-color-2-40);
163
- --color-myCustomColor2-700: var(--mcu-my-custom-color-2-30);
164
- --color-myCustomColor2-800: var(--mcu-my-custom-color-2-20);
165
- --color-myCustomColor2-900: var(--mcu-my-custom-color-2-10);
166
- --color-myCustomColor2-950: var(--mcu-my-custom-color-2-5);
170
+ --color-myCustomColor2-50: var(--md-ref-palette-my-custom-color-2-95);
171
+ --color-myCustomColor2-100: var(--md-ref-palette-my-custom-color-2-90);
172
+ --color-myCustomColor2-200: var(--md-ref-palette-my-custom-color-2-80);
173
+ --color-myCustomColor2-300: var(--md-ref-palette-my-custom-color-2-70);
174
+ --color-myCustomColor2-400: var(--md-ref-palette-my-custom-color-2-60);
175
+ --color-myCustomColor2-500: var(--md-ref-palette-my-custom-color-2-50);
176
+ --color-myCustomColor2-600: var(--md-ref-palette-my-custom-color-2-40);
177
+ --color-myCustomColor2-700: var(--md-ref-palette-my-custom-color-2-30);
178
+ --color-myCustomColor2-800: var(--md-ref-palette-my-custom-color-2-20);
179
+ --color-myCustomColor2-900: var(--md-ref-palette-my-custom-color-2-10);
180
+ --color-myCustomColor2-950: var(--md-ref-palette-my-custom-color-2-5);
167
181
  }
package/src/cli.ts DELETED
@@ -1,116 +0,0 @@
1
- #!/usr/bin/env tsx
2
-
3
- // @example
4
-
5
- // ```sh
6
- // $ npx tsx src/cli.ts builder '#6750A4'
7
- // $ npx tsx src/cli.ts builder '#6750A4' --format css
8
- // $ npx tsx src/cli.ts builder '#6750A4' --adaptive-shades --format figma
9
- // ```
10
-
11
- import * as fs from "node:fs";
12
- import * as path from "node:path";
13
-
14
- import { Command, Option } from "commander";
15
- import {
16
- builder,
17
- DEFAULT_ADAPTIVE_SHADES,
18
- DEFAULT_BLEND,
19
- DEFAULT_CONTRAST,
20
- DEFAULT_CONTRAST_ALL_COLORS,
21
- DEFAULT_SCHEME,
22
- schemeNames,
23
- } from "./lib/builder";
24
-
25
- const program = new Command();
26
-
27
- program.name("react-mcu").description("m3 color system for react");
28
-
29
- program
30
- .command("builder")
31
- .description("Generate a color theme from a source color")
32
- .argument("<source>", "Source color in hex format (e.g. #6750A4)")
33
- .addOption(
34
- new Option("--scheme <name>", "Color scheme variant")
35
- .choices(schemeNames)
36
- .default(DEFAULT_SCHEME),
37
- )
38
- .option(
39
- "--contrast <number>",
40
- "Contrast level from -1.0 to 1.0",
41
- parseFloat,
42
- DEFAULT_CONTRAST,
43
- )
44
- .option("--primary <hex>", "Primary color override")
45
- .option("--secondary <hex>", "Secondary color override")
46
- .option("--tertiary <hex>", "Tertiary color override")
47
- .option("--error <hex>", "Error color override")
48
- .option("--neutral <hex>", "Neutral color override")
49
- .option("--neutral-variant <hex>", "Neutral variant color override")
50
- .option(
51
- "--custom-colors <json>",
52
- 'Custom colors as JSON array (e.g. \'[{"name":"brand","hex":"#FF5733","blend":true}]\')',
53
- )
54
- .option("--format <type>", "Output format: json, css, or figma", "figma")
55
- .option("--output <dir>", "Output directory (required for figma format)")
56
- .option(
57
- "--adaptive-shades",
58
- "Adapt tonal palette shades for dark mode",
59
- DEFAULT_ADAPTIVE_SHADES,
60
- )
61
- .option(
62
- "--contrast-all-colors",
63
- "Apply contrast adjustment to tonal palette shades",
64
- DEFAULT_CONTRAST_ALL_COLORS,
65
- )
66
- .action((source: string, opts) => {
67
- let customColors: { name: string; hex: string; blend: boolean }[] = [];
68
- if (opts.customColors) {
69
- try {
70
- const parsed = JSON.parse(opts.customColors) as {
71
- name: string;
72
- hex: string;
73
- blend?: boolean;
74
- }[];
75
- customColors = parsed.map((c) => ({
76
- name: c.name,
77
- hex: c.hex,
78
- blend: c.blend ?? DEFAULT_BLEND,
79
- }));
80
- } catch {
81
- console.error("Error: --custom-colors must be valid JSON");
82
- process.exit(1);
83
- }
84
- }
85
-
86
- const result = builder(source, {
87
- scheme: opts.scheme,
88
- contrast: opts.contrast,
89
- primary: opts.primary,
90
- secondary: opts.secondary,
91
- tertiary: opts.tertiary,
92
- error: opts.error,
93
- neutral: opts.neutral,
94
- neutralVariant: opts.neutralVariant,
95
- customColors,
96
- adaptiveShades: opts.adaptiveShades,
97
- contrastAllColors: opts.contrastAllColors,
98
- });
99
-
100
- if (opts.format === "css") {
101
- process.stdout.write(result.toCss());
102
- } else if (opts.format === "figma") {
103
- const outputDir = opts.output ?? "mcu-theme";
104
- fs.mkdirSync(outputDir, { recursive: true });
105
- const files = result.toFigmaTokens();
106
- for (const [filename, content] of Object.entries(files)) {
107
- const filePath = path.join(outputDir, filename);
108
- fs.writeFileSync(filePath, JSON.stringify(content, null, 2) + "\n");
109
- console.error(`wrote ${filePath}`);
110
- }
111
- } else {
112
- process.stdout.write(JSON.stringify(result.toJson(), null, 2) + "\n");
113
- }
114
- });
115
-
116
- program.parse();