@mekari/pixel3-theme 0.2.1-dev.0 → 0.2.2-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 (84) hide show
  1. package/dist/conditions.d.mts +4 -1
  2. package/dist/conditions.d.ts +4 -1
  3. package/dist/index.js +2889 -409
  4. package/dist/index.mjs +2888 -408
  5. package/dist/semanticTokens/colors.d.mts +892 -0
  6. package/dist/semanticTokens/colors.d.ts +892 -0
  7. package/dist/semanticTokens/index.d.mts +951 -0
  8. package/dist/semanticTokens/index.d.ts +951 -0
  9. package/dist/semanticTokens/spacing.d.mts +59 -0
  10. package/dist/semanticTokens/spacing.d.ts +59 -0
  11. package/dist/tokens/borders.d.mts +2 -2
  12. package/dist/tokens/borders.d.ts +2 -2
  13. package/dist/tokens/colors.d.mts +37 -34
  14. package/dist/tokens/colors.d.ts +37 -34
  15. package/dist/tokens/index.d.mts +59 -35
  16. package/dist/tokens/index.d.ts +59 -35
  17. package/dist/tokens/radii.d.mts +5 -0
  18. package/dist/tokens/radii.d.ts +5 -0
  19. package/dist/tokens/spacing.d.mts +16 -0
  20. package/dist/tokens/spacing.d.ts +16 -0
  21. package/dist/tokens-next/borders.d.mts +22 -0
  22. package/dist/tokens-next/borders.d.ts +22 -0
  23. package/dist/tokens-next/colors.d.mts +441 -0
  24. package/dist/tokens-next/colors.d.ts +441 -0
  25. package/dist/tokens-next/index.d.mts +772 -0
  26. package/dist/tokens-next/index.d.ts +772 -0
  27. package/dist/tokens-next/radii.d.mts +26 -0
  28. package/dist/tokens-next/radii.d.ts +26 -0
  29. package/dist/tokens-next/shadows.d.mts +28 -0
  30. package/dist/tokens-next/shadows.d.ts +28 -0
  31. package/dist/tokens-next/spacing.d.mts +51 -0
  32. package/dist/tokens-next/spacing.d.ts +51 -0
  33. package/package.json +1 -1
  34. package/src/conditions.ts +6 -4
  35. package/src/global-css.ts +4 -0
  36. package/src/index.ts +15 -2
  37. package/src/recipes/accordion.ts +12 -2
  38. package/src/recipes/autocomplete.ts +6 -1
  39. package/src/recipes/avatar.ts +68 -11
  40. package/src/recipes/badge.ts +174 -50
  41. package/src/recipes/banner.ts +36 -11
  42. package/src/recipes/broadcast.ts +78 -12
  43. package/src/recipes/button.ts +132 -9
  44. package/src/recipes/carousel.ts +5 -0
  45. package/src/recipes/chart.ts +10 -5
  46. package/src/recipes/checkbox.ts +68 -13
  47. package/src/recipes/color-picker.ts +74 -23
  48. package/src/recipes/date-picker.ts +165 -31
  49. package/src/recipes/divider.ts +5 -1
  50. package/src/recipes/dropzone.ts +80 -8
  51. package/src/recipes/form-control.ts +12 -3
  52. package/src/recipes/input-tag.ts +48 -8
  53. package/src/recipes/input.ts +75 -8
  54. package/src/recipes/modal.ts +30 -9
  55. package/src/recipes/popover.ts +28 -9
  56. package/src/recipes/progress.ts +9 -2
  57. package/src/recipes/radio.ts +52 -21
  58. package/src/recipes/rich-text-editor.ts +32 -6
  59. package/src/recipes/segmented-control.ts +47 -7
  60. package/src/recipes/select.ts +42 -0
  61. package/src/recipes/slider.ts +46 -6
  62. package/src/recipes/table.ts +26 -11
  63. package/src/recipes/tabs.ts +35 -3
  64. package/src/recipes/tag.ts +43 -13
  65. package/src/recipes/textarea.ts +0 -46
  66. package/src/recipes/timeline.ts +36 -8
  67. package/src/recipes/toast.ts +21 -4
  68. package/src/recipes/toggle.ts +59 -11
  69. package/src/recipes/tooltip.ts +5 -1
  70. package/src/recipes/upload.ts +51 -16
  71. package/src/semanticTokens/colors.ts +893 -0
  72. package/src/semanticTokens/index.ts +8 -0
  73. package/src/semanticTokens/spacing.ts +59 -0
  74. package/src/tokens/borders.ts +1 -1
  75. package/src/tokens/colors.ts +18 -23
  76. package/src/tokens/index.ts +2 -2
  77. package/src/tokens/radii.ts +5 -5
  78. package/src/tokens/spacing.ts +17 -17
  79. package/src/tokens-next/borders.ts +10 -0
  80. package/src/tokens-next/colors.ts +171 -0
  81. package/src/tokens-next/index.ts +32 -0
  82. package/src/tokens-next/radii.ts +10 -0
  83. package/src/tokens-next/shadows.ts +28 -0
  84. package/src/tokens-next/spacing.ts +16 -0
