@natoora-libs/core 0.1.8-dev-doug-2 → 0.1.9-dev-doug-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.
@@ -371,6 +371,7 @@ __export(components_exports, {
371
371
  ScrollableDialog: () => ScrollableDialog_default,
372
372
  SearchAndFilterHeader: () => SearchAndFilterHeader_default,
373
373
  SearchAndFilterHeaderForTable: () => SearchAndFilterHeaderForTable_default,
374
+ SearchFieldDebounced: () => SearchFieldDebounced,
374
375
  SearchWithFilters: () => SearchWithFilters_default,
375
376
  SearchWithFiltersForTable: () => SearchWithFiltersForTable_default,
376
377
  SectionName: () => SectionName_default,
@@ -382,6 +383,9 @@ __export(components_exports, {
382
383
  Switch: () => Switch_default,
383
384
  Table: () => Table_default,
384
385
  TableDesktop: () => TableDesktop_default,
386
+ TableDesktopRowActions: () => TableDesktopRowActions,
387
+ TableDesktopRowCell: () => TableDesktopRowCell,
388
+ TableDesktopSmartSelect: () => TableDesktopSmartSelect,
385
389
  TableEmptyResult: () => TableEmptyResult_default,
386
390
  TableHeader: () => TableHeader_default,
387
391
  TableLoading: () => TableLoading_default,
@@ -6496,11 +6500,60 @@ var SearchAndFilterHeaderForTable = (props) => {
6496
6500
  };
6497
6501
  var SearchAndFilterHeaderForTable_default = React4.memo(SearchAndFilterHeaderForTable);
6498
6502
 
6503
+ // src/components/SearchFieldDebounced/SearchFieldDebounced.tsx
6504
+ var import_react28 = require("react");
6505
+ var import_material53 = require("@mui/material");
6506
+ var import_Search = __toESM(require("@mui/icons-material/Search"), 1);
6507
+ var import_jsx_runtime104 = require("react/jsx-runtime");
6508
+ var SearchFieldDebounced = ({
6509
+ onSearch,
6510
+ initialValue = "",
6511
+ debounceMs = 500
6512
+ }) => {
6513
+ const [value, setValue] = (0, import_react28.useState)(initialValue);
6514
+ const debounceRef = (0, import_react28.useRef)(null);
6515
+ const handleChange = (e) => {
6516
+ setValue(e.target.value);
6517
+ if (debounceRef.current) {
6518
+ clearTimeout(debounceRef.current);
6519
+ }
6520
+ ;
6521
+ debounceRef.current = window.setTimeout(() => {
6522
+ onSearch(e.target.value);
6523
+ }, debounceMs);
6524
+ };
6525
+ (0, import_react28.useEffect)(() => {
6526
+ return () => {
6527
+ if (debounceRef.current) clearTimeout(debounceRef.current);
6528
+ };
6529
+ }, []);
6530
+ return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.Box, { width: 285, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
6531
+ import_material53.TextField,
6532
+ {
6533
+ fullWidth: true,
6534
+ variant: "outlined",
6535
+ placeholder: "Search",
6536
+ value,
6537
+ onChange: handleChange,
6538
+ slotProps: {
6539
+ input: {
6540
+ sx: {
6541
+ maxHeight: 5,
6542
+ px: 2,
6543
+ py: 2.5
6544
+ },
6545
+ startAdornment: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.InputAdornment, { position: "start", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_Search.default, { fontSize: "small" }) })
6546
+ }
6547
+ }
6548
+ }
6549
+ ) });
6550
+ };
6551
+
6499
6552
  // src/components/SectionName/SectionName.tsx
6500
6553
  var import_icons_material11 = require("@mui/icons-material");
6501
- var import_material53 = require("@mui/material");
6554
+ var import_material54 = require("@mui/material");
6502
6555
  var import_mui48 = require("tss-react/mui");
