andoncloud-dashboard-toolkit 1.5.54 → 1.5.55

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,23 +1,24 @@
1
- import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
2
1
  import { Box, Button, Card, CardContent, CardHeader, Chip, Dialog, DialogActions, DialogContent, DialogTitle, FormControl, InputAdornment, InputLabel, List, ListItemButton, ListItemText, MenuItem, Popover, Select, Stack, SvgIcon, TextField, ToggleButton, ToggleButtonGroup, Tooltip, Typography, lighten } from "@mui/material";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { Fragment, forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react";
3
4
  import { Trans, useTranslation } from "react-i18next";
4
5
  import CalendarTodayIcon from "@mui/icons-material/CalendarToday";
5
6
  import { AccessBlocker, AccessGuard, Checkbox, fetch, refreshUserData, registerTranslations, useAccess, useStore } from "andoncloud-sdk";
6
7
  import dayjs from "dayjs";
7
8
  import gql from "graphql-tag";
8
- import "dayjs/locale/pl";
9
+ import "dayjs/locale/pl.js";
9
10
  import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
10
11
  import { DateCalendar } from "@mui/x-date-pickers/DateCalendar";
11
12
  import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
12
13
  import { PickersDay } from "@mui/x-date-pickers/PickersDay";
13
- import isBetween from "dayjs/plugin/isBetween";
14
+ import isBetween from "dayjs/plugin/isBetween.js";
14
15
  import { mergeSx } from "merge-sx";
15
16
  import LockIcon from "@mui/icons-material/Lock";
16
17
  import SearchIcon from "@mui/icons-material/Search";
17
- import isoWeek from "dayjs/plugin/isoWeek";
18
- import quarterOfYear from "dayjs/plugin/quarterOfYear";
18
+ import isoWeek from "dayjs/plugin/isoWeek.js";
19
+ import quarterOfYear from "dayjs/plugin/quarterOfYear.js";
19
20
  import TextTruncate from "react-text-truncate";
20
- import durationPlugin from "dayjs/plugin/duration";
21
+ import durationPlugin from "dayjs/plugin/duration.js";
21
22
  import { keyframes } from "@mui/system";
22
23
  import Select$1, { components } from "react-select";
23
24
  import { DndContext } from "@dnd-kit/core";
@@ -50,34 +51,38 @@ const styles$7 = {
50
51
  //#endregion
51
52
  //#region src/components/ConfirmTooltip/index.tsx
52
53
  const ConfirmTooltip = ({ children, confirmMessage, confirmButtonText, cancelButtonText, onCancel, onConfirm, confirmButtonTestId, cancelButtonTestId, ...props }) => {
53
- return /* @__PURE__ */ React.createElement(Tooltip, {
54
+ return /* @__PURE__ */ jsx(Tooltip, {
54
55
  ...props,
55
56
  placement: "bottom-end",
56
- title: /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Typography, null, confirmMessage), /* @__PURE__ */ React.createElement(Stack, {
57
+ title: /* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Typography, { children: confirmMessage }), /* @__PURE__ */ jsxs(Stack, {
57
58
  direction: "row",
58
59
  justifyContent: "flex-end",
59
- sx: styles$7.buttons
60
- }, /* @__PURE__ */ React.createElement(Button, {
61
- variant: "outlined",
62
- color: "secondary",
63
- onClick: (e) => {
64
- e.stopPropagation();
65
- onCancel();
66
- },
67
- sx: styles$7.cancelButton,
68
- "data-testid": cancelButtonTestId
69
- }, cancelButtonText), /* @__PURE__ */ React.createElement(Button, {
70
- variant: "contained",
71
- color: "error",
72
- onClick: (e) => {
73
- e.stopPropagation();
74
- onConfirm();
75
- },
76
- "data-testid": confirmButtonTestId
77
- }, confirmButtonText))),
60
+ sx: styles$7.buttons,
61
+ children: [/* @__PURE__ */ jsx(Button, {
62
+ variant: "outlined",
63
+ color: "secondary",
64
+ onClick: (e) => {
65
+ e.stopPropagation();
66
+ onCancel();
67
+ },
68
+ sx: styles$7.cancelButton,
69
+ "data-testid": cancelButtonTestId,
70
+ children: cancelButtonText
71
+ }), /* @__PURE__ */ jsx(Button, {
72
+ variant: "contained",
73
+ color: "error",
74
+ onClick: (e) => {
75
+ e.stopPropagation();
76
+ onConfirm();
77
+ },
78
+ "data-testid": confirmButtonTestId,
79
+ children: confirmButtonText
80
+ })]
81
+ })] }),
78
82
  PopperProps: { sx: styles$7.popper },
79
- arrow: true
80
- }, children);
83
+ arrow: true,
84
+ children
85
+ });
81
86
  };
82
87
  //#endregion
83
88
  //#region src/graphql-sdk.ts
@@ -4838,21 +4843,25 @@ const AccessDeniedModal = ({ open, onClose, accessState, buttons, daysSinceExpir
4838
4843
  return success;
4839
4844
  }, [onFeatureRequest, onClose]);
4840
4845
  const { t } = useTranslation();
4841
- return /* @__PURE__ */ React.createElement(Dialog, {
4846
+ return /* @__PURE__ */ jsxs(Dialog, {
4842
4847
  open,
4843
4848
  onClose,
4844
4849
  sx: styles$6.dialog,
4845
- "data-testid": "dashboard-filters.access-denied-dialog"
4846
- }, /* @__PURE__ */ React.createElement(DialogTitle, null, t("dashboardFilters.accessDenied.title")), /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(AccessBlocker, {
4847
- accessState,
4848
- buttons,
4849
- daysSinceExpiry: daysSinceExpiry ?? void 0,
4850
- featureKey: FEATURE_KEY$1,
4851
- workplaceId,
4852
- cooldownInfo,
4853
- onTrialRequest: handleTrialRequest,
4854
- onFeatureRequest: handleFeatureRequest
4855
- }), /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(Button, { onClick: onClose }, t("dashboardFilters.accessDenied.close")))));
4850
+ "data-testid": "dashboard-filters.access-denied-dialog",
4851
+ children: [/* @__PURE__ */ jsx(DialogTitle, { children: t("dashboardFilters.accessDenied.title") }), /* @__PURE__ */ jsxs(DialogContent, { children: [/* @__PURE__ */ jsx(AccessBlocker, {
4852
+ accessState,
4853
+ buttons,
4854
+ daysSinceExpiry: daysSinceExpiry ?? void 0,
4855
+ featureKey: FEATURE_KEY$1,
4856
+ workplaceId,
4857
+ cooldownInfo,
4858
+ onTrialRequest: handleTrialRequest,
4859
+ onFeatureRequest: handleFeatureRequest
4860
+ }), /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsx(Button, {
4861
+ onClick: onClose,
4862
+ children: t("dashboardFilters.accessDenied.close")
4863
+ }) })] })]
4864
+ });
4856
4865
  };
4857
4866
  //#endregion
4858
4867
  //#region src/components/DashboardFilters/DayTypeSelector/styles.ts