@@ -0,0 +1,59 @@
1
+ declare const spacing: {
2
+ '4xs': {
3
+ value: {
4
+ base: string;
5
+ };
6
+ };
7
+ '3xs': {
8
+ value: {
9
+ base: string;
10
+ };
11
+ };
12
+ '2xs': {
13
+ value: {
14
+ base: string;
15
+ };
16
+ };
17
+ xs: {
18
+ value: {
19
+ base: string;
20
+ };
21
+ };
22
+ sm: {
23
+ value: {
24
+ base: string;
25
+ };
26
+ };
27
+ md: {
28
+ value: {
29
+ base: string;
30
+ };
31
+ };
32
+ lg: {
33
+ value: {
34
+ base: string;
35
+ };
36
+ };
37
+ xl: {
38
+ value: {
39
+ base: string;
40
+ };
41
+ };
42
+ '2xl': {
43
+ value: {
44
+ base: string;
45
+ };
46
+ };
47
+ '3xl': {
48
+ value: {
49
+ base: string;
50
+ };
51
+ };
52
+ '4xl': {
53
+ value: {
54
+ base: string;
55
+ };
56
+ };
57
+ };
58
+
59
+ export { spacing };
@@ -0,0 +1,59 @@
1
+ declare const spacing: {
2
+ '4xs': {
3
+ value: {
4
+ base: string;
5
+ };
6
+ };
7
+ '3xs': {
8
+ value: {
9
+ base: string;
10
+ };
11
+ };
12
+ '2xs': {
13
+ value: {
14
+ base: string;
15
+ };
16
+ };
17
+ xs: {
18
+ value: {
19
+ base: string;
20
+ };
21
+ };
22
+ sm: {
23
+ value: {
24
+ base: string;
25
+ };
26
+ };
27
+ md: {
28
+ value: {
29
+ base: string;
30
+ };
31
+ };
32
+ lg: {
33
+ value: {
34
+ base: string;
35
+ };
36
+ };
37
+ xl: {
38
+ value: {
39
+ base: string;
40
+ };
41
+ };
42
+ '2xl': {
43
+ value: {
44
+ base: string;
45
+ };
46
+ };
47
+ '3xl': {
48
+ value: {
49
+ base: string;
50
+ };
51
+ };
52
+ '4xl': {
53
+ value: {
54
+ base: string;
55
+ };
56
+ };
57
+ };
58
+
59
+ export { spacing };
@@ -1,4 +1,4 @@
1
- declare const borders: {
1
+ declare const borderWidths: {
2
2
  none: {
3
3
  value: string;
4
4
  };
@@ -13,4 +13,4 @@ declare const borders: {
13
13
  };
14
14
  };
15
15
 
16
- export { borders };
16
+ export { borderWidths };
@@ -1,4 +1,4 @@
1
- declare const borders: {
1
+ declare const borderWidths: {
2
2
  none: {
3
3
  value: string;
4
4
  };
@@ -13,4 +13,4 @@ declare const borders: {
13
13
  };
14
14
  };
15
15
 
16
- export { borders };
16
+ export { borderWidths };
@@ -1,11 +1,11 @@
1
1
  declare const colors: {
2
- currentcolor: {
2
+ debug: {
3
3
  value: string;
4
4
  };
5
- dark: {
5
+ currentcolor: {
6
6
  value: string;
7
7
  };
8
- white: {
8
+ dark: {
9
9
  value: string;
10
10
  };
11
11
  background: {
@@ -14,37 +14,8 @@ declare const colors: {
14
14
  overlay: {
15
15
  value: string;
16
16
  };
17
- brand: {
18
- capital: {
19
- value: string;
20
- };
21
- esign: {
22
- value: string;
23
- };
24
- expense: {
25
- value: string;
26
- };
27
- flex: {
28
- value: string;
29
- };
30
- jurnal: {
31
- value: string;
32
- };
33
- klikpajak: {
34
- value: string;
35
- };
36
- mekari: {
37
- value: string;
38
- };
39
- qontak: {
40
- value: string;
41
- };
42
- talenta: {
43
- value: string;
44
- };
45
- university: {
46
- value: string;
47
- };
17
+ white: {
18
+ value: string;
48
19
  };
49
20
  whiteAlpha: {
50
21
  50: {
@@ -295,6 +266,38 @@ declare const colors: {
295
266
  value: string;
296
267
  };
297
268
  };
269
+ brand: {
270
+ capital: {
271
+ value: string;
272
+ };
273
+ esign: {
274
+ value: string;
275
+ };
276
+ expense: {
277
+ value: string;
278
+ };
279
+ flex: {
280
+ value: string;
281
+ };
282
+ jurnal: {
283
+ value: string;
284
+ };
285
+ klikpajak: {
286
+ value: string;
287
+ };
288
+ mekari: {
289
+ value: string;
290
+ };
291
+ qontak: {
292
+ value: string;
293
+ };
294
+ talenta: {
295
+ value: string;
296
+ };
297
+ university: {
298
+ value: string;
299
+ };
300
+ };
298
301
  };
299
302
 
300
303
  export { colors };
@@ -1,11 +1,11 @@
1
1
  declare const colors: {
2
- currentcolor: {
2
+ debug: {
3
3
  value: string;
4
4
  };
5
- dark: {
5
+ currentcolor: {
6
6
  value: string;
7
7
  };
8
- white: {
8
+ dark: {
9
9
  value: string;
10
10
  };
11
11
  background: {
@@ -14,37 +14,8 @@ declare const colors: {
14
14
  overlay: {
15
15
  value: string;
16
16
  };
17
- brand: {
18
- capital: {
19
- value: string;
20
- };
21
- esign: {
22
- value: string;
23
- };
24
- expense: {
25
- value: string;
26
- };
27
- flex: {
28
- value: string;
29
- };
30
- jurnal: {
31
- value: string;
32
- };
33
- klikpajak: {
34
- value: string;
35
- };
36
- mekari: {
37
- value: string;
38
- };
39
- qontak: {
40
- value: string;
41
- };
42
- talenta: {
43
- value: string;
44
- };
45
- university: {
46
- value: string;
47
- };
17
+ white: {
18
+ value: string;
48
19
  };
49
20
  whiteAlpha: {
50
21
  50: {
@@ -295,6 +266,38 @@ declare const colors: {
295
266
  value: string;
296
267
  };
297
268
  };
269
+ brand: {
270
+ capital: {
271
+ value: string;
272
+ };
273
+ esign: {
274
+ value: string;
275
+ };
276
+ expense: {
277
+ value: string;
278
+ };
279
+ flex: {
280
+ value: string;
281
+ };
282
+ jurnal: {
283
+ value: string;
284
+ };
285
+ klikpajak: {
286
+ value: string;
287
+ };
288
+ mekari: {
289
+ value: string;
290
+ };
291
+ qontak: {
292
+ value: string;
293
+ };
294
+ talenta: {
295
+ value: string;
296
+ };
297
+ university: {
298
+ value: string;
299
+ };
300
+ };
298
301
  };
299
302
 
300
303
  export { colors };
@@ -1,5 +1,5 @@
1
1
  declare const tokens: {
2
- borders: {
2
+ borderWidths: {
3
3
  none: {
4
4
  value: string;
5
5
  };
@@ -14,13 +14,13 @@ declare const tokens: {
14
14
  };
15
15
  };
16
16
  colors: {
17
- currentcolor: {
17
+ debug: {
18
18
  value: string;
19
19
  };
20
- dark: {
20
+ currentcolor: {
21
21
  value: string;
22
22
  };
23
- white: {
23
+ dark: {
24
24
  value: string;
25
25
  };
26
26
  background: {
@@ -29,37 +29,8 @@ declare const tokens: {
29
29
  overlay: {
30
30
  value: string;
31
31
  };
32
- brand: {
33
- capital: {
34
- value: string;
35
- };
36
- esign: {
37
- value: string;
38
- };
39
- expense: {
40
- value: string;
41
- };
42
- flex: {
43
- value: string;
44
- };
45
- jurnal: {
46
- value: string;
47
- };
48
- klikpajak: {
49
- value: string;
50
- };
51
- mekari: {
52
- value: string;
53
- };
54
- qontak: {
55
- value: string;
56
- };
57
- talenta: {
58
- value: string;
59
- };
60
- university: {
61
- value: string;
62
- };
32
+ white: {
33
+ value: string;
63
34
  };
64
35
  whiteAlpha: {
65
36
  50: {
@@ -310,6 +281,38 @@ declare const tokens: {
310
281
  value: string;
311
282
  };
312
283
  };
284
+ brand: {
285
+ capital: {
286
+ value: string;
287
+ };
288
+ esign: {
289
+ value: string;
290
+ };
291
+ expense: {
292
+ value: string;
293
+ };
294
+ flex: {
295
+ value: string;
296
+ };
297
+ jurnal: {
298
+ value: string;
299
+ };
300
+ klikpajak: {
301
+ value: string;
302
+ };
303
+ mekari: {
304
+ value: string;
305
+ };
306
+ qontak: {
307
+ value: string;
308
+ };
309
+ talenta: {
310
+ value: string;
311
+ };
312
+ university: {
313
+ value: string;
314
+ };
315
+ };
313
316
  };
314
317
  durations: {
315
318
  slow: {
@@ -424,18 +427,23 @@ declare const tokens: {
424
427
  };
425
428
  xs: {
426
429
  value: string;
430
+ description: string;
427
431
  };
428
432
  sm: {
429
433
  value: string;
434
+ description: string;
430
435
  };
431
436
  md: {
432
437
  value: string;
438
+ description: string;
433
439
  };
434
440
  lg: {
435
441
  value: string;
442
+ description: string;
436
443
  };
437
444
  xl: {
438
445
  value: string;
446
+ description: string;
439
447
  };
440
448
  full: {
441
449
  value: string;
@@ -562,51 +570,67 @@ declare const tokens: {
562
570
  };
563
571
  0.5: {
564
572
  value: string;
573
+ description: string;
565
574
  };
566
575
  1: {
567
576
  value: string;
577
+ description: string;
568
578
  };
569
579
  1.5: {
570
580
  value: string;
581
+ description: string;
571
582
  };
572
583
  2: {
573
584
  value: string;
585
+ description: string;
574
586
  };
575
587
  3: {
576
588
  value: string;
589
+ description: string;
577
590
  };
578
591
  4: {
579
592
  value: string;
593
+ description: string;
580
594
  };
581
595
  5: {
582
596
  value: string;
597
+ description: string;
583
598
  };
584
599
  6: {
585
600
  value: string;
601
+ description: string;
586
602
  };
587
603
  8: {
588
604
  value: string;
605
+ description: string;
589
606
  };
590
607
  12: {
591
608
  value: string;
609
+ description: string;
592
610
  };
593
611
  16: {
594
612
  value: string;
613
+ description: string;
595
614
  };
596
615
  20: {
597
616
  value: string;
617
+ description: string;
598
618
  };
599
619
  24: {
600
620
  value: string;
621
+ description: string;
601
622
  };
602
623
  32: {
603
624
  value: string;
625
+ description: string;
604
626
  };
605
627
  40: {
606
628
  value: string;
629
+ description: string;
607
630
  };
608
631
  64: {
609
632
  value: string;
633
+ description: string;
610
634
  };
611
635
  };
612
636
  zIndex: {
@@ -1,5 +1,5 @@
1
1
  declare const tokens: {
2
- borders: {
2
+ borderWidths: {
3
3
  none: {
4
4
  value: string;
5
5
  };
@@ -14,13 +14,13 @@ declare const tokens: {
14
14
  };
15
15
  };
16
16
  colors: {
17
- currentcolor: {
17
+ debug: {
18
18
  value: string;
19
19
  };
20
- dark: {
20
+ currentcolor: {
21
21
  value: string;
22
22
  };
23
- white: {
23
+ dark: {
24
24
  value: string;
25
25
  };
26
26
  background: {
@@ -29,37 +29,8 @@ declare const tokens: {
29
29
  overlay: {
30
30
  value: string;
31
31
  };
32
- brand: {
33
- capital: {
34
- value: string;
35
- };
36
- esign: {
37
- value: string;
38
- };
39
- expense: {
40
- value: string;
41
- };
42
- flex: {
43
- value: string;
44
- };
45
- jurnal: {
46
- value: string;
47
- };
48
- klikpajak: {
49
- value: string;
50
- };
51
- mekari: {
52
- value: string;
53
- };
54
- qontak: {
55
- value: string;
56
- };
57
- talenta: {
58
- value: string;
59
- };
60
- university: {
61
- value: string;
62
- };
32
+ white: {
33
+ value: string;
63
34
  };
64
35
  whiteAlpha: {
65
36
  50: {
@@ -310,6 +281,38 @@ declare const tokens: {
310
281
  value: string;
311
282
  };
312
283
  };
284
+ brand: {
285
+ capital: {
286
+ value: string;
287
+ };
288
+ esign: {
289
+ value: string;
290
+ };
291
+ expense: {
292
+ value: string;
293
+ };
294
+ flex: {
295
+ value: string;
296
+ };
297
+ jurnal: {
298
+ value: string;
299
+ };
300
+ klikpajak: {
301
+ value: string;
302
+ };
303
+ mekari: {
304
+ value: string;
305
+ };
306
+ qontak: {
307
+ value: string;
308
+ };
309
+ talenta: {
310
+ value: string;
311
+ };
312
+ university: {
313
+ value: string;
314
+ };
315
+ };
313
316
  };
314
317
  durations: {
315
318
  slow: {
@@ -424,18 +427,23 @@ declare const tokens: {
424
427
  };
425
428
  xs: {
426
429
  value: string;
430
+ description: string;
427
431
  };
428
432
  sm: {
429
433
  value: string;
434
+ description: string;
430
435
  };
431
436
  md: {
432
437
  value: string;
438
+ description: string;
433
439
  };
434
440
  lg: {
435
441
  value: string;
442
+ description: string;
436
443
  };
437
444
  xl: {
438
445
  value: string;
446
+ description: string;
439
447
  };
440
448
  full: {
441
449
  value: string;
@@ -562,51 +570,67 @@ declare const tokens: {
562
570
  };
563
571
  0.5: {
564
572
  value: string;
573
+ description: string;
565
574
  };
566
575
  1: {
567
576
  value: string;
577
+ description: string;
568
578
  };
569
579
  1.5: {
570
580
  value: string;
581
+ description: string;
571
582
  };
572
583
  2: {
573
584
  value: string;
585
+ description: string;
574
586
  };
575
587
  3: {
576
588
  value: string;
589
+ description: string;
577
590
  };
578
591
  4: {
579
592
  value: string;
593
+ description: string;
580
594
  };
581
595
  5: {
582
596
  value: string;
597
+ description: string;
583
598
  };
584
599
  6: {
585
600
  value: string;
601
+ description: string;
586
602
  };
587
603
  8: {
588
604
  value: string;
605
+ description: string;
589
606
  };
590
607
  12: {
591
608
  value: string;
609
+ description: string;
592
610
  };
593
611
  16: {
594
612
  value: string;
613
+ description: string;
595
614
  };
596
615
  20: {
597
616
  value: string;
617
+ description: string;
598
618
  };
599
619
  24: {
600
620
  value: string;
621
+ description: string;
601
622
  };
602
623
  32: {
603
624
  value: string;
625
+ description: string;
604
626
  };
605
627
  40: {
606
628
  value: string;
629
+ description: string;
607
630
  };
608
631
  64: {
609
632
  value: string;
633
+ description: string;
610
634
  };
611
635
  };
612
636
  zIndex: {