@mekari/pixel3-theme 0.7.0-dev.1 → 0.7.1-dev.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 (31) hide show
  1. package/dist/index.js +875 -862
  2. package/dist/index.mjs +875 -862
  3. package/dist/semanticTokens/colors.d.mts +335 -333
  4. package/dist/semanticTokens/colors.d.ts +335 -333
  5. package/dist/semanticTokens/index.d.mts +368 -333
  6. package/dist/semanticTokens/index.d.ts +368 -333
  7. package/dist/semanticTokens/spacing.d.mts +33 -0
  8. package/dist/semanticTokens/spacing.d.ts +33 -0
  9. package/dist/tokens-next/colors.d.mts +93 -93
  10. package/dist/tokens-next/colors.d.ts +93 -93
  11. package/dist/tokens-next/index.d.mts +93 -108
  12. package/dist/tokens-next/index.d.ts +93 -108
  13. package/dist/tokens-next/radii.d.mts +0 -4
  14. package/dist/tokens-next/radii.d.ts +0 -4
  15. package/dist/tokens-next/spacing.d.mts +0 -11
  16. package/dist/tokens-next/spacing.d.ts +0 -11
  17. package/package.json +1 -1
  18. package/src/recipes/form-control.ts +8 -2
  19. package/src/recipes/input-tag.ts +5 -2
  20. package/src/recipes/input.ts +4 -4
  21. package/src/recipes/select.ts +6 -1
  22. package/src/recipes/upload.ts +7 -5
  23. package/src/semanticTokens/colors.ts +626 -631
  24. package/src/semanticTokens/spacing.ts +44 -11
  25. package/src/tokens-next/colors.ts +165 -172
  26. package/src/tokens-next/index.ts +1 -1
  27. package/src/tokens-next/radii.ts +4 -4
  28. package/src/tokens-next/spacing.ts +11 -11
  29. /package/dist/tokens-next/{borders.d.mts → borderWidths.d.mts} +0 -0
  30. /package/dist/tokens-next/{borders.d.ts → borderWidths.d.ts} +0 -0
  31. /package/src/tokens-next/{borders.ts → borderWidths.ts} +0 -0
package/dist/semanticTokens/spacing.d.mts CHANGED
@@ -2,56 +2,89 @@ declare const spacing: {
2
2
  '4xs': {
3
3
  value: {
4
4
  base: string;
5
+ _light: string;
6
+ _dark: string;
7
+ _enterprise: string;
5
8
  };
6
9
  };
7
10
  '3xs': {
8
11
  value: {
9
12
  base: string;
13
+ _light: string;
14
+ _dark: string;
15
+ _enterprise: string;
10
16
  };
11
17
  };
12
18
  '2xs': {
13
19
  value: {
14
20
  base: string;
21
+ _light: string;
22
+ _dark: string;
23
+ _enterprise: string;
15
24
  };
16
25
  };
17
26
  xs: {
18
27
  value: {
19
28
  base: string;
29
+ _light: string;
30
+ _dark: string;
31
+ _enterprise: string;
20
32
  };
21
33
  };
22
34
  sm: {
23
35
  value: {
24
36
  base: string;
37
+ _light: string;
38
+ _dark: string;
39
+ _enterprise: string;
25
40
  };
26
41
  };
27
42
  md: {
28
43
  value: {
29
44
  base: string;
45
+ _light: string;
46
+ _dark: string;
47
+ _enterprise: string;
30
48
  };
31
49
  };
32
50
  lg: {
33
51
  value: {
34
52
  base: string;
53
+ _light: string;
54
+ _dark: string;
55
+ _enterprise: string;
35
56
  };
36
57
  };
37
58
  xl: {
38
59
  value: {
39
60
  base: string;
61
+ _light: string;
62
+ _dark: string;
63
+ _enterprise: string;
40
64
  };
41
65
  };
42
66
  '2xl': {
43
67
  value: {
44
68
  base: string;
69
+ _light: string;
70
+ _dark: string;
71
+ _enterprise: string;
45
72
  };
46
73
  };
47
74
  '3xl': {
48
75
  value: {
49
76
  base: string;
77
+ _light: string;
78
+ _dark: string;
79
+ _enterprise: string;
50
80
  };
51
81
  };
52
82
  '4xl': {
53
83
  value: {
54
84
  base: string;
85
+ _light: string;
86
+ _dark: string;
87
+ _enterprise: string;
55
88
  };
56
89
  };
57
90
  };