@@ -4889,20 +4898,29 @@ const DayTypeSelector = ({ value, onChange }) => {
4889
4898
  const handleChange = useCallback((_event, newValue) => {
4890
4899
  if (newValue !== null) onChange(newValue);
4891
4900
  }, [onChange]);
4892
- return /* @__PURE__ */ React.createElement(Box, { sx: styles$5.container }, /* @__PURE__ */ React.createElement(Typography, { sx: styles$5.label }, t("dashboardFilters.dayType.label")), /* @__PURE__ */ React.createElement(ToggleButtonGroup, {
4893
- value,
4894
- exclusive: true,
4895
- onChange: handleChange,
4896
- size: "small",
4897
- sx: styles$5.toggleGroup,
4898
- "data-testid": "dashboard-filters.day-type-selector"
4899
- }, /* @__PURE__ */ React.createElement(ToggleButton, {
4900
- value: DayType.Calendar,
4901
- "data-testid": "dashboard-filters.day-type-calendar"
4902
- }, t("dashboardFilters.dayType.calendar")), /* @__PURE__ */ React.createElement(ToggleButton, {
4903
- value: DayType.Production,
4904
- "data-testid": "dashboard-filters.day-type-production"
4905
- }, t("dashboardFilters.dayType.production"))));
4901
+ return /* @__PURE__ */ jsxs(Box, {
4902
+ sx: styles$5.container,
4903
+ children: [/* @__PURE__ */ jsx(Typography, {
4904
+ sx: styles$5.label,
4905
+ children: t("dashboardFilters.dayType.label")
4906
+ }), /* @__PURE__ */ jsxs(ToggleButtonGroup, {
4907
+ value,
4908
+ exclusive: true,
4909
+ onChange: handleChange,
4910
+ size: "small",
4911
+ sx: styles$5.toggleGroup,
4912
+ "data-testid": "dashboard-filters.day-type-selector",
4913
+ children: [/* @__PURE__ */ jsx(ToggleButton, {
4914
+ value: DayType.Calendar,
4915
+ "data-testid": "dashboard-filters.day-type-calendar",
4916
+ children: t("dashboardFilters.dayType.calendar")
4917
+ }), /* @__PURE__ */ jsx(ToggleButton, {
4918
+ value: DayType.Production,
4919
+ "data-testid": "dashboard-filters.day-type-production",
4920
+ children: t("dashboardFilters.dayType.production")
4921
+ })]
4922
+ })]
4923
+ });
4906
4924
  };
4907
4925
  //#endregion
4908
4926
  //#region src/helpers/shifts.ts
