@matteoaliano/forest-ui 0.2.11 → 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/dist/index.js CHANGED
@@ -21,6 +21,7 @@ var MuiTextField = require('@mui/material/TextField');
21
21
  var InputAdornment = require('@mui/material/InputAdornment');
22
22
  var IconButton = require('@mui/material/IconButton');
23
23
  var utils = require('@mui/material/utils');
24
+ var material = require('@mui/material');
24
25
  var MuiToggleButton = require('@mui/material/ToggleButton');
25
26
  var MuiToggleButtonGroup = require('@mui/material/ToggleButtonGroup');
26
27
  var DatePicker$1 = require('@mui/x-date-pickers/DatePicker');
@@ -81,9 +82,8 @@ var MuiStepLabel = require('@mui/material/StepLabel');
81
82
  var MuiTabs = require('@mui/material/Tabs');
82
83
  var MuiTab = require('@mui/material/Tab');
83
84
  var MuiDrawer = require('@mui/material/Drawer');
84
- var Box = require('@mui/material/Box');
85
+ var Box2 = require('@mui/material/Box');
85
86
  var LineChart$1 = require('@mui/x-charts/LineChart');
86
- var material = require('@mui/material');
87
87
  var BarChart$1 = require('@mui/x-charts/BarChart');
88
88
  var PieChart$1 = require('@mui/x-charts/PieChart');
89
89
 
@@ -163,7 +163,7 @@ var MuiStepLabel__default = /*#__PURE__*/_interopDefault(MuiStepLabel);
163
163
  var MuiTabs__default = /*#__PURE__*/_interopDefault(MuiTabs);
164
164
  var MuiTab__default = /*#__PURE__*/_interopDefault(MuiTab);
165
165
  var MuiDrawer__default = /*#__PURE__*/_interopDefault(MuiDrawer);
166
- var Box__default = /*#__PURE__*/_interopDefault(Box);
166
+ var Box2__default = /*#__PURE__*/_interopDefault(Box2);
167
167
 
168
168
  // src/provider/ForestProvider.tsx
169
169
 