package/dist/semanticTokens/spacing.d.ts CHANGED
@@ -2,56 +2,89 @@ declare const spacing: {
2
2
  '4xs': {
3
3
  value: {
4
4
  base: string;
5
+ _light: string;
6
+ _dark: string;
7
+ _enterprise: string;
5
8
  };
6
9
  };
7
10
  '3xs': {
8
11
  value: {
9
12
  base: string;
13
+ _light: string;
14
+ _dark: string;
15
+ _enterprise: string;
10
16
  };
11
17
  };
12
18
  '2xs': {
13
19
  value: {
14
20
  base: string;
21
+ _light: string;
22
+ _dark: string;
23
+ _enterprise: string;
15
24
  };
16
25
  };
17
26
  xs: {
18
27
  value: {
19
28
  base: string;
29
+ _light: string;
30
+ _dark: string;
31
+ _enterprise: string;
20
32
  };
21
33
  };
22
34
  sm: {
23
35
  value: {
24
36
  base: string;
37
+ _light: string;
38
+ _dark: string;
39
+ _enterprise: string;
25
40
  };
26
41
  };
27
42
  md: {
28
43
  value: {
29
44
  base: string;
45
+ _light: string;
46
+ _dark: string;
47
+ _enterprise: string;
30
48
  };
31
49
  };
32
50
  lg: {
33
51
  value: {
34
52
  base: string;
53
+ _light: string;
54
+ _dark: string;
55
+ _enterprise: string;
35
56
  };
36
57
  };
37
58
  xl: {
38
59
  value: {
39
60
  base: string;
61
+ _light: string;
62
+ _dark: string;
63
+ _enterprise: string;
40
64
  };
41
65
  };
42
66
  '2xl': {
43
67
  value: {
44
68
  base: string;
69
+ _light: string;
70
+ _dark: string;
71
+ _enterprise: string;
45
72
  };
46
73
  };
47
74
  '3xl': {
48
75
  value: {
49
76
  base: string;
77
+ _light: string;
78
+ _dark: string;
79
+ _enterprise: string;
50
80
  };
51
81
  };
52
82
  '4xl': {
53
83
  value: {
54
84
  base: string;
85
+ _light: string;
86
+ _dark: string;
87
+ _enterprise: string;
55
88
  };
56
89
  };
57
90
  };