6503
- var import_jsx_runtime104 = require("react/jsx-runtime");
6556
+ var import_jsx_runtime105 = require("react/jsx-runtime");
6504
6557
  var useStyles43 = (0, import_mui48.makeStyles)()((theme) => ({
6505
6558
  container: {
6506
6559
  display: "flex",
@@ -6543,10 +6596,10 @@ var SectionName = ({
6543
6596
  openHistoryLog
6544
6597
  }) => {
6545
6598
  const { classes } = useStyles43();
6546
- return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(import_material53.Box, { className: classes.container, children: [
6547
- /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(import_material53.Box, { className: classes.titleContainer, children: [
6548
- /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
6549
- import_material53.Typography,
6599
+ return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_material54.Box, { className: classes.container, children: [
6600
+ /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_material54.Box, { className: classes.titleContainer, children: [
6601
+ /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6602
+ import_material54.Typography,
6550
6603
  {
6551
6604
  variant: "h5",
6552
6605
  component: "a",
@@ -6555,7 +6608,7 @@ var SectionName = ({
6555
6608
  children: name
6556
6609
  }
6557
6610
  ),
6558
- tooltipDescription ? /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.Tooltip, { title: tooltipDescription, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
6611
+ tooltipDescription ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.Tooltip, { title: tooltipDescription, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6559
6612
  import_icons_material11.Info,
6560
6613
  {
6561
6614
  fontSize: "small",
@@ -6564,8 +6617,8 @@ var SectionName = ({
6564
6617
  }
6565
6618
  ) }) : null
6566
6619
  ] }),
6567
- /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(import_material53.Box, { className: classes.actionButtons, children: [
6568
- buttonText ? /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
6620
+ /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(import_material54.Box, { className: classes.actionButtons, children: [
6621
+ buttonText ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6569
6622
  ExtendedButton_default,
6570
6623
  {
6571
6624
  type: buttonType,
@@ -6578,25 +6631,25 @@ var SectionName = ({
6578
6631
  variant: "text"
6579
6632
  }
6580
6633
  ) : null,
6581
- openHistoryLog && buttonText && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.Divider, { orientation: "vertical", sx: { height: "24px" } }),
6582
- openHistoryLog && /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_material53.IconButton, { size: "small", onClick: () => openHistoryLog(), children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_icons_material11.History, {}) })
6634
+ openHistoryLog && buttonText && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.Divider, { orientation: "vertical", sx: { height: "24px" } }),
6635
+ openHistoryLog && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.IconButton, { size: "small", onClick: () => openHistoryLog(), children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_icons_material11.History, {}) })
6583
6636
  ] })
6584
6637
  ] });
6585
6638
  };
6586
6639
  var SectionName_default = SectionName;
6587
6640
 
6588
6641
  // src/components/SmartSelect/SmartSelect.tsx
6589
- var import_react28 = require("react");
6590
- var import_material54 = require("@mui/material");
6642
+ var import_react29 = require("react");
6643
+ var import_material55 = require("@mui/material");
6591
6644
  var import_mui49 = require("tss-react/mui");
6592
- var import_jsx_runtime105 = require("react/jsx-runtime");
6645
+ var import_jsx_runtime106 = require("react/jsx-runtime");
6593
6646
  var useStyles44 = (0, import_mui49.makeStyles)()(() => ({
6594
6647
  container: {
6595
6648
  display: "flex",
6596
6649
  flexDirection: "column"
6597
6650
  }
6598
6651
  }));
6599
- var SmartSelect = (0, import_react28.forwardRef)(
6652
+ var SmartSelect = (0, import_react29.forwardRef)(
6600
6653
  ({
6601
6654
  value,
6602
6655
  defaultOption,
@@ -6615,9 +6668,9 @@ var SmartSelect = (0, import_react28.forwardRef)(
6615
6668
  menuProps
6616
6669
  }, ref) => {
6617
6670
  const { classes } = useStyles44();
6618
- const [open, setOpen] = (0, import_react28.useState)(false);
6619
- const [localOptions, setLocalOptions] = (0, import_react28.useState)(options || []);
6620
- (0, import_react28.useEffect)(() => {
6671
+ const [open, setOpen] = (0, import_react29.useState)(false);
6672
+ const [localOptions, setLocalOptions] = (0, import_react29.useState)(options || []);
6673
+ (0, import_react29.useEffect)(() => {
6621
6674
  if (options) {
6622
6675
  setLocalOptions(options);
6623
6676
  }
@@ -6656,8 +6709,8 @@ var SmartSelect = (0, import_react28.forwardRef)(
6656
6709
  onChange(selectedOption);
6657
6710
  }
6658
6711
  };
6659
- return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
6660
- import_material54.FormControl,
6712
+ return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
6713
+ import_material55.FormControl,
6661
6714
  {
6662
6715
  fullWidth: true,
6663
6716
  className: classes.container,
@@ -6666,21 +6719,21 @@ var SmartSelect = (0, import_react28.forwardRef)(
6666
6719
  "data-testid": dataTestId,
6667
6720
  disabled,
6668
6721
  children: [
6669
- inputLabel && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6670
- import_material54.InputLabel,
6722
+ inputLabel && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
6723
+ import_material55.InputLabel,
6671
6724
  {
6672
6725
  id: "smart-select-label",
6673
6726
  "data-testid": `${dataTestId}-label`,
6674
6727
  children: inputLabel
6675
6728
  }
6676
6729
  ),
6677
- /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
6678
- import_material54.Select,
6730
+ /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
6731
+ import_material55.Select,
6679
6732
  {
6680
6733
  ref,
6681
6734
  disabled,
6682
6735
  labelId: "smart-select-label",
6683
- value,
6736
+ value: value ?? "",
6684
6737
  onChange: handleChange,
6685
6738
  onOpen: handleOpen,
6686
6739
  error,
@@ -6691,26 +6744,26 @@ var SmartSelect = (0, import_react28.forwardRef)(
6691
6744
  MenuProps: menuProps,
6692
6745
  label: inputLabel,
6693
6746
  children: [
6694
- isFetching && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6695
- import_material54.MenuItem,
6747
+ isFetching && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
6748
+ import_material55.MenuItem,
6696
6749
  {
6697
6750
  disabled: true,
6698
6751
  "data-testid": `${dataTestId}-loading`,
6699
6752
  id: `${dataTestId}-loading`,
6700
- children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.CircularProgress, { size: 24 })
6753
+ children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.CircularProgress, { size: 24 })
6701
6754
  }
6702
6755
  ),
6703
- (defaultOption === null || !defaultOptionLabelIsValid || !defaultOptionValueIsValid) && !isFetching && options?.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.MenuItem, { disabled: true, "data-testid": `${dataTestId}-empty-message`, children: emptyMessage }),
6704
- localOptions.length === 0 && !isFetching && options?.length !== 0 && defaultOptionLabelIsValid && defaultOptionValueIsValid && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6705
- import_material54.MenuItem,
6756
+ (defaultOption === null || !defaultOptionLabelIsValid || !defaultOptionValueIsValid) && !isFetching && options?.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.MenuItem, { disabled: true, "data-testid": `${dataTestId}-empty-message`, children: emptyMessage }),
6757
+ localOptions.length === 0 && !isFetching && options?.length !== 0 && defaultOptionLabelIsValid && defaultOptionValueIsValid && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
6758
+ import_material55.MenuItem,
6706
6759
  {
6707
6760
  value: defaultOption?.value,
6708
6761
  "data-testid": `${dataTestId}-default-option`,
6709
6762
  children: defaultOption?.label
6710
6763
  }
6711
6764
  ),
6712
- !isFetching && combinedOptions.length > 0 && combinedOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
6713
- import_material54.MenuItem,
6765
+ !isFetching && combinedOptions.length > 0 && combinedOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
6766
+ import_material55.MenuItem,
6714
6767
  {
6715
6768
  value: option?.value,
6716
6769
  "data-testid": `${dataTestId}-option-${option?.value}`,
@@ -6722,7 +6775,7 @@ var SmartSelect = (0, import_react28.forwardRef)(
6722
6775
  ]
6723
6776
  }
6724
6777
  ),
6725
- helperText && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_material54.FormHelperText, { "data-testid": `${dataTestId}-helper-text`, children: helperText })
6778
+ helperText && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.FormHelperText, { "data-testid": `${dataTestId}-helper-text`, children: helperText })
6726
6779
  ]
6727
6780
  }
6728
6781
  );
@@ -6731,11 +6784,11 @@ var SmartSelect = (0, import_react28.forwardRef)(
6731
6784
  var SmartSelect_default = SmartSelect;
6732
6785
 
6733
6786
  // src/components/SquareLabel/SquareLabel.tsx
6734
- var import_react29 = require("react");
6735
- var import_material55 = require("@mui/material");
6787
+ var import_react30 = require("react");
6788
+ var import_material56 = require("@mui/material");
6736
6789
  var import_red2 = __toESM(require("@mui/material/colors/red"), 1);
6737
6790
  var import_mui50 = require("tss-react/mui");
6738
- var import_jsx_runtime106 = require("react/jsx-runtime");
6791
+ var import_jsx_runtime107 = require("react/jsx-runtime");
6739
6792
  var useStyles45 = (0, import_mui50.makeStyles)()((theme) => ({
6740
6793
  red: {
6741
6794
  backgroundColor: import_red2.default["50"],
@@ -6750,15 +6803,15 @@ var useStyles45 = (0, import_mui50.makeStyles)()((theme) => ({
6750
6803
  }));
6751
6804
  var SquareLabel = ({ color, copy }) => {
6752
6805
  const { classes } = useStyles45();
6753
- return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_material55.Typography, { className: classes[color], children: copy });
6806
+ return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_material56.Typography, { className: classes[color], children: copy });
6754
6807
  };
6755
- var SquareLabel_default = (0, import_react29.memo)(SquareLabel);
6808
+ var SquareLabel_default = (0, import_react30.memo)(SquareLabel);
6756
6809
 
6757
6810
  // src/components/Switch/Switch.tsx
6758
- var import_react30 = require("react");
6759
- var import_material56 = require("@mui/material");
6811
+ var import_react31 = require("react");
6812
+ var import_material57 = require("@mui/material");
6760
6813
  var import_mui51 = require("tss-react/mui");
6761
- var import_jsx_runtime107 = require("react/jsx-runtime");
6814
+ var import_jsx_runtime108 = require("react/jsx-runtime");
6762
6815
  var LSwitch = ({
6763
6816
  checked,
6764
6817
  labelOn,
@@ -6766,8 +6819,8 @@ var LSwitch = ({
6766
6819
  handleChange,
6767
6820
  classes,
6768
6821
  disabled
6769
- }) => /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: classes.c_switch, children: /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
6770
- import_material56.Grid2,
6822
+ }) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: classes.c_switch, children: /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
6823
+ import_material57.Grid2,
6771
6824
  {
6772
6825
  component: "label",
6773
6826
  container: true,
@@ -6776,9 +6829,9 @@ var LSwitch = ({
6776
6829
  alignItems: "center"
6777
6830
  },
6778
6831
  children: [
6779
- labelOff && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_material56.Grid2, { children: labelOff }),
6780
- /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_material56.Grid2, { children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
6781
- import_material56.Switch,
6832
+ labelOff && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Grid2, { children: labelOff }),
6833
+ /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Grid2, { children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6834
+ import_material57.Switch,
6782
6835
  {
6783
6836
  checked,
6784
6837
  color: "primary",
@@ -6786,7 +6839,7 @@ var LSwitch = ({
6786
6839
  disabled
6787
6840
  }
6788
6841
  ) }),
6789
- labelOn && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_material56.Grid2, { children: labelOn })
6842
+ labelOn && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Grid2, { children: labelOn })
6790
6843
  ]
6791
6844
  }
6792
6845
  ) });
@@ -6808,245 +6861,26 @@ var LabelledSwitch = (0, import_mui51.withStyles)(LSwitch, (theme) => ({
6808
6861
  fontSize: "1rem"
6809
6862
  }
6810
6863
  }));
6811
- var Switch_default = (0, import_react30.memo)(LabelledSwitch);
6864
+ var Switch_default = (0, import_react31.memo)(LabelledSwitch);
6812
6865
 
6813
6866
  // src/components/SmartTableHeaderFilterMenu/SmartTableHeaderFilterMenu.tsx
6814
- var import_react31 = require("react");
6867
+ var import_react34 = require("react");
6815
6868
  var import_Check = __toESM(require("@mui/icons-material/Check"), 1);
6816
- var import_material57 = require("@mui/material");
6869
+ var import_material61 = require("@mui/material");
6817
6870
  var import_classnames3 = __toESM(require("classnames"), 1);
6818
- var import_mui52 = require("tss-react/mui");
6819
- var import_jsx_runtime108 = require("react/jsx-runtime");
6820
- var useStyles46 = (0, import_mui52.makeStyles)()((theme) => ({
6821
- filterMenu: {
6822
- display: "flex",
6823
- flexDirection: "column"
6824
- },
6825
- filterOptions: {
6826
- maxHeight: theme.spacing(62),
6827
- overflowY: "auto",
6828
- "&::-webkit-scrollbar": {
6829
- width: "8px",
6830
- height: "8px"
6831
- },
6832
- "&::-webkit-scrollbar-track": {
6833
- backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[800] : theme.palette.grey[100]
6834
- },
6835
- "&::-webkit-scrollbar-thumb": {
6836
- backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[900] : theme.palette.grey[400],
6837
- borderRadius: "10px"
6838
- },
6839
- "&::-webkit-scrollbar-thumb:hover": {
6840
- backgroundColor: theme.palette.mode === "dark" ? theme.palette.common.black : theme.palette.grey[500]
6841
- }
6842
- },
6843
- filter: {
6844
- display: "flex",
6845
- alignItems: "center",
6846
- justifyContent: "space-between",
6847
- padding: theme.spacing(0, 3)
6848
- },
6849
- applyFilterButtonsContainer: {
6850
- display: "flex",
6851
- padding: theme.spacing(0, 1)
6852
- },
6853
- saveAsDefaultButton: {
6854
- color: theme.palette.primary.main
6855
- },
6856
- skeleton: {
6857
- height: theme.spacing(3),
6858
- margin: theme.spacing(1)
6859
- }
6860
- }));
6861
- var resolveFilterOption = (filterOption) => {
6862
- if (typeof filterOption === "object") {
6863
- return filterOption?.label || filterOption?.name || "";
6864
- }
6865
- return filterOption;
6866
- };
6867
- var findFilterIndex = (filters, filterOption) => filters.findIndex((item) => {
6868
- if (typeof item === "string" && typeof filterOption === "string") {
6869
- return item === filterOption;
6870
- }
6871
- if (typeof item === "object" && typeof filterOption === "object") {
6872
- return item.id === filterOption.id;
6873
- }
6874
- return false;
6875
- });
6876
- var SmartTableHeaderFilterMenu = ({
6877
- headCell,
6878
- numActiveFilters,
6879
- headerFilters,
6880
- shouldShowCheckOnFilter,
6881
- onApplyFilters
6882
- }) => {
6883
- const { classes } = useStyles46();
6884
- const [anchorEl, setAnchorEl] = (0, import_react31.useState)(null);
6885
- const [selectedFilters, setSelectedFilters] = (0, import_react31.useState)(
6886
- headerFilters[headCell.id] ?? []
6887
- );
6888
- const filterOptions = headCell.filterOptionsQuery?.data ?? [];
6889
- const numFilterOptions = filterOptions.length ?? 0;
6890
- const numCurrentSelectedFilters = selectedFilters.length;
6891
- const handleFilterMenuOpen = (event) => {
6892
- if (!numFilterOptions) {
6893
- headCell.filterOptionsQuery?.refetch();
6894
- }
6895
- setAnchorEl(event.currentTarget);
6896
- };
6897
- const handleFilterMenuClose = () => {
6898
- setSelectedFilters(headerFilters[headCell.id]);
6899
- setAnchorEl(null);
6900
- };
6901
- const handleFilterOptionClick = (option) => {
6902
- const selectedIndex = findFilterIndex(selectedFilters, option);
6903
- let newSelected;
6904
- if (selectedIndex === -1) {
6905
- if (typeof option === "string") {
6906
- newSelected = [...selectedFilters, option];
6907
- } else {
6908
- newSelected = [...selectedFilters, option];
6909
- }
6910
- } else {
6911
- newSelected = selectedFilters.filter(
6912
- (_, index) => index !== selectedIndex
6913
- );
6914
- }
6915
- setSelectedFilters(newSelected);
6916
- };
6917
- const handleApplyFilters = (shouldSave) => {
6918
- const updatedFilters = {
6919
- ...headerFilters,
6920
- [headCell.id]: [...selectedFilters]
6921
- };
6922
- onApplyFilters?.(updatedFilters, shouldSave);
6923
- setAnchorEl(null);
6924
- };
6925
- (0, import_react31.useEffect)(() => {
6926
- setSelectedFilters(headerFilters[headCell.id] ?? []);
6927
- }, [headerFilters, headCell.id]);
6928
- const isOptionChecked = (0, import_react31.useMemo)(() => (resolvedOption) => !!selectedFilters?.some(
6929
- (value) => resolveFilterOption(value) === resolvedOption
6930
- ), [selectedFilters]);
6931
- const loadingSkeletons = /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_material57.Box, { "data-testid": "loading-skeletons", width: 272, children: [
6932
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
6933
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, {}),
6934
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
6935
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
6936
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
6937
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton }),
6938
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, {}),
6939
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Skeleton, { variant: "rounded", className: classes.skeleton })
6940
- ] });
6941
- return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_jsx_runtime108.Fragment, { children: [
6942
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6943
- ActiveFiltersIconButton_default,
6944
- {
6945
- numActiveFilters,
6946
- handleClick: handleFilterMenuOpen,
6947
- className: (0, import_classnames3.default)("filter-menu-trigger", {
6948
- "has-active-filters": !!numActiveFilters || !!anchorEl
6949
- })
6950
- }
6951
- ),
6952
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6953
- import_material57.Menu,
6954
- {
6955
- open: !!anchorEl,
6956
- onClose: handleFilterMenuClose,
6957
- anchorEl,
6958
- "data-testid": "filter-menu",
6959
- anchorOrigin: { vertical: "bottom", horizontal: "right" },
6960
- transformOrigin: { vertical: "top", horizontal: "right" },
6961
- children: headCell.filterOptionsQuery?.isFetching ? loadingSkeletons : /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_material57.Box, { className: classes.filterMenu, children: [
6962
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Box, { px: 3, mb: 0.5, children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6963
- import_material57.FormControlLabel,
6964
- {
6965
- label: "Select All",
6966
- control: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6967
- import_material57.Checkbox,
6968
- {
6969
- disableRipple: true,
6970
- checked: numCurrentSelectedFilters === numFilterOptions,
6971
- indeterminate: numCurrentSelectedFilters > 0 && numCurrentSelectedFilters < numFilterOptions,
6972
- onChange: ({ target: { checked } }) => {
6973
- if (checked) {
6974
- setSelectedFilters([...filterOptions]);
6975
- } else {
6976
- setSelectedFilters([]);
6977
- }
6978
- }
6979
- }
6980
- )
6981
- }
6982
- ) }),
6983
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, { sx: { mb: 0.5 } }),
6984
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Box, { className: classes.filterOptions, children: filterOptions.map(
6985
- (option) => {
6986
- const resolvedOption = resolveFilterOption(option);
6987
- return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
6988
- import_material57.Box,
6989
- {
6990
- className: classes.filter,
6991
- children: [
6992
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6993
- import_material57.FormControlLabel,
6994
- {
6995
- label: resolvedOption,
6996
- control: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
6997
- import_material57.Checkbox,
6998
- {
6999
- disableRipple: true,
7000
- onChange: () => handleFilterOptionClick(option),
7001
- checked: isOptionChecked(resolvedOption)
7002
- }
7003
- )
7004
- },
7005
- resolvedOption
7006
- ),
7007
- shouldShowCheckOnFilter?.(headCell.id, option) ? /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Tooltip, { title: "This filter is saved as default", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_Check.default, { fontSize: "small", color: "action" }) }) : null
7008
- ]
7009
- },
7010
- resolvedOption
7011
- );
7012
- }
7013
- ) }),
7014
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_material57.Divider, { sx: { mb: 0.5 } }),
7015
- /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_material57.Box, { className: classes.applyFilterButtonsContainer, children: [
7016
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
7017
- ExtendedButton_default,
7018
- {
7019
- copy: "Save as Default",
7020
- buttonType: "button",
7021
- variant: "text",
7022
- tooltip: "Persists those filters for future visits",
7023
- className: classes.saveAsDefaultButton,
7024
- onClick: () => handleApplyFilters(true)
7025
- }
7026
- ),
7027
- /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
7028
- ExtendedButton_default,
7029
- {
7030
- copy: "Apply",
7031
- color: "primary",
7032
- buttonType: "submit",
7033
- onClick: () => handleApplyFilters(false)
7034
- }
7035
- )
7036
- ] })
7037
- ] })
7038
- }
7039
- )
7040
- ] });
7041
- };
7042
- var SmartTableHeaderFilterMenu_default = (0, import_react31.memo)(SmartTableHeaderFilterMenu);
6871
+ var import_mui55 = require("tss-react/mui");
6872
+
6873
+ // src/components/TableDesktop/TableDesktop.tsx
6874
+ var import_react33 = require("react");
6875
+ var import_material60 = require("@mui/material");
6876
+ var import_mui54 = require("tss-react/mui");
7043
6877
 
