@dexteel/mesf-core 7.2.0 → 7.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/.release-please-manifest.json +1 -1
  2. package/CHANGELOG.md +7 -0
  3. package/dist/index.esm.js +125 -178
  4. package/dist/index.esm.js.map +1 -1
  5. package/package.json +1 -1
package/.release-please-manifest.json CHANGED
@@ -1,3 +1,3 @@
1
1
  {
2
- ".": "7.2.0"
2
+ ".": "7.2.1"
3
3
  }
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [7.2.1](https://github.com/dexteel/mesf-core-frontend/compare/@dexteel/mesf-core-v7.2.0...@dexteel/mesf-core-v7.2.1) (2025-11-19)
4
+
5
+
6
+ ### Bug Fixes
7
+
8
+ * **Trending V1:** adjust layout after mui v6 migration ([#553](https://github.com/dexteel/mesf-core-frontend/issues/553)) ([7496c71](https://github.com/dexteel/mesf-core-frontend/commit/7496c716aca2585cffc7e72ed26043cdde363b9d))
9
+
3
10
  ## [7.2.0](https://github.com/dexteel/mesf-core-frontend/compare/@dexteel/mesf-core-v7.1.0...@dexteel/mesf-core-v7.2.0) (2025-11-05)
4
11
 
5
12
 
package/dist/index.esm.js CHANGED
@@ -16190,43 +16190,44 @@ var LoadViewModal = function (_a) {
16190
16190
  React__default.createElement("input", { type: "checkbox", checked: allViewsChecked, onChange: handleAllViewsCheckbox }),
16191
16191
  React__default.createElement(Typography$1, null, "All Views")))),
16192
16192
  React__default.createElement(Grid2, { size: { md: 12 } },
16193
- React__default.createElement(Autocomplete, { size: "small", id: "list-of-views", noOptionsText: allViewsChecked
16193
+ React__default.createElement(Autocomplete$1, { size: "small", id: "list-of-views", noOptionsText: allViewsChecked
16194
16194
  ? "No views detected, please create a new view"
16195
- : "No private views detected, please create a new view .", options: allViewsChecked ? views : publicViews, getOptionLabel: function (option) { return option.ViewName; }, onChange: function (ev, val) { return setOptionSelected(val); }, defaultValue: optionSelected || viewSelected, style: { width: "100%" }, renderOption: function (option, state) { return (React__default.createElement("div", { style: {
16196
- display: "flex",
16197
- justifyContent: "flex-start",
16198
- alignItems: "center",
16199
- width: "100%",
16200
- } },
16201
- React__default.createElement("div", { style: {
16202
- flexGrow: 1,
16203
- } }, state.ViewName),
16195
+ : "No private views detected, please create a new view .", options: allViewsChecked ? views : publicViews, getOptionLabel: function (option) { return option.ViewName; }, onChange: function (ev, val) { return setOptionSelected(val); }, defaultValue: optionSelected || viewSelected, style: { width: "100%" }, renderOption: function (props, option) { return (React__default.createElement("li", __assign({}, props, { key: option.ViewId }),
16204
16196
  React__default.createElement("div", { style: {
16205
16197
  display: "flex",
16206
- justifyContent: "flex-end",
16198
+ justifyContent: "flex-start",
16207
16199
  alignItems: "center",
16208
- flex: 1,
16200
+ width: "100%",
16209
16201
  } },
16210
- state.IsPublic ? ("") : (React__default.createElement(React__default.Fragment, null,
16211
- React__default.createElement(Tooltip, { title: "Private", arrow: true },
16212
- React__default.createElement(LockIcon, { fontSize: "small", style: {
16213
- color: "black",
16202
+ React__default.createElement("div", { style: {
16203
+ flexGrow: 1,
16204
+ } }, option.ViewName),
16205
+ React__default.createElement("div", { style: {
16206
+ display: "flex",
16207
+ justifyContent: "flex-end",
16208
+ alignItems: "center",
16209
+ flex: 1,
16210
+ } },
16211
+ option.IsPublic ? ("") : (React__default.createElement(React__default.Fragment, null,
16212
+ React__default.createElement(Tooltip, { title: "Private", arrow: true },
16213
+ React__default.createElement(LockIcon, { fontSize: "small", style: {
16214
+ color: "black",
16215
+ height: "18px",
16216
+ width: "18px",
16217
+ cursor: "auto",
16218
+ } })))),
16219
+ React__default.createElement(IconButton$1, { onClick: function (e) { return handleEditView(option); } },
16220
+ React__default.createElement(CreateIcon, { fontSize: "small", color: "primary", style: {
16214
16221
  height: "18px",
16215
16222
  width: "18px",
16216
- cursor: "auto",
16217
- } })))),
16218
- React__default.createElement(IconButton$1, { onClick: function (e) { return handleEditView(state); } },
16219
- React__default.createElement(CreateIcon, { fontSize: "small", color: "primary", style: {
16220
- height: "18px",
16221
- width: "18px",
16222
- cursor: "pointer",
16223
- } })),
16224
- React__default.createElement(IconButton$1, { onClick: function (e) { return handleDeleteView(state, e); } },
16225
- React__default.createElement(DeleteIcon, { fontSize: "small", color: "secondary", style: {
16226
- height: "18px",
16227
- width: "18px",
16228
- cursor: "pointer",
16229
- } }))))); }, renderInput: function (params) { return (React__default.createElement(TextField, __assign({}, params, { label: "Views", variant: "outlined" }))); } })))) : (React__default.createElement(Typography$1, null, "No views detected, please add one")))),
16223
+ cursor: "pointer",
16224
+ } })),
16225
+ React__default.createElement(IconButton$1, { onClick: function (e) { return handleDeleteView(option, e); } },
16226
+ React__default.createElement(DeleteIcon, { fontSize: "small", color: "secondary", style: {
16227
+ height: "18px",
16228
+ width: "18px",
16229
+ cursor: "pointer",
16230
+ } })))))); }, renderInput: function (params) { return (React__default.createElement(TextField, __assign({}, params, { label: "Views", variant: "outlined" }))); } })))) : (React__default.createElement(Typography$1, null, "No views detected, please add one")))),
16230
16231
  React__default.createElement(MesfModal.Actions, null,
16231
16232
  React__default.createElement("div", { style: { paddingTop: "1rem" } },
16232
16233
  React__default.createElement(Button, { variant: "outlined", style: { marginRight: "1rem" }, color: "secondary", onClick: function () { return handleClose(false); } }, "Cancel"),
@@ -16337,7 +16338,7 @@ var SaveAsViewModal = function (_a) {
16337
16338
  React__default.createElement(Divider, null),
16338
16339
  React__default.createElement(MesfModal.Content, null,
16339
16340
  React__default.createElement(Grid2, { container: true, spacing: 5, style: { padding: "1rem" } },
16340
- React__default.createElement(Grid2, { size: { md: 12, xs: 12 }, style: { padding: "10px", width: "100%" } }, views.length && viewSelected ? (React__default.createElement(Autocomplete, { size: "small", id: "list-of-views", options: views, defaultValue: viewSelected, getOptionLabel: function (option) {
16341
+ React__default.createElement(Grid2, { size: { md: 12, xs: 12 }, style: { padding: "10px", width: "100%" } }, views.length && viewSelected ? (React__default.createElement(Autocomplete$1, { size: "small", id: "list-of-views", options: views, defaultValue: viewSelected, getOptionLabel: function (option) {
16341
16342
  if (typeof option === "string") {
16342
16343
  return option;
16343
16344
  }
@@ -17333,18 +17334,17 @@ var TableComponent = function (_a) {
17333
17334
  " ")));
17334
17335
  })) : (React__default.createElement(TableRow, null,
17335
17336
  React__default.createElement(TableCell, { colSpan: 12 },
17336
- React__default.createElement("div", { style: { padding: "1rem" } },
17337
- React__default.createElement("div", { style: { padding: "1rem" } },
17338
- "No tag view detected.",
17339
- " "),
17340
- React__default.createElement("div", { style: { padding: "1rem" } },
17341
- React__default.createElement(Button, { onClick: function () { return setTagsTreeModalOpen(true); }, variant: "contained", color: "primary" },
17342
- " ",
17343
- "Add tag")),
17344
- React__default.createElement("div", null,
17345
- React__default.createElement(Button, { onClick: function () { return setLoadViewOpen(true); }, variant: "outlined", color: "primary" },
17346
- " ",
17347
- "Load view")))))))))),
17337
+ React__default.createElement(Box, { sx: {
17338
+ display: "flex",
17339
+ flexDirection: "column",
17340
+ alignItems: "center",
17341
+ justifyContent: "center",
17342
+ padding: 4,
17343
+ gap: 2,
17344
+ } },
17345
+ React__default.createElement("div", null, "No tag view detected."),
17346
+ React__default.createElement(Button, { onClick: function () { return setTagsTreeModalOpen(true); }, variant: "contained", color: "primary" }, "Add tag"),
17347
+ React__default.createElement(Button, { onClick: function () { return setLoadViewOpen(true); }, variant: "outlined", color: "primary" }, "Load view"))))))))),
17348
17348
  React__default.createElement(TagsTreeModal, { open: tagsTreeModalOpen, handleClose: handleClose, onTagSelect: handleTagSelect }),