package/dist/tokens-next/colors.d.mts CHANGED
@@ -2,13 +2,10 @@ declare const colors: {
2
2
  debug: {
3
3
  value: string;
4
4
  };
5
- currentcolor: {
6
- value: string;
7
- };
8
5
  transparent: {
9
6
  value: string;
10
7
  };
11
- white: {
8
+ currentcolor: {
12
9
  value: string;
13
10
  };
14
11
  vibrantPurple: {
@@ -17,68 +14,71 @@ declare const colors: {
17
14
  lightPurple: {
18
15
  value: string;
19
16
  };
17
+ white: {
18
+ value: string;
19
+ };
20
20
  dark: {
21
21
  '-100': {
22
22
  value: string;
23
23
  };
24
- DEFAULT: {
24
+ 100: {
25
25
  value: string;
26
26
  };
27
- 100: {
27
+ 1000: {
28
28
  value: string;
29
29
  };
30
- 200: {
30
+ '100a': {
31
31
  value: string;
32
32
  };
33
- 250: {
33
+ 200: {
34
34
  value: string;
35
35
  };
36
- 300: {
36
+ '200a': {
37
37
  value: string;
38
38
  };
39
- 350: {
39
+ 250: {
40
40
  value: string;
41
41
  };
42
- 400: {
42
+ '250a': {
43
43
  value: string;
44
44
  };
45
- 500: {
45
+ 300: {
46
46
  value: string;
47
47
  };
48
- 600: {
48
+ '300a': {
49
49
  value: string;
50
50
  };
51
- 700: {
51
+ 350: {
52
52
  value: string;
53
53
  };
54
- 800: {
54
+ '350a': {
55
55
  value: string;
56
56
  };
57
- 900: {
57
+ 400: {
58
58
  value: string;
59
59
  };
60
- 1000: {
60
+ '400a': {
61
61
  value: string;
62
62
  };
63
- '100a': {
63
+ 500: {
64
64
  value: string;
65
65
  };
66
- '200a': {
66
+ '500a': {
67
67
  value: string;
68
68
  };
69
- '250a': {
69
+ 600: {
70
70
  value: string;
71
71
  };
72
- '300a': {
72
+ 700: {
73
73
  value: string;
74
74
  };
75
- '350a': {
75
+ 800: {
76
76
  value: string;
77
77
  };
78
- '400a': {
78
+ 900: {
79
79
  value: string;
80
80
  };
81
- '500a': {
81
+ DEFAULT: {
82
82
  value: string;
83
83
  };
84
84
  };
@@ -86,46 +86,46 @@ declare const colors: {
86
86
  100: {
87
87
  value: string;
88
88
  };
89
- 200: {
89
+ 1000: {
90
90
  value: string;
91
91
  };
92
- 300: {
92
+ '100a': {
93
93
  value: string;
94
94
  };
95
- 400: {
95
+ 200: {
96
96
  value: string;
97
97
  };
98
- 500: {
98
+ '200a': {
99
99
  value: string;
100
100
  };
101
- 600: {
101
+ 300: {
102
102
  value: string;
103
103
  };
104
- 700: {
104
+ '300a': {
105
105
  value: string;
106
106
  };
107
- 800: {
107
+ 400: {
108
108
  value: string;
109
109
  };
110
- 900: {
110
+ '400a': {
111
111
  value: string;
112
112
  };
113
- 1000: {
113
+ 500: {
114
114
  value: string;
115
115
  };
116
- '100a': {
116
+ '500a': {
117
117
  value: string;
118
118
  };
119
- '200a': {
119
+ 600: {
120
120
  value: string;
121
121
  };
122
- '300a': {
122
+ 700: {
123
123
  value: string;
124
124
  };
125
- '400a': {
125
+ 800: {
126
126
  value: string;
127
127
  };
128
- '500a': {
128
+ 900: {
129
129
  value: string;
130
130
  };
131
131
  };
@@ -133,46 +133,46 @@ declare const colors: {
133
133
  100: {
134
134
  value: string;
135
135
  };
136
- 200: {
136
+ 1000: {
137
137
  value: string;
138
138
  };
139
- 300: {
139
+ '100a': {
140
140
  value: string;
141
141
  };
142
- 400: {
142
+ 200: {
143
143
  value: string;
144
144
  };
145
- 500: {
145
+ '200a': {
146
146
  value: string;
147
147
  };
148
- 600: {
148
+ 300: {
149
149
  value: string;
150
150
  };
151
- 700: {
151
+ '300a': {
152
152
  value: string;
153
153
  };
154
- 800: {
154
+ 400: {
155
155
  value: string;
156
156
  };
157
- 900: {
157
+ '400a': {
158
158
  value: string;
159
159
  };
160
- 1000: {
160
+ 500: {
161
161
  value: string;
162
162
  };
163
- '100a': {
163
+ '500a': {
164
164
  value: string;
165
165
  };
166
- '200a': {
166
+ 600: {
167
167
  value: string;
168
168
  };
169
- '300a': {
169
+ 700: {
170
170
  value: string;
171
171
  };
172
- '400a': {
172
+ 800: {
173
173
  value: string;
174
174
  };
175
- '500a': {
175
+ 900: {
176
176
  value: string;
177
177
  };
178
178
  };
@@ -180,6 +180,9 @@ declare const colors: {
180
180
  100: {
181
181
  value: string;
182
182
  };
183
+ 1000: {
184
+ value: string;
185
+ };
183
186
  200: {
184
187
  value: string;
185
188
  };
@@ -204,14 +207,14 @@ declare const colors: {
204
207
  900: {
205
208
  value: string;
206
209
  };
207
- 1000: {
208
- value: string;
209
- };
210
210
  };
211
211
  indigo: {
212
212
  100: {
213
213
  value: string;
214
214
  };
215
+ 1000: {
216
+ value: string;
217
+ };
215
218
  200: {
216
219
  value: string;
217
220
  };
@@ -236,14 +239,14 @@ declare const colors: {
236
239
  900: {
237
240
  value: string;
238
241
  };
239
- 1000: {
240
- value: string;
241
- };
242
242
  };
243
243
  violet: {
244
244
  100: {
245
245
  value: string;
246
246
  };
247
+ 1000: {
248
+ value: string;
249
+ };
247
250
  200: {
248
251
  value: string;
249
252
  };
@@ -268,14 +271,14 @@ declare const colors: {
268
271
  900: {
269
272
  value: string;
270
273
  };
271
- 1000: {
272
- value: string;
273
- };
274
274
  };
275
- fuchsia: {
275
+ lime: {
276
276
  100: {
277
277
  value: string;
278
278
  };
279
+ 1000: {
280
+ value: string;
281
+ };
279
282
  200: {
280
283
  value: string;
281
284
  };
@@ -300,14 +303,14 @@ declare const colors: {
300
303
  900: {
301
304
  value: string;
302
305
  };
303
- 1000: {
304
- value: string;
305
- };
306
306
  };
307
- red: {
307
+ emerald: {
308
308
  100: {
309
309
  value: string;
310
310
  };
311
+ 1000: {
312
+ value: string;
313
+ };
311
314
  200: {
312
315
  value: string;
313
316
  };
@@ -332,14 +335,14 @@ declare const colors: {
332
335
  900: {
333
336
  value: string;
334
337
  };
335
- 1000: {
336
- value: string;
337
- };
338
338
  };
339
- orange: {
339
+ green: {
340
340
  100: {
341
341
  value: string;
342
342
  };
343
+ 1000: {
344
+ value: string;
345
+ };
343
346
  200: {
344
347
  value: string;
345
348
  };
@@ -364,14 +367,14 @@ declare const colors: {
364
367
  900: {
365
368
  value: string;
366
369
  };
367
- 1000: {
368
- value: string;
369
- };
370
370
  };
371
- yellow: {
371
+ teal: {
372
372
  100: {
373
373
  value: string;
374
374
  };
375
+ 1000: {
376
+ value: string;
377
+ };
375
378
  200: {
376
379
  value: string;
377
380
  };
@@ -396,14 +399,14 @@ declare const colors: {
396
399
  900: {
397
400
  value: string;
398
401
  };
399
- 1000: {
400
- value: string;
401
- };
402
402
  };
403
- lime: {
403
+ fuchsia: {
404
404
  100: {
405
405
  value: string;
406
406
  };
407
+ 1000: {
408
+ value: string;
409
+ };
407
410
  200: {
408
411
  value: string;
409
412
  };
@@ -428,14 +431,14 @@ declare const colors: {
428
431
  900: {
429
432
  value: string;
430
433
  };
431
- 1000: {
432
- value: string;
433
- };
434
434
  };
435
- green: {
435
+ red: {
436
436
  100: {
437
437
  value: string;
438
438
  };
439
+ 1000: {
440
+ value: string;
441
+ };
439
442
  200: {
440
443
  value: string;
441
444
  };
@@ -460,14 +463,14 @@ declare const colors: {
460
463
  900: {
461
464
  value: string;
462
465
  };
463
- 1000: {
464
- value: string;
465
- };
466
466
  };
467
- teal: {
467
+ orange: {
468
468
  100: {
469
469
  value: string;
470
470
  };
471
+ 1000: {
472
+ value: string;
473
+ };
471
474
  200: {
472
475
  value: string;
473
476
  };
@@ -492,14 +495,14 @@ declare const colors: {
492
495
  900: {
493
496
  value: string;
494
497
  };
495
- 1000: {
496
- value: string;
497
- };
498
498
  };
499
- emerald: {
499
+ yellow: {
500
500
  100: {
501
501
  value: string;
502
502
  };
503
+ 1000: {
504
+ value: string;
505
+ };
503
506
  200: {
504
507
  value: string;
505
508
  };
@@ -524,9 +527,6 @@ declare const colors: {
524
527
  900: {
525
528
  value: string;
526
529
  };
527
- 1000: {
528
- value: string;
529
- };
530
530
  };
531
531
  brand: {
532
532
  capital: {