@matteoaliano/forest-ui 0.2.10 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +123 -0
- package/bin/sync.mjs +18 -34
- package/dist/{chunk-7B6NCKX3.mjs → chunk-EULMNCHH.mjs} +1039 -498
- package/dist/chunk-EULMNCHH.mjs.map +1 -0
- package/dist/{index-DiI9xbOM.d.mts → index-EkBIDmEu.d.mts} +109 -12
- package/dist/{index-DiI9xbOM.d.ts → index-EkBIDmEu.d.ts} +109 -12
- package/dist/index.d.mts +83 -20
- package/dist/index.d.ts +83 -20
- package/dist/index.js +1306 -571
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +233 -69
- package/dist/index.mjs.map +1 -1
- package/dist/theme.d.mts +1 -1
- package/dist/theme.d.ts +1 -1
- package/dist/theme.js +1039 -497
- package/dist/theme.js.map +1 -1
- package/dist/theme.mjs +1 -1
- package/guidelines/FOREST_BE_GUIDELINES.md +90 -0
- package/guidelines/FOREST_FE_GUIDELINES.md +543 -0
- package/guidelines/FOREST_UI_GUIDELINES.md +372 -0
- package/package.json +16 -4
- package/dist/chunk-7B6NCKX3.mjs.map +0 -1
- package/guidelines/FOREST_AI_GUIDELINES.md +0 -344
- package/guidelines/FOREST_DEV_GUIDELINES.md +0 -47
- package/guidelines/themes/FOREST_THEME_ALKEMY_PLUS.md +0 -139
- package/guidelines/themes/FOREST_THEME_DEFAULT.md +0 -70
package/dist/theme.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var styles = require('@mui/material/styles');
|
|
4
4
|
|
|
5
|
-
// src/theme/
|
|
5
|
+
// src/theme/buildTheme.ts
|
|
6
6
|
|
|
7
7
|
// src/theme/tokens.ts
|
|
8
8
|
var colors = {
|
|
@@ -96,14 +96,19 @@ var colors = {
|
|
|
96
96
|
950: "#102a56"
|
|
97
97
|
},
|
|
98
98
|
teal: {
|
|
99
|
+
50: "#f0fdf9",
|
|
99
100
|
100: "#ccfbef",
|
|
100
101
|
200: "#99f6e0",
|
|
102
|
+
300: "#5fe9d0",
|
|
103
|
+
400: "#2ed3b7",
|
|
101
104
|
600: "#0e9384",
|
|
102
105
|
700: "#107569"
|
|
103
106
|
},
|
|
104
107
|
orange: {
|
|
105
108
|
100: "#fdead7",
|
|
106
109
|
200: "#f9dbaf",
|
|
110
|
+
300: "#f7b27a",
|
|
111
|
+
400: "#f38744",
|
|
107
112
|
600: "#e04f16",
|
|
108
113
|
700: "#b93815"
|
|
109
114
|
},
|
|
@@ -116,24 +121,31 @@ var colors = {
|
|
|
116
121
|
pink: {
|
|
117
122
|
100: "#fce7f6",
|
|
118
123
|
200: "#fcceee",
|
|
124
|
+
400: "#f670c7",
|
|
125
|
+
500: "#ee46bc",
|
|
119
126
|
600: "#dd2590",
|
|
120
127
|
700: "#c11574"
|
|
121
128
|
},
|
|
122
129
|
fuchsia: {
|
|
123
130
|
100: "#fbe8ff",
|
|
124
131
|
200: "#f6d0fe",
|
|
132
|
+
400: "#e478fa",
|
|
133
|
+
500: "#d444f1",
|
|
125
134
|
600: "#ba24d5",
|
|
126
135
|
700: "#9f1ab1"
|
|
127
136
|
},
|
|
128
137
|
orangeDark: {
|
|
129
138
|
100: "#ffe6d5",
|
|
130
139
|
200: "#ffd6ae",
|
|
140
|
+
400: "#ff692e",
|
|
141
|
+
500: "#ff4405",
|
|
131
142
|
600: "#e62e05",
|
|
132
143
|
700: "#bc1b06"
|
|
133
144
|
},
|
|
134
145
|
green: {
|
|
135
146
|
100: "#d3f8df",
|
|
136
147
|
200: "#aaf0c4",
|
|
148
|
+
500: "#16b364",
|
|
137
149
|
600: "#099250",
|
|
138
150
|
700: "#087443"
|
|
139
151
|
},
|
|
@@ -142,6 +154,30 @@ var colors = {
|
|
|
142
154
|
200: "#c7d7fe",
|
|
143
155
|
600: "#444ce7",
|
|
144
156
|
700: "#3538cd"
|
|
157
|
+
},
|
|
158
|
+
violet: {
|
|
159
|
+
100: "#ece9fe",
|
|
160
|
+
200: "#ddd6fe",
|
|
161
|
+
500: "#875bf7",
|
|
162
|
+
600: "#7839ee"
|
|
163
|
+
},
|
|
164
|
+
rose: {
|
|
165
|
+
100: "#ffe4e8",
|
|
166
|
+
200: "#fecdd6",
|
|
167
|
+
400: "#fd6f8e",
|
|
168
|
+
500: "#f63d68"
|
|
169
|
+
},
|
|
170
|
+
blueLight: {
|
|
171
|
+
100: "#e0f2fe",
|
|
172
|
+
200: "#b9e6fe",
|
|
173
|
+
400: "#36bffa",
|
|
174
|
+
500: "#0ba5ec"
|
|
175
|
+
},
|
|
176
|
+
cyan: {
|
|
177
|
+
100: "#cff9fe",
|
|
178
|
+
200: "#a5f0fc",
|
|
179
|
+
600: "#088ab2",
|
|
180
|
+
700: "#0e7090"
|
|
145
181
|
}
|
|
146
182
|
};
|
|
147
183
|
var spacing = {
|
|
@@ -438,7 +474,7 @@ var toggleColors = {
|
|
|
438
474
|
buttonFgDisabled: colors.gray[50]
|
|
439
475
|
};
|
|
440
476
|
var chartColors = {
|
|
441
|
-
axisFg: colors.gray[
|
|
477
|
+
axisFg: colors.gray[100],
|
|
442
478
|
gridlineFg: colors.gray[100],
|
|
443
479
|
labelFg: colors.gray[600],
|
|
444
480
|
labelFgEmphasis: colors.gray[700],
|
|
@@ -448,31 +484,19 @@ var chartColors = {
|
|
|
448
484
|
tooltipFg: colors.base.white,
|
|
449
485
|
crosshairFg: colors.gray[500],
|
|
450
486
|
legendFg: text.tertiary,
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
],
|
|
465
|
-
vibrant: [
|
|
466
|
-
"#6B38FB",
|
|
467
|
-
// 1. Deep Purple
|
|
468
|
-
"#E85B22",
|
|
469
|
-
// 2. Deep Orange
|
|
470
|
-
"#4AABFF",
|
|
471
|
-
// 3. Bright Blue
|
|
472
|
-
"#E83B1A",
|
|
473
|
-
// 4. True Red
|
|
474
|
-
"#E02088"
|
|
475
|
-
// 5. Magenta
|
|
487
|
+
series: [
|
|
488
|
+
{ fg: colors.violet[500], fgHover: colors.violet[600], bg: colors.violet[100], bgHover: colors.violet[200] },
|
|
489
|
+
{ fg: colors.orangeDark[400], fgHover: colors.orangeDark[500], bg: colors.orangeDark[100], bgHover: colors.orangeDark[200] },
|
|
490
|
+
{ fg: colors.teal[300], fgHover: colors.teal[400], bg: colors.teal[50], bgHover: colors.teal[100] },
|
|
491
|
+
{ fg: colors.warning[400], fgHover: colors.warning[500], bg: colors.warning[100], bgHover: colors.warning[200] },
|
|
492
|
+
{ fg: colors.rose[400], fgHover: colors.rose[500], bg: colors.rose[100], bgHover: colors.rose[200] },
|
|
493
|
+
{ fg: colors.blueLight[400], fgHover: colors.blueLight[500], bg: colors.blueLight[100], bgHover: colors.blueLight[200] },
|
|
494
|
+
{ fg: colors.orange[300], fgHover: colors.orange[400], bg: colors.orange[100], bgHover: colors.orange[200] },
|
|
495
|
+
{ fg: colors.cyan[600], fgHover: colors.cyan[700], bg: colors.cyan[100], bgHover: colors.cyan[200] },
|
|
496
|
+
{ fg: colors.green[500], fgHover: colors.green[600], bg: colors.green[100], bgHover: colors.green[200] },
|
|
497
|
+
{ fg: colors.pink[400], fgHover: colors.pink[500], bg: colors.pink[100], bgHover: colors.pink[200] },
|
|
498
|
+
{ fg: colors.fuchsia[400], fgHover: colors.fuchsia[500], bg: colors.fuchsia[100], bgHover: colors.fuchsia[200] },
|
|
499
|
+
{ fg: colors.teal[600], fgHover: colors.teal[700], bg: colors.teal[100], bgHover: colors.teal[200] }
|
|
476
500
|
]
|
|
477
501
|
};
|
|
478
502
|
var alpha = {
|
|
@@ -505,60 +529,60 @@ var alpha = {
|
|
|
505
529
|
// src/theme/palette.ts
|
|
506
530
|
function buildPalette(tokens) {
|
|
507
531
|
var _a;
|
|
508
|
-
const { colors:
|
|
532
|
+
const { colors: colors5, text: text5, bg: bg5, fg: fg5, border: border5 } = tokens;
|
|
509
533
|
return {
|
|
510
534
|
primary: {
|
|
511
|
-
main:
|
|
512
|
-
light:
|
|
513
|
-
dark:
|
|
514
|
-
contrastText:
|
|
535
|
+
main: colors5.brand[600],
|
|
536
|
+
light: colors5.brand[400],
|
|
537
|
+
dark: colors5.brand[700],
|
|
538
|
+
contrastText: colors5.base.white
|
|
515
539
|
},
|
|
516
540
|
secondary: {
|
|
517
|
-
main:
|
|
518
|
-
light:
|
|
519
|
-
dark:
|
|
520
|
-
contrastText:
|
|
541
|
+
main: colors5.gray[600],
|
|
542
|
+
light: colors5.gray[400],
|
|
543
|
+
dark: colors5.gray[700],
|
|
544
|
+
contrastText: colors5.base.white
|
|
521
545
|
},
|
|
522
546
|
error: {
|
|
523
|
-
main:
|
|
524
|
-
light:
|
|
525
|
-
dark:
|
|
526
|
-
contrastText:
|
|
547
|
+
main: colors5.error[600],
|
|
548
|
+
light: colors5.error[300],
|
|
549
|
+
dark: colors5.error[700],
|
|
550
|
+
contrastText: colors5.base.white
|
|
527
551
|
},
|
|
528
552
|
warning: {
|
|
529
|
-
main:
|
|
530
|
-
light:
|
|
531
|
-
dark:
|
|
532
|
-
contrastText:
|
|
553
|
+
main: colors5.warning[600],
|
|
554
|
+
light: colors5.warning[300],
|
|
555
|
+
dark: colors5.warning[700],
|
|
556
|
+
contrastText: colors5.base.white
|
|
533
557
|
},
|
|
534
558
|
success: {
|
|
535
|
-
main:
|
|
536
|
-
light:
|
|
537
|
-
dark:
|
|
538
|
-
contrastText:
|
|
559
|
+
main: colors5.success[600],
|
|
560
|
+
light: colors5.success[300],
|
|
561
|
+
dark: colors5.success[700],
|
|
562
|
+
contrastText: colors5.base.white
|
|
539
563
|
},
|
|
540
564
|
info: {
|
|
541
|
-
main:
|
|
542
|
-
light:
|
|
543
|
-
dark:
|
|
544
|
-
contrastText:
|
|
565
|
+
main: colors5.blue[600],
|
|
566
|
+
light: colors5.blue[300],
|
|
567
|
+
dark: colors5.blue[700],
|
|
568
|
+
contrastText: colors5.base.white
|
|
545
569
|
},
|
|
546
570
|
background: {
|
|
547
|
-
default:
|
|
548
|
-
paper:
|
|
571
|
+
default: bg5.primary,
|
|
572
|
+
paper: bg5.secondary
|
|
549
573
|
},
|
|
550
574
|
text: {
|
|
551
|
-
primary:
|
|
552
|
-
secondary:
|
|
553
|
-
disabled:
|
|
575
|
+
primary: text5.primary,
|
|
576
|
+
secondary: text5.secondary,
|
|
577
|
+
disabled: text5.disabled
|
|
554
578
|
},
|
|
555
|
-
divider:
|
|
579
|
+
divider: border5.secondary,
|
|
556
580
|
action: {
|
|
557
|
-
active:
|
|
558
|
-
hover:
|
|
559
|
-
selected:
|
|
560
|
-
disabled:
|
|
561
|
-
disabledBackground:
|
|
581
|
+
active: fg5.tertiary,
|
|
582
|
+
hover: bg5.primaryHover,
|
|
583
|
+
selected: bg5.brandPrimary,
|
|
584
|
+
disabled: fg5.disabled,
|
|
585
|
+
disabledBackground: bg5.disabled
|
|
562
586
|
},
|
|
563
587
|
chart: (_a = tokens.chartColors) != null ? _a : chartColors
|
|
564
588
|
};
|
|
@@ -662,18 +686,78 @@ var typography = buildTypography({
|
|
|
662
686
|
fontWeight
|
|
663
687
|
});
|
|
664
688
|
|
|
689
|
+
// src/theme/shadows.ts
|
|
690
|
+
function buildShadows(tokens) {
|
|
691
|
+
const tokenShadows = tokens.shadows;
|
|
692
|
+
return [
|
|
693
|
+
"none",
|
|
694
|
+
// 0
|
|
695
|
+
tokenShadows.xs,
|
|
696
|
+
// 1
|
|
697
|
+
tokenShadows.sm,
|
|
698
|
+
// 2
|
|
699
|
+
tokenShadows.sm,
|
|
700
|
+
// 3
|
|
701
|
+
tokenShadows.md,
|
|
702
|
+
// 4
|
|
703
|
+
tokenShadows.md,
|
|
704
|
+
// 5
|
|
705
|
+
tokenShadows.md,
|
|
706
|
+
// 6
|
|
707
|
+
tokenShadows.lg,
|
|
708
|
+
// 7
|
|
709
|
+
tokenShadows.lg,
|
|
710
|
+
// 8
|
|
711
|
+
tokenShadows.lg,
|
|
712
|
+
// 9
|
|
713
|
+
tokenShadows.xl,
|
|
714
|
+
// 10
|
|
715
|
+
tokenShadows.xl,
|
|
716
|
+
// 11
|
|
717
|
+
tokenShadows.xl,
|
|
718
|
+
// 12
|
|
719
|
+
tokenShadows["2xl"],
|
|
720
|
+
// 13
|
|
721
|
+
tokenShadows["2xl"],
|
|
722
|
+
// 14
|
|
723
|
+
tokenShadows["2xl"],
|
|
724
|
+
// 15
|
|
725
|
+
tokenShadows["3xl"],
|
|
726
|
+
// 16
|
|
727
|
+
tokenShadows["3xl"],
|
|
728
|
+
// 17
|
|
729
|
+
tokenShadows["3xl"],
|
|
730
|
+
// 18
|
|
731
|
+
tokenShadows["3xl"],
|
|
732
|
+
// 19
|
|
733
|
+
tokenShadows["3xl"],
|
|
734
|
+
// 20
|
|
735
|
+
tokenShadows["3xl"],
|
|
736
|
+
// 21
|
|
737
|
+
tokenShadows["3xl"],
|
|
738
|
+
// 22
|
|
739
|
+
tokenShadows["3xl"],
|
|
740
|
+
// 23
|
|
741
|
+
tokenShadows["3xl"]
|
|
742
|
+
// 24
|
|
743
|
+
];
|
|
744
|
+
}
|
|
745
|
+
var shadows2 = buildShadows({
|
|
746
|
+
shadows
|
|
747
|
+
});
|
|
748
|
+
|
|
665
749
|
// src/theme/components.ts
|
|
666
750
|
function buildComponents(tokens) {
|
|
667
751
|
const {
|
|
668
|
-
colors:
|
|
669
|
-
radius:
|
|
670
|
-
focusRings:
|
|
752
|
+
colors: colors5,
|
|
753
|
+
radius: radius5,
|
|
754
|
+
focusRings: focusRings5,
|
|
671
755
|
shadows: tokenShadows,
|
|
672
|
-
text:
|
|
673
|
-
bg:
|
|
674
|
-
fg:
|
|
675
|
-
border:
|
|
676
|
-
buttonColors:
|
|
756
|
+
text: text5,
|
|
757
|
+
bg: bg5,
|
|
758
|
+
fg: fg5,
|
|
759
|
+
border: border5,
|
|
760
|
+
buttonColors: buttonColors5
|
|
677
761
|
} = tokens;
|
|
678
762
|
return {
|
|
679
763
|
// ─── Button ─────────────────────────────────────────────────────
|
|
@@ -683,7 +767,7 @@ function buildComponents(tokens) {
|
|
|
683
767
|
},
|
|
684
768
|
styleOverrides: {
|
|
685
769
|
root: {
|
|
686
|
-
borderRadius:
|
|
770
|
+
borderRadius: radius5.md,
|
|
687
771
|
fontWeight: 600,
|
|
688
772
|
boxShadow: tokenShadows.xs,
|
|
689
773
|
height: 32,
|
|
@@ -691,36 +775,36 @@ function buildComponents(tokens) {
|
|
|
691
775
|
fontSize: 14,
|
|
692
776
|
lineHeight: "20px",
|
|
693
777
|
"&:focus-visible": {
|
|
694
|
-
boxShadow:
|
|
778
|
+
boxShadow: focusRings5.brandShadowXs
|
|
695
779
|
}
|
|
696
780
|
},
|
|
697
781
|
containedPrimary: {
|
|
698
|
-
backgroundColor:
|
|
782
|
+
backgroundColor: buttonColors5.primary.bg,
|
|
699
783
|
"&:hover": {
|
|
700
|
-
backgroundColor:
|
|
784
|
+
backgroundColor: buttonColors5.primary.bgHover
|
|
701
785
|
}
|
|
702
786
|
},
|
|
703
787
|
outlinedPrimary: {
|
|
704
|
-
borderColor:
|
|
705
|
-
color:
|
|
788
|
+
borderColor: buttonColors5.secondaryColor.border,
|
|
789
|
+
color: buttonColors5.secondaryColor.fg,
|
|
706
790
|
"&:hover": {
|
|
707
|
-
backgroundColor:
|
|
708
|
-
borderColor:
|
|
791
|
+
backgroundColor: buttonColors5.secondaryColor.bgHover,
|
|
792
|
+
borderColor: buttonColors5.secondaryColor.borderHover
|
|
709
793
|
}
|
|
710
794
|
},
|
|
711
795
|
outlinedSecondary: {
|
|
712
|
-
borderColor:
|
|
796
|
+
borderColor: buttonColors5.secondary.border,
|
|
713
797
|
"&:hover": {
|
|
714
|
-
borderColor:
|
|
798
|
+
borderColor: buttonColors5.secondary.borderHover
|
|
715
799
|
}
|
|
716
800
|
},
|
|
717
801
|
text: {
|
|
718
802
|
boxShadow: "none"
|
|
719
803
|
},
|
|
720
804
|
textPrimary: {
|
|
721
|
-
color:
|
|
805
|
+
color: buttonColors5.tertiaryColor.fg,
|
|
722
806
|
"&:hover": {
|
|
723
|
-
backgroundColor:
|
|
807
|
+
backgroundColor: buttonColors5.tertiaryColor.bgHover
|
|
724
808
|
}
|
|
725
809
|
}
|
|
726
810
|
}
|
|
@@ -732,11 +816,11 @@ function buildComponents(tokens) {
|
|
|
732
816
|
},
|
|
733
817
|
styleOverrides: {
|
|
734
818
|
root: {
|
|
735
|
-
borderRadius:
|
|
819
|
+
borderRadius: radius5.md
|
|
736
820
|
},
|
|
737
821
|
grouped: {
|
|
738
822
|
"&:not(:last-of-type)": {
|
|
739
|
-
borderRight: `1px solid ${
|
|
823
|
+
borderRight: `1px solid ${buttonColors5.primary.borderHover}`
|
|
740
824
|
}
|
|
741
825
|
}
|
|
742
826
|
}
|
|
@@ -750,13 +834,13 @@ function buildComponents(tokens) {
|
|
|
750
834
|
boxShadow: tokenShadows.lg
|
|
751
835
|
},
|
|
752
836
|
"&:focus-visible": {
|
|
753
|
-
boxShadow:
|
|
837
|
+
boxShadow: focusRings5.brandShadowSm
|
|
754
838
|
}
|
|
755
839
|
},
|
|
756
840
|
primary: {
|
|
757
|
-
backgroundColor:
|
|
841
|
+
backgroundColor: buttonColors5.primary.bg,
|
|
758
842
|
"&:hover": {
|
|
759
|
-
backgroundColor:
|
|
843
|
+
backgroundColor: buttonColors5.primary.bgHover
|
|
760
844
|
}
|
|
761
845
|
}
|
|
762
846
|
}
|
|
@@ -771,8 +855,8 @@ function buildComponents(tokens) {
|
|
|
771
855
|
styleOverrides: {
|
|
772
856
|
input: {
|
|
773
857
|
"&::placeholder": {
|
|
774
|
-
color:
|
|
775
|
-
WebkitTextFillColor:
|
|
858
|
+
color: text5.placeholder,
|
|
859
|
+
WebkitTextFillColor: text5.placeholder,
|
|
776
860
|
fontWeight: 400,
|
|
777
861
|
opacity: 1
|
|
778
862
|
}
|
|
@@ -782,26 +866,26 @@ function buildComponents(tokens) {
|
|
|
782
866
|
MuiOutlinedInput: {
|
|
783
867
|
styleOverrides: {
|
|
784
868
|
root: {
|
|
785
|
-
borderRadius:
|
|
869
|
+
borderRadius: radius5.md,
|
|
786
870
|
boxShadow: tokenShadows.xs,
|
|
787
871
|
"&:hover .MuiOutlinedInput-notchedOutline": {
|
|
788
|
-
borderColor:
|
|
872
|
+
borderColor: border5.brand
|
|
789
873
|
},
|
|
790
874
|
"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
|
|
791
|
-
borderColor:
|
|
875
|
+
borderColor: border5.brandSolid,
|
|
792
876
|
borderWidth: 1,
|
|
793
877
|
boxShadow: "none"
|
|
794
878
|
},
|
|
795
879
|
"&.Mui-error .MuiOutlinedInput-notchedOutline": {
|
|
796
|
-
borderColor:
|
|
880
|
+
borderColor: border5.error
|
|
797
881
|
},
|
|
798
882
|
"&.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline": {
|
|
799
|
-
borderColor:
|
|
883
|
+
borderColor: border5.errorSolid,
|
|
800
884
|
boxShadow: "none"
|
|
801
885
|
}
|
|
802
886
|
},
|
|
803
887
|
notchedOutline: {
|
|
804
|
-
borderColor:
|
|
888
|
+
borderColor: border5.primary
|
|
805
889
|
},
|
|
806
890
|
input: {
|
|
807
891
|
padding: "6px 12px",
|
|
@@ -813,12 +897,12 @@ function buildComponents(tokens) {
|
|
|
813
897
|
MuiFormLabel: {
|
|
814
898
|
styleOverrides: {
|
|
815
899
|
root: {
|
|
816
|
-
color:
|
|
900
|
+
color: text5.placeholder,
|
|
817
901
|
"&.Mui-focused": {
|
|
818
|
-
color:
|
|
902
|
+
color: text5.placeholder
|
|
819
903
|
},
|
|
820
904
|
"&.Mui-error": {
|
|
821
|
-
color:
|
|
905
|
+
color: text5.errorPrimary
|
|
822
906
|
}
|
|
823
907
|
}
|
|
824
908
|
}
|
|
@@ -828,12 +912,12 @@ function buildComponents(tokens) {
|
|
|
828
912
|
root: {
|
|
829
913
|
fontSize: 14,
|
|
830
914
|
fontWeight: 500,
|
|
831
|
-
color:
|
|
915
|
+
color: text5.placeholder,
|
|
832
916
|
"&.Mui-focused": {
|
|
833
|
-
color:
|
|
917
|
+
color: text5.placeholder
|
|
834
918
|
},
|
|
835
919
|
"&.Mui-error": {
|
|
836
|
-
color:
|
|
920
|
+
color: text5.errorPrimary
|
|
837
921
|
}
|
|
838
922
|
},
|
|
839
923
|
outlined: {
|
|
@@ -852,23 +936,26 @@ function buildComponents(tokens) {
|
|
|
852
936
|
marginTop: 6,
|
|
853
937
|
marginLeft: 0,
|
|
854
938
|
"&.Mui-error": {
|
|
855
|
-
color:
|
|
939
|
+
color: text5.errorPrimary
|
|
856
940
|
}
|
|
857
941
|
}
|
|
858
942
|
}
|
|
859
943
|
},
|
|
860
|
-
// ───
|
|
861
|
-
|
|
944
|
+
// ─── Menu ──────────────────────────────────────────────────────
|
|
945
|
+
MuiMenu: {
|
|
862
946
|
defaultProps: {
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
947
|
+
autoFocus: false
|
|
948
|
+
},
|
|
949
|
+
styleOverrides: {
|
|
950
|
+
root: {
|
|
951
|
+
"& .MuiBackdrop-root": {
|
|
952
|
+
backgroundColor: "transparent"
|
|
869
953
|
}
|
|
870
954
|
}
|
|
871
|
-
}
|
|
955
|
+
}
|
|
956
|
+
},
|
|
957
|
+
// ─── Select ─────────────────────────────────────────────────────
|
|
958
|
+
MuiSelect: {
|
|
872
959
|
styleOverrides: {
|
|
873
960
|
select: {
|
|
874
961
|
"&.MuiSelect-select": {
|
|
@@ -879,18 +966,18 @@ function buildComponents(tokens) {
|
|
|
879
966
|
}
|
|
880
967
|
},
|
|
881
968
|
icon: {
|
|
882
|
-
color:
|
|
969
|
+
color: text5.placeholder
|
|
883
970
|
}
|
|
884
971
|
}
|
|
885
972
|
},
|
|
886
973
|
MuiMenuItem: {
|
|
887
974
|
styleOverrides: {
|
|
888
975
|
root: {
|
|
889
|
-
borderRadius:
|
|
976
|
+
borderRadius: radius5.md,
|
|
890
977
|
padding: "6px 8px",
|
|
891
978
|
gap: 4,
|
|
892
979
|
"&:hover": {
|
|
893
|
-
backgroundColor:
|
|
980
|
+
backgroundColor: bg5.primaryHover
|
|
894
981
|
}
|
|
895
982
|
}
|
|
896
983
|
}
|
|
@@ -899,9 +986,9 @@ function buildComponents(tokens) {
|
|
|
899
986
|
MuiAutocomplete: {
|
|
900
987
|
styleOverrides: {
|
|
901
988
|
paper: {
|
|
902
|
-
borderRadius:
|
|
989
|
+
borderRadius: radius5.md,
|
|
903
990
|
boxShadow: tokenShadows.lg,
|
|
904
|
-
border: `1px solid ${
|
|
991
|
+
border: `1px solid ${border5.secondary}`,
|
|
905
992
|
marginTop: 4
|
|
906
993
|
},
|
|
907
994
|
inputRoot: {
|
|
@@ -918,10 +1005,10 @@ function buildComponents(tokens) {
|
|
|
918
1005
|
lineHeight: "20px",
|
|
919
1006
|
padding: "6px 12px",
|
|
920
1007
|
"&.Mui-focused": {
|
|
921
|
-
backgroundColor:
|
|
1008
|
+
backgroundColor: bg5.primaryHover
|
|
922
1009
|
},
|
|
923
1010
|
'&[aria-selected="true"]': {
|
|
924
|
-
backgroundColor:
|
|
1011
|
+
backgroundColor: bg5.brandPrimary
|
|
925
1012
|
}
|
|
926
1013
|
},
|
|
927
1014
|
listbox: {
|
|
@@ -936,28 +1023,28 @@ function buildComponents(tokens) {
|
|
|
936
1023
|
},
|
|
937
1024
|
styleOverrides: {
|
|
938
1025
|
root: {
|
|
939
|
-
color:
|
|
940
|
-
borderRadius:
|
|
1026
|
+
color: border5.primary,
|
|
1027
|
+
borderRadius: radius5.xs,
|
|
941
1028
|
padding: 0,
|
|
942
1029
|
width: 20,
|
|
943
1030
|
height: 20,
|
|
944
1031
|
"&:hover": {
|
|
945
1032
|
backgroundColor: "transparent",
|
|
946
|
-
color:
|
|
1033
|
+
color: fg5.brandPrimary
|
|
947
1034
|
},
|
|
948
1035
|
"&.Mui-checked": {
|
|
949
|
-
color:
|
|
1036
|
+
color: fg5.brandPrimary
|
|
950
1037
|
},
|
|
951
1038
|
"&.Mui-checked:hover": {
|
|
952
|
-
color:
|
|
1039
|
+
color: colors5.brand[700]
|
|
953
1040
|
},
|
|
954
1041
|
"&.Mui-focusVisible": {
|
|
955
1042
|
outline: "none",
|
|
956
|
-
boxShadow:
|
|
957
|
-
borderRadius:
|
|
1043
|
+
boxShadow: focusRings5.brand,
|
|
1044
|
+
borderRadius: radius5.xs
|
|
958
1045
|
},
|
|
959
1046
|
"&.Mui-disabled": {
|
|
960
|
-
color:
|
|
1047
|
+
color: border5.primary
|
|
961
1048
|
}
|
|
962
1049
|
}
|
|
963
1050
|
}
|
|
@@ -969,25 +1056,25 @@ function buildComponents(tokens) {
|
|
|
969
1056
|
},
|
|
970
1057
|
styleOverrides: {
|
|
971
1058
|
root: {
|
|
972
|
-
color:
|
|
1059
|
+
color: border5.primary,
|
|
973
1060
|
padding: 0,
|
|
974
1061
|
"&:hover": {
|
|
975
1062
|
backgroundColor: "transparent",
|
|
976
|
-
color:
|
|
1063
|
+
color: fg5.brandPrimary
|
|
977
1064
|
},
|
|
978
1065
|
"&.Mui-checked": {
|
|
979
|
-
color:
|
|
1066
|
+
color: fg5.brandPrimary
|
|
980
1067
|
},
|
|
981
1068
|
"&.Mui-checked:hover": {
|
|
982
|
-
color:
|
|
1069
|
+
color: colors5.brand[700]
|
|
983
1070
|
},
|
|
984
1071
|
"&.Mui-focusVisible": {
|
|
985
1072
|
outline: "none",
|
|
986
|
-
boxShadow:
|
|
987
|
-
borderRadius:
|
|
1073
|
+
boxShadow: focusRings5.brand,
|
|
1074
|
+
borderRadius: radius5.full
|
|
988
1075
|
},
|
|
989
1076
|
"&.Mui-disabled": {
|
|
990
|
-
color:
|
|
1077
|
+
color: border5.primary
|
|
991
1078
|
}
|
|
992
1079
|
}
|
|
993
1080
|
}
|
|
@@ -1007,20 +1094,20 @@ function buildComponents(tokens) {
|
|
|
1007
1094
|
padding: 2,
|
|
1008
1095
|
"&.Mui-checked": {
|
|
1009
1096
|
transform: "translateX(20px)",
|
|
1010
|
-
color:
|
|
1097
|
+
color: fg5.white,
|
|
1011
1098
|
"& + .MuiSwitch-track": {
|
|
1012
|
-
backgroundColor:
|
|
1099
|
+
backgroundColor: fg5.brandPrimary,
|
|
1013
1100
|
opacity: 1
|
|
1014
1101
|
}
|
|
1015
1102
|
},
|
|
1016
1103
|
"&.Mui-checked:hover + .MuiSwitch-track": {
|
|
1017
|
-
backgroundColor:
|
|
1104
|
+
backgroundColor: colors5.brand[700]
|
|
1018
1105
|
},
|
|
1019
1106
|
"&.Mui-focusVisible .MuiSwitch-thumb": {
|
|
1020
|
-
boxShadow:
|
|
1107
|
+
boxShadow: focusRings5.brand
|
|
1021
1108
|
},
|
|
1022
1109
|
"&.Mui-disabled .MuiSwitch-thumb": {
|
|
1023
|
-
color:
|
|
1110
|
+
color: bg5.disabled
|
|
1024
1111
|
},
|
|
1025
1112
|
"&.Mui-disabled + .MuiSwitch-track": {
|
|
1026
1113
|
opacity: 0.5
|
|
@@ -1032,8 +1119,8 @@ function buildComponents(tokens) {
|
|
|
1032
1119
|
boxShadow: "0px 1px 2px 0px #1018280d"
|
|
1033
1120
|
},
|
|
1034
1121
|
track: {
|
|
1035
|
-
borderRadius:
|
|
1036
|
-
backgroundColor:
|
|
1122
|
+
borderRadius: radius5.full,
|
|
1123
|
+
backgroundColor: border5.secondary,
|
|
1037
1124
|
opacity: 1
|
|
1038
1125
|
}
|
|
1039
1126
|
}
|
|
@@ -1042,8 +1129,8 @@ function buildComponents(tokens) {
|
|
|
1042
1129
|
MuiToggleButton: {
|
|
1043
1130
|
styleOverrides: {
|
|
1044
1131
|
root: {
|
|
1045
|
-
borderColor:
|
|
1046
|
-
color:
|
|
1132
|
+
borderColor: border5.primary,
|
|
1133
|
+
color: text5.secondary,
|
|
1047
1134
|
fontSize: 14,
|
|
1048
1135
|
fontWeight: 600,
|
|
1049
1136
|
lineHeight: "20px",
|
|
@@ -1051,19 +1138,19 @@ function buildComponents(tokens) {
|
|
|
1051
1138
|
padding: "6px 12px",
|
|
1052
1139
|
textTransform: "none",
|
|
1053
1140
|
"&:hover": {
|
|
1054
|
-
backgroundColor:
|
|
1055
|
-
borderColor:
|
|
1141
|
+
backgroundColor: bg5.primaryHover,
|
|
1142
|
+
borderColor: border5.primary
|
|
1056
1143
|
},
|
|
1057
1144
|
"&.Mui-selected": {
|
|
1058
|
-
backgroundColor:
|
|
1059
|
-
color:
|
|
1060
|
-
borderColor:
|
|
1145
|
+
backgroundColor: bg5.brandPrimary,
|
|
1146
|
+
color: buttonColors5.secondaryColor.fg,
|
|
1147
|
+
borderColor: border5.brandSolid,
|
|
1061
1148
|
"&:hover": {
|
|
1062
|
-
backgroundColor:
|
|
1149
|
+
backgroundColor: bg5.brandSecondary
|
|
1063
1150
|
}
|
|
1064
1151
|
},
|
|
1065
1152
|
"&:focus-visible": {
|
|
1066
|
-
boxShadow:
|
|
1153
|
+
boxShadow: focusRings5.brandShadowXs
|
|
1067
1154
|
}
|
|
1068
1155
|
}
|
|
1069
1156
|
}
|
|
@@ -1071,7 +1158,7 @@ function buildComponents(tokens) {
|
|
|
1071
1158
|
MuiToggleButtonGroup: {
|
|
1072
1159
|
styleOverrides: {
|
|
1073
1160
|
root: {
|
|
1074
|
-
borderRadius:
|
|
1161
|
+
borderRadius: radius5.md,
|
|
1075
1162
|
overflow: "hidden"
|
|
1076
1163
|
},
|
|
1077
1164
|
grouped: {
|
|
@@ -1080,12 +1167,12 @@ function buildComponents(tokens) {
|
|
|
1080
1167
|
marginLeft: -1
|
|
1081
1168
|
},
|
|
1082
1169
|
"&:first-of-type": {
|
|
1083
|
-
borderTopLeftRadius:
|
|
1084
|
-
borderBottomLeftRadius:
|
|
1170
|
+
borderTopLeftRadius: radius5.md,
|
|
1171
|
+
borderBottomLeftRadius: radius5.md
|
|
1085
1172
|
},
|
|
1086
1173
|
"&:last-of-type": {
|
|
1087
|
-
borderTopRightRadius:
|
|
1088
|
-
borderBottomRightRadius:
|
|
1174
|
+
borderTopRightRadius: radius5.md,
|
|
1175
|
+
borderBottomRightRadius: radius5.md
|
|
1089
1176
|
}
|
|
1090
1177
|
}
|
|
1091
1178
|
}
|
|
@@ -1094,8 +1181,8 @@ function buildComponents(tokens) {
|
|
|
1094
1181
|
MuiDrawer: {
|
|
1095
1182
|
styleOverrides: {
|
|
1096
1183
|
paper: {
|
|
1097
|
-
backgroundColor:
|
|
1098
|
-
borderRight: `1px solid ${
|
|
1184
|
+
backgroundColor: bg5.primary,
|
|
1185
|
+
borderRight: `1px solid ${border5.secondary}`
|
|
1099
1186
|
}
|
|
1100
1187
|
}
|
|
1101
1188
|
},
|
|
@@ -1106,9 +1193,9 @@ function buildComponents(tokens) {
|
|
|
1106
1193
|
},
|
|
1107
1194
|
styleOverrides: {
|
|
1108
1195
|
root: {
|
|
1109
|
-
borderRadius:
|
|
1110
|
-
border: `1px solid ${
|
|
1111
|
-
backgroundColor:
|
|
1196
|
+
borderRadius: radius5.xl,
|
|
1197
|
+
border: `1px solid ${border5.secondary}`,
|
|
1198
|
+
backgroundColor: bg5.primary,
|
|
1112
1199
|
boxShadow: tokenShadows.xs,
|
|
1113
1200
|
overflow: "hidden"
|
|
1114
1201
|
}
|
|
@@ -1155,35 +1242,35 @@ function buildComponents(tokens) {
|
|
|
1155
1242
|
backgroundImage: "none"
|
|
1156
1243
|
},
|
|
1157
1244
|
rounded: {
|
|
1158
|
-
borderRadius:
|
|
1245
|
+
borderRadius: radius5.lg
|
|
1159
1246
|
},
|
|
1160
1247
|
elevation1: {
|
|
1161
1248
|
boxShadow: tokenShadows.xs,
|
|
1162
|
-
border: `1px solid ${
|
|
1249
|
+
border: `1px solid ${border5.secondary}`
|
|
1163
1250
|
},
|
|
1164
1251
|
elevation2: {
|
|
1165
1252
|
boxShadow: tokenShadows.sm,
|
|
1166
|
-
border: `1px solid ${
|
|
1253
|
+
border: `1px solid ${border5.secondary}`
|
|
1167
1254
|
},
|
|
1168
1255
|
elevation3: {
|
|
1169
1256
|
boxShadow: tokenShadows.md,
|
|
1170
|
-
border: `1px solid ${
|
|
1257
|
+
border: `1px solid ${border5.secondary}`
|
|
1171
1258
|
},
|
|
1172
1259
|
elevation4: {
|
|
1173
1260
|
boxShadow: tokenShadows.lg,
|
|
1174
|
-
border: `1px solid ${
|
|
1261
|
+
border: `1px solid ${border5.secondary}`
|
|
1175
1262
|
},
|
|
1176
1263
|
elevation8: {
|
|
1177
1264
|
boxShadow: tokenShadows.xl,
|
|
1178
|
-
border: `1px solid ${
|
|
1265
|
+
border: `1px solid ${border5.secondary}`
|
|
1179
1266
|
},
|
|
1180
1267
|
elevation16: {
|
|
1181
1268
|
boxShadow: tokenShadows["2xl"],
|
|
1182
|
-
border: `1px solid ${
|
|
1269
|
+
border: `1px solid ${border5.secondary}`
|
|
1183
1270
|
},
|
|
1184
1271
|
elevation24: {
|
|
1185
1272
|
boxShadow: tokenShadows["3xl"],
|
|
1186
|
-
border: `1px solid ${
|
|
1273
|
+
border: `1px solid ${border5.secondary}`
|
|
1187
1274
|
}
|
|
1188
1275
|
}
|
|
1189
1276
|
},
|
|
@@ -1195,8 +1282,8 @@ function buildComponents(tokens) {
|
|
|
1195
1282
|
},
|
|
1196
1283
|
styleOverrides: {
|
|
1197
1284
|
root: {
|
|
1198
|
-
border: `1px solid ${
|
|
1199
|
-
borderRadius:
|
|
1285
|
+
border: `1px solid ${border5.secondary}`,
|
|
1286
|
+
borderRadius: radius5.lg,
|
|
1200
1287
|
"&:not(:last-child)": {
|
|
1201
1288
|
marginBottom: 8
|
|
1202
1289
|
},
|
|
@@ -1206,7 +1293,7 @@ function buildComponents(tokens) {
|
|
|
1206
1293
|
"&.Mui-expanded": {
|
|
1207
1294
|
margin: 0,
|
|
1208
1295
|
marginBottom: 8,
|
|
1209
|
-
borderRadius:
|
|
1296
|
+
borderRadius: radius5.lg
|
|
1210
1297
|
}
|
|
1211
1298
|
}
|
|
1212
1299
|
}
|
|
@@ -1218,7 +1305,7 @@ function buildComponents(tokens) {
|
|
|
1218
1305
|
minHeight: 56,
|
|
1219
1306
|
"&.Mui-expanded": {
|
|
1220
1307
|
minHeight: 56,
|
|
1221
|
-
borderBottom: `1px solid ${
|
|
1308
|
+
borderBottom: `1px solid ${border5.secondary}`
|
|
1222
1309
|
}
|
|
1223
1310
|
},
|
|
1224
1311
|
content: {
|
|
@@ -1244,8 +1331,8 @@ function buildComponents(tokens) {
|
|
|
1244
1331
|
},
|
|
1245
1332
|
styleOverrides: {
|
|
1246
1333
|
root: {
|
|
1247
|
-
borderBottom: `1px solid ${
|
|
1248
|
-
backgroundColor:
|
|
1334
|
+
borderBottom: `1px solid ${border5.secondary}`,
|
|
1335
|
+
backgroundColor: bg5.primary
|
|
1249
1336
|
}
|
|
1250
1337
|
}
|
|
1251
1338
|
},
|
|
@@ -1269,7 +1356,7 @@ function buildComponents(tokens) {
|
|
|
1269
1356
|
MuiChip: {
|
|
1270
1357
|
styleOverrides: {
|
|
1271
1358
|
root: {
|
|
1272
|
-
borderRadius:
|
|
1359
|
+
borderRadius: radius5.md
|
|
1273
1360
|
},
|
|
1274
1361
|
label: {
|
|
1275
1362
|
fontWeight: 500
|
|
@@ -1285,51 +1372,51 @@ function buildComponents(tokens) {
|
|
|
1285
1372
|
},
|
|
1286
1373
|
colorDefault: {
|
|
1287
1374
|
"&.MuiChip-filled": {
|
|
1288
|
-
backgroundColor:
|
|
1289
|
-
color:
|
|
1290
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1375
|
+
backgroundColor: colors5.gray[50],
|
|
1376
|
+
color: colors5.gray[700],
|
|
1377
|
+
"& .MuiChip-deleteIcon": { color: colors5.gray[400] }
|
|
1291
1378
|
}
|
|
1292
1379
|
},
|
|
1293
1380
|
colorPrimary: {
|
|
1294
1381
|
"&.MuiChip-filled": {
|
|
1295
|
-
backgroundColor:
|
|
1296
|
-
color:
|
|
1297
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1382
|
+
backgroundColor: colors5.brand[50],
|
|
1383
|
+
color: colors5.brand[700],
|
|
1384
|
+
"& .MuiChip-deleteIcon": { color: colors5.brand[400] }
|
|
1298
1385
|
}
|
|
1299
1386
|
},
|
|
1300
1387
|
colorSecondary: {
|
|
1301
1388
|
"&.MuiChip-filled": {
|
|
1302
|
-
backgroundColor:
|
|
1303
|
-
color:
|
|
1304
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1389
|
+
backgroundColor: colors5.gray[50],
|
|
1390
|
+
color: colors5.gray[700],
|
|
1391
|
+
"& .MuiChip-deleteIcon": { color: colors5.gray[400] }
|
|
1305
1392
|
}
|
|
1306
1393
|
},
|
|
1307
1394
|
colorError: {
|
|
1308
1395
|
"&.MuiChip-filled": {
|
|
1309
|
-
backgroundColor:
|
|
1310
|
-
color:
|
|
1311
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1396
|
+
backgroundColor: colors5.error[50],
|
|
1397
|
+
color: colors5.error[700],
|
|
1398
|
+
"& .MuiChip-deleteIcon": { color: colors5.error[400] }
|
|
1312
1399
|
}
|
|
1313
1400
|
},
|
|
1314
1401
|
colorWarning: {
|
|
1315
1402
|
"&.MuiChip-filled": {
|
|
1316
|
-
backgroundColor:
|
|
1317
|
-
color:
|
|
1318
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1403
|
+
backgroundColor: colors5.warning[50],
|
|
1404
|
+
color: colors5.warning[700],
|
|
1405
|
+
"& .MuiChip-deleteIcon": { color: colors5.warning[400] }
|
|
1319
1406
|
}
|
|
1320
1407
|
},
|
|
1321
1408
|
colorSuccess: {
|
|
1322
1409
|
"&.MuiChip-filled": {
|
|
1323
|
-
backgroundColor:
|
|
1324
|
-
color:
|
|
1325
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1410
|
+
backgroundColor: colors5.success[50],
|
|
1411
|
+
color: colors5.success[700],
|
|
1412
|
+
"& .MuiChip-deleteIcon": { color: colors5.success[400] }
|
|
1326
1413
|
}
|
|
1327
1414
|
},
|
|
1328
1415
|
colorInfo: {
|
|
1329
1416
|
"&.MuiChip-filled": {
|
|
1330
|
-
backgroundColor:
|
|
1331
|
-
color:
|
|
1332
|
-
"& .MuiChip-deleteIcon": { color:
|
|
1417
|
+
backgroundColor: colors5.blue[50],
|
|
1418
|
+
color: colors5.blue[700],
|
|
1419
|
+
"& .MuiChip-deleteIcon": { color: colors5.blue[400] }
|
|
1333
1420
|
}
|
|
1334
1421
|
}
|
|
1335
1422
|
}
|
|
@@ -1345,7 +1432,7 @@ function buildComponents(tokens) {
|
|
|
1345
1432
|
fontSize: 14,
|
|
1346
1433
|
lineHeight: "20px",
|
|
1347
1434
|
fontWeight: 500,
|
|
1348
|
-
color:
|
|
1435
|
+
color: text5.secondary
|
|
1349
1436
|
}
|
|
1350
1437
|
}
|
|
1351
1438
|
},
|
|
@@ -1361,29 +1448,29 @@ function buildComponents(tokens) {
|
|
|
1361
1448
|
MuiTableCell: {
|
|
1362
1449
|
styleOverrides: {
|
|
1363
1450
|
root: {
|
|
1364
|
-
borderBottom: `1px solid ${
|
|
1451
|
+
borderBottom: `1px solid ${border5.secondary}`,
|
|
1365
1452
|
padding: "16px 24px",
|
|
1366
1453
|
fontSize: 14,
|
|
1367
1454
|
lineHeight: "20px",
|
|
1368
|
-
color:
|
|
1455
|
+
color: fg5.tertiary
|
|
1369
1456
|
},
|
|
1370
1457
|
head: {
|
|
1371
|
-
backgroundColor:
|
|
1372
|
-
color:
|
|
1458
|
+
backgroundColor: bg5.secondary,
|
|
1459
|
+
color: fg5.tertiary,
|
|
1373
1460
|
fontWeight: 500,
|
|
1374
1461
|
fontSize: 12,
|
|
1375
1462
|
lineHeight: "18px"
|
|
1376
1463
|
},
|
|
1377
1464
|
body: {
|
|
1378
|
-
color:
|
|
1465
|
+
color: fg5.tertiary
|
|
1379
1466
|
}
|
|
1380
1467
|
}
|
|
1381
1468
|
},
|
|
1382
1469
|
MuiTableHead: {
|
|
1383
1470
|
styleOverrides: {
|
|
1384
1471
|
root: {
|
|
1385
|
-
backgroundColor:
|
|
1386
|
-
borderBottom: `1px solid ${
|
|
1472
|
+
backgroundColor: bg5.secondary,
|
|
1473
|
+
borderBottom: `1px solid ${border5.secondary}`
|
|
1387
1474
|
}
|
|
1388
1475
|
}
|
|
1389
1476
|
},
|
|
@@ -1394,12 +1481,12 @@ function buildComponents(tokens) {
|
|
|
1394
1481
|
border: 0
|
|
1395
1482
|
},
|
|
1396
1483
|
"&:hover": {
|
|
1397
|
-
backgroundColor:
|
|
1484
|
+
backgroundColor: bg5.primaryHover
|
|
1398
1485
|
},
|
|
1399
1486
|
"&.Mui-selected": {
|
|
1400
|
-
backgroundColor:
|
|
1487
|
+
backgroundColor: bg5.brandPrimary,
|
|
1401
1488
|
"&:hover": {
|
|
1402
|
-
backgroundColor:
|
|
1489
|
+
backgroundColor: bg5.brandPrimary
|
|
1403
1490
|
}
|
|
1404
1491
|
}
|
|
1405
1492
|
}
|
|
@@ -1408,8 +1495,8 @@ function buildComponents(tokens) {
|
|
|
1408
1495
|
MuiTableContainer: {
|
|
1409
1496
|
styleOverrides: {
|
|
1410
1497
|
root: {
|
|
1411
|
-
borderRadius:
|
|
1412
|
-
border: `1px solid ${
|
|
1498
|
+
borderRadius: radius5.xl,
|
|
1499
|
+
border: `1px solid ${border5.secondary}`,
|
|
1413
1500
|
boxShadow: "none"
|
|
1414
1501
|
}
|
|
1415
1502
|
}
|
|
@@ -1423,24 +1510,24 @@ function buildComponents(tokens) {
|
|
|
1423
1510
|
lineHeight: "18px",
|
|
1424
1511
|
minWidth: 20,
|
|
1425
1512
|
height: 20,
|
|
1426
|
-
borderRadius:
|
|
1513
|
+
borderRadius: radius5.full
|
|
1427
1514
|
},
|
|
1428
1515
|
colorPrimary: {
|
|
1429
|
-
backgroundColor:
|
|
1516
|
+
backgroundColor: bg5.brandSolid
|
|
1430
1517
|
},
|
|
1431
1518
|
colorError: {
|
|
1432
|
-
backgroundColor:
|
|
1519
|
+
backgroundColor: bg5.errorSolid
|
|
1433
1520
|
},
|
|
1434
1521
|
colorSuccess: {
|
|
1435
|
-
backgroundColor:
|
|
1522
|
+
backgroundColor: bg5.successSolid
|
|
1436
1523
|
},
|
|
1437
1524
|
colorWarning: {
|
|
1438
|
-
backgroundColor:
|
|
1525
|
+
backgroundColor: bg5.warningSolid
|
|
1439
1526
|
},
|
|
1440
1527
|
dot: {
|
|
1441
1528
|
minWidth: 8,
|
|
1442
1529
|
height: 8,
|
|
1443
|
-
borderRadius:
|
|
1530
|
+
borderRadius: radius5.full
|
|
1444
1531
|
}
|
|
1445
1532
|
}
|
|
1446
1533
|
},
|
|
@@ -1448,7 +1535,7 @@ function buildComponents(tokens) {
|
|
|
1448
1535
|
MuiDivider: {
|
|
1449
1536
|
styleOverrides: {
|
|
1450
1537
|
root: {
|
|
1451
|
-
borderColor:
|
|
1538
|
+
borderColor: border5.secondary
|
|
1452
1539
|
}
|
|
1453
1540
|
}
|
|
1454
1541
|
},
|
|
@@ -1463,16 +1550,16 @@ function buildComponents(tokens) {
|
|
|
1463
1550
|
MuiListItemButton: {
|
|
1464
1551
|
styleOverrides: {
|
|
1465
1552
|
root: {
|
|
1466
|
-
borderRadius:
|
|
1553
|
+
borderRadius: radius5.sm,
|
|
1467
1554
|
padding: "8px 12px",
|
|
1468
1555
|
"&:hover": {
|
|
1469
|
-
backgroundColor:
|
|
1556
|
+
backgroundColor: bg5.primaryHover
|
|
1470
1557
|
},
|
|
1471
1558
|
"&.Mui-selected": {
|
|
1472
|
-
backgroundColor:
|
|
1473
|
-
color:
|
|
1559
|
+
backgroundColor: bg5.brandPrimary,
|
|
1560
|
+
color: buttonColors5.secondaryColor.fg,
|
|
1474
1561
|
"&:hover": {
|
|
1475
|
-
backgroundColor:
|
|
1562
|
+
backgroundColor: bg5.brandSecondary
|
|
1476
1563
|
}
|
|
1477
1564
|
}
|
|
1478
1565
|
}
|
|
@@ -1482,7 +1569,7 @@ function buildComponents(tokens) {
|
|
|
1482
1569
|
styleOverrides: {
|
|
1483
1570
|
root: {
|
|
1484
1571
|
minWidth: 36,
|
|
1485
|
-
color:
|
|
1572
|
+
color: fg5.quaternary
|
|
1486
1573
|
}
|
|
1487
1574
|
}
|
|
1488
1575
|
},
|
|
@@ -1492,12 +1579,12 @@ function buildComponents(tokens) {
|
|
|
1492
1579
|
fontSize: 14,
|
|
1493
1580
|
lineHeight: "20px",
|
|
1494
1581
|
fontWeight: 500,
|
|
1495
|
-
color:
|
|
1582
|
+
color: text5.secondary
|
|
1496
1583
|
},
|
|
1497
1584
|
secondary: {
|
|
1498
1585
|
fontSize: 14,
|
|
1499
1586
|
lineHeight: "20px",
|
|
1500
|
-
color:
|
|
1587
|
+
color: text5.quaternary
|
|
1501
1588
|
}
|
|
1502
1589
|
}
|
|
1503
1590
|
},
|
|
@@ -1505,17 +1592,17 @@ function buildComponents(tokens) {
|
|
|
1505
1592
|
MuiTooltip: {
|
|
1506
1593
|
styleOverrides: {
|
|
1507
1594
|
tooltip: {
|
|
1508
|
-
backgroundColor:
|
|
1509
|
-
color:
|
|
1595
|
+
backgroundColor: bg5.primarySolid,
|
|
1596
|
+
color: text5.white,
|
|
1510
1597
|
fontSize: 12,
|
|
1511
1598
|
lineHeight: "18px",
|
|
1512
1599
|
fontWeight: 600,
|
|
1513
1600
|
padding: "8px 12px",
|
|
1514
|
-
borderRadius:
|
|
1601
|
+
borderRadius: radius5.md,
|
|
1515
1602
|
boxShadow: tokenShadows.lg
|
|
1516
1603
|
},
|
|
1517
1604
|
arrow: {
|
|
1518
|
-
color:
|
|
1605
|
+
color: bg5.primarySolid
|
|
1519
1606
|
}
|
|
1520
1607
|
}
|
|
1521
1608
|
},
|
|
@@ -1526,42 +1613,42 @@ function buildComponents(tokens) {
|
|
|
1526
1613
|
},
|
|
1527
1614
|
styleOverrides: {
|
|
1528
1615
|
root: {
|
|
1529
|
-
borderRadius:
|
|
1616
|
+
borderRadius: radius5.xl,
|
|
1530
1617
|
fontSize: 14,
|
|
1531
1618
|
lineHeight: "20px",
|
|
1532
1619
|
padding: "12px 16px",
|
|
1533
1620
|
alignItems: "center"
|
|
1534
1621
|
},
|
|
1535
1622
|
standardError: {
|
|
1536
|
-
backgroundColor:
|
|
1537
|
-
color:
|
|
1538
|
-
border: `1px solid ${
|
|
1623
|
+
backgroundColor: bg5.errorPrimary,
|
|
1624
|
+
color: colors5.error[700],
|
|
1625
|
+
border: `1px solid ${border5.error}`,
|
|
1539
1626
|
"& .MuiAlert-icon": {
|
|
1540
|
-
color:
|
|
1627
|
+
color: fg5.errorPrimary
|
|
1541
1628
|
}
|
|
1542
1629
|
},
|
|
1543
1630
|
standardWarning: {
|
|
1544
|
-
backgroundColor:
|
|
1545
|
-
color:
|
|
1546
|
-
border: `1px solid ${
|
|
1631
|
+
backgroundColor: bg5.warningPrimary,
|
|
1632
|
+
color: colors5.warning[700],
|
|
1633
|
+
border: `1px solid ${colors5.warning[300]}`,
|
|
1547
1634
|
"& .MuiAlert-icon": {
|
|
1548
|
-
color:
|
|
1635
|
+
color: fg5.warningPrimary
|
|
1549
1636
|
}
|
|
1550
1637
|
},
|
|
1551
1638
|
standardSuccess: {
|
|
1552
|
-
backgroundColor:
|
|
1553
|
-
color:
|
|
1554
|
-
border: `1px solid ${
|
|
1639
|
+
backgroundColor: bg5.successPrimary,
|
|
1640
|
+
color: colors5.success[700],
|
|
1641
|
+
border: `1px solid ${colors5.success[300]}`,
|
|
1555
1642
|
"& .MuiAlert-icon": {
|
|
1556
|
-
color:
|
|
1643
|
+
color: fg5.successPrimary
|
|
1557
1644
|
}
|
|
1558
1645
|
},
|
|
1559
1646
|
standardInfo: {
|
|
1560
|
-
backgroundColor:
|
|
1561
|
-
color:
|
|
1562
|
-
border: `1px solid ${
|
|
1647
|
+
backgroundColor: colors5.blue[50],
|
|
1648
|
+
color: colors5.blue[700],
|
|
1649
|
+
border: `1px solid ${colors5.blue[300]}`,
|
|
1563
1650
|
"& .MuiAlert-icon": {
|
|
1564
|
-
color:
|
|
1651
|
+
color: colors5.blue[600]
|
|
1565
1652
|
}
|
|
1566
1653
|
},
|
|
1567
1654
|
icon: {
|
|
@@ -1592,7 +1679,7 @@ function buildComponents(tokens) {
|
|
|
1592
1679
|
MuiDialog: {
|
|
1593
1680
|
styleOverrides: {
|
|
1594
1681
|
paper: {
|
|
1595
|
-
borderRadius:
|
|
1682
|
+
borderRadius: radius5.xl,
|
|
1596
1683
|
boxShadow: tokenShadows.xl,
|
|
1597
1684
|
padding: 0
|
|
1598
1685
|
}
|
|
@@ -1604,7 +1691,7 @@ function buildComponents(tokens) {
|
|
|
1604
1691
|
fontSize: 18,
|
|
1605
1692
|
lineHeight: "28px",
|
|
1606
1693
|
fontWeight: 600,
|
|
1607
|
-
color:
|
|
1694
|
+
color: text5.primary,
|
|
1608
1695
|
padding: "24px 24px 0"
|
|
1609
1696
|
}
|
|
1610
1697
|
}
|
|
@@ -1615,7 +1702,7 @@ function buildComponents(tokens) {
|
|
|
1615
1702
|
padding: "20px 24px",
|
|
1616
1703
|
fontSize: 14,
|
|
1617
1704
|
lineHeight: "20px",
|
|
1618
|
-
color:
|
|
1705
|
+
color: text5.tertiary
|
|
1619
1706
|
}
|
|
1620
1707
|
}
|
|
1621
1708
|
},
|
|
@@ -1631,27 +1718,27 @@ function buildComponents(tokens) {
|
|
|
1631
1718
|
MuiLinearProgress: {
|
|
1632
1719
|
styleOverrides: {
|
|
1633
1720
|
root: {
|
|
1634
|
-
borderRadius:
|
|
1721
|
+
borderRadius: radius5.full,
|
|
1635
1722
|
height: 8,
|
|
1636
|
-
backgroundColor:
|
|
1723
|
+
backgroundColor: border5.secondary
|
|
1637
1724
|
},
|
|
1638
1725
|
barColorPrimary: {
|
|
1639
|
-
backgroundColor:
|
|
1640
|
-
borderRadius:
|
|
1726
|
+
backgroundColor: fg5.brandPrimary,
|
|
1727
|
+
borderRadius: radius5.full
|
|
1641
1728
|
},
|
|
1642
1729
|
barColorSecondary: {
|
|
1643
|
-
backgroundColor:
|
|
1644
|
-
borderRadius:
|
|
1730
|
+
backgroundColor: bg5.secondarySolid,
|
|
1731
|
+
borderRadius: radius5.full
|
|
1645
1732
|
}
|
|
1646
1733
|
}
|
|
1647
1734
|
},
|
|
1648
1735
|
MuiCircularProgress: {
|
|
1649
1736
|
styleOverrides: {
|
|
1650
1737
|
colorPrimary: {
|
|
1651
|
-
color:
|
|
1738
|
+
color: fg5.brandPrimary
|
|
1652
1739
|
},
|
|
1653
1740
|
colorSecondary: {
|
|
1654
|
-
color:
|
|
1741
|
+
color: bg5.secondarySolid
|
|
1655
1742
|
}
|
|
1656
1743
|
}
|
|
1657
1744
|
},
|
|
@@ -1662,13 +1749,13 @@ function buildComponents(tokens) {
|
|
|
1662
1749
|
},
|
|
1663
1750
|
styleOverrides: {
|
|
1664
1751
|
root: {
|
|
1665
|
-
backgroundColor:
|
|
1752
|
+
backgroundColor: bg5.tertiary
|
|
1666
1753
|
},
|
|
1667
1754
|
rounded: {
|
|
1668
|
-
borderRadius:
|
|
1755
|
+
borderRadius: radius5.md
|
|
1669
1756
|
},
|
|
1670
1757
|
circular: {
|
|
1671
|
-
borderRadius:
|
|
1758
|
+
borderRadius: radius5.full
|
|
1672
1759
|
}
|
|
1673
1760
|
}
|
|
1674
1761
|
},
|
|
@@ -1676,9 +1763,9 @@ function buildComponents(tokens) {
|
|
|
1676
1763
|
MuiSnackbarContent: {
|
|
1677
1764
|
styleOverrides: {
|
|
1678
1765
|
root: {
|
|
1679
|
-
backgroundColor:
|
|
1680
|
-
color:
|
|
1681
|
-
borderRadius:
|
|
1766
|
+
backgroundColor: bg5.primarySolid,
|
|
1767
|
+
color: text5.white,
|
|
1768
|
+
borderRadius: radius5.xl,
|
|
1682
1769
|
boxShadow: tokenShadows.lg,
|
|
1683
1770
|
fontSize: 14,
|
|
1684
1771
|
lineHeight: "20px",
|
|
@@ -1712,21 +1799,21 @@ function buildComponents(tokens) {
|
|
|
1712
1799
|
MuiDataGrid: {
|
|
1713
1800
|
styleOverrides: {
|
|
1714
1801
|
root: {
|
|
1715
|
-
border: `1px solid ${
|
|
1716
|
-
borderRadius:
|
|
1802
|
+
border: `1px solid ${border5.secondary}`,
|
|
1803
|
+
borderRadius: radius5.xl,
|
|
1717
1804
|
fontFamily: "inherit",
|
|
1718
1805
|
"& .MuiDataGrid-withBorderColor": {
|
|
1719
|
-
borderColor:
|
|
1806
|
+
borderColor: border5.secondary
|
|
1720
1807
|
}
|
|
1721
1808
|
},
|
|
1722
1809
|
columnHeaders: {
|
|
1723
|
-
backgroundColor:
|
|
1810
|
+
backgroundColor: bg5.secondary
|
|
1724
1811
|
},
|
|
1725
1812
|
columnHeader: {
|
|
1726
1813
|
fontSize: 12,
|
|
1727
1814
|
lineHeight: "18px",
|
|
1728
1815
|
fontWeight: 500,
|
|
1729
|
-
color:
|
|
1816
|
+
color: fg5.tertiary,
|
|
1730
1817
|
"&:focus, &:focus-within": {
|
|
1731
1818
|
outline: "none"
|
|
1732
1819
|
}
|
|
@@ -1737,27 +1824,27 @@ function buildComponents(tokens) {
|
|
|
1737
1824
|
cell: {
|
|
1738
1825
|
fontSize: 14,
|
|
1739
1826
|
lineHeight: "20px",
|
|
1740
|
-
color:
|
|
1827
|
+
color: fg5.tertiary,
|
|
1741
1828
|
"&:focus, &:focus-within": {
|
|
1742
1829
|
outline: "none"
|
|
1743
1830
|
}
|
|
1744
1831
|
},
|
|
1745
1832
|
row: {
|
|
1746
1833
|
"&:hover": {
|
|
1747
|
-
backgroundColor:
|
|
1834
|
+
backgroundColor: bg5.primaryHover
|
|
1748
1835
|
},
|
|
1749
1836
|
"&.Mui-selected": {
|
|
1750
|
-
backgroundColor:
|
|
1837
|
+
backgroundColor: bg5.brandPrimary,
|
|
1751
1838
|
"&:hover": {
|
|
1752
|
-
backgroundColor:
|
|
1839
|
+
backgroundColor: bg5.brandPrimary
|
|
1753
1840
|
}
|
|
1754
1841
|
}
|
|
1755
1842
|
},
|
|
1756
1843
|
footerContainer: {
|
|
1757
|
-
borderTop: `1px solid ${
|
|
1844
|
+
borderTop: `1px solid ${border5.secondary}`
|
|
1758
1845
|
},
|
|
1759
1846
|
columnSeparator: {
|
|
1760
|
-
color:
|
|
1847
|
+
color: border5.secondary
|
|
1761
1848
|
}
|
|
1762
1849
|
}
|
|
1763
1850
|
}
|
|
@@ -1775,65 +1862,7 @@ var components = buildComponents({
|
|
|
1775
1862
|
border,
|
|
1776
1863
|
buttonColors});
|
|
1777
1864
|
|
|
1778
|
-
// src/theme/
|
|
1779
|
-
function buildShadows(tokens) {
|
|
1780
|
-
const tokenShadows = tokens.shadows;
|
|
1781
|
-
return [
|
|
1782
|
-
"none",
|
|
1783
|
-
// 0
|
|
1784
|
-
tokenShadows.xs,
|
|
1785
|
-
// 1
|
|
1786
|
-
tokenShadows.sm,
|
|
1787
|
-
// 2
|
|
1788
|
-
tokenShadows.sm,
|
|
1789
|
-
// 3
|
|
1790
|
-
tokenShadows.md,
|
|
1791
|
-
// 4
|
|
1792
|
-
tokenShadows.md,
|
|
1793
|
-
// 5
|
|
1794
|
-
tokenShadows.md,
|
|
1795
|
-
// 6
|
|
1796
|
-
tokenShadows.lg,
|
|
1797
|
-
// 7
|
|
1798
|
-
tokenShadows.lg,
|
|
1799
|
-
// 8
|
|
1800
|
-
tokenShadows.lg,
|
|
1801
|
-
// 9
|
|
1802
|
-
tokenShadows.xl,
|
|
1803
|
-
// 10
|
|
1804
|
-
tokenShadows.xl,
|
|
1805
|
-
// 11
|
|
1806
|
-
tokenShadows.xl,
|
|
1807
|
-
// 12
|
|
1808
|
-
tokenShadows["2xl"],
|
|
1809
|
-
// 13
|
|
1810
|
-
tokenShadows["2xl"],
|
|
1811
|
-
// 14
|
|
1812
|
-
tokenShadows["2xl"],
|
|
1813
|
-
// 15
|
|
1814
|
-
tokenShadows["3xl"],
|
|
1815
|
-
// 16
|
|
1816
|
-
tokenShadows["3xl"],
|
|
1817
|
-
// 17
|
|
1818
|
-
tokenShadows["3xl"],
|
|
1819
|
-
// 18
|
|
1820
|
-
tokenShadows["3xl"],
|
|
1821
|
-
// 19
|
|
1822
|
-
tokenShadows["3xl"],
|
|
1823
|
-
// 20
|
|
1824
|
-
tokenShadows["3xl"],
|
|
1825
|
-
// 21
|
|
1826
|
-
tokenShadows["3xl"],
|
|
1827
|
-
// 22
|
|
1828
|
-
tokenShadows["3xl"],
|
|
1829
|
-
// 23
|
|
1830
|
-
tokenShadows["3xl"]
|
|
1831
|
-
// 24
|
|
1832
|
-
];
|
|
1833
|
-
}
|
|
1834
|
-
var shadows2 = buildShadows({
|
|
1835
|
-
shadows
|
|
1836
|
-
});
|
|
1865
|
+
// src/theme/buildTheme.ts
|
|
1837
1866
|
function buildThemeOptions(tokens) {
|
|
1838
1867
|
return {
|
|
1839
1868
|
palette: buildPalette(tokens),
|
|
@@ -1849,57 +1878,9 @@ function buildTheme(tokens) {
|
|
|
1849
1878
|
return styles.createTheme(buildThemeOptions(tokens));
|
|
1850
1879
|
}
|
|
1851
1880
|
|
|
1852
|
-
// src/theme/presets/forest.ts
|
|
1853
|
-
var forestPreset = {
|
|
1854
|
-
name: "forest",
|
|
1855
|
-
defaultVariant: "light",
|
|
1856
|
-
variants: {
|
|
1857
|
-
light: {
|
|
1858
|
-
tokens: {
|
|
1859
|
-
colors,
|
|
1860
|
-
spacing,
|
|
1861
|
-
radius,
|
|
1862
|
-
shadows,
|
|
1863
|
-
focusRings,
|
|
1864
|
-
fontFamily,
|
|
1865
|
-
fontSize,
|
|
1866
|
-
lineHeight,
|
|
1867
|
-
fontWeight,
|
|
1868
|
-
display,
|
|
1869
|
-
container,
|
|
1870
|
-
widths,
|
|
1871
|
-
text,
|
|
1872
|
-
bg,
|
|
1873
|
-
fg,
|
|
1874
|
-
border,
|
|
1875
|
-
buttonColors,
|
|
1876
|
-
avatarColors,
|
|
1877
|
-
breadcrumbColors,
|
|
1878
|
-
iconColors,
|
|
1879
|
-
navColors,
|
|
1880
|
-
sliderColors,
|
|
1881
|
-
toggleColors,
|
|
1882
|
-
chartColors,
|
|
1883
|
-
alpha
|
|
1884
|
-
}
|
|
1885
|
-
}
|
|
1886
|
-
}
|
|
1887
|
-
};
|
|
1888
|
-
|
|
1889
|
-
// src/theme/presets/alkemy-plus.ts
|
|
1890
|
-
var red = {
|
|
1891
|
-
50: "#fef2f2",
|
|
1892
|
-
200: "#fecaca",
|
|
1893
|
-
600: "#dc2626",
|
|
1894
|
-
700: "#b91c1c",
|
|
1895
|
-
800: "#991b1b",
|
|
1896
|
-
900: "#7f1d1d"};
|
|
1881
|
+
// src/theme/presets/forest-external.ts
|
|
1897
1882
|
var colors2 = {
|
|
1898
|
-
|
|
1899
|
-
white: "#ffffff",
|
|
1900
|
-
black: "#000000",
|
|
1901
|
-
transparent: "#ffffff00"
|
|
1902
|
-
},
|
|
1883
|
+
...colors,
|
|
1903
1884
|
/** Brand scale — black-based for primary actions */
|
|
1904
1885
|
brand: {
|
|
1905
1886
|
25: "#fafafa",
|
|
@@ -1929,36 +1910,7 @@ var colors2 = {
|
|
|
1929
1910
|
800: "#27272a",
|
|
1930
1911
|
900: "#18181b",
|
|
1931
1912
|
950: "#09090b"
|
|
1932
|
-
}
|
|
1933
|
-
/** Error — forest defaults (standard UX red) */
|
|
1934
|
-
error: colors.error,
|
|
1935
|
-
/** Warning — orange/yellow tones from Alkemy+ palette */
|
|
1936
|
-
warning: {
|
|
1937
|
-
25: "#fffcf5",
|
|
1938
|
-
50: "#fff7ed",
|
|
1939
|
-
100: "#ffedd5",
|
|
1940
|
-
200: "#fed7aa",
|
|
1941
|
-
300: "#fdba74",
|
|
1942
|
-
400: "#fb923c",
|
|
1943
|
-
500: "#f08828",
|
|
1944
|
-
600: "#ea580c",
|
|
1945
|
-
700: "#c2410c",
|
|
1946
|
-
800: "#9a3412",
|
|
1947
|
-
900: "#7c2d12",
|
|
1948
|
-
950: "#431407"
|
|
1949
|
-
},
|
|
1950
|
-
/** Success — forest defaults (standard UX green) */
|
|
1951
|
-
success: colors.success,
|
|
1952
|
-
/** Blue (info) — forest defaults (standard UX) */
|
|
1953
|
-
blue: colors.blue,
|
|
1954
|
-
teal: colors.teal,
|
|
1955
|
-
orange: colors.orange,
|
|
1956
|
-
purple: colors.purple,
|
|
1957
|
-
pink: colors.pink,
|
|
1958
|
-
fuchsia: colors.fuchsia,
|
|
1959
|
-
orangeDark: colors.orangeDark,
|
|
1960
|
-
green: colors.green,
|
|
1961
|
-
indigo: colors.indigo
|
|
1913
|
+
}
|
|
1962
1914
|
};
|
|
1963
1915
|
var radius2 = {
|
|
1964
1916
|
...radius,
|
|
@@ -1983,10 +1935,10 @@ var text2 = {
|
|
|
1983
1935
|
placeholder: colors2.gray[500],
|
|
1984
1936
|
placeholderSubtle: colors2.gray[300],
|
|
1985
1937
|
white: colors2.base.white,
|
|
1986
|
-
brandPrimary:
|
|
1987
|
-
brandSecondary:
|
|
1988
|
-
brandTertiary:
|
|
1989
|
-
brandTertiaryAlt:
|
|
1938
|
+
brandPrimary: colors2.brand[900],
|
|
1939
|
+
brandSecondary: colors2.brand[700],
|
|
1940
|
+
brandTertiary: colors2.brand[600],
|
|
1941
|
+
brandTertiaryAlt: colors2.brand[600],
|
|
1990
1942
|
primaryOnBrand: colors2.base.white,
|
|
1991
1943
|
secondaryOnBrand: colors2.brand[200],
|
|
1992
1944
|
tertiaryOnBrand: colors2.brand[200],
|
|
@@ -1998,22 +1950,22 @@ var text2 = {
|
|
|
1998
1950
|
var bg2 = {
|
|
1999
1951
|
primary: colors2.gray[50],
|
|
2000
1952
|
primaryAlt: colors2.gray[50],
|
|
2001
|
-
primaryHover: colors2.gray[
|
|
1953
|
+
primaryHover: colors2.gray[100],
|
|
2002
1954
|
primarySolid: colors2.gray[950],
|
|
2003
1955
|
secondary: colors2.base.white,
|
|
2004
1956
|
secondaryAlt: colors2.base.white,
|
|
2005
1957
|
secondarySubtle: colors2.gray[25],
|
|
2006
|
-
secondaryHover: colors2.gray[
|
|
1958
|
+
secondaryHover: colors2.gray[50],
|
|
2007
1959
|
secondarySolid: colors2.gray[600],
|
|
2008
1960
|
tertiary: colors2.gray[100],
|
|
2009
1961
|
quaternary: colors2.gray[200],
|
|
2010
|
-
active: colors2.gray[
|
|
1962
|
+
active: colors2.gray[200],
|
|
2011
1963
|
disabled: colors2.gray[100],
|
|
2012
1964
|
disabledSubtle: colors2.gray[50],
|
|
2013
1965
|
overlay: colors2.gray[950],
|
|
2014
|
-
brandPrimary: colors2.brand[
|
|
2015
|
-
brandPrimaryAlt: colors2.brand[
|
|
2016
|
-
brandSecondary: colors2.brand[
|
|
1966
|
+
brandPrimary: colors2.brand[50],
|
|
1967
|
+
brandPrimaryAlt: colors2.brand[50],
|
|
1968
|
+
brandSecondary: colors2.brand[100],
|
|
2017
1969
|
brandSolid: colors2.brand[600],
|
|
2018
1970
|
brandSolidHover: colors2.brand[700],
|
|
2019
1971
|
brandSection: colors2.brand[800],
|
|
@@ -2065,7 +2017,6 @@ var border2 = {
|
|
|
2065
2017
|
errorSolid: colors2.error[600]
|
|
2066
2018
|
};
|
|
2067
2019
|
var buttonColors2 = {
|
|
2068
|
-
/** Primary buttons — black */
|
|
2069
2020
|
primary: {
|
|
2070
2021
|
bg: colors2.brand[600],
|
|
2071
2022
|
bgHover: colors2.brand[700],
|
|
@@ -2082,7 +2033,6 @@ var buttonColors2 = {
|
|
|
2082
2033
|
border: colors2.gray[300],
|
|
2083
2034
|
borderHover: colors2.gray[300]
|
|
2084
2035
|
},
|
|
2085
|
-
/** Outlined accent buttons — dark */
|
|
2086
2036
|
secondaryColor: {
|
|
2087
2037
|
bg: colors2.base.white,
|
|
2088
2038
|
bgHover: colors2.brand[50],
|
|
@@ -2096,11 +2046,10 @@ var buttonColors2 = {
|
|
|
2096
2046
|
fgHover: colors2.gray[700],
|
|
2097
2047
|
bgHover: colors2.gray[50]
|
|
2098
2048
|
},
|
|
2099
|
-
/** Text accent buttons — red */
|
|
2100
2049
|
tertiaryColor: {
|
|
2101
|
-
fg:
|
|
2102
|
-
fgHover:
|
|
2103
|
-
bgHover:
|
|
2050
|
+
fg: colors2.brand[700],
|
|
2051
|
+
fgHover: colors2.brand[800],
|
|
2052
|
+
bgHover: colors2.brand[50]
|
|
2104
2053
|
},
|
|
2105
2054
|
primaryError: {
|
|
2106
2055
|
bg: colors2.error[600],
|
|
@@ -2129,22 +2078,23 @@ var avatarColors2 = {
|
|
|
2129
2078
|
contrastBorder: "#00000014",
|
|
2130
2079
|
profilePhotoBorder: colors2.base.white,
|
|
2131
2080
|
focusBorder: "#a0a0a624"
|
|
2081
|
+
// gray[400] + 14% alpha
|
|
2132
2082
|
};
|
|
2133
2083
|
var breadcrumbColors2 = {
|
|
2134
2084
|
fg: colors2.gray[600],
|
|
2135
2085
|
fgHover: colors2.gray[700],
|
|
2136
2086
|
bgHover: colors2.gray[50],
|
|
2137
|
-
brandBgHover:
|
|
2138
|
-
brandFgHover:
|
|
2087
|
+
brandBgHover: colors2.brand[50],
|
|
2088
|
+
brandFgHover: colors2.brand[700],
|
|
2139
2089
|
iconFg: colors2.gray[500],
|
|
2140
2090
|
iconFgHover: colors2.gray[700],
|
|
2141
|
-
brandIconFgHover:
|
|
2091
|
+
brandIconFgHover: colors2.brand[700]
|
|
2142
2092
|
};
|
|
2143
2093
|
var iconColors2 = {
|
|
2144
|
-
fgBrand:
|
|
2145
|
-
fgBrandOnBrand:
|
|
2094
|
+
fgBrand: colors2.brand[600],
|
|
2095
|
+
fgBrandOnBrand: colors2.brand[200],
|
|
2146
2096
|
featuredModernBorder: colors2.gray[200],
|
|
2147
|
-
featuredLightFgBrand:
|
|
2097
|
+
featuredLightFgBrand: colors2.brand[600],
|
|
2148
2098
|
featuredLightFgGray: colors2.gray[500],
|
|
2149
2099
|
featuredLightFgError: colors2.error[600],
|
|
2150
2100
|
featuredLightFgWarning: colors2.warning[600],
|
|
@@ -2157,19 +2107,19 @@ var iconColors2 = {
|
|
|
2157
2107
|
};
|
|
2158
2108
|
var navColors2 = {
|
|
2159
2109
|
itemIconFg: colors2.gray[500],
|
|
2160
|
-
itemIconFgActive: colors2.gray[
|
|
2110
|
+
itemIconFgActive: colors2.gray[700],
|
|
2161
2111
|
itemButtonIconFg: colors2.gray[500],
|
|
2162
2112
|
itemButtonIconFgActive: colors2.gray[700]
|
|
2163
2113
|
};
|
|
2164
2114
|
var sliderColors2 = {
|
|
2165
|
-
handleBorder:
|
|
2115
|
+
handleBorder: colors2.brand[600],
|
|
2166
2116
|
handleBg: colors2.base.white
|
|
2167
2117
|
};
|
|
2168
2118
|
var toggleColors2 = {
|
|
2169
2119
|
buttonFgDisabled: colors2.gray[50]
|
|
2170
2120
|
};
|
|
2171
2121
|
var chartColors2 = {
|
|
2172
|
-
axisFg: colors2.gray[
|
|
2122
|
+
axisFg: colors2.gray[100],
|
|
2173
2123
|
gridlineFg: colors2.gray[100],
|
|
2174
2124
|
labelFg: colors2.gray[600],
|
|
2175
2125
|
labelFgEmphasis: colors2.gray[700],
|
|
@@ -2179,60 +2129,33 @@ var chartColors2 = {
|
|
|
2179
2129
|
tooltipFg: colors2.base.white,
|
|
2180
2130
|
crosshairFg: colors2.gray[500],
|
|
2181
2131
|
legendFg: text2.tertiary,
|
|
2182
|
-
|
|
2183
|
-
|
|
2184
|
-
|
|
2185
|
-
|
|
2186
|
-
|
|
2187
|
-
|
|
2188
|
-
|
|
2189
|
-
|
|
2190
|
-
|
|
2191
|
-
|
|
2192
|
-
|
|
2193
|
-
|
|
2194
|
-
|
|
2195
|
-
]
|
|
2196
|
-
vibrant: [
|
|
2197
|
-
"#6B38FB",
|
|
2198
|
-
"#E85B22",
|
|
2199
|
-
"#4AABFF",
|
|
2200
|
-
"#E83B1A",
|
|
2201
|
-
"#E02088"
|
|
2202
|
-
],
|
|
2203
|
-
series6Fg: colors2.brand[400],
|
|
2204
|
-
series6FgHover: colors2.brand[500],
|
|
2205
|
-
series6Bg: colors2.brand[100],
|
|
2206
|
-
series6BgHover: colors2.brand[200],
|
|
2207
|
-
series7Fg: colors2.fuchsia[600],
|
|
2208
|
-
series7FgHover: colors2.fuchsia[700],
|
|
2209
|
-
series7Bg: colors2.fuchsia[100],
|
|
2210
|
-
series7BgHover: colors2.fuchsia[200],
|
|
2211
|
-
series8Fg: colors2.teal[600],
|
|
2212
|
-
series8FgHover: colors2.teal[700],
|
|
2213
|
-
series8Bg: colors2.teal[100],
|
|
2214
|
-
series8BgHover: colors2.teal[200],
|
|
2215
|
-
series9Fg: colors2.indigo[600],
|
|
2216
|
-
series9FgHover: colors2.indigo[700],
|
|
2217
|
-
series9Bg: colors2.indigo[100],
|
|
2218
|
-
series9BgHover: colors2.indigo[200],
|
|
2219
|
-
series10Fg: colors2.green[600],
|
|
2220
|
-
series10FgHover: colors2.green[700],
|
|
2221
|
-
series10Bg: colors2.green[100],
|
|
2222
|
-
series10BgHover: colors2.green[200]
|
|
2132
|
+
series: [
|
|
2133
|
+
{ fg: colors2.violet[500], fgHover: colors2.violet[600], bg: colors2.violet[100], bgHover: colors2.violet[200] },
|
|
2134
|
+
{ fg: colors2.orangeDark[400], fgHover: colors2.orangeDark[500], bg: colors2.orangeDark[100], bgHover: colors2.orangeDark[200] },
|
|
2135
|
+
{ fg: colors2.teal[300], fgHover: colors2.teal[400], bg: colors2.teal[50], bgHover: colors2.teal[100] },
|
|
2136
|
+
{ fg: colors2.warning[400], fgHover: colors2.warning[500], bg: colors2.warning[100], bgHover: colors2.warning[200] },
|
|
2137
|
+
{ fg: colors2.rose[400], fgHover: colors2.rose[500], bg: colors2.rose[100], bgHover: colors2.rose[200] },
|
|
2138
|
+
{ fg: colors2.blueLight[400], fgHover: colors2.blueLight[500], bg: colors2.blueLight[100], bgHover: colors2.blueLight[200] },
|
|
2139
|
+
{ fg: colors2.orange[300], fgHover: colors2.orange[400], bg: colors2.orange[100], bgHover: colors2.orange[200] },
|
|
2140
|
+
{ fg: colors2.cyan[600], fgHover: colors2.cyan[700], bg: colors2.cyan[100], bgHover: colors2.cyan[200] },
|
|
2141
|
+
{ fg: colors2.green[500], fgHover: colors2.green[600], bg: colors2.green[100], bgHover: colors2.green[200] },
|
|
2142
|
+
{ fg: colors2.pink[400], fgHover: colors2.pink[500], bg: colors2.pink[100], bgHover: colors2.pink[200] },
|
|
2143
|
+
{ fg: colors2.fuchsia[400], fgHover: colors2.fuchsia[500], bg: colors2.fuchsia[100], bgHover: colors2.fuchsia[200] },
|
|
2144
|
+
{ fg: colors2.teal[600], fgHover: colors2.teal[700], bg: colors2.teal[100], bgHover: colors2.teal[200] }
|
|
2145
|
+
]
|
|
2223
2146
|
};
|
|
2224
2147
|
var focusRings2 = {
|
|
2225
|
-
brand: "0px 0px 0px 4px #
|
|
2226
|
-
brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #
|
|
2227
|
-
brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #
|
|
2148
|
+
brand: "0px 0px 0px 4px #4040403d",
|
|
2149
|
+
brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #4040403d",
|
|
2150
|
+
brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #4040403d",
|
|
2228
2151
|
gray: "0px 0px 0px 4px #a0a0a624",
|
|
2229
2152
|
grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #a0a0a624",
|
|
2230
2153
|
grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #a0a0a624",
|
|
2231
2154
|
error: "0px 0px 0px 4px #f044383d",
|
|
2232
2155
|
errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
|
|
2233
2156
|
};
|
|
2234
|
-
var
|
|
2235
|
-
name: "
|
|
2157
|
+
var forestExternalPreset = {
|
|
2158
|
+
name: "forest-external",
|
|
2236
2159
|
defaultVariant: "light",
|
|
2237
2160
|
variants: {
|
|
2238
2161
|
light: {
|
|
@@ -2267,10 +2190,635 @@ var alkemyPlusPreset = {
|
|
|
2267
2190
|
}
|
|
2268
2191
|
};
|
|
2269
2192
|
|
|
2193
|
+
// src/theme/presets/forest-agency.ts
|
|
2194
|
+
var colors3 = {
|
|
2195
|
+
...colors,
|
|
2196
|
+
/** Brand scale — black-based for primary actions */
|
|
2197
|
+
brand: {
|
|
2198
|
+
25: "#fafafa",
|
|
2199
|
+
50: "#f5f5f5",
|
|
2200
|
+
100: "#ebebeb",
|
|
2201
|
+
200: "#d6d6d6",
|
|
2202
|
+
300: "#b0b0b0",
|
|
2203
|
+
400: "#737373",
|
|
2204
|
+
500: "#404040",
|
|
2205
|
+
600: "#1a1a1a",
|
|
2206
|
+
700: "#0d0d0d",
|
|
2207
|
+
800: "#050505",
|
|
2208
|
+
900: "#000000",
|
|
2209
|
+
950: "#000000"
|
|
2210
|
+
},
|
|
2211
|
+
/** Warm-neutral gray scale */
|
|
2212
|
+
gray: {
|
|
2213
|
+
25: "#fdfcfc",
|
|
2214
|
+
50: "#faf9f8",
|
|
2215
|
+
100: "#f5f3f1",
|
|
2216
|
+
200: "#e8e5e3",
|
|
2217
|
+
300: "#d8d8dc",
|
|
2218
|
+
400: "#a0a0a6",
|
|
2219
|
+
500: "#71717a",
|
|
2220
|
+
600: "#52525b",
|
|
2221
|
+
700: "#3f3f46",
|
|
2222
|
+
800: "#27272a",
|
|
2223
|
+
900: "#18181b",
|
|
2224
|
+
950: "#09090b"
|
|
2225
|
+
}
|
|
2226
|
+
};
|
|
2227
|
+
var radius3 = {
|
|
2228
|
+
...radius,
|
|
2229
|
+
xxs: 1,
|
|
2230
|
+
xs: 2,
|
|
2231
|
+
sm: 3,
|
|
2232
|
+
md: 4,
|
|
2233
|
+
lg: 5,
|
|
2234
|
+
xl: 6,
|
|
2235
|
+
"2xl": 8,
|
|
2236
|
+
"3xl": 10,
|
|
2237
|
+
"4xl": 12
|
|
2238
|
+
};
|
|
2239
|
+
var text3 = {
|
|
2240
|
+
primary: colors3.gray[900],
|
|
2241
|
+
secondary: colors3.gray[700],
|
|
2242
|
+
secondaryHover: colors3.gray[800],
|
|
2243
|
+
tertiary: colors3.gray[600],
|
|
2244
|
+
tertiaryHover: colors3.gray[700],
|
|
2245
|
+
quaternary: colors3.gray[500],
|
|
2246
|
+
disabled: colors3.gray[500],
|
|
2247
|
+
placeholder: colors3.gray[500],
|
|
2248
|
+
placeholderSubtle: colors3.gray[300],
|
|
2249
|
+
white: colors3.base.white,
|
|
2250
|
+
brandPrimary: colors3.brand[900],
|
|
2251
|
+
brandSecondary: colors3.brand[700],
|
|
2252
|
+
brandTertiary: colors3.brand[600],
|
|
2253
|
+
brandTertiaryAlt: colors3.brand[600],
|
|
2254
|
+
primaryOnBrand: colors3.base.white,
|
|
2255
|
+
secondaryOnBrand: colors3.brand[200],
|
|
2256
|
+
tertiaryOnBrand: colors3.brand[200],
|
|
2257
|
+
quaternaryOnBrand: colors3.brand[300],
|
|
2258
|
+
errorPrimary: colors3.error[600],
|
|
2259
|
+
warningPrimary: colors3.warning[600],
|
|
2260
|
+
successPrimary: colors3.success[600]
|
|
2261
|
+
};
|
|
2262
|
+
var bg3 = {
|
|
2263
|
+
primary: colors3.gray[50],
|
|
2264
|
+
primaryAlt: colors3.gray[50],
|
|
2265
|
+
primaryHover: colors3.gray[100],
|
|
2266
|
+
primarySolid: colors3.gray[950],
|
|
2267
|
+
secondary: colors3.base.white,
|
|
2268
|
+
secondaryAlt: colors3.base.white,
|
|
2269
|
+
secondarySubtle: colors3.gray[25],
|
|
2270
|
+
secondaryHover: colors3.gray[50],
|
|
2271
|
+
secondarySolid: colors3.gray[600],
|
|
2272
|
+
tertiary: colors3.gray[100],
|
|
2273
|
+
quaternary: colors3.gray[200],
|
|
2274
|
+
active: colors3.gray[200],
|
|
2275
|
+
disabled: colors3.gray[100],
|
|
2276
|
+
disabledSubtle: colors3.gray[50],
|
|
2277
|
+
overlay: colors3.gray[950],
|
|
2278
|
+
brandPrimary: colors3.brand[50],
|
|
2279
|
+
brandPrimaryAlt: colors3.brand[50],
|
|
2280
|
+
brandSecondary: colors3.brand[100],
|
|
2281
|
+
brandSolid: colors3.brand[600],
|
|
2282
|
+
brandSolidHover: colors3.brand[700],
|
|
2283
|
+
brandSection: colors3.brand[800],
|
|
2284
|
+
brandSectionSubtle: colors3.brand[700],
|
|
2285
|
+
errorPrimary: colors3.error[50],
|
|
2286
|
+
errorSecondary: colors3.error[100],
|
|
2287
|
+
errorSolid: colors3.error[600],
|
|
2288
|
+
warningPrimary: colors3.warning[50],
|
|
2289
|
+
warningSecondary: colors3.warning[100],
|
|
2290
|
+
warningSolid: colors3.warning[600],
|
|
2291
|
+
successPrimary: colors3.success[50],
|
|
2292
|
+
successSecondary: colors3.success[100],
|
|
2293
|
+
successSolid: colors3.success[600]
|
|
2294
|
+
};
|
|
2295
|
+
var fg3 = {
|
|
2296
|
+
primary: colors3.gray[900],
|
|
2297
|
+
secondary: colors3.gray[700],
|
|
2298
|
+
secondaryHover: colors3.gray[800],
|
|
2299
|
+
tertiary: colors3.gray[600],
|
|
2300
|
+
tertiaryHover: colors3.gray[700],
|
|
2301
|
+
quaternary: colors3.gray[500],
|
|
2302
|
+
quaternaryHover: colors3.gray[600],
|
|
2303
|
+
quinary: colors3.gray[400],
|
|
2304
|
+
quinaryHover: colors3.gray[500],
|
|
2305
|
+
senary: colors3.gray[300],
|
|
2306
|
+
white: colors3.base.white,
|
|
2307
|
+
disabled: colors3.gray[400],
|
|
2308
|
+
disabledSubtle: colors3.gray[300],
|
|
2309
|
+
brandPrimary: colors3.brand[600],
|
|
2310
|
+
brandPrimaryAlt: colors3.brand[600],
|
|
2311
|
+
brandSecondary: colors3.brand[500],
|
|
2312
|
+
errorPrimary: colors3.error[600],
|
|
2313
|
+
errorSecondary: colors3.error[500],
|
|
2314
|
+
warningPrimary: colors3.warning[600],
|
|
2315
|
+
warningSecondary: colors3.warning[500],
|
|
2316
|
+
successPrimary: colors3.success[600],
|
|
2317
|
+
successSecondary: colors3.success[500]
|
|
2318
|
+
};
|
|
2319
|
+
var border3 = {
|
|
2320
|
+
primary: colors3.gray[300],
|
|
2321
|
+
secondary: colors3.gray[200],
|
|
2322
|
+
tertiary: colors3.gray[100],
|
|
2323
|
+
disabled: colors3.gray[300],
|
|
2324
|
+
disabledSubtle: colors3.gray[200],
|
|
2325
|
+
brand: colors3.brand[300],
|
|
2326
|
+
brandSolid: colors3.brand[600],
|
|
2327
|
+
brandSolidAlt: colors3.brand[600],
|
|
2328
|
+
error: colors3.error[300],
|
|
2329
|
+
errorSolid: colors3.error[600]
|
|
2330
|
+
};
|
|
2331
|
+
var buttonColors3 = {
|
|
2332
|
+
primary: {
|
|
2333
|
+
bg: colors3.brand[600],
|
|
2334
|
+
bgHover: colors3.brand[700],
|
|
2335
|
+
fg: colors3.base.white,
|
|
2336
|
+
fgHover: colors3.base.white,
|
|
2337
|
+
border: colors3.brand[600],
|
|
2338
|
+
borderHover: colors3.brand[700]
|
|
2339
|
+
},
|
|
2340
|
+
secondary: {
|
|
2341
|
+
bg: colors3.base.white,
|
|
2342
|
+
bgHover: colors3.gray[50],
|
|
2343
|
+
fg: colors3.gray[700],
|
|
2344
|
+
fgHover: colors3.gray[800],
|
|
2345
|
+
border: colors3.gray[300],
|
|
2346
|
+
borderHover: colors3.gray[300]
|
|
2347
|
+
},
|
|
2348
|
+
secondaryColor: {
|
|
2349
|
+
bg: colors3.base.white,
|
|
2350
|
+
bgHover: colors3.brand[50],
|
|
2351
|
+
fg: colors3.brand[700],
|
|
2352
|
+
fgHover: colors3.brand[800],
|
|
2353
|
+
border: colors3.brand[300],
|
|
2354
|
+
borderHover: colors3.brand[300]
|
|
2355
|
+
},
|
|
2356
|
+
tertiary: {
|
|
2357
|
+
fg: colors3.gray[600],
|
|
2358
|
+
fgHover: colors3.gray[700],
|
|
2359
|
+
bgHover: colors3.gray[50]
|
|
2360
|
+
},
|
|
2361
|
+
tertiaryColor: {
|
|
2362
|
+
fg: colors3.brand[700],
|
|
2363
|
+
fgHover: colors3.brand[800],
|
|
2364
|
+
bgHover: colors3.brand[50]
|
|
2365
|
+
},
|
|
2366
|
+
primaryError: {
|
|
2367
|
+
bg: colors3.error[600],
|
|
2368
|
+
bgHover: colors3.error[700],
|
|
2369
|
+
fg: colors3.base.white,
|
|
2370
|
+
fgHover: colors3.base.white,
|
|
2371
|
+
border: colors3.error[600],
|
|
2372
|
+
borderHover: colors3.error[700]
|
|
2373
|
+
},
|
|
2374
|
+
secondaryError: {
|
|
2375
|
+
bg: colors3.base.white,
|
|
2376
|
+
bgHover: colors3.error[50],
|
|
2377
|
+
fg: colors3.error[700],
|
|
2378
|
+
fgHover: colors3.error[800],
|
|
2379
|
+
border: colors3.error[300],
|
|
2380
|
+
borderHover: colors3.error[300]
|
|
2381
|
+
},
|
|
2382
|
+
tertiaryError: {
|
|
2383
|
+
fg: colors3.error[700],
|
|
2384
|
+
fgHover: colors3.error[800],
|
|
2385
|
+
bgHover: colors3.error[50]
|
|
2386
|
+
}
|
|
2387
|
+
};
|
|
2388
|
+
var avatarColors3 = {
|
|
2389
|
+
bg: colors3.gray[100],
|
|
2390
|
+
contrastBorder: "#00000014",
|
|
2391
|
+
profilePhotoBorder: colors3.base.white,
|
|
2392
|
+
focusBorder: "#a0a0a624"
|
|
2393
|
+
// gray[400] + 14% alpha
|
|
2394
|
+
};
|
|
2395
|
+
var breadcrumbColors3 = {
|
|
2396
|
+
fg: colors3.gray[600],
|
|
2397
|
+
fgHover: colors3.gray[700],
|
|
2398
|
+
bgHover: colors3.gray[50],
|
|
2399
|
+
brandBgHover: colors3.brand[50],
|
|
2400
|
+
brandFgHover: colors3.brand[700],
|
|
2401
|
+
iconFg: colors3.gray[500],
|
|
2402
|
+
iconFgHover: colors3.gray[700],
|
|
2403
|
+
brandIconFgHover: colors3.brand[700]
|
|
2404
|
+
};
|
|
2405
|
+
var iconColors3 = {
|
|
2406
|
+
fgBrand: colors3.brand[600],
|
|
2407
|
+
fgBrandOnBrand: colors3.brand[200],
|
|
2408
|
+
featuredModernBorder: colors3.gray[200],
|
|
2409
|
+
featuredLightFgBrand: colors3.brand[600],
|
|
2410
|
+
featuredLightFgGray: colors3.gray[500],
|
|
2411
|
+
featuredLightFgError: colors3.error[600],
|
|
2412
|
+
featuredLightFgWarning: colors3.warning[600],
|
|
2413
|
+
featuredLightFgSuccess: colors3.success[600],
|
|
2414
|
+
featuredDarkFgBrand: colors3.base.white,
|
|
2415
|
+
featuredDarkFgGray: colors3.base.white,
|
|
2416
|
+
featuredDarkFgError: colors3.base.white,
|
|
2417
|
+
featuredDarkFgWarning: colors3.base.white,
|
|
2418
|
+
featuredDarkFgSuccess: colors3.base.white
|
|
2419
|
+
};
|
|
2420
|
+
var navColors3 = {
|
|
2421
|
+
itemIconFg: colors3.gray[500],
|
|
2422
|
+
itemIconFgActive: colors3.gray[700],
|
|
2423
|
+
itemButtonIconFg: colors3.gray[500],
|
|
2424
|
+
itemButtonIconFgActive: colors3.gray[700]
|
|
2425
|
+
};
|
|
2426
|
+
var sliderColors3 = {
|
|
2427
|
+
handleBorder: colors3.brand[600],
|
|
2428
|
+
handleBg: colors3.base.white
|
|
2429
|
+
};
|
|
2430
|
+
var toggleColors3 = {
|
|
2431
|
+
buttonFgDisabled: colors3.gray[50]
|
|
2432
|
+
};
|
|
2433
|
+
var chartColors3 = {
|
|
2434
|
+
axisFg: colors3.gray[100],
|
|
2435
|
+
gridlineFg: colors3.gray[100],
|
|
2436
|
+
labelFg: colors3.gray[600],
|
|
2437
|
+
labelFgEmphasis: colors3.gray[700],
|
|
2438
|
+
bg: colors3.base.white,
|
|
2439
|
+
bgAlt: colors3.gray[50],
|
|
2440
|
+
tooltipBg: colors3.gray[950],
|
|
2441
|
+
tooltipFg: colors3.base.white,
|
|
2442
|
+
crosshairFg: colors3.gray[500],
|
|
2443
|
+
legendFg: text3.tertiary,
|
|
2444
|
+
series: [
|
|
2445
|
+
{ fg: colors3.violet[500], fgHover: colors3.violet[600], bg: colors3.violet[100], bgHover: colors3.violet[200] },
|
|
2446
|
+
{ fg: colors3.orangeDark[400], fgHover: colors3.orangeDark[500], bg: colors3.orangeDark[100], bgHover: colors3.orangeDark[200] },
|
|
2447
|
+
{ fg: colors3.teal[300], fgHover: colors3.teal[400], bg: colors3.teal[50], bgHover: colors3.teal[100] },
|
|
2448
|
+
{ fg: colors3.warning[400], fgHover: colors3.warning[500], bg: colors3.warning[100], bgHover: colors3.warning[200] },
|
|
2449
|
+
{ fg: colors3.rose[400], fgHover: colors3.rose[500], bg: colors3.rose[100], bgHover: colors3.rose[200] },
|
|
2450
|
+
{ fg: colors3.blueLight[400], fgHover: colors3.blueLight[500], bg: colors3.blueLight[100], bgHover: colors3.blueLight[200] },
|
|
2451
|
+
{ fg: colors3.orange[300], fgHover: colors3.orange[400], bg: colors3.orange[100], bgHover: colors3.orange[200] },
|
|
2452
|
+
{ fg: colors3.cyan[600], fgHover: colors3.cyan[700], bg: colors3.cyan[100], bgHover: colors3.cyan[200] },
|
|
2453
|
+
{ fg: colors3.green[500], fgHover: colors3.green[600], bg: colors3.green[100], bgHover: colors3.green[200] },
|
|
2454
|
+
{ fg: colors3.pink[400], fgHover: colors3.pink[500], bg: colors3.pink[100], bgHover: colors3.pink[200] },
|
|
2455
|
+
{ fg: colors3.fuchsia[400], fgHover: colors3.fuchsia[500], bg: colors3.fuchsia[100], bgHover: colors3.fuchsia[200] },
|
|
2456
|
+
{ fg: colors3.teal[600], fgHover: colors3.teal[700], bg: colors3.teal[100], bgHover: colors3.teal[200] }
|
|
2457
|
+
]
|
|
2458
|
+
};
|
|
2459
|
+
var focusRings3 = {
|
|
2460
|
+
brand: "0px 0px 0px 4px #4040403d",
|
|
2461
|
+
brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #4040403d",
|
|
2462
|
+
brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #4040403d",
|
|
2463
|
+
gray: "0px 0px 0px 4px #a0a0a624",
|
|
2464
|
+
grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #a0a0a624",
|
|
2465
|
+
grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #a0a0a624",
|
|
2466
|
+
error: "0px 0px 0px 4px #f044383d",
|
|
2467
|
+
errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
|
|
2468
|
+
};
|
|
2469
|
+
var forestAgencyPreset = {
|
|
2470
|
+
name: "forest-agency",
|
|
2471
|
+
defaultVariant: "light",
|
|
2472
|
+
variants: {
|
|
2473
|
+
light: {
|
|
2474
|
+
tokens: {
|
|
2475
|
+
colors: colors3,
|
|
2476
|
+
spacing,
|
|
2477
|
+
radius: radius3,
|
|
2478
|
+
shadows,
|
|
2479
|
+
focusRings: focusRings3,
|
|
2480
|
+
fontFamily: '"Aeonik", sans-serif',
|
|
2481
|
+
fontSize,
|
|
2482
|
+
lineHeight,
|
|
2483
|
+
fontWeight,
|
|
2484
|
+
display,
|
|
2485
|
+
container,
|
|
2486
|
+
widths,
|
|
2487
|
+
text: text3,
|
|
2488
|
+
bg: bg3,
|
|
2489
|
+
fg: fg3,
|
|
2490
|
+
border: border3,
|
|
2491
|
+
buttonColors: buttonColors3,
|
|
2492
|
+
avatarColors: avatarColors3,
|
|
2493
|
+
breadcrumbColors: breadcrumbColors3,
|
|
2494
|
+
iconColors: iconColors3,
|
|
2495
|
+
navColors: navColors3,
|
|
2496
|
+
sliderColors: sliderColors3,
|
|
2497
|
+
toggleColors: toggleColors3,
|
|
2498
|
+
chartColors: chartColors3,
|
|
2499
|
+
alpha
|
|
2500
|
+
}
|
|
2501
|
+
}
|
|
2502
|
+
}
|
|
2503
|
+
};
|
|
2504
|
+
|
|
2505
|
+
// src/theme/presets/forest-internal.ts
|
|
2506
|
+
var colors4 = {
|
|
2507
|
+
...colors,
|
|
2508
|
+
/** Brand scale — black-based for primary actions */
|
|
2509
|
+
brand: {
|
|
2510
|
+
25: "#fafafa",
|
|
2511
|
+
50: "#f5f5f5",
|
|
2512
|
+
100: "#ebebeb",
|
|
2513
|
+
200: "#d6d6d6",
|
|
2514
|
+
300: "#b0b0b0",
|
|
2515
|
+
400: "#737373",
|
|
2516
|
+
500: "#404040",
|
|
2517
|
+
600: "#1a1a1a",
|
|
2518
|
+
700: "#0d0d0d",
|
|
2519
|
+
800: "#050505",
|
|
2520
|
+
900: "#000000",
|
|
2521
|
+
950: "#000000"
|
|
2522
|
+
},
|
|
2523
|
+
/** Warm-neutral gray scale */
|
|
2524
|
+
gray: {
|
|
2525
|
+
25: "#fdfcfc",
|
|
2526
|
+
50: "#faf9f8",
|
|
2527
|
+
100: "#f5f3f1",
|
|
2528
|
+
200: "#e8e5e3",
|
|
2529
|
+
300: "#d8d8dc",
|
|
2530
|
+
400: "#a0a0a6",
|
|
2531
|
+
500: "#71717a",
|
|
2532
|
+
600: "#52525b",
|
|
2533
|
+
700: "#3f3f46",
|
|
2534
|
+
800: "#27272a",
|
|
2535
|
+
900: "#18181b",
|
|
2536
|
+
950: "#09090b"
|
|
2537
|
+
}
|
|
2538
|
+
};
|
|
2539
|
+
var radius4 = {
|
|
2540
|
+
...radius,
|
|
2541
|
+
xxs: 1,
|
|
2542
|
+
xs: 2,
|
|
2543
|
+
sm: 3,
|
|
2544
|
+
md: 4,
|
|
2545
|
+
lg: 5,
|
|
2546
|
+
xl: 6,
|
|
2547
|
+
"2xl": 8,
|
|
2548
|
+
"3xl": 10,
|
|
2549
|
+
"4xl": 12
|
|
2550
|
+
};
|
|
2551
|
+
var text4 = {
|
|
2552
|
+
primary: colors4.gray[900],
|
|
2553
|
+
secondary: colors4.gray[700],
|
|
2554
|
+
secondaryHover: colors4.gray[800],
|
|
2555
|
+
tertiary: colors4.gray[600],
|
|
2556
|
+
tertiaryHover: colors4.gray[700],
|
|
2557
|
+
quaternary: colors4.gray[500],
|
|
2558
|
+
disabled: colors4.gray[500],
|
|
2559
|
+
placeholder: colors4.gray[500],
|
|
2560
|
+
placeholderSubtle: colors4.gray[300],
|
|
2561
|
+
white: colors4.base.white,
|
|
2562
|
+
brandPrimary: colors4.brand[900],
|
|
2563
|
+
brandSecondary: colors4.brand[700],
|
|
2564
|
+
brandTertiary: colors4.brand[600],
|
|
2565
|
+
brandTertiaryAlt: colors4.brand[600],
|
|
2566
|
+
primaryOnBrand: colors4.base.white,
|
|
2567
|
+
secondaryOnBrand: colors4.brand[200],
|
|
2568
|
+
tertiaryOnBrand: colors4.brand[200],
|
|
2569
|
+
quaternaryOnBrand: colors4.brand[300],
|
|
2570
|
+
errorPrimary: colors4.error[600],
|
|
2571
|
+
warningPrimary: colors4.warning[600],
|
|
2572
|
+
successPrimary: colors4.success[600]
|
|
2573
|
+
};
|
|
2574
|
+
var bg4 = {
|
|
2575
|
+
primary: colors4.gray[50],
|
|
2576
|
+
primaryAlt: colors4.gray[50],
|
|
2577
|
+
primaryHover: colors4.gray[100],
|
|
2578
|
+
primarySolid: colors4.gray[950],
|
|
2579
|
+
secondary: colors4.base.white,
|
|
2580
|
+
secondaryAlt: colors4.base.white,
|
|
2581
|
+
secondarySubtle: colors4.gray[25],
|
|
2582
|
+
secondaryHover: colors4.gray[50],
|
|
2583
|
+
secondarySolid: colors4.gray[600],
|
|
2584
|
+
tertiary: colors4.gray[100],
|
|
2585
|
+
quaternary: colors4.gray[200],
|
|
2586
|
+
active: colors4.gray[200],
|
|
2587
|
+
disabled: colors4.gray[100],
|
|
2588
|
+
disabledSubtle: colors4.gray[50],
|
|
2589
|
+
overlay: colors4.gray[950],
|
|
2590
|
+
brandPrimary: colors4.brand[50],
|
|
2591
|
+
brandPrimaryAlt: colors4.brand[50],
|
|
2592
|
+
brandSecondary: colors4.brand[100],
|
|
2593
|
+
brandSolid: colors4.brand[600],
|
|
2594
|
+
brandSolidHover: colors4.brand[700],
|
|
2595
|
+
brandSection: colors4.brand[800],
|
|
2596
|
+
brandSectionSubtle: colors4.brand[700],
|
|
2597
|
+
errorPrimary: colors4.error[50],
|
|
2598
|
+
errorSecondary: colors4.error[100],
|
|
2599
|
+
errorSolid: colors4.error[600],
|
|
2600
|
+
warningPrimary: colors4.warning[50],
|
|
2601
|
+
warningSecondary: colors4.warning[100],
|
|
2602
|
+
warningSolid: colors4.warning[600],
|
|
2603
|
+
successPrimary: colors4.success[50],
|
|
2604
|
+
successSecondary: colors4.success[100],
|
|
2605
|
+
successSolid: colors4.success[600]
|
|
2606
|
+
};
|
|
2607
|
+
var fg4 = {
|
|
2608
|
+
primary: colors4.gray[900],
|
|
2609
|
+
secondary: colors4.gray[700],
|
|
2610
|
+
secondaryHover: colors4.gray[800],
|
|
2611
|
+
tertiary: colors4.gray[600],
|
|
2612
|
+
tertiaryHover: colors4.gray[700],
|
|
2613
|
+
quaternary: colors4.gray[500],
|
|
2614
|
+
quaternaryHover: colors4.gray[600],
|
|
2615
|
+
quinary: colors4.gray[400],
|
|
2616
|
+
quinaryHover: colors4.gray[500],
|
|
2617
|
+
senary: colors4.gray[300],
|
|
2618
|
+
white: colors4.base.white,
|
|
2619
|
+
disabled: colors4.gray[400],
|
|
2620
|
+
disabledSubtle: colors4.gray[300],
|
|
2621
|
+
brandPrimary: colors4.brand[600],
|
|
2622
|
+
brandPrimaryAlt: colors4.brand[600],
|
|
2623
|
+
brandSecondary: colors4.brand[500],
|
|
2624
|
+
errorPrimary: colors4.error[600],
|
|
2625
|
+
errorSecondary: colors4.error[500],
|
|
2626
|
+
warningPrimary: colors4.warning[600],
|
|
2627
|
+
warningSecondary: colors4.warning[500],
|
|
2628
|
+
successPrimary: colors4.success[600],
|
|
2629
|
+
successSecondary: colors4.success[500]
|
|
2630
|
+
};
|
|
2631
|
+
var border4 = {
|
|
2632
|
+
primary: colors4.gray[300],
|
|
2633
|
+
secondary: colors4.gray[200],
|
|
2634
|
+
tertiary: colors4.gray[100],
|
|
2635
|
+
disabled: colors4.gray[300],
|
|
2636
|
+
disabledSubtle: colors4.gray[200],
|
|
2637
|
+
brand: colors4.brand[300],
|
|
2638
|
+
brandSolid: colors4.brand[600],
|
|
2639
|
+
brandSolidAlt: colors4.brand[600],
|
|
2640
|
+
error: colors4.error[300],
|
|
2641
|
+
errorSolid: colors4.error[600]
|
|
2642
|
+
};
|
|
2643
|
+
var buttonColors4 = {
|
|
2644
|
+
primary: {
|
|
2645
|
+
bg: colors4.brand[600],
|
|
2646
|
+
bgHover: colors4.brand[700],
|
|
2647
|
+
fg: colors4.base.white,
|
|
2648
|
+
fgHover: colors4.base.white,
|
|
2649
|
+
border: colors4.brand[600],
|
|
2650
|
+
borderHover: colors4.brand[700]
|
|
2651
|
+
},
|
|
2652
|
+
secondary: {
|
|
2653
|
+
bg: colors4.base.white,
|
|
2654
|
+
bgHover: colors4.gray[50],
|
|
2655
|
+
fg: colors4.gray[700],
|
|
2656
|
+
fgHover: colors4.gray[800],
|
|
2657
|
+
border: colors4.gray[300],
|
|
2658
|
+
borderHover: colors4.gray[300]
|
|
2659
|
+
},
|
|
2660
|
+
secondaryColor: {
|
|
2661
|
+
bg: colors4.base.white,
|
|
2662
|
+
bgHover: colors4.brand[50],
|
|
2663
|
+
fg: colors4.brand[700],
|
|
2664
|
+
fgHover: colors4.brand[800],
|
|
2665
|
+
border: colors4.brand[300],
|
|
2666
|
+
borderHover: colors4.brand[300]
|
|
2667
|
+
},
|
|
2668
|
+
tertiary: {
|
|
2669
|
+
fg: colors4.gray[600],
|
|
2670
|
+
fgHover: colors4.gray[700],
|
|
2671
|
+
bgHover: colors4.gray[50]
|
|
2672
|
+
},
|
|
2673
|
+
tertiaryColor: {
|
|
2674
|
+
fg: colors4.brand[700],
|
|
2675
|
+
fgHover: colors4.brand[800],
|
|
2676
|
+
bgHover: colors4.brand[50]
|
|
2677
|
+
},
|
|
2678
|
+
primaryError: {
|
|
2679
|
+
bg: colors4.error[600],
|
|
2680
|
+
bgHover: colors4.error[700],
|
|
2681
|
+
fg: colors4.base.white,
|
|
2682
|
+
fgHover: colors4.base.white,
|
|
2683
|
+
border: colors4.error[600],
|
|
2684
|
+
borderHover: colors4.error[700]
|
|
2685
|
+
},
|
|
2686
|
+
secondaryError: {
|
|
2687
|
+
bg: colors4.base.white,
|
|
2688
|
+
bgHover: colors4.error[50],
|
|
2689
|
+
fg: colors4.error[700],
|
|
2690
|
+
fgHover: colors4.error[800],
|
|
2691
|
+
border: colors4.error[300],
|
|
2692
|
+
borderHover: colors4.error[300]
|
|
2693
|
+
},
|
|
2694
|
+
tertiaryError: {
|
|
2695
|
+
fg: colors4.error[700],
|
|
2696
|
+
fgHover: colors4.error[800],
|
|
2697
|
+
bgHover: colors4.error[50]
|
|
2698
|
+
}
|
|
2699
|
+
};
|
|
2700
|
+
var avatarColors4 = {
|
|
2701
|
+
bg: colors4.gray[100],
|
|
2702
|
+
contrastBorder: "#00000014",
|
|
2703
|
+
profilePhotoBorder: colors4.base.white,
|
|
2704
|
+
focusBorder: "#a0a0a624"
|
|
2705
|
+
// gray[400] + 14% alpha
|
|
2706
|
+
};
|
|
2707
|
+
var breadcrumbColors4 = {
|
|
2708
|
+
fg: colors4.gray[600],
|
|
2709
|
+
fgHover: colors4.gray[700],
|
|
2710
|
+
bgHover: colors4.gray[50],
|
|
2711
|
+
brandBgHover: colors4.brand[50],
|
|
2712
|
+
brandFgHover: colors4.brand[700],
|
|
2713
|
+
iconFg: colors4.gray[500],
|
|
2714
|
+
iconFgHover: colors4.gray[700],
|
|
2715
|
+
brandIconFgHover: colors4.brand[700]
|
|
2716
|
+
};
|
|
2717
|
+
var iconColors4 = {
|
|
2718
|
+
fgBrand: colors4.brand[600],
|
|
2719
|
+
fgBrandOnBrand: colors4.brand[200],
|
|
2720
|
+
featuredModernBorder: colors4.gray[200],
|
|
2721
|
+
featuredLightFgBrand: colors4.brand[600],
|
|
2722
|
+
featuredLightFgGray: colors4.gray[500],
|
|
2723
|
+
featuredLightFgError: colors4.error[600],
|
|
2724
|
+
featuredLightFgWarning: colors4.warning[600],
|
|
2725
|
+
featuredLightFgSuccess: colors4.success[600],
|
|
2726
|
+
featuredDarkFgBrand: colors4.base.white,
|
|
2727
|
+
featuredDarkFgGray: colors4.base.white,
|
|
2728
|
+
featuredDarkFgError: colors4.base.white,
|
|
2729
|
+
featuredDarkFgWarning: colors4.base.white,
|
|
2730
|
+
featuredDarkFgSuccess: colors4.base.white
|
|
2731
|
+
};
|
|
2732
|
+
var navColors4 = {
|
|
2733
|
+
itemIconFg: colors4.gray[500],
|
|
2734
|
+
itemIconFgActive: colors4.gray[700],
|
|
2735
|
+
itemButtonIconFg: colors4.gray[500],
|
|
2736
|
+
itemButtonIconFgActive: colors4.gray[700]
|
|
2737
|
+
};
|
|
2738
|
+
var sliderColors4 = {
|
|
2739
|
+
handleBorder: colors4.brand[600],
|
|
2740
|
+
handleBg: colors4.base.white
|
|
2741
|
+
};
|
|
2742
|
+
var toggleColors4 = {
|
|
2743
|
+
buttonFgDisabled: colors4.gray[50]
|
|
2744
|
+
};
|
|
2745
|
+
var chartColors4 = {
|
|
2746
|
+
axisFg: colors4.gray[100],
|
|
2747
|
+
gridlineFg: colors4.gray[100],
|
|
2748
|
+
labelFg: colors4.gray[600],
|
|
2749
|
+
labelFgEmphasis: colors4.gray[700],
|
|
2750
|
+
bg: colors4.base.white,
|
|
2751
|
+
bgAlt: colors4.gray[50],
|
|
2752
|
+
tooltipBg: colors4.gray[950],
|
|
2753
|
+
tooltipFg: colors4.base.white,
|
|
2754
|
+
crosshairFg: colors4.gray[500],
|
|
2755
|
+
legendFg: text4.tertiary,
|
|
2756
|
+
series: [
|
|
2757
|
+
{ fg: colors4.violet[500], fgHover: colors4.violet[600], bg: colors4.violet[100], bgHover: colors4.violet[200] },
|
|
2758
|
+
{ fg: colors4.orangeDark[400], fgHover: colors4.orangeDark[500], bg: colors4.orangeDark[100], bgHover: colors4.orangeDark[200] },
|
|
2759
|
+
{ fg: colors4.teal[300], fgHover: colors4.teal[400], bg: colors4.teal[50], bgHover: colors4.teal[100] },
|
|
2760
|
+
{ fg: colors4.warning[400], fgHover: colors4.warning[500], bg: colors4.warning[100], bgHover: colors4.warning[200] },
|
|
2761
|
+
{ fg: colors4.rose[400], fgHover: colors4.rose[500], bg: colors4.rose[100], bgHover: colors4.rose[200] },
|
|
2762
|
+
{ fg: colors4.blueLight[400], fgHover: colors4.blueLight[500], bg: colors4.blueLight[100], bgHover: colors4.blueLight[200] },
|
|
2763
|
+
{ fg: colors4.orange[300], fgHover: colors4.orange[400], bg: colors4.orange[100], bgHover: colors4.orange[200] },
|
|
2764
|
+
{ fg: colors4.cyan[600], fgHover: colors4.cyan[700], bg: colors4.cyan[100], bgHover: colors4.cyan[200] },
|
|
2765
|
+
{ fg: colors4.green[500], fgHover: colors4.green[600], bg: colors4.green[100], bgHover: colors4.green[200] },
|
|
2766
|
+
{ fg: colors4.pink[400], fgHover: colors4.pink[500], bg: colors4.pink[100], bgHover: colors4.pink[200] },
|
|
2767
|
+
{ fg: colors4.fuchsia[400], fgHover: colors4.fuchsia[500], bg: colors4.fuchsia[100], bgHover: colors4.fuchsia[200] },
|
|
2768
|
+
{ fg: colors4.teal[600], fgHover: colors4.teal[700], bg: colors4.teal[100], bgHover: colors4.teal[200] }
|
|
2769
|
+
]
|
|
2770
|
+
};
|
|
2771
|
+
var focusRings4 = {
|
|
2772
|
+
brand: "0px 0px 0px 4px #4040403d",
|
|
2773
|
+
brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #4040403d",
|
|
2774
|
+
brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #4040403d",
|
|
2775
|
+
gray: "0px 0px 0px 4px #a0a0a624",
|
|
2776
|
+
grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #a0a0a624",
|
|
2777
|
+
grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #a0a0a624",
|
|
2778
|
+
error: "0px 0px 0px 4px #f044383d",
|
|
2779
|
+
errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
|
|
2780
|
+
};
|
|
2781
|
+
var forestInternalPreset = {
|
|
2782
|
+
name: "forest-internal",
|
|
2783
|
+
defaultVariant: "light",
|
|
2784
|
+
variants: {
|
|
2785
|
+
light: {
|
|
2786
|
+
tokens: {
|
|
2787
|
+
colors: colors4,
|
|
2788
|
+
spacing,
|
|
2789
|
+
radius: radius4,
|
|
2790
|
+
shadows,
|
|
2791
|
+
focusRings: focusRings4,
|
|
2792
|
+
fontFamily: '"Aeonik", sans-serif',
|
|
2793
|
+
fontSize,
|
|
2794
|
+
lineHeight,
|
|
2795
|
+
fontWeight,
|
|
2796
|
+
display,
|
|
2797
|
+
container,
|
|
2798
|
+
widths,
|
|
2799
|
+
text: text4,
|
|
2800
|
+
bg: bg4,
|
|
2801
|
+
fg: fg4,
|
|
2802
|
+
border: border4,
|
|
2803
|
+
buttonColors: buttonColors4,
|
|
2804
|
+
avatarColors: avatarColors4,
|
|
2805
|
+
breadcrumbColors: breadcrumbColors4,
|
|
2806
|
+
iconColors: iconColors4,
|
|
2807
|
+
navColors: navColors4,
|
|
2808
|
+
sliderColors: sliderColors4,
|
|
2809
|
+
toggleColors: toggleColors4,
|
|
2810
|
+
chartColors: chartColors4,
|
|
2811
|
+
alpha
|
|
2812
|
+
}
|
|
2813
|
+
}
|
|
2814
|
+
}
|
|
2815
|
+
};
|
|
2816
|
+
|
|
2270
2817
|
// src/theme/presets/index.ts
|
|
2271
2818
|
var presetRegistry = /* @__PURE__ */ new Map();
|
|
2272
|
-
presetRegistry.set(
|
|
2273
|
-
presetRegistry.set(
|
|
2819
|
+
presetRegistry.set(forestExternalPreset.name, forestExternalPreset);
|
|
2820
|
+
presetRegistry.set(forestAgencyPreset.name, forestAgencyPreset);
|
|
2821
|
+
presetRegistry.set(forestInternalPreset.name, forestInternalPreset);
|
|
2274
2822
|
function getPreset(name) {
|
|
2275
2823
|
return presetRegistry.get(name);
|
|
2276
2824
|
}
|
|
@@ -2282,18 +2830,10 @@ function getAvailablePresets() {
|
|
|
2282
2830
|
}
|
|
2283
2831
|
|
|
2284
2832
|
// src/theme/index.ts
|
|
2285
|
-
var
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
components,
|
|
2289
|
-
shadows: shadows2,
|
|
2290
|
-
shape: {
|
|
2291
|
-
borderRadius: 8
|
|
2292
|
-
}
|
|
2293
|
-
};
|
|
2294
|
-
var forestTheme = styles.createTheme(forestThemeOptions);
|
|
2833
|
+
var agencyTokens = forestAgencyPreset.variants.light.tokens;
|
|
2834
|
+
var forestTheme = buildTheme(agencyTokens);
|
|
2835
|
+
var forestThemeOptions = buildThemeOptions(agencyTokens);
|
|
2295
2836
|
|
|
2296
|
-
exports.alkemyPlusPreset = alkemyPlusPreset;
|
|
2297
2837
|
exports.alpha = alpha;
|
|
2298
2838
|
exports.avatarColors = avatarColors;
|
|
2299
2839
|
exports.bg = bg;
|
|
@@ -2312,7 +2852,9 @@ exports.focusRings = focusRings;
|
|
|
2312
2852
|
exports.fontFamily = fontFamily;
|
|
2313
2853
|
exports.fontSize = fontSize;
|
|
2314
2854
|
exports.fontWeight = fontWeight;
|
|
2315
|
-
exports.
|
|
2855
|
+
exports.forestAgencyPreset = forestAgencyPreset;
|
|
2856
|
+
exports.forestExternalPreset = forestExternalPreset;
|
|
2857
|
+
exports.forestInternalPreset = forestInternalPreset;
|
|
2316
2858
|
exports.forestTheme = forestTheme;
|
|
2317
2859
|
exports.forestThemeOptions = forestThemeOptions;
|
|
2318
2860
|
exports.getAvailablePresets = getAvailablePresets;
|