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