@connectif/ui-components 2.3.3 → 2.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/card/EnhancedCard.d.ts +4 -2
- package/dist/components/icon/icons.d.ts +3 -0
- package/dist/components/input/DateIntervalPicker.d.ts +5 -1
- package/dist/components/input/DateIntervalPickerInputs.d.ts +7 -1
- package/dist/components/input/DateIntervalPickerPopover.d.ts +2 -1
- package/dist/components/input/SelectPopover.d.ts +6 -2
- package/dist/components/layout/SwipeableViews.d.ts +2 -1
- package/dist/components/popover/Popover.d.ts +3 -1
- package/dist/components/scrollable/Carousel.d.ts +9 -0
- package/dist/components/scrollable/index.d.ts +2 -0
- package/dist/components/tab/TabContent.d.ts +6 -1
- package/dist/components/tab/Tabs.d.ts +5 -1
- package/dist/i18n/en.d.ts +2 -1
- package/dist/i18n/es.d.ts +2 -1
- package/dist/i18n/fr.d.ts +2 -1
- package/dist/i18n/it.d.ts +2 -1
- package/dist/i18n/pt.d.ts +2 -1
- package/dist/index.js +1040 -545
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/dist/utils/DateUtils.d.ts +5 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -373,7 +373,7 @@ var require_factoryWithTypeCheckers = __commonJS({
|
|
|
373
373
|
function emptyFunctionThatReturnsNull() {
|
|
374
374
|
return null;
|
|
375
375
|
}
|
|
376
|
-
module.exports = function(
|
|
376
|
+
module.exports = function(isValidElement5, throwOnDirectAccess) {
|
|
377
377
|
var ITERATOR_SYMBOL = typeof Symbol === "function" && Symbol.iterator;
|
|
378
378
|
var FAUX_ITERATOR_SYMBOL = "@@iterator";
|
|
379
379
|
function getIteratorFn(maybeIterable) {
|
|
@@ -501,7 +501,7 @@ var require_factoryWithTypeCheckers = __commonJS({
|
|
|
501
501
|
function createElementTypeChecker() {
|
|
502
502
|
function validate(props, propName, componentName, location, propFullName) {
|
|
503
503
|
var propValue = props[propName];
|
|
504
|
-
if (!
|
|
504
|
+
if (!isValidElement5(propValue)) {
|
|
505
505
|
var propType = getPropType(propValue);
|
|
506
506
|
return new PropTypeError("Invalid " + location + " `" + propFullName + "` of type " + ("`" + propType + "` supplied to `" + componentName + "`, expected a single ReactElement."));
|
|
507
507
|
}
|
|
@@ -689,7 +689,7 @@ var require_factoryWithTypeCheckers = __commonJS({
|
|
|
689
689
|
if (Array.isArray(propValue)) {
|
|
690
690
|
return propValue.every(isNode);
|
|
691
691
|
}
|
|
692
|
-
if (propValue === null ||
|
|
692
|
+
if (propValue === null || isValidElement5(propValue)) {
|
|
693
693
|
return true;
|
|
694
694
|
}
|
|
695
695
|
var iteratorFn = getIteratorFn(propValue);
|
|
@@ -1255,6 +1255,7 @@ import {
|
|
|
1255
1255
|
mdiCellphoneLink,
|
|
1256
1256
|
mdiCellphoneLinkOff,
|
|
1257
1257
|
mdiCellphoneMessage,
|
|
1258
|
+
mdiCellphoneOff,
|
|
1258
1259
|
mdiCellphoneSettings,
|
|
1259
1260
|
mdiCertificate,
|
|
1260
1261
|
mdiChairSchool,
|
|
@@ -1585,6 +1586,7 @@ import {
|
|
|
1585
1586
|
mdiFilmstrip,
|
|
1586
1587
|
mdiFilmstripOff,
|
|
1587
1588
|
mdiFilter,
|
|
1589
|
+
mdiFilterOff,
|
|
1588
1590
|
mdiFilterOutline,
|
|
1589
1591
|
mdiFilterRemove,
|
|
1590
1592
|
mdiFilterRemoveOutline,
|
|
@@ -2423,6 +2425,7 @@ import {
|
|
|
2423
2425
|
mdiTag,
|
|
2424
2426
|
mdiTagFaces,
|
|
2425
2427
|
mdiTagHeart,
|
|
2428
|
+
mdiTagHidden,
|
|
2426
2429
|
mdiTagMultiple,
|
|
2427
2430
|
mdiTagOutline,
|
|
2428
2431
|
mdiTagPlus,
|
|
@@ -3001,6 +3004,7 @@ var icons = {
|
|
|
3001
3004
|
"cellphone-link": mdiCellphoneLink,
|
|
3002
3005
|
"cellphone-link-off": mdiCellphoneLinkOff,
|
|
3003
3006
|
"cellphone-message": mdiCellphoneMessage,
|
|
3007
|
+
"cellphone-off": mdiCellphoneOff,
|
|
3004
3008
|
"cellphone-settings": mdiCellphoneSettings,
|
|
3005
3009
|
certificate: mdiCertificate,
|
|
3006
3010
|
"chair-school": mdiChairSchool,
|
|
@@ -3388,6 +3392,7 @@ var icons = {
|
|
|
3388
3392
|
filmstrip: mdiFilmstrip,
|
|
3389
3393
|
"filmstrip-off": mdiFilmstripOff,
|
|
3390
3394
|
filter: mdiFilter,
|
|
3395
|
+
"filter-off": mdiFilterOff,
|
|
3391
3396
|
"filter-outline": mdiFilterOutline,
|
|
3392
3397
|
"filter-remove": mdiFilterRemove,
|
|
3393
3398
|
"filter-remove-outline": mdiFilterRemoveOutline,
|
|
@@ -4360,6 +4365,7 @@ var icons = {
|
|
|
4360
4365
|
tag: mdiTag,
|
|
4361
4366
|
"tag-faces": mdiTagFaces,
|
|
4362
4367
|
"tag-heart": mdiTagHeart,
|
|
4368
|
+
"tag-hidden": mdiTagHidden,
|
|
4363
4369
|
"tag-multiple": mdiTagMultiple,
|
|
4364
4370
|
"tag-outline": mdiTagOutline,
|
|
4365
4371
|
"tag-plus": mdiTagPlus,
|
|
@@ -11554,8 +11560,11 @@ var EnhancedCard = React30.forwardRef(
|
|
|
11554
11560
|
disableGap = false,
|
|
11555
11561
|
enableAuxClick = false,
|
|
11556
11562
|
hoverComponent,
|
|
11563
|
+
sx,
|
|
11557
11564
|
onClick,
|
|
11558
|
-
onMouseDown
|
|
11565
|
+
onMouseDown,
|
|
11566
|
+
onMouseEnter,
|
|
11567
|
+
onMouseLeave
|
|
11559
11568
|
}, ref) {
|
|
11560
11569
|
const [isHovered, setIsHovered] = React30.useState(false);
|
|
11561
11570
|
const [isMenuOpen, setIsMenuOpen] = React30.useState(false);
|
|
@@ -11575,7 +11584,8 @@ var EnhancedCard = React30.forwardRef(
|
|
|
11575
11584
|
...selected && {
|
|
11576
11585
|
boxShadow: "0 0 0 3px",
|
|
11577
11586
|
color: primary600
|
|
11578
|
-
}
|
|
11587
|
+
},
|
|
11588
|
+
...sx
|
|
11579
11589
|
};
|
|
11580
11590
|
const centerColumnStyle = getCenterColumnStyle(
|
|
11581
11591
|
size,
|
|
@@ -11642,11 +11652,15 @@ var EnhancedCard = React30.forwardRef(
|
|
|
11642
11652
|
onClick,
|
|
11643
11653
|
onAuxClick: enableAuxClick && !isMenuOpen ? onClick : void 0,
|
|
11644
11654
|
onMouseDown,
|
|
11645
|
-
onMouseEnter: () =>
|
|
11646
|
-
|
|
11655
|
+
onMouseEnter: (e) => {
|
|
11656
|
+
setIsHovered(true);
|
|
11657
|
+
onMouseEnter && onMouseEnter(e);
|
|
11658
|
+
},
|
|
11659
|
+
onMouseLeave: (e) => {
|
|
11647
11660
|
if (!isMenuOpen) {
|
|
11648
11661
|
setIsHovered(false);
|
|
11649
11662
|
}
|
|
11663
|
+
onMouseLeave && onMouseLeave(e);
|
|
11650
11664
|
},
|
|
11651
11665
|
onMouseMove: (ev) => {
|
|
11652
11666
|
const element = ev.currentTarget;
|
|
@@ -14238,8 +14252,9 @@ var DATE_INTERVAL_PICKER = {
|
|
|
14238
14252
|
YESTERDAY: "Yesterday"
|
|
14239
14253
|
},
|
|
14240
14254
|
END_DATE: "End date",
|
|
14255
|
+
END_HOUR: "End hour",
|
|
14241
14256
|
START_DATE: "Start date",
|
|
14242
|
-
|
|
14257
|
+
START_HOUR: "Start hour"
|
|
14243
14258
|
};
|
|
14244
14259
|
var SELECT_POPOVER = {
|
|
14245
14260
|
APPLY: "Apply",
|
|
@@ -14524,8 +14539,9 @@ var DATE_INTERVAL_PICKER2 = {
|
|
|
14524
14539
|
YESTERDAY: "Ayer"
|
|
14525
14540
|
},
|
|
14526
14541
|
END_DATE: "Fecha de fin",
|
|
14542
|
+
END_HOUR: "Hora de fin",
|
|
14527
14543
|
START_DATE: "Fecha de inicio",
|
|
14528
|
-
|
|
14544
|
+
START_HOUR: "Hora de inicio"
|
|
14529
14545
|
};
|
|
14530
14546
|
var SELECT_POPOVER2 = {
|
|
14531
14547
|
APPLY: "Aplicar",
|
|
@@ -14825,8 +14841,9 @@ var DATE_INTERVAL_PICKER3 = {
|
|
|
14825
14841
|
YESTERDAY: "Hier"
|
|
14826
14842
|
},
|
|
14827
14843
|
END_DATE: "Date de fin",
|
|
14844
|
+
END_HOUR: "Heure de fin",
|
|
14828
14845
|
START_DATE: "Date de d\xE9but",
|
|
14829
|
-
|
|
14846
|
+
START_HOUR: "Heure de d\xE9but"
|
|
14830
14847
|
};
|
|
14831
14848
|
var SELECT_POPOVER3 = {
|
|
14832
14849
|
APPLY: "Appliquer",
|
|
@@ -15111,8 +15128,9 @@ var DATE_INTERVAL_PICKER4 = {
|
|
|
15111
15128
|
YESTERDAY: "Ieri"
|
|
15112
15129
|
},
|
|
15113
15130
|
END_DATE: "Data di fine",
|
|
15131
|
+
END_HOUR: "Ora di fine",
|
|
15114
15132
|
START_DATE: "Data di inizio",
|
|
15115
|
-
|
|
15133
|
+
START_HOUR: "Ora di inizio"
|
|
15116
15134
|
};
|
|
15117
15135
|
var SELECT_POPOVER4 = {
|
|
15118
15136
|
APPLY: "Applica",
|
|
@@ -15382,8 +15400,9 @@ var DATE_INTERVAL_PICKER5 = {
|
|
|
15382
15400
|
YESTERDAY: "Ontem"
|
|
15383
15401
|
},
|
|
15384
15402
|
END_DATE: "Data final",
|
|
15403
|
+
END_HOUR: "Hora de encerramento",
|
|
15385
15404
|
START_DATE: "Data de in\xEDcio",
|
|
15386
|
-
|
|
15405
|
+
START_HOUR: "Hora de in\xEDcio"
|
|
15387
15406
|
};
|
|
15388
15407
|
var SELECT_POPOVER5 = {
|
|
15389
15408
|
APPLY: "Aplicar",
|
|
@@ -16024,10 +16043,15 @@ function formatDate(date, locale, timezone, format2) {
|
|
|
16024
16043
|
const options = getDateTimeFormatOptions(timezone, format2);
|
|
16025
16044
|
return new Intl.DateTimeFormat(locale, options).format(date);
|
|
16026
16045
|
}
|
|
16027
|
-
function getWeekDayNamesForLocale(locale, format2 = "long") {
|
|
16028
|
-
const
|
|
16029
|
-
|
|
16030
|
-
|
|
16046
|
+
function getWeekDayNamesForLocale(locale, format2 = "long", timezone = "UTC") {
|
|
16047
|
+
const formatter = new Intl.DateTimeFormat(locale, {
|
|
16048
|
+
weekday: format2,
|
|
16049
|
+
timeZone: timezone
|
|
16050
|
+
}).format;
|
|
16051
|
+
const mondayAnchor = tz({ year: 2021, month: 5, date: 7 }, timezone);
|
|
16052
|
+
return Array.from(
|
|
16053
|
+
{ length: 7 },
|
|
16054
|
+
(_v, i) => formatter(mondayAnchor.clone().add(i, "day").toDate())
|
|
16031
16055
|
);
|
|
16032
16056
|
}
|
|
16033
16057
|
function getDateInputFormatForLocale(locale) {
|
|
@@ -16181,6 +16205,19 @@ function dateToSimpleDate(date, timezone) {
|
|
|
16181
16205
|
function getDisplayEndDate(date, timezone) {
|
|
16182
16206
|
return tz(date, timezone).subtract(1, "day").toDate();
|
|
16183
16207
|
}
|
|
16208
|
+
function applyTimeToDate(date, time) {
|
|
16209
|
+
if (isNaN(date.getTime()) || isNaN(time.getTime())) {
|
|
16210
|
+
return /* @__PURE__ */ new Date(NaN);
|
|
16211
|
+
}
|
|
16212
|
+
const result = new Date(date);
|
|
16213
|
+
result.setHours(
|
|
16214
|
+
time.getHours(),
|
|
16215
|
+
time.getMinutes(),
|
|
16216
|
+
time.getSeconds(),
|
|
16217
|
+
time.getMilliseconds()
|
|
16218
|
+
);
|
|
16219
|
+
return result;
|
|
16220
|
+
}
|
|
16184
16221
|
|
|
16185
16222
|
// src/utils/NumberFormatter.ts
|
|
16186
16223
|
function formatNumber(value, locale, fractionSize) {
|
|
@@ -18873,11 +18910,11 @@ var DebouncedTextField_default = DebouncedTextField;
|
|
|
18873
18910
|
|
|
18874
18911
|
// src/components/input/DateIntervalPicker.tsx
|
|
18875
18912
|
import { ButtonBase } from "@mui/material";
|
|
18876
|
-
import * as
|
|
18913
|
+
import * as React57 from "react";
|
|
18877
18914
|
|
|
18878
18915
|
// src/components/input/DateIntervalPickerPopover.tsx
|
|
18879
|
-
import * as
|
|
18880
|
-
import { tz as
|
|
18916
|
+
import * as React56 from "react";
|
|
18917
|
+
import { tz as tz4 } from "moment-timezone";
|
|
18881
18918
|
|
|
18882
18919
|
// src/components/popover/Popover.tsx
|
|
18883
18920
|
import MuiPopover from "@mui/material/Popover";
|
|
@@ -18887,12 +18924,14 @@ var Popover = ({
|
|
|
18887
18924
|
anchorHorizontalOrigin = "center",
|
|
18888
18925
|
verticalAlign = "top",
|
|
18889
18926
|
anchorVerticalAlign = "bottom",
|
|
18927
|
+
centeredInScreen = false,
|
|
18890
18928
|
...props
|
|
18891
18929
|
}) => /* @__PURE__ */ jsx99(
|
|
18892
18930
|
MuiPopover,
|
|
18893
18931
|
{
|
|
18894
18932
|
disableRestoreFocus: props.disableRestoreFocus,
|
|
18895
18933
|
open: !!props.anchorEl,
|
|
18934
|
+
...centeredInScreen && { anchorReference: "none" },
|
|
18896
18935
|
anchorOrigin: {
|
|
18897
18936
|
vertical: anchorVerticalAlign,
|
|
18898
18937
|
horizontal: anchorHorizontalOrigin
|
|
@@ -18901,6 +18940,18 @@ var Popover = ({
|
|
|
18901
18940
|
vertical: verticalAlign,
|
|
18902
18941
|
horizontal: horizontalAlign
|
|
18903
18942
|
},
|
|
18943
|
+
...centeredInScreen && {
|
|
18944
|
+
slotProps: {
|
|
18945
|
+
paper: {
|
|
18946
|
+
sx: {
|
|
18947
|
+
position: "fixed",
|
|
18948
|
+
top: "50% !important",
|
|
18949
|
+
left: "50% !important",
|
|
18950
|
+
transform: "translate(-50%, -50%) !important"
|
|
18951
|
+
}
|
|
18952
|
+
}
|
|
18953
|
+
}
|
|
18954
|
+
},
|
|
18904
18955
|
...props
|
|
18905
18956
|
}
|
|
18906
18957
|
);
|
|
@@ -19254,14 +19305,14 @@ var CalendarMonth_default = CalendarMonth;
|
|
|
19254
19305
|
import * as React53 from "react";
|
|
19255
19306
|
import { jsx as jsx103 } from "react/jsx-runtime";
|
|
19256
19307
|
var DaysOfWeekRow = () => {
|
|
19257
|
-
const { locale } = React53.useContext(IntlContext);
|
|
19308
|
+
const { locale, timezone } = React53.useContext(IntlContext);
|
|
19258
19309
|
const daysOfWeekLong = React53.useMemo(
|
|
19259
|
-
() => getWeekDayNamesForLocale(locale, "long"),
|
|
19260
|
-
[locale]
|
|
19310
|
+
() => getWeekDayNamesForLocale(locale, "long", timezone),
|
|
19311
|
+
[locale, timezone]
|
|
19261
19312
|
);
|
|
19262
19313
|
const daysOfWeek = React53.useMemo(
|
|
19263
|
-
() => getWeekDayNamesForLocale(locale, "narrow"),
|
|
19264
|
-
[locale]
|
|
19314
|
+
() => getWeekDayNamesForLocale(locale, "narrow", timezone),
|
|
19315
|
+
[locale, timezone]
|
|
19265
19316
|
);
|
|
19266
19317
|
return /* @__PURE__ */ jsx103(
|
|
19267
19318
|
Stack_default,
|
|
@@ -19451,23 +19502,127 @@ var DateIntervalPickerList = ({
|
|
|
19451
19502
|
var DateIntervalPickerList_default = DateIntervalPickerList;
|
|
19452
19503
|
|
|
19453
19504
|
// src/components/input/DateIntervalPickerInputs.tsx
|
|
19454
|
-
import { Collapse as Collapse6 } from "@mui/material";
|
|
19455
|
-
|
|
19505
|
+
import { Collapse as Collapse6, Stack as Stack7 } from "@mui/material";
|
|
19506
|
+
|
|
19507
|
+
// src/components/input/TimeField.tsx
|
|
19508
|
+
import * as React55 from "react";
|
|
19509
|
+
import { TimeField as MuiTimeField } from "@mui/x-date-pickers";
|
|
19510
|
+
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
|
|
19511
|
+
import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
|
|
19512
|
+
import { tz as tz3 } from "moment-timezone";
|
|
19513
|
+
import { jsx as jsx106 } from "react/jsx-runtime";
|
|
19514
|
+
var ExtendedTextField = ({
|
|
19515
|
+
inputProps,
|
|
19516
|
+
ownerState,
|
|
19517
|
+
InputProps,
|
|
19518
|
+
error,
|
|
19519
|
+
...rest
|
|
19520
|
+
}) => /* @__PURE__ */ jsx106(TextField_default, { ...inputProps, ...rest });
|
|
19521
|
+
var TimeField = function TimeField2({
|
|
19522
|
+
onChange,
|
|
19523
|
+
value,
|
|
19524
|
+
showMinutes = true,
|
|
19525
|
+
showSeconds = false,
|
|
19526
|
+
...rest
|
|
19527
|
+
}) {
|
|
19528
|
+
const { locale, timezone } = React55.useContext(IntlContext);
|
|
19529
|
+
const hour12 = React55.useMemo(() => {
|
|
19530
|
+
const resolvedOptions = Intl.DateTimeFormat(locale, {
|
|
19531
|
+
hour: "numeric"
|
|
19532
|
+
}).resolvedOptions();
|
|
19533
|
+
return resolvedOptions.hour12;
|
|
19534
|
+
}, [locale]);
|
|
19535
|
+
const format2 = `${hour12 ? "hh" : "HH"}${showSeconds || showMinutes ? ":mm" : ""}${showSeconds ? ":ss" : ""}${hour12 ? " a" : ""}`;
|
|
19536
|
+
const momentValue = React55.useMemo(() => {
|
|
19537
|
+
if (value && !isNaN(value.getTime())) {
|
|
19538
|
+
return tz3(value, timezone);
|
|
19539
|
+
}
|
|
19540
|
+
return null;
|
|
19541
|
+
}, [timezone, value]);
|
|
19542
|
+
const _onChange = React55.useCallback(
|
|
19543
|
+
(momentValue2, context) => {
|
|
19544
|
+
const value2 = momentValue2 && momentValue2.isValid() ? momentValue2.toDate() : null;
|
|
19545
|
+
onChange && onChange(value2, context);
|
|
19546
|
+
},
|
|
19547
|
+
[onChange]
|
|
19548
|
+
);
|
|
19549
|
+
return /* @__PURE__ */ jsx106(LocalizationProvider, { dateAdapter: AdapterMoment, children: /* @__PURE__ */ jsx106(
|
|
19550
|
+
MuiTimeField,
|
|
19551
|
+
{
|
|
19552
|
+
onChange: _onChange,
|
|
19553
|
+
value: momentValue,
|
|
19554
|
+
format: format2,
|
|
19555
|
+
slots: {
|
|
19556
|
+
textField: ExtendedTextField
|
|
19557
|
+
},
|
|
19558
|
+
slotProps: {
|
|
19559
|
+
textField: rest
|
|
19560
|
+
},
|
|
19561
|
+
enableAccessibleFieldDOMStructure: false
|
|
19562
|
+
}
|
|
19563
|
+
) });
|
|
19564
|
+
};
|
|
19565
|
+
var TimeField_default = TimeField;
|
|
19566
|
+
|
|
19567
|
+
// src/components/input/DateIntervalPickerInputs.tsx
|
|
19568
|
+
import { jsx as jsx107, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
19456
19569
|
var DateIntervalPickerInputs = ({
|
|
19457
19570
|
startDate,
|
|
19571
|
+
startTime,
|
|
19458
19572
|
endDate,
|
|
19573
|
+
endTime,
|
|
19459
19574
|
comparisonStartDate,
|
|
19575
|
+
comparisonStartTime,
|
|
19460
19576
|
comparisonEndDate,
|
|
19577
|
+
comparisonEndTime,
|
|
19461
19578
|
placeholder,
|
|
19462
19579
|
highlightedInput,
|
|
19463
19580
|
color: color2,
|
|
19464
19581
|
comparisonColor,
|
|
19465
19582
|
isComparing,
|
|
19583
|
+
showTime,
|
|
19466
19584
|
onChange,
|
|
19585
|
+
onChangeTime,
|
|
19467
19586
|
onFocus,
|
|
19468
19587
|
onBlur
|
|
19469
19588
|
}) => {
|
|
19470
19589
|
const { t } = useTranslation();
|
|
19590
|
+
const getDateField = ({
|
|
19591
|
+
dataTestId,
|
|
19592
|
+
dateLabel,
|
|
19593
|
+
date,
|
|
19594
|
+
dateTime,
|
|
19595
|
+
focusableInput,
|
|
19596
|
+
hourLabel,
|
|
19597
|
+
color: color3
|
|
19598
|
+
}) => /* @__PURE__ */ jsxs48(Stack7, { children: [
|
|
19599
|
+
/* @__PURE__ */ jsx107(
|
|
19600
|
+
TextField_default,
|
|
19601
|
+
{
|
|
19602
|
+
"data-testid": dataTestId,
|
|
19603
|
+
label: dateLabel,
|
|
19604
|
+
placeholder,
|
|
19605
|
+
value: date,
|
|
19606
|
+
onChange: (event) => onChange(event.target.value),
|
|
19607
|
+
onFocus: () => onFocus(focusableInput),
|
|
19608
|
+
onBlur: (event) => onBlur(focusableInput, event.target.value),
|
|
19609
|
+
highlighted: highlightedInput === focusableInput,
|
|
19610
|
+
activeColor: color3
|
|
19611
|
+
}
|
|
19612
|
+
),
|
|
19613
|
+
showTime && /* @__PURE__ */ jsx107(
|
|
19614
|
+
TimeField_default,
|
|
19615
|
+
{
|
|
19616
|
+
activeColor: color3,
|
|
19617
|
+
label: hourLabel,
|
|
19618
|
+
value: dateTime,
|
|
19619
|
+
onFocus: () => onFocus(focusableInput),
|
|
19620
|
+
onBlur: (event) => onBlur(focusableInput, event.target.value),
|
|
19621
|
+
onChange: onChangeTime,
|
|
19622
|
+
highlighted: highlightedInput === focusableInput
|
|
19623
|
+
}
|
|
19624
|
+
)
|
|
19625
|
+
] });
|
|
19471
19626
|
return /* @__PURE__ */ jsxs48(Box_default2, { sx: { padding: "8px" }, children: [
|
|
19472
19627
|
/* @__PURE__ */ jsxs48(
|
|
19473
19628
|
Box_default2,
|
|
@@ -19478,40 +19633,28 @@ var DateIntervalPickerInputs = ({
|
|
|
19478
19633
|
gap: "8px"
|
|
19479
19634
|
},
|
|
19480
19635
|
children: [
|
|
19481
|
-
|
|
19482
|
-
|
|
19483
|
-
|
|
19484
|
-
|
|
19485
|
-
|
|
19486
|
-
|
|
19487
|
-
|
|
19488
|
-
|
|
19489
|
-
|
|
19490
|
-
|
|
19491
|
-
|
|
19492
|
-
|
|
19493
|
-
|
|
19494
|
-
|
|
19495
|
-
|
|
19496
|
-
|
|
19497
|
-
|
|
19498
|
-
|
|
19499
|
-
{
|
|
19500
|
-
"data-testid": "endDateInput",
|
|
19501
|
-
label: t("DATE_INTERVAL_PICKER.END_DATE"),
|
|
19502
|
-
placeholder,
|
|
19503
|
-
value: endDate,
|
|
19504
|
-
onChange: (event) => onChange(event.target.value),
|
|
19505
|
-
onFocus: () => onFocus("endDate"),
|
|
19506
|
-
onBlur: (event) => onBlur("endDate", event.target.value),
|
|
19507
|
-
highlighted: highlightedInput === "endDate",
|
|
19508
|
-
activeColor: color2
|
|
19509
|
-
}
|
|
19510
|
-
) })
|
|
19636
|
+
getDateField({
|
|
19637
|
+
dataTestId: "startDateInput",
|
|
19638
|
+
date: startDate,
|
|
19639
|
+
dateTime: startTime,
|
|
19640
|
+
dateLabel: t("DATE_INTERVAL_PICKER.START_DATE"),
|
|
19641
|
+
focusableInput: "startDate",
|
|
19642
|
+
hourLabel: t("DATE_INTERVAL_PICKER.START_HOUR"),
|
|
19643
|
+
color: color2
|
|
19644
|
+
}),
|
|
19645
|
+
getDateField({
|
|
19646
|
+
dataTestId: "endDateInput",
|
|
19647
|
+
date: endDate,
|
|
19648
|
+
dateTime: endTime,
|
|
19649
|
+
dateLabel: t("DATE_INTERVAL_PICKER.END_DATE"),
|
|
19650
|
+
focusableInput: "endDate",
|
|
19651
|
+
hourLabel: t("DATE_INTERVAL_PICKER.END_HOUR"),
|
|
19652
|
+
color: color2
|
|
19653
|
+
})
|
|
19511
19654
|
]
|
|
19512
19655
|
}
|
|
19513
19656
|
),
|
|
19514
|
-
/* @__PURE__ */
|
|
19657
|
+
/* @__PURE__ */ jsx107(Collapse6, { in: isComparing, children: /* @__PURE__ */ jsxs48(
|
|
19515
19658
|
Box_default2,
|
|
19516
19659
|
{
|
|
19517
19660
|
sx: {
|
|
@@ -19520,40 +19663,21 @@ var DateIntervalPickerInputs = ({
|
|
|
19520
19663
|
gap: "8px"
|
|
19521
19664
|
},
|
|
19522
19665
|
children: [
|
|
19523
|
-
|
|
19524
|
-
|
|
19525
|
-
|
|
19526
|
-
|
|
19527
|
-
|
|
19528
|
-
|
|
19529
|
-
|
|
19530
|
-
|
|
19531
|
-
|
|
19532
|
-
|
|
19533
|
-
|
|
19534
|
-
|
|
19535
|
-
|
|
19536
|
-
|
|
19537
|
-
|
|
19538
|
-
}
|
|
19539
|
-
) }),
|
|
19540
|
-
/* @__PURE__ */ jsx106(InputLabel_default, { children: t("DATE_INTERVAL_PICKER.TO") }),
|
|
19541
|
-
/* @__PURE__ */ jsxs48("div", { children: [
|
|
19542
|
-
/* @__PURE__ */ jsx106("label", { children: "\xA0" }),
|
|
19543
|
-
/* @__PURE__ */ jsx106(
|
|
19544
|
-
TextField_default,
|
|
19545
|
-
{
|
|
19546
|
-
"data-testid": "comparisonEndDateInput",
|
|
19547
|
-
placeholder,
|
|
19548
|
-
value: comparisonEndDate,
|
|
19549
|
-
onChange: (event) => onChange(event.target.value),
|
|
19550
|
-
onFocus: () => onFocus("comparisonEndDate"),
|
|
19551
|
-
onBlur: (event) => onBlur("comparisonEndDate", event.target.value),
|
|
19552
|
-
highlighted: highlightedInput === "comparisonEndDate",
|
|
19553
|
-
activeColor: comparisonColor
|
|
19554
|
-
}
|
|
19555
|
-
)
|
|
19556
|
-
] })
|
|
19666
|
+
getDateField({
|
|
19667
|
+
dataTestId: "comparisonStartDateInput",
|
|
19668
|
+
date: comparisonStartDate,
|
|
19669
|
+
dateTime: comparisonStartTime,
|
|
19670
|
+
dateLabel: t("DATE_INTERVAL_PICKER.COMPARE_WITH"),
|
|
19671
|
+
focusableInput: "comparisonStartDate",
|
|
19672
|
+
color: comparisonColor
|
|
19673
|
+
}),
|
|
19674
|
+
getDateField({
|
|
19675
|
+
dataTestId: "comparisonEndDateInput",
|
|
19676
|
+
date: comparisonEndDate,
|
|
19677
|
+
dateTime: comparisonEndTime,
|
|
19678
|
+
focusableInput: "comparisonEndDate",
|
|
19679
|
+
color: comparisonColor
|
|
19680
|
+
})
|
|
19557
19681
|
]
|
|
19558
19682
|
}
|
|
19559
19683
|
) })
|
|
@@ -19562,7 +19686,7 @@ var DateIntervalPickerInputs = ({
|
|
|
19562
19686
|
var DateIntervalPickerInputs_default = DateIntervalPickerInputs;
|
|
19563
19687
|
|
|
19564
19688
|
// src/components/input/DateIntervalPickerPopover.tsx
|
|
19565
|
-
import { jsx as
|
|
19689
|
+
import { jsx as jsx108, jsxs as jsxs49 } from "react/jsx-runtime";
|
|
19566
19690
|
var DateIntervalPickerPopover = ({
|
|
19567
19691
|
interval,
|
|
19568
19692
|
startDate,
|
|
@@ -19579,17 +19703,18 @@ var DateIntervalPickerPopover = ({
|
|
|
19579
19703
|
minDate,
|
|
19580
19704
|
maxDate,
|
|
19581
19705
|
allowedIntervals,
|
|
19706
|
+
showTime,
|
|
19582
19707
|
onApply,
|
|
19583
19708
|
onCancel
|
|
19584
19709
|
}) => {
|
|
19585
|
-
const { locale, timezone } =
|
|
19710
|
+
const { locale, timezone } = React56.useContext(IntlContext);
|
|
19586
19711
|
const dateInputFormat = getDateInputFormatForLocale(locale);
|
|
19587
19712
|
const { t } = useTranslation();
|
|
19588
19713
|
const dateInputFormatPlaceholder = dateInputFormat.replace(/Y/g, t("DATE_COMPONENTS.YEAR_LETTER")).replace(/M/g, t("DATE_COMPONENTS.MONTH_LETTER")).replace(/D/g, t("DATE_COMPONENTS.DAY_LETTER"));
|
|
19589
|
-
const minDateTz =
|
|
19590
|
-
const maxDateTz =
|
|
19591
|
-
const dateInputFormatter = (date) =>
|
|
19592
|
-
const formatSimpleDate = (date) =>
|
|
19714
|
+
const minDateTz = tz4(minDate, timezone);
|
|
19715
|
+
const maxDateTz = tz4(maxDate, timezone);
|
|
19716
|
+
const dateInputFormatter = (date) => tz4(date, timezone).format(dateInputFormat);
|
|
19717
|
+
const formatSimpleDate = (date) => tz4(
|
|
19593
19718
|
{ year: date.year, month: date.month, date: date.day },
|
|
19594
19719
|
timezone
|
|
19595
19720
|
).format(dateInputFormat);
|
|
@@ -19641,11 +19766,11 @@ var DateIntervalPickerPopover = ({
|
|
|
19641
19766
|
minDate
|
|
19642
19767
|
);
|
|
19643
19768
|
return {
|
|
19644
|
-
comparisonStartDate:
|
|
19769
|
+
comparisonStartDate: tz4(
|
|
19645
19770
|
interval2.comparisonStartDate,
|
|
19646
19771
|
timezone
|
|
19647
19772
|
).format(dateInputFormat),
|
|
19648
|
-
comparisonEndDate:
|
|
19773
|
+
comparisonEndDate: tz4(interval2.comparisonEndDate, timezone).format(
|
|
19649
19774
|
dateInputFormat
|
|
19650
19775
|
),
|
|
19651
19776
|
comparisonStartSimpleDate: dateToSimpleDate(
|
|
@@ -19665,17 +19790,21 @@ var DateIntervalPickerPopover = ({
|
|
|
19665
19790
|
highlightedInput: "startDate",
|
|
19666
19791
|
focusedDateInCalendar: dateToSimpleDate(startDate, timezone),
|
|
19667
19792
|
startDate: dateInputFormatter(startDate),
|
|
19793
|
+
startTime: startDate,
|
|
19668
19794
|
startSimpleDate: dateToSimpleDate(startDate, timezone),
|
|
19669
19795
|
endDate: dateInputFormatter(displayEndDate),
|
|
19796
|
+
endTime: displayEndDate,
|
|
19670
19797
|
endSimpleDate: dateToSimpleDate(displayEndDate, timezone),
|
|
19671
19798
|
comparisonInterval: comparisonInterval ?? "previousPeriod",
|
|
19672
19799
|
comparisonStartDate: comparisonStartDate ? dateInputFormatter(comparisonStartDate) : "",
|
|
19800
|
+
comparisonStartTime: comparisonStartDate ? comparisonStartDate : /* @__PURE__ */ new Date(),
|
|
19673
19801
|
comparisonStartSimpleDate: comparisonStartDate ? dateToSimpleDate(comparisonStartDate, timezone) : null,
|
|
19674
19802
|
comparisonEndDate: displayComparisonEndDate ? dateInputFormatter(displayComparisonEndDate) : "",
|
|
19803
|
+
comparisonEndTime: displayComparisonEndDate ? displayComparisonEndDate : /* @__PURE__ */ new Date(),
|
|
19675
19804
|
comparisonEndSimpleDate: displayComparisonEndDate ? dateToSimpleDate(displayComparisonEndDate, timezone) : null,
|
|
19676
19805
|
isComparing: allowCompare && !!(comparisonStartDate && comparisonEndDate)
|
|
19677
19806
|
};
|
|
19678
|
-
const [state, setState] =
|
|
19807
|
+
const [state, setState] = React56.useState(initialState);
|
|
19679
19808
|
const handleChangeIsComparing = (checked) => {
|
|
19680
19809
|
setState({
|
|
19681
19810
|
...state,
|
|
@@ -19691,14 +19820,26 @@ var DateIntervalPickerPopover = ({
|
|
|
19691
19820
|
});
|
|
19692
19821
|
};
|
|
19693
19822
|
const handleApply = () => {
|
|
19694
|
-
const parseEndDate = (dateString) =>
|
|
19823
|
+
const parseEndDate = (dateString) => tz4(parseDate(dateString), timezone).add(1, "day").toDate();
|
|
19695
19824
|
onApply({
|
|
19696
19825
|
interval: state.interval,
|
|
19697
|
-
startDate:
|
|
19698
|
-
|
|
19826
|
+
startDate: applyTimeToDate(
|
|
19827
|
+
parseDate(state.startDate),
|
|
19828
|
+
state.startTime
|
|
19829
|
+
),
|
|
19830
|
+
endDate: applyTimeToDate(
|
|
19831
|
+
parseEndDate(state.endDate),
|
|
19832
|
+
state.endTime
|
|
19833
|
+
),
|
|
19699
19834
|
comparisonInterval: state.isComparing ? state.comparisonInterval : null,
|
|
19700
|
-
comparisonStartDate: state.isComparing ?
|
|
19701
|
-
|
|
19835
|
+
comparisonStartDate: state.isComparing ? applyTimeToDate(
|
|
19836
|
+
parseDate(state.comparisonStartDate),
|
|
19837
|
+
state.comparisonStartTime
|
|
19838
|
+
) : null,
|
|
19839
|
+
comparisonEndDate: state.isComparing ? applyTimeToDate(
|
|
19840
|
+
parseEndDate(state.comparisonEndDate),
|
|
19841
|
+
state.comparisonEndTime
|
|
19842
|
+
) : null
|
|
19702
19843
|
});
|
|
19703
19844
|
};
|
|
19704
19845
|
const handleCancel = () => {
|
|
@@ -19744,6 +19885,24 @@ var DateIntervalPickerPopover = ({
|
|
|
19744
19885
|
[state.highlightedInput]: value
|
|
19745
19886
|
});
|
|
19746
19887
|
};
|
|
19888
|
+
const getTimePropertyName = (focusableInputDate) => {
|
|
19889
|
+
switch (focusableInputDate) {
|
|
19890
|
+
case "startDate":
|
|
19891
|
+
return "startTime";
|
|
19892
|
+
case "endDate":
|
|
19893
|
+
return "endTime";
|
|
19894
|
+
case "comparisonStartDate":
|
|
19895
|
+
return "comparisonStartTime";
|
|
19896
|
+
case "comparisonEndDate":
|
|
19897
|
+
return "comparisonEndTime";
|
|
19898
|
+
}
|
|
19899
|
+
};
|
|
19900
|
+
const handleChangeTime = (value) => {
|
|
19901
|
+
setState({
|
|
19902
|
+
...state,
|
|
19903
|
+
[getTimePropertyName(state.highlightedInput)]: value
|
|
19904
|
+
});
|
|
19905
|
+
};
|
|
19747
19906
|
const handleFocusInputDate = (inputDate) => {
|
|
19748
19907
|
setState((state2) => {
|
|
19749
19908
|
const newState = {
|
|
@@ -19933,7 +20092,7 @@ var DateIntervalPickerPopover = ({
|
|
|
19933
20092
|
maxWidth: `${250 + 8 * 2 + 32 * 7}px`
|
|
19934
20093
|
},
|
|
19935
20094
|
children: [
|
|
19936
|
-
/* @__PURE__ */
|
|
20095
|
+
/* @__PURE__ */ jsx108(
|
|
19937
20096
|
Box_default2,
|
|
19938
20097
|
{
|
|
19939
20098
|
sx: {
|
|
@@ -19945,7 +20104,7 @@ var DateIntervalPickerPopover = ({
|
|
|
19945
20104
|
overflowY: "auto"
|
|
19946
20105
|
},
|
|
19947
20106
|
className: "Slim-Vertical-Scroll",
|
|
19948
|
-
children: /* @__PURE__ */
|
|
20107
|
+
children: /* @__PURE__ */ jsx108(
|
|
19949
20108
|
DateIntervalPickerList_default,
|
|
19950
20109
|
{
|
|
19951
20110
|
allowCompare,
|
|
@@ -19961,38 +20120,44 @@ var DateIntervalPickerPopover = ({
|
|
|
19961
20120
|
)
|
|
19962
20121
|
}
|
|
19963
20122
|
),
|
|
19964
|
-
/* @__PURE__ */
|
|
20123
|
+
/* @__PURE__ */ jsx108(
|
|
19965
20124
|
Box_default2,
|
|
19966
20125
|
{
|
|
19967
20126
|
sx: {
|
|
19968
20127
|
gridArea: "inputs"
|
|
19969
20128
|
},
|
|
19970
|
-
children: /* @__PURE__ */
|
|
20129
|
+
children: /* @__PURE__ */ jsx108(
|
|
19971
20130
|
DateIntervalPickerInputs_default,
|
|
19972
20131
|
{
|
|
19973
20132
|
color: color2,
|
|
19974
20133
|
comparisonColor,
|
|
19975
20134
|
comparisonEndDate: state.comparisonEndDate,
|
|
20135
|
+
comparisonEndTime: state.comparisonEndTime,
|
|
19976
20136
|
comparisonStartDate: state.comparisonStartDate,
|
|
20137
|
+
comparisonStartTime: state.comparisonStartTime,
|
|
19977
20138
|
endDate: state.endDate,
|
|
20139
|
+
endTime: state.endTime,
|
|
19978
20140
|
highlightedInput: state.highlightedInput,
|
|
19979
20141
|
onBlur: handleBlurInputDate,
|
|
19980
20142
|
onChange: handleChangeInputDate,
|
|
20143
|
+
onChangeTime: handleChangeTime,
|
|
19981
20144
|
onFocus: handleFocusInputDate,
|
|
19982
20145
|
placeholder: dateInputFormatPlaceholder,
|
|
19983
20146
|
startDate: state.startDate,
|
|
19984
|
-
|
|
20147
|
+
startTime: state.startTime,
|
|
20148
|
+
isComparing: state.isComparing,
|
|
20149
|
+
showTime
|
|
19985
20150
|
}
|
|
19986
20151
|
)
|
|
19987
20152
|
}
|
|
19988
20153
|
),
|
|
19989
|
-
/* @__PURE__ */
|
|
20154
|
+
/* @__PURE__ */ jsx108(
|
|
19990
20155
|
Box_default2,
|
|
19991
20156
|
{
|
|
19992
20157
|
sx: {
|
|
19993
20158
|
gridArea: "calendar"
|
|
19994
20159
|
},
|
|
19995
|
-
children: /* @__PURE__ */
|
|
20160
|
+
children: /* @__PURE__ */ jsx108(
|
|
19996
20161
|
CalendarScrollPicker_default,
|
|
19997
20162
|
{
|
|
19998
20163
|
minDate: {
|
|
@@ -20031,10 +20196,10 @@ var DateIntervalPickerPopover = ({
|
|
|
20031
20196
|
]
|
|
20032
20197
|
}
|
|
20033
20198
|
),
|
|
20034
|
-
/* @__PURE__ */
|
|
20199
|
+
/* @__PURE__ */ jsx108(
|
|
20035
20200
|
PopoverActions_default,
|
|
20036
20201
|
{
|
|
20037
|
-
leftContent: /* @__PURE__ */
|
|
20202
|
+
leftContent: /* @__PURE__ */ jsx108(
|
|
20038
20203
|
Button_default,
|
|
20039
20204
|
{
|
|
20040
20205
|
variant: "text",
|
|
@@ -20043,7 +20208,7 @@ var DateIntervalPickerPopover = ({
|
|
|
20043
20208
|
disabled: isApplyButtonDisabled()
|
|
20044
20209
|
}
|
|
20045
20210
|
),
|
|
20046
|
-
rightContent: /* @__PURE__ */
|
|
20211
|
+
rightContent: /* @__PURE__ */ jsx108(
|
|
20047
20212
|
Button_default,
|
|
20048
20213
|
{
|
|
20049
20214
|
variant: "text",
|
|
@@ -20058,8 +20223,8 @@ var DateIntervalPickerPopover = ({
|
|
|
20058
20223
|
var DateIntervalPickerPopover_default = DateIntervalPickerPopover;
|
|
20059
20224
|
|
|
20060
20225
|
// src/components/input/DateIntervalPicker.tsx
|
|
20061
|
-
import { tz as
|
|
20062
|
-
import { jsx as
|
|
20226
|
+
import { tz as tz5 } from "moment-timezone";
|
|
20227
|
+
import { jsx as jsx109, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
20063
20228
|
var DateIntervalPicker = ({
|
|
20064
20229
|
interval,
|
|
20065
20230
|
startDate,
|
|
@@ -20076,11 +20241,12 @@ var DateIntervalPicker = ({
|
|
|
20076
20241
|
minDate,
|
|
20077
20242
|
maxDate,
|
|
20078
20243
|
allowedIntervals,
|
|
20244
|
+
showTime,
|
|
20079
20245
|
onChange
|
|
20080
20246
|
}) => {
|
|
20081
20247
|
const { t } = useTranslation();
|
|
20082
|
-
const { timezone } =
|
|
20083
|
-
const [anchorEl, setAnchorEl] =
|
|
20248
|
+
const { timezone } = React57.useContext(IntlContext);
|
|
20249
|
+
const [anchorEl, setAnchorEl] = React57.useState(
|
|
20084
20250
|
null
|
|
20085
20251
|
);
|
|
20086
20252
|
const isSameDate = (date1, date2) => date1?.getTime() === date2?.getTime();
|
|
@@ -20098,8 +20264,8 @@ var DateIntervalPicker = ({
|
|
|
20098
20264
|
};
|
|
20099
20265
|
const displayEndDate = getDisplayEndDate(endDate, timezone);
|
|
20100
20266
|
const isEndDateVisible = !isSameDate(startDate, displayEndDate);
|
|
20101
|
-
const internalMaxDate = maxDate ??
|
|
20102
|
-
const internalMinDate = minDate ??
|
|
20267
|
+
const internalMaxDate = maxDate ?? tz5(timezone).toDate();
|
|
20268
|
+
const internalMinDate = minDate ?? tz5(internalMaxDate, timezone).subtract(maxSelectableDays - 1, "days").toDate();
|
|
20103
20269
|
return /* @__PURE__ */ jsxs50("div", { style: { display: "inline-flex" }, children: [
|
|
20104
20270
|
/* @__PURE__ */ jsxs50(
|
|
20105
20271
|
ButtonBase,
|
|
@@ -20116,7 +20282,7 @@ var DateIntervalPicker = ({
|
|
|
20116
20282
|
disabled,
|
|
20117
20283
|
onClick: handleButtonClick,
|
|
20118
20284
|
children: [
|
|
20119
|
-
/* @__PURE__ */
|
|
20285
|
+
/* @__PURE__ */ jsx109(
|
|
20120
20286
|
"span",
|
|
20121
20287
|
{
|
|
20122
20288
|
style: {
|
|
@@ -20126,7 +20292,7 @@ var DateIntervalPicker = ({
|
|
|
20126
20292
|
borderRadius: "2px",
|
|
20127
20293
|
alignSelf: "center"
|
|
20128
20294
|
},
|
|
20129
|
-
children: /* @__PURE__ */
|
|
20295
|
+
children: /* @__PURE__ */ jsx109(Typography_default, { variant: "body2", children: t(
|
|
20130
20296
|
`DATE_INTERVAL_PICKER.DATE_INTERVALS.${dateIntervals[interval]}`
|
|
20131
20297
|
) })
|
|
20132
20298
|
}
|
|
@@ -20141,9 +20307,25 @@ var DateIntervalPicker = ({
|
|
|
20141
20307
|
},
|
|
20142
20308
|
children: [
|
|
20143
20309
|
/* @__PURE__ */ jsxs50("div", { children: [
|
|
20144
|
-
/* @__PURE__ */
|
|
20310
|
+
/* @__PURE__ */ jsx109(
|
|
20311
|
+
DateFormatter_default,
|
|
20312
|
+
{
|
|
20313
|
+
date: startDate,
|
|
20314
|
+
...showTime && {
|
|
20315
|
+
format: "dateTimeLongFormat"
|
|
20316
|
+
}
|
|
20317
|
+
}
|
|
20318
|
+
),
|
|
20145
20319
|
isEndDateVisible && " - ",
|
|
20146
|
-
isEndDateVisible && /* @__PURE__ */
|
|
20320
|
+
isEndDateVisible && /* @__PURE__ */ jsx109(
|
|
20321
|
+
DateFormatter_default,
|
|
20322
|
+
{
|
|
20323
|
+
date: displayEndDate,
|
|
20324
|
+
...showTime && {
|
|
20325
|
+
format: "dateTimeLongFormat"
|
|
20326
|
+
}
|
|
20327
|
+
}
|
|
20328
|
+
)
|
|
20147
20329
|
] }),
|
|
20148
20330
|
comparisonStartDate && comparisonEndDate ? /* @__PURE__ */ jsxs50(
|
|
20149
20331
|
"div",
|
|
@@ -20156,20 +20338,36 @@ var DateIntervalPicker = ({
|
|
|
20156
20338
|
children: [
|
|
20157
20339
|
t("DATE_INTERVAL_PICKER.COMPARE"),
|
|
20158
20340
|
": ",
|
|
20159
|
-
/* @__PURE__ */
|
|
20341
|
+
/* @__PURE__ */ jsx109(
|
|
20342
|
+
DateFormatter_default,
|
|
20343
|
+
{
|
|
20344
|
+
date: comparisonStartDate,
|
|
20345
|
+
...showTime && {
|
|
20346
|
+
format: "dateTimeLongFormat"
|
|
20347
|
+
}
|
|
20348
|
+
}
|
|
20349
|
+
),
|
|
20160
20350
|
" - ",
|
|
20161
|
-
/* @__PURE__ */
|
|
20351
|
+
/* @__PURE__ */ jsx109(
|
|
20352
|
+
DateFormatter_default,
|
|
20353
|
+
{
|
|
20354
|
+
date: comparisonEndDate,
|
|
20355
|
+
...showTime && {
|
|
20356
|
+
format: "dateTimeLongFormat"
|
|
20357
|
+
}
|
|
20358
|
+
}
|
|
20359
|
+
)
|
|
20162
20360
|
]
|
|
20163
20361
|
}
|
|
20164
20362
|
) : []
|
|
20165
20363
|
]
|
|
20166
20364
|
}
|
|
20167
20365
|
),
|
|
20168
|
-
/* @__PURE__ */
|
|
20366
|
+
/* @__PURE__ */ jsx109(Icon_default, { id: "menu-down", sx: { color: grey400 } })
|
|
20169
20367
|
]
|
|
20170
20368
|
}
|
|
20171
20369
|
),
|
|
20172
|
-
anchorEl !== null && /* @__PURE__ */
|
|
20370
|
+
anchorEl !== null && /* @__PURE__ */ jsx109(
|
|
20173
20371
|
DateIntervalPickerPopover_default,
|
|
20174
20372
|
{
|
|
20175
20373
|
...{
|
|
@@ -20189,6 +20387,7 @@ var DateIntervalPicker = ({
|
|
|
20189
20387
|
maxDate: internalMaxDate,
|
|
20190
20388
|
anchorEl,
|
|
20191
20389
|
allowedIntervals,
|
|
20390
|
+
showTime,
|
|
20192
20391
|
onCancel: handlePopoverCancel,
|
|
20193
20392
|
onApply: handleApply
|
|
20194
20393
|
}
|
|
@@ -20199,9 +20398,9 @@ var DateIntervalPicker = ({
|
|
|
20199
20398
|
var DateIntervalPicker_default = DateIntervalPicker;
|
|
20200
20399
|
|
|
20201
20400
|
// src/components/input/SelectPopoverItem.tsx
|
|
20202
|
-
import { Grid as Grid2, Stack as
|
|
20401
|
+
import { Grid as Grid2, Stack as Stack8 } from "@mui/material";
|
|
20203
20402
|
import { lighten as lighten3 } from "@mui/material";
|
|
20204
|
-
import { Fragment as Fragment21, jsx as
|
|
20403
|
+
import { Fragment as Fragment21, jsx as jsx110, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
20205
20404
|
var bgColorLightCoefficient2 = 0.9;
|
|
20206
20405
|
var SelectPopoverItem = ({
|
|
20207
20406
|
id,
|
|
@@ -20215,14 +20414,14 @@ var SelectPopoverItem = ({
|
|
|
20215
20414
|
tooltip,
|
|
20216
20415
|
isLoadingSubtitle2,
|
|
20217
20416
|
onClick
|
|
20218
|
-
}) => /* @__PURE__ */
|
|
20417
|
+
}) => /* @__PURE__ */ jsx110(Tooltip_default, { title: tooltip || "", children: /* @__PURE__ */ jsx110(
|
|
20219
20418
|
Grid2,
|
|
20220
20419
|
{
|
|
20221
20420
|
size: {
|
|
20222
20421
|
xs: 6
|
|
20223
20422
|
},
|
|
20224
20423
|
children: /* @__PURE__ */ jsxs51(
|
|
20225
|
-
|
|
20424
|
+
Stack8,
|
|
20226
20425
|
{
|
|
20227
20426
|
direction: "row",
|
|
20228
20427
|
sx: {
|
|
@@ -20249,7 +20448,7 @@ var SelectPopoverItem = ({
|
|
|
20249
20448
|
boxSizing: "border-box"
|
|
20250
20449
|
},
|
|
20251
20450
|
children: [
|
|
20252
|
-
/* @__PURE__ */
|
|
20451
|
+
/* @__PURE__ */ jsx110(
|
|
20253
20452
|
TextEllipsis_default,
|
|
20254
20453
|
{
|
|
20255
20454
|
color: Colors_exports.grey800,
|
|
@@ -20259,7 +20458,7 @@ var SelectPopoverItem = ({
|
|
|
20259
20458
|
},
|
|
20260
20459
|
typographyVariant: "body1",
|
|
20261
20460
|
text: /* @__PURE__ */ jsxs51(Fragment21, { children: [
|
|
20262
|
-
iconId && /* @__PURE__ */
|
|
20461
|
+
iconId && /* @__PURE__ */ jsx110(
|
|
20263
20462
|
Icon_default,
|
|
20264
20463
|
{
|
|
20265
20464
|
id: iconId,
|
|
@@ -20277,7 +20476,7 @@ var SelectPopoverItem = ({
|
|
|
20277
20476
|
] })
|
|
20278
20477
|
}
|
|
20279
20478
|
),
|
|
20280
|
-
subtitle1 && /* @__PURE__ */
|
|
20479
|
+
subtitle1 && /* @__PURE__ */ jsx110(
|
|
20281
20480
|
Typography_default,
|
|
20282
20481
|
{
|
|
20283
20482
|
variant: "body2",
|
|
@@ -20287,7 +20486,7 @@ var SelectPopoverItem = ({
|
|
|
20287
20486
|
children: subtitle1
|
|
20288
20487
|
}
|
|
20289
20488
|
),
|
|
20290
|
-
isLoadingSubtitle2 && /* @__PURE__ */
|
|
20489
|
+
isLoadingSubtitle2 && /* @__PURE__ */ jsx110(
|
|
20291
20490
|
Skeleton_default,
|
|
20292
20491
|
{
|
|
20293
20492
|
variant: "text",
|
|
@@ -20299,7 +20498,7 @@ var SelectPopoverItem = ({
|
|
|
20299
20498
|
}
|
|
20300
20499
|
}
|
|
20301
20500
|
),
|
|
20302
|
-
subtitle2 && !isLoadingSubtitle2 && /* @__PURE__ */
|
|
20501
|
+
subtitle2 && !isLoadingSubtitle2 && /* @__PURE__ */ jsx110(
|
|
20303
20502
|
Typography_default,
|
|
20304
20503
|
{
|
|
20305
20504
|
variant: "body2",
|
|
@@ -20312,7 +20511,7 @@ var SelectPopoverItem = ({
|
|
|
20312
20511
|
]
|
|
20313
20512
|
}
|
|
20314
20513
|
),
|
|
20315
|
-
chipText && /* @__PURE__ */
|
|
20514
|
+
chipText && /* @__PURE__ */ jsx110(Box_default2, { sx: { minWidth: "72px", flexShrink: 0 }, children: /* @__PURE__ */ jsx110(
|
|
20316
20515
|
Chip_default,
|
|
20317
20516
|
{
|
|
20318
20517
|
label: chipText,
|
|
@@ -20333,17 +20532,17 @@ var SelectPopoverItem = ({
|
|
|
20333
20532
|
var SelectPopoverItem_default = SelectPopoverItem;
|
|
20334
20533
|
|
|
20335
20534
|
// src/components/input/TimezoneSelector.tsx
|
|
20336
|
-
import * as
|
|
20535
|
+
import * as React59 from "react";
|
|
20337
20536
|
import * as moment2 from "moment-timezone";
|
|
20338
20537
|
|
|
20339
20538
|
// src/components/input/Select.tsx
|
|
20340
|
-
import * as
|
|
20539
|
+
import * as React58 from "react";
|
|
20341
20540
|
import { styled as styled7 } from "@mui/material/styles";
|
|
20342
20541
|
import MuiSelect from "@mui/material/Select";
|
|
20343
20542
|
import InputBase from "@mui/material/InputBase";
|
|
20344
20543
|
import { FixedSizeList as FixedSizeList2 } from "react-window";
|
|
20345
20544
|
import AutoSizer4 from "react-virtualized-auto-sizer";
|
|
20346
|
-
import { jsx as
|
|
20545
|
+
import { jsx as jsx111 } from "react/jsx-runtime";
|
|
20347
20546
|
var BootstrapInput = styled7(InputBase)(() => ({
|
|
20348
20547
|
boxShadow: shadows[0],
|
|
20349
20548
|
borderRadius: "16px",
|
|
@@ -20374,7 +20573,7 @@ var BootstrapInput = styled7(InputBase)(() => ({
|
|
|
20374
20573
|
borderColor: grey800
|
|
20375
20574
|
}
|
|
20376
20575
|
}));
|
|
20377
|
-
var ChevronIcon = ({ disabled = false }) => /* @__PURE__ */
|
|
20576
|
+
var ChevronIcon = ({ disabled = false }) => /* @__PURE__ */ jsx111(
|
|
20378
20577
|
Icon_default,
|
|
20379
20578
|
{
|
|
20380
20579
|
id: "chevron-down",
|
|
@@ -20392,7 +20591,7 @@ var SelectOption = ({
|
|
|
20392
20591
|
selected,
|
|
20393
20592
|
colors,
|
|
20394
20593
|
...rest
|
|
20395
|
-
}) => /* @__PURE__ */
|
|
20594
|
+
}) => /* @__PURE__ */ jsx111(
|
|
20396
20595
|
ListItemButton_default,
|
|
20397
20596
|
{
|
|
20398
20597
|
role: "option",
|
|
@@ -20442,7 +20641,7 @@ var Select = function Select2({
|
|
|
20442
20641
|
onOpen,
|
|
20443
20642
|
...rest
|
|
20444
20643
|
}, ref) {
|
|
20445
|
-
const [_isOpen, setOpen] =
|
|
20644
|
+
const [_isOpen, setOpen] = React58.useState(false);
|
|
20446
20645
|
const isOpen = open ?? _isOpen;
|
|
20447
20646
|
const valueIndex = options.findIndex(
|
|
20448
20647
|
(op) => op.value === value
|
|
@@ -20459,7 +20658,7 @@ var Select = function Select2({
|
|
|
20459
20658
|
}) => {
|
|
20460
20659
|
const { value: currentValue, label, ...rest2 } = options[index];
|
|
20461
20660
|
const isSelected = value === currentValue;
|
|
20462
|
-
return /* @__PURE__ */
|
|
20661
|
+
return /* @__PURE__ */ jsx111(
|
|
20463
20662
|
ListItemButton_default,
|
|
20464
20663
|
{
|
|
20465
20664
|
text: label ?? currentValue?.toString() ?? "",
|
|
@@ -20490,7 +20689,7 @@ var Select = function Select2({
|
|
|
20490
20689
|
currentValue ?? ""
|
|
20491
20690
|
);
|
|
20492
20691
|
};
|
|
20493
|
-
const getVirtualizedSelect = () => /* @__PURE__ */
|
|
20692
|
+
const getVirtualizedSelect = () => /* @__PURE__ */ jsx111(
|
|
20494
20693
|
MuiSelect,
|
|
20495
20694
|
{
|
|
20496
20695
|
className: `Cn-Select ${className}`,
|
|
@@ -20526,8 +20725,8 @@ var Select = function Select2({
|
|
|
20526
20725
|
displayEmpty: true,
|
|
20527
20726
|
variant: "standard",
|
|
20528
20727
|
value,
|
|
20529
|
-
IconComponent: () => /* @__PURE__ */
|
|
20530
|
-
input: /* @__PURE__ */
|
|
20728
|
+
IconComponent: () => /* @__PURE__ */ jsx111(ChevronIcon, { disabled: rest.disabled }),
|
|
20729
|
+
input: /* @__PURE__ */ jsx111(BootstrapInput, { placeholder }),
|
|
20531
20730
|
onOpen: () => {
|
|
20532
20731
|
setOpen(true);
|
|
20533
20732
|
onOpen && onOpen();
|
|
@@ -20543,7 +20742,7 @@ var Select = function Select2({
|
|
|
20543
20742
|
return renderValue(value2, options);
|
|
20544
20743
|
}
|
|
20545
20744
|
if (!value2) {
|
|
20546
|
-
return /* @__PURE__ */
|
|
20745
|
+
return /* @__PURE__ */ jsx111("span", { style: { color: grey900 }, children: placeholder });
|
|
20547
20746
|
}
|
|
20548
20747
|
return options.find((o) => o.value === value2)?.label ?? value2;
|
|
20549
20748
|
},
|
|
@@ -20576,7 +20775,7 @@ var Select = function Select2({
|
|
|
20576
20775
|
}
|
|
20577
20776
|
}
|
|
20578
20777
|
},
|
|
20579
|
-
children: /* @__PURE__ */
|
|
20778
|
+
children: /* @__PURE__ */ jsx111(AutoSizer4, { disableWidth: true, children: ({ height: height2 }) => /* @__PURE__ */ jsx111(
|
|
20580
20779
|
FixedSizeList2,
|
|
20581
20780
|
{
|
|
20582
20781
|
height: height2,
|
|
@@ -20590,7 +20789,7 @@ var Select = function Select2({
|
|
|
20590
20789
|
) })
|
|
20591
20790
|
}
|
|
20592
20791
|
);
|
|
20593
|
-
const getNotVirtualizedSelect = () => /* @__PURE__ */
|
|
20792
|
+
const getNotVirtualizedSelect = () => /* @__PURE__ */ jsx111(
|
|
20594
20793
|
MuiSelect,
|
|
20595
20794
|
{
|
|
20596
20795
|
className: `Cn-Select ${className}`,
|
|
@@ -20630,9 +20829,9 @@ var Select = function Select2({
|
|
|
20630
20829
|
},
|
|
20631
20830
|
multiple,
|
|
20632
20831
|
value,
|
|
20633
|
-
IconComponent: () => /* @__PURE__ */
|
|
20832
|
+
IconComponent: () => /* @__PURE__ */ jsx111(ChevronIcon, { disabled: rest.disabled }),
|
|
20634
20833
|
open,
|
|
20635
|
-
input: /* @__PURE__ */
|
|
20834
|
+
input: /* @__PURE__ */ jsx111(BootstrapInput, { placeholder }),
|
|
20636
20835
|
onOpen: () => {
|
|
20637
20836
|
setOpen(true);
|
|
20638
20837
|
onOpen && onOpen();
|
|
@@ -20648,7 +20847,7 @@ var Select = function Select2({
|
|
|
20648
20847
|
}
|
|
20649
20848
|
if (Array.isArray(value2)) {
|
|
20650
20849
|
if (value2.length === 0) {
|
|
20651
|
-
return /* @__PURE__ */
|
|
20850
|
+
return /* @__PURE__ */ jsx111("span", { style: { color: grey900 }, children: placeholder });
|
|
20652
20851
|
} else {
|
|
20653
20852
|
return value2.map((v) => {
|
|
20654
20853
|
const option = options.find((o) => o.value === v);
|
|
@@ -20657,7 +20856,7 @@ var Select = function Select2({
|
|
|
20657
20856
|
}
|
|
20658
20857
|
} else {
|
|
20659
20858
|
if (!value2) {
|
|
20660
|
-
return /* @__PURE__ */
|
|
20859
|
+
return /* @__PURE__ */ jsx111("span", { style: { color: grey900 }, children: placeholder });
|
|
20661
20860
|
}
|
|
20662
20861
|
return options.find((o) => o.value === value2)?.label ?? value2;
|
|
20663
20862
|
}
|
|
@@ -20682,7 +20881,7 @@ var Select = function Select2({
|
|
|
20682
20881
|
}
|
|
20683
20882
|
},
|
|
20684
20883
|
...rest,
|
|
20685
|
-
children: children ?? options.map(({ label, value: value2, ...rest2 }) => /* @__PURE__ */
|
|
20884
|
+
children: children ?? options.map(({ label, value: value2, ...rest2 }) => /* @__PURE__ */ jsx111(
|
|
20686
20885
|
SelectOption,
|
|
20687
20886
|
{
|
|
20688
20887
|
label: label ?? value2?.toString() ?? "",
|
|
@@ -20696,21 +20895,21 @@ var Select = function Select2({
|
|
|
20696
20895
|
);
|
|
20697
20896
|
return virtualized ? getVirtualizedSelect() : getNotVirtualizedSelect();
|
|
20698
20897
|
};
|
|
20699
|
-
var Select_default =
|
|
20898
|
+
var Select_default = React58.forwardRef(Select);
|
|
20700
20899
|
|
|
20701
20900
|
// src/components/input/TimezoneSelector.tsx
|
|
20702
|
-
import { jsx as
|
|
20901
|
+
import { jsx as jsx112 } from "react/jsx-runtime";
|
|
20703
20902
|
var TimezoneSelector = ({
|
|
20704
20903
|
initialTimezone,
|
|
20705
20904
|
onTimezoneChange
|
|
20706
20905
|
}) => {
|
|
20707
|
-
const [selectedTimezone, setSelectedTimezone] =
|
|
20906
|
+
const [selectedTimezone, setSelectedTimezone] = React59.useState(initialTimezone);
|
|
20708
20907
|
const handleChange = (timezone) => {
|
|
20709
20908
|
setSelectedTimezone(timezone);
|
|
20710
20909
|
onTimezoneChange(timezone);
|
|
20711
20910
|
};
|
|
20712
20911
|
const timeZones = moment2.tz.names();
|
|
20713
|
-
return /* @__PURE__ */
|
|
20912
|
+
return /* @__PURE__ */ jsx112(
|
|
20714
20913
|
Select_default,
|
|
20715
20914
|
{
|
|
20716
20915
|
value: selectedTimezone,
|
|
@@ -20723,17 +20922,17 @@ var TimezoneSelector = ({
|
|
|
20723
20922
|
var TimezoneSelector_default = TimezoneSelector;
|
|
20724
20923
|
|
|
20725
20924
|
// src/components/input/DaysOfWeekPicker.tsx
|
|
20726
|
-
import * as
|
|
20727
|
-
import { jsx as
|
|
20925
|
+
import * as React60 from "react";
|
|
20926
|
+
import { jsx as jsx113 } from "react/jsx-runtime";
|
|
20728
20927
|
var DaysOfWeekPicker = ({ value, onChange }) => {
|
|
20729
|
-
const { locale } =
|
|
20730
|
-
const daysOfWeekLong =
|
|
20731
|
-
() => getWeekDayNamesForLocale(locale, "long"),
|
|
20732
|
-
[locale]
|
|
20928
|
+
const { locale, timezone } = React60.useContext(IntlContext);
|
|
20929
|
+
const daysOfWeekLong = React60.useMemo(
|
|
20930
|
+
() => getWeekDayNamesForLocale(locale, "long", timezone),
|
|
20931
|
+
[locale, timezone]
|
|
20733
20932
|
);
|
|
20734
|
-
const daysOfWeek =
|
|
20735
|
-
() => getWeekDayNamesForLocale(locale, "narrow"),
|
|
20736
|
-
[locale]
|
|
20933
|
+
const daysOfWeek = React60.useMemo(
|
|
20934
|
+
() => getWeekDayNamesForLocale(locale, "narrow", timezone),
|
|
20935
|
+
[locale, timezone]
|
|
20737
20936
|
);
|
|
20738
20937
|
const daysOfWeekValues = [
|
|
20739
20938
|
"monday",
|
|
@@ -20744,7 +20943,7 @@ var DaysOfWeekPicker = ({ value, onChange }) => {
|
|
|
20744
20943
|
"saturday",
|
|
20745
20944
|
"sunday"
|
|
20746
20945
|
];
|
|
20747
|
-
return /* @__PURE__ */
|
|
20946
|
+
return /* @__PURE__ */ jsx113(
|
|
20748
20947
|
Stack_default,
|
|
20749
20948
|
{
|
|
20750
20949
|
direction: "row",
|
|
@@ -20753,7 +20952,7 @@ var DaysOfWeekPicker = ({ value, onChange }) => {
|
|
|
20753
20952
|
height: "34px",
|
|
20754
20953
|
alignItems: "center"
|
|
20755
20954
|
},
|
|
20756
|
-
children: daysOfWeek.map((day, index) => /* @__PURE__ */
|
|
20955
|
+
children: daysOfWeek.map((day, index) => /* @__PURE__ */ jsx113("div", { style: { margin: "0 2px" }, children: /* @__PURE__ */ jsx113(
|
|
20757
20956
|
ToggleButton_default,
|
|
20758
20957
|
{
|
|
20759
20958
|
sx: {
|
|
@@ -20776,7 +20975,7 @@ var DaysOfWeekPicker = ({ value, onChange }) => {
|
|
|
20776
20975
|
onChange(value.concat([currentValue]));
|
|
20777
20976
|
}
|
|
20778
20977
|
},
|
|
20779
|
-
children: /* @__PURE__ */
|
|
20978
|
+
children: /* @__PURE__ */ jsx113(Tooltip_default, { title: daysOfWeekLong[index], children: /* @__PURE__ */ jsx113("span", { children: day }) }, index)
|
|
20780
20979
|
}
|
|
20781
20980
|
) }, index))
|
|
20782
20981
|
}
|
|
@@ -20785,11 +20984,11 @@ var DaysOfWeekPicker = ({ value, onChange }) => {
|
|
|
20785
20984
|
var DaysOfWeekPicker_default = DaysOfWeekPicker;
|
|
20786
20985
|
|
|
20787
20986
|
// src/components/input/ColorPicker.tsx
|
|
20788
|
-
import * as
|
|
20987
|
+
import * as React61 from "react";
|
|
20789
20988
|
import GradientColorPicker, {
|
|
20790
20989
|
useColorPicker
|
|
20791
20990
|
} from "react-best-gradient-color-picker";
|
|
20792
|
-
import { Fragment as Fragment22, jsx as
|
|
20991
|
+
import { Fragment as Fragment22, jsx as jsx114, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
20793
20992
|
var colorRegex = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$|^rgba?\((\d{1,3}), {0,1}(\d{1,3}), {0,1}(\d{1,3})(, {0,1}([01]|0?\.\d+))?\)$/;
|
|
20794
20993
|
var isValidColor = (color2) => colorRegex.test(color2);
|
|
20795
20994
|
var colorPickerDefaultColors = [
|
|
@@ -20812,7 +21011,7 @@ var colorPickerDefaultColors = [
|
|
|
20812
21011
|
"rgb(64,64,64)",
|
|
20813
21012
|
"rgb(255,165,0)"
|
|
20814
21013
|
];
|
|
20815
|
-
var ColorPicker =
|
|
21014
|
+
var ColorPicker = React61.forwardRef(function ColorPickerWrapper({
|
|
20816
21015
|
value,
|
|
20817
21016
|
label,
|
|
20818
21017
|
width: width2,
|
|
@@ -20825,22 +21024,22 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20825
21024
|
onChange
|
|
20826
21025
|
}, ref) {
|
|
20827
21026
|
const { t } = useTranslation();
|
|
20828
|
-
const [previousColors, setPreviousColors] =
|
|
21027
|
+
const [previousColors, setPreviousColors] = React61.useState(
|
|
20829
21028
|
colorPickerDefaultColors
|
|
20830
21029
|
);
|
|
20831
21030
|
const currentColorPreset = presets || previousColors;
|
|
20832
|
-
const [internalPickerValue, setInternalPickerValue] =
|
|
21031
|
+
const [internalPickerValue, setInternalPickerValue] = React61.useState(
|
|
20833
21032
|
value || white
|
|
20834
21033
|
);
|
|
20835
21034
|
const { valueToHex } = useColorPicker(
|
|
20836
21035
|
internalPickerValue ?? "",
|
|
20837
21036
|
setInternalPickerValue
|
|
20838
21037
|
);
|
|
20839
|
-
const [textFieldValue, setTextFieldValue] =
|
|
21038
|
+
const [textFieldValue, setTextFieldValue] = React61.useState(
|
|
20840
21039
|
value ? valueToHex() : ""
|
|
20841
21040
|
);
|
|
20842
|
-
const [isValidPickerChange, setValidPickerChange] =
|
|
20843
|
-
const [anchorEl, setAnchorEl] =
|
|
21041
|
+
const [isValidPickerChange, setValidPickerChange] = React61.useState(false);
|
|
21042
|
+
const [anchorEl, setAnchorEl] = React61.useState();
|
|
20844
21043
|
const handleTextFieldChange = (event) => {
|
|
20845
21044
|
const newValue = event.target.value;
|
|
20846
21045
|
setValidPickerChange(false);
|
|
@@ -20860,7 +21059,7 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20860
21059
|
return hex.length === 1 ? "0" + hex : hex;
|
|
20861
21060
|
}).join("");
|
|
20862
21061
|
};
|
|
20863
|
-
const iconColor = /* @__PURE__ */
|
|
21062
|
+
const iconColor = /* @__PURE__ */ jsx114(
|
|
20864
21063
|
IconButton_default,
|
|
20865
21064
|
{
|
|
20866
21065
|
iconId: value ? "color-square" : "transparent",
|
|
@@ -20871,7 +21070,7 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20871
21070
|
sx: { color: value || grey600 }
|
|
20872
21071
|
}
|
|
20873
21072
|
);
|
|
20874
|
-
|
|
21073
|
+
React61.useEffect(() => {
|
|
20875
21074
|
const handleColorChange = (color2) => {
|
|
20876
21075
|
setPreviousColors((prev) => [color2, ...prev.slice(0, 17)]);
|
|
20877
21076
|
setTextFieldValue(valueToHex());
|
|
@@ -20883,7 +21082,7 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20883
21082
|
}
|
|
20884
21083
|
}, [value, internalPickerValue, onChange, isValidPickerChange, valueToHex]);
|
|
20885
21084
|
return /* @__PURE__ */ jsxs52(Fragment22, { children: [
|
|
20886
|
-
/* @__PURE__ */
|
|
21085
|
+
/* @__PURE__ */ jsx114(
|
|
20887
21086
|
TextField_default,
|
|
20888
21087
|
{
|
|
20889
21088
|
value: textFieldValue,
|
|
@@ -20908,7 +21107,7 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20908
21107
|
ref
|
|
20909
21108
|
}
|
|
20910
21109
|
),
|
|
20911
|
-
/* @__PURE__ */
|
|
21110
|
+
/* @__PURE__ */ jsx114(
|
|
20912
21111
|
Popover_default,
|
|
20913
21112
|
{
|
|
20914
21113
|
anchorEl,
|
|
@@ -20917,7 +21116,7 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20917
21116
|
onMouseUp: () => {
|
|
20918
21117
|
setValidPickerChange(true);
|
|
20919
21118
|
},
|
|
20920
|
-
children: /* @__PURE__ */
|
|
21119
|
+
children: /* @__PURE__ */ jsx114(
|
|
20921
21120
|
Box_default2,
|
|
20922
21121
|
{
|
|
20923
21122
|
className: "Cn-Color-Gradient-Box",
|
|
@@ -20961,7 +21160,7 @@ var ColorPicker = React60.forwardRef(function ColorPickerWrapper({
|
|
|
20961
21160
|
fontFamily: "Source Sans Pro, sans-serif"
|
|
20962
21161
|
}
|
|
20963
21162
|
},
|
|
20964
|
-
children: /* @__PURE__ */
|
|
21163
|
+
children: /* @__PURE__ */ jsx114(
|
|
20965
21164
|
GradientColorPicker,
|
|
20966
21165
|
{
|
|
20967
21166
|
className: "Cn-Color-Gradient-Picker",
|
|
@@ -20992,7 +21191,7 @@ var ColorPicker_default = ColorPicker;
|
|
|
20992
21191
|
|
|
20993
21192
|
// src/components/input/UploadClickableArea.tsx
|
|
20994
21193
|
import { Box as Box3 } from "@mui/material";
|
|
20995
|
-
import { jsx as
|
|
21194
|
+
import { jsx as jsx115, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
20996
21195
|
var UploadClickableArea = ({
|
|
20997
21196
|
accept,
|
|
20998
21197
|
onFilesChanged,
|
|
@@ -21006,7 +21205,7 @@ var UploadClickableArea = ({
|
|
|
21006
21205
|
display: "inline-block"
|
|
21007
21206
|
},
|
|
21008
21207
|
children: [
|
|
21009
|
-
/* @__PURE__ */
|
|
21208
|
+
/* @__PURE__ */ jsx115(
|
|
21010
21209
|
"input",
|
|
21011
21210
|
{
|
|
21012
21211
|
type: "file",
|
|
@@ -21022,10 +21221,10 @@ var UploadClickableArea = ({
|
|
|
21022
21221
|
var UploadClickableArea_default = UploadClickableArea;
|
|
21023
21222
|
|
|
21024
21223
|
// src/components/input/CategorizedPicker.tsx
|
|
21025
|
-
import
|
|
21026
|
-
import { Grid as Grid3, Popover as Popover2, Select as Select3, Stack as
|
|
21027
|
-
import { Fragment as Fragment23, jsx as
|
|
21028
|
-
var ChevronIcon2 = ({ disabled }) => /* @__PURE__ */
|
|
21224
|
+
import React62 from "react";
|
|
21225
|
+
import { Grid as Grid3, Popover as Popover2, Select as Select3, Stack as Stack9 } from "@mui/material";
|
|
21226
|
+
import { Fragment as Fragment23, jsx as jsx116, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
21227
|
+
var ChevronIcon2 = ({ disabled }) => /* @__PURE__ */ jsx116(
|
|
21029
21228
|
Icon_default,
|
|
21030
21229
|
{
|
|
21031
21230
|
id: "chevron-down",
|
|
@@ -21047,38 +21246,38 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21047
21246
|
onChange
|
|
21048
21247
|
}) {
|
|
21049
21248
|
const { t } = useTranslation();
|
|
21050
|
-
const anchorRef =
|
|
21051
|
-
const [open, setOpen] =
|
|
21052
|
-
const [search, setSearch] =
|
|
21053
|
-
const [unfilteredCategories] =
|
|
21249
|
+
const anchorRef = React62.useRef(null);
|
|
21250
|
+
const [open, setOpen] = React62.useState(false);
|
|
21251
|
+
const [search, setSearch] = React62.useState("");
|
|
21252
|
+
const [unfilteredCategories] = React62.useState(
|
|
21054
21253
|
categories.map((category) => ({
|
|
21055
21254
|
...category,
|
|
21056
21255
|
categoryOptions: options.filter(category.filter)
|
|
21057
21256
|
})).filter((category) => category.categoryOptions.length > 0)
|
|
21058
21257
|
);
|
|
21059
|
-
const [filteredCategories, setFilteredCategories] =
|
|
21060
|
-
const getDefaultSelectedCategory =
|
|
21258
|
+
const [filteredCategories, setFilteredCategories] = React62.useState(unfilteredCategories);
|
|
21259
|
+
const getDefaultSelectedCategory = React62.useCallback(
|
|
21061
21260
|
() => filteredCategories.find(
|
|
21062
21261
|
(category) => category.categoryOptions.some((option) => option.id === value?.id)
|
|
21063
21262
|
),
|
|
21064
21263
|
[filteredCategories, value?.id]
|
|
21065
21264
|
);
|
|
21066
|
-
const [selectedCategory, setSelectedCategory] =
|
|
21067
|
-
const onTypeSearch =
|
|
21265
|
+
const [selectedCategory, setSelectedCategory] = React62.useState(getDefaultSelectedCategory());
|
|
21266
|
+
const onTypeSearch = React62.useCallback(
|
|
21068
21267
|
(event) => {
|
|
21069
21268
|
setSearch(event.target.value);
|
|
21070
21269
|
},
|
|
21071
21270
|
[]
|
|
21072
21271
|
);
|
|
21073
|
-
const openPopover =
|
|
21272
|
+
const openPopover = React62.useCallback(() => {
|
|
21074
21273
|
setOpen(true);
|
|
21075
21274
|
setSearch("");
|
|
21076
21275
|
setSelectedCategory(getDefaultSelectedCategory());
|
|
21077
21276
|
}, [getDefaultSelectedCategory]);
|
|
21078
|
-
const closePopover =
|
|
21277
|
+
const closePopover = React62.useCallback(() => {
|
|
21079
21278
|
setOpen(false);
|
|
21080
21279
|
}, []);
|
|
21081
|
-
|
|
21280
|
+
React62.useEffect(() => {
|
|
21082
21281
|
const tokens = search.split(",").map((s) => s.trim()).filter((s) => !!s);
|
|
21083
21282
|
if (tokens.length === 0) {
|
|
21084
21283
|
setFilteredCategories(unfilteredCategories);
|
|
@@ -21108,7 +21307,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21108
21307
|
}).filter((category) => !!category);
|
|
21109
21308
|
setFilteredCategories(nextCategories);
|
|
21110
21309
|
}, [categories, options, search, unfilteredCategories]);
|
|
21111
|
-
|
|
21310
|
+
React62.useEffect(() => {
|
|
21112
21311
|
const filteredSelectedCategory = selectedCategory && filteredCategories.find(
|
|
21113
21312
|
(category) => category.name === selectedCategory.name
|
|
21114
21313
|
);
|
|
@@ -21121,7 +21320,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21121
21320
|
}
|
|
21122
21321
|
}, [filteredCategories, selectedCategory]);
|
|
21123
21322
|
return /* @__PURE__ */ jsxs54(Fragment23, { children: [
|
|
21124
|
-
/* @__PURE__ */
|
|
21323
|
+
/* @__PURE__ */ jsx116(
|
|
21125
21324
|
Select3,
|
|
21126
21325
|
{
|
|
21127
21326
|
ref: anchorRef,
|
|
@@ -21136,7 +21335,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21136
21335
|
value: value?.name || "",
|
|
21137
21336
|
displayEmpty: true,
|
|
21138
21337
|
disabled,
|
|
21139
|
-
input: /* @__PURE__ */
|
|
21338
|
+
input: /* @__PURE__ */ jsx116(
|
|
21140
21339
|
BootstrapInput,
|
|
21141
21340
|
{
|
|
21142
21341
|
sx: {
|
|
@@ -21145,7 +21344,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21145
21344
|
}
|
|
21146
21345
|
),
|
|
21147
21346
|
renderValue: (value2) => value2 || placeholder,
|
|
21148
|
-
IconComponent: () => /* @__PURE__ */
|
|
21347
|
+
IconComponent: () => /* @__PURE__ */ jsx116(ChevronIcon2, { disabled }),
|
|
21149
21348
|
onClick: !disabled ? (e) => {
|
|
21150
21349
|
e.preventDefault();
|
|
21151
21350
|
e.stopPropagation();
|
|
@@ -21153,10 +21352,10 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21153
21352
|
} : void 0,
|
|
21154
21353
|
open: false,
|
|
21155
21354
|
"data-testid": dataTestId,
|
|
21156
|
-
children: options.map((option) => /* @__PURE__ */
|
|
21355
|
+
children: options.map((option) => /* @__PURE__ */ jsx116("option", { value: option.name }, option.id))
|
|
21157
21356
|
}
|
|
21158
21357
|
),
|
|
21159
|
-
/* @__PURE__ */
|
|
21358
|
+
/* @__PURE__ */ jsx116(
|
|
21160
21359
|
Popover2,
|
|
21161
21360
|
{
|
|
21162
21361
|
anchorEl: anchorRef.current,
|
|
@@ -21178,7 +21377,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21178
21377
|
}
|
|
21179
21378
|
},
|
|
21180
21379
|
children: /* @__PURE__ */ jsxs54(Grid3, { container: true, children: [
|
|
21181
|
-
/* @__PURE__ */
|
|
21380
|
+
/* @__PURE__ */ jsx116(
|
|
21182
21381
|
Grid3,
|
|
21183
21382
|
{
|
|
21184
21383
|
size: {
|
|
@@ -21186,7 +21385,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21186
21385
|
},
|
|
21187
21386
|
padding: "8px",
|
|
21188
21387
|
borderBottom: `1px solid ${grey200}`,
|
|
21189
|
-
children: /* @__PURE__ */
|
|
21388
|
+
children: /* @__PURE__ */ jsx116(
|
|
21190
21389
|
DebouncedTextField_default,
|
|
21191
21390
|
{
|
|
21192
21391
|
placeholder: t(
|
|
@@ -21194,12 +21393,12 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21194
21393
|
),
|
|
21195
21394
|
value: search,
|
|
21196
21395
|
onChange: onTypeSearch,
|
|
21197
|
-
startAdornment: /* @__PURE__ */
|
|
21396
|
+
startAdornment: /* @__PURE__ */ jsx116(Icon_default, { id: "magnify" })
|
|
21198
21397
|
}
|
|
21199
21398
|
)
|
|
21200
21399
|
}
|
|
21201
21400
|
),
|
|
21202
|
-
/* @__PURE__ */
|
|
21401
|
+
/* @__PURE__ */ jsx116(
|
|
21203
21402
|
Grid3,
|
|
21204
21403
|
{
|
|
21205
21404
|
size: {
|
|
@@ -21208,14 +21407,14 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21208
21407
|
sx: { borderRight: `1px solid ${grey200}` },
|
|
21209
21408
|
height: "316px",
|
|
21210
21409
|
className: "Slim-Vertical-Scroll",
|
|
21211
|
-
children: /* @__PURE__ */
|
|
21410
|
+
children: /* @__PURE__ */ jsx116(Stack9, { children: filteredCategories.map((category, idx) => /* @__PURE__ */ jsx116(
|
|
21212
21411
|
ListItemButton_default,
|
|
21213
21412
|
{
|
|
21214
21413
|
selected: selectedCategory === category,
|
|
21215
21414
|
onClick: () => {
|
|
21216
21415
|
setSelectedCategory(category);
|
|
21217
21416
|
},
|
|
21218
|
-
endAdornment: selectedCategory === category ? /* @__PURE__ */
|
|
21417
|
+
endAdornment: selectedCategory === category ? /* @__PURE__ */ jsx116(
|
|
21219
21418
|
Icon_default,
|
|
21220
21419
|
{
|
|
21221
21420
|
id: "menu-right",
|
|
@@ -21223,10 +21422,10 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21223
21422
|
}
|
|
21224
21423
|
) : void 0,
|
|
21225
21424
|
buttonDataTest: dataTestId ? dataTestId + "-category-" + idx : void 0,
|
|
21226
|
-
children: /* @__PURE__ */
|
|
21425
|
+
children: /* @__PURE__ */ jsx116(
|
|
21227
21426
|
TextEllipsis_default,
|
|
21228
21427
|
{
|
|
21229
|
-
text: /* @__PURE__ */
|
|
21428
|
+
text: /* @__PURE__ */ jsx116(
|
|
21230
21429
|
TextMarker_default,
|
|
21231
21430
|
{
|
|
21232
21431
|
searchText: search,
|
|
@@ -21244,7 +21443,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21244
21443
|
)) })
|
|
21245
21444
|
}
|
|
21246
21445
|
),
|
|
21247
|
-
/* @__PURE__ */
|
|
21446
|
+
/* @__PURE__ */ jsx116(
|
|
21248
21447
|
Grid3,
|
|
21249
21448
|
{
|
|
21250
21449
|
size: {
|
|
@@ -21252,7 +21451,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21252
21451
|
},
|
|
21253
21452
|
height: "316px",
|
|
21254
21453
|
className: "Slim-Vertical-Scroll",
|
|
21255
|
-
children: /* @__PURE__ */
|
|
21454
|
+
children: /* @__PURE__ */ jsx116(Stack9, { children: /* @__PURE__ */ jsx116(Stack9, { children: !selectedCategory ? /* @__PURE__ */ jsx116(Stack9, { padding: "12px", alignItems: "center", children: /* @__PURE__ */ jsx116(
|
|
21256
21455
|
Typography_default,
|
|
21257
21456
|
{
|
|
21258
21457
|
variant: "body2",
|
|
@@ -21264,7 +21463,7 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21264
21463
|
)
|
|
21265
21464
|
}
|
|
21266
21465
|
) }) : selectedCategory.categoryOptions.map(
|
|
21267
|
-
(option, idx) => /* @__PURE__ */
|
|
21466
|
+
(option, idx) => /* @__PURE__ */ jsx116(
|
|
21268
21467
|
ListItemButton_default,
|
|
21269
21468
|
{
|
|
21270
21469
|
selected: value?.id === option.id,
|
|
@@ -21273,10 +21472,10 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21273
21472
|
closePopover();
|
|
21274
21473
|
},
|
|
21275
21474
|
buttonDataTest: dataTestId ? dataTestId + "-option-" + idx : void 0,
|
|
21276
|
-
children: /* @__PURE__ */
|
|
21475
|
+
children: /* @__PURE__ */ jsx116(
|
|
21277
21476
|
TextEllipsis_default,
|
|
21278
21477
|
{
|
|
21279
|
-
text: /* @__PURE__ */
|
|
21478
|
+
text: /* @__PURE__ */ jsx116(
|
|
21280
21479
|
TextMarker_default,
|
|
21281
21480
|
{
|
|
21282
21481
|
searchText: search,
|
|
@@ -21302,14 +21501,14 @@ var CategorizedPicker = function CategorizedPicker2({
|
|
|
21302
21501
|
var CategorizedPicker_default = CategorizedPicker;
|
|
21303
21502
|
|
|
21304
21503
|
// src/components/input/ItemSelector.tsx
|
|
21305
|
-
import * as
|
|
21504
|
+
import * as React64 from "react";
|
|
21306
21505
|
|
|
21307
21506
|
// src/components/input/SelectPopover.tsx
|
|
21308
|
-
import * as
|
|
21309
|
-
import { Grid as Grid4, Stack as
|
|
21507
|
+
import * as React63 from "react";
|
|
21508
|
+
import { Grid as Grid4, Stack as Stack10 } from "@mui/material";
|
|
21310
21509
|
import { useState as useState22 } from "react";
|
|
21311
21510
|
import InfiniteScroll from "react-infinite-scroll-component";
|
|
21312
|
-
import { jsx as
|
|
21511
|
+
import { jsx as jsx117, jsxs as jsxs55 } from "react/jsx-runtime";
|
|
21313
21512
|
var defaultItemsColorStyles = {
|
|
21314
21513
|
selectedColor: Colors_exports.primaryMain,
|
|
21315
21514
|
disabledColor: ""
|
|
@@ -21336,14 +21535,16 @@ var SelectPopover = function SelectPopover2({
|
|
|
21336
21535
|
maxSelectedItems,
|
|
21337
21536
|
keepCurrentSelectionOnSearch = true,
|
|
21338
21537
|
emptyListPlaceholder,
|
|
21339
|
-
disableApplyWithoutChanges = false
|
|
21538
|
+
disableApplyWithoutChanges = false,
|
|
21539
|
+
centeredInScreen = false,
|
|
21540
|
+
paddingContent
|
|
21340
21541
|
}) {
|
|
21341
21542
|
const { t } = useTranslation();
|
|
21342
21543
|
const [searchText, setSearchText] = useState22("");
|
|
21343
21544
|
const [isScrollBottom, setIsScrollBottom] = useState22(false);
|
|
21344
21545
|
const [currentItems, setCurrentItems] = useState22([]);
|
|
21345
|
-
const [currentSelectedItems, setCurrentSelectedItems] =
|
|
21346
|
-
const prevSelectedItemsIdsRef =
|
|
21546
|
+
const [currentSelectedItems, setCurrentSelectedItems] = React63.useState([]);
|
|
21547
|
+
const prevSelectedItemsIdsRef = React63.useRef([]);
|
|
21347
21548
|
const onSearchTextChanged = (text) => {
|
|
21348
21549
|
onSearch(text);
|
|
21349
21550
|
setSearchText(text);
|
|
@@ -21355,7 +21556,7 @@ var SelectPopover = function SelectPopover2({
|
|
|
21355
21556
|
}
|
|
21356
21557
|
setCurrentSelectedItems(selectedItemsIds);
|
|
21357
21558
|
};
|
|
21358
|
-
|
|
21559
|
+
React63.useEffect(() => {
|
|
21359
21560
|
const prevSelectedItemsIds = prevSelectedItemsIdsRef.current;
|
|
21360
21561
|
if (keepCurrentSelectionOnSearch && anchorEl) {
|
|
21361
21562
|
let nextSelectedItems = currentSelectedItems;
|
|
@@ -21447,18 +21648,19 @@ var SelectPopover = function SelectPopover2({
|
|
|
21447
21648
|
return /* @__PURE__ */ jsxs55(
|
|
21448
21649
|
Popover_default,
|
|
21449
21650
|
{
|
|
21651
|
+
centeredInScreen,
|
|
21450
21652
|
onClose: closePopover,
|
|
21451
21653
|
anchorEl,
|
|
21452
21654
|
disableRestoreFocus,
|
|
21453
21655
|
children: [
|
|
21454
|
-
/* @__PURE__ */
|
|
21656
|
+
/* @__PURE__ */ jsx117(
|
|
21455
21657
|
Box_default2,
|
|
21456
21658
|
{
|
|
21457
21659
|
sx: {
|
|
21458
21660
|
borderBottom: `1px solid ${Colors_exports.grey200}`,
|
|
21459
21661
|
padding: "8px"
|
|
21460
21662
|
},
|
|
21461
|
-
children: /* @__PURE__ */
|
|
21663
|
+
children: /* @__PURE__ */ jsx117(
|
|
21462
21664
|
DebouncedTextField_default,
|
|
21463
21665
|
{
|
|
21464
21666
|
iconId: "magnify",
|
|
@@ -21473,7 +21675,7 @@ var SelectPopover = function SelectPopover2({
|
|
|
21473
21675
|
)
|
|
21474
21676
|
}
|
|
21475
21677
|
),
|
|
21476
|
-
/* @__PURE__ */
|
|
21678
|
+
/* @__PURE__ */ jsx117(
|
|
21477
21679
|
InfiniteScroll,
|
|
21478
21680
|
{
|
|
21479
21681
|
height: 300,
|
|
@@ -21498,8 +21700,11 @@ var SelectPopover = function SelectPopover2({
|
|
|
21498
21700
|
container: true,
|
|
21499
21701
|
spacing: 1,
|
|
21500
21702
|
sx: {
|
|
21501
|
-
padding: "12px 0px 12px 12px",
|
|
21703
|
+
padding: paddingContent || "12px 0px 12px 12px",
|
|
21502
21704
|
width: "100%",
|
|
21705
|
+
...!isLoading && currentItems.length === 0 && {
|
|
21706
|
+
height: "100%"
|
|
21707
|
+
},
|
|
21503
21708
|
"&::before": {
|
|
21504
21709
|
content: `''`,
|
|
21505
21710
|
position: "absolute",
|
|
@@ -21532,7 +21737,7 @@ var SelectPopover = function SelectPopover2({
|
|
|
21532
21737
|
onItemSelected
|
|
21533
21738
|
) : getItemElement(item, onItemSelected)
|
|
21534
21739
|
),
|
|
21535
|
-
isLoading && /* @__PURE__ */
|
|
21740
|
+
isLoading && /* @__PURE__ */ jsx117(
|
|
21536
21741
|
Skeleton_default,
|
|
21537
21742
|
{
|
|
21538
21743
|
variant: "text",
|
|
@@ -21545,25 +21750,25 @@ var SelectPopover = function SelectPopover2({
|
|
|
21545
21750
|
}
|
|
21546
21751
|
}
|
|
21547
21752
|
),
|
|
21548
|
-
!isLoading && currentItems.length === 0 ? /* @__PURE__ */
|
|
21549
|
-
|
|
21753
|
+
!isLoading && currentItems.length === 0 ? typeof emptyListPlaceholder === "string" ? /* @__PURE__ */ jsx117(
|
|
21754
|
+
Stack10,
|
|
21550
21755
|
{
|
|
21551
21756
|
alignItems: "center",
|
|
21552
21757
|
justifyContent: "center",
|
|
21553
21758
|
width: "100%",
|
|
21554
|
-
children: /* @__PURE__ */
|
|
21759
|
+
children: /* @__PURE__ */ jsx117(Typography_default, { variant: "body2", color: grey600, children: emptyListPlaceholder })
|
|
21555
21760
|
}
|
|
21556
|
-
) : ""
|
|
21761
|
+
) : emptyListPlaceholder : ""
|
|
21557
21762
|
]
|
|
21558
21763
|
}
|
|
21559
21764
|
)
|
|
21560
21765
|
}
|
|
21561
21766
|
),
|
|
21562
|
-
/* @__PURE__ */
|
|
21767
|
+
/* @__PURE__ */ jsx117(
|
|
21563
21768
|
PopoverActions_default,
|
|
21564
21769
|
{
|
|
21565
21770
|
sx: { padding: "16px 24px" },
|
|
21566
|
-
leftContent: /* @__PURE__ */
|
|
21771
|
+
leftContent: /* @__PURE__ */ jsx117(
|
|
21567
21772
|
Button_default,
|
|
21568
21773
|
{
|
|
21569
21774
|
variant: "contained",
|
|
@@ -21573,7 +21778,7 @@ var SelectPopover = function SelectPopover2({
|
|
|
21573
21778
|
onClick: closePopover
|
|
21574
21779
|
}
|
|
21575
21780
|
),
|
|
21576
|
-
rightContent: /* @__PURE__ */
|
|
21781
|
+
rightContent: /* @__PURE__ */ jsx117(
|
|
21577
21782
|
Button_default,
|
|
21578
21783
|
{
|
|
21579
21784
|
variant: "contained",
|
|
@@ -21597,7 +21802,7 @@ var SelectPopover = function SelectPopover2({
|
|
|
21597
21802
|
);
|
|
21598
21803
|
};
|
|
21599
21804
|
function getItemElement(item, onItemClick) {
|
|
21600
|
-
return /* @__PURE__ */
|
|
21805
|
+
return /* @__PURE__ */ jsx117(
|
|
21601
21806
|
SelectPopoverItem_default,
|
|
21602
21807
|
{
|
|
21603
21808
|
id: item.id,
|
|
@@ -21626,7 +21831,7 @@ var arraysEqual = (a, b) => {
|
|
|
21626
21831
|
var SelectPopover_default = SelectPopover;
|
|
21627
21832
|
|
|
21628
21833
|
// src/components/input/ItemSelector.tsx
|
|
21629
|
-
import { Fragment as Fragment24, jsx as
|
|
21834
|
+
import { Fragment as Fragment24, jsx as jsx118, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
21630
21835
|
var ItemSelector = function ItemSelector2({
|
|
21631
21836
|
items,
|
|
21632
21837
|
selectedItems,
|
|
@@ -21657,16 +21862,16 @@ var ItemSelector = function ItemSelector2({
|
|
|
21657
21862
|
onSearch,
|
|
21658
21863
|
onClose
|
|
21659
21864
|
}) {
|
|
21660
|
-
const [anchorEl, setAnchorEl] =
|
|
21661
|
-
const [searchText, setSearchText] =
|
|
21662
|
-
const allShownItemsRef =
|
|
21663
|
-
const selectRef =
|
|
21664
|
-
|
|
21865
|
+
const [anchorEl, setAnchorEl] = React64.useState();
|
|
21866
|
+
const [searchText, setSearchText] = React64.useState("");
|
|
21867
|
+
const allShownItemsRef = React64.useRef(items);
|
|
21868
|
+
const selectRef = React64.useRef(null);
|
|
21869
|
+
React64.useEffect(() => {
|
|
21665
21870
|
if (anchorEl) {
|
|
21666
21871
|
onSearch(searchText);
|
|
21667
21872
|
}
|
|
21668
21873
|
}, [anchorEl, onSearch, searchText]);
|
|
21669
|
-
|
|
21874
|
+
React64.useEffect(() => {
|
|
21670
21875
|
const allShownItems = allShownItemsRef.current;
|
|
21671
21876
|
allShownItemsRef.current = allShownItems.concat(
|
|
21672
21877
|
items.filter(
|
|
@@ -21680,7 +21885,7 @@ var ItemSelector = function ItemSelector2({
|
|
|
21680
21885
|
item
|
|
21681
21886
|
}) => {
|
|
21682
21887
|
const [ref, { contentWidth: width2 }] = useResizeObserver();
|
|
21683
|
-
return /* @__PURE__ */
|
|
21888
|
+
return /* @__PURE__ */ jsx118(
|
|
21684
21889
|
Chip_default,
|
|
21685
21890
|
{
|
|
21686
21891
|
ref,
|
|
@@ -21711,7 +21916,7 @@ var ItemSelector = function ItemSelector2({
|
|
|
21711
21916
|
return selectedItem ? [selectedItem] : "";
|
|
21712
21917
|
};
|
|
21713
21918
|
return /* @__PURE__ */ jsxs56(Fragment24, { children: [
|
|
21714
|
-
/* @__PURE__ */
|
|
21919
|
+
/* @__PURE__ */ jsx118(
|
|
21715
21920
|
Select_default,
|
|
21716
21921
|
{
|
|
21717
21922
|
ref: selectRef,
|
|
@@ -21728,16 +21933,16 @@ var ItemSelector = function ItemSelector2({
|
|
|
21728
21933
|
let component;
|
|
21729
21934
|
if (!value || !Array.isArray(value) || value.length === 0) {
|
|
21730
21935
|
component = /* @__PURE__ */ jsxs56(Fragment24, { children: [
|
|
21731
|
-
/* @__PURE__ */
|
|
21936
|
+
/* @__PURE__ */ jsx118(
|
|
21732
21937
|
Stack_default,
|
|
21733
21938
|
{
|
|
21734
21939
|
direction: "row",
|
|
21735
21940
|
flexWrap: "wrap",
|
|
21736
21941
|
padding: "6px 0",
|
|
21737
|
-
children: /* @__PURE__ */
|
|
21942
|
+
children: /* @__PURE__ */ jsx118(Typography_default, { variant: "body2", color: grey600, children: placeholder })
|
|
21738
21943
|
}
|
|
21739
21944
|
),
|
|
21740
|
-
/* @__PURE__ */
|
|
21945
|
+
/* @__PURE__ */ jsx118(
|
|
21741
21946
|
Divider_default,
|
|
21742
21947
|
{
|
|
21743
21948
|
variant: "middle",
|
|
@@ -21762,7 +21967,7 @@ var ItemSelector = function ItemSelector2({
|
|
|
21762
21967
|
const item = selectedItems.find(
|
|
21763
21968
|
(i) => i.id === id
|
|
21764
21969
|
);
|
|
21765
|
-
return item ? /* @__PURE__ */
|
|
21970
|
+
return item ? /* @__PURE__ */ jsx118(
|
|
21766
21971
|
ItemChip,
|
|
21767
21972
|
{
|
|
21768
21973
|
item: {
|
|
@@ -21771,14 +21976,14 @@ var ItemSelector = function ItemSelector2({
|
|
|
21771
21976
|
}
|
|
21772
21977
|
},
|
|
21773
21978
|
id
|
|
21774
|
-
) : /* @__PURE__ */
|
|
21979
|
+
) : /* @__PURE__ */ jsx118(Fragment24, {});
|
|
21775
21980
|
}),
|
|
21776
|
-
value.length - limitItemChips > 0 ? /* @__PURE__ */
|
|
21981
|
+
value.length - limitItemChips > 0 ? /* @__PURE__ */ jsx118(
|
|
21777
21982
|
Tooltip_default,
|
|
21778
21983
|
{
|
|
21779
21984
|
interactive: true,
|
|
21780
21985
|
variant: "white",
|
|
21781
|
-
title: /* @__PURE__ */
|
|
21986
|
+
title: /* @__PURE__ */ jsx118(
|
|
21782
21987
|
Stack_default,
|
|
21783
21988
|
{
|
|
21784
21989
|
direction: "row",
|
|
@@ -21795,24 +22000,24 @@ var ItemSelector = function ItemSelector2({
|
|
|
21795
22000
|
const item = selectedItems.find(
|
|
21796
22001
|
(i) => i.id === id
|
|
21797
22002
|
);
|
|
21798
|
-
return item ? /* @__PURE__ */
|
|
22003
|
+
return item ? /* @__PURE__ */ jsx118(
|
|
21799
22004
|
ItemChip,
|
|
21800
22005
|
{
|
|
21801
22006
|
item
|
|
21802
22007
|
},
|
|
21803
22008
|
id
|
|
21804
|
-
) : /* @__PURE__ */
|
|
22009
|
+
) : /* @__PURE__ */ jsx118(Fragment24, {});
|
|
21805
22010
|
})
|
|
21806
22011
|
}
|
|
21807
22012
|
),
|
|
21808
|
-
children: /* @__PURE__ */
|
|
22013
|
+
children: /* @__PURE__ */ jsx118(Typography_default, { variant: "body2", children: `+${value.length - limitItemChips}` })
|
|
21809
22014
|
}
|
|
21810
22015
|
) : void 0
|
|
21811
22016
|
]
|
|
21812
22017
|
}
|
|
21813
22018
|
),
|
|
21814
22019
|
!disabled && /* @__PURE__ */ jsxs56(Stack_default, { direction: "row", children: [
|
|
21815
|
-
/* @__PURE__ */
|
|
22020
|
+
/* @__PURE__ */ jsx118(
|
|
21816
22021
|
IconButton_default,
|
|
21817
22022
|
{
|
|
21818
22023
|
iconId: "close",
|
|
@@ -21830,7 +22035,7 @@ var ItemSelector = function ItemSelector2({
|
|
|
21830
22035
|
}
|
|
21831
22036
|
}
|
|
21832
22037
|
),
|
|
21833
|
-
/* @__PURE__ */
|
|
22038
|
+
/* @__PURE__ */ jsx118(
|
|
21834
22039
|
Divider_default,
|
|
21835
22040
|
{
|
|
21836
22041
|
variant: "middle",
|
|
@@ -21841,7 +22046,7 @@ var ItemSelector = function ItemSelector2({
|
|
|
21841
22046
|
] })
|
|
21842
22047
|
] });
|
|
21843
22048
|
}
|
|
21844
|
-
return /* @__PURE__ */
|
|
22049
|
+
return /* @__PURE__ */ jsx118(
|
|
21845
22050
|
Stack_default,
|
|
21846
22051
|
{
|
|
21847
22052
|
direction: "row",
|
|
@@ -21863,8 +22068,8 @@ var ItemSelector = function ItemSelector2({
|
|
|
21863
22068
|
}
|
|
21864
22069
|
}
|
|
21865
22070
|
),
|
|
21866
|
-
helperText && /* @__PURE__ */
|
|
21867
|
-
/* @__PURE__ */
|
|
22071
|
+
helperText && /* @__PURE__ */ jsx118(InputHelperText_default, { severity: isError ? "error" : "info", children: helperText }),
|
|
22072
|
+
/* @__PURE__ */ jsx118(
|
|
21868
22073
|
SelectPopover_default,
|
|
21869
22074
|
{
|
|
21870
22075
|
items: items.map((item) => {
|
|
@@ -21912,7 +22117,7 @@ var ItemSelector = function ItemSelector2({
|
|
|
21912
22117
|
var ItemSelector_default = ItemSelector;
|
|
21913
22118
|
|
|
21914
22119
|
// src/components/input/Autocomplete.tsx
|
|
21915
|
-
import * as
|
|
22120
|
+
import * as React65 from "react";
|
|
21916
22121
|
import { Popper, ClickAwayListener } from "@mui/material";
|
|
21917
22122
|
import { FixedSizeList as FixedSizeList3 } from "react-window";
|
|
21918
22123
|
import AutoSizer5 from "react-virtualized-auto-sizer";
|
|
@@ -21929,7 +22134,7 @@ var map = {
|
|
|
21929
22134
|
var toDiacriticInsensitiveString = (input) => Array.from(input).map((char) => map[char] ? `[${map[char]}]` : char).join("");
|
|
21930
22135
|
|
|
21931
22136
|
// src/components/input/Autocomplete.tsx
|
|
21932
|
-
import { Fragment as Fragment25, jsx as
|
|
22137
|
+
import { Fragment as Fragment25, jsx as jsx119, jsxs as jsxs57 } from "react/jsx-runtime";
|
|
21933
22138
|
var AUTOCOMPLETE_ITEM_HEIGHT = 44;
|
|
21934
22139
|
var Autocomplete = function Autocomplete2({
|
|
21935
22140
|
variant = "default",
|
|
@@ -21959,19 +22164,19 @@ var Autocomplete = function Autocomplete2({
|
|
|
21959
22164
|
disableClear
|
|
21960
22165
|
}, ref) {
|
|
21961
22166
|
const { t } = useTranslation();
|
|
21962
|
-
const anchorRef =
|
|
21963
|
-
const inputRef =
|
|
21964
|
-
const expandSelectButtonRef =
|
|
21965
|
-
const listRef =
|
|
21966
|
-
const virtualListRef =
|
|
21967
|
-
const [isOpen, setOpen] =
|
|
21968
|
-
const [isDirty, setDirty] =
|
|
21969
|
-
const [selectedIndex, setSelectedIndex] =
|
|
21970
|
-
const [placeholder, setPlaceholder] =
|
|
22167
|
+
const anchorRef = React65.useRef(null);
|
|
22168
|
+
const inputRef = React65.useRef(null);
|
|
22169
|
+
const expandSelectButtonRef = React65.useRef(null);
|
|
22170
|
+
const listRef = React65.useRef(null);
|
|
22171
|
+
const virtualListRef = React65.createRef();
|
|
22172
|
+
const [isOpen, setOpen] = React65.useState(false);
|
|
22173
|
+
const [isDirty, setDirty] = React65.useState(false);
|
|
22174
|
+
const [selectedIndex, setSelectedIndex] = React65.useState(void 0);
|
|
22175
|
+
const [placeholder, setPlaceholder] = React65.useState(
|
|
21971
22176
|
textFieldProps?.placeholder || ""
|
|
21972
22177
|
);
|
|
21973
|
-
const _renderLabel =
|
|
21974
|
-
const [inputValue, setInputValue] =
|
|
22178
|
+
const _renderLabel = React65.useCallback((id) => id, []);
|
|
22179
|
+
const [inputValue, setInputValue] = React65.useState(
|
|
21975
22180
|
multiple ? "" : (renderLabel ?? _renderLabel)(value)
|
|
21976
22181
|
);
|
|
21977
22182
|
const dirty = !!inputValue || Array.isArray(value) && value.length > 0;
|
|
@@ -22034,7 +22239,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22034
22239
|
if (allowFreeText && freeOption.id !== "" && !filteredOptions.includes(freeOption) && !options.some((option) => option.id === freeOption.id)) {
|
|
22035
22240
|
filteredOptions.unshift(freeOption);
|
|
22036
22241
|
}
|
|
22037
|
-
|
|
22242
|
+
React65.useEffect(() => {
|
|
22038
22243
|
if (isOpen) {
|
|
22039
22244
|
if (typeof selectedIndex === "number") {
|
|
22040
22245
|
virtualListRef.current?.scrollToItem(selectedIndex);
|
|
@@ -22068,12 +22273,12 @@ var Autocomplete = function Autocomplete2({
|
|
|
22068
22273
|
filteredOptions.length,
|
|
22069
22274
|
virtualListRef
|
|
22070
22275
|
]);
|
|
22071
|
-
|
|
22276
|
+
React65.useEffect(() => {
|
|
22072
22277
|
if (!multiple) {
|
|
22073
22278
|
setInputValue((renderLabel ?? _renderLabel)(value));
|
|
22074
22279
|
}
|
|
22075
22280
|
}, [value]);
|
|
22076
|
-
|
|
22281
|
+
React65.useEffect(() => {
|
|
22077
22282
|
if (!isOpen && !allowFreeText) {
|
|
22078
22283
|
if (multiple) {
|
|
22079
22284
|
setInputValue("");
|
|
@@ -22125,7 +22330,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22125
22330
|
style: style3
|
|
22126
22331
|
}) => {
|
|
22127
22332
|
const option = filteredOptions[index];
|
|
22128
|
-
return /* @__PURE__ */
|
|
22333
|
+
return /* @__PURE__ */ jsx119(
|
|
22129
22334
|
ListItemButton_default,
|
|
22130
22335
|
{
|
|
22131
22336
|
selected: index === selectedIndex,
|
|
@@ -22134,7 +22339,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22134
22339
|
sx: style3,
|
|
22135
22340
|
color: Array.isArray(value) && value.includes(option.id) ? "primary" : void 0,
|
|
22136
22341
|
text: getText(option),
|
|
22137
|
-
endAdornment: multiple && (options.some((elem) => elem.id === option.id) ? Array.isArray(value) && value.includes(option.id) && /* @__PURE__ */
|
|
22342
|
+
endAdornment: multiple && (options.some((elem) => elem.id === option.id) ? Array.isArray(value) && value.includes(option.id) && /* @__PURE__ */ jsx119(Icon_default, { sx: { color: primaryMain }, id: "check" }) : /* @__PURE__ */ jsx119(
|
|
22138
22343
|
Icon_default,
|
|
22139
22344
|
{
|
|
22140
22345
|
id: Array.isArray(value) && value.includes(option.id) ? "close" : "plus"
|
|
@@ -22147,7 +22352,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22147
22352
|
);
|
|
22148
22353
|
};
|
|
22149
22354
|
return /* @__PURE__ */ jsxs57(Fragment25, { children: [
|
|
22150
|
-
/* @__PURE__ */
|
|
22355
|
+
/* @__PURE__ */ jsx119(
|
|
22151
22356
|
DebouncedTextField_default,
|
|
22152
22357
|
{
|
|
22153
22358
|
ref: ref ?? inputRef,
|
|
@@ -22237,7 +22442,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22237
22442
|
alignItems: "center"
|
|
22238
22443
|
},
|
|
22239
22444
|
children: [
|
|
22240
|
-
value.slice(0, limitValueTags || value.length).map((id) => /* @__PURE__ */
|
|
22445
|
+
value.slice(0, limitValueTags || value.length).map((id) => /* @__PURE__ */ jsx119(
|
|
22241
22446
|
Chip_default,
|
|
22242
22447
|
{
|
|
22243
22448
|
label: (renderLabel ?? _renderLabel)(
|
|
@@ -22257,12 +22462,12 @@ var Autocomplete = function Autocomplete2({
|
|
|
22257
22462
|
},
|
|
22258
22463
|
id
|
|
22259
22464
|
)),
|
|
22260
|
-
limitValueTags && value.length - limitValueTags > 0 ? /* @__PURE__ */
|
|
22465
|
+
limitValueTags && value.length - limitValueTags > 0 ? /* @__PURE__ */ jsx119(
|
|
22261
22466
|
Tooltip_default,
|
|
22262
22467
|
{
|
|
22263
22468
|
interactive: true,
|
|
22264
22469
|
variant: "white",
|
|
22265
|
-
title: /* @__PURE__ */
|
|
22470
|
+
title: /* @__PURE__ */ jsx119(
|
|
22266
22471
|
Stack_default,
|
|
22267
22472
|
{
|
|
22268
22473
|
direction: "row",
|
|
@@ -22275,7 +22480,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22275
22480
|
children: value.slice(
|
|
22276
22481
|
limitValueTags,
|
|
22277
22482
|
value.length
|
|
22278
|
-
).map((id) => /* @__PURE__ */
|
|
22483
|
+
).map((id) => /* @__PURE__ */ jsx119(
|
|
22279
22484
|
Chip_default,
|
|
22280
22485
|
{
|
|
22281
22486
|
label: (renderLabel ?? _renderLabel)(id),
|
|
@@ -22295,7 +22500,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22295
22500
|
))
|
|
22296
22501
|
}
|
|
22297
22502
|
),
|
|
22298
|
-
children: /* @__PURE__ */
|
|
22503
|
+
children: /* @__PURE__ */ jsx119(Typography_default, { variant: "body2", children: `+${value.length - limitValueTags}` })
|
|
22299
22504
|
}
|
|
22300
22505
|
) : ""
|
|
22301
22506
|
]
|
|
@@ -22312,7 +22517,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22312
22517
|
spacing: 1,
|
|
22313
22518
|
children: [
|
|
22314
22519
|
textFieldProps?.endAdornment,
|
|
22315
|
-
!disabled && dirty && showClearButton && /* @__PURE__ */
|
|
22520
|
+
!disabled && dirty && showClearButton && /* @__PURE__ */ jsx119(Tooltip_default, { title: t("AUTOCOMPLETE.CLEAR"), children: /* @__PURE__ */ jsx119(
|
|
22316
22521
|
IconButton_default,
|
|
22317
22522
|
{
|
|
22318
22523
|
iconId: "close",
|
|
@@ -22335,7 +22540,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22335
22540
|
"data-test": "clear-autocomplete"
|
|
22336
22541
|
}
|
|
22337
22542
|
) }),
|
|
22338
|
-
!disabled && dirty && showClearButton && /* @__PURE__ */
|
|
22543
|
+
!disabled && dirty && showClearButton && /* @__PURE__ */ jsx119(
|
|
22339
22544
|
Divider_default,
|
|
22340
22545
|
{
|
|
22341
22546
|
variant: "middle",
|
|
@@ -22343,11 +22548,11 @@ var Autocomplete = function Autocomplete2({
|
|
|
22343
22548
|
flexItem: true
|
|
22344
22549
|
}
|
|
22345
22550
|
),
|
|
22346
|
-
!disabled && variant !== "text" && /* @__PURE__ */
|
|
22551
|
+
!disabled && variant !== "text" && /* @__PURE__ */ jsx119(
|
|
22347
22552
|
Tooltip_default,
|
|
22348
22553
|
{
|
|
22349
22554
|
title: isOpen ? t("AUTOCOMPLETE.COLLAPSE") : t("AUTOCOMPLETE.EXPAND"),
|
|
22350
|
-
children: /* @__PURE__ */
|
|
22555
|
+
children: /* @__PURE__ */ jsx119(
|
|
22351
22556
|
IconButton_default,
|
|
22352
22557
|
{
|
|
22353
22558
|
ref: expandSelectButtonRef,
|
|
@@ -22369,7 +22574,7 @@ var Autocomplete = function Autocomplete2({
|
|
|
22369
22574
|
autoComplete: "off"
|
|
22370
22575
|
}
|
|
22371
22576
|
),
|
|
22372
|
-
/* @__PURE__ */
|
|
22577
|
+
/* @__PURE__ */ jsx119(
|
|
22373
22578
|
ClickAwayListener,
|
|
22374
22579
|
{
|
|
22375
22580
|
onClickAway: (event) => {
|
|
@@ -22394,13 +22599,13 @@ var Autocomplete = function Autocomplete2({
|
|
|
22394
22599
|
}
|
|
22395
22600
|
},
|
|
22396
22601
|
mouseEvent: "onMouseDown",
|
|
22397
|
-
children: /* @__PURE__ */
|
|
22602
|
+
children: /* @__PURE__ */ jsx119(
|
|
22398
22603
|
Popper,
|
|
22399
22604
|
{
|
|
22400
22605
|
anchorEl: anchorRef.current,
|
|
22401
22606
|
open: isOpen,
|
|
22402
22607
|
sx: { zIndex: 3e3 },
|
|
22403
|
-
children: /* @__PURE__ */
|
|
22608
|
+
children: /* @__PURE__ */ jsx119(Paper_default, { sx: { boxShadow: shadows[1], borderRadius: "8px" }, children: /* @__PURE__ */ jsxs57(
|
|
22404
22609
|
Box_default2,
|
|
22405
22610
|
{
|
|
22406
22611
|
sx: {
|
|
@@ -22412,22 +22617,22 @@ var Autocomplete = function Autocomplete2({
|
|
|
22412
22617
|
className: "Slim-Vertical-Scroll",
|
|
22413
22618
|
ref: listRef,
|
|
22414
22619
|
children: [
|
|
22415
|
-
isLoading && /* @__PURE__ */
|
|
22620
|
+
isLoading && /* @__PURE__ */ jsx119(
|
|
22416
22621
|
ListItem_default,
|
|
22417
22622
|
{
|
|
22418
22623
|
text: loadingText ?? t("AUTOCOMPLETE.LOADING")
|
|
22419
22624
|
}
|
|
22420
22625
|
),
|
|
22421
|
-
!isLoading && filteredOptions.length === 0 && /* @__PURE__ */
|
|
22626
|
+
!isLoading && filteredOptions.length === 0 && /* @__PURE__ */ jsx119(
|
|
22422
22627
|
ListItem_default,
|
|
22423
22628
|
{
|
|
22424
22629
|
text: noOptionsText ?? t("AUTOCOMPLETE.NO_OPTIONS")
|
|
22425
22630
|
}
|
|
22426
22631
|
),
|
|
22427
|
-
!isLoading && filteredOptions.length > 0 && /* @__PURE__ */
|
|
22632
|
+
!isLoading && filteredOptions.length > 0 && /* @__PURE__ */ jsx119(AutoSizer5, { children: ({
|
|
22428
22633
|
height: height2,
|
|
22429
22634
|
width: width2
|
|
22430
|
-
}) => /* @__PURE__ */
|
|
22635
|
+
}) => /* @__PURE__ */ jsx119(
|
|
22431
22636
|
FixedSizeList3,
|
|
22432
22637
|
{
|
|
22433
22638
|
overscanCount: 3,
|
|
@@ -22450,22 +22655,22 @@ var Autocomplete = function Autocomplete2({
|
|
|
22450
22655
|
)
|
|
22451
22656
|
] });
|
|
22452
22657
|
};
|
|
22453
|
-
var Autocomplete_default =
|
|
22658
|
+
var Autocomplete_default = React65.forwardRef(Autocomplete);
|
|
22454
22659
|
function escapeRegExp2(source) {
|
|
22455
22660
|
return source.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
|
22456
22661
|
}
|
|
22457
|
-
function elementIsDescendantOrEqual(
|
|
22458
|
-
if (!
|
|
22662
|
+
function elementIsDescendantOrEqual(parent2, descendant) {
|
|
22663
|
+
if (!parent2 || !descendant || parent2 === document.body || descendant.parentElement === null) {
|
|
22459
22664
|
return false;
|
|
22460
22665
|
}
|
|
22461
|
-
if (
|
|
22666
|
+
if (parent2 === descendant) {
|
|
22462
22667
|
return true;
|
|
22463
22668
|
}
|
|
22464
|
-
return elementIsDescendantOrEqual(
|
|
22669
|
+
return elementIsDescendantOrEqual(parent2, descendant.parentElement);
|
|
22465
22670
|
}
|
|
22466
22671
|
|
|
22467
22672
|
// src/components/input/TextEditor.tsx
|
|
22468
|
-
import
|
|
22673
|
+
import React68 from "react";
|
|
22469
22674
|
import { Editor } from "@tinymce/tinymce-react";
|
|
22470
22675
|
import "tinymce/tinymce";
|
|
22471
22676
|
import "tinymce/models/dom/model";
|
|
@@ -22486,16 +22691,16 @@ import "tinymce/plugins/wordcount";
|
|
|
22486
22691
|
import "tinymce/plugins/emoticons/js/emojis";
|
|
22487
22692
|
|
|
22488
22693
|
// src/components/input/CodeEditorPopup.tsx
|
|
22489
|
-
import
|
|
22694
|
+
import React67 from "react";
|
|
22490
22695
|
|
|
22491
22696
|
// src/components/input/CodeEditor.tsx
|
|
22492
|
-
import
|
|
22697
|
+
import React66 from "react";
|
|
22493
22698
|
import CodeMirror, {
|
|
22494
22699
|
EditorView
|
|
22495
22700
|
} from "@uiw/react-codemirror";
|
|
22496
22701
|
import { html } from "@codemirror/lang-html";
|
|
22497
22702
|
import { linter, lintGutter } from "@codemirror/lint";
|
|
22498
|
-
import { jsx as
|
|
22703
|
+
import { jsx as jsx120 } from "react/jsx-runtime";
|
|
22499
22704
|
var removeFocusOutline = EditorView.baseTheme({
|
|
22500
22705
|
"&.cm-focused": {
|
|
22501
22706
|
outline: "none"
|
|
@@ -22517,7 +22722,7 @@ var CodeEditor = function CodeEditor2({
|
|
|
22517
22722
|
linter(linterOptions?.source || null, linterOptions?.config),
|
|
22518
22723
|
...extensions
|
|
22519
22724
|
] : extensions;
|
|
22520
|
-
return /* @__PURE__ */
|
|
22725
|
+
return /* @__PURE__ */ jsx120(
|
|
22521
22726
|
CodeMirror,
|
|
22522
22727
|
{
|
|
22523
22728
|
...rest,
|
|
@@ -22532,11 +22737,11 @@ var CodeEditor = function CodeEditor2({
|
|
|
22532
22737
|
}
|
|
22533
22738
|
);
|
|
22534
22739
|
};
|
|
22535
|
-
var CodeEditor_default =
|
|
22740
|
+
var CodeEditor_default = React66.forwardRef(CodeEditor);
|
|
22536
22741
|
|
|
22537
22742
|
// src/components/input/CodeEditorPopup.tsx
|
|
22538
22743
|
import format from "html-format";
|
|
22539
|
-
import { Fragment as Fragment26, jsx as
|
|
22744
|
+
import { Fragment as Fragment26, jsx as jsx121, jsxs as jsxs58 } from "react/jsx-runtime";
|
|
22540
22745
|
var FORMAT_CHARACTERS_LINE = 120;
|
|
22541
22746
|
var FORMAT_NUMBER_SPACES_INDENTATION = 2;
|
|
22542
22747
|
var CodeEditorPopup = ({
|
|
@@ -22552,9 +22757,9 @@ var CodeEditorPopup = ({
|
|
|
22552
22757
|
onCancel
|
|
22553
22758
|
}) => {
|
|
22554
22759
|
const { t } = useTranslation();
|
|
22555
|
-
const [valueModified, setValueModified] =
|
|
22556
|
-
const [hasErrors, setHasErrors] =
|
|
22557
|
-
|
|
22760
|
+
const [valueModified, setValueModified] = React67.useState(value);
|
|
22761
|
+
const [hasErrors, setHasErrors] = React67.useState(false);
|
|
22762
|
+
React67.useEffect(() => {
|
|
22558
22763
|
if (open) {
|
|
22559
22764
|
setValueModified(value);
|
|
22560
22765
|
}
|
|
@@ -22580,7 +22785,7 @@ var CodeEditorPopup = ({
|
|
|
22580
22785
|
FORMAT_CHARACTERS_LINE
|
|
22581
22786
|
);
|
|
22582
22787
|
return /* @__PURE__ */ jsxs58(Fragment26, { children: [
|
|
22583
|
-
readonly && /* @__PURE__ */
|
|
22788
|
+
readonly && /* @__PURE__ */ jsx121(
|
|
22584
22789
|
Dialog_default,
|
|
22585
22790
|
{
|
|
22586
22791
|
open,
|
|
@@ -22599,7 +22804,7 @@ var CodeEditorPopup = ({
|
|
|
22599
22804
|
justifyContent: "space-between",
|
|
22600
22805
|
paddingTop: "20px",
|
|
22601
22806
|
children: [
|
|
22602
|
-
/* @__PURE__ */
|
|
22807
|
+
/* @__PURE__ */ jsx121(
|
|
22603
22808
|
Box_default2,
|
|
22604
22809
|
{
|
|
22605
22810
|
flexGrow: 1,
|
|
@@ -22616,7 +22821,7 @@ var CodeEditorPopup = ({
|
|
|
22616
22821
|
}
|
|
22617
22822
|
},
|
|
22618
22823
|
children: [
|
|
22619
|
-
/* @__PURE__ */
|
|
22824
|
+
/* @__PURE__ */ jsx121(Box_default2, { flexGrow: 1, minHeight: 0, children: /* @__PURE__ */ jsx121(
|
|
22620
22825
|
CodeEditor_default,
|
|
22621
22826
|
{
|
|
22622
22827
|
autoFocus: true,
|
|
@@ -22645,7 +22850,7 @@ var CodeEditorPopup = ({
|
|
|
22645
22850
|
}
|
|
22646
22851
|
) }),
|
|
22647
22852
|
messageNode,
|
|
22648
|
-
hasErrors && /* @__PURE__ */
|
|
22853
|
+
hasErrors && /* @__PURE__ */ jsx121(Alert_default, { severity: "info", children: t(
|
|
22649
22854
|
"TEXT_EDITOR.SOURCE_CODE.VALIDATION_ERRORS_FOUND"
|
|
22650
22855
|
) })
|
|
22651
22856
|
]
|
|
@@ -22653,13 +22858,13 @@ var CodeEditorPopup = ({
|
|
|
22653
22858
|
)
|
|
22654
22859
|
}
|
|
22655
22860
|
),
|
|
22656
|
-
/* @__PURE__ */
|
|
22861
|
+
/* @__PURE__ */ jsx121(
|
|
22657
22862
|
Box_default2,
|
|
22658
22863
|
{
|
|
22659
22864
|
sx: {
|
|
22660
22865
|
padding: "16px 24px 16px 24px"
|
|
22661
22866
|
},
|
|
22662
|
-
children: /* @__PURE__ */
|
|
22867
|
+
children: /* @__PURE__ */ jsx121(
|
|
22663
22868
|
Button_default,
|
|
22664
22869
|
{
|
|
22665
22870
|
text: t(
|
|
@@ -22676,7 +22881,7 @@ var CodeEditorPopup = ({
|
|
|
22676
22881
|
)
|
|
22677
22882
|
}
|
|
22678
22883
|
),
|
|
22679
|
-
!readonly && /* @__PURE__ */
|
|
22884
|
+
!readonly && /* @__PURE__ */ jsx121(
|
|
22680
22885
|
ConfirmationDialog_default,
|
|
22681
22886
|
{
|
|
22682
22887
|
fullScreen: true,
|
|
@@ -22695,7 +22900,7 @@ var CodeEditorPopup = ({
|
|
|
22695
22900
|
}
|
|
22696
22901
|
},
|
|
22697
22902
|
children: [
|
|
22698
|
-
codeEditorSubtitle && /* @__PURE__ */
|
|
22903
|
+
codeEditorSubtitle && /* @__PURE__ */ jsx121(Box_default2, { sx: { marginTop: "4px", marginBottom: "8px" }, children: /* @__PURE__ */ jsx121(
|
|
22699
22904
|
Typography_default,
|
|
22700
22905
|
{
|
|
22701
22906
|
variant: "body2",
|
|
@@ -22703,7 +22908,7 @@ var CodeEditorPopup = ({
|
|
|
22703
22908
|
children: codeEditorSubtitle
|
|
22704
22909
|
}
|
|
22705
22910
|
) }),
|
|
22706
|
-
/* @__PURE__ */
|
|
22911
|
+
/* @__PURE__ */ jsx121(Box_default2, { flexGrow: 1, minHeight: 0, children: /* @__PURE__ */ jsx121(
|
|
22707
22912
|
CodeEditor_default,
|
|
22708
22913
|
{
|
|
22709
22914
|
autoFocus: true,
|
|
@@ -22732,7 +22937,7 @@ var CodeEditorPopup = ({
|
|
|
22732
22937
|
}
|
|
22733
22938
|
) }),
|
|
22734
22939
|
messageNode,
|
|
22735
|
-
hasErrors && /* @__PURE__ */
|
|
22940
|
+
hasErrors && /* @__PURE__ */ jsx121(Alert_default, { severity: "info", children: t(
|
|
22736
22941
|
"TEXT_EDITOR.SOURCE_CODE.VALIDATION_ERRORS_FOUND"
|
|
22737
22942
|
) })
|
|
22738
22943
|
]
|
|
@@ -22745,7 +22950,7 @@ var CodeEditorPopup = ({
|
|
|
22745
22950
|
var CodeEditorPopup_default = CodeEditorPopup;
|
|
22746
22951
|
|
|
22747
22952
|
// src/components/input/TextEditor.tsx
|
|
22748
|
-
import { Fragment as Fragment27, jsx as
|
|
22953
|
+
import { Fragment as Fragment27, jsx as jsx122, jsxs as jsxs59 } from "react/jsx-runtime";
|
|
22749
22954
|
var DEFAULT_TOOLBAR_INSERT_MENU_ITEMS = [
|
|
22750
22955
|
"link",
|
|
22751
22956
|
"image",
|
|
@@ -22784,15 +22989,15 @@ var TextEditor = function TextEditor2({
|
|
|
22784
22989
|
...rest
|
|
22785
22990
|
}) {
|
|
22786
22991
|
const { t } = useTranslation();
|
|
22787
|
-
const editorRef =
|
|
22788
|
-
const [internalValue] =
|
|
22992
|
+
const editorRef = React68.useRef(null);
|
|
22993
|
+
const [internalValue] = React68.useState(
|
|
22789
22994
|
initialValue ?? t("TEXT_EDITOR.INITIAL_VALUE")
|
|
22790
22995
|
);
|
|
22791
|
-
const [contentValue, setContentValue] =
|
|
22792
|
-
const [codeEditorChanges, setCodeEditorChanges] =
|
|
22793
|
-
const [isCodeEditorDirty, setIsCodeEditorDirty] =
|
|
22794
|
-
const [isCodeEditorOpened, setIsCodeEditorOpened] =
|
|
22795
|
-
const [isDirty, setIsDirty] =
|
|
22996
|
+
const [contentValue, setContentValue] = React68.useState("");
|
|
22997
|
+
const [codeEditorChanges, setCodeEditorChanges] = React68.useState("");
|
|
22998
|
+
const [isCodeEditorDirty, setIsCodeEditorDirty] = React68.useState(false);
|
|
22999
|
+
const [isCodeEditorOpened, setIsCodeEditorOpened] = React68.useState(false);
|
|
23000
|
+
const [isDirty, setIsDirty] = React68.useState(false);
|
|
22796
23001
|
const codeEditorButtonIndexToUse = codeEditorButtonIndex ?? customToolbarGroups.insert?.items?.length ?? DEFAULT_TOOLBAR_INSERT_MENU_ITEMS.length;
|
|
22797
23002
|
const defaultToolbarInsertMenuItemsWithCodeEditor = DEFAULT_TOOLBAR_INSERT_MENU_ITEMS.slice();
|
|
22798
23003
|
defaultToolbarInsertMenuItemsWithCodeEditor.splice(
|
|
@@ -22806,12 +23011,12 @@ var TextEditor = function TextEditor2({
|
|
|
22806
23011
|
0,
|
|
22807
23012
|
"cnCodeEditor"
|
|
22808
23013
|
);
|
|
22809
|
-
const onTextChange =
|
|
23014
|
+
const onTextChange = React68.useCallback(() => {
|
|
22810
23015
|
if (editorRef.current) {
|
|
22811
23016
|
onChange(editorRef.current?.getContent());
|
|
22812
23017
|
}
|
|
22813
23018
|
}, [onChange]);
|
|
22814
|
-
const onTextEditorDirty =
|
|
23019
|
+
const onTextEditorDirty = React68.useCallback(
|
|
22815
23020
|
(textEditorDirty) => {
|
|
22816
23021
|
editorRef.current?.setDirty(textEditorDirty);
|
|
22817
23022
|
setIsDirty(textEditorDirty);
|
|
@@ -22824,7 +23029,7 @@ var TextEditor = function TextEditor2({
|
|
|
22824
23029
|
},
|
|
22825
23030
|
[onDirty, onTextChange]
|
|
22826
23031
|
);
|
|
22827
|
-
|
|
23032
|
+
React68.useEffect(() => {
|
|
22828
23033
|
if (resetDirty && editorRef.current?.isDirty()) {
|
|
22829
23034
|
onTextEditorDirty(false);
|
|
22830
23035
|
}
|
|
@@ -22832,7 +23037,7 @@ var TextEditor = function TextEditor2({
|
|
|
22832
23037
|
onResetDirty();
|
|
22833
23038
|
}
|
|
22834
23039
|
}, [onResetDirty, onTextEditorDirty, resetDirty]);
|
|
22835
|
-
|
|
23040
|
+
React68.useEffect(() => {
|
|
22836
23041
|
if (newValue && editorRef.current) {
|
|
22837
23042
|
editorRef.current.setContent(newValue);
|
|
22838
23043
|
if (onNewValueSetter) {
|
|
@@ -22840,7 +23045,7 @@ var TextEditor = function TextEditor2({
|
|
|
22840
23045
|
}
|
|
22841
23046
|
}
|
|
22842
23047
|
}, [newValue, onNewValueSetter]);
|
|
22843
|
-
|
|
23048
|
+
React68.useEffect(() => {
|
|
22844
23049
|
if (forceCloseCodeEditor) {
|
|
22845
23050
|
setIsCodeEditorOpened(false);
|
|
22846
23051
|
if (onForceCloseCodeEditor) {
|
|
@@ -23032,7 +23237,7 @@ var TextEditor = function TextEditor2({
|
|
|
23032
23237
|
}
|
|
23033
23238
|
};
|
|
23034
23239
|
return /* @__PURE__ */ jsxs59(Fragment27, { children: [
|
|
23035
|
-
/* @__PURE__ */
|
|
23240
|
+
/* @__PURE__ */ jsx122(
|
|
23036
23241
|
Editor,
|
|
23037
23242
|
{
|
|
23038
23243
|
id,
|
|
@@ -23052,7 +23257,7 @@ var TextEditor = function TextEditor2({
|
|
|
23052
23257
|
...rest
|
|
23053
23258
|
}
|
|
23054
23259
|
),
|
|
23055
|
-
/* @__PURE__ */
|
|
23260
|
+
/* @__PURE__ */ jsx122(
|
|
23056
23261
|
CodeEditorPopup_default,
|
|
23057
23262
|
{
|
|
23058
23263
|
value: contentValue,
|
|
@@ -23086,66 +23291,6 @@ var TextEditor = function TextEditor2({
|
|
|
23086
23291
|
};
|
|
23087
23292
|
var TextEditor_default = TextEditor;
|
|
23088
23293
|
|
|
23089
|
-
// src/components/input/TimeField.tsx
|
|
23090
|
-
import * as React68 from "react";
|
|
23091
|
-
import { TimeField as MuiTimeField } from "@mui/x-date-pickers";
|
|
23092
|
-
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
|
|
23093
|
-
import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
|
|
23094
|
-
import { tz as tz6 } from "moment-timezone";
|
|
23095
|
-
import { jsx as jsx122 } from "react/jsx-runtime";
|
|
23096
|
-
var ExtendedTextField = ({
|
|
23097
|
-
inputProps,
|
|
23098
|
-
ownerState,
|
|
23099
|
-
InputProps,
|
|
23100
|
-
error,
|
|
23101
|
-
...rest
|
|
23102
|
-
}) => /* @__PURE__ */ jsx122(TextField_default, { ...inputProps, ...rest });
|
|
23103
|
-
var TimeField = function TimeField2({
|
|
23104
|
-
onChange,
|
|
23105
|
-
value,
|
|
23106
|
-
showMinutes = true,
|
|
23107
|
-
showSeconds = false,
|
|
23108
|
-
...rest
|
|
23109
|
-
}) {
|
|
23110
|
-
const { locale, timezone } = React68.useContext(IntlContext);
|
|
23111
|
-
const hour12 = React68.useMemo(() => {
|
|
23112
|
-
const resolvedOptions = Intl.DateTimeFormat(locale, {
|
|
23113
|
-
hour: "numeric"
|
|
23114
|
-
}).resolvedOptions();
|
|
23115
|
-
return resolvedOptions.hour12;
|
|
23116
|
-
}, [locale]);
|
|
23117
|
-
const format2 = `${hour12 ? "hh" : "HH"}${showSeconds || showMinutes ? ":mm" : ""}${showSeconds ? ":ss" : ""}${hour12 ? " a" : ""}`;
|
|
23118
|
-
const momentValue = React68.useMemo(() => {
|
|
23119
|
-
if (value && !isNaN(value.getTime())) {
|
|
23120
|
-
return tz6(value, timezone);
|
|
23121
|
-
}
|
|
23122
|
-
return null;
|
|
23123
|
-
}, [timezone, value]);
|
|
23124
|
-
const _onChange = React68.useCallback(
|
|
23125
|
-
(momentValue2, context) => {
|
|
23126
|
-
const value2 = momentValue2 && momentValue2.isValid() ? momentValue2.toDate() : null;
|
|
23127
|
-
onChange && onChange(value2, context);
|
|
23128
|
-
},
|
|
23129
|
-
[onChange]
|
|
23130
|
-
);
|
|
23131
|
-
return /* @__PURE__ */ jsx122(LocalizationProvider, { dateAdapter: AdapterMoment, children: /* @__PURE__ */ jsx122(
|
|
23132
|
-
MuiTimeField,
|
|
23133
|
-
{
|
|
23134
|
-
onChange: _onChange,
|
|
23135
|
-
value: momentValue,
|
|
23136
|
-
format: format2,
|
|
23137
|
-
slots: {
|
|
23138
|
-
textField: ExtendedTextField
|
|
23139
|
-
},
|
|
23140
|
-
slotProps: {
|
|
23141
|
-
textField: rest
|
|
23142
|
-
},
|
|
23143
|
-
enableAccessibleFieldDOMStructure: false
|
|
23144
|
-
}
|
|
23145
|
-
) });
|
|
23146
|
-
};
|
|
23147
|
-
var TimeField_default = TimeField;
|
|
23148
|
-
|
|
23149
23294
|
// src/components/input/PhoneField.tsx
|
|
23150
23295
|
import * as React69 from "react";
|
|
23151
23296
|
import { Fragment as Fragment28, jsx as jsx123, jsxs as jsxs60 } from "react/jsx-runtime";
|
|
@@ -24186,7 +24331,7 @@ var CircularProgress_default = CircularProgress;
|
|
|
24186
24331
|
|
|
24187
24332
|
// src/components/progress/DonutProgress.tsx
|
|
24188
24333
|
import Box5 from "@mui/material/Box";
|
|
24189
|
-
import { Stack as
|
|
24334
|
+
import { Stack as Stack11 } from "@mui/material";
|
|
24190
24335
|
import { jsx as jsx133, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
24191
24336
|
var CIRCULAR_PROGRESS_PERCENTAGE = 85;
|
|
24192
24337
|
var variants2 = {
|
|
@@ -24223,7 +24368,7 @@ var DonutProgress = ({
|
|
|
24223
24368
|
labelChip,
|
|
24224
24369
|
showPercentageSymbol
|
|
24225
24370
|
}) => {
|
|
24226
|
-
const getPercentageWithSymbol = () => /* @__PURE__ */ jsxs68(
|
|
24371
|
+
const getPercentageWithSymbol = () => /* @__PURE__ */ jsxs68(Stack11, { direction: "row", alignItems: "center", position: "relative", children: [
|
|
24227
24372
|
/* @__PURE__ */ jsx133(Typography_default, { variant: "h6", component: "div", color: grey800, children: label }),
|
|
24228
24373
|
/* @__PURE__ */ jsx133(
|
|
24229
24374
|
Typography_default,
|
|
@@ -25054,16 +25199,346 @@ var HorizontalScrollable = ({
|
|
|
25054
25199
|
};
|
|
25055
25200
|
var HorizontalScrollable_default = HorizontalScrollable;
|
|
25056
25201
|
|
|
25202
|
+
// src/components/scrollable/Carousel.tsx
|
|
25203
|
+
import * as React81 from "react";
|
|
25204
|
+
import { jsx as jsx144, jsxs as jsxs75 } from "react/jsx-runtime";
|
|
25205
|
+
var buttonStyles = {
|
|
25206
|
+
color: grey800,
|
|
25207
|
+
position: "absolute",
|
|
25208
|
+
top: "50%",
|
|
25209
|
+
transform: "translateY(-50%)",
|
|
25210
|
+
zIndex: 1,
|
|
25211
|
+
backgroundColor: white,
|
|
25212
|
+
border: `1px solid ${grey200}`,
|
|
25213
|
+
cursor: "pointer",
|
|
25214
|
+
transition: "opacity 0.3s ease"
|
|
25215
|
+
};
|
|
25216
|
+
function Carousel({
|
|
25217
|
+
items,
|
|
25218
|
+
renderItem,
|
|
25219
|
+
gap: gap2 = 8,
|
|
25220
|
+
padding: padding2 = 8
|
|
25221
|
+
}) {
|
|
25222
|
+
const rootRef = React81.useRef(null);
|
|
25223
|
+
const containerRef = React81.useRef(null);
|
|
25224
|
+
const previousClientWidth = React81.useRef(null);
|
|
25225
|
+
const isScrolling = React81.useRef(false);
|
|
25226
|
+
const [isLeftArrowHidden, setLeftArrowHidden] = React81.useState(true);
|
|
25227
|
+
const [isRightArrowHidden, setRightArrowHidden] = React81.useState(true);
|
|
25228
|
+
const [paddingElement, setPaddingElement] = React81.useState();
|
|
25229
|
+
const [visibleCount, setVisibleCount] = React81.useState();
|
|
25230
|
+
const showedElementsRef = React81.useRef();
|
|
25231
|
+
const [showedElements, setShowedElements] = React81.useState();
|
|
25232
|
+
const updateArrows = React81.useCallback(() => {
|
|
25233
|
+
if (!showedElementsRef.current) {
|
|
25234
|
+
return;
|
|
25235
|
+
}
|
|
25236
|
+
setLeftArrowHidden(showedElementsRef.current.start === 0);
|
|
25237
|
+
setRightArrowHidden(showedElementsRef.current.end === items.length - 1);
|
|
25238
|
+
}, [items.length]);
|
|
25239
|
+
const getUsableWidth = React81.useCallback(
|
|
25240
|
+
(el) => {
|
|
25241
|
+
let current = el;
|
|
25242
|
+
while (current) {
|
|
25243
|
+
const w = current.clientWidth;
|
|
25244
|
+
if (w > 0 && w < window.innerWidth) {
|
|
25245
|
+
return w;
|
|
25246
|
+
}
|
|
25247
|
+
current = current.parentElement;
|
|
25248
|
+
}
|
|
25249
|
+
return el?.clientWidth ?? 0;
|
|
25250
|
+
},
|
|
25251
|
+
[]
|
|
25252
|
+
);
|
|
25253
|
+
const resetCarousel = React81.useCallback(
|
|
25254
|
+
(root, container) => {
|
|
25255
|
+
root.style.width = "";
|
|
25256
|
+
showedElementsRef.current = void 0;
|
|
25257
|
+
setShowedElements(void 0);
|
|
25258
|
+
container.scrollTo({ left: 0, behavior: "instant" });
|
|
25259
|
+
},
|
|
25260
|
+
[]
|
|
25261
|
+
);
|
|
25262
|
+
const setMeasures = React81.useCallback(
|
|
25263
|
+
(root, container, nextElementsIndex) => {
|
|
25264
|
+
const children = Array.from(container.children);
|
|
25265
|
+
if (children.length === 0) {
|
|
25266
|
+
setVisibleCount(0);
|
|
25267
|
+
return;
|
|
25268
|
+
}
|
|
25269
|
+
const containerWidth = getUsableWidth(root);
|
|
25270
|
+
const initialHorizontalPadding = padding2 * 2;
|
|
25271
|
+
let count = 0;
|
|
25272
|
+
let accumulatedWidth = initialHorizontalPadding;
|
|
25273
|
+
let nextChild = children[nextElementsIndex.start];
|
|
25274
|
+
while (nextChild && accumulatedWidth + nextChild.offsetWidth <= containerWidth) {
|
|
25275
|
+
accumulatedWidth += nextChild.offsetWidth + (count > 0 ? gap2 : 0);
|
|
25276
|
+
count++;
|
|
25277
|
+
nextChild = children[nextElementsIndex.start + count];
|
|
25278
|
+
}
|
|
25279
|
+
const addGap = nextElementsIndex.start + count < items.length;
|
|
25280
|
+
const diffWidth = containerWidth - accumulatedWidth + initialHorizontalPadding + (addGap ? gap2 : 0);
|
|
25281
|
+
setPaddingElement(`${diffWidth / 2}px`);
|
|
25282
|
+
setVisibleCount(count);
|
|
25283
|
+
showedElementsRef.current = nextElementsIndex;
|
|
25284
|
+
setShowedElements(nextElementsIndex);
|
|
25285
|
+
return {
|
|
25286
|
+
childrenWidth: accumulatedWidth
|
|
25287
|
+
};
|
|
25288
|
+
},
|
|
25289
|
+
[gap2, getUsableWidth, items.length, padding2]
|
|
25290
|
+
);
|
|
25291
|
+
const updateVisibleCount = React81.useCallback(() => {
|
|
25292
|
+
const root = rootRef.current;
|
|
25293
|
+
const container = containerRef.current;
|
|
25294
|
+
if (!container || !parent) {
|
|
25295
|
+
return;
|
|
25296
|
+
}
|
|
25297
|
+
if (root) {
|
|
25298
|
+
resetCarousel(root, container);
|
|
25299
|
+
}
|
|
25300
|
+
const children = Array.from(container.children);
|
|
25301
|
+
if (children.length === 0) {
|
|
25302
|
+
setVisibleCount(0);
|
|
25303
|
+
return;
|
|
25304
|
+
}
|
|
25305
|
+
const containerWidth = getUsableWidth(root);
|
|
25306
|
+
const initialHorizontalPadding = padding2 * 2;
|
|
25307
|
+
let count = 0;
|
|
25308
|
+
let accumulatedWidth = initialHorizontalPadding;
|
|
25309
|
+
for (const child of children) {
|
|
25310
|
+
if (accumulatedWidth + child.offsetWidth <= containerWidth) {
|
|
25311
|
+
accumulatedWidth += child.offsetWidth + (count > 0 ? gap2 : 0);
|
|
25312
|
+
count++;
|
|
25313
|
+
} else {
|
|
25314
|
+
break;
|
|
25315
|
+
}
|
|
25316
|
+
}
|
|
25317
|
+
const addGap = count < items.length;
|
|
25318
|
+
const diffWidth = containerWidth - accumulatedWidth + initialHorizontalPadding + (addGap ? gap2 : 0);
|
|
25319
|
+
const newPaddingSize = `${diffWidth / 2}px`;
|
|
25320
|
+
setPaddingElement(newPaddingSize);
|
|
25321
|
+
setVisibleCount(count);
|
|
25322
|
+
const newVisible = { start: 0, end: count - 1 };
|
|
25323
|
+
showedElementsRef.current = newVisible;
|
|
25324
|
+
setShowedElements(newVisible);
|
|
25325
|
+
if (root) {
|
|
25326
|
+
root.style.width = `${containerWidth}px`;
|
|
25327
|
+
}
|
|
25328
|
+
updateArrows();
|
|
25329
|
+
}, [
|
|
25330
|
+
getUsableWidth,
|
|
25331
|
+
padding2,
|
|
25332
|
+
items.length,
|
|
25333
|
+
gap2,
|
|
25334
|
+
updateArrows,
|
|
25335
|
+
resetCarousel
|
|
25336
|
+
]);
|
|
25337
|
+
const getInitialWidth = React81.useCallback(
|
|
25338
|
+
(el) => {
|
|
25339
|
+
let current = el;
|
|
25340
|
+
let width2 = 0;
|
|
25341
|
+
while (current) {
|
|
25342
|
+
const w = current.clientWidth;
|
|
25343
|
+
if (w && w > window.innerWidth) {
|
|
25344
|
+
return width2;
|
|
25345
|
+
}
|
|
25346
|
+
if (w > 0 && w <= window.innerWidth) {
|
|
25347
|
+
width2 = w;
|
|
25348
|
+
}
|
|
25349
|
+
current = current.parentElement;
|
|
25350
|
+
}
|
|
25351
|
+
return width2 > 0 ? width2 : el?.clientWidth ?? 0;
|
|
25352
|
+
},
|
|
25353
|
+
[]
|
|
25354
|
+
);
|
|
25355
|
+
const resizeObserverCallback = React81.useCallback(() => {
|
|
25356
|
+
if (!rootRef.current || !containerRef.current) {
|
|
25357
|
+
return;
|
|
25358
|
+
}
|
|
25359
|
+
const newClientWidth = getInitialWidth(rootRef.current);
|
|
25360
|
+
if (previousClientWidth.current && previousClientWidth.current === newClientWidth) {
|
|
25361
|
+
return;
|
|
25362
|
+
}
|
|
25363
|
+
previousClientWidth.current = newClientWidth;
|
|
25364
|
+
updateVisibleCount();
|
|
25365
|
+
}, [getInitialWidth, updateVisibleCount]);
|
|
25366
|
+
React81.useEffect(() => {
|
|
25367
|
+
const container = containerRef.current;
|
|
25368
|
+
if (!container) {
|
|
25369
|
+
return;
|
|
25370
|
+
}
|
|
25371
|
+
window.addEventListener("resize", resizeObserverCallback);
|
|
25372
|
+
const resizeObserver = new ResizeObserver(resizeObserverCallback);
|
|
25373
|
+
resizeObserver.observe(container);
|
|
25374
|
+
const mutationObserver = new MutationObserver(resizeObserverCallback);
|
|
25375
|
+
mutationObserver.observe(container, { childList: true, subtree: true });
|
|
25376
|
+
return () => {
|
|
25377
|
+
window.removeEventListener("resize", resizeObserverCallback);
|
|
25378
|
+
resizeObserver.disconnect();
|
|
25379
|
+
mutationObserver.disconnect();
|
|
25380
|
+
};
|
|
25381
|
+
}, [resizeObserverCallback]);
|
|
25382
|
+
const waitForSmoothScrollEnd = (container, onEnd) => {
|
|
25383
|
+
let prev = container.scrollLeft;
|
|
25384
|
+
let idleFrames = 0;
|
|
25385
|
+
const check = () => {
|
|
25386
|
+
const current = container.scrollLeft;
|
|
25387
|
+
const isMoving = current !== prev;
|
|
25388
|
+
prev = current;
|
|
25389
|
+
if (isMoving) {
|
|
25390
|
+
idleFrames = 0;
|
|
25391
|
+
requestAnimationFrame(check);
|
|
25392
|
+
return;
|
|
25393
|
+
}
|
|
25394
|
+
if (idleFrames < 5) {
|
|
25395
|
+
idleFrames++;
|
|
25396
|
+
requestAnimationFrame(check);
|
|
25397
|
+
return;
|
|
25398
|
+
}
|
|
25399
|
+
onEnd();
|
|
25400
|
+
};
|
|
25401
|
+
requestAnimationFrame(check);
|
|
25402
|
+
};
|
|
25403
|
+
const scrollHorizontal = ({
|
|
25404
|
+
elementsIndex
|
|
25405
|
+
}, direction) => {
|
|
25406
|
+
const container = containerRef.current;
|
|
25407
|
+
const root = rootRef.current;
|
|
25408
|
+
if (!container || !root) {
|
|
25409
|
+
return;
|
|
25410
|
+
}
|
|
25411
|
+
const newMeasures = setMeasures(root, container, elementsIndex);
|
|
25412
|
+
if (newMeasures) {
|
|
25413
|
+
const scrollLeft = (elementsIndex.end < items.length - 1 ? container.scrollLeft + container.clientWidth : container.scrollWidth - newMeasures.childrenWidth) + padding2 * 2;
|
|
25414
|
+
const targetLeft = direction === "right" ? scrollLeft : Math.max(
|
|
25415
|
+
container.scrollLeft - newMeasures.childrenWidth,
|
|
25416
|
+
0
|
|
25417
|
+
);
|
|
25418
|
+
waitForSmoothScrollEnd(container, () => {
|
|
25419
|
+
isScrolling.current = false;
|
|
25420
|
+
updateArrows();
|
|
25421
|
+
});
|
|
25422
|
+
showedElementsRef.current = elementsIndex;
|
|
25423
|
+
setShowedElements(elementsIndex);
|
|
25424
|
+
container.scrollTo({ left: targetLeft, behavior: "smooth" });
|
|
25425
|
+
}
|
|
25426
|
+
};
|
|
25427
|
+
const scrollToNext = (direction) => {
|
|
25428
|
+
if (!containerRef.current || !showedElementsRef.current || isScrolling.current) {
|
|
25429
|
+
return;
|
|
25430
|
+
}
|
|
25431
|
+
isScrolling.current = true;
|
|
25432
|
+
const children = Array.from(
|
|
25433
|
+
containerRef.current.children
|
|
25434
|
+
);
|
|
25435
|
+
const visibleCountDefined = visibleCount ?? 0;
|
|
25436
|
+
let scrollData;
|
|
25437
|
+
if (direction === "right") {
|
|
25438
|
+
const firstHidden = showedElementsRef.current.end + 1;
|
|
25439
|
+
const rightChildren = children.slice(
|
|
25440
|
+
firstHidden,
|
|
25441
|
+
firstHidden + visibleCountDefined
|
|
25442
|
+
);
|
|
25443
|
+
scrollData = {
|
|
25444
|
+
elementsIndex: {
|
|
25445
|
+
start: showedElementsRef.current.start + rightChildren.length,
|
|
25446
|
+
end: showedElementsRef.current.end + rightChildren.length
|
|
25447
|
+
}
|
|
25448
|
+
};
|
|
25449
|
+
} else {
|
|
25450
|
+
const rest = showedElementsRef.current.start - visibleCountDefined;
|
|
25451
|
+
const toMove = rest > 0 ? visibleCountDefined : visibleCountDefined + rest;
|
|
25452
|
+
const start = showedElementsRef.current.start - toMove;
|
|
25453
|
+
const end = showedElementsRef.current.end - toMove;
|
|
25454
|
+
scrollData = {
|
|
25455
|
+
elementsIndex: { start, end }
|
|
25456
|
+
};
|
|
25457
|
+
}
|
|
25458
|
+
scrollHorizontal(scrollData, direction);
|
|
25459
|
+
};
|
|
25460
|
+
return /* @__PURE__ */ jsx144(Box_default2, { ref: rootRef, width: "100%", children: /* @__PURE__ */ jsxs75(
|
|
25461
|
+
Box_default2,
|
|
25462
|
+
{
|
|
25463
|
+
sx: {
|
|
25464
|
+
position: "relative",
|
|
25465
|
+
alignSelf: "center",
|
|
25466
|
+
padding: `${padding2}px`,
|
|
25467
|
+
...paddingElement && {
|
|
25468
|
+
padding: `${padding2}px ${paddingElement}`
|
|
25469
|
+
}
|
|
25470
|
+
},
|
|
25471
|
+
children: [
|
|
25472
|
+
/* @__PURE__ */ jsx144(
|
|
25473
|
+
IconButton_default,
|
|
25474
|
+
{
|
|
25475
|
+
iconId: "chevron-left",
|
|
25476
|
+
size: "M",
|
|
25477
|
+
sx: {
|
|
25478
|
+
...buttonStyles,
|
|
25479
|
+
left: `${-16 + (paddingElement ? parseInt(paddingElement, 10) : 0)}px`,
|
|
25480
|
+
opacity: isLeftArrowHidden ? 0 : 1
|
|
25481
|
+
},
|
|
25482
|
+
onClick: () => scrollToNext("left")
|
|
25483
|
+
}
|
|
25484
|
+
),
|
|
25485
|
+
/* @__PURE__ */ jsx144(
|
|
25486
|
+
Box_default2,
|
|
25487
|
+
{
|
|
25488
|
+
ref: containerRef,
|
|
25489
|
+
sx: {
|
|
25490
|
+
width: "100%",
|
|
25491
|
+
overflowX: "hidden",
|
|
25492
|
+
display: "flex",
|
|
25493
|
+
scrollBehavior: "smooth",
|
|
25494
|
+
scrollbarWidth: "none",
|
|
25495
|
+
"::-webkit-scrollbar": { display: "none" },
|
|
25496
|
+
gap: `${gap2}px`
|
|
25497
|
+
},
|
|
25498
|
+
children: items.map((item, index) => /* @__PURE__ */ jsx144(
|
|
25499
|
+
Box_default2,
|
|
25500
|
+
{
|
|
25501
|
+
sx: {
|
|
25502
|
+
...showedElements && (index < showedElements.start || index > showedElements.end) && {
|
|
25503
|
+
opacity: 0
|
|
25504
|
+
},
|
|
25505
|
+
transition: "opacity 0.5s ease"
|
|
25506
|
+
},
|
|
25507
|
+
children: renderItem(item, index)
|
|
25508
|
+
},
|
|
25509
|
+
index
|
|
25510
|
+
))
|
|
25511
|
+
}
|
|
25512
|
+
),
|
|
25513
|
+
/* @__PURE__ */ jsx144(
|
|
25514
|
+
IconButton_default,
|
|
25515
|
+
{
|
|
25516
|
+
iconId: "chevron-right",
|
|
25517
|
+
size: "M",
|
|
25518
|
+
sx: {
|
|
25519
|
+
...buttonStyles,
|
|
25520
|
+
right: `${-16 + (paddingElement ? parseInt(paddingElement, 10) : 0)}px`,
|
|
25521
|
+
opacity: isRightArrowHidden ? 0 : 1
|
|
25522
|
+
},
|
|
25523
|
+
onClick: () => scrollToNext("right")
|
|
25524
|
+
}
|
|
25525
|
+
)
|
|
25526
|
+
]
|
|
25527
|
+
}
|
|
25528
|
+
) });
|
|
25529
|
+
}
|
|
25530
|
+
var Carousel_default = Carousel;
|
|
25531
|
+
|
|
25057
25532
|
// src/components/snackbar/SnackbarProvider.tsx
|
|
25058
25533
|
import {
|
|
25059
25534
|
SnackbarProvider as NotistackSnackbarProvider
|
|
25060
25535
|
} from "notistack";
|
|
25061
|
-
import { jsx as
|
|
25536
|
+
import { jsx as jsx145 } from "react/jsx-runtime";
|
|
25062
25537
|
var SnackbarProvider = ({
|
|
25063
25538
|
children,
|
|
25064
25539
|
maxSnack = 3,
|
|
25065
25540
|
domRoot
|
|
25066
|
-
}) => /* @__PURE__ */
|
|
25541
|
+
}) => /* @__PURE__ */ jsx145(
|
|
25067
25542
|
NotistackSnackbarProvider,
|
|
25068
25543
|
{
|
|
25069
25544
|
maxSnack,
|
|
@@ -25081,10 +25556,10 @@ import {
|
|
|
25081
25556
|
} from "notistack";
|
|
25082
25557
|
|
|
25083
25558
|
// src/components/snackbar/Snackbar.tsx
|
|
25084
|
-
import * as
|
|
25559
|
+
import * as React82 from "react";
|
|
25085
25560
|
import { SnackbarContent } from "notistack";
|
|
25086
25561
|
import { Typography as Typography4 } from "@mui/material";
|
|
25087
|
-
import { jsx as
|
|
25562
|
+
import { jsx as jsx146, jsxs as jsxs76 } from "react/jsx-runtime";
|
|
25088
25563
|
var sizeStyles5 = {
|
|
25089
25564
|
M: {
|
|
25090
25565
|
width: "344px",
|
|
@@ -25109,7 +25584,7 @@ var iconColors = {
|
|
|
25109
25584
|
error: error300,
|
|
25110
25585
|
warning: complementary300
|
|
25111
25586
|
};
|
|
25112
|
-
var Snackbar =
|
|
25587
|
+
var Snackbar = React82.forwardRef(
|
|
25113
25588
|
function Snackbar2({
|
|
25114
25589
|
severity = "info",
|
|
25115
25590
|
message,
|
|
@@ -25121,13 +25596,13 @@ var Snackbar = React81.forwardRef(
|
|
|
25121
25596
|
identifierKey: key,
|
|
25122
25597
|
dataTestKey
|
|
25123
25598
|
}, ref) {
|
|
25124
|
-
const actionClickHandler =
|
|
25599
|
+
const actionClickHandler = React82.useCallback(() => {
|
|
25125
25600
|
onActionClick && onActionClick(key);
|
|
25126
25601
|
}, [onActionClick, key]);
|
|
25127
|
-
const closeClickHandler =
|
|
25602
|
+
const closeClickHandler = React82.useCallback(() => {
|
|
25128
25603
|
onCloseClick && onCloseClick(key);
|
|
25129
25604
|
}, [onCloseClick, key]);
|
|
25130
|
-
return /* @__PURE__ */
|
|
25605
|
+
return /* @__PURE__ */ jsx146(
|
|
25131
25606
|
SnackbarContent,
|
|
25132
25607
|
{
|
|
25133
25608
|
ref,
|
|
@@ -25145,14 +25620,14 @@ var Snackbar = React81.forwardRef(
|
|
|
25145
25620
|
...dataTestKey && {
|
|
25146
25621
|
"data-test": dataTestKey
|
|
25147
25622
|
},
|
|
25148
|
-
children: /* @__PURE__ */
|
|
25623
|
+
children: /* @__PURE__ */ jsxs76(
|
|
25149
25624
|
Stack_default,
|
|
25150
25625
|
{
|
|
25151
25626
|
direction: "row",
|
|
25152
25627
|
spacing: 2,
|
|
25153
25628
|
sx: { width: "100%", alignItems: "center" },
|
|
25154
25629
|
children: [
|
|
25155
|
-
withIcon && /* @__PURE__ */
|
|
25630
|
+
withIcon && /* @__PURE__ */ jsx146(
|
|
25156
25631
|
Box_default2,
|
|
25157
25632
|
{
|
|
25158
25633
|
sx: {
|
|
@@ -25160,10 +25635,10 @@ var Snackbar = React81.forwardRef(
|
|
|
25160
25635
|
flexShrink: 0,
|
|
25161
25636
|
color: iconColors[severity]
|
|
25162
25637
|
},
|
|
25163
|
-
children: /* @__PURE__ */
|
|
25638
|
+
children: /* @__PURE__ */ jsx146(Icon_default, { id: severityIcons[severity] })
|
|
25164
25639
|
}
|
|
25165
25640
|
),
|
|
25166
|
-
/* @__PURE__ */
|
|
25641
|
+
/* @__PURE__ */ jsx146(
|
|
25167
25642
|
Typography4,
|
|
25168
25643
|
{
|
|
25169
25644
|
variant: "body2",
|
|
@@ -25171,7 +25646,7 @@ var Snackbar = React81.forwardRef(
|
|
|
25171
25646
|
children: message
|
|
25172
25647
|
}
|
|
25173
25648
|
),
|
|
25174
|
-
actionText && /* @__PURE__ */
|
|
25649
|
+
actionText && /* @__PURE__ */ jsx146(Box_default2, { sx: { flexGrow: 0, flexShrink: 0 }, children: /* @__PURE__ */ jsx146(
|
|
25175
25650
|
Button_default,
|
|
25176
25651
|
{
|
|
25177
25652
|
sx: {
|
|
@@ -25186,7 +25661,7 @@ var Snackbar = React81.forwardRef(
|
|
|
25186
25661
|
onClick: actionClickHandler
|
|
25187
25662
|
}
|
|
25188
25663
|
) }),
|
|
25189
|
-
/* @__PURE__ */
|
|
25664
|
+
/* @__PURE__ */ jsx146(Box_default2, { sx: { flexGrow: 0, flexShrink: 0 }, children: /* @__PURE__ */ jsx146(
|
|
25190
25665
|
IconButton_default,
|
|
25191
25666
|
{
|
|
25192
25667
|
iconId: "close",
|
|
@@ -25211,7 +25686,7 @@ var Snackbar_default = Snackbar;
|
|
|
25211
25686
|
|
|
25212
25687
|
// src/components/snackbar/enqueueSnackbar.tsx
|
|
25213
25688
|
import { closeSnackbar as closeSnackbar2 } from "notistack";
|
|
25214
|
-
import { jsx as
|
|
25689
|
+
import { jsx as jsx147 } from "react/jsx-runtime";
|
|
25215
25690
|
var enqueueSnackbar = (message, options = {}) => {
|
|
25216
25691
|
const {
|
|
25217
25692
|
persist,
|
|
@@ -25227,7 +25702,7 @@ var enqueueSnackbar = (message, options = {}) => {
|
|
|
25227
25702
|
autoHideDuration: autoHideDurationMs ?? 1e4,
|
|
25228
25703
|
persist: persist ?? false,
|
|
25229
25704
|
content(key, message2) {
|
|
25230
|
-
return /* @__PURE__ */
|
|
25705
|
+
return /* @__PURE__ */ jsx147(
|
|
25231
25706
|
Snackbar_default,
|
|
25232
25707
|
{
|
|
25233
25708
|
identifierKey: key,
|
|
@@ -25244,7 +25719,7 @@ var enqueueSnackbar = (message, options = {}) => {
|
|
|
25244
25719
|
|
|
25245
25720
|
// src/components/tab/TabButton.tsx
|
|
25246
25721
|
import MuiTab from "@mui/material/Tab";
|
|
25247
|
-
import { jsx as
|
|
25722
|
+
import { jsx as jsx148 } from "react/jsx-runtime";
|
|
25248
25723
|
var TabButton = ({
|
|
25249
25724
|
children,
|
|
25250
25725
|
disabled = false,
|
|
@@ -25253,10 +25728,10 @@ var TabButton = ({
|
|
|
25253
25728
|
dataTestId,
|
|
25254
25729
|
disableUppercase = false,
|
|
25255
25730
|
...rest
|
|
25256
|
-
}) => /* @__PURE__ */
|
|
25731
|
+
}) => /* @__PURE__ */ jsx148(
|
|
25257
25732
|
MuiTab,
|
|
25258
25733
|
{
|
|
25259
|
-
label: /* @__PURE__ */
|
|
25734
|
+
label: /* @__PURE__ */ jsx148(
|
|
25260
25735
|
"div",
|
|
25261
25736
|
{
|
|
25262
25737
|
style: {
|
|
@@ -25288,13 +25763,13 @@ var TabButton = ({
|
|
|
25288
25763
|
var TabButton_default = TabButton;
|
|
25289
25764
|
|
|
25290
25765
|
// src/components/tab/Tabs.tsx
|
|
25291
|
-
import * as
|
|
25766
|
+
import * as React84 from "react";
|
|
25292
25767
|
import MuiTabs from "@mui/material/Tabs";
|
|
25293
25768
|
|
|
25294
25769
|
// src/components/layout/SwipeableViews.tsx
|
|
25295
|
-
import * as
|
|
25296
|
-
import { useEffect as
|
|
25297
|
-
import { jsx as
|
|
25770
|
+
import * as React83 from "react";
|
|
25771
|
+
import { useEffect as useEffect22, useRef as useRef23, useState as useState32 } from "react";
|
|
25772
|
+
import { jsx as jsx149 } from "react/jsx-runtime";
|
|
25298
25773
|
var styles = {
|
|
25299
25774
|
container: {
|
|
25300
25775
|
maxHeight: "100%",
|
|
@@ -25324,13 +25799,14 @@ function SwipeableViews({
|
|
|
25324
25799
|
slideStyle,
|
|
25325
25800
|
onChangeIndex,
|
|
25326
25801
|
children,
|
|
25802
|
+
disableScroll = false,
|
|
25327
25803
|
...rootProps
|
|
25328
25804
|
}) {
|
|
25329
|
-
const containerRef =
|
|
25330
|
-
const scrollTimeout =
|
|
25331
|
-
const scrollingMethod =
|
|
25332
|
-
const [previousIndex, setPreviousIndex] =
|
|
25333
|
-
|
|
25805
|
+
const containerRef = useRef23(null);
|
|
25806
|
+
const scrollTimeout = useRef23();
|
|
25807
|
+
const scrollingMethod = useRef23("none");
|
|
25808
|
+
const [previousIndex, setPreviousIndex] = useState32(index);
|
|
25809
|
+
useEffect22(() => {
|
|
25334
25810
|
if (containerRef.current) {
|
|
25335
25811
|
if (scrollingMethod.current === "manual") {
|
|
25336
25812
|
scrollingMethod.current = "none";
|
|
@@ -25365,7 +25841,8 @@ function SwipeableViews({
|
|
|
25365
25841
|
return () => cancelAnimationFrame(animationFrame);
|
|
25366
25842
|
}
|
|
25367
25843
|
}, [index]);
|
|
25368
|
-
|
|
25844
|
+
const hasShowTab = (childIndex) => childIndex === index || childIndex === previousIndex;
|
|
25845
|
+
return /* @__PURE__ */ jsx149(
|
|
25369
25846
|
"div",
|
|
25370
25847
|
{
|
|
25371
25848
|
...rootProps,
|
|
@@ -25388,20 +25865,34 @@ function SwipeableViews({
|
|
|
25388
25865
|
);
|
|
25389
25866
|
}, 100);
|
|
25390
25867
|
},
|
|
25391
|
-
children:
|
|
25392
|
-
|
|
25393
|
-
{
|
|
25394
|
-
|
|
25395
|
-
style: Object.assign({}, styles.slide, slideStyle),
|
|
25396
|
-
children: childIndex === index || childIndex === previousIndex ? child : null
|
|
25868
|
+
children: React83.Children.map(children, (child, childIndex) => {
|
|
25869
|
+
let mountedChild = false;
|
|
25870
|
+
if (React83.isValidElement(child)) {
|
|
25871
|
+
mountedChild = !!child.props.keepMounted;
|
|
25397
25872
|
}
|
|
25398
|
-
|
|
25873
|
+
return /* @__PURE__ */ jsx149(
|
|
25874
|
+
"div",
|
|
25875
|
+
{
|
|
25876
|
+
style: Object.assign(
|
|
25877
|
+
{
|
|
25878
|
+
...!hasShowTab(childIndex) && mountedChild && { display: "none" }
|
|
25879
|
+
},
|
|
25880
|
+
styles.slide,
|
|
25881
|
+
slideStyle
|
|
25882
|
+
),
|
|
25883
|
+
...!disableScroll && {
|
|
25884
|
+
className: "Slim-Vertical-Scroll"
|
|
25885
|
+
},
|
|
25886
|
+
children: hasShowTab(childIndex) || mountedChild ? child : null
|
|
25887
|
+
}
|
|
25888
|
+
);
|
|
25889
|
+
})
|
|
25399
25890
|
}
|
|
25400
25891
|
);
|
|
25401
25892
|
}
|
|
25402
25893
|
|
|
25403
25894
|
// src/components/tab/Tabs.tsx
|
|
25404
|
-
import { jsx as
|
|
25895
|
+
import { jsx as jsx150, jsxs as jsxs77 } from "react/jsx-runtime";
|
|
25405
25896
|
var Tabs = ({
|
|
25406
25897
|
tabButtons,
|
|
25407
25898
|
children,
|
|
@@ -25410,9 +25901,10 @@ var Tabs = ({
|
|
|
25410
25901
|
variant = "scrollable",
|
|
25411
25902
|
fullHeight = false,
|
|
25412
25903
|
contained = false,
|
|
25413
|
-
scrollbarGutter
|
|
25904
|
+
scrollbarGutter,
|
|
25905
|
+
disableContentScroll = false
|
|
25414
25906
|
}) => {
|
|
25415
|
-
const [value, setValue] =
|
|
25907
|
+
const [value, setValue] = React84.useState(0);
|
|
25416
25908
|
const handleChangeIndex = (index) => {
|
|
25417
25909
|
onChangeTab?.(index);
|
|
25418
25910
|
setValue(index);
|
|
@@ -25423,7 +25915,7 @@ var Tabs = ({
|
|
|
25423
25915
|
bottom: 0,
|
|
25424
25916
|
borderRadius: "8px 8px 0 0"
|
|
25425
25917
|
};
|
|
25426
|
-
return /* @__PURE__ */
|
|
25918
|
+
return /* @__PURE__ */ jsxs77(
|
|
25427
25919
|
Box_default2,
|
|
25428
25920
|
{
|
|
25429
25921
|
sx: {
|
|
@@ -25437,7 +25929,7 @@ var Tabs = ({
|
|
|
25437
25929
|
}
|
|
25438
25930
|
},
|
|
25439
25931
|
children: [
|
|
25440
|
-
/* @__PURE__ */
|
|
25932
|
+
/* @__PURE__ */ jsx150(
|
|
25441
25933
|
MuiTabs,
|
|
25442
25934
|
{
|
|
25443
25935
|
value: currentTabIndex ?? value,
|
|
@@ -25463,7 +25955,7 @@ var Tabs = ({
|
|
|
25463
25955
|
children: tabButtons
|
|
25464
25956
|
}
|
|
25465
25957
|
),
|
|
25466
|
-
/* @__PURE__ */
|
|
25958
|
+
/* @__PURE__ */ jsx150(
|
|
25467
25959
|
Box_default2,
|
|
25468
25960
|
{
|
|
25469
25961
|
sx: {
|
|
@@ -25472,10 +25964,11 @@ var Tabs = ({
|
|
|
25472
25964
|
height: "100%"
|
|
25473
25965
|
}
|
|
25474
25966
|
},
|
|
25475
|
-
children: /* @__PURE__ */
|
|
25967
|
+
children: /* @__PURE__ */ jsx150(
|
|
25476
25968
|
SwipeableViews,
|
|
25477
25969
|
{
|
|
25478
25970
|
index: currentTabIndex ?? value,
|
|
25971
|
+
disableScroll: disableContentScroll,
|
|
25479
25972
|
onChangeIndex: handleChangeIndex,
|
|
25480
25973
|
style: {
|
|
25481
25974
|
...fullHeight && {
|
|
@@ -25500,8 +25993,8 @@ var Tabs = ({
|
|
|
25500
25993
|
var Tabs_default = Tabs;
|
|
25501
25994
|
|
|
25502
25995
|
// src/components/tab/TabContent.tsx
|
|
25503
|
-
import { jsx as
|
|
25504
|
-
var TabContent = ({ children }) => /* @__PURE__ */
|
|
25996
|
+
import { jsx as jsx151 } from "react/jsx-runtime";
|
|
25997
|
+
var TabContent = ({ children }) => /* @__PURE__ */ jsx151(
|
|
25505
25998
|
Box_default2,
|
|
25506
25999
|
{
|
|
25507
26000
|
sx: {
|
|
@@ -25518,8 +26011,8 @@ import {
|
|
|
25518
26011
|
TableRow as MuiTableRow,
|
|
25519
26012
|
TableCell as MuiTableCell
|
|
25520
26013
|
} from "@mui/material";
|
|
25521
|
-
import { jsx as
|
|
25522
|
-
var TableDivider = () => /* @__PURE__ */
|
|
26014
|
+
import { jsx as jsx152 } from "react/jsx-runtime";
|
|
26015
|
+
var TableDivider = () => /* @__PURE__ */ jsx152(MuiTableRow, { children: /* @__PURE__ */ jsx152(
|
|
25523
26016
|
MuiTableCell,
|
|
25524
26017
|
{
|
|
25525
26018
|
colSpan: 1e3,
|
|
@@ -25532,8 +26025,8 @@ var TableDivider_default = TableDivider;
|
|
|
25532
26025
|
import {
|
|
25533
26026
|
TableSortLabel as MuiTableSortLabel
|
|
25534
26027
|
} from "@mui/material";
|
|
25535
|
-
import { jsx as
|
|
25536
|
-
var TableSortLabel = ({ children, ...rest }) => /* @__PURE__ */
|
|
26028
|
+
import { jsx as jsx153 } from "react/jsx-runtime";
|
|
26029
|
+
var TableSortLabel = ({ children, ...rest }) => /* @__PURE__ */ jsx153(MuiTableSortLabel, { ...rest, children });
|
|
25537
26030
|
var TableSortLabel_default = TableSortLabel;
|
|
25538
26031
|
|
|
25539
26032
|
// src/components/table/Table.tsx
|
|
@@ -25541,21 +26034,21 @@ import {
|
|
|
25541
26034
|
TableContainer,
|
|
25542
26035
|
Table as MuiTable
|
|
25543
26036
|
} from "@mui/material";
|
|
25544
|
-
import { jsx as
|
|
25545
|
-
var Table = ({ children, sx, className }) => /* @__PURE__ */
|
|
26037
|
+
import { jsx as jsx154 } from "react/jsx-runtime";
|
|
26038
|
+
var Table = ({ children, sx, className }) => /* @__PURE__ */ jsx154(TableContainer, { className: "Slim-Horizontal-Scroll", children: /* @__PURE__ */ jsx154(MuiTable, { sx: { backgroundColor: white, ...sx }, className, children }) });
|
|
25546
26039
|
var Table_default = Table;
|
|
25547
26040
|
|
|
25548
26041
|
// src/components/table/TableBody.tsx
|
|
25549
26042
|
import { TableBody as MuiTableBody } from "@mui/material";
|
|
25550
|
-
import { jsx as
|
|
25551
|
-
var TableBody = ({ children }) => /* @__PURE__ */
|
|
26043
|
+
import { jsx as jsx155 } from "react/jsx-runtime";
|
|
26044
|
+
var TableBody = ({ children }) => /* @__PURE__ */ jsx155(MuiTableBody, { children });
|
|
25552
26045
|
var TableBody_default = TableBody;
|
|
25553
26046
|
|
|
25554
26047
|
// src/components/table/TableCell.tsx
|
|
25555
26048
|
import {
|
|
25556
26049
|
TableCell as MuiTableCell2
|
|
25557
26050
|
} from "@mui/material";
|
|
25558
|
-
import { jsx as
|
|
26051
|
+
import { jsx as jsx156 } from "react/jsx-runtime";
|
|
25559
26052
|
var TableCell = ({
|
|
25560
26053
|
children,
|
|
25561
26054
|
size = "M",
|
|
@@ -25566,7 +26059,7 @@ var TableCell = ({
|
|
|
25566
26059
|
onClick,
|
|
25567
26060
|
noBorder = false,
|
|
25568
26061
|
...rest
|
|
25569
|
-
}) => /* @__PURE__ */
|
|
26062
|
+
}) => /* @__PURE__ */ jsx156(
|
|
25570
26063
|
MuiTableCell2,
|
|
25571
26064
|
{
|
|
25572
26065
|
...rest,
|
|
@@ -25590,12 +26083,12 @@ var TableCell = ({
|
|
|
25590
26083
|
var TableCell_default = TableCell;
|
|
25591
26084
|
|
|
25592
26085
|
// src/components/table/TableCellCopy.tsx
|
|
25593
|
-
import * as
|
|
25594
|
-
import { jsx as
|
|
26086
|
+
import * as React85 from "react";
|
|
26087
|
+
import { jsx as jsx157 } from "react/jsx-runtime";
|
|
25595
26088
|
var TableCellCopy = ({ text, textToCopy, ...rest }) => {
|
|
25596
26089
|
const { t } = useTranslation();
|
|
25597
|
-
const [isCopied, setIsCopied] =
|
|
25598
|
-
const [showIcon, setShowIcon] =
|
|
26090
|
+
const [isCopied, setIsCopied] = React85.useState(false);
|
|
26091
|
+
const [showIcon, setShowIcon] = React85.useState(false);
|
|
25599
26092
|
const manageButtonClicked = () => {
|
|
25600
26093
|
void navigator.clipboard.writeText(textToCopy ?? text);
|
|
25601
26094
|
if (isCopied) {
|
|
@@ -25609,7 +26102,7 @@ var TableCellCopy = ({ text, textToCopy, ...rest }) => {
|
|
|
25609
26102
|
const getIconId = () => !isCopied ? "content-copy" : "check";
|
|
25610
26103
|
const iconHiddenClass = "icon-hidden";
|
|
25611
26104
|
const iconCopiedClass = "icon-copied";
|
|
25612
|
-
return /* @__PURE__ */
|
|
26105
|
+
return /* @__PURE__ */ jsx157(TableCell_default, { ...rest, sx: { padding: 0 }, children: /* @__PURE__ */ jsx157(
|
|
25613
26106
|
Stack_default,
|
|
25614
26107
|
{
|
|
25615
26108
|
direction: "row",
|
|
@@ -25618,7 +26111,7 @@ var TableCellCopy = ({ text, textToCopy, ...rest }) => {
|
|
|
25618
26111
|
onMouseEnter: () => setShowIcon(true),
|
|
25619
26112
|
onMouseLeave: () => setShowIcon(false),
|
|
25620
26113
|
onClick: manageButtonClicked,
|
|
25621
|
-
children: /* @__PURE__ */
|
|
26114
|
+
children: /* @__PURE__ */ jsx157(Tooltip_default, { title: t(!isCopied ? "COPY" : "COPIED"), children: /* @__PURE__ */ jsx157(
|
|
25622
26115
|
Button_default,
|
|
25623
26116
|
{
|
|
25624
26117
|
className: isCopied ? iconCopiedClass : !showIcon ? iconHiddenClass : "",
|
|
@@ -25648,21 +26141,21 @@ var TableCellCopy_default = TableCellCopy;
|
|
|
25648
26141
|
|
|
25649
26142
|
// src/components/table/TableHead.tsx
|
|
25650
26143
|
import { TableHead as MuiTableHead } from "@mui/material";
|
|
25651
|
-
import { jsx as
|
|
25652
|
-
var TableHead = ({ children }) => /* @__PURE__ */
|
|
26144
|
+
import { jsx as jsx158 } from "react/jsx-runtime";
|
|
26145
|
+
var TableHead = ({ children }) => /* @__PURE__ */ jsx158(MuiTableHead, { children });
|
|
25653
26146
|
var TableHead_default = TableHead;
|
|
25654
26147
|
|
|
25655
26148
|
// src/components/table/TableRow.tsx
|
|
25656
26149
|
import {
|
|
25657
26150
|
TableRow as MuiTableRow2
|
|
25658
26151
|
} from "@mui/material";
|
|
25659
|
-
import { jsx as
|
|
26152
|
+
import { jsx as jsx159 } from "react/jsx-runtime";
|
|
25660
26153
|
var TableRow = ({
|
|
25661
26154
|
children,
|
|
25662
26155
|
isFollowedByNestedTable = false,
|
|
25663
26156
|
fadeInLeftAnimation = false,
|
|
25664
26157
|
sx
|
|
25665
|
-
}) => /* @__PURE__ */
|
|
26158
|
+
}) => /* @__PURE__ */ jsx159(
|
|
25666
26159
|
MuiTableRow2,
|
|
25667
26160
|
{
|
|
25668
26161
|
className: `${isFollowedByNestedTable ? "Followed-By-Nested-Table" : ""} ${fadeInLeftAnimation ? "animated fadeInLeft" : ""}`,
|
|
@@ -25674,14 +26167,14 @@ var TableRow_default = TableRow;
|
|
|
25674
26167
|
|
|
25675
26168
|
// src/components/table/NestedTable.tsx
|
|
25676
26169
|
import { Collapse as Collapse7 } from "@mui/material";
|
|
25677
|
-
import { jsx as
|
|
26170
|
+
import { jsx as jsx160 } from "react/jsx-runtime";
|
|
25678
26171
|
var NestedTable = ({
|
|
25679
26172
|
colSpan,
|
|
25680
26173
|
children,
|
|
25681
26174
|
className = "",
|
|
25682
26175
|
sx,
|
|
25683
26176
|
isVisible = true
|
|
25684
|
-
}) => /* @__PURE__ */
|
|
26177
|
+
}) => /* @__PURE__ */ jsx160(TableRow_default, { children: /* @__PURE__ */ jsx160(
|
|
25685
26178
|
TableCell_default,
|
|
25686
26179
|
{
|
|
25687
26180
|
colSpan,
|
|
@@ -25690,14 +26183,14 @@ var NestedTable = ({
|
|
|
25690
26183
|
height: "auto",
|
|
25691
26184
|
...!isVisible && { borderBottom: "none" }
|
|
25692
26185
|
},
|
|
25693
|
-
children: /* @__PURE__ */
|
|
26186
|
+
children: /* @__PURE__ */ jsx160(Collapse7, { in: isVisible, children: /* @__PURE__ */ jsx160(Box_default2, { sx: { padding: "16px", backgroundColor: grey100 }, children: /* @__PURE__ */ jsx160(Paper_default, { children: /* @__PURE__ */ jsx160(Table_default, { sx, className: `Nested-Table ${className}`, children }) }) }) })
|
|
25694
26187
|
}
|
|
25695
26188
|
) });
|
|
25696
26189
|
var NestedTable_default = NestedTable;
|
|
25697
26190
|
|
|
25698
26191
|
// src/components/toolbar/ToolbarBreadcrumb.tsx
|
|
25699
|
-
import { jsx as
|
|
25700
|
-
var ToolbarBreadcrumb = ({ parts = [] }) => /* @__PURE__ */
|
|
26192
|
+
import { jsx as jsx161 } from "react/jsx-runtime";
|
|
26193
|
+
var ToolbarBreadcrumb = ({ parts = [] }) => /* @__PURE__ */ jsx161(
|
|
25701
26194
|
Stack_default,
|
|
25702
26195
|
{
|
|
25703
26196
|
direction: "row",
|
|
@@ -25707,7 +26200,7 @@ var ToolbarBreadcrumb = ({ parts = [] }) => /* @__PURE__ */ jsx160(
|
|
|
25707
26200
|
(previous, current, index) => [
|
|
25708
26201
|
...previous,
|
|
25709
26202
|
...index > 0 ? [
|
|
25710
|
-
/* @__PURE__ */
|
|
26203
|
+
/* @__PURE__ */ jsx161(
|
|
25711
26204
|
Typography_default,
|
|
25712
26205
|
{
|
|
25713
26206
|
color: grey500,
|
|
@@ -25730,10 +26223,10 @@ var ToolbarBreadcrumb_default = ToolbarBreadcrumb;
|
|
|
25730
26223
|
|
|
25731
26224
|
// src/components/toolbar/ToolbarBreadcrumbButton.tsx
|
|
25732
26225
|
import { ButtonBase as ButtonBase5 } from "@mui/material";
|
|
25733
|
-
import * as
|
|
25734
|
-
import { jsx as
|
|
25735
|
-
var ToolbarBreadcrumbButton =
|
|
25736
|
-
return /* @__PURE__ */
|
|
26226
|
+
import * as React86 from "react";
|
|
26227
|
+
import { jsx as jsx162 } from "react/jsx-runtime";
|
|
26228
|
+
var ToolbarBreadcrumbButton = React86.forwardRef(function ToolbarBreadcrumbButton2({ text, className, ...rest }, ref) {
|
|
26229
|
+
return /* @__PURE__ */ jsx162(
|
|
25737
26230
|
ButtonBase5,
|
|
25738
26231
|
{
|
|
25739
26232
|
className: `Cn-ToolbarBreadcrumbButton ${className}`,
|
|
@@ -25752,14 +26245,14 @@ var ToolbarBreadcrumbButton = React85.forwardRef(function ToolbarBreadcrumbButto
|
|
|
25752
26245
|
}
|
|
25753
26246
|
},
|
|
25754
26247
|
...rest,
|
|
25755
|
-
children: /* @__PURE__ */
|
|
26248
|
+
children: /* @__PURE__ */ jsx162(Typography_default, { color: "inherit", component: "div", variant: "h6", noWrap: true, children: text })
|
|
25756
26249
|
}
|
|
25757
26250
|
);
|
|
25758
26251
|
});
|
|
25759
26252
|
var ToolbarBreadcrumbButton_default = ToolbarBreadcrumbButton;
|
|
25760
26253
|
|
|
25761
26254
|
// src/components/toolbar/Toolbar.tsx
|
|
25762
|
-
import { jsx as
|
|
26255
|
+
import { jsx as jsx163, jsxs as jsxs78 } from "react/jsx-runtime";
|
|
25763
26256
|
var Toolbar = ({
|
|
25764
26257
|
children,
|
|
25765
26258
|
rightActions,
|
|
@@ -25768,7 +26261,7 @@ var Toolbar = ({
|
|
|
25768
26261
|
sx,
|
|
25769
26262
|
dataTestId,
|
|
25770
26263
|
onClickToolbar
|
|
25771
|
-
}) => /* @__PURE__ */
|
|
26264
|
+
}) => /* @__PURE__ */ jsxs78(
|
|
25772
26265
|
Box_default2,
|
|
25773
26266
|
{
|
|
25774
26267
|
className: `Cn-Toolbar ${className}`,
|
|
@@ -25788,7 +26281,7 @@ var Toolbar = ({
|
|
|
25788
26281
|
onClick: onClickToolbar,
|
|
25789
26282
|
"data-testid": dataTestId,
|
|
25790
26283
|
children: [
|
|
25791
|
-
/* @__PURE__ */
|
|
26284
|
+
/* @__PURE__ */ jsxs78(
|
|
25792
26285
|
Box_default2,
|
|
25793
26286
|
{
|
|
25794
26287
|
sx: {
|
|
@@ -25800,7 +26293,7 @@ var Toolbar = ({
|
|
|
25800
26293
|
width: "100%"
|
|
25801
26294
|
},
|
|
25802
26295
|
children: [
|
|
25803
|
-
leftActions && /* @__PURE__ */
|
|
26296
|
+
leftActions && /* @__PURE__ */ jsx163(
|
|
25804
26297
|
Box_default2,
|
|
25805
26298
|
{
|
|
25806
26299
|
className: `Cn-Toolbar-left`,
|
|
@@ -25810,7 +26303,7 @@ var Toolbar = ({
|
|
|
25810
26303
|
children: leftActions
|
|
25811
26304
|
}
|
|
25812
26305
|
),
|
|
25813
|
-
/* @__PURE__ */
|
|
26306
|
+
/* @__PURE__ */ jsx163(
|
|
25814
26307
|
Box_default2,
|
|
25815
26308
|
{
|
|
25816
26309
|
className: `Cn-Toolbar-children`,
|
|
@@ -25825,7 +26318,7 @@ var Toolbar = ({
|
|
|
25825
26318
|
]
|
|
25826
26319
|
}
|
|
25827
26320
|
),
|
|
25828
|
-
rightActions && /* @__PURE__ */
|
|
26321
|
+
rightActions && /* @__PURE__ */ jsx163(
|
|
25829
26322
|
Box_default2,
|
|
25830
26323
|
{
|
|
25831
26324
|
className: `Cn-Toolbar-right`,
|
|
@@ -25844,24 +26337,24 @@ var Toolbar = ({
|
|
|
25844
26337
|
var Toolbar_default = Toolbar;
|
|
25845
26338
|
|
|
25846
26339
|
// src/components/toolbar/ToolbarTitle.tsx
|
|
25847
|
-
import * as
|
|
25848
|
-
import { useState as
|
|
25849
|
-
import { jsx as
|
|
25850
|
-
var ToolbarTitle =
|
|
26340
|
+
import * as React87 from "react";
|
|
26341
|
+
import { useState as useState35 } from "react";
|
|
26342
|
+
import { jsx as jsx164, jsxs as jsxs79 } from "react/jsx-runtime";
|
|
26343
|
+
var ToolbarTitle = React87.forwardRef(function ToolbarTitle2({
|
|
25851
26344
|
title,
|
|
25852
26345
|
align = "left",
|
|
25853
26346
|
className,
|
|
25854
26347
|
hoverActions,
|
|
25855
26348
|
color: color2 = grey900
|
|
25856
26349
|
}, ref) {
|
|
25857
|
-
const textElementRef =
|
|
25858
|
-
const [showHoverActions, setShowHoverActions] =
|
|
25859
|
-
return /* @__PURE__ */
|
|
26350
|
+
const textElementRef = React87.useRef(null);
|
|
26351
|
+
const [showHoverActions, setShowHoverActions] = useState35(false);
|
|
26352
|
+
return /* @__PURE__ */ jsx164(Box_default2, { sx: { maxWidth: "100%" }, children: /* @__PURE__ */ jsx164(
|
|
25860
26353
|
TextEllipsisTooltip_default,
|
|
25861
26354
|
{
|
|
25862
26355
|
title: title ?? "\xA0",
|
|
25863
26356
|
textEllipsableElement: textElementRef,
|
|
25864
|
-
children: /* @__PURE__ */
|
|
26357
|
+
children: /* @__PURE__ */ jsxs79(
|
|
25865
26358
|
Typography_default,
|
|
25866
26359
|
{
|
|
25867
26360
|
color: color2,
|
|
@@ -25879,7 +26372,7 @@ var ToolbarTitle = React86.forwardRef(function ToolbarTitle2({
|
|
|
25879
26372
|
},
|
|
25880
26373
|
children: [
|
|
25881
26374
|
title || "\xA0",
|
|
25882
|
-
hoverActions && showHoverActions && /* @__PURE__ */
|
|
26375
|
+
hoverActions && showHoverActions && /* @__PURE__ */ jsx164(
|
|
25883
26376
|
Box_default2,
|
|
25884
26377
|
{
|
|
25885
26378
|
sx: {
|
|
@@ -25908,13 +26401,13 @@ var Slide_default = Slide;
|
|
|
25908
26401
|
|
|
25909
26402
|
// src/components/widget/WidgetLegendItem.tsx
|
|
25910
26403
|
import { ButtonBase as ButtonBase6 } from "@mui/material";
|
|
25911
|
-
import { jsx as
|
|
26404
|
+
import { jsx as jsx165, jsxs as jsxs80 } from "react/jsx-runtime";
|
|
25912
26405
|
var WidgetLegendItem = ({
|
|
25913
26406
|
groupLabel,
|
|
25914
26407
|
legendDirection = "column",
|
|
25915
26408
|
items = [],
|
|
25916
26409
|
onClick
|
|
25917
|
-
}) => /* @__PURE__ */
|
|
26410
|
+
}) => /* @__PURE__ */ jsx165(
|
|
25918
26411
|
ButtonBase6,
|
|
25919
26412
|
{
|
|
25920
26413
|
tabIndex: onClick ? 0 : -1,
|
|
@@ -25928,7 +26421,7 @@ var WidgetLegendItem = ({
|
|
|
25928
26421
|
p: "2px 12px",
|
|
25929
26422
|
cursor: onClick ? "pointer" : "default"
|
|
25930
26423
|
},
|
|
25931
|
-
children: /* @__PURE__ */
|
|
26424
|
+
children: /* @__PURE__ */ jsxs80(
|
|
25932
26425
|
Box_default2,
|
|
25933
26426
|
{
|
|
25934
26427
|
sx: {
|
|
@@ -25940,7 +26433,7 @@ var WidgetLegendItem = ({
|
|
|
25940
26433
|
color: grey800
|
|
25941
26434
|
},
|
|
25942
26435
|
children: [
|
|
25943
|
-
groupLabel && /* @__PURE__ */
|
|
26436
|
+
groupLabel && /* @__PURE__ */ jsx165(
|
|
25944
26437
|
Typography_default,
|
|
25945
26438
|
{
|
|
25946
26439
|
variant: "overline",
|
|
@@ -25962,7 +26455,7 @@ var WidgetLegendItem = ({
|
|
|
25962
26455
|
style: style3
|
|
25963
26456
|
}, i) => {
|
|
25964
26457
|
const incrementLabelIconId = incrementLabelType && incrementLabelStyles[incrementLabelType].icon;
|
|
25965
|
-
return /* @__PURE__ */
|
|
26458
|
+
return /* @__PURE__ */ jsxs80(
|
|
25966
26459
|
Box_default2,
|
|
25967
26460
|
{
|
|
25968
26461
|
sx: {
|
|
@@ -25972,7 +26465,7 @@ var WidgetLegendItem = ({
|
|
|
25972
26465
|
paddingRight: legendDirection === "row" ? "12px" : "inherit"
|
|
25973
26466
|
},
|
|
25974
26467
|
children: [
|
|
25975
|
-
iconColor && /* @__PURE__ */
|
|
26468
|
+
iconColor && /* @__PURE__ */ jsx165(
|
|
25976
26469
|
Icon_default,
|
|
25977
26470
|
{
|
|
25978
26471
|
id: iconId,
|
|
@@ -25983,7 +26476,7 @@ var WidgetLegendItem = ({
|
|
|
25983
26476
|
size: iconSize
|
|
25984
26477
|
}
|
|
25985
26478
|
),
|
|
25986
|
-
label && /* @__PURE__ */
|
|
26479
|
+
label && /* @__PURE__ */ jsx165(
|
|
25987
26480
|
Typography_default,
|
|
25988
26481
|
{
|
|
25989
26482
|
variant: "caption",
|
|
@@ -25992,7 +26485,7 @@ var WidgetLegendItem = ({
|
|
|
25992
26485
|
children: label
|
|
25993
26486
|
}
|
|
25994
26487
|
),
|
|
25995
|
-
value && /* @__PURE__ */
|
|
26488
|
+
value && /* @__PURE__ */ jsx165(
|
|
25996
26489
|
Typography_default,
|
|
25997
26490
|
{
|
|
25998
26491
|
sx: style3,
|
|
@@ -26001,7 +26494,7 @@ var WidgetLegendItem = ({
|
|
|
26001
26494
|
children: value
|
|
26002
26495
|
}
|
|
26003
26496
|
),
|
|
26004
|
-
incrementLabelValue && /* @__PURE__ */
|
|
26497
|
+
incrementLabelValue && /* @__PURE__ */ jsx165(
|
|
26005
26498
|
IncrementLabel_default,
|
|
26006
26499
|
{
|
|
26007
26500
|
label: incrementLabelValue,
|
|
@@ -26027,8 +26520,8 @@ var WidgetLegendItem_default = WidgetLegendItem;
|
|
|
26027
26520
|
|
|
26028
26521
|
// src/components/widget/Widget.tsx
|
|
26029
26522
|
import MuiCard2 from "@mui/material/Card";
|
|
26030
|
-
import { jsx as
|
|
26031
|
-
var Widget = ({ children }) => /* @__PURE__ */
|
|
26523
|
+
import { jsx as jsx166 } from "react/jsx-runtime";
|
|
26524
|
+
var Widget = ({ children }) => /* @__PURE__ */ jsx166(
|
|
26032
26525
|
MuiCard2,
|
|
26033
26526
|
{
|
|
26034
26527
|
variant: "elevation",
|
|
@@ -26052,8 +26545,8 @@ var Widget = ({ children }) => /* @__PURE__ */ jsx165(
|
|
|
26052
26545
|
var Widget_default = Widget;
|
|
26053
26546
|
|
|
26054
26547
|
// src/components/widget/WidgetActions.tsx
|
|
26055
|
-
import { jsx as
|
|
26056
|
-
var WidgetActions = ({ children }) => /* @__PURE__ */
|
|
26548
|
+
import { jsx as jsx167 } from "react/jsx-runtime";
|
|
26549
|
+
var WidgetActions = ({ children }) => /* @__PURE__ */ jsx167(
|
|
26057
26550
|
Box_default2,
|
|
26058
26551
|
{
|
|
26059
26552
|
sx: {
|
|
@@ -26067,8 +26560,8 @@ var WidgetActions = ({ children }) => /* @__PURE__ */ jsx166(
|
|
|
26067
26560
|
var WidgetActions_default = WidgetActions;
|
|
26068
26561
|
|
|
26069
26562
|
// src/components/widget/WidgetTitle.tsx
|
|
26070
|
-
import { jsx as
|
|
26071
|
-
var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE__ */
|
|
26563
|
+
import { jsx as jsx168 } from "react/jsx-runtime";
|
|
26564
|
+
var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE__ */ jsx168(
|
|
26072
26565
|
Box_default2,
|
|
26073
26566
|
{
|
|
26074
26567
|
sx: {
|
|
@@ -26078,7 +26571,7 @@ var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE
|
|
|
26078
26571
|
maxWidth: "100%",
|
|
26079
26572
|
...sx
|
|
26080
26573
|
},
|
|
26081
|
-
children: /* @__PURE__ */
|
|
26574
|
+
children: /* @__PURE__ */ jsx168(
|
|
26082
26575
|
Typography_default,
|
|
26083
26576
|
{
|
|
26084
26577
|
variant: "subtitle2",
|
|
@@ -26092,12 +26585,12 @@ var WidgetTitle = ({ children, sx, multiline = false }) => children ? /* @__PURE
|
|
|
26092
26585
|
}
|
|
26093
26586
|
)
|
|
26094
26587
|
}
|
|
26095
|
-
) : /* @__PURE__ */
|
|
26588
|
+
) : /* @__PURE__ */ jsx168("span", {});
|
|
26096
26589
|
var WidgetTitle_default = WidgetTitle;
|
|
26097
26590
|
|
|
26098
26591
|
// src/components/window/MinimizableWindow.tsx
|
|
26099
|
-
import * as
|
|
26100
|
-
import { Fragment as Fragment35, jsx as
|
|
26592
|
+
import * as React88 from "react";
|
|
26593
|
+
import { Fragment as Fragment35, jsx as jsx169, jsxs as jsxs81 } from "react/jsx-runtime";
|
|
26101
26594
|
var sizes6 = {
|
|
26102
26595
|
M: 400,
|
|
26103
26596
|
L: 500,
|
|
@@ -26122,7 +26615,7 @@ var iconButtonsStyles = {
|
|
|
26122
26615
|
backgroundColor: "rgba(255, 255, 255, 0.2)"
|
|
26123
26616
|
}
|
|
26124
26617
|
};
|
|
26125
|
-
var MinimizableWindow =
|
|
26618
|
+
var MinimizableWindow = React88.forwardRef(function MinimizableWindow2({
|
|
26126
26619
|
children,
|
|
26127
26620
|
title,
|
|
26128
26621
|
size = "M",
|
|
@@ -26139,17 +26632,17 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26139
26632
|
onBack
|
|
26140
26633
|
}, ref) {
|
|
26141
26634
|
const { t } = useTranslation();
|
|
26142
|
-
const overlayRef =
|
|
26143
|
-
const windowRef =
|
|
26144
|
-
const headerRef =
|
|
26145
|
-
const [isDraggingState, setIsDraggingState] =
|
|
26146
|
-
const diffRef =
|
|
26147
|
-
|
|
26635
|
+
const overlayRef = React88.useRef(null);
|
|
26636
|
+
const windowRef = React88.useRef(null);
|
|
26637
|
+
const headerRef = React88.useRef(null);
|
|
26638
|
+
const [isDraggingState, setIsDraggingState] = React88.useState(false);
|
|
26639
|
+
const diffRef = React88.useRef({ x: 0, y: 0 });
|
|
26640
|
+
React88.useImperativeHandle(ref, () => ({
|
|
26148
26641
|
window: windowRef.current,
|
|
26149
26642
|
header: headerRef.current,
|
|
26150
26643
|
overlay: overlayRef.current
|
|
26151
26644
|
}));
|
|
26152
|
-
|
|
26645
|
+
React88.useEffect(() => {
|
|
26153
26646
|
if (open) {
|
|
26154
26647
|
overlayRef.current?.style.removeProperty("transform");
|
|
26155
26648
|
overlayRef.current?.style.removeProperty("opacity");
|
|
@@ -26211,8 +26704,8 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26211
26704
|
}
|
|
26212
26705
|
}, 750);
|
|
26213
26706
|
};
|
|
26214
|
-
return /* @__PURE__ */
|
|
26215
|
-
isDraggingState && /* @__PURE__ */
|
|
26707
|
+
return /* @__PURE__ */ jsxs81(Fragment35, { children: [
|
|
26708
|
+
isDraggingState && /* @__PURE__ */ jsx169(
|
|
26216
26709
|
Box_default2,
|
|
26217
26710
|
{
|
|
26218
26711
|
sx: {
|
|
@@ -26228,7 +26721,7 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26228
26721
|
onMouseMove: (ev) => handleMouseMove(ev)
|
|
26229
26722
|
}
|
|
26230
26723
|
),
|
|
26231
|
-
/* @__PURE__ */
|
|
26724
|
+
/* @__PURE__ */ jsx169(
|
|
26232
26725
|
Box_default2,
|
|
26233
26726
|
{
|
|
26234
26727
|
ref: overlayRef,
|
|
@@ -26245,7 +26738,7 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26245
26738
|
...!open && { pointerEvents: "none" },
|
|
26246
26739
|
transition: "transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), left 0.4s cubic-bezier(0.4, 0, 0.2, 1)"
|
|
26247
26740
|
},
|
|
26248
|
-
children: /* @__PURE__ */
|
|
26741
|
+
children: /* @__PURE__ */ jsxs81(
|
|
26249
26742
|
Stack_default,
|
|
26250
26743
|
{
|
|
26251
26744
|
sx: {
|
|
@@ -26256,7 +26749,7 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26256
26749
|
width: `${sizes6[size]}px`,
|
|
26257
26750
|
height: contentHeight !== void 0 && headerRef.current ? `${contentHeight + contentPadding + headerRef.current.scrollHeight}px` : void 0,
|
|
26258
26751
|
children: [
|
|
26259
|
-
/* @__PURE__ */
|
|
26752
|
+
/* @__PURE__ */ jsxs81(
|
|
26260
26753
|
Stack_default,
|
|
26261
26754
|
{
|
|
26262
26755
|
ref: headerRef,
|
|
@@ -26270,19 +26763,19 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26270
26763
|
onMouseDown: handleMouseDown,
|
|
26271
26764
|
minHeight: "44px",
|
|
26272
26765
|
children: [
|
|
26273
|
-
/* @__PURE__ */
|
|
26766
|
+
/* @__PURE__ */ jsx169(
|
|
26274
26767
|
Stack_default,
|
|
26275
26768
|
{
|
|
26276
26769
|
direction: "row",
|
|
26277
26770
|
alignItems: "center",
|
|
26278
26771
|
onMouseDown: (ev) => ev.stopPropagation(),
|
|
26279
|
-
children: showBackButton && (!backButton ? /* @__PURE__ */
|
|
26772
|
+
children: showBackButton && (!backButton ? /* @__PURE__ */ jsx169(
|
|
26280
26773
|
Tooltip_default,
|
|
26281
26774
|
{
|
|
26282
26775
|
title: t("MINIMIZABLE_WINDOW.GO_BACK"),
|
|
26283
26776
|
zIndex: 999999,
|
|
26284
26777
|
placement: "top",
|
|
26285
|
-
children: /* @__PURE__ */
|
|
26778
|
+
children: /* @__PURE__ */ jsx169(
|
|
26286
26779
|
IconButton_default,
|
|
26287
26780
|
{
|
|
26288
26781
|
size: iconSizes4,
|
|
@@ -26295,7 +26788,7 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26295
26788
|
) : backButton)
|
|
26296
26789
|
}
|
|
26297
26790
|
),
|
|
26298
|
-
/* @__PURE__ */
|
|
26791
|
+
/* @__PURE__ */ jsx169(
|
|
26299
26792
|
Box_default2,
|
|
26300
26793
|
{
|
|
26301
26794
|
sx: {
|
|
@@ -26303,23 +26796,23 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26303
26796
|
left: "50%",
|
|
26304
26797
|
transform: "translateX(-50%)"
|
|
26305
26798
|
},
|
|
26306
|
-
children: typeof title === "string" ? /* @__PURE__ */
|
|
26799
|
+
children: typeof title === "string" ? /* @__PURE__ */ jsx169(Typography_default, { children: title }) : title
|
|
26307
26800
|
}
|
|
26308
26801
|
),
|
|
26309
|
-
/* @__PURE__ */
|
|
26802
|
+
/* @__PURE__ */ jsxs81(
|
|
26310
26803
|
Stack_default,
|
|
26311
26804
|
{
|
|
26312
26805
|
direction: "row",
|
|
26313
26806
|
alignItems: "center",
|
|
26314
26807
|
onMouseDown: (ev) => ev.stopPropagation(),
|
|
26315
26808
|
children: [
|
|
26316
|
-
/* @__PURE__ */
|
|
26809
|
+
/* @__PURE__ */ jsx169(Box_default2, { children: /* @__PURE__ */ jsx169(
|
|
26317
26810
|
Tooltip_default,
|
|
26318
26811
|
{
|
|
26319
26812
|
title: t("MINIMIZABLE_WINDOW.MINIMIZE"),
|
|
26320
26813
|
zIndex: 999999,
|
|
26321
26814
|
placement: "top",
|
|
26322
|
-
children: /* @__PURE__ */
|
|
26815
|
+
children: /* @__PURE__ */ jsx169(
|
|
26323
26816
|
IconButton_default,
|
|
26324
26817
|
{
|
|
26325
26818
|
size: iconSizes4,
|
|
@@ -26335,13 +26828,13 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26335
26828
|
)
|
|
26336
26829
|
}
|
|
26337
26830
|
) }),
|
|
26338
|
-
closeable && /* @__PURE__ */
|
|
26831
|
+
closeable && /* @__PURE__ */ jsx169(Box_default2, { sx: { padding: "0 8px" }, children: /* @__PURE__ */ jsx169(
|
|
26339
26832
|
Tooltip_default,
|
|
26340
26833
|
{
|
|
26341
26834
|
title: t("MINIMIZABLE_WINDOW.CLOSE"),
|
|
26342
26835
|
zIndex: 999999,
|
|
26343
26836
|
placement: "top",
|
|
26344
|
-
children: /* @__PURE__ */
|
|
26837
|
+
children: /* @__PURE__ */ jsx169(
|
|
26345
26838
|
IconButton_default,
|
|
26346
26839
|
{
|
|
26347
26840
|
size: iconSizes4,
|
|
@@ -26358,7 +26851,7 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26358
26851
|
]
|
|
26359
26852
|
}
|
|
26360
26853
|
),
|
|
26361
|
-
/* @__PURE__ */
|
|
26854
|
+
/* @__PURE__ */ jsx169(
|
|
26362
26855
|
Stack_default,
|
|
26363
26856
|
{
|
|
26364
26857
|
sx: {
|
|
@@ -26377,27 +26870,27 @@ var MinimizableWindow = React87.forwardRef(function MinimizableWindow2({
|
|
|
26377
26870
|
var MinimizableWindow_default = MinimizableWindow;
|
|
26378
26871
|
|
|
26379
26872
|
// src/hooks/useFormatters.ts
|
|
26380
|
-
import { useCallback as
|
|
26873
|
+
import { useCallback as useCallback20, useContext as useContext16 } from "react";
|
|
26381
26874
|
var useFormatters = () => {
|
|
26382
26875
|
const { locale, currency, timezone } = useContext16(IntlContext);
|
|
26383
26876
|
return {
|
|
26384
|
-
formatCompactNumber:
|
|
26877
|
+
formatCompactNumber: useCallback20(
|
|
26385
26878
|
(value) => formatCompactNumber(value, locale),
|
|
26386
26879
|
[locale]
|
|
26387
26880
|
),
|
|
26388
|
-
formatNumber:
|
|
26881
|
+
formatNumber: useCallback20(
|
|
26389
26882
|
(value, fractionSize) => formatNumber(value, locale, fractionSize),
|
|
26390
26883
|
[locale]
|
|
26391
26884
|
),
|
|
26392
|
-
formatPercentage:
|
|
26885
|
+
formatPercentage: useCallback20(
|
|
26393
26886
|
(value, fractionSize) => formatPercentage(value, locale, fractionSize),
|
|
26394
26887
|
[locale]
|
|
26395
26888
|
),
|
|
26396
|
-
formatCurrency:
|
|
26889
|
+
formatCurrency: useCallback20(
|
|
26397
26890
|
(value, notation) => formatCurrency(value, locale, currency, notation),
|
|
26398
26891
|
[currency, locale]
|
|
26399
26892
|
),
|
|
26400
|
-
formatDate:
|
|
26893
|
+
formatDate: useCallback20(
|
|
26401
26894
|
(date, format2) => formatDate(date, locale, timezone, format2),
|
|
26402
26895
|
[locale, timezone]
|
|
26403
26896
|
)
|
|
@@ -26425,6 +26918,7 @@ export {
|
|
|
26425
26918
|
CardTable_default as CardTable,
|
|
26426
26919
|
CardTitle_default as CardTitle,
|
|
26427
26920
|
CardTitleWithIcon_default as CardTitleWithIcon,
|
|
26921
|
+
Carousel_default as Carousel,
|
|
26428
26922
|
CategorizedPicker_default as CategorizedPicker,
|
|
26429
26923
|
Chat_default as Chat,
|
|
26430
26924
|
ChatMessage_default as ChatMessage,
|
|
@@ -26563,6 +27057,7 @@ export {
|
|
|
26563
27057
|
WidgetLegendItem_default as WidgetLegendItem,
|
|
26564
27058
|
WidgetTitle_default as WidgetTitle,
|
|
26565
27059
|
allCountries,
|
|
27060
|
+
applyTimeToDate,
|
|
26566
27061
|
areSameSimpleDate,
|
|
26567
27062
|
closeSnackbar2 as closeSnackbar,
|
|
26568
27063
|
colorPickerDefaultColors,
|