7044
6878
  // src/components/SmartTableHeader/SmartTableHeader.tsx
7045
6879
  var import_react32 = require("react");
7046
6880
  var import_material58 = require("@mui/material");
7047
- var import_mui53 = require("tss-react/mui");
6881
+ var import_mui52 = require("tss-react/mui");
7048
6882
  var import_jsx_runtime109 = require("react/jsx-runtime");
7049
- var useStyles47 = (0, import_mui53.makeStyles)()((theme) => ({
6883
+ var useStyles46 = (0, import_mui52.makeStyles)()((theme) => ({
7050
6884
  root: {
7051
6885
  backgroundColor: colors.neutral100,
7052
6886
  height: theme.spacing(6),
@@ -7113,7 +6947,7 @@ var SmartTableHeader = ({
7113
6947
  onApplyFilters,
7114
6948
  shouldShowCheckOnFilter
7115
6949
  }) => {
7116
- const { classes } = useStyles47();
6950
+ const { classes } = useStyles46();
7117
6951
  const createSortHandler = (property) => (event) => {
7118
6952
  onRequestSort(event, property);
7119
6953
  };
@@ -7123,6 +6957,7 @@ var SmartTableHeader = ({
7123
6957
  import_material58.Checkbox,
7124
6958
  {
7125
6959
  color: "primary",
6960
+ disableRipple: true,
7126
6961
  indeterminate: numSelected > 0 && numSelected < numRows,
7127
6962
  checked: numRows > 0 && numSelected === numRows,
7128
6963
  onChange: onSelectAllClick
@@ -7144,12 +6979,12 @@ var SmartTableHeader = ({
7144
6979
  direction: orderBy === headCell.id ? order : "asc",
7145
6980
  onClick: createSortHandler(headCell.id),
7146
6981
  children: [
7147
- headCell.renderHeader ?? headCell.label,
6982
+ headCell.RenderHeader ?? headCell.label,
7148
6983
  orderBy === headCell.id ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: classes.visuallyHidden, children: order === "desc" ? "sorted descending" : "sorted ascending" }) : null
7149
6984
  ]
7150
6985
  }
7151
6986
  ),
7152
- headCell.filterOptionsQuery ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
6987
+ headCell.refetchFilterOptions ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
7153
6988
  SmartTableHeaderFilterMenu_default,
7154
6989
  {
7155
6990
  headCell,
@@ -7167,193 +7002,11 @@ var SmartTableHeader = ({
7167
7002
  };
7168
7003
  var SmartTableHeader_default = (0, import_react32.memo)(SmartTableHeader);
7169
7004
 
7170
- // src/components/Table/Table.tsx
7171
- var import_react33 = require("react");
7172
- var import_material60 = require("@mui/material");
7173
- var import_debounce = __toESM(require_debounce(), 1);
7174
- var import_mui54 = require("tss-react/mui");
7175
- var import_uuid = require("uuid");
7176
-
7177
- // src/components/TableLoading/TableLoading.tsx
7005
+ // src/components/TableEmptyResult/TableEmptyResult.tsx
7178
7006
  var import_material59 = require("@mui/material");
7007
+ var import_mui53 = require("tss-react/mui");
7179
7008
  var import_jsx_runtime110 = require("react/jsx-runtime");
7180
- var TableLoading = ({
7181
- rowsPerPage,
7182
- rowHeight
7183
- }) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.Box, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
7184
- import_material59.Skeleton,
7185
- {
7186
- animation: "pulse",
7187
- "data-testid": "table-loading-skeleton",
7188
- style: { margin: "8px", opacity: 0.4 },
7189
- variant: "rectangular",
7190
- height: rowHeight
7191
- },
7192
- index
7193
- )) });
7194
- var TableLoading_default = TableLoading;
7195
-
7196
- // src/components/Table/helpers.tsx
7197
- function stableSort(array, cmp) {
7198
- const stabilizedThis = array.map((el, index) => [el, index]);
7199
- stabilizedThis.sort((a, b) => {
7200
- const order = cmp(a[0], b[0]);
7201
- if (order !== 0) {
7202
- return order;
7203
- }
7204
- return a[1] - b[1];
7205
- });
7206
- return stabilizedThis.map((el) => el[0]);
7207
- }
7208
- function descendingComparator(a, b, orderBy) {
7209
- if (b[orderBy] < a[orderBy]) {
7210
- return -1;
7211
- }
7212
- if (b[orderBy] > a[orderBy]) {
7213
- return 1;
7214
- }
7215
- return 0;
7216
- }
7217
- function getSorting(order, orderBy) {
7218
- return order === "desc" ? (a, b) => descendingComparator(a, b, orderBy) : (a, b) => -descendingComparator(a, b, orderBy);
7219
- }
7220
- function calculateRowsPerPage(rowHeight) {
7221
- const appContainerDom = document.getElementById("mainContainer");
7222
- const headerDom = document.getElementById("aboveTableHeader");
7223
- if (appContainerDom && headerDom) {
7224
- return Math.floor(
7225
- (appContainerDom.clientHeight - headerDom.clientHeight - 24) / rowHeight - 2
7226
- );
7227
- }
7228
- return 1;
7229
- }
7230
-
7231
- // src/components/Table/Table.tsx
7232
- var import_jsx_runtime111 = require("react/jsx-runtime");
7233
- var useStyles48 = (0, import_mui54.makeStyles)()(() => ({
7234
- root: {
7235
- height: "calc(100vh - 262px)",
7236
- overflow: "scroll"
7237
- },
7238
- paper: {
7239
- width: "100%",
7240
- display: "flex",
7241
- flexDirection: "column",
7242
- justifyContent: "space-between"
7243
- },
7244
- header: {
7245
- "& .MuiTableSortLabel-root": {
7246
- fontWeight: 600,
7247
- fontSize: ".875rem"
7248
- }
7249
- },
7250
- container: {
7251
- maxHeight: "calc(100% - 0)"
7252
- }
7253
- }));
7254
- var Table = ({
7255
- appliedFilters,
7256
- data,
7257
- doNotCalculateRows,
7258
- headCells,
7259
- isLoading,
7260
- onRowClick,
7261
- page = 0,
7262
- RenderItem = null,
7263
- rowsPerPage: defaultRowsPerPage = 10,
7264
- serverRendered,
7265
- updateSort
7266
- }) => {
7267
- const [order, setOrder] = (0, import_react33.useState)(appliedFilters?.sortDir || "desc");
7268
- const [orderBy, setOrderBy] = (0, import_react33.useState)(
7269
- appliedFilters?.sortField || "delivery_date"
7270
- );
7271
- const [rowsPerPage, setRowsPerPage] = (0, import_react33.useState)(defaultRowsPerPage);
7272
- const { classes } = useStyles48();
7273
- const rowHeight = 56;
7274
- const emptyRows = rowsPerPage - Math.min(rowsPerPage, data.length - page * rowsPerPage);
7275
- const handleRequestSort = (event, property) => {
7276
- const isAsc = orderBy === property && order === "asc";
7277
- const orderDir = isAsc ? "desc" : "asc";
7278
- setOrder(orderDir);
7279
- setOrderBy(property);
7280
- if (updateSort) {
7281
- updateSort(property, orderDir);
7282
- }
7283
- };
7284
- (0, import_react33.useLayoutEffect)(() => {
7285
- if (!doNotCalculateRows) {
7286
- return;
7287
- }
7288
- function updateRowsPerPage() {
7289
- const newRowsPerPage = calculateRowsPerPage(rowHeight);
7290
- setRowsPerPage(newRowsPerPage);
7291
- }
7292
- updateRowsPerPage();
7293
- const debounced = (0, import_debounce.default)(updateRowsPerPage, 150);
7294
- window.addEventListener("resize", debounced);
7295
- return () => {
7296
- window.removeEventListener("resize", debounced);
7297
- };
7298
- }, [doNotCalculateRows]);
7299
- const createSortHandler = (property) => (event) => {
7300
- handleRequestSort(event, property);
7301
- };
7302
- const getTableRows = () => {
7303
- const index = page;
7304
- const rows = serverRendered ? data : stableSort(data, getSorting(order, orderBy)).slice(
7305
- index * rowsPerPage,
7306
- index * rowsPerPage + rowsPerPage
7307
- );
7308
- const rowsComponents = rows.map((row) => {
7309
- if (RenderItem) {
7310
- return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(RenderItem, { ...row }, row.id);
7311
- }
7312
- return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { hover: true, onClick: () => onRowClick?.(row), children: headCells?.map((column) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableCell, { children: row[column.id] }, column.id)) }, row.id);
7313
- });
7314
- if (emptyRows > 0 && rowsPerPage > emptyRows) {
7315
- rowsComponents.push(
7316
- /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableCell, { colSpan: 8 }) }, (0, import_uuid.v4)())
7317
- );
7318
- }
7319
- return rowsComponents;
7320
- };
7321
- return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.Paper, { className: classes.root, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.Box, { className: classes.paper, children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_material60.Table, { size: "medium", stickyHeader: true, children: [
7322
- /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableHead, { className: classes.header, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { children: headCells?.map((headCell) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
7323
- import_material60.TableCell,
7324
- {
7325
- align: "left",
7326
- sortDirection: orderBy === headCell.id ? order : void 0,
7327
- children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
7328
- import_material60.TableSortLabel,
7329
- {
7330
- active: orderBy === headCell.id,
7331
- direction: orderBy === headCell.id ? order : "asc",
7332
- onClick: createSortHandler(headCell.id),
7333
- children: headCell.label
7334
- }
7335
- )
7336
- },
7337
- headCell.id
7338
- )) }) }),
7339
- /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_material60.TableBody, { children: [
7340
- getTableRows(),
7341
- rowsPerPage === emptyRows && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableCell, { colSpan: 8, align: "center", children: "Nothing to display" }) })
7342
- ] })
7343
- ] }) }) }) });
7344
- };
7345
- var Table_default = Table;
7346
-
7347
- // src/components/TableDesktop/TableDesktop.tsx
7348
- var import_react34 = require("react");
7349
- var import_material62 = require("@mui/material");
7350
- var import_mui56 = require("tss-react/mui");
7351
-
7352
- // src/components/TableEmptyResult/TableEmptyResult.tsx
7353
- var import_material61 = require("@mui/material");
7354
- var import_mui55 = require("tss-react/mui");
7355
- var import_jsx_runtime112 = require("react/jsx-runtime");
7356
- var useStyles49 = (0, import_mui55.makeStyles)()(() => ({
7009
+ var useStyles47 = (0, import_mui53.makeStyles)()(() => ({
7357
7010
  tableCellIcon: { padding: 24, height: "calc(100vh - 320px)" },
7358
7011
  tableCellDefault: { padding: 24 }
7359
7012
  }));
@@ -7363,18 +7016,18 @@ var TableEmptyResult = ({
7363
7016
  handleClickOnClearFiltersButton = () => {
7364
7017
  }
7365
7018
  }) => {
7366
- const { classes } = useStyles49();
7367
- return showClearFilterButton ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
7368
- import_material61.TableCell,
7019
+ const { classes } = useStyles47();
7020
+ return showClearFilterButton ? /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
7021
+ import_material59.TableCell,
7369
7022
  {
7370
7023
  className: classes.tableCellIcon,
7371
7024
  colSpan,
7372
7025
  align: "center",
7373
7026
  children: [
7374
- /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(EmptyGlassIcon_default, {}),
7375
- /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Typography, { variant: "h6", children: "No results found." }),
7376
- /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Typography, { variant: "subtitle1", children: "Search without applied filters?" }),
7377
- /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7027
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(EmptyGlassIcon_default, {}),
7028
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.Typography, { variant: "h6", children: "No results found." }),
7029
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.Typography, { variant: "subtitle1", children: "Search without applied filters?" }),
7030
+ /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
7378
7031
  FilledButton_default,
7379
7032
  {
7380
7033
  copy: "Search",
@@ -7385,8 +7038,8 @@ var TableEmptyResult = ({
7385
7038
  )
7386
7039
  ]
7387
7040
  }
7388
- ) }) : /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7389
- import_material61.TableCell,
7041
+ ) }) : /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_material59.TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
7042
+ import_material59.TableCell,
7390
7043
  {
7391
7044
  className: classes.tableCellDefault,
7392
7045
  colSpan,
@@ -7398,8 +7051,8 @@ var TableEmptyResult = ({
7398
7051
  var TableEmptyResult_default = TableEmptyResult;
7399
7052
 
7400
7053
  // src/components/TableDesktop/TableDesktop.tsx
7401
- var import_jsx_runtime113 = require("react/jsx-runtime");
7402
- var useStyles50 = (0, import_mui56.makeStyles)()((theme) => ({
7054
+ var import_jsx_runtime111 = require("react/jsx-runtime");
7055
+ var useStyles48 = (0, import_mui54.makeStyles)()((theme) => ({
7403
7056
  root: {
7404
7057
  justifyContent: "space-between",
7405
7058
  display: "flex",
@@ -7429,7 +7082,7 @@ var useStyles50 = (0, import_mui56.makeStyles)()((theme) => ({
7429
7082
  }
7430
7083
  }
7431
7084
  }));
7432
- var descendingComparator2 = (a, b, orderBy) => {
7085
+ var descendingComparator = (a, b, orderBy) => {
7433
7086
  const objA = a[orderBy];
7434
7087
  const objB = b[orderBy];
7435
7088
  const valA = typeof objA === "object" ? objA?.name : objA;
@@ -7449,61 +7102,515 @@ var descendingComparator2 = (a, b, orderBy) => {
7449
7102
  if (valA < valB) {
7450
7103
  return 1;
7451
7104
  }
7452
- return 0;
7453
- };
7454
- var stableSort2 = (array, cmp) => array.map((el, index) => ({ el, index })).sort((a, b) => {
7455
- const order = cmp(a.el, b.el);
7456
- return order !== 0 ? order : a.index - b.index;
7457
- }).map((el) => el.el);
7458
- var getComparator = (order, orderBy) => order === "desc" ? (a, b) => descendingComparator2(a, b, orderBy) : (a, b) => -descendingComparator2(a, b, orderBy);
7459
- var TableDesktop = ({
7105
+ return 0;
7106
+ };
7107
+ var stableSort = (array, cmp) => array.map((el, index) => ({ el, index })).sort((a, b) => {
7108
+ const order = cmp(a.el, b.el);
7109
+ return order !== 0 ? order : a.index - b.index;
7110
+ }).map((el) => el.el);
7111
+ var getComparator = (order, orderBy) => order === "desc" ? (a, b) => descendingComparator(a, b, orderBy) : (a, b) => -descendingComparator(a, b, orderBy);
7112
+ var resolveOptionType = (option, fieldName) => {
7113
+ if (!option || typeof option !== "object") {
7114
+ return option;
7115
+ }
7116
+ return option[fieldName] || "";
7117
+ };
7118
+ var TableDesktop = ({
7119
+ data,
7120
+ headCells,
7121
+ RenderItem,
7122
+ appliedFilters,
7123
+ headerFilters,
7124
+ children,
7125
+ height,
7126
+ isLoading,
7127
+ rowsPerPage = 50,
7128
+ enableCheckboxSelection = false,
7129
+ enableRowActions = false,
7130
+ disableInternalSort = false,
7131
+ updateSort,
7132
+ showClearFilterButton,
7133
+ handleClickOnClearFiltersButton,
7134
+ deleteItem,
7135
+ keyField = "id",
7136
+ tableLayout = "auto",
7137
+ onApplyFilters,
7138
+ shouldShowCheckOnFilter
7139
+ }) => {
7140
+ const [order, setOrder] = (0, import_react33.useState)(appliedFilters?.sortDir || "desc");
7141
+ const [orderBy, setOrderBy] = (0, import_react33.useState)(
7142
+ appliedFilters?.sortField || "delivery_date"
7143
+ );
7144
+ const [selected, setSelected] = (0, import_react33.useState)(/* @__PURE__ */ new Set());
7145
+ const [page] = (0, import_react33.useState)(0);
7146
+ const { classes } = useStyles48();
7147
+ const rowHeight = 56;
7148
+ const emptyRows = (0, import_react33.useMemo)(
7149
+ () => rowsPerPage - data.length,
7150
+ [rowsPerPage, data]
7151
+ );
7152
+ const visibleHeadCells = (0, import_react33.useMemo)(
7153
+ () => headCells.filter((headCell) => headCell?.enabled ?? true),
7154
+ [headCells]
7155
+ );
7156
+ const handleSelectAllClick = (0, import_react33.useCallback)(
7157
+ (event) => {
7158
+ if (event.target.checked) {
7159
+ const allItems = new Set(data.map((n) => n[keyField]));
7160
+ setSelected(allItems);
7161
+ } else {
7162
+ setSelected(/* @__PURE__ */ new Set());
7163
+ }
7164
+ },
7165
+ [data, keyField]
7166
+ );
7167
+ const handleRequestSort = (event, property) => {
7168
+ const isAsc = orderBy === property && order === "asc";
7169
+ const orderDir = isAsc ? "desc" : "asc";
7170
+ setOrder(orderDir);
7171
+ setOrderBy(property);
7172
+ if (updateSort) {
7173
+ updateSort(property, orderDir);
7174
+ }
7175
+ };
7176
+ const handleRowCheckboxChange = (0, import_react33.useCallback)(
7177
+ (event, keyFieldValue) => {
7178
+ event.stopPropagation();
7179
+ setSelected((prev) => {
7180
+ const newSelected = new Set(prev);
7181
+ if (newSelected.has(keyFieldValue)) {
7182
+ newSelected.delete(keyFieldValue);
7183
+ } else {
7184
+ newSelected.add(keyFieldValue);
7185
+ }
7186
+ return newSelected;
7187
+ });
7188
+ },
7189
+ []
7190
+ );
7191
+ const renderTableRows = (0, import_react33.useMemo)(() => {
7192
+ const sortedData = disableInternalSort ? data : stableSort(data, getComparator(order, orderBy));
7193
+ return sortedData.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((row, index) => {
7194
+ const isItemSelected = selected.has(row[keyField]);
7195
+ return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
7196
+ RenderItem,
7197
+ {
7198
+ ...{
7199
+ ...row,
7200
+ index,
7201
+ deleteItem,
7202
+ isItemSelected,
7203
+ enableCheckboxSelection,
7204
+ enableRowActions,
7205
+ keyFieldValue: row[keyField],
7206
+ handleRowCheckboxChange,
7207
+ visibleHeadCells
7208
+ }
7209
+ },
7210
+ row[keyField] ?? index
7211
+ );
7212
+ });
7213
+ }, [
7214
+ data,
7215
+ order,
7216
+ orderBy,
7217
+ page,
7218
+ rowsPerPage,
7219
+ selected,
7220
+ enableCheckboxSelection,
7221
+ enableRowActions,
7222
+ disableInternalSort,
7223
+ deleteItem,
7224
+ keyField,
7225
+ handleRowCheckboxChange,
7226
+ visibleHeadCells,
7227
+ RenderItem
7228
+ ]);
7229
+ (0, import_react33.useEffect)(() => {
7230
+ if (!enableCheckboxSelection) {
7231
+ setSelected(/* @__PURE__ */ new Set());
7232
+ }
7233
+ }, [enableCheckboxSelection]);
7234
+ return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: classes.root, style: { height }, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(import_material60.Paper, { className: classes.paper, children: [
7235
+ isLoading ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.Box, { width: "100%", overflow: "hidden", children: [...Array(Math.floor(rowsPerPage ?? 50))].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
7236
+ import_material60.Skeleton,
7237
+ {
7238
+ animation: "pulse",
7239
+ variant: "rounded",
7240
+ sx: { margin: 1 },
7241
+ height: rowHeight,
7242
+ "data-testid": "loading-skeleton"
7243
+ },
7244
+ index
7245
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
7246
+ import_material60.Table,
7247
+ {
7248
+ stickyHeader: true,
7249
+ "aria-labelledby": "tableTitle",
7250
+ "aria-label": "sticky table",
7251
+ style: { tableLayout },
7252
+ children: [
7253
+ /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
7254
+ SmartTableHeader_default,
7255
+ {
7256
+ headCells: visibleHeadCells,
7257
+ order,
7258
+ orderBy,
7259
+ numSelected: selected.size,
7260
+ numRows: data.length,
7261
+ enableCheckboxSelection,
7262
+ headerFilters: headerFilters ?? {},
7263
+ onRequestSort: handleRequestSort,
7264
+ onSelectAllClick: handleSelectAllClick,
7265
+ onApplyFilters,
7266
+ shouldShowCheckOnFilter
7267
+ }
7268
+ ),
7269
+ /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_material60.TableBody, { children: rowsPerPage !== emptyRows ? renderTableRows : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
7270
+ TableEmptyResult_default,
7271
+ {
7272
+ colSpan: enableCheckboxSelection ? visibleHeadCells.length + 1 : visibleHeadCells.length,
7273
+ showClearFilterButton,
7274
+ handleClickOnClearFiltersButton
7275
+ }
7276
+ ) })
7277
+ ]
7278
+ }
7279
+ ) }),
7280
+ children
7281
+ ] }) });
7282
+ };
7283
+ var TableDesktop_default = TableDesktop;
7284
+
7285
+ // src/components/SmartTableHeaderFilterMenu/SmartTableHeaderFilterMenu.tsx
7286
+ var import_jsx_runtime112 = require("react/jsx-runtime");
7287
+ var useStyles49 = (0, import_mui55.makeStyles)()((theme) => ({
7288
+ filterMenu: {
7289
+ display: "flex",
7290
+ flexDirection: "column"
7291
+ },
7292
+ filterOptions: {
7293
+ maxHeight: theme.spacing(62),
7294
+ overflowY: "auto",
7295
+ "&::-webkit-scrollbar": {
7296
+ width: "8px",
7297
+ height: "8px"
7298
+ },
7299
+ "&::-webkit-scrollbar-track": {
7300
+ backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[800] : theme.palette.grey[100]
7301
+ },
7302
+ "&::-webkit-scrollbar-thumb": {
7303
+ backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[900] : theme.palette.grey[400],
7304
+ borderRadius: "10px"
7305
+ },
7306
+ "&::-webkit-scrollbar-thumb:hover": {
7307
+ backgroundColor: theme.palette.mode === "dark" ? theme.palette.common.black : theme.palette.grey[500]
7308
+ }
7309
+ },
7310
+ filter: {
7311
+ display: "flex",
7312
+ alignItems: "center",
7313
+ justifyContent: "space-between",
7314
+ padding: theme.spacing(0, 3)
7315
+ },
7316
+ applyFilterButtonsContainer: {
7317
+ display: "flex",
7318
+ padding: theme.spacing(0, 1)
7319
+ },
7320
+ saveAsDefaultButton: {
7321
+ color: theme.palette.primary.main
7322
+ },
7323
+ skeleton: {
7324
+ height: theme.spacing(3),
7325
+ margin: theme.spacing(1)
7326
+ }
7327
+ }));
7328
+ var findFilterIndex = (filters, filterOption) => filters.findIndex((item) => {
7329
+ if (typeof item === "string" && typeof filterOption === "string") {
7330
+ return item === filterOption;
7331
+ }
7332
+ if (typeof item === "object" && typeof filterOption === "object") {
7333
+ return item.id === filterOption.id;
7334
+ }
7335
+ return false;
7336
+ });
7337
+ var SmartTableHeaderFilterMenu = ({
7338
+ headCell,
7339
+ numActiveFilters,
7340
+ headerFilters,
7341
+ shouldShowCheckOnFilter,
7342
+ onApplyFilters
7343
+ }) => {
7344
+ const { classes } = useStyles49();
7345
+ const [anchorEl, setAnchorEl] = (0, import_react34.useState)(null);
7346
+ const [filterOptionsData, setFilterOptionsData] = (0, import_react34.useState)();
7347
+ const [selectedFilters, setSelectedFilters] = (0, import_react34.useState)(
7348
+ headerFilters[headCell.id] ?? []
7349
+ );
7350
+ (0, import_react34.useEffect)(() => {
7351
+ if (headCell.filterOptions)
7352
+ setFilterOptionsData(headCell.filterOptions);
7353
+ }, [headCell.filterOptions]);
7354
+ const numFilterOptions = (0, import_react34.useMemo)(() => filterOptionsData?.length ?? 0, [filterOptionsData?.length]);
7355
+ const numCurrentSelectedFilters = selectedFilters.length;
7356
+ const handleFilterMenuOpen = (event) => {
7357
+ if (!numFilterOptions) {
7358
+ headCell.refetchFilterOptions?.();
7359
+ }
7360
+ setAnchorEl(event.currentTarget);
7361
+ };
7362
+ const handleFilterMenuClose = () => {
7363
+ setSelectedFilters(headerFilters[headCell.id]);
7364
+ setAnchorEl(null);
7365
+ };
7366
+ const handleFilterOptionClick = (option) => {
7367
+ const selectedIndex = findFilterIndex(selectedFilters, option);
7368
+ let newSelected;
7369
+ if (selectedIndex === -1) {
7370
+ if (typeof option === "string") {
7371
+ newSelected = [...selectedFilters, option];
7372
+ } else {
7373
+ newSelected = [...selectedFilters, option];
7374
+ }
7375
+ } else {
7376
+ newSelected = selectedFilters.filter(
7377
+ (_, index) => index !== selectedIndex
7378
+ );
7379
+ }
7380
+ setSelectedFilters(newSelected);
7381
+ };
7382
+ const handleApplyFilters = (shouldSave) => {
7383
+ const updatedFilters = {
7384
+ ...headerFilters,
7385
+ [headCell.id]: [...selectedFilters]
7386
+ };
7387
+ onApplyFilters?.(updatedFilters, shouldSave);
7388
+ setAnchorEl(null);
7389
+ };
7390
+ (0, import_react34.useEffect)(() => {
7391
+ setSelectedFilters(headerFilters[headCell.id] ?? []);
7392
+ }, [headerFilters, headCell.id]);
7393
+ const isOptionChecked = (0, import_react34.useMemo)(() => (resolvedOption) => !!selectedFilters?.some(
7394
+ (value) => resolveOptionType(value, headCell.fieldName ?? "") === resolvedOption
7395
+ ), [selectedFilters]);
7396
+ const loadingSkeletons = /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_material61.Box, { "data-testid": "loading-skeletons", width: 272, children: [
7397
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
7398
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, {}),
7399
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
7400
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
7401
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
7402
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton }),
7403
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, {}),
7404
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Skeleton, { variant: "rounded", className: classes.skeleton })
7405
+ ] });
7406
+ return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_jsx_runtime112.Fragment, { children: [
7407
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7408
+ ActiveFiltersIconButton_default,
7409
+ {
7410
+ numActiveFilters,
7411
+ handleClick: handleFilterMenuOpen,
7412
+ className: (0, import_classnames3.default)("filter-menu-trigger", {
7413
+ "has-active-filters": !!numActiveFilters || !!anchorEl
7414
+ })
7415
+ }
7416
+ ),
7417
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7418
+ import_material61.Menu,
7419
+ {
7420
+ open: !!anchorEl,
7421
+ onClose: handleFilterMenuClose,
7422
+ anchorEl,
7423
+ "data-testid": "filter-menu",
7424
+ anchorOrigin: { vertical: "bottom", horizontal: "right" },
7425
+ transformOrigin: { vertical: "top", horizontal: "right" },
7426
+ children: false ? loadingSkeletons : /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_material61.Box, { className: classes.filterMenu, children: [
7427
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Box, { px: 3, mb: 0.5, children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7428
+ import_material61.FormControlLabel,
7429
+ {
7430
+ label: "Select All",
7431
+ control: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7432
+ import_material61.Checkbox,
7433
+ {
7434
+ disableRipple: true,
7435
+ checked: numCurrentSelectedFilters === numFilterOptions,
7436
+ indeterminate: numCurrentSelectedFilters > 0 && numCurrentSelectedFilters < numFilterOptions,
7437
+ onChange: ({ target: { checked } }) => {
7438
+ if (checked) {
7439
+ setSelectedFilters([...filterOptionsData]);
7440
+ } else {
7441
+ setSelectedFilters([]);
7442
+ }
7443
+ }
7444
+ }
7445
+ )
7446
+ }
7447
+ ) }),
7448
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, { sx: { mb: 0.5 } }),
7449
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Box, { className: classes.filterOptions, children: filterOptionsData?.map(
7450
+ (option) => {
7451
+ const resolvedOption = resolveOptionType(option, headCell.fieldName ?? "");
7452
+ return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
7453
+ import_material61.Box,
7454
+ {
7455
+ className: classes.filter,
7456
+ children: [
7457
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7458
+ import_material61.FormControlLabel,
7459
+ {
7460
+ label: resolvedOption,
7461
+ control: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7462
+ import_material61.Checkbox,
7463
+ {
7464
+ disableRipple: true,
7465
+ onChange: () => handleFilterOptionClick(option),
7466
+ checked: isOptionChecked(resolvedOption)
7467
+ }
7468
+ )
7469
+ },
7470
+ resolvedOption
7471
+ ),
7472
+ shouldShowCheckOnFilter?.(headCell.id, option) ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Tooltip, { title: "This filter is saved as default", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_Check.default, { fontSize: "small", color: "action" }) }) : null
7473
+ ]
7474
+ },
7475
+ resolvedOption
7476
+ );
7477
+ }
7478
+ ) }),
7479
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_material61.Divider, { sx: { mb: 0.5 } }),
7480
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(import_material61.Box, { className: classes.applyFilterButtonsContainer, children: [
7481
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7482
+ ExtendedButton_default,
7483
+ {
7484
+ copy: "Save as Default",
7485
+ buttonType: "button",
7486
+ variant: "text",
7487
+ tooltip: "Persists those filters for future visits",
7488
+ className: classes.saveAsDefaultButton,
7489
+ onClick: () => handleApplyFilters(true)
7490
+ }
7491
+ ),
7492
+ /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
7493
+ ExtendedButton_default,
7494
+ {
7495
+ copy: "Apply",
7496
+ color: "primary",
7497
+ buttonType: "submit",
7498
+ onClick: () => handleApplyFilters(false)
7499
+ }
7500
+ )
7501
+ ] })
7502
+ ] })
7503
+ }
7504
+ )
7505
+ ] });
7506
+ };
7507
+ var SmartTableHeaderFilterMenu_default = (0, import_react34.memo)(SmartTableHeaderFilterMenu);
7508
+
7509
+ // src/components/Table/Table.tsx
7510
+ var import_react35 = require("react");
7511
+ var import_material63 = require("@mui/material");
7512
+ var import_debounce = __toESM(require_debounce(), 1);
7513
+ var import_mui56 = require("tss-react/mui");
7514
+ var import_uuid = require("uuid");
7515
+
7516
+ // src/components/TableLoading/TableLoading.tsx
7517
+ var import_material62 = require("@mui/material");
7518
+ var import_jsx_runtime113 = require("react/jsx-runtime");
7519
+ var TableLoading = ({
7520
+ rowsPerPage,
7521
+ rowHeight
7522
+ }) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.Box, { children: Array.from({ length: rowsPerPage ?? 0 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
7523
+ import_material62.Skeleton,
7524
+ {
7525
+ animation: "pulse",
7526
+ "data-testid": "table-loading-skeleton",
7527
+ style: { margin: "8px", opacity: 0.4 },
7528
+ variant: "rectangular",
7529
+ height: rowHeight
7530
+ },
7531
+ index
7532
+ )) });
7533
+ var TableLoading_default = TableLoading;
7534
+
7535
+ // src/components/Table/helpers.tsx
7536
+ function stableSort2(array, cmp) {
7537
+ const stabilizedThis = array.map((el, index) => [el, index]);
7538
+ stabilizedThis.sort((a, b) => {
7539
+ const order = cmp(a[0], b[0]);
7540
+ if (order !== 0) {
7541
+ return order;
7542
+ }
7543
+ return a[1] - b[1];
7544
+ });
7545
+ return stabilizedThis.map((el) => el[0]);
7546
+ }
7547
+ function descendingComparator2(a, b, orderBy) {
7548
+ if (b[orderBy] < a[orderBy]) {
7549
+ return -1;
7550
+ }
7551
+ if (b[orderBy] > a[orderBy]) {
7552
+ return 1;
7553
+ }
7554
+ return 0;
7555
+ }
7556
+ function getSorting(order, orderBy) {
7557
+ return order === "desc" ? (a, b) => descendingComparator2(a, b, orderBy) : (a, b) => -descendingComparator2(a, b, orderBy);
7558
+ }
7559
+ function calculateRowsPerPage(rowHeight) {
7560
+ const appContainerDom = document.getElementById("mainContainer");
7561
+ const headerDom = document.getElementById("aboveTableHeader");
7562
+ if (appContainerDom && headerDom) {
7563
+ return Math.floor(
7564
+ (appContainerDom.clientHeight - headerDom.clientHeight - 24) / rowHeight - 2
7565
+ );
7566
+ }
7567
+ return 1;
7568
+ }
7569
+
7570
+ // src/components/Table/Table.tsx
7571
+ var import_jsx_runtime114 = require("react/jsx-runtime");
7572
+ var useStyles50 = (0, import_mui56.makeStyles)()(() => ({
7573
+ root: {
7574
+ height: "calc(100vh - 262px)",
7575
+ overflow: "scroll"
7576
+ },
7577
+ paper: {
7578
+ width: "100%",
7579
+ display: "flex",
7580
+ flexDirection: "column",
7581
+ justifyContent: "space-between"
7582
+ },
7583
+ header: {
7584
+ "& .MuiTableSortLabel-root": {
7585
+ fontWeight: 600,
7586
+ fontSize: ".875rem"
7587
+ }
7588
+ },
7589
+ container: {
7590
+ maxHeight: "calc(100% - 0)"
7591
+ }
7592
+ }));
7593
+ var Table2 = ({
7594
+ appliedFilters,
7460
7595
  data,
7596
+ doNotCalculateRows,
7461
7597
  headCells,
7462
- RenderItem,
7463
- appliedFilters,
7464
- headerFilters,
7465
- children,
7466
- height,
7467
7598
  isLoading,
7468
- rowsPerPage = 50,
7469
- enableCheckboxSelection = false,
7470
- disableInternalSort = false,
7471
- updateSort,
7472
- showClearFilterButton,
7473
- handleClickOnClearFiltersButton,
7474
- deleteItem,
7475
- keyField = "id",
7476
- tableLayout = "auto",
7477
- onApplyFilters,
7478
- shouldShowCheckOnFilter
7599
+ onRowClick,
7600
+ page = 0,
7601
+ RenderItem = null,
7602
+ rowsPerPage: defaultRowsPerPage = 10,
7603
+ serverRendered,
7604
+ updateSort
7479
7605
  }) => {
7480
- const [order, setOrder] = (0, import_react34.useState)(appliedFilters?.sortDir || "desc");
7481
- const [orderBy, setOrderBy] = (0, import_react34.useState)(
7606
+ const [order, setOrder] = (0, import_react35.useState)(appliedFilters?.sortDir || "desc");
7607
+ const [orderBy, setOrderBy] = (0, import_react35.useState)(
7482
7608
  appliedFilters?.sortField || "delivery_date"
7483
7609
  );
7484
- const [selected, setSelected] = (0, import_react34.useState)([]);
7485
- const [page] = (0, import_react34.useState)(0);
7610
+ const [rowsPerPage, setRowsPerPage] = (0, import_react35.useState)(defaultRowsPerPage);
7486
7611
  const { classes } = useStyles50();
7487
7612
  const rowHeight = 56;
7488
- const emptyRows = (0, import_react34.useMemo)(
7489
- () => rowsPerPage - data.length,
7490
- [rowsPerPage, data]
7491
- );
7492
- const visibleHeadCells = (0, import_react34.useMemo)(
7493
- () => headCells.filter((headCell) => headCell?.enabled ?? true),
7494
- [headCells]
7495
- );
7496
- const handleSelectAllClick = (0, import_react34.useCallback)(
7497
- (event) => {
7498
- if (event.target.checked) {
7499
- const newSelected = data.map((n) => n[keyField]);
7500
- setSelected(newSelected);
7501
- return;
7502
- }
7503
- setSelected([]);
7504
- },
7505
- [data, keyField]
7506
- );
7613
+ const emptyRows = rowsPerPage - Math.min(rowsPerPage, data.length - page * rowsPerPage);
7507
7614
  const handleRequestSort = (event, property) => {
7508
7615
  const isAsc = orderBy === property && order === "asc";
7509
7616
  const orderDir = isAsc ? "desc" : "asc";
@@ -7513,119 +7620,294 @@ var TableDesktop = ({
7513
7620
  updateSort(property, orderDir);
7514
7621
  }
7515
7622
  };
7516
- const handleRowCheckboxClick = (0, import_react34.useCallback)(
7517
- (event, keyFieldValue) => {
7518
- const selectedIndex = selected.indexOf(keyFieldValue);
7519
- let newSelected = [];
7520
- if (selectedIndex === -1) {
7521
- newSelected = newSelected.concat(selected, keyFieldValue);
7522
- } else if (selectedIndex === 0) {
7523
- newSelected = newSelected.concat(selected.slice(1));
7524
- } else if (selectedIndex === selected.length - 1) {
7525
- newSelected = newSelected.concat(selected.slice(0, -1));
7526
- } else if (selectedIndex > 0) {
7527
- newSelected = newSelected.concat(
7528
- selected.slice(0, selectedIndex),
7529
- selected.slice(selectedIndex + 1)
7530
- );
7623
+ (0, import_react35.useLayoutEffect)(() => {
7624
+ if (!doNotCalculateRows) {
7625
+ return;
7626
+ }
7627
+ function updateRowsPerPage() {
7628
+ const newRowsPerPage = calculateRowsPerPage(rowHeight);
7629
+ setRowsPerPage(newRowsPerPage);
7630
+ }
7631
+ updateRowsPerPage();
7632
+ const debounced = (0, import_debounce.default)(updateRowsPerPage, 150);
7633
+ window.addEventListener("resize", debounced);
7634
+ return () => {
7635
+ window.removeEventListener("resize", debounced);
7636
+ };
7637
+ }, [doNotCalculateRows]);
7638
+ const createSortHandler = (property) => (event) => {
7639
+ handleRequestSort(event, property);
7640
+ };
7641
+ const getTableRows = () => {
7642
+ const index = page;
7643
+ const rows = serverRendered ? data : stableSort2(data, getSorting(order, orderBy)).slice(
7644
+ index * rowsPerPage,
7645
+ index * rowsPerPage + rowsPerPage
7646
+ );
7647
+ const rowsComponents = rows.map((row) => {
7648
+ if (RenderItem) {
7649
+ return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(RenderItem, { ...row }, row.id);
7531
7650
  }
7532
- setSelected(newSelected);
7533
- },
7534
- [selected]
7535
- );
7536
- const renderTableRows = (0, import_react34.useMemo)(() => {
7537
- const sortedData = disableInternalSort ? data : stableSort2(data, getComparator(order, orderBy));
7538
- return sortedData.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((row, index) => {
7539
- const isItemSelected = selected.includes(row[keyField]);
7540
- return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
7541
- RenderItem,
7542
- {
7543
- ...{
7544
- ...row,
7545
- index,
7546
- deleteItem,
7547
- isItemSelected,
7548
- enableCheckboxSelection,
7549
- keyFieldValue: row[keyField],
7550
- handleRowCheckboxClick,
7551
- visibleHeadCells
7552
- }
7553
- },
7554
- row[keyField] ?? index
7555
- );
7651
+ return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { hover: true, onClick: () => onRowClick?.(row), children: headCells?.map((column) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { children: row[column.id] }, column.id)) }, row.id);
7556
7652
  });
7557
- }, [
7558
- data,
7559
- order,
7560
- orderBy,
7561
- page,
7562
- rowsPerPage,
7563
- selected,
7564
- enableCheckboxSelection,
7565
- disableInternalSort,
7566
- deleteItem,
7567
- keyField,
7568
- handleRowCheckboxClick,
7569
- visibleHeadCells,
7570
- RenderItem
7571
- ]);
7572
- return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { className: classes.root, style: { height }, children: /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(import_material62.Paper, { className: classes.paper, children: [
7573
- isLoading ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.Box, { width: "100%", overflow: "hidden", children: [...Array(Math.floor(rowsPerPage ?? 50))].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
7574
- import_material62.Skeleton,
7653
+ if (emptyRows > 0 && rowsPerPage > emptyRows) {
7654
+ rowsComponents.push(
7655
+ /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { colSpan: 8 }) }, (0, import_uuid.v4)())
7656
+ );
7657
+ }
7658
+ return rowsComponents;
7659
+ };
7660
+ return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.Paper, { className: classes.root, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.Box, { className: classes.paper, children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(TableLoading_default, { rowHeight, rowsPerPage }) : /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(import_material63.Table, { size: "medium", stickyHeader: true, children: [
7661
+ /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableHead, { className: classes.header, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { children: headCells?.map((headCell) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
7662
+ import_material63.TableCell,
7575
7663
  {
7576
- animation: "pulse",
7577
- variant: "rounded",
7578
- sx: { margin: 1 },
7579
- height: rowHeight,
7580
- "data-testid": "loading-skeleton"
7664
+ align: "left",
7665
+ sortDirection: orderBy === headCell.id ? order : void 0,
7666
+ children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
7667
+ import_material63.TableSortLabel,
7668
+ {
7669
+ active: orderBy === headCell.id,
7670
+ direction: orderBy === headCell.id ? order : "asc",
7671
+ onClick: createSortHandler(headCell.id),
7672
+ children: headCell.label
7673
+ }
7674
+ )
7581
7675
  },
7582
- index
7583
- )) }) : /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.TableContainer, { className: classes.container, children: /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
7584
- import_material62.Table,
7676
+ headCell.id
7677
+ )) }) }),
7678
+ /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(import_material63.TableBody, { children: [
7679
+ getTableRows(),
7680
+ rowsPerPage === emptyRows && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { style: { height: rowHeight * emptyRows }, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { colSpan: 8, align: "center", children: "Nothing to display" }) })
7681
+ ] })
7682
+ ] }) }) }) });
7683
+ };
7684
+ var Table_default = Table2;
7685
+
7686
+ // src/components/TableDesktopRowActions/TableDesktopRowActions.tsx
7687
+ var import_material64 = require("@mui/material");
7688
+ var import_jsx_runtime115 = require("react/jsx-runtime");
7689
+ var TableDesktopRowActions = ({
7690
+ rowRef,
7691
+ isRowHovered,
7692
+ px,
7693
+ py,
7694
+ pt,
7695
+ pb,
7696
+ pr,
7697
+ pl,
7698
+ top = 0,
7699
+ right = 0,
7700
+ bottom = 0,
7701
+ left = 0,
7702
+ zIndex = 1,
7703
+ backgroundColor,
7704
+ children
7705
+ }) => {
7706
+ return isRowHovered ? /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
7707
+ import_material64.TableCell,
7708
+ {
7709
+ ref: rowRef,
7710
+ padding: "none",
7711
+ sx: {
7712
+ top,
7713
+ right,
7714
+ bottom,
7715
+ left,
7716
+ zIndex,
7717
+ position: "sticky",
7718
+ display: "flex",
7719
+ justifyContent: "flex-end"
7720
+ },
7721
+ children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
7722
+ import_material64.Box,
7723
+ {
7724
+ px,
7725
+ py,
7726
+ pt,
7727
+ pb,
7728
+ pr,
7729
+ pl,
7730
+ display: "flex",
7731
+ flexDirection: "row",
7732
+ borderLeft: `1px solid ${colors.neutral300}`,
7733
+ bgcolor: backgroundColor ?? ((theme) => theme.palette.background.default),
7734
+ children
7735
+ }
7736
+ )
7737
+ }
7738
+ ) : null;
7739
+ };
7740
+
7741
+ // src/components/TableDesktopRowCell/TableDesktopRowCell.tsx
7742
+ var import_react37 = require("react");
7743
+ var import_material65 = require("@mui/material");
7744
+
7745
+ // src/components/TableDesktopRowCell/TableDesktopSmartSelect.tsx
7746
+ var import_react36 = require("react");
7747
+ var import_jsx_runtime116 = require("react/jsx-runtime");
7748
+ var getValueId = (value) => {
7749
+ if (typeof value === "string") {
7750
+ return value;
7751
+ }
7752
+ return value?.id;
7753
+ };
7754
+ var TableDesktopSmartSelect = (0, import_react36.memo)(({
7755
+ ref,
7756
+ initialValue,
7757
+ inputLabel,
7758
+ fieldName,
7759
+ rowId,
7760
+ filterOptions,
7761
+ refetchFilterOptions,
7762
+ isFetchingFilterOptions,
7763
+ onUpdateEditableCell
7764
+ }) => {
7765
+ const [value, setValue] = (0, import_react36.useState)(initialValue);
7766
+ const [options, setOptions] = (0, import_react36.useState)();
7767
+ const valueId = getValueId(value);
7768
+ const valueLabel = resolveOptionType(value, fieldName);
7769
+ (0, import_react36.useEffect)(() => {
7770
+ if (filterOptions) {
7771
+ const parsedOptions = filterOptions?.map((option) => ({
7772
+ value: getValueId(option),
7773
+ label: String(resolveOptionType(option, fieldName))
7774
+ }));
7775
+ setOptions(parsedOptions);
7776
+ }
7777
+ }, [filterOptions]);
7778
+ return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
7779
+ SmartSelect_default,
7780
+ {
7781
+ ref,
7782
+ value: valueId,
7783
+ inputLabel,
7784
+ options,
7785
+ refetch: refetchFilterOptions,
7786
+ isFetching: isFetchingFilterOptions,
7787
+ defaultOption: {
7788
+ value: valueId ?? "",
7789
+ label: String(valueLabel ?? "")
7790
+ },
7791
+ onChange: ({ value: value2, label }) => {
7792
+ setValue({ id: value2 ?? "", name: label ?? "" });
7793
+ onUpdateEditableCell?.(rowId, value2 ?? "");
7794
+ }
7795
+ }
7796
+ );
7797
+ });
7798
+
7799
+ // src/components/TableDesktopRowCell/TableDesktopRowCell.tsx
7800
+ var import_Check2 = __toESM(require("@mui/icons-material/Check"), 1);
7801
+ var import_jsx_runtime117 = require("react/jsx-runtime");
7802
+ var TableDesktopRowCell = ({
7803
+ ref,
7804
+ inputLabel,
7805
+ editInitialValue,
7806
+ rowId,
7807
+ fieldName,
7808
+ width,
7809
+ isEditMode,
7810
+ readOnlyValue,
7811
+ editableCellType,
7812
+ filterOptions,
7813
+ refetchFilterOptions,
7814
+ isFetchingFilterOptions,
7815
+ onUpdateEditableCell
7816
+ }) => {
7817
+ const cellRef = (0, import_react37.useRef)(null);
7818
+ const [isOverflowed, setIsOverflowed] = (0, import_react37.useState)(false);
7819
+ (0, import_react37.useEffect)(() => {
7820
+ const ref2 = cellRef.current;
7821
+ if (ref2) {
7822
+ setIsOverflowed(ref2.scrollWidth > ref2.clientWidth);
7823
+ }
7824
+ }, [readOnlyValue, width]);
7825
+ const editableComponents = {
7826
+ "select": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
7827
+ TableDesktopSmartSelect,
7585
7828
  {
7586
- "aria-labelledby": "tableTitle",
7587
- "aria-label": "sticky table",
7588
- stickyHeader: true,
7589
- style: { tableLayout },
7590
- children: [
7591
- /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
7592
- SmartTableHeader_default,
7593
- {
7594
- headCells: visibleHeadCells,
7595
- order,
7596
- orderBy,
7597
- numSelected: selected.length,
7598
- numRows: data.length,
7599
- enableCheckboxSelection,
7600
- headerFilters: headerFilters ?? {},
7601
- onRequestSort: handleRequestSort,
7602
- onSelectAllClick: handleSelectAllClick,
7603
- onApplyFilters,
7604
- shouldShowCheckOnFilter
7605
- }
7606
- ),
7607
- /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_material62.TableBody, { children: rowsPerPage !== emptyRows ? renderTableRows : /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
7608
- TableEmptyResult_default,
7609
- {
7610
- colSpan: enableCheckboxSelection ? visibleHeadCells.length + 1 : visibleHeadCells.length,
7611
- showClearFilterButton,
7612
- handleClickOnClearFiltersButton
7613
- }
7614
- ) })
7615
- ]
7829
+ ref,
7830
+ initialValue: editInitialValue,
7831
+ inputLabel: inputLabel ?? "",
7832
+ fieldName,
7833
+ rowId,
7834
+ filterOptions,
7835
+ refetchFilterOptions,
7836
+ isFetchingFilterOptions,
7837
+ onUpdateEditableCell
7616
7838
  }