17349
17349
  React__default.createElement(SaveAsViewModal, { open: saveAsViewModalOpen, handleClose: function (shouldUpdate) { return __awaiter(void 0, void 0, void 0, function () {
17350
17350
  return __generator(this, function (_a) {
@@ -17365,7 +17365,7 @@ var TableComponent = function (_a) {
17365
17365
  } })),
17366
17366
  React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } }),
17367
17367
  React__default.createElement(Snackbar, { open: !!snackbarMessage, autoHideDuration: 800, onClose: handleCloseSnackbar },
17368
- React__default.createElement(Alert$2, { onClose: handleCloseSnackbar, severity: "success" }, snackbarMessage))));
17368
+ React__default.createElement(Alert$3, { onClose: handleCloseSnackbar, severity: "success" }, snackbarMessage))));
17369
17369
  };
17370
17370
 
17371
17371
  var formatDateTimeToString = function (date) {
@@ -17510,7 +17510,7 @@ var CustomOptionsComponent = function (_a) {
17510
17510
  zoom: 1.5,
17511
17511
  },
17512
17512
  } },
17513
- React__default.createElement(FormControlLabel, { checked: customOptions.showGrid, control: React__default.createElement(Checkbox, { color: "primary" }), label: "Show Grid2", onChange: function (e, checked) {
17513
+ React__default.createElement(FormControlLabel, { checked: customOptions.showGrid, control: React__default.createElement(Checkbox, { color: "primary" }), label: "Show Grid", onChange: function (e, checked) {
17514
17514
  handleGridChange(checked);
17515
17515
  } })),
17516
17516
  React__default.createElement(Grid2, { sx: {
@@ -17595,142 +17595,89 @@ var Header = React__default.memo(function (_a) {
17595
17595
  useEffect(function () {
17596
17596
  setChartOptions(function (prevOptions) { return (__assign(__assign({}, prevOptions), { scales: __assign(__assign({}, prevOptions.scales), { x: __assign(__assign({}, prevOptions.scales.x), { min: state.timeScopeStart.getTime(), max: state.timeScopeEnd.getTime() }) }) })); });
17597
17597
  }, [state.timeScopeStart, state.timeScopeEnd]);
17598
- return (React__default.createElement(Grid2, { size: { xs: 12 }, container: true, justifyContent: "space-between", alignItems: "center", style: { height: "8%" } },
17599
- React__default.createElement(Grid2, { size: { md: 6 }, container: true, justifyContent: "flex-start", alignItems: "center", wrap: "wrap" },
17600
- React__default.createElement(Grid2, null,
17601
- React__default.createElement(IconButton$1, { color: "primary", onClick: function () { return handleDateNavigator("subtract"); }, sx: {
17602
- "& .MuiSvgIcon-root": {
17603
- cursor: "pointer !important",
17604
- height: "24px",
17605
- width: "24px",
17606
- "& svg": {
17607
- // Adjust the icon size as well
17608
- fontSize: "1.5rem",
17609
- },
17610
- },
17611
- color: "black",
17612
- } },
17613
- React__default.createElement(ChevronLeft, { fontSize: "large" }))),
17614
- React__default.createElement(Grid2, null,
17615
- React__default.createElement(TextField, { type: "datetime-local", sx: {
17616
- alignItems: "center",
17617
- "& .MuiInputBase-root": {
17618
- color: "black",
17619
- backgroundColor: "white",
17620
- borderRadius: function (theme) { return theme.shape.borderRadius; },
17621
- width: "90%",
17622
- minWidth: "90%",
17623
- maxWidth: "90%",
17624
- },
17625
- "& .MuiInputBase-input": {
17626
- fontSize: "0.75rem !important",
17627
- height: "15px !important",
17628
- paddingRight: "3px",
17629
- paddingLeft: "3px",
17630
- },
17631
- "& .MuiInput-underline:before": {
17632
- borderBottomColor: "rgba(0, 0, 0, 0.42)",
17633
- },
17634
- padding: 0,
17635
- }, label: "Start", variant: "outlined", value: moment$8(state.timeScopeStart).format("YYYY-MM-DDTHH:mm:ss"), onChange: function (e) { return handleDateChange(e.target.value, "start"); }, InputLabelProps: {
17636
- shrink: true,
17637
- style: { marginLeft: "10px" },
17638
- }, InputProps: {
17639
- max: state.timeScopeEnd,
17640
- } })),
17641
- React__default.createElement(Grid2, { sx: {
17642
- "& .MuiInput-root": {
17643
- width: "100%",
17644
- },
17645
- "& .MuiInputBase-root": {
17646
- color: "black",
17647
- backgroundColor: "white",
17648
- borderRadius: function (theme) { return theme.shape.borderRadius; },
17649
- minWidth: "100%",
17650
- },
17651
- "& .MuiInputBase-input": {
17652
- fontSize: "0.875rem !important",
17653
- height: "15px !important",
17654
- },
17655
- "& .MuiInput-underline:before": {
17656
- borderBottomColor: "rgba(0, 0, 0, 0.42)",
17657
- },
17658
- padding: 0,
17659
- } },
17660
- React__default.createElement(FormControl, { variant: "outlined" },
17661
- React__default.createElement(Select, { value: state.scope, onChange: function (e) { return handleChangeScope(e.target.value); }, displayEmpty: true },
17662
- React__default.createElement(MenuItem, { value: "10 min" }, "10 min"),
17663
- React__default.createElement(MenuItem, { value: "1 hour" }, "1 hour"),
17664
- React__default.createElement(MenuItem, { value: "4 hours" }, "4 hours"),
17665
- React__default.createElement(MenuItem, { value: "12 hours" }, "12 hours"),
17666
- React__default.createElement(MenuItem, { value: "1 day" }, "1 day"),
17667
- React__default.createElement(MenuItem, { value: "10 days" }, "10 days"),
17668
- React__default.createElement(MenuItem, { value: "custom" }, "Custom")))),
17669
- React__default.createElement(Grid2, null,
17670
- React__default.createElement(TextField, { label: "End", variant: "outlined", sx: {
17671
- alignItems: "center",
17672
- "& .MuiInputBase-root": {
17598
+ return (React__default.createElement(LocalizationProvider$1, { dateAdapter: AdapterMoment },
17599
+ React__default.createElement(Grid2, { size: { xs: 12 }, container: true, justifyContent: "space-between", alignItems: "center", style: { height: "8%" } },
17600
+ React__default.createElement(Grid2, { size: { md: 4 }, container: true, spacing: 1, justifyContent: "flex-start", alignItems: "center", wrap: "wrap" },
17601
+ React__default.createElement(Grid2, null,
17602
+ React__default.createElement(IconButton$1, { color: "primary", onClick: function () { return handleDateNavigator("subtract"); }, size: "small", sx: {
17603
+ padding: 0.5,
17673
17604
  color: "black",
17674
- backgroundColor: "white",
17675
- borderRadius: function (theme) { return theme.shape.borderRadius; },
17676
- width: "90%",
17677
- minWidth: "90%",
17678
- maxWidth: "90%",
17679
- },
17680
- "& .MuiInputBase-input": {
17681
- fontSize: "0.75rem !important",
17682
- height: "15px !important",
17683
- paddingRight: "3px",
17684
- paddingLeft: "3px",
17685
- },
17686
- "& .MuiInput-underline:before": {
17687
- borderBottomColor: "rgba(0, 0, 0, 0.42)",
17688
- },
17689
- padding: 0,
17690
- }, type: "datetime-local", value: autoRefresh
17691
- ? ""
17692
- : moment$8(state.timeScopeEnd).format("YYYY-MM-DDTHH:mm:ss"), onChange: function (e) { return handleDateChange(e.target.value, "end"); }, InputLabelProps: {
17693
- shrink: true,
17694
- style: { marginLeft: "10px" },
17695
- } })),
17696
- React__default.createElement(Grid2, null,
17697
- React__default.createElement(IconButton$1, { onClick: function () { return handleDateNavigator("add"); }, sx: {
17698
- "& .MuiSvgIcon-root": {
17699
- cursor: "pointer !important",
17700
- height: "24px",
17701
- width: "24px",
17702
- "& svg": {
17703
- // Adjust the icon size as well
17704
- fontSize: "1.5rem",
17705
- },
17706
- },
17707
- color: "black",
17708
- } },
17709
- React__default.createElement(ChevronRight, { fontSize: "large" }))),
17710
- React__default.createElement(Grid2, null,
17711
- React__default.createElement(IconButton$1, { onClick: function () { return handleDateNavigator("subtract", true); }, sx: {
17712
- "& .MuiSvgIcon-root": {
17713
- cursor: "pointer !important",
17714
- height: "24px",
17715
- width: "24px",
17716
- "& svg": {
17717
- // Adjust the icon size as well
17718
- fontSize: "1.5rem",
17605
+ } },
17606
+ React__default.createElement(ChevronLeft, { fontSize: "medium" }))),
17607
+ React__default.createElement(Grid2, { size: { md: 4 } },
17608
+ React__default.createElement(DateTimePicker, { label: "Start", format: "MM/DD/YYYY HH:mm:ss", value: moment$8(state.timeScopeStart), onChange: function (newValue) {
17609
+ if (newValue) {
17610
+ handleDateChange(newValue.toDate(), "start");
17611
+ }
17612
+ }, minutesStep: 1, slotProps: {
17613
+ textField: {
17614
+ size: "small",
17615
+ variant: "outlined",
17616
+ fullWidth: true,
17719
17617
  },
17720
- },
17721
- color: "black",
17722
- } },
17723
- React__default.createElement(SkipNextIcon, { fontSize: "large" })))),
17724
- React__default.createElement(Grid2, { size: { md: 6 }, container: true, justifyContent: "space-between" },
17725
- React__default.createElement(Grid2, { container: true, wrap: "nowrap", spacing: 1 },
17726
- React__default.createElement(Grid2, { container: true },
17727
- React__default.createElement(CustomOptionsComponent, { customOptions: customOptions, setCustomOptions: setCustomOptions, autoRefresh: autoRefresh, setAutoRefresh: function (autoRefresh) {
17728
- if (autoRefresh) {
17729
- handleChangeScope("custom");
17730
- handleDateChange(new Date(), "end");
17618
+ } })),
17619
+ React__default.createElement(Grid2, { size: { md: 2 }, marginTop: 0.5 },
17620
+ React__default.createElement(FormControl, { variant: "outlined", size: "small", fullWidth: true },
17621
+ React__default.createElement(Select, { value: state.scope, onChange: function (e) {
17622
+ return handleChangeScope(e.target.value);
17623
+ }, displayEmpty: true },
17624
+ React__default.createElement(MenuItem, { value: "10 min" }, "10 min"),
17625
+ React__default.createElement(MenuItem, { value: "1 hour" }, "1 hour"),
17626
+ React__default.createElement(MenuItem, { value: "4 hours" }, "4 hours"),
17627
+ React__default.createElement(MenuItem, { value: "12 hours" }, "12 hours"),
17628
+ React__default.createElement(MenuItem, { value: "1 day" }, "1 day"),
17629
+ React__default.createElement(MenuItem, { value: "10 days" }, "10 days"),
17630
+ React__default.createElement(MenuItem, { value: "custom" }, "Custom")))),
17631
+ React__default.createElement(Grid2, { size: { md: 4 } },
17632
+ React__default.createElement(DateTimePicker, { label: "End", format: "MM/DD/YYYY HH:mm:ss", value: autoRefresh ? null : moment$8(state.timeScopeEnd), onChange: function (newValue) {
17633
+ if (newValue) {
17634
+ handleDateChange(newValue.toDate(), "end");
17731
17635
  }
17732
- setAutoRefresh(autoRefresh);
17733
- } }))))));
17636
+ }, minutesStep: 1, slotProps: {
17637
+ textField: {
17638
+ size: "small",
17639
+ variant: "outlined",
17640
+ fullWidth: true,
17641
+ },
17642
+ }, disabled: autoRefresh })),
17643
+ React__default.createElement(Grid2, null,
17644
+ React__default.createElement(IconButton$1, { onClick: function () { return handleDateNavigator("add"); }, sx: {
17645
+ "& .MuiSvgIcon-root": {
17646
+ cursor: "pointer !important",
17647
+ height: "24px",
17648
+ width: "24px",
17649
+ "& svg": {
17650
+ // Adjust the icon size as well
17651
+ fontSize: "1.5rem",
17652
+ },
17653
+ },
17654
+ color: "black",
17655
+ } },
17656
+ React__default.createElement(ChevronRight, { fontSize: "large" }))),
17657
+ React__default.createElement(Grid2, null,
17658
+ React__default.createElement(IconButton$1, { onClick: function () { return handleDateNavigator("subtract", true); }, sx: {
17659
+ "& .MuiSvgIcon-root": {
17660
+ cursor: "pointer !important",
17661
+ height: "24px",
17662
+ width: "24px",
17663
+ "& svg": {
17664
+ // Adjust the icon size as well
17665
+ fontSize: "1.5rem",
17666
+ },
17667
+ },
17668
+ color: "black",
17669
+ } },
17670
+ React__default.createElement(SkipNextIcon, { fontSize: "large" })))),
17671
+ React__default.createElement(Grid2, { size: { md: 6 }, container: true, justifyContent: "space-between" },
17672
+ React__default.createElement(Grid2, { container: true, wrap: "nowrap", spacing: 1 },
17673
+ React__default.createElement(Grid2, { container: true },
17674
+ React__default.createElement(CustomOptionsComponent, { customOptions: customOptions, setCustomOptions: setCustomOptions, autoRefresh: autoRefresh, setAutoRefresh: function (autoRefresh) {
17675
+ if (autoRefresh) {
17676
+ handleChangeScope("custom");
17677
+ handleDateChange(new Date(), "end");
17678
+ }
17679
+ setAutoRefresh(autoRefresh);
17680
+ } })))))));
17734
17681
  });
17735
17682
  Header.displayName = "Header";
17736
17683