@@ -5408,7 +5426,7 @@ const PeriodList = ({ dayType, shifts, selectedShiftIds, selectedPeriodId, hasAc
5408
5426
  const { t } = useTranslation();
5409
5427
  const [searchQuery, setSearchQuery] = useState("");
5410
5428
  const [debouncedQuery, setDebouncedQuery] = useState("");
5411
- const debounceRef = React.useRef(null);
5429
+ const debounceRef = useRef(null);
5412
5430
  const handleSearchChange = useCallback((e) => {
5413
5431
  const value = e.target.value;
5414
5432
  setSearchQuery(value);
@@ -5471,38 +5489,45 @@ const PeriodList = ({ dayType, shifts, selectedShiftIds, selectedPeriodId, hasAc
5471
5489
  onPeriodSelect
5472
5490
  ]);
5473
5491
  const showLockIcon = (period) => !hasAccess && period.needAccess;
5474
- return /* @__PURE__ */ React.createElement(Box, {
5492
+ return /* @__PURE__ */ jsxs(Box, {
5475
5493
  sx: styles$4.container,
5476
- "data-testid": "dashboard-filters.period-list"
5477
- }, /* @__PURE__ */ React.createElement(TextField, {
5478
- size: "small",
5479
- label: t("dashboardFilters.search.placeholder"),
5480
- value: searchQuery,
5481
- onChange: handleSearchChange,
5482
- sx: styles$4.searchField,
5483
- InputProps: { startAdornment: /* @__PURE__ */ React.createElement(InputAdornment, { position: "start" }, /* @__PURE__ */ React.createElement(SearchIcon, { fontSize: "small" })) },
5484
- "data-testid": "dashboard-filters.period-search"
5485
- }), /* @__PURE__ */ React.createElement(List, { sx: styles$4.list }, filteredPeriods.length === 0 ? /* @__PURE__ */ React.createElement(ListItemText, {
5486
- sx: styles$4.noResults,
5487
- primary: t("dashboardFilters.search.noResults")
5488
- }) : filteredPeriods.map((period) => /* @__PURE__ */ React.createElement(ListItemButton, {
5489
- key: period.id,
5490
- selected: period.id === selectedPeriodId,
5491
- onClick: () => handlePeriodClick(period),
5492
- sx: styles$4.listItem,
5493
- "data-testid": `dashboard-filters.period-item-${period.id}`
5494
- }, /* @__PURE__ */ React.createElement(ListItemText, {
5495
- primary: getPeriodLabel(period),
5496
- secondary: period.category === "shift_based" ? shiftLabels[period.id] ? `(${shiftLabels[period.id]})` : void 0 : timeRangeLabel ? `(${timeRangeLabel})` : void 0
5497
- }), showLockIcon(period) && /* @__PURE__ */ React.createElement(Chip, {
5498
- icon: /* @__PURE__ */ React.createElement(LockIcon, null),
5499
- label: t("dashboardFilters.premium.indicator"),
5500
- size: "small",
5501
- color: "warning",
5502
- variant: "outlined",
5503
- sx: styles$4.premiumChip,
5504
- "data-testid": "dashboard-filters.premium-chip"
5505
- })))));
5494
+ "data-testid": "dashboard-filters.period-list",
5495
+ children: [/* @__PURE__ */ jsx(TextField, {
5496
+ size: "small",
5497
+ label: t("dashboardFilters.search.placeholder"),
5498
+ value: searchQuery,
5499
+ onChange: handleSearchChange,
5500
+ sx: styles$4.searchField,
5501
+ InputProps: { startAdornment: /* @__PURE__ */ jsx(InputAdornment, {
5502
+ position: "start",
5503
+ children: /* @__PURE__ */ jsx(SearchIcon, { fontSize: "small" })
5504
+ }) },
5505
+ "data-testid": "dashboard-filters.period-search"
5506
+ }), /* @__PURE__ */ jsx(List, {
5507
+ sx: styles$4.list,
5508
+ children: filteredPeriods.length === 0 ? /* @__PURE__ */ jsx(ListItemText, {
5509
+ sx: styles$4.noResults,
5510
+ primary: t("dashboardFilters.search.noResults")
5511
+ }) : filteredPeriods.map((period) => /* @__PURE__ */ jsxs(ListItemButton, {
5512
+ selected: period.id === selectedPeriodId,
5513
+ onClick: () => handlePeriodClick(period),
5514
+ sx: styles$4.listItem,
5515
+ "data-testid": `dashboard-filters.period-item-${period.id}`,
5516
+ children: [/* @__PURE__ */ jsx(ListItemText, {
5517
+ primary: getPeriodLabel(period),
5518
+ secondary: period.category === "shift_based" ? shiftLabels[period.id] ? `(${shiftLabels[period.id]})` : void 0 : timeRangeLabel ? `(${timeRangeLabel})` : void 0
5519
+ }), showLockIcon(period) && /* @__PURE__ */ jsx(Chip, {
5520
+ icon: /* @__PURE__ */ jsx(LockIcon, {}),
5521
+ label: t("dashboardFilters.premium.indicator"),
5522
+ size: "small",
5523
+ color: "warning",
5524
+ variant: "outlined",
5525
+ sx: styles$4.premiumChip,
5526
+ "data-testid": "dashboard-filters.premium-chip"
5527
+ })]
5528
+ }, period.id))
5529
+ })]
5530
+ });
5506
5531
  };
5507
5532
  //#endregion
5508
5533
  //#region src/components/DashboardFilters/DateRangePicker/styles.ts
@@ -5577,10 +5602,13 @@ const RangeDay = ({ fromDate, toDate, day, ...other }) => {
5577
5602
  const isStart = dayDate.isSame(fromDate, "day");
5578
5603
  const isEnd = dayDate.isSame(toDate, "day");
5579
5604
  const isSingleDay = isStart && isEnd;
5580
- return /* @__PURE__ */ React.createElement(Box, { sx: mergeSx(styles$3.rangeDay, isInRange && !isSingleDay && styles$3.rangeDayInRange, isStart && !isSingleDay && styles$3.rangeDayStart, isEnd && !isSingleDay && styles$3.rangeDayEnd) }, /* @__PURE__ */ React.createElement(PickersDay, {
5581
- day,
5582
- ...other
5583
- }));
5605
+ return /* @__PURE__ */ jsx(Box, {
5606
+ sx: mergeSx(styles$3.rangeDay, isInRange && !isSingleDay && styles$3.rangeDayInRange, isStart && !isSingleDay && styles$3.rangeDayStart, isEnd && !isSingleDay && styles$3.rangeDayEnd),
5607
+ children: /* @__PURE__ */ jsx(PickersDay, {
5608
+ day,
5609
+ ...other
5610
+ })
5611
+ });
5584
5612
  };
5585
5613
  const DateRangePicker = ({ dateRange, dayType, shifts, selectedShiftIds, hasAccess, selectedPeriodId, onDayTypeChange, onDateRangeChange, onPeriodSelect }) => {
5586
5614
  const { t, i18n } = useTranslation();
@@ -5620,50 +5648,63 @@ const DateRangePicker = ({ dateRange, dayType, shifts, selectedShiftIds, hasAcce
5620
5648
  fromDate,
5621
5649
  toDate
5622
5650
  } }), [fromDate, toDate]);
5623
- return /* @__PURE__ */ React.createElement(LocalizationProvider, {
5651
+ return /* @__PURE__ */ jsx(LocalizationProvider, {
5624
5652
  dateAdapter: AdapterDayjs,
5625
- adapterLocale: i18n.language
5626
- }, /* @__PURE__ */ React.createElement(Box, { sx: styles$3.container }, /* @__PURE__ */ React.createElement(Box, { sx: styles$3.leftPanel }, /* @__PURE__ */ React.createElement(DayTypeSelector, {
5627
- value: dayType,
5628
- onChange: onDayTypeChange
5629
- }), /* @__PURE__ */ React.createElement(PeriodList, {
5630
- dayType,
5631
- shifts,
5632
- selectedShiftIds,
5633
- selectedPeriodId,
5634
- hasAccess,
5635
- onPeriodSelect
5636
- })), /* @__PURE__ */ React.createElement(Box, { sx: styles$3.rightPanel }, /* @__PURE__ */ React.createElement(Box, { sx: styles$3.dateInputs }, /* @__PURE__ */ React.createElement(TextField, {
5637
- label: t("dashboardFilters.dateRange.from"),
5638
- value: fromDate.format("YYYY-MM-DD"),
5639
- onClick: handleFromClick,
5640
- focused: activeField === "from",
5641
- InputProps: { readOnly: true },
5642
- size: "small",
5643
- sx: styles$3.dateField,
5644
- "data-testid": "dashboard-filters.date-from"
5645
- }), /* @__PURE__ */ React.createElement(TextField, {
5646
- label: t("dashboardFilters.dateRange.to"),
5647
- value: toDate.format("YYYY-MM-DD"),
5648
- onClick: handleToClick,
5649
- focused: activeField === "to",
5650
- InputProps: { readOnly: true },
5651
- size: "small",
5652
- sx: styles$3.dateField,
5653
- "data-testid": "dashboard-filters.date-to"
5654
- })), /* @__PURE__ */ React.createElement(Box, {
5655
- sx: styles$3.calendarContainer,
5656
- "data-testid": "dashboard-filters.date-calendar"
5657
- }, /* @__PURE__ */ React.createElement(DateCalendar, {
5658
- key: `${dateRange.from}-${dateRange.to}`,
5659
- value: calendarValue,
5660
- onChange: handleCalendarChange,
5661
- minDate,
5662
- maxDate: today,
5663
- sx: styles$3.calendar,
5664
- slots: { day: RangeDay },
5665
- slotProps
5666
- })))));
5653
+ adapterLocale: i18n.language,
5654
+ children: /* @__PURE__ */ jsxs(Box, {
5655
+ sx: styles$3.container,
5656
+ children: [/* @__PURE__ */ jsxs(Box, {
5657
+ sx: styles$3.leftPanel,
5658
+ children: [/* @__PURE__ */ jsx(DayTypeSelector, {
5659
+ value: dayType,
5660
+ onChange: onDayTypeChange
5661
+ }), /* @__PURE__ */ jsx(PeriodList, {
5662
+ dayType,
5663
+ shifts,
5664
+ selectedShiftIds,
5665
+ selectedPeriodId,
5666
+ hasAccess,
5667
+ onPeriodSelect
5668
+ })]
5669
+ }), /* @__PURE__ */ jsxs(Box, {
5670
+ sx: styles$3.rightPanel,
5671
+ children: [/* @__PURE__ */ jsxs(Box, {
5672
+ sx: styles$3.dateInputs,
5673
+ children: [/* @__PURE__ */ jsx(TextField, {
5674
+ label: t("dashboardFilters.dateRange.from"),
5675
+ value: fromDate.format("YYYY-MM-DD"),
5676
+ onClick: handleFromClick,
5677
+ focused: activeField === "from",
5678
+ InputProps: { readOnly: true },
5679
+ size: "small",
5680
+ sx: styles$3.dateField,
5681
+ "data-testid": "dashboard-filters.date-from"
5682
+ }), /* @__PURE__ */ jsx(TextField, {
5683
+ label: t("dashboardFilters.dateRange.to"),
5684
+ value: toDate.format("YYYY-MM-DD"),
5685
+ onClick: handleToClick,
5686
+ focused: activeField === "to",
5687
+ InputProps: { readOnly: true },
5688
+ size: "small",
5689
+ sx: styles$3.dateField,
5690
+ "data-testid": "dashboard-filters.date-to"
5691
+ })]
5692
+ }), /* @__PURE__ */ jsx(Box, {
5693
+ sx: styles$3.calendarContainer,
5694
+ "data-testid": "dashboard-filters.date-calendar",
5695
+ children: /* @__PURE__ */ jsx(DateCalendar, {
5696
+ value: calendarValue,
5697
+ onChange: handleCalendarChange,
5698
+ minDate,
5699
+ maxDate: today,
5700
+ sx: styles$3.calendar,
5701
+ slots: { day: RangeDay },
5702
+ slotProps
5703
+ }, `${dateRange.from}-${dateRange.to}`)
5704
+ })]
5705
+ })]
5706
+ })
5707
+ });
5667
5708
  };
5668
5709
  //#endregion
5669
5710
  //#region src/components/DashboardFilters/ShiftSelector/styles.ts
@@ -5700,26 +5741,34 @@ const ShiftSelector = ({ shifts, selectedShiftIds, onChange }) => {
5700
5741
  if (selected.length === 0) return t("dashboardFilters.shifts.allShifts");
5701
5742
  return shifts.filter((s) => selected.includes(s.id)).map((s) => s.name).join(", ");
5702
5743
  }, [shifts, t]);