7617
- ) }),
7618
- children
7619
- ] }) });
7839
+ ),
7840
+ "checkbox": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
7841
+ import_material65.Checkbox,
7842
+ {
7843
+ disableRipple: true,
7844
+ defaultChecked: editInitialValue,
7845
+ onChange: ({ target: { checked } }) => {
7846
+ onUpdateEditableCell?.(rowId, checked);
7847
+ }
7848
+ }
7849
+ ),
7850
+ "text": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
7851
+ import_material65.TextField,
7852
+ {
7853
+ fullWidth: true,
7854
+ variant: "standard",
7855
+ defaultValue: editInitialValue,
7856
+ label: inputLabel,
7857
+ onBlur: ({ target: { value } }) => {
7858
+ onUpdateEditableCell?.(rowId, value);
7859
+ }
7860
+ }
7861
+ ),
7862
+ "numeric": /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
7863
+ import_material65.TextField,
7864
+ {
7865
+ fullWidth: true,
7866
+ variant: "standard",
7867
+ defaultValue: editInitialValue,
7868
+ label: inputLabel,
7869
+ onChange: (e) => {
7870
+ e.target.value = e.target.value.replace(/\D/g, "");
7871
+ },
7872
+ onBlur: ({ target: { value } }) => {
7873
+ onUpdateEditableCell?.(rowId, value);
7874
+ },
7875
+ slotProps: {
7876
+ input: {
7877
+ inputMode: "numeric"
7878
+ }
7879
+ }
7880
+ }
7881
+ )
7882
+ };
7883
+ const getReadOnlyBooleanIcon = (value) => {
7884
+ if (value) {
7885
+ return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_Check2.default, { sx: { fontSize: 16 } });
7886
+ }
7887
+ return "-";
7888
+ };
7889
+ return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_material65.Tooltip, { title: isOverflowed ? String(readOnlyValue) : "", arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
7890
+ import_material65.TableCell,
7891
+ {
7892
+ ref: cellRef,
7893
+ align: "left",
7894
+ sx: {
7895
+ width: width ?? "auto",
7896
+ overflow: "hidden",
7897
+ textOverflow: "ellipsis",
7898
+ whiteSpace: "nowrap"
7899
+ },
7900
+ children: isEditMode && editableCellType ? editableComponents[editableCellType] : typeof readOnlyValue === "boolean" ? getReadOnlyBooleanIcon(readOnlyValue) : readOnlyValue
7901
+ }
7902
+ ) });
7620
7903
  };