@@ -692,65 +692,65 @@ var alpha = {
692
692
  // src/theme/palette.ts
693
693
  function buildPalette(tokens) {
694
694
  var _a;
695
- const { colors: colors3, text: text3, bg: bg3, fg: fg3, border: border3 } = tokens;
695
+ const { colors: colors5, text: text5, bg: bg5, fg: fg5, border: border5 } = tokens;
696
696
  return {
697
697
  primary: {
698
- main: colors3.brand[600],
699
- light: colors3.brand[400],
700
- dark: colors3.brand[700],
701
- contrastText: colors3.base.white
698
+ main: colors5.brand[600],
699
+ light: colors5.brand[400],
700
+ dark: colors5.brand[700],
701
+ contrastText: colors5.base.white
702
702
  },
703
703
  secondary: {
704
- main: colors3.gray[600],
705
- light: colors3.gray[400],
706
- dark: colors3.gray[700],
707
- contrastText: colors3.base.white
704
+ main: colors5.gray[600],
705
+ light: colors5.gray[400],
706
+ dark: colors5.gray[700],
707
+ contrastText: colors5.base.white
708
708
  },
709
709
  error: {
710
- main: colors3.error[600],
711
- light: colors3.error[300],
712
- dark: colors3.error[700],
713
- contrastText: colors3.base.white
710
+ main: colors5.error[600],
711
+ light: colors5.error[300],
712
+ dark: colors5.error[700],
713
+ contrastText: colors5.base.white
714
714
  },
715
715
  warning: {
716
- main: colors3.warning[600],
717
- light: colors3.warning[300],
718
- dark: colors3.warning[700],
719
- contrastText: colors3.base.white
716
+ main: colors5.warning[600],
717
+ light: colors5.warning[300],
718
+ dark: colors5.warning[700],
719
+ contrastText: colors5.base.white
720
720
  },
721
721
  success: {
722
- main: colors3.success[600],
723
- light: colors3.success[300],
724
- dark: colors3.success[700],
725
- contrastText: colors3.base.white
722
+ main: colors5.success[600],
723
+ light: colors5.success[300],
724
+ dark: colors5.success[700],
725
+ contrastText: colors5.base.white
726
726
  },
727
727
  info: {
728
- main: colors3.blue[600],
729
- light: colors3.blue[300],
730
- dark: colors3.blue[700],
731
- contrastText: colors3.base.white
728
+ main: colors5.blue[600],
729
+ light: colors5.blue[300],
730
+ dark: colors5.blue[700],
731
+ contrastText: colors5.base.white
732
732
  },
733
733
  background: {
734
- default: bg3.primary,
735
- paper: bg3.secondary
734
+ default: bg5.primary,
735
+ paper: bg5.secondary
736
736
  },
737
737
  text: {
738
- primary: text3.primary,
739
- secondary: text3.secondary,
740
- disabled: text3.disabled
738
+ primary: text5.primary,
739
+ secondary: text5.secondary,
740
+ disabled: text5.disabled
741
741
  },
742
- divider: border3.secondary,
742
+ divider: border5.secondary,
743
743
  action: {
744
- active: fg3.tertiary,
745
- hover: bg3.primaryHover,
746
- selected: bg3.brandPrimary,
747
- disabled: fg3.disabled,
748
- disabledBackground: bg3.disabled
744
+ active: fg5.tertiary,
745
+ hover: bg5.primaryHover,
746
+ selected: bg5.brandPrimary,
747
+ disabled: fg5.disabled,
748
+ disabledBackground: bg5.disabled
749
749
  },
750
750
  chart: (_a = tokens.chartColors) != null ? _a : chartColors
751
751
  };
752
752
  }
753
- var palette = buildPalette({
753
+ buildPalette({
754
754
  colors,
755
755
  text,
756
756
  bg,
@@ -841,7 +841,7 @@ function buildTypography(tokens) {
841
841
  }
842
842
  };
843
843
  }
844
- var typography = buildTypography({
844
+ buildTypography({
845
845
  fontFamily,
846
846
  display,
847
847
  fontSize,
@@ -849,18 +849,78 @@ var typography = buildTypography({
849
849
  fontWeight
850
850
  });
851
851
 
852
+ // src/theme/shadows.ts
853
+ function buildShadows(tokens) {
854
+ const tokenShadows = tokens.shadows;
855
+ return [
856
+ "none",
857
+ // 0
858
+ tokenShadows.xs,
859
+ // 1
860
+ tokenShadows.sm,
861
+ // 2
862
+ tokenShadows.sm,
863
+ // 3
864
+ tokenShadows.md,
865
+ // 4
866
+ tokenShadows.md,
867
+ // 5
868
+ tokenShadows.md,
869
+ // 6
870
+ tokenShadows.lg,
871
+ // 7
872
+ tokenShadows.lg,
873
+ // 8
874
+ tokenShadows.lg,
875
+ // 9
876
+ tokenShadows.xl,
877
+ // 10
878
+ tokenShadows.xl,
879
+ // 11
880
+ tokenShadows.xl,
881
+ // 12
882
+ tokenShadows["2xl"],
883
+ // 13
884
+ tokenShadows["2xl"],
885
+ // 14
886
+ tokenShadows["2xl"],
887
+ // 15
888
+ tokenShadows["3xl"],
889
+ // 16
890
+ tokenShadows["3xl"],
891
+ // 17
892
+ tokenShadows["3xl"],
893
+ // 18
894
+ tokenShadows["3xl"],
895
+ // 19
896
+ tokenShadows["3xl"],
897
+ // 20
898
+ tokenShadows["3xl"],
899
+ // 21
900
+ tokenShadows["3xl"],
901
+ // 22
902
+ tokenShadows["3xl"],
903
+ // 23
904
+ tokenShadows["3xl"]
905
+ // 24
906
+ ];
907
+ }
908
+ buildShadows({
909
+ shadows
910
+ });
911
+
852
912
  // src/theme/components.ts
853
913
  function buildComponents(tokens) {
854
914
  const {
855
- colors: colors3,
856
- radius: radius3,
857
- focusRings: focusRings3,
915
+ colors: colors5,
916
+ radius: radius5,
917
+ focusRings: focusRings5,
858
918
  shadows: tokenShadows,
859
- text: text3,
860
- bg: bg3,
861
- fg: fg3,
862
- border: border3,
863
- buttonColors: buttonColors3
919
+ text: text5,
920
+ bg: bg5,
921
+ fg: fg5,
922
+ border: border5,
923
+ buttonColors: buttonColors5
864
924
  } = tokens;
865
925
  return {
866
926
  // ─── Button ─────────────────────────────────────────────────────
@@ -870,7 +930,7 @@ function buildComponents(tokens) {
870
930
  },
871
931
  styleOverrides: {
872
932
  root: {
873
- borderRadius: radius3.md,
933
+ borderRadius: radius5.md,
874
934
  fontWeight: 600,
875
935
  boxShadow: tokenShadows.xs,
876
936
  height: 32,
@@ -878,36 +938,36 @@ function buildComponents(tokens) {
878
938
  fontSize: 14,
879
939
  lineHeight: "20px",
880
940
  "&:focus-visible": {
881
- boxShadow: focusRings3.brandShadowXs
941
+ boxShadow: focusRings5.brandShadowXs
882
942
  }
883
943
  },
884
944
  containedPrimary: {
885
- backgroundColor: buttonColors3.primary.bg,
945
+ backgroundColor: buttonColors5.primary.bg,
886
946
  "&:hover": {
887
- backgroundColor: buttonColors3.primary.bgHover
947
+ backgroundColor: buttonColors5.primary.bgHover
888
948
  }
889
949
  },
890
950
  outlinedPrimary: {
891
- borderColor: buttonColors3.secondaryColor.border,
892
- color: buttonColors3.secondaryColor.fg,
951
+ borderColor: buttonColors5.secondaryColor.border,
952
+ color: buttonColors5.secondaryColor.fg,
893
953
  "&:hover": {
894
- backgroundColor: buttonColors3.secondaryColor.bgHover,
895
- borderColor: buttonColors3.secondaryColor.borderHover
954
+ backgroundColor: buttonColors5.secondaryColor.bgHover,
955
+ borderColor: buttonColors5.secondaryColor.borderHover
896
956
  }
897
957
  },
898
958
  outlinedSecondary: {
899
- borderColor: buttonColors3.secondary.border,
959
+ borderColor: buttonColors5.secondary.border,
900
960
  "&:hover": {
901
- borderColor: buttonColors3.secondary.borderHover
961
+ borderColor: buttonColors5.secondary.borderHover
902
962
  }
903
963
  },
904
964
  text: {
905
965
  boxShadow: "none"
906
966
  },
907
967
  textPrimary: {
908
- color: buttonColors3.tertiaryColor.fg,
968
+ color: buttonColors5.tertiaryColor.fg,
909
969
  "&:hover": {
910
- backgroundColor: buttonColors3.tertiaryColor.bgHover
970
+ backgroundColor: buttonColors5.tertiaryColor.bgHover
911
971
  }
912
972
  }
913
973
  }
@@ -919,11 +979,11 @@ function buildComponents(tokens) {
919
979
  },
920
980
  styleOverrides: {
921
981
  root: {
922
- borderRadius: radius3.md
982
+ borderRadius: radius5.md
923
983
  },
924
984
  grouped: {
925
985
  "&:not(:last-of-type)": {
926
- borderRight: `1px solid ${buttonColors3.primary.borderHover}`
986
+ borderRight: `1px solid ${buttonColors5.primary.borderHover}`
927
987
  }
928
988
  }
929
989
  }
@@ -937,13 +997,13 @@ function buildComponents(tokens) {
937
997
  boxShadow: tokenShadows.lg
938
998
  },
939
999
  "&:focus-visible": {
940
- boxShadow: focusRings3.brandShadowSm
1000
+ boxShadow: focusRings5.brandShadowSm
941
1001
  }
942
1002
  },
943
1003
  primary: {
944
- backgroundColor: buttonColors3.primary.bg,
1004
+ backgroundColor: buttonColors5.primary.bg,
945
1005
  "&:hover": {
946
- backgroundColor: buttonColors3.primary.bgHover
1006
+ backgroundColor: buttonColors5.primary.bgHover
947
1007
  }
948
1008
  }
949
1009
  }
@@ -958,8 +1018,8 @@ function buildComponents(tokens) {
958
1018
  styleOverrides: {
959
1019
  input: {
960
1020
  "&::placeholder": {
961
- color: text3.placeholder,
962
- WebkitTextFillColor: text3.placeholder,
1021
+ color: text5.placeholder,
1022
+ WebkitTextFillColor: text5.placeholder,
963
1023
  fontWeight: 400,
964
1024
  opacity: 1
965
1025
  }
@@ -969,26 +1029,26 @@ function buildComponents(tokens) {
969
1029
  MuiOutlinedInput: {
970
1030
  styleOverrides: {
971
1031
  root: {
972
- borderRadius: radius3.md,
1032
+ borderRadius: radius5.md,
973
1033
  boxShadow: tokenShadows.xs,
974
1034
  "&:hover .MuiOutlinedInput-notchedOutline": {
975
- borderColor: border3.brand
1035
+ borderColor: border5.brand
976
1036
  },
977
1037
  "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
978
- borderColor: border3.brandSolid,
1038
+ borderColor: border5.brandSolid,
979
1039
  borderWidth: 1,
980
1040
  boxShadow: "none"
981
1041
  },
982
1042
  "&.Mui-error .MuiOutlinedInput-notchedOutline": {
983
- borderColor: border3.error
1043
+ borderColor: border5.error
984
1044
  },
985
1045
  "&.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline": {
986
- borderColor: border3.errorSolid,
1046
+ borderColor: border5.errorSolid,
987
1047
  boxShadow: "none"
988
1048
  }
989
1049
  },
990
1050
  notchedOutline: {
991
- borderColor: border3.primary
1051
+ borderColor: border5.primary
992
1052
  },
993
1053
  input: {
994
1054
  padding: "6px 12px",
@@ -1000,12 +1060,12 @@ function buildComponents(tokens) {
1000
1060
  MuiFormLabel: {
1001
1061
  styleOverrides: {
1002
1062
  root: {
1003
- color: text3.placeholder,
1063
+ color: text5.placeholder,
1004
1064
  "&.Mui-focused": {
1005
- color: text3.placeholder
1065
+ color: text5.placeholder
1006
1066
  },
1007
1067
  "&.Mui-error": {
1008
- color: text3.errorPrimary
1068
+ color: text5.errorPrimary
1009
1069
  }
1010
1070
  }
1011
1071
  }
@@ -1015,12 +1075,12 @@ function buildComponents(tokens) {
1015
1075
  root: {
1016
1076
  fontSize: 14,
1017
1077
  fontWeight: 500,
1018
- color: text3.placeholder,
1078
+ color: text5.placeholder,
1019
1079
  "&.Mui-focused": {
1020
- color: text3.placeholder
1080
+ color: text5.placeholder
1021
1081
  },
1022
1082
  "&.Mui-error": {
1023
- color: text3.errorPrimary
1083
+ color: text5.errorPrimary
1024
1084
  }
1025
1085
  },
1026
1086
  outlined: {
@@ -1039,7 +1099,7 @@ function buildComponents(tokens) {
1039
1099
  marginTop: 6,
1040
1100
  marginLeft: 0,
1041
1101
  "&.Mui-error": {
1042
- color: text3.errorPrimary
1102
+ color: text5.errorPrimary
1043
1103
  }
1044
1104
  }
1045
1105
  }
@@ -1069,18 +1129,18 @@ function buildComponents(tokens) {
1069
1129
  }
1070
1130
  },
1071
1131
  icon: {
1072
- color: text3.placeholder
1132
+ color: text5.placeholder
1073
1133
  }
1074
1134
  }
1075
1135
  },
1076
1136
  MuiMenuItem: {
1077
1137
  styleOverrides: {
1078
1138
  root: {
1079
- borderRadius: radius3.md,
1139
+ borderRadius: radius5.md,
1080
1140
  padding: "6px 8px",
1081
1141
  gap: 4,
1082
1142
  "&:hover": {
1083
- backgroundColor: bg3.primaryHover
1143
+ backgroundColor: bg5.primaryHover
1084
1144
  }
1085
1145
  }
1086
1146
  }
@@ -1089,9 +1149,9 @@ function buildComponents(tokens) {
1089
1149
  MuiAutocomplete: {
1090
1150
  styleOverrides: {
1091
1151
  paper: {
1092
- borderRadius: radius3.md,
1152
+ borderRadius: radius5.md,
1093
1153
  boxShadow: tokenShadows.lg,
1094
- border: `1px solid ${border3.secondary}`,
1154
+ border: `1px solid ${border5.secondary}`,
1095
1155
  marginTop: 4
1096
1156
  },
1097
1157
  inputRoot: {
@@ -1108,10 +1168,10 @@ function buildComponents(tokens) {
1108
1168
  lineHeight: "20px",
1109
1169
  padding: "6px 12px",
1110
1170
  "&.Mui-focused": {
1111
- backgroundColor: bg3.primaryHover
1171
+ backgroundColor: bg5.primaryHover
1112
1172
  },
1113
1173
  '&[aria-selected="true"]': {
1114
- backgroundColor: bg3.brandPrimary
1174
+ backgroundColor: bg5.brandPrimary
1115
1175
  }
1116
1176
  },
1117
1177
  listbox: {
@@ -1126,28 +1186,28 @@ function buildComponents(tokens) {
1126
1186
  },
1127
1187
  styleOverrides: {
1128
1188
  root: {
1129
- color: border3.primary,
1130
- borderRadius: radius3.xs,
1189
+ color: border5.primary,
1190
+ borderRadius: radius5.xs,
1131
1191
  padding: 0,
1132
1192
  width: 20,
1133
1193
  height: 20,
1134
1194
  "&:hover": {
1135
1195
  backgroundColor: "transparent",
1136
- color: fg3.brandPrimary
1196
+ color: fg5.brandPrimary
1137
1197
  },
1138
1198
  "&.Mui-checked": {
1139
- color: fg3.brandPrimary
1199
+ color: fg5.brandPrimary
1140
1200
  },
1141
1201
  "&.Mui-checked:hover": {
1142
- color: colors3.brand[700]
1202
+ color: colors5.brand[700]
1143
1203
  },
1144
1204
  "&.Mui-focusVisible": {
1145
1205
  outline: "none",
1146
- boxShadow: focusRings3.brand,
1147
- borderRadius: radius3.xs
1206
+ boxShadow: focusRings5.brand,
1207
+ borderRadius: radius5.xs
1148
1208
  },
1149
1209
  "&.Mui-disabled": {
1150
- color: border3.primary
1210
+ color: border5.primary
1151
1211
  }
1152
1212
  }
1153
1213
  }
@@ -1159,25 +1219,25 @@ function buildComponents(tokens) {
1159
1219
  },
1160
1220
  styleOverrides: {
1161
1221
  root: {
1162
- color: border3.primary,
1222
+ color: border5.primary,
1163
1223
  padding: 0,
1164
1224
  "&:hover": {
1165
1225
  backgroundColor: "transparent",
1166
- color: fg3.brandPrimary
1226
+ color: fg5.brandPrimary
1167
1227
  },
1168
1228
  "&.Mui-checked": {
1169
- color: fg3.brandPrimary
1229
+ color: fg5.brandPrimary
1170
1230
  },
1171
1231
  "&.Mui-checked:hover": {
1172
- color: colors3.brand[700]
1232
+ color: colors5.brand[700]
1173
1233
  },
1174
1234
  "&.Mui-focusVisible": {
1175
1235
  outline: "none",
1176
- boxShadow: focusRings3.brand,
1177
- borderRadius: radius3.full
1236
+ boxShadow: focusRings5.brand,
1237
+ borderRadius: radius5.full
1178
1238
  },
1179
1239
  "&.Mui-disabled": {
1180
- color: border3.primary
1240
+ color: border5.primary
1181
1241
  }
1182
1242
  }
1183
1243
  }
@@ -1197,20 +1257,20 @@ function buildComponents(tokens) {
1197
1257
  padding: 2,
1198
1258
  "&.Mui-checked": {
1199
1259
  transform: "translateX(20px)",
1200
- color: fg3.white,
1260
+ color: fg5.white,
1201
1261
  "& + .MuiSwitch-track": {
1202
- backgroundColor: fg3.brandPrimary,
1262
+ backgroundColor: fg5.brandPrimary,
1203
1263
  opacity: 1
1204
1264
  }
1205
1265
  },
1206
1266
  "&.Mui-checked:hover + .MuiSwitch-track": {
1207
- backgroundColor: colors3.brand[700]
1267
+ backgroundColor: colors5.brand[700]
1208
1268
  },
1209
1269
  "&.Mui-focusVisible .MuiSwitch-thumb": {
1210
- boxShadow: focusRings3.brand
1270
+ boxShadow: focusRings5.brand
1211
1271
  },
1212
1272
  "&.Mui-disabled .MuiSwitch-thumb": {
1213
- color: bg3.disabled
1273
+ color: bg5.disabled
1214
1274
  },
1215
1275
  "&.Mui-disabled + .MuiSwitch-track": {
1216
1276
  opacity: 0.5
@@ -1222,8 +1282,8 @@ function buildComponents(tokens) {
1222
1282
  boxShadow: "0px 1px 2px 0px #1018280d"
1223
1283
  },
1224
1284
  track: {
1225
- borderRadius: radius3.full,
1226
- backgroundColor: border3.secondary,
1285
+ borderRadius: radius5.full,
1286
+ backgroundColor: border5.secondary,
1227
1287
  opacity: 1
1228
1288
  }
1229
1289
  }
@@ -1232,8 +1292,8 @@ function buildComponents(tokens) {
1232
1292
  MuiToggleButton: {
1233
1293
  styleOverrides: {
1234
1294
  root: {
1235
- borderColor: border3.primary,
1236
- color: text3.secondary,
1295
+ borderColor: border5.primary,
1296
+ color: text5.secondary,
1237
1297
  fontSize: 14,
1238
1298
  fontWeight: 600,
1239
1299
  lineHeight: "20px",
@@ -1241,19 +1301,19 @@ function buildComponents(tokens) {
1241
1301
  padding: "6px 12px",
1242
1302
  textTransform: "none",
1243
1303
  "&:hover": {
1244
- backgroundColor: bg3.primaryHover,
1245
- borderColor: border3.primary
1304
+ backgroundColor: bg5.primaryHover,
1305
+ borderColor: border5.primary
1246
1306
  },
1247
1307
  "&.Mui-selected": {
1248
- backgroundColor: bg3.brandPrimary,
1249
- color: buttonColors3.secondaryColor.fg,
1250
- borderColor: border3.brandSolid,
1308
+ backgroundColor: bg5.brandPrimary,
1309
+ color: buttonColors5.secondaryColor.fg,
1310
+ borderColor: border5.brandSolid,
1251
1311
  "&:hover": {
1252
- backgroundColor: bg3.brandSecondary
1312
+ backgroundColor: bg5.brandSecondary
1253
1313
  }
1254
1314
  },
1255
1315
  "&:focus-visible": {
1256
- boxShadow: focusRings3.brandShadowXs
1316
+ boxShadow: focusRings5.brandShadowXs
1257
1317
  }
1258
1318
  }
1259
1319
  }
@@ -1261,7 +1321,7 @@ function buildComponents(tokens) {
1261
1321
  MuiToggleButtonGroup: {
1262
1322
  styleOverrides: {
1263
1323
  root: {
1264
- borderRadius: radius3.md,
1324
+ borderRadius: radius5.md,
1265
1325
  overflow: "hidden"
1266
1326
  },
1267
1327
  grouped: {
@@ -1270,12 +1330,12 @@ function buildComponents(tokens) {
1270
1330
  marginLeft: -1
1271
1331
  },
1272
1332
  "&:first-of-type": {
1273
- borderTopLeftRadius: radius3.md,
1274
- borderBottomLeftRadius: radius3.md
1333
+ borderTopLeftRadius: radius5.md,
1334
+ borderBottomLeftRadius: radius5.md
1275
1335
  },
1276
1336
  "&:last-of-type": {
1277
- borderTopRightRadius: radius3.md,
1278
- borderBottomRightRadius: radius3.md
1337
+ borderTopRightRadius: radius5.md,
1338
+ borderBottomRightRadius: radius5.md
1279
1339
  }
1280
1340
  }
1281
1341
  }
@@ -1284,8 +1344,8 @@ function buildComponents(tokens) {
1284
1344
  MuiDrawer: {
1285
1345
  styleOverrides: {
1286
1346
  paper: {
1287
- backgroundColor: bg3.primary,
1288
- borderRight: `1px solid ${border3.secondary}`
1347
+ backgroundColor: bg5.primary,
1348
+ borderRight: `1px solid ${border5.secondary}`
1289
1349
  }
1290
1350
  }
1291
1351
  },
@@ -1296,9 +1356,9 @@ function buildComponents(tokens) {
1296
1356
  },
1297
1357
  styleOverrides: {
1298
1358
  root: {
1299
- borderRadius: radius3.xl,
1300
- border: `1px solid ${border3.secondary}`,
1301
- backgroundColor: bg3.primary,
1359
+ borderRadius: radius5.xl,
1360
+ border: `1px solid ${border5.secondary}`,
1361
+ backgroundColor: bg5.primary,
1302
1362
  boxShadow: tokenShadows.xs,
1303
1363
  overflow: "hidden"
1304
1364
  }
@@ -1345,35 +1405,35 @@ function buildComponents(tokens) {
1345
1405
  backgroundImage: "none"
1346
1406
  },
1347
1407
  rounded: {
1348
- borderRadius: radius3.lg
1408
+ borderRadius: radius5.lg
1349
1409
  },
1350
1410
  elevation1: {
1351
1411
  boxShadow: tokenShadows.xs,
1352
- border: `1px solid ${border3.secondary}`
1412
+ border: `1px solid ${border5.secondary}`
1353
1413
  },
1354
1414
  elevation2: {
1355
1415
  boxShadow: tokenShadows.sm,
1356
- border: `1px solid ${border3.secondary}`
1416
+ border: `1px solid ${border5.secondary}`
1357
1417
  },
1358
1418
  elevation3: {
1359
1419
  boxShadow: tokenShadows.md,
1360
- border: `1px solid ${border3.secondary}`
1420
+ border: `1px solid ${border5.secondary}`
1361
1421
  },
1362
1422
  elevation4: {
1363
1423
  boxShadow: tokenShadows.lg,
1364
- border: `1px solid ${border3.secondary}`
1424
+ border: `1px solid ${border5.secondary}`
1365
1425
  },
1366
1426
  elevation8: {
1367
1427
  boxShadow: tokenShadows.xl,
1368
- border: `1px solid ${border3.secondary}`
1428
+ border: `1px solid ${border5.secondary}`
1369
1429
  },
1370
1430
  elevation16: {
1371
1431
  boxShadow: tokenShadows["2xl"],
1372
- border: `1px solid ${border3.secondary}`
1432
+ border: `1px solid ${border5.secondary}`
1373
1433
  },
1374
1434
  elevation24: {
1375
1435
  boxShadow: tokenShadows["3xl"],
1376
- border: `1px solid ${border3.secondary}`
1436
+ border: `1px solid ${border5.secondary}`
1377
1437
  }
1378
1438
  }
1379
1439
  },
@@ -1385,8 +1445,8 @@ function buildComponents(tokens) {
1385
1445
  },
1386
1446
  styleOverrides: {
1387
1447
  root: {
1388
- border: `1px solid ${border3.secondary}`,
1389
- borderRadius: radius3.lg,
1448
+ border: `1px solid ${border5.secondary}`,
1449
+ borderRadius: radius5.lg,
1390
1450
  "&:not(:last-child)": {
1391
1451
  marginBottom: 8
1392
1452
  },
@@ -1396,7 +1456,7 @@ function buildComponents(tokens) {
1396
1456
  "&.Mui-expanded": {
1397
1457
  margin: 0,
1398
1458
  marginBottom: 8,
1399
- borderRadius: radius3.lg
1459
+ borderRadius: radius5.lg
1400
1460
  }
1401
1461
  }
1402
1462
  }
@@ -1408,7 +1468,7 @@ function buildComponents(tokens) {
1408
1468
  minHeight: 56,
1409
1469
  "&.Mui-expanded": {
1410
1470
  minHeight: 56,
1411
- borderBottom: `1px solid ${border3.secondary}`
1471
+ borderBottom: `1px solid ${border5.secondary}`
1412
1472
  }
1413
1473
  },
1414
1474
  content: {
@@ -1434,8 +1494,8 @@ function buildComponents(tokens) {
1434
1494
  },
1435
1495
  styleOverrides: {
1436
1496
  root: {
1437
- borderBottom: `1px solid ${border3.secondary}`,
1438
- backgroundColor: bg3.primary
1497
+ borderBottom: `1px solid ${border5.secondary}`,
1498
+ backgroundColor: bg5.primary
1439
1499
  }
1440
1500
  }
1441
1501
  },
@@ -1459,7 +1519,7 @@ function buildComponents(tokens) {
1459
1519
  MuiChip: {
1460
1520
  styleOverrides: {
1461
1521
  root: {
1462
- borderRadius: radius3.md
1522
+ borderRadius: radius5.md
1463
1523
  },
1464
1524
  label: {
1465
1525
  fontWeight: 500
@@ -1475,51 +1535,51 @@ function buildComponents(tokens) {
1475
1535
  },
1476
1536
  colorDefault: {
1477
1537
  "&.MuiChip-filled": {
1478
- backgroundColor: colors3.gray[50],
1479
- color: colors3.gray[700],
1480
- "& .MuiChip-deleteIcon": { color: colors3.gray[400] }
1538
+ backgroundColor: colors5.gray[50],
1539
+ color: colors5.gray[700],
1540
+ "& .MuiChip-deleteIcon": { color: colors5.gray[400] }
1481
1541
  }
1482
1542
  },
1483
1543
  colorPrimary: {
1484
1544
  "&.MuiChip-filled": {
1485
- backgroundColor: colors3.brand[50],
1486
- color: colors3.brand[700],
1487
- "& .MuiChip-deleteIcon": { color: colors3.brand[400] }
1545
+ backgroundColor: colors5.brand[50],
1546
+ color: colors5.brand[700],
1547
+ "& .MuiChip-deleteIcon": { color: colors5.brand[400] }
1488
1548
  }
1489
1549
  },
1490
1550
  colorSecondary: {
1491
1551
  "&.MuiChip-filled": {
1492
- backgroundColor: colors3.gray[50],
1493
- color: colors3.gray[700],
1494
- "& .MuiChip-deleteIcon": { color: colors3.gray[400] }
1552
+ backgroundColor: colors5.gray[50],
1553
+ color: colors5.gray[700],
1554
+ "& .MuiChip-deleteIcon": { color: colors5.gray[400] }
1495
1555
  }
1496
1556
  },
1497
1557
  colorError: {
1498
1558
  "&.MuiChip-filled": {
1499
- backgroundColor: colors3.error[50],
1500
- color: colors3.error[700],
1501
- "& .MuiChip-deleteIcon": { color: colors3.error[400] }
1559
+ backgroundColor: colors5.error[50],
1560
+ color: colors5.error[700],
1561
+ "& .MuiChip-deleteIcon": { color: colors5.error[400] }
1502
1562
  }
1503
1563
  },
1504
1564
  colorWarning: {
1505
1565
  "&.MuiChip-filled": {
1506
- backgroundColor: colors3.warning[50],
1507
- color: colors3.warning[700],
1508
- "& .MuiChip-deleteIcon": { color: colors3.warning[400] }
1566
+ backgroundColor: colors5.warning[50],
1567
+ color: colors5.warning[700],
1568
+ "& .MuiChip-deleteIcon": { color: colors5.warning[400] }
1509
1569
  }
1510
1570
  },
1511
1571
  colorSuccess: {
1512
1572
  "&.MuiChip-filled": {
1513
- backgroundColor: colors3.success[50],
1514
- color: colors3.success[700],
1515
- "& .MuiChip-deleteIcon": { color: colors3.success[400] }
1573
+ backgroundColor: colors5.success[50],
1574
+ color: colors5.success[700],
1575
+ "& .MuiChip-deleteIcon": { color: colors5.success[400] }
1516
1576
  }
1517
1577
  },
1518
1578
  colorInfo: {
1519
1579
  "&.MuiChip-filled": {
1520
- backgroundColor: colors3.blue[50],
1521
- color: colors3.blue[700],
1522
- "& .MuiChip-deleteIcon": { color: colors3.blue[400] }
1580
+ backgroundColor: colors5.blue[50],
1581
+ color: colors5.blue[700],
1582
+ "& .MuiChip-deleteIcon": { color: colors5.blue[400] }
1523
1583
  }
1524
1584
  }
1525
1585
  }
@@ -1535,7 +1595,7 @@ function buildComponents(tokens) {
1535
1595
  fontSize: 14,
1536
1596
  lineHeight: "20px",
1537
1597
  fontWeight: 500,
1538
- color: text3.secondary
1598
+ color: text5.secondary
1539
1599
  }
1540
1600
  }
1541
1601
  },
@@ -1551,29 +1611,29 @@ function buildComponents(tokens) {
1551
1611
  MuiTableCell: {
1552
1612
  styleOverrides: {
1553
1613
  root: {
1554
- borderBottom: `1px solid ${border3.secondary}`,
1614
+ borderBottom: `1px solid ${border5.secondary}`,
1555
1615
  padding: "16px 24px",
1556
1616
  fontSize: 14,
1557
1617
  lineHeight: "20px",
1558
- color: fg3.tertiary
1618
+ color: fg5.tertiary
1559
1619
  },
1560
1620
  head: {
1561
- backgroundColor: bg3.secondary,
1562
- color: fg3.tertiary,
1621
+ backgroundColor: bg5.secondary,
1622
+ color: fg5.tertiary,
1563
1623
  fontWeight: 500,
1564
1624
  fontSize: 12,
1565
1625
  lineHeight: "18px"
1566
1626
  },
1567
1627
  body: {
1568
- color: fg3.tertiary
1628
+ color: fg5.tertiary
1569
1629
  }
1570
1630
  }
1571
1631
  },
1572
1632
  MuiTableHead: {
1573
1633
  styleOverrides: {
1574
1634
  root: {
1575
- backgroundColor: bg3.secondary,
1576
- borderBottom: `1px solid ${border3.secondary}`
1635
+ backgroundColor: bg5.secondary,
1636
+ borderBottom: `1px solid ${border5.secondary}`
1577
1637
  }
1578
1638
  }
1579
1639
  },
@@ -1584,12 +1644,12 @@ function buildComponents(tokens) {
1584
1644
  border: 0
1585
1645
  },
1586
1646
  "&:hover": {
1587
- backgroundColor: bg3.primaryHover
1647
+ backgroundColor: bg5.primaryHover
1588
1648
  },
1589
1649
  "&.Mui-selected": {
1590
- backgroundColor: bg3.brandPrimary,
1650
+ backgroundColor: bg5.brandPrimary,
1591
1651
  "&:hover": {
1592
- backgroundColor: bg3.brandPrimary
1652
+ backgroundColor: bg5.brandPrimary
1593
1653
  }
1594
1654
  }
1595
1655
  }
@@ -1598,8 +1658,8 @@ function buildComponents(tokens) {
1598
1658
  MuiTableContainer: {
1599
1659
  styleOverrides: {
1600
1660
  root: {
1601
- borderRadius: radius3.xl,
1602
- border: `1px solid ${border3.secondary}`,
1661
+ borderRadius: radius5.xl,
1662
+ border: `1px solid ${border5.secondary}`,
1603
1663
  boxShadow: "none"
1604
1664
  }
1605
1665
  }
@@ -1613,24 +1673,24 @@ function buildComponents(tokens) {
1613
1673
  lineHeight: "18px",
1614
1674
  minWidth: 20,
1615
1675
  height: 20,
1616
- borderRadius: radius3.full
1676
+ borderRadius: radius5.full
1617
1677
  },
1618
1678
  colorPrimary: {
1619
- backgroundColor: bg3.brandSolid
1679
+ backgroundColor: bg5.brandSolid
1620
1680
  },
1621
1681
  colorError: {
1622
- backgroundColor: bg3.errorSolid
1682
+ backgroundColor: bg5.errorSolid
1623
1683
  },
1624
1684
  colorSuccess: {
1625
- backgroundColor: bg3.successSolid
1685
+ backgroundColor: bg5.successSolid
1626
1686
  },
1627
1687
  colorWarning: {
1628
- backgroundColor: bg3.warningSolid
1688
+ backgroundColor: bg5.warningSolid
1629
1689
  },
1630
1690
  dot: {
1631
1691
  minWidth: 8,
1632
1692
  height: 8,
1633
- borderRadius: radius3.full
1693
+ borderRadius: radius5.full
1634
1694
  }
1635
1695
  }
1636
1696
  },
@@ -1638,7 +1698,7 @@ function buildComponents(tokens) {
1638
1698
  MuiDivider: {
1639
1699
  styleOverrides: {
1640
1700
  root: {
1641
- borderColor: border3.secondary
1701
+ borderColor: border5.secondary
1642
1702
  }
1643
1703
  }
1644
1704
  },
@@ -1653,16 +1713,16 @@ function buildComponents(tokens) {
1653
1713
  MuiListItemButton: {
1654
1714
  styleOverrides: {
1655
1715
  root: {
1656
- borderRadius: radius3.sm,
1716
+ borderRadius: radius5.sm,
1657
1717
  padding: "8px 12px",
1658
1718
  "&:hover": {
1659
- backgroundColor: bg3.primaryHover
1719
+ backgroundColor: bg5.primaryHover
1660
1720
  },
1661
1721
  "&.Mui-selected": {
1662
- backgroundColor: bg3.brandPrimary,
1663
- color: buttonColors3.secondaryColor.fg,
1722
+ backgroundColor: bg5.brandPrimary,
1723
+ color: buttonColors5.secondaryColor.fg,
1664
1724
  "&:hover": {
1665
- backgroundColor: bg3.brandSecondary
1725
+ backgroundColor: bg5.brandSecondary
1666
1726
  }
1667
1727
  }
1668
1728
  }
@@ -1672,7 +1732,7 @@ function buildComponents(tokens) {
1672
1732
  styleOverrides: {
1673
1733
  root: {
1674
1734
  minWidth: 36,
1675
- color: fg3.quaternary
1735
+ color: fg5.quaternary
1676
1736
  }
1677
1737
  }
1678
1738
  },
@@ -1682,12 +1742,12 @@ function buildComponents(tokens) {
1682
1742
  fontSize: 14,
1683
1743
  lineHeight: "20px",
1684
1744
  fontWeight: 500,
1685
- color: text3.secondary
1745
+ color: text5.secondary
1686
1746
  },
1687
1747
  secondary: {
1688
1748
  fontSize: 14,
1689
1749
  lineHeight: "20px",
1690
- color: text3.quaternary
1750
+ color: text5.quaternary
1691
1751
  }
1692
1752
  }
1693
1753
  },
@@ -1695,17 +1755,17 @@ function buildComponents(tokens) {
1695
1755
  MuiTooltip: {
1696
1756
  styleOverrides: {
1697
1757
  tooltip: {
1698
- backgroundColor: bg3.primarySolid,
1699
- color: text3.white,
1758
+ backgroundColor: bg5.primarySolid,
1759
+ color: text5.white,
1700
1760
  fontSize: 12,
1701
1761
  lineHeight: "18px",
1702
1762
  fontWeight: 600,
1703
1763
  padding: "8px 12px",
1704
- borderRadius: radius3.md,
1764
+ borderRadius: radius5.md,
1705
1765
  boxShadow: tokenShadows.lg
1706
1766
  },
1707
1767
  arrow: {
1708
- color: bg3.primarySolid
1768
+ color: bg5.primarySolid
1709
1769
  }
1710
1770
  }
1711
1771
  },
@@ -1716,42 +1776,42 @@ function buildComponents(tokens) {
1716
1776
  },
1717
1777
  styleOverrides: {
1718
1778
  root: {
1719
- borderRadius: radius3.xl,
1779
+ borderRadius: radius5.xl,
1720
1780
  fontSize: 14,
1721
1781
  lineHeight: "20px",
1722
1782
  padding: "12px 16px",
1723
1783
  alignItems: "center"
1724
1784
  },
1725
1785
  standardError: {
1726
- backgroundColor: bg3.errorPrimary,
1727
- color: colors3.error[700],
1728
- border: `1px solid ${border3.error}`,
1786
+ backgroundColor: bg5.errorPrimary,
1787
+ color: colors5.error[700],
1788
+ border: `1px solid ${border5.error}`,
1729
1789
  "& .MuiAlert-icon": {
1730
- color: fg3.errorPrimary
1790
+ color: fg5.errorPrimary
1731
1791
  }
1732
1792
  },
1733
1793
  standardWarning: {
1734
- backgroundColor: bg3.warningPrimary,
1735
- color: colors3.warning[700],
1736
- border: `1px solid ${colors3.warning[300]}`,
1794
+ backgroundColor: bg5.warningPrimary,
1795
+ color: colors5.warning[700],
1796
+ border: `1px solid ${colors5.warning[300]}`,
1737
1797
  "& .MuiAlert-icon": {
1738
- color: fg3.warningPrimary
1798
+ color: fg5.warningPrimary
1739
1799
  }
1740
1800
  },
1741
1801
  standardSuccess: {
1742
- backgroundColor: bg3.successPrimary,
1743
- color: colors3.success[700],
1744
- border: `1px solid ${colors3.success[300]}`,
1802
+ backgroundColor: bg5.successPrimary,
1803
+ color: colors5.success[700],
1804
+ border: `1px solid ${colors5.success[300]}`,
1745
1805
  "& .MuiAlert-icon": {
1746
- color: fg3.successPrimary
1806
+ color: fg5.successPrimary
1747
1807
  }
1748
1808
  },
1749
1809
  standardInfo: {
1750
- backgroundColor: colors3.blue[50],
1751
- color: colors3.blue[700],
1752
- border: `1px solid ${colors3.blue[300]}`,
1810
+ backgroundColor: colors5.blue[50],
1811
+ color: colors5.blue[700],
1812
+ border: `1px solid ${colors5.blue[300]}`,
1753
1813
  "& .MuiAlert-icon": {
1754
- color: colors3.blue[600]
1814
+ color: colors5.blue[600]
1755
1815
  }
1756
1816
  },
1757
1817
  icon: {
@@ -1782,7 +1842,7 @@ function buildComponents(tokens) {
1782
1842
  MuiDialog: {
1783
1843
  styleOverrides: {
1784
1844
  paper: {
1785
- borderRadius: radius3.xl,
1845
+ borderRadius: radius5.xl,
1786
1846
  boxShadow: tokenShadows.xl,
1787
1847
  padding: 0
1788
1848
  }
@@ -1794,7 +1854,7 @@ function buildComponents(tokens) {
1794
1854
  fontSize: 18,
1795
1855
  lineHeight: "28px",
1796
1856
  fontWeight: 600,
1797
- color: text3.primary,
1857
+ color: text5.primary,
1798
1858
  padding: "24px 24px 0"
1799
1859
  }
1800
1860
  }
@@ -1805,7 +1865,7 @@ function buildComponents(tokens) {
1805
1865
  padding: "20px 24px",
1806
1866
  fontSize: 14,
1807
1867
  lineHeight: "20px",
1808
- color: text3.tertiary
1868
+ color: text5.tertiary
1809
1869
  }
1810
1870
  }
1811
1871
  },
@@ -1821,27 +1881,27 @@ function buildComponents(tokens) {
1821
1881
  MuiLinearProgress: {
1822
1882
  styleOverrides: {
1823
1883
  root: {
1824
- borderRadius: radius3.full,
1884
+ borderRadius: radius5.full,
1825
1885
  height: 8,
1826
- backgroundColor: border3.secondary
1886
+ backgroundColor: border5.secondary
1827
1887
  },
1828
1888
  barColorPrimary: {
1829
- backgroundColor: fg3.brandPrimary,
1830
- borderRadius: radius3.full
1889
+ backgroundColor: fg5.brandPrimary,
1890
+ borderRadius: radius5.full
1831
1891
  },
1832
1892
  barColorSecondary: {
1833
- backgroundColor: bg3.secondarySolid,
1834
- borderRadius: radius3.full
1893
+ backgroundColor: bg5.secondarySolid,
1894
+ borderRadius: radius5.full
1835
1895
  }
1836
1896
  }
1837
1897
  },
1838
1898
  MuiCircularProgress: {
1839
1899
  styleOverrides: {
1840
1900
  colorPrimary: {
1841
- color: fg3.brandPrimary
1901
+ color: fg5.brandPrimary
1842
1902
  },
1843
1903
  colorSecondary: {
1844
- color: bg3.secondarySolid
1904
+ color: bg5.secondarySolid
1845
1905
  }
1846
1906
  }
1847
1907
  },
@@ -1852,13 +1912,13 @@ function buildComponents(tokens) {
1852
1912
  },
1853
1913
  styleOverrides: {
1854
1914
  root: {
1855
- backgroundColor: bg3.tertiary
1915
+ backgroundColor: bg5.tertiary
1856
1916
  },
1857
1917
  rounded: {
1858
- borderRadius: radius3.md
1918
+ borderRadius: radius5.md
1859
1919
  },
1860
1920
  circular: {
1861
- borderRadius: radius3.full
1921
+ borderRadius: radius5.full
1862
1922
  }
1863
1923
  }
1864
1924
  },
@@ -1866,9 +1926,9 @@ function buildComponents(tokens) {
1866
1926
  MuiSnackbarContent: {
1867
1927
  styleOverrides: {
1868
1928
  root: {
1869
- backgroundColor: bg3.primarySolid,
1870
- color: text3.white,
1871
- borderRadius: radius3.xl,
1929
+ backgroundColor: bg5.primarySolid,
1930
+ color: text5.white,
1931
+ borderRadius: radius5.xl,
1872
1932
  boxShadow: tokenShadows.lg,
1873
1933
  fontSize: 14,
1874
1934
  lineHeight: "20px",
@@ -1902,21 +1962,21 @@ function buildComponents(tokens) {
1902
1962
  MuiDataGrid: {
1903
1963
  styleOverrides: {
1904
1964
  root: {
1905
- border: `1px solid ${border3.secondary}`,
1906
- borderRadius: radius3.xl,
1965
+ border: `1px solid ${border5.secondary}`,
1966
+ borderRadius: radius5.xl,
1907
1967
  fontFamily: "inherit",
1908
1968
  "& .MuiDataGrid-withBorderColor": {
1909
- borderColor: border3.secondary
1969
+ borderColor: border5.secondary
1910
1970
  }
1911
1971
  },
1912
1972
  columnHeaders: {
1913
- backgroundColor: bg3.secondary
1973
+ backgroundColor: bg5.secondary
1914
1974
  },
1915
1975
  columnHeader: {
1916
1976
  fontSize: 12,
1917
1977
  lineHeight: "18px",
1918
1978
  fontWeight: 500,
1919
- color: fg3.tertiary,
1979
+ color: fg5.tertiary,
1920
1980
  "&:focus, &:focus-within": {
1921
1981
  outline: "none"
1922
1982
  }
@@ -1927,34 +1987,34 @@ function buildComponents(tokens) {
1927
1987
  cell: {
1928
1988
  fontSize: 14,
1929
1989
  lineHeight: "20px",
1930
- color: fg3.tertiary,
1990
+ color: fg5.tertiary,
1931
1991
  "&:focus, &:focus-within": {
1932
1992
  outline: "none"
1933
1993
  }
1934
1994
  },
1935
1995
  row: {
1936
1996
  "&:hover": {
1937
- backgroundColor: bg3.primaryHover
1997
+ backgroundColor: bg5.primaryHover
1938
1998
  },
1939
1999
  "&.Mui-selected": {
1940
- backgroundColor: bg3.brandPrimary,
2000
+ backgroundColor: bg5.brandPrimary,
1941
2001
  "&:hover": {
1942
- backgroundColor: bg3.brandPrimary
2002
+ backgroundColor: bg5.brandPrimary
1943
2003
  }
1944
2004
  }
1945
2005
  },
1946
2006
  footerContainer: {
1947
- borderTop: `1px solid ${border3.secondary}`
2007
+ borderTop: `1px solid ${border5.secondary}`
1948
2008
  },
1949
2009
  columnSeparator: {
1950
- color: border3.secondary
2010
+ color: border5.secondary
1951
2011
  }
1952
2012
  }
1953
2013
  }
1954
2014
  }
1955
2015
  };
1956
2016
  }
1957
- var components = buildComponents({
2017
+ buildComponents({
1958
2018
  colors,
1959
2019
  radius,
1960
2020
  focusRings,
@@ -1965,65 +2025,7 @@ var components = buildComponents({
1965
2025
  border,
1966
2026
  buttonColors});
1967
2027
 
1968
- // src/theme/shadows.ts
1969
- function buildShadows(tokens) {
1970
- const tokenShadows = tokens.shadows;
1971
- return [
1972
- "none",
1973
- // 0
1974
- tokenShadows.xs,
1975
- // 1
1976
- tokenShadows.sm,
1977
- // 2
1978
- tokenShadows.sm,
1979
- // 3
1980
- tokenShadows.md,
1981
- // 4
1982
- tokenShadows.md,
1983
- // 5
1984
- tokenShadows.md,
1985
- // 6
1986
- tokenShadows.lg,
1987
- // 7
1988
- tokenShadows.lg,
1989
- // 8
1990
- tokenShadows.lg,
1991
- // 9
1992
- tokenShadows.xl,
1993
- // 10
1994
- tokenShadows.xl,
1995
- // 11
1996
- tokenShadows.xl,
1997
- // 12
1998
- tokenShadows["2xl"],
1999
- // 13
2000
- tokenShadows["2xl"],
2001
- // 14
2002
- tokenShadows["2xl"],
2003
- // 15
2004
- tokenShadows["3xl"],
2005
- // 16
2006
- tokenShadows["3xl"],
2007
- // 17
2008
- tokenShadows["3xl"],
2009
- // 18
2010
- tokenShadows["3xl"],
2011
- // 19
2012
- tokenShadows["3xl"],
2013
- // 20
2014
- tokenShadows["3xl"],
2015
- // 21
2016
- tokenShadows["3xl"],
2017
- // 22
2018
- tokenShadows["3xl"],
2019
- // 23
2020
- tokenShadows["3xl"]
2021
- // 24
2022
- ];
2023
- }
2024
- var shadows2 = buildShadows({
2025
- shadows
2026
- });
2028
+ // src/theme/buildTheme.ts
2027
2029
  function buildThemeOptions(tokens) {
2028
2030
  return {
2029
2031
  palette: buildPalette(tokens),
@@ -2039,44 +2041,7 @@ function buildTheme(tokens) {
2039
2041
  return styles.createTheme(buildThemeOptions(tokens));
2040
2042
  }
2041
2043
 
2042
- // src/theme/presets/forest.ts
2043
- var forestPreset = {
2044
- name: "forest",
2045
- defaultVariant: "light",
2046
- variants: {
2047
- light: {
2048
- tokens: {
2049
- colors,
2050
- spacing,
2051
- radius,
2052
- shadows,
2053
- focusRings,
2054
- fontFamily,
2055
- fontSize,
2056
- lineHeight,
2057
- fontWeight,
2058
- display,
2059
- container,
2060
- widths,
2061
- text,
2062
- bg,
2063
- fg,
2064
- border,
2065
- buttonColors,
2066
- avatarColors,
2067
- breadcrumbColors,
2068
- iconColors,
2069
- navColors,
2070
- sliderColors,
2071
- toggleColors,
2072
- chartColors,
2073
- alpha
2074
- }
2075
- }
2076
- }
2077
- };
2078
-
2079
- // src/theme/presets/alkemy-plus.ts
2044
+ // src/theme/presets/forest-external.ts
2080
2045
  var colors2 = {
2081
2046
  ...colors,
2082
2047
  /** Brand scale — black-based for primary actions */
@@ -2352,8 +2317,8 @@ var focusRings2 = {
2352
2317
  error: "0px 0px 0px 4px #f044383d",
2353
2318
  errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
2354
2319
  };
2355
- var alkemyPlusPreset = {
2356
- name: "alkemy-plus",
2320
+ var forestExternalPreset = {
2321
+ name: "forest-external",
2357
2322
  defaultVariant: "light",
2358
2323
  variants: {
2359
2324
  light: {
@@ -2388,10 +2353,635 @@ var alkemyPlusPreset = {
2388
2353
  }
2389
2354
  };
2390
2355
 
2356
+ // src/theme/presets/forest-agency.ts
2357
+ var colors3 = {
2358
+ ...colors,
2359
+ /** Brand scale — black-based for primary actions */
2360
+ brand: {
2361
+ 25: "#fafafa",
2362
+ 50: "#f5f5f5",
2363
+ 100: "#ebebeb",
2364
+ 200: "#d6d6d6",
2365
+ 300: "#b0b0b0",
2366
+ 400: "#737373",
2367
+ 500: "#404040",
2368
+ 600: "#1a1a1a",
2369
+ 700: "#0d0d0d",
2370
+ 800: "#050505",
2371
+ 900: "#000000",
2372
+ 950: "#000000"
2373
+ },
2374
+ /** Warm-neutral gray scale */
2375
+ gray: {
2376
+ 25: "#fdfcfc",
2377
+ 50: "#faf9f8",
2378
+ 100: "#f5f3f1",
2379
+ 200: "#e8e5e3",
2380
+ 300: "#d8d8dc",
2381
+ 400: "#a0a0a6",
2382
+ 500: "#71717a",
2383
+ 600: "#52525b",
2384
+ 700: "#3f3f46",
2385
+ 800: "#27272a",
2386
+ 900: "#18181b",
2387
+ 950: "#09090b"
2388
+ }
2389
+ };
2390
+ var radius3 = {
2391
+ ...radius,
2392
+ xxs: 1,
2393
+ xs: 2,
2394
+ sm: 3,
2395
+ md: 4,
2396
+ lg: 5,
2397
+ xl: 6,
2398
+ "2xl": 8,
2399
+ "3xl": 10,
2400
+ "4xl": 12
2401
+ };
2402
+ var text3 = {
2403
+ primary: colors3.gray[900],
2404
+ secondary: colors3.gray[700],
2405
+ secondaryHover: colors3.gray[800],
2406
+ tertiary: colors3.gray[600],
2407
+ tertiaryHover: colors3.gray[700],
2408
+ quaternary: colors3.gray[500],
2409
+ disabled: colors3.gray[500],
2410
+ placeholder: colors3.gray[500],
2411
+ placeholderSubtle: colors3.gray[300],
2412
+ white: colors3.base.white,
2413
+ brandPrimary: colors3.brand[900],
2414
+ brandSecondary: colors3.brand[700],
2415
+ brandTertiary: colors3.brand[600],
2416
+ brandTertiaryAlt: colors3.brand[600],
2417
+ primaryOnBrand: colors3.base.white,
2418
+ secondaryOnBrand: colors3.brand[200],
2419
+ tertiaryOnBrand: colors3.brand[200],
2420
+ quaternaryOnBrand: colors3.brand[300],
2421
+ errorPrimary: colors3.error[600],
2422
+ warningPrimary: colors3.warning[600],
2423
+ successPrimary: colors3.success[600]
2424
+ };
2425
+ var bg3 = {
2426
+ primary: colors3.gray[50],
2427
+ primaryAlt: colors3.gray[50],
2428
+ primaryHover: colors3.gray[100],
2429
+ primarySolid: colors3.gray[950],
2430
+ secondary: colors3.base.white,
2431
+ secondaryAlt: colors3.base.white,
2432
+ secondarySubtle: colors3.gray[25],
2433
+ secondaryHover: colors3.gray[50],
2434
+ secondarySolid: colors3.gray[600],
2435
+ tertiary: colors3.gray[100],
2436
+ quaternary: colors3.gray[200],
2437
+ active: colors3.gray[200],
2438
+ disabled: colors3.gray[100],
2439
+ disabledSubtle: colors3.gray[50],
2440
+ overlay: colors3.gray[950],
2441
+ brandPrimary: colors3.brand[50],
2442
+ brandPrimaryAlt: colors3.brand[50],
2443
+ brandSecondary: colors3.brand[100],
2444
+ brandSolid: colors3.brand[600],
2445
+ brandSolidHover: colors3.brand[700],
2446
+ brandSection: colors3.brand[800],
2447
+ brandSectionSubtle: colors3.brand[700],
2448
+ errorPrimary: colors3.error[50],
2449
+ errorSecondary: colors3.error[100],
2450
+ errorSolid: colors3.error[600],
2451
+ warningPrimary: colors3.warning[50],
2452
+ warningSecondary: colors3.warning[100],
2453
+ warningSolid: colors3.warning[600],
2454
+ successPrimary: colors3.success[50],
2455
+ successSecondary: colors3.success[100],
2456
+ successSolid: colors3.success[600]
2457
+ };
2458
+ var fg3 = {
2459
+ primary: colors3.gray[900],
2460
+ secondary: colors3.gray[700],
2461
+ secondaryHover: colors3.gray[800],
2462
+ tertiary: colors3.gray[600],
2463
+ tertiaryHover: colors3.gray[700],
2464
+ quaternary: colors3.gray[500],
2465
+ quaternaryHover: colors3.gray[600],
2466
+ quinary: colors3.gray[400],
2467
+ quinaryHover: colors3.gray[500],
2468
+ senary: colors3.gray[300],
2469
+ white: colors3.base.white,
2470
+ disabled: colors3.gray[400],
2471
+ disabledSubtle: colors3.gray[300],
2472
+ brandPrimary: colors3.brand[600],
2473
+ brandPrimaryAlt: colors3.brand[600],
2474
+ brandSecondary: colors3.brand[500],
2475
+ errorPrimary: colors3.error[600],
2476
+ errorSecondary: colors3.error[500],
2477
+ warningPrimary: colors3.warning[600],
2478
+ warningSecondary: colors3.warning[500],
2479
+ successPrimary: colors3.success[600],
2480
+ successSecondary: colors3.success[500]
2481
+ };
2482
+ var border3 = {
2483
+ primary: colors3.gray[300],
2484
+ secondary: colors3.gray[200],
2485
+ tertiary: colors3.gray[100],
2486
+ disabled: colors3.gray[300],
2487
+ disabledSubtle: colors3.gray[200],
2488
+ brand: colors3.brand[300],
2489
+ brandSolid: colors3.brand[600],
2490
+ brandSolidAlt: colors3.brand[600],
2491
+ error: colors3.error[300],
2492
+ errorSolid: colors3.error[600]
2493
+ };
2494
+ var buttonColors3 = {
2495
+ primary: {
2496
+ bg: colors3.brand[600],
2497
+ bgHover: colors3.brand[700],
2498
+ fg: colors3.base.white,
2499
+ fgHover: colors3.base.white,
2500
+ border: colors3.brand[600],
2501
+ borderHover: colors3.brand[700]
2502
+ },
2503
+ secondary: {
2504
+ bg: colors3.base.white,
2505
+ bgHover: colors3.gray[50],
2506
+ fg: colors3.gray[700],
2507
+ fgHover: colors3.gray[800],
2508
+ border: colors3.gray[300],
2509
+ borderHover: colors3.gray[300]
2510
+ },
2511
+ secondaryColor: {
2512
+ bg: colors3.base.white,
2513
+ bgHover: colors3.brand[50],
2514
+ fg: colors3.brand[700],
2515
+ fgHover: colors3.brand[800],
2516
+ border: colors3.brand[300],
2517
+ borderHover: colors3.brand[300]
2518
+ },
2519
+ tertiary: {
2520
+ fg: colors3.gray[600],
2521
+ fgHover: colors3.gray[700],
2522
+ bgHover: colors3.gray[50]
2523
+ },
2524
+ tertiaryColor: {
2525
+ fg: colors3.brand[700],
2526
+ fgHover: colors3.brand[800],
2527
+ bgHover: colors3.brand[50]
2528
+ },
2529
+ primaryError: {
2530
+ bg: colors3.error[600],
2531
+ bgHover: colors3.error[700],
2532
+ fg: colors3.base.white,
2533
+ fgHover: colors3.base.white,
2534
+ border: colors3.error[600],
2535
+ borderHover: colors3.error[700]
2536
+ },
2537
+ secondaryError: {
2538
+ bg: colors3.base.white,
2539
+ bgHover: colors3.error[50],
2540
+ fg: colors3.error[700],
2541
+ fgHover: colors3.error[800],
2542
+ border: colors3.error[300],
2543
+ borderHover: colors3.error[300]
2544
+ },
2545
+ tertiaryError: {
2546
+ fg: colors3.error[700],
2547
+ fgHover: colors3.error[800],
2548
+ bgHover: colors3.error[50]
2549
+ }
2550
+ };
2551
+ var avatarColors3 = {
2552
+ bg: colors3.gray[100],
2553
+ contrastBorder: "#00000014",
2554
+ profilePhotoBorder: colors3.base.white,
2555
+ focusBorder: "#a0a0a624"
2556
+ // gray[400] + 14% alpha
2557
+ };
2558
+ var breadcrumbColors3 = {
2559
+ fg: colors3.gray[600],
2560
+ fgHover: colors3.gray[700],
2561
+ bgHover: colors3.gray[50],
2562
+ brandBgHover: colors3.brand[50],
2563
+ brandFgHover: colors3.brand[700],
2564
+ iconFg: colors3.gray[500],
2565
+ iconFgHover: colors3.gray[700],
2566
+ brandIconFgHover: colors3.brand[700]
2567
+ };
2568
+ var iconColors3 = {
2569
+ fgBrand: colors3.brand[600],
2570
+ fgBrandOnBrand: colors3.brand[200],
2571
+ featuredModernBorder: colors3.gray[200],
2572
+ featuredLightFgBrand: colors3.brand[600],
2573
+ featuredLightFgGray: colors3.gray[500],
2574
+ featuredLightFgError: colors3.error[600],
2575
+ featuredLightFgWarning: colors3.warning[600],
2576
+ featuredLightFgSuccess: colors3.success[600],
2577
+ featuredDarkFgBrand: colors3.base.white,
2578
+ featuredDarkFgGray: colors3.base.white,
2579
+ featuredDarkFgError: colors3.base.white,
2580
+ featuredDarkFgWarning: colors3.base.white,
2581
+ featuredDarkFgSuccess: colors3.base.white
2582
+ };
2583
+ var navColors3 = {
2584
+ itemIconFg: colors3.gray[500],
2585
+ itemIconFgActive: colors3.gray[700],
2586
+ itemButtonIconFg: colors3.gray[500],
2587
+ itemButtonIconFgActive: colors3.gray[700]
2588
+ };
2589
+ var sliderColors3 = {
2590
+ handleBorder: colors3.brand[600],
2591
+ handleBg: colors3.base.white
2592
+ };
2593
+ var toggleColors3 = {
2594
+ buttonFgDisabled: colors3.gray[50]
2595
+ };
2596
+ var chartColors3 = {
2597
+ axisFg: colors3.gray[100],
2598
+ gridlineFg: colors3.gray[100],
2599
+ labelFg: colors3.gray[600],
2600
+ labelFgEmphasis: colors3.gray[700],
2601
+ bg: colors3.base.white,
2602
+ bgAlt: colors3.gray[50],
2603
+ tooltipBg: colors3.gray[950],
2604
+ tooltipFg: colors3.base.white,
2605
+ crosshairFg: colors3.gray[500],
2606
+ legendFg: text3.tertiary,
2607
+ series: [
2608
+ { fg: colors3.violet[500], fgHover: colors3.violet[600], bg: colors3.violet[100], bgHover: colors3.violet[200] },
2609
+ { fg: colors3.orangeDark[400], fgHover: colors3.orangeDark[500], bg: colors3.orangeDark[100], bgHover: colors3.orangeDark[200] },
2610
+ { fg: colors3.teal[300], fgHover: colors3.teal[400], bg: colors3.teal[50], bgHover: colors3.teal[100] },
2611
+ { fg: colors3.warning[400], fgHover: colors3.warning[500], bg: colors3.warning[100], bgHover: colors3.warning[200] },
2612
+ { fg: colors3.rose[400], fgHover: colors3.rose[500], bg: colors3.rose[100], bgHover: colors3.rose[200] },
2613
+ { fg: colors3.blueLight[400], fgHover: colors3.blueLight[500], bg: colors3.blueLight[100], bgHover: colors3.blueLight[200] },
2614
+ { fg: colors3.orange[300], fgHover: colors3.orange[400], bg: colors3.orange[100], bgHover: colors3.orange[200] },
2615
+ { fg: colors3.cyan[600], fgHover: colors3.cyan[700], bg: colors3.cyan[100], bgHover: colors3.cyan[200] },
2616
+ { fg: colors3.green[500], fgHover: colors3.green[600], bg: colors3.green[100], bgHover: colors3.green[200] },
2617
+ { fg: colors3.pink[400], fgHover: colors3.pink[500], bg: colors3.pink[100], bgHover: colors3.pink[200] },
2618
+ { fg: colors3.fuchsia[400], fgHover: colors3.fuchsia[500], bg: colors3.fuchsia[100], bgHover: colors3.fuchsia[200] },
2619
+ { fg: colors3.teal[600], fgHover: colors3.teal[700], bg: colors3.teal[100], bgHover: colors3.teal[200] }
2620
+ ]
2621
+ };
2622
+ var focusRings3 = {
2623
+ brand: "0px 0px 0px 4px #4040403d",
2624
+ brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #4040403d",
2625
+ brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #4040403d",
2626
+ gray: "0px 0px 0px 4px #a0a0a624",
2627
+ grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #a0a0a624",
2628
+ grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #a0a0a624",
2629
+ error: "0px 0px 0px 4px #f044383d",
2630
+ errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
2631
+ };
2632
+ var forestAgencyPreset = {
2633
+ name: "forest-agency",
2634
+ defaultVariant: "light",
2635
+ variants: {
2636
+ light: {
2637
+ tokens: {
2638
+ colors: colors3,
2639
+ spacing,
2640
+ radius: radius3,
2641
+ shadows,
2642
+ focusRings: focusRings3,
2643
+ fontFamily: '"Aeonik", sans-serif',
2644
+ fontSize,
2645
+ lineHeight,
2646
+ fontWeight,
2647
+ display,
2648
+ container,
2649
+ widths,
2650
+ text: text3,
2651
+ bg: bg3,
2652
+ fg: fg3,
2653
+ border: border3,
2654
+ buttonColors: buttonColors3,
2655
+ avatarColors: avatarColors3,
2656
+ breadcrumbColors: breadcrumbColors3,
2657
+ iconColors: iconColors3,
2658
+ navColors: navColors3,
2659
+ sliderColors: sliderColors3,
2660
+ toggleColors: toggleColors3,
2661
+ chartColors: chartColors3,
2662
+ alpha
2663
+ }
2664
+ }
2665
+ }
2666
+ };
2667
+
2668
+ // src/theme/presets/forest-internal.ts
2669
+ var colors4 = {
2670
+ ...colors,
2671
+ /** Brand scale — black-based for primary actions */
2672
+ brand: {
2673
+ 25: "#fafafa",
2674
+ 50: "#f5f5f5",
2675
+ 100: "#ebebeb",
2676
+ 200: "#d6d6d6",
2677
+ 300: "#b0b0b0",
2678
+ 400: "#737373",
2679
+ 500: "#404040",
2680
+ 600: "#1a1a1a",
2681
+ 700: "#0d0d0d",
2682
+ 800: "#050505",
2683
+ 900: "#000000",
2684
+ 950: "#000000"
2685
+ },
2686
+ /** Warm-neutral gray scale */
2687
+ gray: {
2688
+ 25: "#fdfcfc",
2689
+ 50: "#faf9f8",
2690
+ 100: "#f5f3f1",
2691
+ 200: "#e8e5e3",
2692
+ 300: "#d8d8dc",
2693
+ 400: "#a0a0a6",
2694
+ 500: "#71717a",
2695
+ 600: "#52525b",
2696
+ 700: "#3f3f46",
2697
+ 800: "#27272a",
2698
+ 900: "#18181b",
2699
+ 950: "#09090b"
2700
+ }
2701
+ };
2702
+ var radius4 = {
2703
+ ...radius,
2704
+ xxs: 1,
2705
+ xs: 2,
2706
+ sm: 3,
2707
+ md: 4,
2708
+ lg: 5,
2709
+ xl: 6,
2710
+ "2xl": 8,
2711
+ "3xl": 10,
2712
+ "4xl": 12
2713
+ };
2714
+ var text4 = {
2715
+ primary: colors4.gray[900],
2716
+ secondary: colors4.gray[700],
2717
+ secondaryHover: colors4.gray[800],
2718
+ tertiary: colors4.gray[600],
2719
+ tertiaryHover: colors4.gray[700],
2720
+ quaternary: colors4.gray[500],
2721
+ disabled: colors4.gray[500],
2722
+ placeholder: colors4.gray[500],
2723
+ placeholderSubtle: colors4.gray[300],
2724
+ white: colors4.base.white,
2725
+ brandPrimary: colors4.brand[900],
2726
+ brandSecondary: colors4.brand[700],
2727
+ brandTertiary: colors4.brand[600],
2728
+ brandTertiaryAlt: colors4.brand[600],
2729
+ primaryOnBrand: colors4.base.white,
2730
+ secondaryOnBrand: colors4.brand[200],
2731
+ tertiaryOnBrand: colors4.brand[200],
2732
+ quaternaryOnBrand: colors4.brand[300],
2733
+ errorPrimary: colors4.error[600],
2734
+ warningPrimary: colors4.warning[600],
2735
+ successPrimary: colors4.success[600]
2736
+ };
2737
+ var bg4 = {
2738
+ primary: colors4.gray[50],
2739
+ primaryAlt: colors4.gray[50],
2740
+ primaryHover: colors4.gray[100],
2741
+ primarySolid: colors4.gray[950],
2742
+ secondary: colors4.base.white,
2743
+ secondaryAlt: colors4.base.white,
2744
+ secondarySubtle: colors4.gray[25],
2745
+ secondaryHover: colors4.gray[50],
2746
+ secondarySolid: colors4.gray[600],
2747
+ tertiary: colors4.gray[100],
2748
+ quaternary: colors4.gray[200],
2749
+ active: colors4.gray[200],
2750
+ disabled: colors4.gray[100],
2751
+ disabledSubtle: colors4.gray[50],
2752
+ overlay: colors4.gray[950],
2753
+ brandPrimary: colors4.brand[50],
2754
+ brandPrimaryAlt: colors4.brand[50],
2755
+ brandSecondary: colors4.brand[100],
2756
+ brandSolid: colors4.brand[600],
2757
+ brandSolidHover: colors4.brand[700],
2758
+ brandSection: colors4.brand[800],
2759
+ brandSectionSubtle: colors4.brand[700],
2760
+ errorPrimary: colors4.error[50],
2761
+ errorSecondary: colors4.error[100],
2762
+ errorSolid: colors4.error[600],
2763
+ warningPrimary: colors4.warning[50],
2764
+ warningSecondary: colors4.warning[100],
2765
+ warningSolid: colors4.warning[600],
2766
+ successPrimary: colors4.success[50],
2767
+ successSecondary: colors4.success[100],
2768
+ successSolid: colors4.success[600]
2769
+ };
2770
+ var fg4 = {
2771
+ primary: colors4.gray[900],
2772
+ secondary: colors4.gray[700],
2773
+ secondaryHover: colors4.gray[800],
2774
+ tertiary: colors4.gray[600],
2775
+ tertiaryHover: colors4.gray[700],
2776
+ quaternary: colors4.gray[500],
2777
+ quaternaryHover: colors4.gray[600],
2778
+ quinary: colors4.gray[400],
2779
+ quinaryHover: colors4.gray[500],
2780
+ senary: colors4.gray[300],
2781
+ white: colors4.base.white,
2782
+ disabled: colors4.gray[400],
2783
+ disabledSubtle: colors4.gray[300],
2784
+ brandPrimary: colors4.brand[600],
2785
+ brandPrimaryAlt: colors4.brand[600],
2786
+ brandSecondary: colors4.brand[500],
2787
+ errorPrimary: colors4.error[600],
2788
+ errorSecondary: colors4.error[500],
2789
+ warningPrimary: colors4.warning[600],
2790
+ warningSecondary: colors4.warning[500],
2791
+ successPrimary: colors4.success[600],
2792
+ successSecondary: colors4.success[500]
2793
+ };
2794
+ var border4 = {
2795
+ primary: colors4.gray[300],
2796
+ secondary: colors4.gray[200],
2797
+ tertiary: colors4.gray[100],
2798
+ disabled: colors4.gray[300],
2799
+ disabledSubtle: colors4.gray[200],
2800
+ brand: colors4.brand[300],
2801
+ brandSolid: colors4.brand[600],
2802
+ brandSolidAlt: colors4.brand[600],
2803
+ error: colors4.error[300],
2804
+ errorSolid: colors4.error[600]
2805
+ };
2806
+ var buttonColors4 = {
2807
+ primary: {
2808
+ bg: colors4.brand[600],
2809
+ bgHover: colors4.brand[700],
2810
+ fg: colors4.base.white,
2811
+ fgHover: colors4.base.white,
2812
+ border: colors4.brand[600],
2813
+ borderHover: colors4.brand[700]
2814
+ },
2815
+ secondary: {
2816
+ bg: colors4.base.white,
2817
+ bgHover: colors4.gray[50],
2818
+ fg: colors4.gray[700],
2819
+ fgHover: colors4.gray[800],
2820
+ border: colors4.gray[300],
2821
+ borderHover: colors4.gray[300]
2822
+ },
2823
+ secondaryColor: {
2824
+ bg: colors4.base.white,
2825
+ bgHover: colors4.brand[50],
2826
+ fg: colors4.brand[700],
2827
+ fgHover: colors4.brand[800],
2828
+ border: colors4.brand[300],
2829
+ borderHover: colors4.brand[300]
2830
+ },
2831
+ tertiary: {
2832
+ fg: colors4.gray[600],
2833
+ fgHover: colors4.gray[700],
2834
+ bgHover: colors4.gray[50]
2835
+ },
2836
+ tertiaryColor: {
2837
+ fg: colors4.brand[700],
2838
+ fgHover: colors4.brand[800],
2839
+ bgHover: colors4.brand[50]
2840
+ },
2841
+ primaryError: {
2842
+ bg: colors4.error[600],
2843
+ bgHover: colors4.error[700],
2844
+ fg: colors4.base.white,
2845
+ fgHover: colors4.base.white,
2846
+ border: colors4.error[600],
2847
+ borderHover: colors4.error[700]
2848
+ },
2849
+ secondaryError: {
2850
+ bg: colors4.base.white,
2851
+ bgHover: colors4.error[50],
2852
+ fg: colors4.error[700],
2853
+ fgHover: colors4.error[800],
2854
+ border: colors4.error[300],
2855
+ borderHover: colors4.error[300]
2856
+ },
2857
+ tertiaryError: {
2858
+ fg: colors4.error[700],
2859
+ fgHover: colors4.error[800],
2860
+ bgHover: colors4.error[50]
2861
+ }
2862
+ };
2863
+ var avatarColors4 = {
2864
+ bg: colors4.gray[100],
2865
+ contrastBorder: "#00000014",
2866
+ profilePhotoBorder: colors4.base.white,
2867
+ focusBorder: "#a0a0a624"
2868
+ // gray[400] + 14% alpha
2869
+ };
2870
+ var breadcrumbColors4 = {
2871
+ fg: colors4.gray[600],
2872
+ fgHover: colors4.gray[700],
2873
+ bgHover: colors4.gray[50],
2874
+ brandBgHover: colors4.brand[50],
2875
+ brandFgHover: colors4.brand[700],
2876
+ iconFg: colors4.gray[500],
2877
+ iconFgHover: colors4.gray[700],
2878
+ brandIconFgHover: colors4.brand[700]
2879
+ };
2880
+ var iconColors4 = {
2881
+ fgBrand: colors4.brand[600],
2882
+ fgBrandOnBrand: colors4.brand[200],
2883
+ featuredModernBorder: colors4.gray[200],
2884
+ featuredLightFgBrand: colors4.brand[600],
2885
+ featuredLightFgGray: colors4.gray[500],
2886
+ featuredLightFgError: colors4.error[600],
2887
+ featuredLightFgWarning: colors4.warning[600],
2888
+ featuredLightFgSuccess: colors4.success[600],
2889
+ featuredDarkFgBrand: colors4.base.white,
2890
+ featuredDarkFgGray: colors4.base.white,
2891
+ featuredDarkFgError: colors4.base.white,
2892
+ featuredDarkFgWarning: colors4.base.white,
2893
+ featuredDarkFgSuccess: colors4.base.white
2894
+ };
2895
+ var navColors4 = {
2896
+ itemIconFg: colors4.gray[500],
2897
+ itemIconFgActive: colors4.gray[700],
2898
+ itemButtonIconFg: colors4.gray[500],
2899
+ itemButtonIconFgActive: colors4.gray[700]
2900
+ };
2901
+ var sliderColors4 = {
2902
+ handleBorder: colors4.brand[600],
2903
+ handleBg: colors4.base.white
2904
+ };
2905
+ var toggleColors4 = {
2906
+ buttonFgDisabled: colors4.gray[50]
2907
+ };
2908
+ var chartColors4 = {
2909
+ axisFg: colors4.gray[100],
2910
+ gridlineFg: colors4.gray[100],
2911
+ labelFg: colors4.gray[600],
2912
+ labelFgEmphasis: colors4.gray[700],
2913
+ bg: colors4.base.white,
2914
+ bgAlt: colors4.gray[50],
2915
+ tooltipBg: colors4.gray[950],
2916
+ tooltipFg: colors4.base.white,
2917
+ crosshairFg: colors4.gray[500],
2918
+ legendFg: text4.tertiary,
2919
+ series: [
2920
+ { fg: colors4.violet[500], fgHover: colors4.violet[600], bg: colors4.violet[100], bgHover: colors4.violet[200] },
2921
+ { fg: colors4.orangeDark[400], fgHover: colors4.orangeDark[500], bg: colors4.orangeDark[100], bgHover: colors4.orangeDark[200] },
2922
+ { fg: colors4.teal[300], fgHover: colors4.teal[400], bg: colors4.teal[50], bgHover: colors4.teal[100] },
2923
+ { fg: colors4.warning[400], fgHover: colors4.warning[500], bg: colors4.warning[100], bgHover: colors4.warning[200] },
2924
+ { fg: colors4.rose[400], fgHover: colors4.rose[500], bg: colors4.rose[100], bgHover: colors4.rose[200] },
2925
+ { fg: colors4.blueLight[400], fgHover: colors4.blueLight[500], bg: colors4.blueLight[100], bgHover: colors4.blueLight[200] },
2926
+ { fg: colors4.orange[300], fgHover: colors4.orange[400], bg: colors4.orange[100], bgHover: colors4.orange[200] },
2927
+ { fg: colors4.cyan[600], fgHover: colors4.cyan[700], bg: colors4.cyan[100], bgHover: colors4.cyan[200] },
2928
+ { fg: colors4.green[500], fgHover: colors4.green[600], bg: colors4.green[100], bgHover: colors4.green[200] },
2929
+ { fg: colors4.pink[400], fgHover: colors4.pink[500], bg: colors4.pink[100], bgHover: colors4.pink[200] },
2930
+ { fg: colors4.fuchsia[400], fgHover: colors4.fuchsia[500], bg: colors4.fuchsia[100], bgHover: colors4.fuchsia[200] },
2931
+ { fg: colors4.teal[600], fgHover: colors4.teal[700], bg: colors4.teal[100], bgHover: colors4.teal[200] }
2932
+ ]
2933
+ };
2934
+ var focusRings4 = {
2935
+ brand: "0px 0px 0px 4px #4040403d",
2936
+ brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #4040403d",
2937
+ brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #4040403d",
2938
+ gray: "0px 0px 0px 4px #a0a0a624",
2939
+ grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #a0a0a624",
2940
+ grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #a0a0a624",
2941
+ error: "0px 0px 0px 4px #f044383d",
2942
+ errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
2943
+ };
2944
+ var forestInternalPreset = {
2945
+ name: "forest-internal",
2946
+ defaultVariant: "light",
2947
+ variants: {
2948
+ light: {
2949
+ tokens: {
2950
+ colors: colors4,
2951
+ spacing,
2952
+ radius: radius4,
2953
+ shadows,
2954
+ focusRings: focusRings4,
2955
+ fontFamily: '"Aeonik", sans-serif',
2956
+ fontSize,
2957
+ lineHeight,
2958
+ fontWeight,
2959
+ display,
2960
+ container,
2961
+ widths,
2962
+ text: text4,
2963
+ bg: bg4,
2964
+ fg: fg4,
2965
+ border: border4,
2966
+ buttonColors: buttonColors4,
2967
+ avatarColors: avatarColors4,
2968
+ breadcrumbColors: breadcrumbColors4,
2969
+ iconColors: iconColors4,
2970
+ navColors: navColors4,
2971
+ sliderColors: sliderColors4,
2972
+ toggleColors: toggleColors4,
2973
+ chartColors: chartColors4,
2974
+ alpha
2975
+ }
2976
+ }
2977
+ }
2978
+ };
2979
+
2391
2980
  // src/theme/presets/index.ts
2392
2981
  var presetRegistry = /* @__PURE__ */ new Map();
2393
- presetRegistry.set(forestPreset.name, forestPreset);
2394
- presetRegistry.set(alkemyPlusPreset.name, alkemyPlusPreset);
2982
+ presetRegistry.set(forestExternalPreset.name, forestExternalPreset);
2983
+ presetRegistry.set(forestAgencyPreset.name, forestAgencyPreset);
2984
+ presetRegistry.set(forestInternalPreset.name, forestInternalPreset);
2395
2985
  function getPreset(name) {
2396
2986
  return presetRegistry.get(name);
2397
2987
  }
@@ -2403,16 +2993,9 @@ function getAvailablePresets() {
2403
2993
  }
2404
2994
 
2405
2995
  // src/theme/index.ts
2406
- var forestThemeOptions = {
2407
- palette,
2408
- typography,
2409
- components,
2410
- shadows: shadows2,
2411
- shape: {
2412
- borderRadius: 8
2413
- }
2414
- };
2415
- var forestTheme = styles.createTheme(forestThemeOptions);
2996
+ var agencyTokens = forestAgencyPreset.variants.light.tokens;
2997
+ var forestTheme = buildTheme(agencyTokens);
2998
+ var forestThemeOptions = buildThemeOptions(agencyTokens);
2416
2999
  function ForestProvider({
2417
3000
  children,
2418
3001
  theme,
@@ -2592,6 +3175,62 @@ function Search({
2592
3175
  }
2593
3176
  );
2594
3177
  }
3178
+ var sizeMap = {
3179
+ sm: 24,
3180
+ md: 32,
3181
+ lg: 48,
3182
+ xl: 64
3183
+ };
3184
+ var variantColors = {
3185
+ agency: "#1a1a1a",
3186
+ external: "#1a1a1a",
3187
+ internal: "#1a1a1a"
3188
+ };
3189
+ var Logo = React2.forwardRef(
3190
+ ({ variant = "agency", size = "md", logomarkOnly = false, sx, ...props }, ref) => {
3191
+ const dimension = sizeMap[size];
3192
+ return /* @__PURE__ */ jsxRuntime.jsxs(
3193
+ material.Box,
3194
+ {
3195
+ ref,
3196
+ component: "svg",
3197
+ viewBox: "0 0 64 64",
3198
+ sx: {
3199
+ width: dimension,
3200
+ height: dimension,
3201
+ display: "inline-flex",
3202
+ alignItems: "center",
3203
+ justifyContent: "center",
3204
+ ...sx
3205
+ },
3206
+ ...props,
3207
+ children: [
3208
+ /* @__PURE__ */ jsxRuntime.jsx(
3209
+ "path",
3210
+ {
3211
+ d: "M32 4L8 28h12v28h8V28h12L32 4z",
3212
+ fill: variantColors[variant]
3213
+ }
3214
+ ),
3215
+ !logomarkOnly && /* @__PURE__ */ jsxRuntime.jsx(
3216
+ "text",
3217
+ {
3218
+ x: "32",
3219
+ y: "60",
3220
+ textAnchor: "middle",
3221
+ fontSize: "10",
3222
+ fontWeight: "600",
3223
+ fill: variantColors[variant],
3224
+ fontFamily: "Aeonik, sans-serif",
3225
+ children: "Forest"
3226
+ }
3227
+ )
3228
+ ]
3229
+ }
3230
+ );
3231
+ }
3232
+ );
3233
+ Logo.displayName = "Logo";
2595
3234
  function ToggleButton(props) {
2596
3235
  return /* @__PURE__ */ jsxRuntime.jsx(MuiToggleButton__default.default, { ...props });
2597
3236
  }
@@ -2810,7 +3449,7 @@ function SidebarNav({
2810
3449
  onMouseEnter: () => onOpenChange(true),
2811
3450
  onMouseLeave: () => onOpenChange(false)
2812
3451
  } : {};
2813
- return /* @__PURE__ */ jsxRuntime.jsx(SidebarContext.Provider, { value: { open, collapsedWidth, expandedWidth }, children: /* @__PURE__ */ jsxRuntime.jsxs(Box__default.default, { sx: { position: "relative", width: layoutWidth, flexShrink: 0 }, children: [
3452
+ return /* @__PURE__ */ jsxRuntime.jsx(SidebarContext.Provider, { value: { open, collapsedWidth, expandedWidth }, children: /* @__PURE__ */ jsxRuntime.jsxs(Box2__default.default, { sx: { position: "relative", width: layoutWidth, flexShrink: 0 }, children: [
2814
3453
  /* @__PURE__ */ jsxRuntime.jsx(
2815
3454
  MuiDrawer__default.default,
2816
3455
  {
@@ -2830,7 +3469,7 @@ function SidebarNav({
2830
3469
  ...sx
2831
3470
  },
2832
3471
  children: /* @__PURE__ */ jsxRuntime.jsxs(
2833
- Box__default.default,
3472
+ Box2__default.default,
2834
3473
  {
2835
3474
  sx: {
2836
3475
  display: "flex",
@@ -2839,9 +3478,9 @@ function SidebarNav({
2839
3478
  overflow: "hidden"
2840
3479
  },
2841
3480
  children: [
2842
- header && /* @__PURE__ */ jsxRuntime.jsx(Box__default.default, { sx: { flexShrink: 0 }, children: header }),
2843
- /* @__PURE__ */ jsxRuntime.jsx(Box__default.default, { sx: { flexGrow: 1, overflowY: "auto", overflowX: "hidden" }, children }),
2844
- footer && /* @__PURE__ */ jsxRuntime.jsx(Box__default.default, { sx: { flexShrink: 0 }, children: footer })
3481
+ header && /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { flexShrink: 0 }, children: header }),
3482
+ /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { flexGrow: 1, overflowY: "auto", overflowX: "hidden" }, children }),
3483
+ footer && /* @__PURE__ */ jsxRuntime.jsx(Box2__default.default, { sx: { flexShrink: 0 }, children: footer })
2845
3484
  ]
2846
3485
  }
2847
3486
  )
@@ -2937,8 +3576,8 @@ function SidebarItem({
2937
3576
  function useChartColors(count) {
2938
3577
  const theme = styles.useTheme();
2939
3578
  const chart = theme.palette.chart;
2940
- const colors3 = chart.series.map((s) => s.fg);
2941
- return colors3.slice(0, Math.min(count, colors3.length));
3579
+ const colors5 = chart.series.map((s) => s.fg);
3580
+ return colors5.slice(0, Math.min(count, colors5.length));
2942
3581
  }
2943
3582
  function formatDate(date) {
2944
3583
  if (!date) return "";
@@ -3049,7 +3688,7 @@ function CustomTooltip(props) {
3049
3688
  }
3050
3689
  );
3051
3690
  }
3052
- function LineChart({ series, colors: colors3, ...props }) {
3691
+ function LineChart({ series, colors: colors5, ...props }) {
3053
3692
  var _a, _b;
3054
3693
  const theme = styles.useTheme();
3055
3694
  const chart = theme.palette.chart;
@@ -3066,7 +3705,7 @@ function LineChart({ series, colors: colors3, ...props }) {
3066
3705
  LineChart$1.LineChart,
3067
3706
  {
3068
3707
  series: modifiedSeries != null ? modifiedSeries : [],
3069
- colors: colors3 != null ? colors3 : seriesColors,
3708
+ colors: colors5 != null ? colors5 : seriesColors,
3070
3709
  grid: { horizontal: true },
3071
3710
  slots: {
3072
3711
  axisContent: CustomTooltip
@@ -3130,12 +3769,12 @@ function LineChart({ series, colors: colors3, ...props }) {
3130
3769
  }
3131
3770
  );
3132
3771
  }
3133
- function BarChart({ series, colors: colors3, ...props }) {
3772
+ function BarChart({ series, colors: colors5, ...props }) {
3134
3773
  var _a, _b;
3135
3774
  const theme = styles.useTheme();
3136
3775
  const chart = theme.palette.chart;
3137
3776
  const seriesColors = useChartColors((_a = series == null ? void 0 : series.length) != null ? _a : 0);
3138
- const resolvedColors = colors3 != null ? colors3 : seriesColors;
3777
+ const resolvedColors = colors5 != null ? colors5 : seriesColors;
3139
3778
  const modifiedSeries = series == null ? void 0 : series.map((s, idx) => {
3140
3779
  var _a2;
3141
3780
  const baseColor = s.color || resolvedColors[idx % resolvedColors.length];
@@ -3151,7 +3790,7 @@ function BarChart({ series, colors: colors3, ...props }) {
3151
3790
  BarChart$1.BarChart,
3152
3791
  {
3153
3792
  series: modifiedSeries != null ? modifiedSeries : [],
3154
- colors: colors3 != null ? colors3 : seriesColors,
3793
+ colors: colors5 != null ? colors5 : seriesColors,
3155
3794
  grid: { horizontal: true },
3156
3795
  borderRadius: 4,
3157
3796
  slots: {
@@ -3229,7 +3868,7 @@ function BarChart({ series, colors: colors3, ...props }) {
3229
3868
  }
3230
3869
  );
3231
3870
  }
3232
- function PieChart({ series, colors: colors3, ...props }) {
3871
+ function PieChart({ series, colors: colors5, ...props }) {
3233
3872
  var _a, _b, _c, _d;
3234
3873
  const theme = styles.useTheme();
3235
3874
  const chart = theme.palette.chart;
@@ -3246,7 +3885,7 @@ function PieChart({ series, colors: colors3, ...props }) {
3246
3885
  PieChart$1.PieChart,
3247
3886
  {
3248
3887
  series: modifiedSeries != null ? modifiedSeries : [],
3249
- colors: colors3 != null ? colors3 : seriesColors,
3888
+ colors: colors5 != null ? colors5 : seriesColors,
3250
3889
  slotProps: {
3251
3890
  legend: {
3252
3891
  itemMarkWidth: 12,
@@ -3325,6 +3964,7 @@ exports.ListItemButton = ListItemButton;
3325
3964
  exports.ListItemIcon = ListItemIcon;
3326
3965
  exports.ListItemText = ListItemText;
3327
3966
  exports.ListSubheader = ListSubheader;
3967
+ exports.Logo = Logo;
3328
3968
  exports.Menu = Menu;
3329
3969
  exports.MenuItem = MenuItem;
3330
3970
  exports.MenuList = MenuList;
@@ -3360,7 +4000,6 @@ exports.ToggleButtonGroup = ToggleButtonGroup;
3360
4000
  exports.Toolbar = Toolbar;
3361
4001
  exports.Tooltip = Tooltip;
3362
4002
  exports.Typography = Typography;
3363
- exports.alkemyPlusPreset = alkemyPlusPreset;
3364
4003
  exports.alpha = alpha;
3365
4004
  exports.avatarColors = avatarColors;
3366
4005
  exports.bg = bg;
@@ -3378,7 +4017,9 @@ exports.focusRings = focusRings;
3378
4017
  exports.fontFamily = fontFamily;
3379
4018
  exports.fontSize = fontSize;
3380
4019
  exports.fontWeight = fontWeight;
3381
- exports.forestPreset = forestPreset;
4020
+ exports.forestAgencyPreset = forestAgencyPreset;
4021
+ exports.forestExternalPreset = forestExternalPreset;
4022
+ exports.forestInternalPreset = forestInternalPreset;
3382
4023
  exports.forestTheme = forestTheme;
3383
4024
  exports.forestThemeOptions = forestThemeOptions;
3384
4025
  exports.getAvailablePresets = getAvailablePresets;