5703
- return /* @__PURE__ */ React.createElement(Box, { sx: styles$2.container }, /* @__PURE__ */ React.createElement(FormControl, {
5704
- size: "small",
5705
- sx: styles$2.select,
5706
- "data-testid": "dashboard-filters.shift-selector"
5707
- }, /* @__PURE__ */ React.createElement(InputLabel, { shrink: true }, t("dashboardFilters.shifts.label")), /* @__PURE__ */ React.createElement(Select, {
5708
- multiple: true,
5709
- displayEmpty: true,
5710
- value: selectedShiftIds,
5711
- onChange: handleChange,
5712
- renderValue,
5713
- label: t("dashboardFilters.shifts.label")
5714
- }, shifts.map((shift) => /* @__PURE__ */ React.createElement(MenuItem, {
5715
- key: shift.id,
5716
- value: shift.id,
5717
- sx: styles$2.menuItem
5718
- }, /* @__PURE__ */ React.createElement(Checkbox, { checked: selectedShiftIds.includes(shift.id) }), /* @__PURE__ */ React.createElement(ListItemText, {
5719
- primary: shift.name,
5720
- secondary: `(${getShiftTimeRange(shift)})`,
5721
- sx: styles$2.listItemText
5722
- }))))));
5744
+ return /* @__PURE__ */ jsx(Box, {
5745
+ sx: styles$2.container,
5746
+ children: /* @__PURE__ */ jsxs(FormControl, {
5747
+ size: "small",
5748
+ sx: styles$2.select,
5749
+ "data-testid": "dashboard-filters.shift-selector",
5750
+ children: [/* @__PURE__ */ jsx(InputLabel, {
5751
+ shrink: true,
5752
+ children: t("dashboardFilters.shifts.label")
5753
+ }), /* @__PURE__ */ jsx(Select, {
5754
+ multiple: true,
5755
+ displayEmpty: true,
5756
+ value: selectedShiftIds,
5757
+ onChange: handleChange,
5758
+ renderValue,
5759
+ label: t("dashboardFilters.shifts.label"),
5760
+ children: shifts.map((shift) => /* @__PURE__ */ jsxs(MenuItem, {
5761
+ value: shift.id,
5762
+ sx: styles$2.menuItem,
5763
+ children: [/* @__PURE__ */ jsx(Checkbox, { checked: selectedShiftIds.includes(shift.id) }), /* @__PURE__ */ jsx(ListItemText, {
5764
+ primary: shift.name,
5765
+ secondary: `(${getShiftTimeRange(shift)})`,
5766
+ sx: styles$2.listItemText
5767
+ })]
5768
+ }, shift.id))
5769
+ })]
5770
+ })
5771
+ });
5723
5772
  };
5724
5773
  //#endregion
5725
5774
  //#region src/components/DashboardFilters/useDashboardFilters.ts
@@ -5923,60 +5972,75 @@ const DashboardFilters = ({ initialValues, onChange, shifts = [], onFeatureReque
5923
5972
  const to = dayjs(range.to).format("YYYY-MM-DD");
5924
5973
  return from === to ? from : `${from} - ${to}`;
5925
5974
  };
5926
- return /* @__PURE__ */ React.createElement(Box, { sx: styles$1.container }, /* @__PURE__ */ React.createElement(Stack, {
5927
- direction: "row",
5928
- spacing: 2,
5929
- alignItems: "center"
5930
- }, /* @__PURE__ */ React.createElement(TextField, {
5931
- ref: dateFieldRef,
5932
- label: t("dashboardFilters.dateRange.label"),
5933
- value: formatDateRange(filterValues.dateRange),
5934
- onClick: handlePopoverOpen,
5935
- size: "small",
5936
- InputProps: {
5937
- readOnly: true,
5938
- startAdornment: /* @__PURE__ */ React.createElement(InputAdornment, { position: "start" }, /* @__PURE__ */ React.createElement(CalendarTodayIcon, { sx: { fontSize: 16 } }))
5939
- },
5940
- sx: styles$1.dateField,
5941
- "data-testid": "dashboard-filters.date-range-input"
5942
- }), /* @__PURE__ */ React.createElement(ShiftSelector, {
5943
- shifts,
5944
- selectedShiftIds: filterValues.shiftIds,
5945
- onChange: handlers.handleShiftChange
5946
- })), /* @__PURE__ */ React.createElement(Popover, {
5947
- open: popoverOpen,
5948
- anchorEl: dateFieldRef.current,
5949
- onClose: handlePopoverClose,
5950
- anchorOrigin: {
5951
- vertical: "bottom",
5952
- horizontal: "left"
5953
- },
5954
- transformOrigin: {
5955
- vertical: "top",
5956
- horizontal: "left"
5957
- },
5958
- sx: styles$1.popover,
5959
- "data-testid": "dashboard-filters.date-popover"
5960
- }, /* @__PURE__ */ React.createElement(Box, { sx: styles$1.popoverContent }, /* @__PURE__ */ React.createElement(DateRangePicker, {
5961
- dateRange: filterValues.dateRange,
5962
- dayType: filterValues.dayType,
5963
- shifts,
5964
- selectedShiftIds: filterValues.shiftIds,
5965
- hasAccess,
5966
- selectedPeriodId,
5967
- onDayTypeChange: handlers.handleDayTypeChange,
5968
- onDateRangeChange: handlers.handleDateRangeChange,
5969
- onPeriodSelect: handlePeriodSelect,
5970
- onAccessDenied: handleAccessDenied
5971
- }))), /* @__PURE__ */ React.createElement(AccessDeniedModal, {
5972
- open: accessModalOpen,
5973
- onClose: handleAccessModalClose,
5974
- accessState,
5975
- buttons: filteredButtons,
5976
- daysSinceExpiry,
5977
- cooldownInfo,
5978
- onFeatureRequest
5979
- }));
5975
+ return /* @__PURE__ */ jsxs(Box, {
5976
+ sx: styles$1.container,
5977
+ children: [
5978
+ /* @__PURE__ */ jsxs(Stack, {
5979
+ direction: "row",
5980
+ spacing: 2,
5981
+ alignItems: "center",
5982
+ children: [/* @__PURE__ */ jsx(TextField, {
5983
+ ref: dateFieldRef,
5984
+ label: t("dashboardFilters.dateRange.label"),
5985
+ value: formatDateRange(filterValues.dateRange),
5986
+ onClick: handlePopoverOpen,
5987
+ size: "small",
5988
+ InputProps: {
5989
+ readOnly: true,
5990
+ startAdornment: /* @__PURE__ */ jsx(InputAdornment, {
5991
+ position: "start",
5992
+ children: /* @__PURE__ */ jsx(CalendarTodayIcon, { sx: { fontSize: 16 } })
5993
+ })
5994
+ },
5995
+ sx: styles$1.dateField,
5996
+ "data-testid": "dashboard-filters.date-range-input"
5997
+ }), /* @__PURE__ */ jsx(ShiftSelector, {
5998
+ shifts,
5999
+ selectedShiftIds: filterValues.shiftIds,
6000
+ onChange: handlers.handleShiftChange
6001
+ })]
6002
+ }),
6003
+ /* @__PURE__ */ jsx(Popover, {
6004
+ open: popoverOpen,
6005
+ anchorEl: dateFieldRef.current,
6006
+ onClose: handlePopoverClose,
6007
+ anchorOrigin: {
6008
+ vertical: "bottom",
6009
+ horizontal: "left"
6010
+ },
6011
+ transformOrigin: {
6012
+ vertical: "top",
6013
+ horizontal: "left"
6014
+ },
6015
+ sx: styles$1.popover,
6016
+ "data-testid": "dashboard-filters.date-popover",
6017
+ children: /* @__PURE__ */ jsx(Box, {
6018
+ sx: styles$1.popoverContent,
6019
+ children: /* @__PURE__ */ jsx(DateRangePicker, {
6020
+ dateRange: filterValues.dateRange,
6021
+ dayType: filterValues.dayType,
6022
+ shifts,
6023
+ selectedShiftIds: filterValues.shiftIds,
6024
+ hasAccess,
6025
+ selectedPeriodId,
6026
+ onDayTypeChange: handlers.handleDayTypeChange,
6027
+ onDateRangeChange: handlers.handleDateRangeChange,
6028
+ onPeriodSelect: handlePeriodSelect,
6029
+ onAccessDenied: handleAccessDenied
6030
+ })
6031
+ })
6032
+ }),
6033
+ /* @__PURE__ */ jsx(AccessDeniedModal, {
6034
+ open: accessModalOpen,
6035
+ onClose: handleAccessModalClose,
6036
+ accessState,
6037
+ buttons: filteredButtons,
6038
+ daysSinceExpiry,
6039
+ cooldownInfo,
6040
+ onFeatureRequest
6041
+ })
6042
+ ]
6043
+ });
5980
6044
  };