7621
- var TableDesktop_default = TableDesktop;
7622
7904
 
7623
7905
  // src/components/TableHeader/TableHeader.tsx
7624
- var import_react35 = require("react");
7906
+ var import_react38 = require("react");
7625
7907
  var import_icons_material12 = require("@mui/icons-material");
7626
- var import_material63 = require("@mui/material");
7908
+ var import_material66 = require("@mui/material");
7627
7909
  var import_mui57 = require("tss-react/mui");
7628
- var import_jsx_runtime114 = require("react/jsx-runtime");
7910
+ var import_jsx_runtime118 = require("react/jsx-runtime");
7629
7911
  var useStyles51 = (0, import_mui57.makeStyles)()(() => ({
7630
7912
  sortLabel: {
7631
7913
  "& .MuiTableSortLabel-icon": {
@@ -7634,9 +7916,9 @@ var useStyles51 = (0, import_mui57.makeStyles)()(() => ({
7634
7916
  }
7635
7917
  }));
7636
7918
  var TableHeader = ({ cells, onSort = null }) => {
7637
- const [sortableCells, setSortableCells] = (0, import_react35.useState)([]);
7919
+ const [sortableCells, setSortableCells] = (0, import_react38.useState)([]);
7638
7920
  const { classes } = useStyles51();
7639
- (0, import_react35.useEffect)(() => {
7921
+ (0, import_react38.useEffect)(() => {
7640
7922
  setSortableCells(cells);
7641
7923
  }, []);
7642
7924
  const getNewSortDirection = (direction) => {
@@ -7670,8 +7952,8 @@ var TableHeader = ({ cells, onSort = null }) => {
7670
7952
  });
7671
7953
  setSortableCells(sortedCells);
7672
7954
  };
7673
- return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableRow, { children: sortableCells.map((cell, key) => /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_material63.TableCell, { children: cell.isSortable ? /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
7674
- import_material63.TableSortLabel,
7955
+ return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_material66.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_material66.TableRow, { children: sortableCells.map((cell, key) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_material66.TableCell, { children: cell.isSortable ? /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
7956
+ import_material66.TableSortLabel,
7675
7957
  {
7676
7958
  className: classes.sortLabel,
7677
7959
  direction: cell?.direction || "asc",
@@ -7681,12 +7963,12 @@ var TableHeader = ({ cells, onSort = null }) => {
7681
7963
  }
7682
7964
  ) : cell.label }, cell.label || key)) }) });
7683
7965
  };
7684
- var TableHeader_default = (0, import_react35.memo)(TableHeader);
7966
+ var TableHeader_default = (0, import_react38.memo)(TableHeader);
7685
7967
 
7686
7968
  // src/components/TextDivider/TextDivider.tsx
7687
- var import_material64 = require("@mui/material");
7969
+ var import_material67 = require("@mui/material");
7688
7970
  var import_mui58 = require("tss-react/mui");
7689
- var import_jsx_runtime115 = require("react/jsx-runtime");
7971
+ var import_jsx_runtime119 = require("react/jsx-runtime");
7690
7972
  var useStyles52 = (0, import_mui58.makeStyles)()(() => ({
7691
7973
  icon: {
7692
7974
  fontSize: 20
@@ -7723,19 +8005,19 @@ var TextDivider = ({
7723
8005
  }) => {
7724
8006
  const { classes } = useStyles52();
7725
8007
  const iconColor = color ?? colors.neutral900;
7726
- return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
7727
- import_material64.Box,
8008
+ return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
8009
+ import_material67.Box,
7728
8010
  {
7729
8011
  display: "flex",
7730
8012
  alignItems: "center",
7731
8013
  justifyContent: "space-between",
7732
8014
  className: classes.container,
7733
8015
  children: [
7734
- /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_material64.Divider, { className: classes.leftDivider }),
7735
- /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_material64.Button, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(import_material64.Box, { className: classes.center, children: [
7736
- Icon2 && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } }),
7737
- /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
7738
- import_material64.Typography,
8016
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Divider, { className: classes.leftDivider }),
8017
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Button, { onClick, disabled: !onClick, className: classes.button, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(import_material67.Box, { className: classes.center, children: [
8018
+ Icon2 && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } }),
8019
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
8020
+ import_material67.Typography,
7739
8021
  {
7740
8022
  color: "textSecondary",
7741
8023
  className: classes.title,
@@ -7743,9 +8025,9 @@ var TextDivider = ({
7743
8025
  children: title
7744
8026
  }
7745
8027
  ),
7746
- Icon2 && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } })
8028
+ Icon2 && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Icon2, { className: classes.icon, style: { color: iconColor } })
7747
8029
  ] }) }),
7748
- /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_material64.Divider, { className: classes.rightDivider })
8030
+ /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Divider, { className: classes.rightDivider })
7749
8031
  ]
