@matteoaliano/forest-ui 0.2.9 → 0.2.10
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/bin/stamp-version.mjs +53 -0
- package/bin/sync.mjs +8 -1
- package/dist/{chunk-QF5T6J4D.mjs → chunk-7B6NCKX3.mjs} +67 -81
- package/dist/chunk-7B6NCKX3.mjs.map +1 -0
- package/dist/{index-BxpOMmf6.d.mts → index-DiI9xbOM.d.mts} +3 -41
- package/dist/{index-BxpOMmf6.d.ts → index-DiI9xbOM.d.ts} +3 -41
- package/dist/index.d.mts +47 -2
- package/dist/index.d.ts +47 -2
- package/dist/index.js +491 -81
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +422 -5
- 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 +65 -79
- package/dist/theme.js.map +1 -1
- package/dist/theme.mjs +1 -1
- package/guidelines/FOREST_AI_GUIDELINES.md +1 -1
- package/guidelines/FOREST_DEV_GUIDELINES.md +1 -1
- package/guidelines/themes/FOREST_THEME_ALKEMY_PLUS.md +1 -1
- package/guidelines/themes/FOREST_THEME_DEFAULT.md +1 -1
- package/package.json +11 -6
- package/dist/chunk-QF5T6J4D.mjs.map +0 -1
package/dist/index.js
CHANGED
|
@@ -13,6 +13,9 @@ var MuiRadioGroup = require('@mui/material/RadioGroup');
|
|
|
13
13
|
var MuiRadio = require('@mui/material/Radio');
|
|
14
14
|
var MuiSelect = require('@mui/material/Select');
|
|
15
15
|
var MuiMenuItem = require('@mui/material/MenuItem');
|
|
16
|
+
var MuiListItemText = require('@mui/material/ListItemText');
|
|
17
|
+
var MuiFormControl = require('@mui/material/FormControl');
|
|
18
|
+
var MuiInputLabel = require('@mui/material/InputLabel');
|
|
16
19
|
var MuiSwitch = require('@mui/material/Switch');
|
|
17
20
|
var MuiTextField = require('@mui/material/TextField');
|
|
18
21
|
var MuiToggleButton = require('@mui/material/ToggleButton');
|
|
@@ -25,7 +28,6 @@ var MuiList = require('@mui/material/List');
|
|
|
25
28
|
var MuiListItem = require('@mui/material/ListItem');
|
|
26
29
|
var MuiListItemButton2 = require('@mui/material/ListItemButton');
|
|
27
30
|
var ListItemIcon2 = require('@mui/material/ListItemIcon');
|
|
28
|
-
var MuiListItemText = require('@mui/material/ListItemText');
|
|
29
31
|
var MuiListItemAvatar = require('@mui/material/ListItemAvatar');
|
|
30
32
|
var MuiListSubheader = require('@mui/material/ListSubheader');
|
|
31
33
|
var MuiTable = require('@mui/material/Table');
|
|
@@ -64,6 +66,10 @@ var MuiSnackbar = require('@mui/material/Snackbar');
|
|
|
64
66
|
var MuiDrawer = require('@mui/material/Drawer');
|
|
65
67
|
var Box = require('@mui/material/Box');
|
|
66
68
|
var IconButton = require('@mui/material/IconButton');
|
|
69
|
+
var LineChart$1 = require('@mui/x-charts/LineChart');
|
|
70
|
+
var material = require('@mui/material');
|
|
71
|
+
var BarChart$1 = require('@mui/x-charts/BarChart');
|
|
72
|
+
var PieChart$1 = require('@mui/x-charts/PieChart');
|
|
67
73
|
|
|
68
74
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
69
75
|
|
|
@@ -77,6 +83,9 @@ var MuiRadioGroup__default = /*#__PURE__*/_interopDefault(MuiRadioGroup);
|
|
|
77
83
|
var MuiRadio__default = /*#__PURE__*/_interopDefault(MuiRadio);
|
|
78
84
|
var MuiSelect__default = /*#__PURE__*/_interopDefault(MuiSelect);
|
|
79
85
|
var MuiMenuItem__default = /*#__PURE__*/_interopDefault(MuiMenuItem);
|
|
86
|
+
var MuiListItemText__default = /*#__PURE__*/_interopDefault(MuiListItemText);
|
|
87
|
+
var MuiFormControl__default = /*#__PURE__*/_interopDefault(MuiFormControl);
|
|
88
|
+
var MuiInputLabel__default = /*#__PURE__*/_interopDefault(MuiInputLabel);
|
|
80
89
|
var MuiSwitch__default = /*#__PURE__*/_interopDefault(MuiSwitch);
|
|
81
90
|
var MuiTextField__default = /*#__PURE__*/_interopDefault(MuiTextField);
|
|
82
91
|
var MuiToggleButton__default = /*#__PURE__*/_interopDefault(MuiToggleButton);
|
|
@@ -88,7 +97,6 @@ var MuiList__default = /*#__PURE__*/_interopDefault(MuiList);
|
|
|
88
97
|
var MuiListItem__default = /*#__PURE__*/_interopDefault(MuiListItem);
|
|
89
98
|
var MuiListItemButton2__default = /*#__PURE__*/_interopDefault(MuiListItemButton2);
|
|
90
99
|
var ListItemIcon2__default = /*#__PURE__*/_interopDefault(ListItemIcon2);
|
|
91
|
-
var MuiListItemText__default = /*#__PURE__*/_interopDefault(MuiListItemText);
|
|
92
100
|
var MuiListItemAvatar__default = /*#__PURE__*/_interopDefault(MuiListItemAvatar);
|
|
93
101
|
var MuiListSubheader__default = /*#__PURE__*/_interopDefault(MuiListSubheader);
|
|
94
102
|
var MuiTable__default = /*#__PURE__*/_interopDefault(MuiTable);
|
|
@@ -572,47 +580,33 @@ var chartColors = {
|
|
|
572
580
|
tooltipBg: colors.gray[950],
|
|
573
581
|
tooltipFg: colors.base.white,
|
|
574
582
|
crosshairFg: colors.gray[500],
|
|
575
|
-
legendFg:
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
series7Bg: colors.fuchsia[100],
|
|
603
|
-
series7BgHover: colors.fuchsia[200],
|
|
604
|
-
series8Fg: colors.orangeDark[600],
|
|
605
|
-
series8FgHover: colors.orangeDark[700],
|
|
606
|
-
series8Bg: colors.orangeDark[100],
|
|
607
|
-
series8BgHover: colors.orangeDark[200],
|
|
608
|
-
series9Fg: colors.green[600],
|
|
609
|
-
series9FgHover: colors.green[700],
|
|
610
|
-
series9Bg: colors.green[100],
|
|
611
|
-
series9BgHover: colors.green[200],
|
|
612
|
-
series10Fg: colors.indigo[600],
|
|
613
|
-
series10FgHover: colors.indigo[700],
|
|
614
|
-
series10Bg: colors.indigo[100],
|
|
615
|
-
series10BgHover: colors.indigo[200]
|
|
583
|
+
legendFg: text.tertiary,
|
|
584
|
+
categorical: [
|
|
585
|
+
"#7B61FF",
|
|
586
|
+
"#FF7E67",
|
|
587
|
+
"#76DFD5",
|
|
588
|
+
"#F6C343",
|
|
589
|
+
"#B36A6F",
|
|
590
|
+
"#71BCF6",
|
|
591
|
+
"#FFB076",
|
|
592
|
+
"#11819D",
|
|
593
|
+
"#3CB371",
|
|
594
|
+
"#FFBCAE",
|
|
595
|
+
"#C87EED",
|
|
596
|
+
"#76C5AF"
|
|
597
|
+
],
|
|
598
|
+
vibrant: [
|
|
599
|
+
"#6B38FB",
|
|
600
|
+
// 1. Deep Purple
|
|
601
|
+
"#E85B22",
|
|
602
|
+
// 2. Deep Orange
|
|
603
|
+
"#4AABFF",
|
|
604
|
+
// 3. Bright Blue
|
|
605
|
+
"#E83B1A",
|
|
606
|
+
// 4. True Red
|
|
607
|
+
"#E02088"
|
|
608
|
+
// 5. Magenta
|
|
609
|
+
]
|
|
616
610
|
};
|
|
617
611
|
var alpha = {
|
|
618
612
|
white: {
|
|
@@ -2028,7 +2022,6 @@ var forestPreset = {
|
|
|
2028
2022
|
// src/theme/presets/alkemy-plus.ts
|
|
2029
2023
|
var red = {
|
|
2030
2024
|
50: "#fef2f2",
|
|
2031
|
-
100: "#fee2e2",
|
|
2032
2025
|
200: "#fecaca",
|
|
2033
2026
|
600: "#dc2626",
|
|
2034
2027
|
700: "#b91c1c",
|
|
@@ -2318,47 +2311,48 @@ var chartColors2 = {
|
|
|
2318
2311
|
tooltipBg: colors2.gray[950],
|
|
2319
2312
|
tooltipFg: colors2.base.white,
|
|
2320
2313
|
crosshairFg: colors2.gray[500],
|
|
2321
|
-
legendFg:
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2314
|
+
legendFg: text2.tertiary,
|
|
2315
|
+
categorical: [
|
|
2316
|
+
"#7B61FF",
|
|
2317
|
+
"#FF7E67",
|
|
2318
|
+
"#76DFD5",
|
|
2319
|
+
"#F6C343",
|
|
2320
|
+
"#B36A6F",
|
|
2321
|
+
"#71BCF6",
|
|
2322
|
+
"#FFB076",
|
|
2323
|
+
"#11819D",
|
|
2324
|
+
"#3CB371",
|
|
2325
|
+
"#FFBCAE",
|
|
2326
|
+
"#C87EED",
|
|
2327
|
+
"#76C5AF"
|
|
2328
|
+
],
|
|
2329
|
+
vibrant: [
|
|
2330
|
+
"#6B38FB",
|
|
2331
|
+
"#E85B22",
|
|
2332
|
+
"#4AABFF",
|
|
2333
|
+
"#E83B1A",
|
|
2334
|
+
"#E02088"
|
|
2335
|
+
],
|
|
2336
|
+
series6Fg: colors2.brand[400],
|
|
2337
|
+
series6FgHover: colors2.brand[500],
|
|
2338
|
+
series6Bg: colors2.brand[100],
|
|
2339
|
+
series6BgHover: colors2.brand[200],
|
|
2346
2340
|
series7Fg: colors2.fuchsia[600],
|
|
2347
2341
|
series7FgHover: colors2.fuchsia[700],
|
|
2348
2342
|
series7Bg: colors2.fuchsia[100],
|
|
2349
2343
|
series7BgHover: colors2.fuchsia[200],
|
|
2350
|
-
series8Fg: colors2.
|
|
2351
|
-
series8FgHover: colors2.
|
|
2352
|
-
series8Bg: colors2.
|
|
2353
|
-
series8BgHover: colors2.
|
|
2354
|
-
series9Fg: colors2.
|
|
2355
|
-
series9FgHover: colors2.
|
|
2356
|
-
series9Bg: colors2.
|
|
2357
|
-
series9BgHover: colors2.
|
|
2358
|
-
series10Fg: colors2.
|
|
2359
|
-
series10FgHover: colors2.
|
|
2360
|
-
series10Bg: colors2.
|
|
2361
|
-
series10BgHover: colors2.
|
|
2344
|
+
series8Fg: colors2.teal[600],
|
|
2345
|
+
series8FgHover: colors2.teal[700],
|
|
2346
|
+
series8Bg: colors2.teal[100],
|
|
2347
|
+
series8BgHover: colors2.teal[200],
|
|
2348
|
+
series9Fg: colors2.indigo[600],
|
|
2349
|
+
series9FgHover: colors2.indigo[700],
|
|
2350
|
+
series9Bg: colors2.indigo[100],
|
|
2351
|
+
series9BgHover: colors2.indigo[200],
|
|
2352
|
+
series10Fg: colors2.green[600],
|
|
2353
|
+
series10FgHover: colors2.green[700],
|
|
2354
|
+
series10Bg: colors2.green[100],
|
|
2355
|
+
series10BgHover: colors2.green[200]
|
|
2362
2356
|
};
|
|
2363
2357
|
var focusRings2 = {
|
|
2364
2358
|
brand: "0px 0px 0px 4px #f040403d",
|
|
@@ -2488,6 +2482,64 @@ function Select(props) {
|
|
|
2488
2482
|
function MenuItem(props) {
|
|
2489
2483
|
return /* @__PURE__ */ jsxRuntime.jsx(MuiMenuItem__default.default, { ...props });
|
|
2490
2484
|
}
|
|
2485
|
+
function MultiSelect({
|
|
2486
|
+
options,
|
|
2487
|
+
value,
|
|
2488
|
+
onChange,
|
|
2489
|
+
selectAll = true,
|
|
2490
|
+
selectAllLabel = "Select All",
|
|
2491
|
+
label,
|
|
2492
|
+
...rest
|
|
2493
|
+
}) {
|
|
2494
|
+
const allSelected = options.length > 0 && value.length === options.length;
|
|
2495
|
+
const handleChange = (event) => {
|
|
2496
|
+
const selected = event.target.value;
|
|
2497
|
+
const arr = typeof selected === "string" ? selected.split(",") : selected;
|
|
2498
|
+
onChange(arr);
|
|
2499
|
+
};
|
|
2500
|
+
const handleSelectAll = (e) => {
|
|
2501
|
+
e.stopPropagation();
|
|
2502
|
+
onChange(allSelected ? [] : options.map((o) => o.value));
|
|
2503
|
+
};
|
|
2504
|
+
const labelMap = new Map(options.map((o) => [o.value, o.label]));
|
|
2505
|
+
const renderValue2 = (selected) => selected.map((v) => {
|
|
2506
|
+
var _a;
|
|
2507
|
+
return (_a = labelMap.get(v)) != null ? _a : v;
|
|
2508
|
+
}).join(", ");
|
|
2509
|
+
const labelId = label ? `forest-multiselect-${String(label).replace(/\s+/g, "-").toLowerCase()}` : void 0;
|
|
2510
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(MuiFormControl__default.default, { fullWidth: true, children: [
|
|
2511
|
+
label && /* @__PURE__ */ jsxRuntime.jsx(MuiInputLabel__default.default, { id: labelId, shrink: value.length > 0, children: label }),
|
|
2512
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2513
|
+
MuiSelect__default.default,
|
|
2514
|
+
{
|
|
2515
|
+
labelId,
|
|
2516
|
+
label,
|
|
2517
|
+
multiple: true,
|
|
2518
|
+
notched: value.length > 0,
|
|
2519
|
+
value,
|
|
2520
|
+
onChange: handleChange,
|
|
2521
|
+
displayEmpty: true,
|
|
2522
|
+
renderValue: renderValue2,
|
|
2523
|
+
...rest,
|
|
2524
|
+
children: [
|
|
2525
|
+
selectAll && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2526
|
+
MuiButton__default.default,
|
|
2527
|
+
{
|
|
2528
|
+
size: "small",
|
|
2529
|
+
variant: "text",
|
|
2530
|
+
onMouseDown: handleSelectAll,
|
|
2531
|
+
children: allSelected ? "Deselect All" : selectAllLabel
|
|
2532
|
+
}
|
|
2533
|
+
),
|
|
2534
|
+
options.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(MuiMenuItem__default.default, { value: option.value, children: [
|
|
2535
|
+
/* @__PURE__ */ jsxRuntime.jsx(MuiCheckbox__default.default, { checked: value.includes(option.value) }),
|
|
2536
|
+
/* @__PURE__ */ jsxRuntime.jsx(MuiListItemText__default.default, { primary: option.label })
|
|
2537
|
+
] }, option.value))
|
|
2538
|
+
]
|
|
2539
|
+
}
|
|
2540
|
+
)
|
|
2541
|
+
] });
|
|
2542
|
+
}
|
|
2491
2543
|
function Switch(props) {
|
|
2492
2544
|
return /* @__PURE__ */ jsxRuntime.jsx(MuiSwitch__default.default, { ...props });
|
|
2493
2545
|
}
|
|
@@ -2797,6 +2849,359 @@ function SidebarItem({
|
|
|
2797
2849
|
endAdornment
|
|
2798
2850
|
] });
|
|
2799
2851
|
}
|
|
2852
|
+
function useChartColors(count, palette2 = "categorical") {
|
|
2853
|
+
const theme = styles.useTheme();
|
|
2854
|
+
const chart = theme.palette.chart;
|
|
2855
|
+
const colors3 = chart[palette2] || chart.categorical || [
|
|
2856
|
+
"#7B61FF",
|
|
2857
|
+
"#FF7E67",
|
|
2858
|
+
"#76DFD5",
|
|
2859
|
+
"#F6C343",
|
|
2860
|
+
"#B36A6F"
|
|
2861
|
+
];
|
|
2862
|
+
return colors3.slice(0, Math.min(count, colors3.length));
|
|
2863
|
+
}
|
|
2864
|
+
function formatDate(date) {
|
|
2865
|
+
if (!date) return "";
|
|
2866
|
+
const d = new Date(date);
|
|
2867
|
+
if (isNaN(d.getTime())) return String(date);
|
|
2868
|
+
return d.toLocaleDateString("en-US", {
|
|
2869
|
+
weekday: "short",
|
|
2870
|
+
month: "short",
|
|
2871
|
+
day: "numeric",
|
|
2872
|
+
year: "numeric"
|
|
2873
|
+
});
|
|
2874
|
+
}
|
|
2875
|
+
function renderValue(val) {
|
|
2876
|
+
if (val == null) return "0";
|
|
2877
|
+
if (typeof val === "object" && "y" in val) {
|
|
2878
|
+
return String(val.y);
|
|
2879
|
+
}
|
|
2880
|
+
return String(val);
|
|
2881
|
+
}
|
|
2882
|
+
function CustomTooltip(props) {
|
|
2883
|
+
const { series, axisValue, dataIndex } = props;
|
|
2884
|
+
const theme = styles.useTheme();
|
|
2885
|
+
if (dataIndex == null) {
|
|
2886
|
+
return null;
|
|
2887
|
+
}
|
|
2888
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2889
|
+
material.Box,
|
|
2890
|
+
{
|
|
2891
|
+
sx: {
|
|
2892
|
+
backgroundColor: theme.palette.common.white,
|
|
2893
|
+
borderRadius: "12px",
|
|
2894
|
+
boxShadow: "0px 12px 24px -4px #1018281a, 0px 4px 8px -2px #1018280f",
|
|
2895
|
+
// Very high elevation shadow per reference
|
|
2896
|
+
padding: "16px",
|
|
2897
|
+
minWidth: "200px",
|
|
2898
|
+
display: "flex",
|
|
2899
|
+
flexDirection: "column",
|
|
2900
|
+
gap: "12px",
|
|
2901
|
+
borderTop: `1px solid ${theme.palette.divider}`,
|
|
2902
|
+
borderRight: `1px solid ${theme.palette.divider}`,
|
|
2903
|
+
borderBottom: `1px solid ${theme.palette.divider}`,
|
|
2904
|
+
borderLeft: `4px solid ${theme.palette.chart.series1Fg}`
|
|
2905
|
+
// Primary Accent line
|
|
2906
|
+
},
|
|
2907
|
+
children: [
|
|
2908
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2909
|
+
material.Typography,
|
|
2910
|
+
{
|
|
2911
|
+
variant: "body2",
|
|
2912
|
+
sx: {
|
|
2913
|
+
fontWeight: 600,
|
|
2914
|
+
color: theme.palette.text.primary,
|
|
2915
|
+
marginBottom: "4px"
|
|
2916
|
+
},
|
|
2917
|
+
children: formatDate(axisValue)
|
|
2918
|
+
}
|
|
2919
|
+
),
|
|
2920
|
+
series.map((s) => {
|
|
2921
|
+
const color = typeof s.getColor === "function" ? s.getColor(dataIndex) : s.color;
|
|
2922
|
+
const value = s.data ? s.data[dataIndex] : null;
|
|
2923
|
+
if (value == null) return null;
|
|
2924
|
+
return /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { display: "flex", flexDirection: "column", gap: "6px" }, children: /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { display: "flex", alignItems: "center", gap: "8px" }, children: [
|
|
2925
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2926
|
+
material.Box,
|
|
2927
|
+
{
|
|
2928
|
+
sx: {
|
|
2929
|
+
width: 16,
|
|
2930
|
+
height: 16,
|
|
2931
|
+
borderRadius: "4px",
|
|
2932
|
+
backgroundColor: color,
|
|
2933
|
+
flexShrink: 0
|
|
2934
|
+
}
|
|
2935
|
+
}
|
|
2936
|
+
),
|
|
2937
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2938
|
+
material.Typography,
|
|
2939
|
+
{
|
|
2940
|
+
variant: "body2",
|
|
2941
|
+
sx: {
|
|
2942
|
+
color: theme.palette.text.secondary,
|
|
2943
|
+
display: "flex",
|
|
2944
|
+
alignItems: "center",
|
|
2945
|
+
gap: "6px"
|
|
2946
|
+
},
|
|
2947
|
+
children: [
|
|
2948
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2949
|
+
material.Box,
|
|
2950
|
+
{
|
|
2951
|
+
component: "span",
|
|
2952
|
+
sx: {
|
|
2953
|
+
backgroundColor: theme.palette.grey[50] || "#f9fafb",
|
|
2954
|
+
padding: "2px 6px",
|
|
2955
|
+
borderRadius: "4px",
|
|
2956
|
+
fontWeight: 500,
|
|
2957
|
+
color: theme.palette.text.primary,
|
|
2958
|
+
border: `1px solid ${theme.palette.divider}`
|
|
2959
|
+
},
|
|
2960
|
+
children: renderValue(value)
|
|
2961
|
+
}
|
|
2962
|
+
),
|
|
2963
|
+
" ",
|
|
2964
|
+
"events"
|
|
2965
|
+
]
|
|
2966
|
+
}
|
|
2967
|
+
)
|
|
2968
|
+
] }) }, s.id);
|
|
2969
|
+
})
|
|
2970
|
+
]
|
|
2971
|
+
}
|
|
2972
|
+
);
|
|
2973
|
+
}
|
|
2974
|
+
function LineChart({ series, colors: colors3, palette: palette2 = "categorical", ...props }) {
|
|
2975
|
+
var _a, _b;
|
|
2976
|
+
const theme = styles.useTheme();
|
|
2977
|
+
const chart = theme.palette.chart;
|
|
2978
|
+
const seriesColors = useChartColors((_a = series == null ? void 0 : series.length) != null ? _a : 0, palette2);
|
|
2979
|
+
const modifiedSeries = series == null ? void 0 : series.map((s) => {
|
|
2980
|
+
var _a2, _b2;
|
|
2981
|
+
return {
|
|
2982
|
+
...s,
|
|
2983
|
+
curve: (_a2 = s.curve) != null ? _a2 : "monotoneX",
|
|
2984
|
+
highlightScope: (_b2 = s.highlightScope) != null ? _b2 : { highlighted: "item", faded: "global" }
|
|
2985
|
+
};
|
|
2986
|
+
});
|
|
2987
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2988
|
+
LineChart$1.LineChart,
|
|
2989
|
+
{
|
|
2990
|
+
series: modifiedSeries != null ? modifiedSeries : [],
|
|
2991
|
+
colors: colors3 != null ? colors3 : seriesColors,
|
|
2992
|
+
grid: { horizontal: true },
|
|
2993
|
+
slots: {
|
|
2994
|
+
axisContent: CustomTooltip
|
|
2995
|
+
},
|
|
2996
|
+
slotProps: {
|
|
2997
|
+
legend: {
|
|
2998
|
+
itemMarkWidth: 12,
|
|
2999
|
+
itemMarkHeight: 12,
|
|
3000
|
+
padding: { bottom: 20 }
|
|
3001
|
+
}
|
|
3002
|
+
},
|
|
3003
|
+
sx: {
|
|
3004
|
+
"& .MuiChartsAxis-line": { stroke: chart.axisFg },
|
|
3005
|
+
"& .MuiChartsAxis-tick": { stroke: chart.axisFg },
|
|
3006
|
+
"& .MuiChartsAxis-tickLabel": {
|
|
3007
|
+
fill: chart.labelFg,
|
|
3008
|
+
fontFamily: theme.typography.fontFamily,
|
|
3009
|
+
fontSize: typeof theme.typography.body2.fontSize === "number" ? theme.typography.body2.fontSize : 12
|
|
3010
|
+
},
|
|
3011
|
+
"& .MuiChartsAxis-label": {
|
|
3012
|
+
fill: chart.labelFgEmphasis,
|
|
3013
|
+
fontFamily: theme.typography.fontFamily,
|
|
3014
|
+
fontSize: typeof theme.typography.body1.fontSize === "number" ? theme.typography.body1.fontSize : 14,
|
|
3015
|
+
fontWeight: theme.typography.fontWeightMedium
|
|
3016
|
+
},
|
|
3017
|
+
"& .MuiChartsGrid-line": {
|
|
3018
|
+
stroke: chart.gridlineFg,
|
|
3019
|
+
strokeDasharray: "4 4"
|
|
3020
|
+
},
|
|
3021
|
+
"& .MuiChartsLegend-series text": {
|
|
3022
|
+
fill: chart.legendFg,
|
|
3023
|
+
fontFamily: theme.typography.fontFamily,
|
|
3024
|
+
fontSize: "14px !important"
|
|
3025
|
+
},
|
|
3026
|
+
"& .MuiChartsLegend-mark": {
|
|
3027
|
+
ry: 4,
|
|
3028
|
+
rx: 4,
|
|
3029
|
+
width: 12,
|
|
3030
|
+
height: 12
|
|
3031
|
+
},
|
|
3032
|
+
"& .MuiChartsTooltip-root": {
|
|
3033
|
+
fontFamily: theme.typography.fontFamily,
|
|
3034
|
+
fontSize: typeof theme.typography.body1.fontSize === "number" ? theme.typography.body1.fontSize : 14
|
|
3035
|
+
},
|
|
3036
|
+
"& .MuiChartsTooltip-table": {
|
|
3037
|
+
backgroundColor: chart.tooltipBg,
|
|
3038
|
+
color: chart.tooltipFg,
|
|
3039
|
+
borderRadius: theme.shape.borderRadius,
|
|
3040
|
+
boxShadow: theme.shadows[4]
|
|
3041
|
+
},
|
|
3042
|
+
"& .MuiLineElement-root": {
|
|
3043
|
+
strokeWidth: 3
|
|
3044
|
+
// Thicker lines for line charts
|
|
3045
|
+
},
|
|
3046
|
+
...(_b = props.sx) != null ? _b : {}
|
|
3047
|
+
},
|
|
3048
|
+
...props
|
|
3049
|
+
}
|
|
3050
|
+
);
|
|
3051
|
+
}
|
|
3052
|
+
function BarChart({ series, colors: colors3, palette: palette2 = "categorical", ...props }) {
|
|
3053
|
+
var _a, _b;
|
|
3054
|
+
const theme = styles.useTheme();
|
|
3055
|
+
const chart = theme.palette.chart;
|
|
3056
|
+
const seriesColors = useChartColors((_a = series == null ? void 0 : series.length) != null ? _a : 0, palette2);
|
|
3057
|
+
const resolvedColors = colors3 != null ? colors3 : seriesColors;
|
|
3058
|
+
const modifiedSeries = series == null ? void 0 : series.map((s, idx) => {
|
|
3059
|
+
var _a2;
|
|
3060
|
+
const baseColor = s.color || resolvedColors[idx % resolvedColors.length];
|
|
3061
|
+
const actualColor = s.variant === "striped" ? `url(#striped-pattern-${idx})` : baseColor;
|
|
3062
|
+
const { variant, ...rest } = s;
|
|
3063
|
+
return {
|
|
3064
|
+
...rest,
|
|
3065
|
+
color: actualColor,
|
|
3066
|
+
highlightScope: (_a2 = s.highlightScope) != null ? _a2 : { highlighted: "item", faded: "global" }
|
|
3067
|
+
};
|
|
3068
|
+
});
|
|
3069
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3070
|
+
BarChart$1.BarChart,
|
|
3071
|
+
{
|
|
3072
|
+
series: modifiedSeries != null ? modifiedSeries : [],
|
|
3073
|
+
colors: colors3 != null ? colors3 : seriesColors,
|
|
3074
|
+
grid: { horizontal: true },
|
|
3075
|
+
borderRadius: 4,
|
|
3076
|
+
slots: {
|
|
3077
|
+
axisContent: CustomTooltip
|
|
3078
|
+
},
|
|
3079
|
+
slotProps: {
|
|
3080
|
+
legend: {
|
|
3081
|
+
itemMarkWidth: 12,
|
|
3082
|
+
itemMarkHeight: 12,
|
|
3083
|
+
padding: { bottom: 20 }
|
|
3084
|
+
}
|
|
3085
|
+
},
|
|
3086
|
+
sx: {
|
|
3087
|
+
"& .MuiChartsAxis-line": { stroke: chart.axisFg },
|
|
3088
|
+
"& .MuiChartsAxis-tick": { stroke: chart.axisFg },
|
|
3089
|
+
"& .MuiChartsAxis-tickLabel": {
|
|
3090
|
+
fill: chart.labelFg,
|
|
3091
|
+
fontFamily: theme.typography.fontFamily,
|
|
3092
|
+
fontSize: typeof theme.typography.body2.fontSize === "number" ? theme.typography.body2.fontSize : 12
|
|
3093
|
+
// fallback to xs value conceptually if needed
|
|
3094
|
+
},
|
|
3095
|
+
"& .MuiChartsAxis-label": {
|
|
3096
|
+
fill: chart.labelFgEmphasis,
|
|
3097
|
+
fontFamily: theme.typography.fontFamily,
|
|
3098
|
+
fontSize: typeof theme.typography.body1.fontSize === "number" ? theme.typography.body1.fontSize : 14,
|
|
3099
|
+
fontWeight: theme.typography.fontWeightMedium
|
|
3100
|
+
},
|
|
3101
|
+
"& .MuiChartsGrid-line": {
|
|
3102
|
+
stroke: chart.gridlineFg,
|
|
3103
|
+
strokeDasharray: "4 4"
|
|
3104
|
+
},
|
|
3105
|
+
"& .MuiChartsLegend-series text": {
|
|
3106
|
+
fill: chart.legendFg,
|
|
3107
|
+
fontFamily: theme.typography.fontFamily,
|
|
3108
|
+
fontSize: "14px !important"
|
|
3109
|
+
},
|
|
3110
|
+
"& .MuiChartsLegend-mark": {
|
|
3111
|
+
ry: 4,
|
|
3112
|
+
rx: 4,
|
|
3113
|
+
width: 12,
|
|
3114
|
+
height: 12
|
|
3115
|
+
},
|
|
3116
|
+
"& .MuiChartsTooltip-root": {
|
|
3117
|
+
fontFamily: theme.typography.fontFamily,
|
|
3118
|
+
fontSize: typeof theme.typography.body1.fontSize === "number" ? theme.typography.body1.fontSize : 14
|
|
3119
|
+
},
|
|
3120
|
+
"& .MuiChartsTooltip-table": {
|
|
3121
|
+
backgroundColor: chart.tooltipBg,
|
|
3122
|
+
color: chart.tooltipFg,
|
|
3123
|
+
borderRadius: theme.shape.borderRadius,
|
|
3124
|
+
boxShadow: theme.shadows[4]
|
|
3125
|
+
// md equivalent in MUI default array length
|
|
3126
|
+
},
|
|
3127
|
+
...(_b = props.sx) != null ? _b : {}
|
|
3128
|
+
},
|
|
3129
|
+
...props,
|
|
3130
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: series == null ? void 0 : series.map((s, idx) => {
|
|
3131
|
+
if (s.variant !== "striped") return null;
|
|
3132
|
+
const baseColor = s.color || resolvedColors[idx % resolvedColors.length];
|
|
3133
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3134
|
+
"pattern",
|
|
3135
|
+
{
|
|
3136
|
+
id: `striped-pattern-${idx}`,
|
|
3137
|
+
patternUnits: "userSpaceOnUse",
|
|
3138
|
+
width: "8",
|
|
3139
|
+
height: "8",
|
|
3140
|
+
patternTransform: "rotate(45)",
|
|
3141
|
+
children: [
|
|
3142
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { width: "8", height: "8", fill: theme.palette.background.paper }),
|
|
3143
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "0", y: "0", x2: "0", y2: "8", stroke: baseColor, strokeWidth: "4" })
|
|
3144
|
+
]
|
|
3145
|
+
},
|
|
3146
|
+
`striped-${idx}`
|
|
3147
|
+
);
|
|
3148
|
+
}) })
|
|
3149
|
+
}
|
|
3150
|
+
);
|
|
3151
|
+
}
|
|
3152
|
+
function PieChart({ series, colors: colors3, palette: palette2 = "categorical", ...props }) {
|
|
3153
|
+
var _a, _b, _c, _d;
|
|
3154
|
+
const theme = styles.useTheme();
|
|
3155
|
+
const chart = theme.palette.chart;
|
|
3156
|
+
const sliceCount = (_c = (_b = (_a = series == null ? void 0 : series[0]) == null ? void 0 : _a.data) == null ? void 0 : _b.length) != null ? _c : 0;
|
|
3157
|
+
const seriesColors = useChartColors(sliceCount, palette2);
|
|
3158
|
+
const modifiedSeries = series == null ? void 0 : series.map((s) => {
|
|
3159
|
+
var _a2;
|
|
3160
|
+
return {
|
|
3161
|
+
...s,
|
|
3162
|
+
highlightScope: (_a2 = s.highlightScope) != null ? _a2 : { highlighted: "item", faded: "global" }
|
|
3163
|
+
};
|
|
3164
|
+
});
|
|
3165
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3166
|
+
PieChart$1.PieChart,
|
|
3167
|
+
{
|
|
3168
|
+
series: modifiedSeries != null ? modifiedSeries : [],
|
|
3169
|
+
colors: colors3 != null ? colors3 : seriesColors,
|
|
3170
|
+
slotProps: {
|
|
3171
|
+
legend: {
|
|
3172
|
+
itemMarkWidth: 12,
|
|
3173
|
+
itemMarkHeight: 12,
|
|
3174
|
+
padding: { bottom: 20 }
|
|
3175
|
+
}
|
|
3176
|
+
},
|
|
3177
|
+
sx: {
|
|
3178
|
+
"& .MuiChartsLegend-series text": {
|
|
3179
|
+
fill: chart.legendFg,
|
|
3180
|
+
fontFamily: theme.typography.fontFamily,
|
|
3181
|
+
fontSize: "14px !important"
|
|
3182
|
+
},
|
|
3183
|
+
"& .MuiChartsLegend-mark": {
|
|
3184
|
+
ry: 4,
|
|
3185
|
+
rx: 4,
|
|
3186
|
+
width: 12,
|
|
3187
|
+
height: 12
|
|
3188
|
+
},
|
|
3189
|
+
"& .MuiChartsTooltip-root": {
|
|
3190
|
+
fontFamily: theme.typography.fontFamily,
|
|
3191
|
+
fontSize: typeof theme.typography.body1.fontSize === "number" ? theme.typography.body1.fontSize : 14
|
|
3192
|
+
},
|
|
3193
|
+
"& .MuiChartsTooltip-table": {
|
|
3194
|
+
backgroundColor: chart.tooltipBg,
|
|
3195
|
+
color: chart.tooltipFg,
|
|
3196
|
+
borderRadius: theme.shape.borderRadius,
|
|
3197
|
+
boxShadow: theme.shadows[4]
|
|
3198
|
+
},
|
|
3199
|
+
...(_d = props.sx) != null ? _d : {}
|
|
3200
|
+
},
|
|
3201
|
+
...props
|
|
3202
|
+
}
|
|
3203
|
+
);
|
|
3204
|
+
}
|
|
2800
3205
|
|
|
2801
3206
|
exports.Accordion = Accordion;
|
|
2802
3207
|
exports.AccordionActions = AccordionActions;
|
|
@@ -2808,6 +3213,7 @@ exports.AppBar = AppBar;
|
|
|
2808
3213
|
exports.Autocomplete = Autocomplete;
|
|
2809
3214
|
exports.Backdrop = Backdrop;
|
|
2810
3215
|
exports.Badge = Badge;
|
|
3216
|
+
exports.BarChart = BarChart;
|
|
2811
3217
|
exports.Button = Button;
|
|
2812
3218
|
exports.ButtonGroup = ButtonGroup;
|
|
2813
3219
|
exports.Card = Card;
|
|
@@ -2827,6 +3233,7 @@ exports.DialogTitle = DialogTitle;
|
|
|
2827
3233
|
exports.Divider = Divider;
|
|
2828
3234
|
exports.Fab = Fab;
|
|
2829
3235
|
exports.ForestProvider = ForestProvider;
|
|
3236
|
+
exports.LineChart = LineChart;
|
|
2830
3237
|
exports.LinearProgress = LinearProgress;
|
|
2831
3238
|
exports.List = List;
|
|
2832
3239
|
exports.ListItem = ListItem;
|
|
@@ -2836,7 +3243,9 @@ exports.ListItemIcon = ListItemIcon;
|
|
|
2836
3243
|
exports.ListItemText = ListItemText;
|
|
2837
3244
|
exports.ListSubheader = ListSubheader;
|
|
2838
3245
|
exports.MenuItem = MenuItem;
|
|
3246
|
+
exports.MultiSelect = MultiSelect;
|
|
2839
3247
|
exports.Paper = Paper;
|
|
3248
|
+
exports.PieChart = PieChart;
|
|
2840
3249
|
exports.Radio = Radio;
|
|
2841
3250
|
exports.RadioGroup = RadioGroup;
|
|
2842
3251
|
exports.Select = Select;
|
|
@@ -2890,6 +3299,7 @@ exports.spacing = spacing;
|
|
|
2890
3299
|
exports.text = text;
|
|
2891
3300
|
exports.toggleColors = toggleColors;
|
|
2892
3301
|
exports.tokenShadows = shadows;
|
|
3302
|
+
exports.useChartColors = useChartColors;
|
|
2893
3303
|
exports.useSidebar = useSidebar;
|
|
2894
3304
|
exports.widths = widths;
|
|
2895
3305
|
//# sourceMappingURL=index.js.map
|