5981
6045
  //#endregion
5982
6046
  //#region src/assets/bg-pattern.ts
@@ -6224,29 +6288,52 @@ const MetricCard = ({ title, metricLabel, metricValue, progressValue, extraValue
6224
6288
  backgroundColor: getBackgroundColor(),
6225
6289
  animateBackgroundColor
6226
6290
  });
6227
- return /* @__PURE__ */ React.createElement(Card, {
6291
+ return /* @__PURE__ */ jsxs(Card, {
6228
6292
  sx: styles.card,
6229
- ...props
6230
- }, /* @__PURE__ */ React.createElement(Box, { sx: styles.cardOverlay }), /* @__PURE__ */ React.createElement(CardHeader, {
6231
- title: /* @__PURE__ */ React.createElement(TextTruncate, {
6232
- line: 1,
6233
- text: title
6234
- }),
6235
- sx: styles.cardHeader
6236
- }), /* @__PURE__ */ React.createElement(CardContent, { sx: styles.cardContent }, /* @__PURE__ */ React.createElement(Typography, { sx: styles.cardLabel }, metricLabel), /* @__PURE__ */ React.createElement(Typography, { sx: styles.cardValue }, metricValue ? formatValue(metricValue) : /* @__PURE__ */ React.createElement(Trans, { t }, "No value for the selected metric")), extraValue && /* @__PURE__ */ React.createElement(Typography, { sx: styles.cardExtra }, extraValue)));
6293
+ ...props,
6294
+ children: [
6295
+ /* @__PURE__ */ jsx(Box, { sx: styles.cardOverlay }),
6296
+ /* @__PURE__ */ jsx(CardHeader, {
6297
+ title: /* @__PURE__ */ jsx(TextTruncate, {
6298
+ line: 1,
6299
+ text: title
6300
+ }),
6301
+ sx: styles.cardHeader
6302
+ }),
6303
+ /* @__PURE__ */ jsxs(CardContent, {
6304
+ sx: styles.cardContent,
6305
+ children: [
6306
+ /* @__PURE__ */ jsx(Typography, {
6307
+ sx: styles.cardLabel,
6308
+ children: metricLabel
6309
+ }),
6310
+ /* @__PURE__ */ jsx(Typography, {
6311
+ sx: styles.cardValue,
6312
+ children: metricValue ? formatValue(metricValue) : /* @__PURE__ */ jsx(Trans, {
6313
+ t,
6314
+ children: "No value for the selected metric"
6315
+ })
6316
+ }),
6317
+ extraValue && /* @__PURE__ */ jsx(Typography, {
6318
+ sx: styles.cardExtra,
6319
+ children: extraValue
6320
+ })
6321
+ ]
6322
+ })
6323
+ ]
6324
+ });
6237
6325
  };
6238
6326
  //#endregion
6239
6327
  //#region src/components/SortableSelect/index.tsx
6240
6328
  const SortableMultiValueContainer = (props) => {
6241
6329
  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: props.data.value });
6242
- const style = {
6243
- display: "flex",
6244
- transform: CSS.Transform.toString(transform),
6245
- transition
6246
- };
6247
- return /* @__PURE__ */ React.createElement("div", {
6330
+ return /* @__PURE__ */ jsx("div", {
6248
6331
  ref: setNodeRef,
6249
- style,
6332
+ style: {
6333
+ display: "flex",
6334
+ transform: CSS.Transform.toString(transform),
6335
+ transition
6336
+ },
6250
6337
  ...attributes,
6251
6338
  ...listeners,
6252
6339
  onPointerDown: (e) => {
@@ -6256,8 +6343,9 @@ const SortableMultiValueContainer = (props) => {
6256
6343
  e.stopPropagation();
6257
6344
  }
6258
6345
  listeners?.onPointerDown(e);
6259
- }
6260
- }, /* @__PURE__ */ React.createElement(components.MultiValueContainer, props));
6346
+ },
6347
+ children: /* @__PURE__ */ jsx(components.MultiValueContainer, { ...props })
6348
+ });
6261
6349
  };