7750
8032
  }
7751
8033
  );
@@ -7757,7 +8039,7 @@ var import_react_dates = require("react-dates");
7757
8039
  var import_mui59 = require("tss-react/mui");
7758
8040
  var import_initialize = require("react-dates/initialize");
7759
8041
  var import_datepicker = require("react-dates/lib/css/_datepicker.css");
7760
- var import_jsx_runtime116 = require("react/jsx-runtime");
8042
+ var import_jsx_runtime120 = require("react/jsx-runtime");
7761
8043
  var useStyles53 = (0, import_mui59.makeStyles)()((theme) => ({
7762
8044
  wrapper: {
7763
8045
  "& .DateRangePicker": {
@@ -7853,15 +8135,15 @@ var ThemedDateRangePicker = ({
7853
8135
  ...props
7854
8136
  }) => {
7855
8137
  const { classes, cx } = useStyles53();
7856
- return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("div", { className: cx(classes.wrapper, className), children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_react_dates.DateRangePicker, { ...props }) });
8138
+ return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("div", { className: cx(classes.wrapper, className), children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_react_dates.DateRangePicker, { ...props }) });
7857
8139
  };
7858
8140
  var ThemedDateRangePicker_default = ThemedDateRangePicker;
7859
8141
 
7860
8142
  // src/components/TheToolbar/TheToolbar.tsx
7861
- var import_react36 = require("react");
7862
- var import_material65 = require("@mui/material");
8143
+ var import_react39 = require("react");
8144
+ var import_material68 = require("@mui/material");
7863
8145
  var import_mui60 = require("tss-react/mui");
7864
- var import_jsx_runtime117 = require("react/jsx-runtime");
8146
+ var import_jsx_runtime121 = require("react/jsx-runtime");
7865
8147
  var useStyles54 = (0, import_mui60.makeStyles)()((theme) => ({
7866
8148
  menuButton: {
7867
8149
  color: theme.palette.primary.contrastText
@@ -7881,9 +8163,9 @@ var TheToolbar = ({
7881
8163
  rightSection
7882
8164
  }) => {
7883
8165
  const { classes } = useStyles54();
7884
- return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(import_material65.Box, { children: [
7885
- /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_material65.AppBar, { children: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(import_material65.Toolbar, { className: classes.topBar, children: [
7886
- /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
8166
+ return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_material68.Box, { children: [
8167
+ /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_material68.AppBar, { children: /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_material68.Toolbar, { className: classes.topBar, children: [
8168
+ /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
7887
8169
  RoundButton_default,
7888
8170
  {
7889
8171
  className: classes.menuButton,
@@ -7892,7 +8174,7 @@ var TheToolbar = ({
7892
8174
  onClick: handleOpen
7893
8175
  }
7894
8176
  ),
7895
- /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
8177
+ /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
7896
8178
  CompanyLogo_default,
7897
8179
  {
7898
8180
  size: "small",
@@ -7901,31 +8183,31 @@ var TheToolbar = ({
7901
8183
  imageLogoLightSmall
7902
8184
  }
7903
8185
  ),
7904
- /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_material65.Box, { ml: 2, children: leftSection }),
7905
- /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_material65.Box, { ml: "auto", children: rightSection })
8186
+ /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_material68.Box, { ml: 2, children: leftSection }),
8187
+ /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_material68.Box, { ml: "auto", children: rightSection })
7906
8188
  ] }) }),
7907
8189
  LeftDrawer
7908
8190
  ] });
7909
8191
  };
7910
- var TheToolbar_default = (0, import_react36.memo)(TheToolbar);
8192
+ var TheToolbar_default = (0, import_react39.memo)(TheToolbar);
7911
8193
 
7912
8194
  // src/components/ToastMessage/ToastMessage.tsx
7913
- var import_material66 = require("@mui/material");
7914
- var import_jsx_runtime118 = require("react/jsx-runtime");
8195
+ var import_material69 = require("@mui/material");
8196
+ var import_jsx_runtime122 = require("react/jsx-runtime");
7915
8197
  var ToastMessage = ({
7916
8198
  toastType,
7917
8199
  toastMessage,
7918
8200
  open,
7919
8201
  onClose
7920
- }) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
7921
- import_material66.Snackbar,
8202
+ }) => /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
8203
+ import_material69.Snackbar,
7922
8204
  {
7923
8205
  open,
7924
8206
  autoHideDuration: 1500,
7925
8207
  onClose,
7926
8208
  anchorOrigin: { vertical: "top", horizontal: "right" },
7927
- children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
7928
- import_material66.Alert,
8209
+ children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
8210
+ import_material69.Alert,
7929
8211
  {
7930
8212
  elevation: 6,
7931
8213
  variant: "filled",
@@ -7951,9 +8233,9 @@ var ToastMessage = ({
7951
8233
  var ToastMessage_default = ToastMessage;
7952
8234
 
7953
8235
  // src/components/TwoButtonDialog/TwoButtonDialog.tsx
7954
- var import_material67 = require("@mui/material");
8236
+ var import_material70 = require("@mui/material");
7955
8237
  var import_mui61 = require("tss-react/mui");
7956
- var import_jsx_runtime119 = require("react/jsx-runtime");
8238
+ var import_jsx_runtime123 = require("react/jsx-runtime");
7957
8239
  var useStyles55 = (0, import_mui61.makeStyles)()((theme) => ({
7958
8240
  paper: {
7959
8241
  padding: theme.spacing(2)
@@ -7983,20 +8265,20 @@ var TwoButtonDialog = ({
7983
8265
  cancelButton
7984
8266
  }) => {
7985
8267
  const { classes } = useStyles55();
7986
- return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
7987
- import_material67.Dialog,
8268
+ return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
8269
+ import_material70.Dialog,
7988
8270
  {
7989
8271
  open,
7990
8272
  disableEnforceFocus: true,
7991
8273
  maxWidth: "sm",
7992
8274
  fullWidth: true,
7993
8275
  closeAfterTransition: true,
7994
- BackdropComponent: import_material67.Backdrop,
8276
+ BackdropComponent: import_material70.Backdrop,
7995
8277
  BackdropProps: { timeout: 500 },
7996
- children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Fade, { in: open, children: /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(import_material67.Paper, { className: classes.paper, children: [
7997
- /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(import_material67.Box, { className: classes.mb, children: [
7998
- /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Typography, { variant: "h5", component: "div", children: /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
7999
- import_material67.Box,
8278
+ children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Fade, { in: open, children: /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_material70.Paper, { className: classes.paper, children: [
8279
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_material70.Box, { className: classes.mb, children: [
8280
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Typography, { variant: "h5", component: "div", children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
8281
+ import_material70.Box,
8000
8282
  {
8001
8283
  sx: {
8002
8284
  fontWeight: 600
@@ -8004,23 +8286,23 @@ var TwoButtonDialog = ({
8004
8286
  children: title
8005
8287
  }
8006
8288
  ) }),
8007
- /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
8008
- import_material67.Box,
8289
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(
8290
+ import_material70.Box,
8009
8291
  {
8010
8292
  className: classes.mt,
8011
8293
  sx: {
8012
8294
  fontWeight: 600
8013
8295
  },
8014
8296
  children: [
8015
- subtitle1 && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Typography, { variant: "subtitle1", children: subtitle1 }),
8016
- subtitle2 && /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Typography, { variant: "subtitle1", children: subtitle2 })
8297
+ subtitle1 && /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Typography, { variant: "subtitle1", children: subtitle1 }),
8298
+ subtitle2 && /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Typography, { variant: "subtitle1", children: subtitle2 })
8017
8299
  ]
8018
8300
  }
8019
8301
  )
8020
8302
  ] }),
8021
- /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(import_material67.Divider, {}),
8022
- /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(import_material67.Box, { className: classes.buttonContainer, children: [
8023
- /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
8303
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_material70.Divider, {}),
8304
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_material70.Box, { className: classes.buttonContainer, children: [
8305
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
8024
8306
  FilledButton_default,
8025
8307
  {
8026
8308
  copy: cancelLabel,
@@ -8033,7 +8315,7 @@ var TwoButtonDialog = ({
8033
8315
  }
8034
8316
  }
8035
8317
  ),
8036
- /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
8318
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
8037
8319
  FilledButton_default,
8038
8320
  {
8039
8321
  color: "primary",
@@ -8042,7 +8324,7 @@ var TwoButtonDialog = ({
8042
8324
  }
8043
8325
  )
8044
8326
  ] }),
8045
- /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(Loading_default, { isLoading: dialogLoading })
8327
+ /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Loading_default, { isLoading: dialogLoading })
8046
8328
  ] }) })
8047
8329
  }
8048
8330
  );
@@ -8050,30 +8332,30 @@ var TwoButtonDialog = ({
8050
8332
  var TwoButtonDialog_default = TwoButtonDialog;
8051
8333
 
8052
8334
  // src/components/UserBust/UserBust.tsx
8053
- var import_react37 = require("react");
8054
- var import_material68 = require("@mui/material");
8055
- var import_jsx_runtime120 = require("react/jsx-runtime");
8056
- var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { children: [
8057
- /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
8058
- import_material68.Avatar,
8335
+ var import_react40 = require("react");
8336
+ var import_material71 = require("@mui/material");
8337
+ var import_jsx_runtime124 = require("react/jsx-runtime");
8338
+ var UserBust = ({ user, avatarProps, typographyProps }) => /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { children: [
8339
+ /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
8340
+ import_material71.Avatar,
8059
8341
  {
8060
8342
  src: user.profile_picture,
8061
8343
  alt: "user_avatar",
8062
8344
  style: { width: avatarProps.width, height: avatarProps.height }
8063
8345
  }
8064
8346
  ),
8065
- /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { style: { paddingTop: 16 }, children: [
8066
- /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_material68.Typography, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
8067
- /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_material68.Typography, { ...typographyProps.username, children: user.username })
8347
+ /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)("div", { style: { paddingTop: 16 }, children: [
8348
+ /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_material71.Typography, { ...typographyProps.name, children: `${user.first_name} ${user.last_name}` }),
8349
+ /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_material71.Typography, { ...typographyProps.username, children: user.username })
8068
8350
  ] })
8069
8351
  ] });
8070
- var UserBust_default = (0, import_react37.memo)(UserBust);
8352
+ var UserBust_default = (0, import_react40.memo)(UserBust);
8071
8353
 
8072
8354
  // src/components/icons/IconChart.tsx
8073
- var import_jsx_runtime121 = require("react/jsx-runtime");
8355
+ var import_jsx_runtime125 = require("react/jsx-runtime");
8074
8356
  var SvgIconChart = (props) => {
8075
8357
  const { fill } = props;
8076
- return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
8358
+ return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
8077
8359
  "svg",
8078
8360
  {
8079
8361
  width: "20",
@@ -8082,7 +8364,7 @@ var SvgIconChart = (props) => {
8082
8364
  fill: "none",
8083
8365
  xmlns: "http://www.w3.org/2000/svg",
8084
8366
  ...props,
8085
- children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
8367
+ children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
8086
8368
  "path",
8087
8369
  {
8088
8370
  d: "M2.49967 11.6667L2.91634 11.725L6.72467 7.91667C6.57467 7.375 6.71634 6.75833 7.15801 6.325C7.80801 5.66667 8.85801 5.66667 9.50801 6.325C9.94967 6.75833 10.0913 7.375 9.94134 7.91667L12.083 10.0583L12.4997 10C12.6497 10 12.7913 10 12.9163 10.0583L15.8913 7.08333C15.833 6.95833 15.833 6.81667 15.833 6.66667C15.833 6.22464 16.0086 5.80072 16.3212 5.48816C16.6337 5.17559 17.0576 5 17.4997 5C17.9417 5 18.3656 5.17559 18.6782 5.48816C18.9907 5.80072 19.1663 6.22464 19.1663 6.66667C19.1663 7.10869 18.9907 7.53262 18.6782 7.84518C18.3656 8.15774 17.9417 8.33333 17.4997 8.33333C17.3497 8.33333 17.208 8.33333 17.083 8.275L14.108 11.25C14.1663 11.375 14.1663 11.5167 14.1663 11.6667C14.1663 12.1087 13.9907 12.5326 13.6782 12.8452C13.3656 13.1577 12.9417 13.3333 12.4997 13.3333C12.0576 13.3333 11.6337 13.1577 11.3212 12.8452C11.0086 12.5326 10.833 12.1087 10.833 11.6667L10.8913 11.25L8.74967 9.10833C8.48301 9.16667 8.18301 9.16667 7.91634 9.10833L4.10801 12.9167L4.16634 13.3333C4.16634 13.7754 3.99075 14.1993 3.67819 14.5118C3.36563 14.8244 2.9417 15 2.49967 15C2.05765 15 1.63372 14.8244 1.32116 14.5118C1.0086 14.1993 0.833008 13.7754 0.833008 13.3333C0.833008 12.8913 1.0086 12.4674 1.32116 12.1548C1.63372 11.8423 2.05765 11.6667 2.49967 11.6667Z",
@@ -8149,6 +8431,7 @@ var IconChart_default = SvgIconChart;
8149
8431
  ScrollableDialog,
8150
8432
  SearchAndFilterHeader,
8151
8433
  SearchAndFilterHeaderForTable,
8434
+ SearchFieldDebounced,
8152
8435
  SearchWithFilters,
8153
8436
  SearchWithFiltersForTable,
8154
8437
  SectionName,
@@ -8160,6 +8443,9 @@ var IconChart_default = SvgIconChart;
8160
8443
  Switch,
8161
8444
  Table,
8162
8445
  TableDesktop,
8446
+ TableDesktopRowActions,
8447
+ TableDesktopRowCell,
8448
+ TableDesktopSmartSelect,
8163
8449
  TableEmptyResult,
8164
8450
  TableHeader,
8165
8451
  TableLoading,