6262
6350
  const SortableMultiValueLabel = (props) => {
6263
6351
  const onMouseDown = (e) => {
@@ -6270,7 +6358,7 @@ const SortableMultiValueLabel = (props) => {
6270
6358
  style,
6271
6359
  onMouseDown
6272
6360
  };
6273
- return /* @__PURE__ */ React.createElement(components.MultiValueLabel, {
6361
+ return /* @__PURE__ */ jsx(components.MultiValueLabel, {
6274
6362
  ...props,
6275
6363
  innerProps
6276
6364
  });
@@ -6280,7 +6368,7 @@ const SortableSelect = ({ placeholder, options, selected, onChange }) => {
6280
6368
  const { active, over } = event;
6281
6369
  if (active.id !== over?.id) onChange(arrayMoveImmutable(selected, selected.findIndex((opt) => opt === active.id), selected.findIndex((opt) => opt === over?.id)));
6282
6370
  };
6283
- return /* @__PURE__ */ React.createElement(Select$1, {
6371
+ return /* @__PURE__ */ jsx(Select$1, {
6284
6372
  placeholder,
6285
6373
  isMulti: true,
6286
6374
  options,
@@ -6290,7 +6378,13 @@ const SortableSelect = ({ placeholder, options, selected, onChange }) => {
6290
6378
  components: {
6291
6379
  MultiValueContainer: SortableMultiValueContainer,
6292
6380
  MultiValueLabel: SortableMultiValueLabel,
6293
- ValueContainer: (props) => /* @__PURE__ */ React.createElement(DndContext, { onDragEnd: onSortEnd }, /* @__PURE__ */ React.createElement(SortableContext, { items: selected }, props.children))
6381
+ ValueContainer: (props) => /* @__PURE__ */ jsx(DndContext, {
6382
+ onDragEnd: onSortEnd,
6383
+ children: /* @__PURE__ */ jsx(SortableContext, {
6384
+ items: selected,
6385
+ children: props.children
6386
+ })
6387
+ })
6294
6388
  },
6295
6389
  styles: {
6296
6390
  control: (baseStyles, state) => ({
@@ -6320,17 +6414,18 @@ const SortableSelect = ({ placeholder, options, selected, onChange }) => {
6320
6414
  };
6321
6415
  //#endregion
6322
6416
  //#region src/assets/DragIcon.tsx
6323
- const DragIcon = (props) => /* @__PURE__ */ React.createElement("svg", {
6417
+ const DragIcon = (props) => /* @__PURE__ */ jsx("svg", {
6324
6418
  width: "16",
6325
6419
  height: "16",
6326
6420
  viewBox: "0 0 16 16",
6327
6421
  fill: "none",
6328
6422
  xmlns: "http://www.w3.org/2000/svg",
6329
- ...props
6330
- }, /* @__PURE__ */ React.createElement("path", {
6331
- d: "M2.46147 10.5737C2.99531 11.0586 3.63181 10.6829 3.63181 10.0478V8.74325H7.26604V12.3699H5.94512C5.30862 12.3699 4.93904 13.0119 5.41813 13.5378L7.42345 15.7234C7.75197 16.0922 8.25159 16.0922 8.58011 15.7234L10.5786 13.5447C11.0645 13.0119 10.6949 12.3699 10.0516 12.3699H8.74437V8.74325H12.3649V10.0478C12.3649 10.6829 13.0083 11.0586 13.5421 10.5737L15.7254 8.57933C16.095 8.24467 16.0881 7.74609 15.7254 7.42508L13.5353 5.42393C13.0083 4.94584 12.3649 5.31465 12.3649 5.94983V7.26117H8.74437V3.62767H10.0516C10.6949 3.62767 11.0645 2.98566 10.5786 2.45293L8.57327 0.267369C8.23791 -0.101445 7.73828 -0.0809553 7.41661 0.281028L5.41813 2.46659C4.93904 2.98566 5.30862 3.62767 5.94512 3.62767H7.26604V7.26117H3.63181V5.94983C3.63181 5.31465 2.98846 4.94584 2.46831 5.42393L0.278192 7.41825C-0.0777021 7.73926 -0.105079 8.23784 0.271348 8.5725L2.46147 10.5737Z",
6332
- fill: "white"
6333
- }));
6423
+ ...props,
6424
+ children: /* @__PURE__ */ jsx("path", {
6425
+ d: "M2.46147 10.5737C2.99531 11.0586 3.63181 10.6829 3.63181 10.0478V8.74325H7.26604V12.3699H5.94512C5.30862 12.3699 4.93904 13.0119 5.41813 13.5378L7.42345 15.7234C7.75197 16.0922 8.25159 16.0922 8.58011 15.7234L10.5786 13.5447C11.0645 13.0119 10.6949 12.3699 10.0516 12.3699H8.74437V8.74325H12.3649V10.0478C12.3649 10.6829 13.0083 11.0586 13.5421 10.5737L15.7254 8.57933C16.095 8.24467 16.0881 7.74609 15.7254 7.42508L13.5353 5.42393C13.0083 4.94584 12.3649 5.31465 12.3649 5.94983V7.26117H8.74437V3.62767H10.0516C10.6949 3.62767 11.0645 2.98566 10.5786 2.45293L8.57327 0.267369C8.23791 -0.101445 7.73828 -0.0809553 7.41661 0.281028L5.41813 2.46659C4.93904 2.98566 5.30862 3.62767 5.94512 3.62767H7.26604V7.26117H3.63181V5.94983C3.63181 5.31465 2.98846 4.94584 2.46831 5.42393L0.278192 7.41825C-0.0777021 7.73926 -0.105079 8.23784 0.271348 8.5725L2.46147 10.5737Z",
6426
+ fill: "white"
6427
+ })
6428
+ });
6334
6429
  //#endregion
6335
6430
  //#region src/utils/actioncable-client.ts
6336
6431
  const CHANNEL_ID_RANGE = 1e5;
@@ -6524,24 +6619,30 @@ const container = {
6524
6619
  //#region src/components/WidgetCard/ErrorBoundary.tsx
6525
6620
  const ErrorFallback = ({ resetErrorBoundary }) => {
6526
6621
  const { t } = useTranslation();
6527
- return /* @__PURE__ */ React.createElement(Box, { sx: container }, /* @__PURE__ */ React.createElement(Typography, {
6528
- variant: "body2",
6529
- color: "text.secondary"
6530
- }, t("widgetCard.error")), /* @__PURE__ */ React.createElement(Button, {
6531
- variant: "outlined",
6532
- size: "small",
6533
- onClick: resetErrorBoundary,
6534
- "data-testid": "widget-card.error-retry"
6535
- }, t("widgetCard.retry")));
6622
+ return /* @__PURE__ */ jsxs(Box, {
6623
+ sx: container,
6624
+ children: [/* @__PURE__ */ jsx(Typography, {
6625
+ variant: "body2",
6626
+ color: "text.secondary",
6627
+ children: t("widgetCard.error")
6628
+ }), /* @__PURE__ */ jsx(Button, {
6629
+ variant: "outlined",
6630
+ size: "small",
6631
+ onClick: resetErrorBoundary,
6632
+ "data-testid": "widget-card.error-retry",
6633
+ children: t("widgetCard.retry")
6634
+ })]
6635
+ });
6536
6636
  };
6537
6637
  const handleError = (error, info) => {
6538
6638
  console.error("[dashboard-toolkit] Widget error:", error, info);
6539
6639
  };
6540
6640
  const WidgetErrorBoundary = ({ children }) => {
6541
- return /* @__PURE__ */ React.createElement(ErrorBoundary, {
6641
+ return /* @__PURE__ */ jsx(ErrorBoundary, {
6542
6642
  FallbackComponent: ErrorFallback,
6543
- onError: handleError
6544
- }, children);
6643
+ onError: handleError,
6644
+ children
6645
+ });
6545
6646
  };
6546
6647
  //#endregion
6547
6648
  //#region src/assets/resize-icon.ts
@@ -6688,7 +6789,7 @@ const styles = {
6688
6789
  };
6689
6790
  //#endregion
6690
6791
  //#region src/components/WidgetCard/index.tsx
6691
- const WidgetCard = React.forwardRef(({ children, title, Widget, id, getDisplayName, getTitle, thumbnail, url, wsUrl, lang, filters, openSettingsModal, onSettingsModalOpened, onSettingsModalClosed, sidePanelOpened, updateSidePanelProps, onDelete, editMode, version, requiredFeatures, extraPermissions, ...cardProps }, ref) => {
6792
+ const WidgetCard = forwardRef(({ children, title, Widget, id, getDisplayName, getTitle, thumbnail, url, wsUrl, lang, filters, openSettingsModal, onSettingsModalOpened, onSettingsModalClosed, sidePanelOpened, updateSidePanelProps, onDelete, editMode, version, requiredFeatures, extraPermissions, ...cardProps }, ref) => {
6692
6793
  const { graphqlSdk } = useGqlClients({
6693
6794
  url,
6694
6795
  wsUrl,
@@ -6760,7 +6861,7 @@ const WidgetCard = React.forwardRef(({ children, title, Widget, id, getDisplayNa
6760
6861
  }
6761
6862
  };
6762
6863
  const renderDragHandle = () => {
6763
- return /* @__PURE__ */ React.createElement(SvgIcon, {
6864
+ return /* @__PURE__ */ jsx(SvgIcon, {
6764
6865
  component: DragIcon,
6765
6866
  className: "draggable-handle",
6766
6867
  sx: styles.dragIcon,
@@ -6768,77 +6869,103 @@ const WidgetCard = React.forwardRef(({ children, title, Widget, id, getDisplayNa
6768
6869
  });
6769
6870
  };
6770
6871
  const renderActionButtons = () => {
6771
- return /* @__PURE__ */ React.createElement(Stack, {
6872
+ return /* @__PURE__ */ jsxs(Stack, {
6772
6873
  direction: "row",
6773
- sx: styles.actionButtons
6774
- }, /* @__PURE__ */ React.createElement(Button, {
6775
- color: "secondary",
6776
- sx: styles.settingsButton,
6777
- onClick: handleOpenSettingsModal,
6778
- disabled: !hasAccess,
6779
- "data-testid": "widget-card.settings-button"
6780
- }, /* @__PURE__ */ React.createElement(Settings, null)), version && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Tooltip, { title: version }, /* @__PURE__ */ React.createElement(Button, {
6781
- color: "secondary",
6782
- sx: styles.infoButton,
6783
- "data-testid": "widget-card.info-button"
6784
- }, /* @__PURE__ */ React.createElement(Info, null)))), /* @__PURE__ */ React.createElement(ConfirmTooltip, {
6785
- open: removeTooltipOpened,
6786
- confirmMessage: t("Are you sure you want to delete this widget?"),
6787
- confirmButtonText: t("Delete"),
6788
- cancelButtonText: t("Cancel"),
6789
- onCancel: () => setRemoveTooltipOpened(false),
6790
- onConfirm: handleDelete,
6791
- confirmButtonTestId: "widget-card.delete-confirm",
6792
- cancelButtonTestId: "widget-card.delete-cancel"
6793
- }, /* @__PURE__ */ React.createElement(LoadingButton, {
6794
- color: "secondary",
6795
- sx: styles.deleteButton,
6796
- onClick: (e) => {
6797
- e.stopPropagation();
6798
- setRemoveTooltipOpened(true);
6799
- },
6800
- loading: deleteInProgress,
6801
- "data-testid": "widget-card.delete-button"
6802
- }, /* @__PURE__ */ React.createElement(Delete, null))));
6874
+ sx: styles.actionButtons,
6875
+ children: [
6876
+ /* @__PURE__ */ jsx(Button, {
6877
+ color: "secondary",
6878
+ sx: styles.settingsButton,
6879
+ onClick: handleOpenSettingsModal,
6880
+ disabled: !hasAccess,
6881
+ "data-testid": "widget-card.settings-button",
6882
+ children: /* @__PURE__ */ jsx(Settings, {})
6883
+ }),
6884
+ version && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Tooltip, {
6885
+ title: version,
6886
+ children: /* @__PURE__ */ jsx(Button, {
6887
+ color: "secondary",
6888
+ sx: styles.infoButton,
6889
+ "data-testid": "widget-card.info-button",
6890
+ children: /* @__PURE__ */ jsx(Info, {})
6891
+ })
6892
+ }) }),
6893
+ /* @__PURE__ */ jsx(ConfirmTooltip, {
6894
+ open: removeTooltipOpened,
6895
+ confirmMessage: t("Are you sure you want to delete this widget?"),
6896
+ confirmButtonText: t("Delete"),
6897
+ cancelButtonText: t("Cancel"),
6898
+ onCancel: () => setRemoveTooltipOpened(false),
6899
+ onConfirm: handleDelete,
6900
+ confirmButtonTestId: "widget-card.delete-confirm",
6901
+ cancelButtonTestId: "widget-card.delete-cancel",
6902
+ children: /* @__PURE__ */ jsx(LoadingButton, {
6903
+ color: "secondary",
6904
+ sx: styles.deleteButton,
6905
+ onClick: (e) => {
6906
+ e.stopPropagation();
6907
+ setRemoveTooltipOpened(true);
6908
+ },
6909
+ loading: deleteInProgress,
6910
+ "data-testid": "widget-card.delete-button",
6911
+ children: /* @__PURE__ */ jsx(Delete, {})
6912
+ })
6913
+ })
6914
+ ]
6915
+ });
6803
6916
  };
6804
- return /* @__PURE__ */ React.createElement(Card, {
6917
+ return /* @__PURE__ */ jsxs(Card, {
6805
6918
  ref,
6806
6919
  sx: styles.root,
6807
- ...cardProps
6808
- }, /* @__PURE__ */ React.createElement(CardHeader, {
6809
- avatar: /* @__PURE__ */ React.createElement(Box, { sx: mergeSx(styles.controls, !editMode && styles.controlsHiddenLeft) }, renderDragHandle()),
6810
- title: /* @__PURE__ */ React.createElement(Typography, {
6811
- variant: "subtitle1",
6812
- sx: mergeSx(styles.title, !editMode && styles.titlePreview),
6813
- "data-testid": "widget-card.title"
6814
- }, displayTitle),
6815
- action: /* @__PURE__ */ React.createElement(Box, { sx: mergeSx(styles.controls, !editMode && styles.controlsHiddenRight) }, renderActionButtons()),
6816
- sx: mergeSx(styles.header, !editMode && styles.headerPreview),
6817
- "data-testid": "widget-card.header"
6818
- }), /* @__PURE__ */ React.createElement(CardContent, {
6819
- sx: mergeSx(styles.content, !editMode && styles.contentPreview),
6820
- "data-testid": "widget-card.content"
6821
- }, /* @__PURE__ */ React.createElement(AccessGuard, {
6822
- features: requiredFeatures,
6823
- extraPermissions,
6824
- onTrialRequest: handleTrialRequest,
6825
- onFeatureRequest: handleFeatureRequest,
6826
- backgroundImage: thumbnail
6827
- }, /* @__PURE__ */ React.createElement(WidgetErrorBoundary, null, /* @__PURE__ */ React.createElement(Widget, {
6828
- id,
6829
- url,
6830
- wsUrl,
6831
- lang,
6832
- filters,
6833
- onDataChange: handleDataChange,
6834
- onSettingsChange: handleSettingsChange,
6835
- openSettingsModal,
6836
- onSettingsModalOpened,
6837
- onSettingsModalClosed,
6838
- sidePanelOpened,
6839
- updateSidePanelProps,
6840
- editMode
6841
- })))), editMode && children);
6920
+ ...cardProps,
6921
+ children: [
6922
+ /* @__PURE__ */ jsx(CardHeader, {
6923
+ avatar: /* @__PURE__ */ jsx(Box, {
6924
+ sx: mergeSx(styles.controls, !editMode && styles.controlsHiddenLeft),
6925
+ children: renderDragHandle()
6926
+ }),
6927
+ title: /* @__PURE__ */ jsx(Typography, {
6928
+ variant: "subtitle1",
6929
+ sx: mergeSx(styles.title, !editMode && styles.titlePreview),
6930
+ "data-testid": "widget-card.title",
6931
+ children: displayTitle
6932
+ }),
6933
+ action: /* @__PURE__ */ jsx(Box, {
6934
+ sx: mergeSx(styles.controls, !editMode && styles.controlsHiddenRight),
6935
+ children: renderActionButtons()
6936
+ }),
6937
+ sx: mergeSx(styles.header, !editMode && styles.headerPreview),
6938
+ "data-testid": "widget-card.header"
6939
+ }),
6940
+ /* @__PURE__ */ jsx(CardContent, {
6941
+ sx: mergeSx(styles.content, !editMode && styles.contentPreview),
6942
+ "data-testid": "widget-card.content",
6943
+ children: /* @__PURE__ */ jsx(AccessGuard, {
6944
+ features: requiredFeatures,
6945
+ extraPermissions,
6946
+ onTrialRequest: handleTrialRequest,
6947
+ onFeatureRequest: handleFeatureRequest,
6948
+ backgroundImage: thumbnail,
6949
+ children: /* @__PURE__ */ jsx(WidgetErrorBoundary, { children: /* @__PURE__ */ jsx(Widget, {
6950
+ id,
6951
+ url,
6952
+ wsUrl,
6953
+ lang,
6954
+ filters,
6955
+ onDataChange: handleDataChange,
6956
+ onSettingsChange: handleSettingsChange,
6957
+ openSettingsModal,
6958
+ onSettingsModalOpened,
6959
+ onSettingsModalClosed,
6960
+ sidePanelOpened,
6961
+ updateSidePanelProps,
6962
+ editMode
6963
+ }) })
6964
+ })
6965
+ }),
6966
+ editMode && children
6967
+ ]
6968
+ });
6842
6969
  });
6843
6970
  //#endregion
6844
6971
  //#region src/helpers/aggregation.ts
@@ -6891,7 +7018,7 @@ const generateTimeRange = (start, end, unit, step) => {
6891
7018
  };
6892
7019
  //#endregion
6893
7020
  //#region src/version.ts
6894
- const LIBRARY_VERSION = "1.5.54";
7021
+ const LIBRARY_VERSION = "1.5.55";
6895
7022
  //#endregion
6896
7023
  export { AccessRequestTypeEnum, ActualStaffingCountsDocument, AndonLightColor, ApplicationInfoDocument, AssignOperatorDocument, AssignOperatorToWorkplaceDocument, AvailabilityInsightsDocument, AvailabilityStatus, BulkUpsertStaffingPlansDocument, CompanyConfigDocument, ConfirmTooltip, CounterDirectoriesDocument, CounterKindEnum, CountersDocument, CreateDashboardDocument, CreateOrderDocument, CreateProductDocument, CreateStaffingPlanDocument, CreateStatusChangeDocument, CreateUserPresenceDocument, CreateWidgetDocument, CurrentUserDocument, DashboardFilters, DashboardsDocument, DayType, DepartmentsDocument, FloorPlansDocument, GetWorkplacePerformanceInsightsDocument, GraphqlWsClient, InsightsAggregation, ListActualStaffingCountsDocument, ListStaffingPlansDocument, ListStatusChangesDocument, ListWorkOrdersDocument, ListWorkplaceAssignmentsDocument, ListWorkplacesDocument, MetricCard, MetricTypeEnum, MetricUnitEnum, MetricValuesDocument, MetricsDocument, NotificationsDocument, OrdersDocument, OrdersExecutionsDocument, PauseOrderExecutionDocument, Period, PresenceStatusEnum, ProductionInsightsDocument, ProductionMode, ProductsDocument, ReasonsDocument, ReasonsRecommendationDocument, RemoveDashboardDocument, RemoveStaffingPlanDocument, RemoveUserPresenceDocument, RemoveWidgetDocument, RemoveWorkplaceUsersPresencesDocument, RequestFeatureAccessDocument, ScreenEnum, SetCounterDocument, ShiftsDocument, SortableSelect, StaffingPlansDocument, StandardRatesDocument, StartOrderExecutionDocument, StartTrialDocument, StatusChangeTransitionPermissionsDocument, StatusChangesDocument, StatusInsightsDocument, StatusScreenDisplayBlocksEnum, StopOrderExecutionDocument, TrainingStatus, UnassignOperatorDocument, UnassignOperatorFromWorkplaceDocument, UpdateDashboardDocument, UpdateNotificationDocument, UpdateOrderDocument, UpdateOrderExecutionDocument, UpdateStaffingPlanDocument, UpdateStatusChangeDocument, UpdateWidgetDocument, UpdateWorkOrderDocument, UsersDocument, UsersPresencesDocument, WidgetCard, WidgetDocument, WidgetErrorBoundary, WidgetsDocument, WorkOrderCreationMethodEnum, WorkOrderPriorityEnum, WorkOrderStatusEnum, WorkOrdersDocument, WorkOrdersInsightsDocument, WorkplaceAssignmentsDocument, WorkplaceEvent, WorkplaceEventDocument, WorkplacePerformanceInsightsDocument, WorkplacesDocument, findPeriodById, generateTimeRange, getCurrentShift, getGqlWsClient, getGraphqlSdk, getNextBoundary, getRecentShift, getSdk, getShiftTimeRange, getTimeRangeLabel, getValidAggregations, normalizeShifts, periods, resolveAggregation, resolveShiftIdForPeriod, useGqlClients, LIBRARY_VERSION as version };
6897
7024