@ceed/ads 1.25.1-next.3 → 1.26.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/chunks/rehype-accent-FZRUD7VI.js +39 -0
- package/dist/components/CurrencyInput/CurrencyInput.d.ts +1 -1
- package/dist/components/CurrencyInput/hooks/use-currency-setting.d.ts +2 -2
- package/dist/components/DataTable/components.d.ts +2 -1
- package/dist/components/DataTable/styled.d.ts +3 -1
- package/dist/components/DataTable/types.d.ts +1 -0
- package/dist/components/ProfileMenu/ProfileMenu.d.ts +1 -1
- package/dist/components/data-display/Badge.md +71 -39
- package/dist/components/data-display/DataTable.md +77 -1
- package/dist/components/data-display/InfoSign.md +74 -98
- package/dist/components/data-display/Typography.md +363 -97
- package/dist/components/feedback/CircularProgress.md +257 -0
- package/dist/components/feedback/Dialog.md +76 -62
- package/dist/components/feedback/Modal.md +259 -44
- package/dist/components/feedback/Skeleton.md +280 -0
- package/dist/components/feedback/llms.txt +2 -0
- package/dist/components/inputs/Autocomplete.md +356 -107
- package/dist/components/inputs/ButtonGroup.md +115 -106
- package/dist/components/inputs/Calendar.md +98 -459
- package/dist/components/inputs/CurrencyInput.md +183 -5
- package/dist/components/inputs/DatePicker.md +108 -431
- package/dist/components/inputs/DateRangePicker.md +131 -492
- package/dist/components/inputs/FilterMenu.md +169 -19
- package/dist/components/inputs/FilterableCheckboxGroup.md +123 -23
- package/dist/components/inputs/FormControl.md +361 -0
- package/dist/components/inputs/IconButton.md +137 -88
- package/dist/components/inputs/Input.md +5 -0
- package/dist/components/inputs/MonthPicker.md +95 -422
- package/dist/components/inputs/MonthRangePicker.md +89 -466
- package/dist/components/inputs/PercentageInput.md +185 -16
- package/dist/components/inputs/RadioButton.md +163 -35
- package/dist/components/inputs/RadioList.md +241 -0
- package/dist/components/inputs/RadioTileGroup.md +150 -61
- package/dist/components/inputs/Select.md +222 -326
- package/dist/components/inputs/Slider.md +334 -0
- package/dist/components/inputs/Switch.md +136 -376
- package/dist/components/inputs/Textarea.md +213 -10
- package/dist/components/inputs/Uploader/Uploader.md +145 -66
- package/dist/components/inputs/llms.txt +3 -0
- package/dist/components/navigation/Breadcrumbs.md +80 -322
- package/dist/components/navigation/Dropdown.md +92 -221
- package/dist/components/navigation/IconMenuButton.md +40 -502
- package/dist/components/navigation/InsetDrawer.md +68 -738
- package/dist/components/navigation/Link.md +39 -298
- package/dist/components/navigation/Menu.md +92 -285
- package/dist/components/navigation/MenuButton.md +55 -448
- package/dist/components/navigation/Pagination.md +47 -338
- package/dist/components/navigation/ProfileMenu.md +45 -268
- package/dist/components/navigation/Stepper.md +160 -28
- package/dist/components/navigation/Tabs.md +57 -316
- package/dist/components/surfaces/Sheet.md +151 -334
- package/dist/guides/ThemeProvider.md +116 -0
- package/dist/guides/llms.txt +9 -0
- package/dist/index.browser.js +16 -18
- package/dist/index.browser.js.map +4 -4
- package/dist/index.cjs +303 -209
- package/dist/index.js +381 -343
- package/dist/llms.txt +8 -0
- package/framer/index.js +1 -166
- package/package.json +15 -16
package/dist/index.js
CHANGED
|
@@ -1,59 +1,3 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
3
|
-
var __esm = (fn, res) => function __init() {
|
|
4
|
-
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
5
|
-
};
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
|
|
11
|
-
// src/libs/rehype-accent/index.ts
|
|
12
|
-
var rehype_accent_exports = {};
|
|
13
|
-
__export(rehype_accent_exports, {
|
|
14
|
-
rehypeAccent: () => rehypeAccent
|
|
15
|
-
});
|
|
16
|
-
import { visit } from "unist-util-visit";
|
|
17
|
-
function rehypeAccent(options) {
|
|
18
|
-
const { accentColor } = options;
|
|
19
|
-
return (tree) => {
|
|
20
|
-
visit(tree, "text", (node, index, parent) => {
|
|
21
|
-
const value = node.value;
|
|
22
|
-
const regex = /\|\|.*?\|\|/g;
|
|
23
|
-
let match;
|
|
24
|
-
let lastIndex = 0;
|
|
25
|
-
const newNodes = [];
|
|
26
|
-
while ((match = regex.exec(value)) !== null) {
|
|
27
|
-
if (match.index > lastIndex) {
|
|
28
|
-
newNodes.push({
|
|
29
|
-
type: "text",
|
|
30
|
-
value: value.slice(lastIndex, match.index)
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
const innerText = match[0].split("||")[1];
|
|
34
|
-
newNodes.push({
|
|
35
|
-
type: "element",
|
|
36
|
-
tagName: "span",
|
|
37
|
-
properties: { textColor: accentColor },
|
|
38
|
-
children: [{ type: "text", value: innerText }]
|
|
39
|
-
});
|
|
40
|
-
lastIndex = match.index + match[0].length;
|
|
41
|
-
}
|
|
42
|
-
if (lastIndex < value.length) {
|
|
43
|
-
newNodes.push({ type: "text", value: value.slice(lastIndex) });
|
|
44
|
-
}
|
|
45
|
-
if (newNodes.length) {
|
|
46
|
-
parent.children.splice(index, 1, ...newNodes);
|
|
47
|
-
}
|
|
48
|
-
});
|
|
49
|
-
};
|
|
50
|
-
}
|
|
51
|
-
var init_rehype_accent = __esm({
|
|
52
|
-
"src/libs/rehype-accent/index.ts"() {
|
|
53
|
-
"use strict";
|
|
54
|
-
}
|
|
55
|
-
});
|
|
56
|
-
|
|
57
1
|
// src/index.ts
|
|
58
2
|
import {
|
|
59
3
|
useTheme as useTheme2,
|
|
@@ -749,11 +693,24 @@ Button.displayName = "Button";
|
|
|
749
693
|
var Button_default = Button;
|
|
750
694
|
|
|
751
695
|
// src/components/Calendar/Calendar.tsx
|
|
752
|
-
import
|
|
696
|
+
import React12, { Fragment, forwardRef as forwardRef4, useCallback as useCallback5, useEffect as useEffect3, useMemo as useMemo4, useRef as useRef3, useState as useState4 } from "react";
|
|
753
697
|
import { styled as styled5 } from "@mui/joy";
|
|
754
698
|
import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
|
|
755
699
|
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
|
756
|
-
import { AnimatePresence, motion as
|
|
700
|
+
import { AnimatePresence, motion as motion13 } from "framer-motion";
|
|
701
|
+
|
|
702
|
+
// src/components/Tooltip/Tooltip.tsx
|
|
703
|
+
import React10 from "react";
|
|
704
|
+
import { Tooltip as JoyTooltip } from "@mui/joy";
|
|
705
|
+
import { motion as motion12 } from "framer-motion";
|
|
706
|
+
var MotionTooltip = motion12(JoyTooltip);
|
|
707
|
+
var Tooltip = (props) => {
|
|
708
|
+
return /* @__PURE__ */ React10.createElement(MotionTooltip, { ...props });
|
|
709
|
+
};
|
|
710
|
+
Tooltip.displayName = "Tooltip";
|
|
711
|
+
|
|
712
|
+
// src/components/Tooltip/index.ts
|
|
713
|
+
var Tooltip_default = Tooltip;
|
|
757
714
|
|
|
758
715
|
// src/components/Calendar/utils/index.ts
|
|
759
716
|
var getCalendarDates = (date) => {
|
|
@@ -1112,6 +1069,12 @@ var useCalendar = (ownerState) => {
|
|
|
1112
1069
|
};
|
|
1113
1070
|
|
|
1114
1071
|
// src/components/Calendar/Calendar.tsx
|
|
1072
|
+
var MONTH_VIEW_HINT_MESSAGE = "Click the month title to view all months.";
|
|
1073
|
+
var MONTH_NAV_CLICK_WINDOW_MS = 1200;
|
|
1074
|
+
var MONTH_NAV_CLICK_THRESHOLD = 3;
|
|
1075
|
+
var MONTH_VIEW_HINT_DURATION_MS = 5e3;
|
|
1076
|
+
var MONTH_VIEW_HINT_COOLDOWN_MS = 3e4;
|
|
1077
|
+
var lastMonthViewAssistHintShownAt = 0;
|
|
1115
1078
|
var CalendarRoot = styled5("div", {
|
|
1116
1079
|
name: "Calendar",
|
|
1117
1080
|
slot: "root"
|
|
@@ -1138,7 +1101,7 @@ var CalendarViewContainer = styled5("div", {
|
|
|
1138
1101
|
overflow: "hidden",
|
|
1139
1102
|
minHeight: calendarType === "datePicker" ? "250px" : "unset"
|
|
1140
1103
|
}));
|
|
1141
|
-
var CalendarViewTable = styled5(
|
|
1104
|
+
var CalendarViewTable = styled5(motion13.table, {
|
|
1142
1105
|
name: "Calendar",
|
|
1143
1106
|
slot: "viewTable"
|
|
1144
1107
|
})(({ theme }) => ({
|
|
@@ -1318,7 +1281,7 @@ var PickerDays = (props) => {
|
|
|
1318
1281
|
const { getPickerDayProps, getDayCellProps } = useCalendar(ownerState);
|
|
1319
1282
|
const calendarDates = useMemo4(() => getCalendarDates(ownerState.viewMonth), [ownerState.viewMonth]);
|
|
1320
1283
|
const weekdayNames = useMemo4(() => getWeekdayNames(ownerState.locale || "default"), [ownerState.locale]);
|
|
1321
|
-
return /* @__PURE__ */
|
|
1284
|
+
return /* @__PURE__ */ React12.createElement(CalendarViewContainer, { calendarType: "datePicker" }, /* @__PURE__ */ React12.createElement(AnimatePresence, { initial: false, custom: ownerState.direction }, /* @__PURE__ */ React12.createElement(
|
|
1322
1285
|
CalendarViewTable,
|
|
1323
1286
|
{
|
|
1324
1287
|
key: `${ownerState.viewMonth.toString()}_${ownerState.direction}`,
|
|
@@ -1347,10 +1310,10 @@ var PickerDays = (props) => {
|
|
|
1347
1310
|
}
|
|
1348
1311
|
}
|
|
1349
1312
|
},
|
|
1350
|
-
/* @__PURE__ */
|
|
1351
|
-
/* @__PURE__ */
|
|
1352
|
-
(date, i) => date ? /* @__PURE__ */
|
|
1353
|
-
)), rowIndex < calendarDates.length - 1 && /* @__PURE__ */
|
|
1313
|
+
/* @__PURE__ */ React12.createElement(CalendarWeekHeaderContainer, null, /* @__PURE__ */ React12.createElement("tr", null, weekdayNames.map((name, i) => /* @__PURE__ */ React12.createElement(Fragment, { key: `${ownerState.viewMonth}_${name}_${i}` }, /* @__PURE__ */ React12.createElement("th", null, /* @__PURE__ */ React12.createElement(Typography_default, { level: "body-xs", textAlign: "center" }, name)), i < 6 && /* @__PURE__ */ React12.createElement("th", { style: { width: 4 }, "aria-hidden": "true", "aria-description": "cell-gap" }))))),
|
|
1314
|
+
/* @__PURE__ */ React12.createElement(CalendarDayPickerContainer, null, calendarDates.map((weekDates, rowIndex) => /* @__PURE__ */ React12.createElement(Fragment, { key: `${ownerState.viewMonth}_${rowIndex}` }, /* @__PURE__ */ React12.createElement("tr", null, weekDates.map(
|
|
1315
|
+
(date, i) => date ? /* @__PURE__ */ React12.createElement(Fragment, { key: `${ownerState.viewMonth}_${date}_${i}` }, /* @__PURE__ */ React12.createElement(CalendarDayCell, { ...getDayCellProps(date) }, /* @__PURE__ */ React12.createElement(CalendarDay, { size: "sm", variant: "plain", color: "neutral", ...getPickerDayProps(date) }, date)), i < 6 && /* @__PURE__ */ React12.createElement("td", { "aria-hidden": "true", "aria-description": "cell-gap" })) : /* @__PURE__ */ React12.createElement(Fragment, { key: `${ownerState.viewMonth}_${i}` }, /* @__PURE__ */ React12.createElement("td", null), i < 6 && /* @__PURE__ */ React12.createElement("td", { "aria-hidden": "true", "aria-description": "cell-gap" }))
|
|
1316
|
+
)), rowIndex < calendarDates.length - 1 && /* @__PURE__ */ React12.createElement("tr", { "aria-hidden": "true", "aria-description": "row-gap" }, /* @__PURE__ */ React12.createElement("td", { colSpan: 13, style: { height: 4 } })))))
|
|
1354
1317
|
)));
|
|
1355
1318
|
};
|
|
1356
1319
|
var PickerMonths = (props) => {
|
|
@@ -1367,7 +1330,7 @@ var PickerMonths = (props) => {
|
|
|
1367
1330
|
[[]]
|
|
1368
1331
|
);
|
|
1369
1332
|
const isMonthPicker = !ownerState.views?.find((view) => view === "day");
|
|
1370
|
-
return /* @__PURE__ */
|
|
1333
|
+
return /* @__PURE__ */ React12.createElement(CalendarViewContainer, { calendarType: isMonthPicker ? "monthPicker" : "datePicker" }, /* @__PURE__ */ React12.createElement(AnimatePresence, { initial: false, custom: ownerState.direction }, /* @__PURE__ */ React12.createElement(
|
|
1371
1334
|
CalendarViewTable,
|
|
1372
1335
|
{
|
|
1373
1336
|
key: `${ownerState.viewMonth.getFullYear()}_${ownerState.direction}`,
|
|
@@ -1396,7 +1359,7 @@ var PickerMonths = (props) => {
|
|
|
1396
1359
|
}
|
|
1397
1360
|
}
|
|
1398
1361
|
},
|
|
1399
|
-
/* @__PURE__ */
|
|
1362
|
+
/* @__PURE__ */ React12.createElement("tbody", null, chunkedMonths.map((months, i) => /* @__PURE__ */ React12.createElement(Fragment, { key: months.join("_") }, /* @__PURE__ */ React12.createElement("tr", null, months.map((monthIndex, j) => /* @__PURE__ */ React12.createElement(Fragment, { key: monthIndex }, /* @__PURE__ */ React12.createElement(CalendarMonthCell, { ...getMonthCellProps(monthIndex) }, /* @__PURE__ */ React12.createElement(CalendarMonth, { size: "sm", variant: "plain", color: "neutral", ...getPickerMonthProps(monthIndex) }, getMonthNameFromIndex(monthIndex, ownerState.locale))), j < 3 && /* @__PURE__ */ React12.createElement("td", { style: { width: 4 }, "aria-hidden": "true", "aria-description": "cell-gap" })))), i < chunkedMonths.length - 1 && /* @__PURE__ */ React12.createElement("tr", { "aria-hidden": "true", "aria-description": "row-gap" }, /* @__PURE__ */ React12.createElement("td", { colSpan: 7, style: { height: 4 } })))))
|
|
1400
1363
|
)));
|
|
1401
1364
|
};
|
|
1402
1365
|
var Calendar = forwardRef4((inProps, ref) => {
|
|
@@ -1418,17 +1381,96 @@ var Calendar = forwardRef4((inProps, ref) => {
|
|
|
1418
1381
|
...others
|
|
1419
1382
|
} = props;
|
|
1420
1383
|
const { calendarTitle, onPrev, onNext } = useCalendar(ownerState);
|
|
1421
|
-
|
|
1422
|
-
|
|
1384
|
+
const [isMonthViewAssistHintOpen, setIsMonthViewAssistHintOpen] = useState4(false);
|
|
1385
|
+
const monthNavClickTimestampsRef = useRef3([]);
|
|
1386
|
+
const monthViewAssistHintShownInSessionRef = useRef3(false);
|
|
1387
|
+
const monthViewAssistHintTimeoutRef = useRef3(null);
|
|
1388
|
+
const hasEndDate = Boolean(value?.[1]);
|
|
1389
|
+
const isRangeHintEligible = Boolean(rangeSelection && !hasEndDate);
|
|
1390
|
+
const isHintEligible = Boolean(view === "day" && (!rangeSelection || isRangeHintEligible));
|
|
1391
|
+
const monthViewHintMessage = MONTH_VIEW_HINT_MESSAGE;
|
|
1392
|
+
useEffect3(() => {
|
|
1393
|
+
if (!isHintEligible) {
|
|
1394
|
+
monthNavClickTimestampsRef.current = [];
|
|
1395
|
+
setIsMonthViewAssistHintOpen(false);
|
|
1396
|
+
}
|
|
1397
|
+
}, [isHintEligible]);
|
|
1398
|
+
useEffect3(() => {
|
|
1399
|
+
return () => {
|
|
1400
|
+
if (monthViewAssistHintTimeoutRef.current) {
|
|
1401
|
+
clearTimeout(monthViewAssistHintTimeoutRef.current);
|
|
1402
|
+
}
|
|
1403
|
+
};
|
|
1404
|
+
}, []);
|
|
1405
|
+
const closeMonthViewAssistHint = useCallback5(() => {
|
|
1406
|
+
if (monthViewAssistHintTimeoutRef.current) {
|
|
1407
|
+
clearTimeout(monthViewAssistHintTimeoutRef.current);
|
|
1408
|
+
monthViewAssistHintTimeoutRef.current = null;
|
|
1409
|
+
}
|
|
1410
|
+
setIsMonthViewAssistHintOpen(false);
|
|
1411
|
+
}, []);
|
|
1412
|
+
const showMonthViewAssistHint = useCallback5(() => {
|
|
1413
|
+
const now = Date.now();
|
|
1414
|
+
if (monthViewAssistHintShownInSessionRef.current) return;
|
|
1415
|
+
if (now - lastMonthViewAssistHintShownAt < MONTH_VIEW_HINT_COOLDOWN_MS) return;
|
|
1416
|
+
monthViewAssistHintShownInSessionRef.current = true;
|
|
1417
|
+
lastMonthViewAssistHintShownAt = now;
|
|
1418
|
+
setIsMonthViewAssistHintOpen(true);
|
|
1419
|
+
if (monthViewAssistHintTimeoutRef.current) {
|
|
1420
|
+
clearTimeout(monthViewAssistHintTimeoutRef.current);
|
|
1421
|
+
}
|
|
1422
|
+
monthViewAssistHintTimeoutRef.current = setTimeout(() => {
|
|
1423
|
+
setIsMonthViewAssistHintOpen(false);
|
|
1424
|
+
monthViewAssistHintTimeoutRef.current = null;
|
|
1425
|
+
}, MONTH_VIEW_HINT_DURATION_MS);
|
|
1426
|
+
}, []);
|
|
1427
|
+
const trackFastMonthNavigation = useCallback5(() => {
|
|
1428
|
+
if (!isHintEligible) return;
|
|
1429
|
+
const now = Date.now();
|
|
1430
|
+
monthNavClickTimestampsRef.current = [
|
|
1431
|
+
...monthNavClickTimestampsRef.current.filter((timestamp) => now - timestamp <= MONTH_NAV_CLICK_WINDOW_MS),
|
|
1432
|
+
now
|
|
1433
|
+
];
|
|
1434
|
+
if (monthNavClickTimestampsRef.current.length >= MONTH_NAV_CLICK_THRESHOLD) {
|
|
1435
|
+
showMonthViewAssistHint();
|
|
1436
|
+
}
|
|
1437
|
+
}, [isHintEligible, showMonthViewAssistHint]);
|
|
1438
|
+
const handlePrevClick = useCallback5(() => {
|
|
1439
|
+
onPrev();
|
|
1440
|
+
trackFastMonthNavigation();
|
|
1441
|
+
}, [onPrev, trackFastMonthNavigation]);
|
|
1442
|
+
const handleNextClick = useCallback5(() => {
|
|
1443
|
+
onNext();
|
|
1444
|
+
trackFastMonthNavigation();
|
|
1445
|
+
}, [onNext, trackFastMonthNavigation]);
|
|
1446
|
+
const handleSwitchViewClick = useCallback5(() => {
|
|
1447
|
+
closeMonthViewAssistHint();
|
|
1448
|
+
onViewChange?.();
|
|
1449
|
+
}, [closeMonthViewAssistHint, onViewChange]);
|
|
1450
|
+
return /* @__PURE__ */ React12.createElement(CalendarRoot, { ref, ...others }, /* @__PURE__ */ React12.createElement(CalendarHeader, null, /* @__PURE__ */ React12.createElement(IconButton_default, { size: "sm", onClick: handlePrevClick, "aria-label": `Previous ${view === "day" ? "Month" : "Year"}` }, /* @__PURE__ */ React12.createElement(ChevronLeftIcon, null)), /* @__PURE__ */ React12.createElement(
|
|
1451
|
+
Tooltip_default,
|
|
1423
1452
|
{
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1453
|
+
title: monthViewHintMessage,
|
|
1454
|
+
arrow: true,
|
|
1455
|
+
open: isMonthViewAssistHintOpen,
|
|
1456
|
+
placement: "bottom",
|
|
1457
|
+
disableFocusListener: true,
|
|
1458
|
+
disableHoverListener: true,
|
|
1459
|
+
disableTouchListener: true,
|
|
1460
|
+
variant: "solid"
|
|
1429
1461
|
},
|
|
1430
|
-
|
|
1431
|
-
|
|
1462
|
+
/* @__PURE__ */ React12.createElement(
|
|
1463
|
+
CalendarSwitchViewButton,
|
|
1464
|
+
{
|
|
1465
|
+
ownerState,
|
|
1466
|
+
variant: "plain",
|
|
1467
|
+
color: "neutral",
|
|
1468
|
+
onClick: handleSwitchViewClick,
|
|
1469
|
+
"aria-label": "Switch Calendar View"
|
|
1470
|
+
},
|
|
1471
|
+
calendarTitle
|
|
1472
|
+
)
|
|
1473
|
+
), /* @__PURE__ */ React12.createElement(IconButton_default, { size: "sm", onClick: handleNextClick, "aria-label": `Next ${view === "day" ? "Month" : "Year"}` }, /* @__PURE__ */ React12.createElement(ChevronRightIcon, null))), view === "day" && /* @__PURE__ */ React12.createElement(PickerDays, { ownerState }), view === "month" && /* @__PURE__ */ React12.createElement(PickerMonths, { ownerState }));
|
|
1432
1474
|
});
|
|
1433
1475
|
Calendar.displayName = "Calendar";
|
|
1434
1476
|
|
|
@@ -1443,30 +1485,30 @@ import {
|
|
|
1443
1485
|
CardActions as JoyCardActions,
|
|
1444
1486
|
CardOverflow as JoyCardOverflow
|
|
1445
1487
|
} from "@mui/joy";
|
|
1446
|
-
import { motion as
|
|
1447
|
-
var MotionCard =
|
|
1488
|
+
import { motion as motion14 } from "framer-motion";
|
|
1489
|
+
var MotionCard = motion14(JoyCard);
|
|
1448
1490
|
var Card = MotionCard;
|
|
1449
1491
|
Card.displayName = "Card";
|
|
1450
|
-
var MotionCardContent =
|
|
1492
|
+
var MotionCardContent = motion14(JoyCardContent);
|
|
1451
1493
|
var CardContent = MotionCardContent;
|
|
1452
1494
|
CardContent.displayName = "CardContent";
|
|
1453
|
-
var MotionCardCover =
|
|
1495
|
+
var MotionCardCover = motion14(JoyCardCover);
|
|
1454
1496
|
var CardCover = MotionCardCover;
|
|
1455
1497
|
CardCover.displayName = "CardCover";
|
|
1456
|
-
var MotionCardActions =
|
|
1498
|
+
var MotionCardActions = motion14(JoyCardActions);
|
|
1457
1499
|
var CardActions = MotionCardActions;
|
|
1458
1500
|
CardActions.displayName = "CardActions";
|
|
1459
|
-
var MotionCardOverflow =
|
|
1501
|
+
var MotionCardOverflow = motion14(JoyCardOverflow);
|
|
1460
1502
|
var CardOverflow = MotionCardOverflow;
|
|
1461
1503
|
CardOverflow.displayName = "CardOverflow";
|
|
1462
1504
|
|
|
1463
1505
|
// src/components/Checkbox/Checkbox.tsx
|
|
1464
|
-
import
|
|
1506
|
+
import React13 from "react";
|
|
1465
1507
|
import { Checkbox as JoyCheckbox } from "@mui/joy";
|
|
1466
|
-
import { motion as
|
|
1467
|
-
var MotionCheckbox =
|
|
1508
|
+
import { motion as motion15 } from "framer-motion";
|
|
1509
|
+
var MotionCheckbox = motion15(JoyCheckbox);
|
|
1468
1510
|
var Checkbox = (props) => {
|
|
1469
|
-
return /* @__PURE__ */
|
|
1511
|
+
return /* @__PURE__ */ React13.createElement(MotionCheckbox, { ...props });
|
|
1470
1512
|
};
|
|
1471
1513
|
Checkbox.displayName = "Checkbox";
|
|
1472
1514
|
|
|
@@ -1475,7 +1517,7 @@ var Checkbox_default = Checkbox;
|
|
|
1475
1517
|
|
|
1476
1518
|
// src/components/Container/Container.tsx
|
|
1477
1519
|
import { styled as styled6 } from "@mui/joy";
|
|
1478
|
-
import
|
|
1520
|
+
import React14, { forwardRef as forwardRef5 } from "react";
|
|
1479
1521
|
var ContainerRoot = styled6("div", {
|
|
1480
1522
|
name: "Container",
|
|
1481
1523
|
slot: "root",
|
|
@@ -1502,24 +1544,23 @@ var ContainerRoot = styled6("div", {
|
|
|
1502
1544
|
} : null
|
|
1503
1545
|
]);
|
|
1504
1546
|
var Container = forwardRef5(function Container2(props, ref) {
|
|
1505
|
-
return /* @__PURE__ */
|
|
1547
|
+
return /* @__PURE__ */ React14.createElement(ContainerRoot, { ref, ...props });
|
|
1506
1548
|
});
|
|
1507
1549
|
Container.displayName = "Container";
|
|
1508
1550
|
|
|
1509
1551
|
// src/components/CurrencyInput/CurrencyInput.tsx
|
|
1510
|
-
import
|
|
1511
|
-
import { IntlMessageFormat as IntlMessageFormat2 } from "intl-messageformat";
|
|
1552
|
+
import React16, { useCallback as useCallback7, useMemo as useMemo5, useState as useState6 } from "react";
|
|
1512
1553
|
import { NumericFormat } from "react-number-format";
|
|
1513
1554
|
|
|
1514
1555
|
// src/components/Input/Input.tsx
|
|
1515
|
-
import
|
|
1556
|
+
import React15, { useCallback as useCallback6, useState as useState5 } from "react";
|
|
1516
1557
|
import { Input as JoyInput } from "@mui/joy";
|
|
1517
|
-
import { motion as
|
|
1558
|
+
import { motion as motion16 } from "framer-motion";
|
|
1518
1559
|
import ClearIcon from "@mui/icons-material/Close";
|
|
1519
1560
|
import VisibilityIcon from "@mui/icons-material/Visibility";
|
|
1520
1561
|
import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
|
|
1521
|
-
var MotionInput =
|
|
1522
|
-
var Input =
|
|
1562
|
+
var MotionInput = motion16(JoyInput);
|
|
1563
|
+
var Input = React15.forwardRef((props, ref) => {
|
|
1523
1564
|
const {
|
|
1524
1565
|
label,
|
|
1525
1566
|
helperText,
|
|
@@ -1542,11 +1583,11 @@ var Input = React14.forwardRef((props, ref) => {
|
|
|
1542
1583
|
if (type === "password" && innerProps.endDecorator) {
|
|
1543
1584
|
console.warn('Input: endDecorator is not supported when type="password"');
|
|
1544
1585
|
}
|
|
1545
|
-
const [passwordVisible, setPasswordVisible] =
|
|
1586
|
+
const [passwordVisible, setPasswordVisible] = useState5(false);
|
|
1546
1587
|
const [value, setValue] = useControlledState(
|
|
1547
1588
|
props.value,
|
|
1548
1589
|
props.defaultValue,
|
|
1549
|
-
|
|
1590
|
+
useCallback6(
|
|
1550
1591
|
(value2) => {
|
|
1551
1592
|
onChange?.({
|
|
1552
1593
|
/**
|
|
@@ -1572,7 +1613,7 @@ var Input = React14.forwardRef((props, ref) => {
|
|
|
1572
1613
|
const actualType = type === "password" && passwordVisible ? "text" : type;
|
|
1573
1614
|
const isPasswordType = type === "password";
|
|
1574
1615
|
const showPasswordToggle = isPasswordType && !disableTogglePasswordButton;
|
|
1575
|
-
const input = /* @__PURE__ */
|
|
1616
|
+
const input = /* @__PURE__ */ React15.createElement(
|
|
1576
1617
|
MotionInput,
|
|
1577
1618
|
{
|
|
1578
1619
|
value,
|
|
@@ -1587,7 +1628,7 @@ var Input = React14.forwardRef((props, ref) => {
|
|
|
1587
1628
|
...innerProps.slotProps
|
|
1588
1629
|
},
|
|
1589
1630
|
...innerProps,
|
|
1590
|
-
endDecorator: isPasswordType ? showPasswordToggle ? /* @__PURE__ */
|
|
1631
|
+
endDecorator: isPasswordType ? showPasswordToggle ? /* @__PURE__ */ React15.createElement(Stack_default, { gap: 1, direction: "row" }, /* @__PURE__ */ React15.createElement(
|
|
1591
1632
|
IconButton_default,
|
|
1592
1633
|
{
|
|
1593
1634
|
onMouseDown: (e) => e.preventDefault(),
|
|
@@ -1595,19 +1636,19 @@ var Input = React14.forwardRef((props, ref) => {
|
|
|
1595
1636
|
disabled,
|
|
1596
1637
|
"aria-label": passwordVisible ? "Hide password" : "Show password"
|
|
1597
1638
|
},
|
|
1598
|
-
passwordVisible ? /* @__PURE__ */
|
|
1599
|
-
)) : null : enableClearable ? /* @__PURE__ */
|
|
1639
|
+
passwordVisible ? /* @__PURE__ */ React15.createElement(VisibilityOffIcon, null) : /* @__PURE__ */ React15.createElement(VisibilityIcon, null)
|
|
1640
|
+
)) : null : enableClearable ? /* @__PURE__ */ React15.createElement(Stack_default, { gap: 1, direction: "row" }, innerProps.endDecorator, value && /* @__PURE__ */ React15.createElement(
|
|
1600
1641
|
IconButton_default,
|
|
1601
1642
|
{
|
|
1602
1643
|
onMouseDown: (e) => e.preventDefault(),
|
|
1603
1644
|
onClick: handleClear,
|
|
1604
1645
|
"aria-label": "Clear"
|
|
1605
1646
|
},
|
|
1606
|
-
/* @__PURE__ */
|
|
1647
|
+
/* @__PURE__ */ React15.createElement(ClearIcon, null)
|
|
1607
1648
|
)) : innerProps.endDecorator
|
|
1608
1649
|
}
|
|
1609
1650
|
);
|
|
1610
|
-
return /* @__PURE__ */
|
|
1651
|
+
return /* @__PURE__ */ React15.createElement(
|
|
1611
1652
|
FormControl_default,
|
|
1612
1653
|
{
|
|
1613
1654
|
required,
|
|
@@ -1618,9 +1659,9 @@ var Input = React14.forwardRef((props, ref) => {
|
|
|
1618
1659
|
sx,
|
|
1619
1660
|
className
|
|
1620
1661
|
},
|
|
1621
|
-
label && /* @__PURE__ */
|
|
1662
|
+
label && /* @__PURE__ */ React15.createElement(FormLabel_default, null, label),
|
|
1622
1663
|
input,
|
|
1623
|
-
helperText && /* @__PURE__ */
|
|
1664
|
+
helperText && /* @__PURE__ */ React15.createElement(FormHelperText_default, null, helperText)
|
|
1624
1665
|
);
|
|
1625
1666
|
});
|
|
1626
1667
|
Input.displayName = "Input";
|
|
@@ -1632,7 +1673,6 @@ var Input_default = Input;
|
|
|
1632
1673
|
import { styled as styled7, useThemeProps as useThemeProps3 } from "@mui/joy";
|
|
1633
1674
|
|
|
1634
1675
|
// src/components/CurrencyInput/hooks/use-currency-setting.ts
|
|
1635
|
-
import IntlMessageFormat from "intl-messageformat";
|
|
1636
1676
|
var CURRENCY_DECIMAL_MAP = {
|
|
1637
1677
|
AED: 2,
|
|
1638
1678
|
ALL: 2,
|
|
@@ -1777,9 +1817,10 @@ var CURRENCY_DECIMAL_MAP = {
|
|
|
1777
1817
|
};
|
|
1778
1818
|
var useCurrencySetting = (props) => {
|
|
1779
1819
|
const { currency = "USD", placeholder } = props;
|
|
1780
|
-
const
|
|
1781
|
-
|
|
1782
|
-
|
|
1820
|
+
const parts = new Intl.NumberFormat("en-US", { style: "currency", currency }).formatToParts(1000.01);
|
|
1821
|
+
const symbol = parts.find((p) => p.type === "currency")?.value ?? "$";
|
|
1822
|
+
const thousandSeparator = parts.find((p) => p.type === "group")?.value ?? ",";
|
|
1823
|
+
const decimalSeparator = parts.find((p) => p.type === "decimal")?.value;
|
|
1783
1824
|
const decimalScale = CURRENCY_DECIMAL_MAP[currency];
|
|
1784
1825
|
return {
|
|
1785
1826
|
symbol: `${symbol} `,
|
|
@@ -1792,9 +1833,9 @@ var useCurrencySetting = (props) => {
|
|
|
1792
1833
|
};
|
|
1793
1834
|
|
|
1794
1835
|
// src/components/CurrencyInput/CurrencyInput.tsx
|
|
1795
|
-
var TextMaskAdapter =
|
|
1836
|
+
var TextMaskAdapter = React16.forwardRef(function TextMaskAdapter2(props, ref) {
|
|
1796
1837
|
const { onChange, ...innerProps } = props;
|
|
1797
|
-
return /* @__PURE__ */
|
|
1838
|
+
return /* @__PURE__ */ React16.createElement(
|
|
1798
1839
|
NumericFormat,
|
|
1799
1840
|
{
|
|
1800
1841
|
...innerProps,
|
|
@@ -1814,7 +1855,7 @@ var CurrencyInputRoot = styled7(Input_default, {
|
|
|
1814
1855
|
slot: "root",
|
|
1815
1856
|
overridesResolver: (props, styles) => styles.root
|
|
1816
1857
|
})({});
|
|
1817
|
-
var CurrencyInput =
|
|
1858
|
+
var CurrencyInput = React16.forwardRef(function CurrencyInput2(inProps, ref) {
|
|
1818
1859
|
const props = useThemeProps3({ props: inProps, name: "CurrencyInput" });
|
|
1819
1860
|
const {
|
|
1820
1861
|
currency = "USD",
|
|
@@ -1835,7 +1876,7 @@ var CurrencyInput = React15.forwardRef(function CurrencyInput2(inProps, ref) {
|
|
|
1835
1876
|
const [_value, setValue] = useControlledState(
|
|
1836
1877
|
props.value,
|
|
1837
1878
|
props.defaultValue,
|
|
1838
|
-
|
|
1879
|
+
useCallback7((value2) => onChange?.({ target: { name, value: value2 } }), [onChange, name])
|
|
1839
1880
|
);
|
|
1840
1881
|
const value = useMemo5(() => {
|
|
1841
1882
|
if (_value && useMinorUnit) {
|
|
@@ -1849,14 +1890,14 @@ var CurrencyInput = React15.forwardRef(function CurrencyInput2(inProps, ref) {
|
|
|
1849
1890
|
}
|
|
1850
1891
|
return props.max;
|
|
1851
1892
|
}, [props.max, useMinorUnit, decimalScale]);
|
|
1852
|
-
const [isOverLimit, setIsOverLimit] =
|
|
1853
|
-
const handleChange =
|
|
1893
|
+
const [isOverLimit, setIsOverLimit] = useState6(!!max && !!value && value > max);
|
|
1894
|
+
const handleChange = useCallback7(
|
|
1854
1895
|
(event) => {
|
|
1855
1896
|
if (event.target.value === "") {
|
|
1856
1897
|
setValue(void 0);
|
|
1857
1898
|
return;
|
|
1858
1899
|
}
|
|
1859
|
-
const amount = useMinorUnit ? Number(event.target.value?.replace(decimalSeparator, "")) : Number(event.target.value);
|
|
1900
|
+
const amount = useMinorUnit ? Number(decimalSeparator ? event.target.value?.replace(decimalSeparator, "") : event.target.value) : Number(event.target.value);
|
|
1860
1901
|
if (!!max && Number(event.target.value) > max) {
|
|
1861
1902
|
setIsOverLimit(true);
|
|
1862
1903
|
} else {
|
|
@@ -1866,7 +1907,7 @@ var CurrencyInput = React15.forwardRef(function CurrencyInput2(inProps, ref) {
|
|
|
1866
1907
|
},
|
|
1867
1908
|
[decimalSeparator, max, useMinorUnit, setValue]
|
|
1868
1909
|
);
|
|
1869
|
-
return /* @__PURE__ */
|
|
1910
|
+
return /* @__PURE__ */ React16.createElement(
|
|
1870
1911
|
CurrencyInputRoot,
|
|
1871
1912
|
{
|
|
1872
1913
|
...innerProps,
|
|
@@ -1879,9 +1920,7 @@ var CurrencyInput = React15.forwardRef(function CurrencyInput2(inProps, ref) {
|
|
|
1879
1920
|
required,
|
|
1880
1921
|
color: error || isOverLimit ? "danger" : props.color,
|
|
1881
1922
|
label,
|
|
1882
|
-
helperText: isOverLimit ?
|
|
1883
|
-
amount: max
|
|
1884
|
-
}) : helperText,
|
|
1923
|
+
helperText: isOverLimit ? `limit: ${new Intl.NumberFormat("en-US", { style: "currency", currency }).format(max)}` : helperText,
|
|
1885
1924
|
slotProps: {
|
|
1886
1925
|
input: {
|
|
1887
1926
|
component: TextMaskAdapter,
|
|
@@ -1906,9 +1945,9 @@ var CurrencyInput_default = CurrencyInput;
|
|
|
1906
1945
|
|
|
1907
1946
|
// src/components/DataTable/DataTable.tsx
|
|
1908
1947
|
import React25, {
|
|
1909
|
-
useCallback as
|
|
1948
|
+
useCallback as useCallback12,
|
|
1910
1949
|
useMemo as useMemo10,
|
|
1911
|
-
useRef as
|
|
1950
|
+
useRef as useRef7,
|
|
1912
1951
|
useId,
|
|
1913
1952
|
forwardRef as forwardRef7,
|
|
1914
1953
|
useImperativeHandle as useImperativeHandle2,
|
|
@@ -2036,18 +2075,28 @@ function getTextAlign(props) {
|
|
|
2036
2075
|
var numberFormatter = (value) => "Intl" in window ? new Intl.NumberFormat().format(value) : value;
|
|
2037
2076
|
|
|
2038
2077
|
// src/components/DataTable/styled.tsx
|
|
2039
|
-
import
|
|
2078
|
+
import React17 from "react";
|
|
2040
2079
|
import { styled as styled8, LinearProgress, buttonClasses, iconButtonClasses } from "@mui/joy";
|
|
2041
|
-
import { motion as
|
|
2080
|
+
import { motion as motion17 } from "framer-motion";
|
|
2042
2081
|
import SortIcon from "@mui/icons-material/ArrowUpwardRounded";
|
|
2043
2082
|
var EllipsisDiv = styled8("div", {
|
|
2044
2083
|
name: "DataTable",
|
|
2045
|
-
slot: "textEllipsis"
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
|
|
2084
|
+
slot: "textEllipsis",
|
|
2085
|
+
shouldForwardProp: (prop) => prop !== "lineClamp"
|
|
2086
|
+
})(
|
|
2087
|
+
({ lineClamp }) => lineClamp && lineClamp > 1 ? {
|
|
2088
|
+
overflow: "hidden",
|
|
2089
|
+
display: "-webkit-box !important",
|
|
2090
|
+
WebkitBoxOrient: "vertical",
|
|
2091
|
+
WebkitLineClamp: lineClamp,
|
|
2092
|
+
whiteSpace: "normal",
|
|
2093
|
+
overflowWrap: "anywhere"
|
|
2094
|
+
} : {
|
|
2095
|
+
overflow: "hidden",
|
|
2096
|
+
textOverflow: "ellipsis",
|
|
2097
|
+
whiteSpace: "nowrap"
|
|
2098
|
+
}
|
|
2099
|
+
);
|
|
2051
2100
|
var OverlayWrapper = styled8("tr", {
|
|
2052
2101
|
name: "DataTable",
|
|
2053
2102
|
slot: "overlayWrapper"
|
|
@@ -2112,7 +2161,7 @@ var Asterisk = styled8("span", {
|
|
|
2112
2161
|
color: "var(--ceed-palette-danger-500)",
|
|
2113
2162
|
marginLeft: theme.spacing(0.5)
|
|
2114
2163
|
}));
|
|
2115
|
-
var StyledTh = styled8(
|
|
2164
|
+
var StyledTh = styled8(motion17.th)(({ theme }) => ({
|
|
2116
2165
|
boxShadow: "1px 0 var(--TableCell-borderColor)"
|
|
2117
2166
|
}));
|
|
2118
2167
|
var StyledTd = styled8("td")(({ theme }) => ({
|
|
@@ -2131,9 +2180,9 @@ var StyledTd = styled8("td")(({ theme }) => ({
|
|
|
2131
2180
|
}
|
|
2132
2181
|
}
|
|
2133
2182
|
}));
|
|
2134
|
-
var MotionSortIcon =
|
|
2135
|
-
var DefaultLoadingOverlay = () => /* @__PURE__ */
|
|
2136
|
-
var Resizer = (ref, targetRef = ref) => /* @__PURE__ */
|
|
2183
|
+
var MotionSortIcon = motion17(SortIcon);
|
|
2184
|
+
var DefaultLoadingOverlay = () => /* @__PURE__ */ React17.createElement(LinearProgress, { value: 8, variant: "plain" });
|
|
2185
|
+
var Resizer = (ref, targetRef = ref) => /* @__PURE__ */ React17.createElement(
|
|
2137
2186
|
Box_default,
|
|
2138
2187
|
{
|
|
2139
2188
|
sx: {
|
|
@@ -2166,12 +2215,12 @@ var Resizer = (ref, targetRef = ref) => /* @__PURE__ */ React16.createElement(
|
|
|
2166
2215
|
|
|
2167
2216
|
// src/components/DataTable/components.tsx
|
|
2168
2217
|
import React22, {
|
|
2169
|
-
useRef as
|
|
2170
|
-
useState as
|
|
2218
|
+
useRef as useRef5,
|
|
2219
|
+
useState as useState8,
|
|
2171
2220
|
useLayoutEffect,
|
|
2172
2221
|
useMemo as useMemo8,
|
|
2173
|
-
useCallback as
|
|
2174
|
-
useEffect as
|
|
2222
|
+
useCallback as useCallback9,
|
|
2223
|
+
useEffect as useEffect5,
|
|
2175
2224
|
memo,
|
|
2176
2225
|
createElement
|
|
2177
2226
|
} from "react";
|
|
@@ -2179,7 +2228,7 @@ import { styled as styled12, useTheme } from "@mui/joy";
|
|
|
2179
2228
|
import { AnimatePresence as AnimatePresence2 } from "framer-motion";
|
|
2180
2229
|
|
|
2181
2230
|
// src/components/DatePicker/DatePicker.tsx
|
|
2182
|
-
import
|
|
2231
|
+
import React18, { forwardRef as forwardRef6, useCallback as useCallback8, useEffect as useEffect4, useImperativeHandle, useRef as useRef4, useState as useState7 } from "react";
|
|
2183
2232
|
import { IMaskInput, IMask } from "react-imask";
|
|
2184
2233
|
import CalendarTodayIcon from "@mui/icons-material/CalendarToday";
|
|
2185
2234
|
import { styled as styled10, useThemeProps as useThemeProps4 } from "@mui/joy";
|
|
@@ -2194,8 +2243,8 @@ var Sheet_default = Sheet;
|
|
|
2194
2243
|
|
|
2195
2244
|
// src/components/DialogActions/DialogActions.tsx
|
|
2196
2245
|
import { DialogActions as JoyDialogActions, styled as styled9 } from "@mui/joy";
|
|
2197
|
-
import { motion as
|
|
2198
|
-
var MotionDialogActions =
|
|
2246
|
+
import { motion as motion18 } from "framer-motion";
|
|
2247
|
+
var MotionDialogActions = motion18(JoyDialogActions);
|
|
2199
2248
|
var StyledDialogActions = styled9(MotionDialogActions)(({ theme }) => ({
|
|
2200
2249
|
padding: theme.spacing(2),
|
|
2201
2250
|
gap: theme.spacing(2),
|
|
@@ -2291,9 +2340,9 @@ function parseDate(dateString, format) {
|
|
|
2291
2340
|
var formatToPattern = (format) => {
|
|
2292
2341
|
return format.replace(/YYYY/g, "Y").replace(/MM/g, "M").replace(/DD/g, "D").replace(/[^YMD\s]/g, (match) => `${match}\``);
|
|
2293
2342
|
};
|
|
2294
|
-
var TextMaskAdapter3 =
|
|
2343
|
+
var TextMaskAdapter3 = React18.forwardRef(function TextMaskAdapter4(props, ref) {
|
|
2295
2344
|
const { onChange, format, ...other } = props;
|
|
2296
|
-
return /* @__PURE__ */
|
|
2345
|
+
return /* @__PURE__ */ React18.createElement(
|
|
2297
2346
|
IMaskInput,
|
|
2298
2347
|
{
|
|
2299
2348
|
...other,
|
|
@@ -2353,24 +2402,24 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2353
2402
|
shouldDisableDate,
|
|
2354
2403
|
...innerProps
|
|
2355
2404
|
} = props;
|
|
2356
|
-
const innerRef =
|
|
2357
|
-
const buttonRef =
|
|
2405
|
+
const innerRef = useRef4(null);
|
|
2406
|
+
const buttonRef = useRef4(null);
|
|
2358
2407
|
const [value, setValue] = useControlledState(
|
|
2359
2408
|
props.value,
|
|
2360
2409
|
props.defaultValue || "",
|
|
2361
|
-
|
|
2410
|
+
useCallback8((value2) => onChange?.({ target: { name: props.name, value: value2 } }), [props.name, onChange])
|
|
2362
2411
|
);
|
|
2363
|
-
const [displayValue, setDisplayValue] =
|
|
2412
|
+
const [displayValue, setDisplayValue] = useState7(
|
|
2364
2413
|
() => value ? formatValueString(parseDate(value, format), displayFormat) : ""
|
|
2365
2414
|
);
|
|
2366
|
-
const [anchorEl, setAnchorEl] =
|
|
2415
|
+
const [anchorEl, setAnchorEl] = useState7(null);
|
|
2367
2416
|
const open = Boolean(anchorEl);
|
|
2368
|
-
|
|
2417
|
+
useEffect4(() => {
|
|
2369
2418
|
if (!anchorEl) {
|
|
2370
2419
|
innerRef.current?.blur();
|
|
2371
2420
|
}
|
|
2372
2421
|
}, [anchorEl, innerRef]);
|
|
2373
|
-
|
|
2422
|
+
useEffect4(() => {
|
|
2374
2423
|
if (value === "") {
|
|
2375
2424
|
setDisplayValue("");
|
|
2376
2425
|
return;
|
|
@@ -2381,7 +2430,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2381
2430
|
}
|
|
2382
2431
|
}, [displayFormat, displayValue, format, value]);
|
|
2383
2432
|
useImperativeHandle(ref, () => innerRef.current, [innerRef]);
|
|
2384
|
-
const handleChange =
|
|
2433
|
+
const handleChange = useCallback8(
|
|
2385
2434
|
(event) => {
|
|
2386
2435
|
const value2 = event.target.value;
|
|
2387
2436
|
setDisplayValue(value2 ? formatValueString(parseDate(value2, format), displayFormat) : value2);
|
|
@@ -2389,7 +2438,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2389
2438
|
},
|
|
2390
2439
|
[displayFormat, format, setValue]
|
|
2391
2440
|
);
|
|
2392
|
-
const handleDisplayInputChange =
|
|
2441
|
+
const handleDisplayInputChange = useCallback8(
|
|
2393
2442
|
(event) => {
|
|
2394
2443
|
if (event.target.value === "") {
|
|
2395
2444
|
handleChange({
|
|
@@ -2414,7 +2463,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2414
2463
|
},
|
|
2415
2464
|
[displayFormat, format, handleChange, props.name]
|
|
2416
2465
|
);
|
|
2417
|
-
const handleCalendarToggle =
|
|
2466
|
+
const handleCalendarToggle = useCallback8(
|
|
2418
2467
|
(event) => {
|
|
2419
2468
|
setAnchorEl(anchorEl ? null : event.currentTarget);
|
|
2420
2469
|
setTimeout(() => {
|
|
@@ -2423,7 +2472,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2423
2472
|
},
|
|
2424
2473
|
[anchorEl, setAnchorEl, innerRef]
|
|
2425
2474
|
);
|
|
2426
|
-
const handleInputMouseDown =
|
|
2475
|
+
const handleInputMouseDown = useCallback8(
|
|
2427
2476
|
(event) => {
|
|
2428
2477
|
if (inputReadOnly) {
|
|
2429
2478
|
event.preventDefault();
|
|
@@ -2432,7 +2481,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2432
2481
|
},
|
|
2433
2482
|
[inputReadOnly, buttonRef]
|
|
2434
2483
|
);
|
|
2435
|
-
return /* @__PURE__ */
|
|
2484
|
+
return /* @__PURE__ */ React18.createElement(DatePickerRoot, null, /* @__PURE__ */ React18.createElement(FocusTrap, { open: true }, /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(
|
|
2436
2485
|
Input_default,
|
|
2437
2486
|
{
|
|
2438
2487
|
...innerProps,
|
|
@@ -2460,7 +2509,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2460
2509
|
},
|
|
2461
2510
|
className,
|
|
2462
2511
|
sx,
|
|
2463
|
-
endDecorator: /* @__PURE__ */
|
|
2512
|
+
endDecorator: /* @__PURE__ */ React18.createElement(
|
|
2464
2513
|
CalendarButton,
|
|
2465
2514
|
{
|
|
2466
2515
|
ref: buttonRef,
|
|
@@ -2472,13 +2521,13 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2472
2521
|
"aria-expanded": open,
|
|
2473
2522
|
disabled
|
|
2474
2523
|
},
|
|
2475
|
-
/* @__PURE__ */
|
|
2524
|
+
/* @__PURE__ */ React18.createElement(CalendarTodayIcon, null)
|
|
2476
2525
|
),
|
|
2477
2526
|
label,
|
|
2478
2527
|
helperText,
|
|
2479
2528
|
readOnly: readOnly || inputReadOnly
|
|
2480
2529
|
}
|
|
2481
|
-
), open && /* @__PURE__ */
|
|
2530
|
+
), open && /* @__PURE__ */ React18.createElement(ClickAwayListener, { onClickAway: () => setAnchorEl(null) }, /* @__PURE__ */ React18.createElement(
|
|
2482
2531
|
StyledPopper,
|
|
2483
2532
|
{
|
|
2484
2533
|
id: "date-picker-popper",
|
|
@@ -2497,7 +2546,7 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2497
2546
|
"aria-label": "Calendar Tooltip",
|
|
2498
2547
|
"aria-expanded": open
|
|
2499
2548
|
},
|
|
2500
|
-
/* @__PURE__ */
|
|
2549
|
+
/* @__PURE__ */ React18.createElement(CalendarSheet, { tabIndex: -1, role: "presentation" }, /* @__PURE__ */ React18.createElement(
|
|
2501
2550
|
Calendar_default,
|
|
2502
2551
|
{
|
|
2503
2552
|
value: value && !Number.isNaN(parseDate(value, format).getTime()) ? [parseDate(value, format), void 0] : void 0,
|
|
@@ -2516,14 +2565,14 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2516
2565
|
disablePast,
|
|
2517
2566
|
shouldDisableDate: shouldDisableDate ? (date) => shouldDisableDate(formatValueString(date, format)) : void 0
|
|
2518
2567
|
}
|
|
2519
|
-
), !hideClearButton && /* @__PURE__ */
|
|
2568
|
+
), !hideClearButton && /* @__PURE__ */ React18.createElement(
|
|
2520
2569
|
DialogActions_default,
|
|
2521
2570
|
{
|
|
2522
2571
|
sx: {
|
|
2523
2572
|
p: 1
|
|
2524
2573
|
}
|
|
2525
2574
|
},
|
|
2526
|
-
/* @__PURE__ */
|
|
2575
|
+
/* @__PURE__ */ React18.createElement(
|
|
2527
2576
|
Button_default,
|
|
2528
2577
|
{
|
|
2529
2578
|
size,
|
|
@@ -2549,10 +2598,10 @@ var DatePicker = forwardRef6((inProps, ref) => {
|
|
|
2549
2598
|
var DatePicker_default = DatePicker;
|
|
2550
2599
|
|
|
2551
2600
|
// src/components/Textarea/Textarea.tsx
|
|
2552
|
-
import
|
|
2601
|
+
import React19 from "react";
|
|
2553
2602
|
import { Textarea as JoyTextarea } from "@mui/joy";
|
|
2554
|
-
import { motion as
|
|
2555
|
-
var MotionTextarea =
|
|
2603
|
+
import { motion as motion19 } from "framer-motion";
|
|
2604
|
+
var MotionTextarea = motion19(JoyTextarea);
|
|
2556
2605
|
var Textarea = (props) => {
|
|
2557
2606
|
const {
|
|
2558
2607
|
label,
|
|
@@ -2569,7 +2618,7 @@ var Textarea = (props) => {
|
|
|
2569
2618
|
className,
|
|
2570
2619
|
...innerProps
|
|
2571
2620
|
} = props;
|
|
2572
|
-
const textarea = /* @__PURE__ */
|
|
2621
|
+
const textarea = /* @__PURE__ */ React19.createElement(
|
|
2573
2622
|
MotionTextarea,
|
|
2574
2623
|
{
|
|
2575
2624
|
required,
|
|
@@ -2581,7 +2630,7 @@ var Textarea = (props) => {
|
|
|
2581
2630
|
...innerProps
|
|
2582
2631
|
}
|
|
2583
2632
|
);
|
|
2584
|
-
return /* @__PURE__ */
|
|
2633
|
+
return /* @__PURE__ */ React19.createElement(
|
|
2585
2634
|
FormControl_default,
|
|
2586
2635
|
{
|
|
2587
2636
|
required,
|
|
@@ -2592,9 +2641,9 @@ var Textarea = (props) => {
|
|
|
2592
2641
|
sx,
|
|
2593
2642
|
className
|
|
2594
2643
|
},
|
|
2595
|
-
label && /* @__PURE__ */
|
|
2644
|
+
label && /* @__PURE__ */ React19.createElement(FormLabel_default, null, label),
|
|
2596
2645
|
textarea,
|
|
2597
|
-
helperText && /* @__PURE__ */
|
|
2646
|
+
helperText && /* @__PURE__ */ React19.createElement(FormHelperText_default, null, helperText)
|
|
2598
2647
|
);
|
|
2599
2648
|
};
|
|
2600
2649
|
Textarea.displayName = "Textarea";
|
|
@@ -2603,10 +2652,10 @@ Textarea.displayName = "Textarea";
|
|
|
2603
2652
|
var Textarea_default = Textarea;
|
|
2604
2653
|
|
|
2605
2654
|
// src/components/Select/Select.tsx
|
|
2606
|
-
import
|
|
2655
|
+
import React20, { useMemo as useMemo7 } from "react";
|
|
2607
2656
|
import { Select as JoySelect, Option as JoyOption, ListItemContent as ListItemContent2, Typography as Typography3 } from "@mui/joy";
|
|
2608
|
-
import { motion as
|
|
2609
|
-
var MotionOption =
|
|
2657
|
+
import { motion as motion20 } from "framer-motion";
|
|
2658
|
+
var MotionOption = motion20(JoyOption);
|
|
2610
2659
|
var Option = MotionOption;
|
|
2611
2660
|
var secondaryTextLevelMap2 = {
|
|
2612
2661
|
sm: "body-xs",
|
|
@@ -2661,7 +2710,7 @@ function Select(props) {
|
|
|
2661
2710
|
});
|
|
2662
2711
|
return map;
|
|
2663
2712
|
}, [options]);
|
|
2664
|
-
const select = /* @__PURE__ */
|
|
2713
|
+
const select = /* @__PURE__ */ React20.createElement(
|
|
2665
2714
|
JoySelect,
|
|
2666
2715
|
{
|
|
2667
2716
|
...innerProps,
|
|
@@ -2678,9 +2727,9 @@ function Select(props) {
|
|
|
2678
2727
|
return optionMap.get(selected.value)?.label;
|
|
2679
2728
|
}
|
|
2680
2729
|
},
|
|
2681
|
-
options.map((option) => /* @__PURE__ */
|
|
2730
|
+
options.map((option) => /* @__PURE__ */ React20.createElement(Option, { key: option.value, value: option.value, disabled: option.disabled }, option.secondaryText ? /* @__PURE__ */ React20.createElement(ListItemContent2, { sx: { gap: 0.5 } }, /* @__PURE__ */ React20.createElement(Typography3, { level: "inherit" }, option.label), /* @__PURE__ */ React20.createElement(Typography3, { level: secondaryTextLevelMap2[size ?? "md"], textColor: "text.tertiary" }, option.secondaryText)) : option.label))
|
|
2682
2731
|
);
|
|
2683
|
-
return /* @__PURE__ */
|
|
2732
|
+
return /* @__PURE__ */ React20.createElement(
|
|
2684
2733
|
FormControl_default,
|
|
2685
2734
|
{
|
|
2686
2735
|
required,
|
|
@@ -2691,9 +2740,9 @@ function Select(props) {
|
|
|
2691
2740
|
sx,
|
|
2692
2741
|
className
|
|
2693
2742
|
},
|
|
2694
|
-
label && /* @__PURE__ */
|
|
2743
|
+
label && /* @__PURE__ */ React20.createElement(FormLabel_default, null, label),
|
|
2695
2744
|
select,
|
|
2696
|
-
helperText && /* @__PURE__ */
|
|
2745
|
+
helperText && /* @__PURE__ */ React20.createElement(FormHelperText_default, null, helperText)
|
|
2697
2746
|
);
|
|
2698
2747
|
}
|
|
2699
2748
|
Select.displayName = "Select";
|
|
@@ -2704,19 +2753,6 @@ var Select_default = Select;
|
|
|
2704
2753
|
// src/components/DataTable/components.tsx
|
|
2705
2754
|
import { Link } from "@mui/joy";
|
|
2706
2755
|
|
|
2707
|
-
// src/components/Tooltip/Tooltip.tsx
|
|
2708
|
-
import React20 from "react";
|
|
2709
|
-
import { Tooltip as JoyTooltip } from "@mui/joy";
|
|
2710
|
-
import { motion as motion20 } from "framer-motion";
|
|
2711
|
-
var MotionTooltip = motion20(JoyTooltip);
|
|
2712
|
-
var Tooltip = (props) => {
|
|
2713
|
-
return /* @__PURE__ */ React20.createElement(MotionTooltip, { ...props });
|
|
2714
|
-
};
|
|
2715
|
-
Tooltip.displayName = "Tooltip";
|
|
2716
|
-
|
|
2717
|
-
// src/components/Tooltip/index.ts
|
|
2718
|
-
var Tooltip_default = Tooltip;
|
|
2719
|
-
|
|
2720
2756
|
// src/components/InfoSign/InfoSign.tsx
|
|
2721
2757
|
import React21 from "react";
|
|
2722
2758
|
import { styled as styled11, tooltipClasses } from "@mui/joy";
|
|
@@ -2751,25 +2787,26 @@ function InfoSign(props) {
|
|
|
2751
2787
|
var InfoSign_default = InfoSign;
|
|
2752
2788
|
|
|
2753
2789
|
// src/components/DataTable/components.tsx
|
|
2754
|
-
var TextEllipsis = ({ children }) => {
|
|
2755
|
-
const textRef =
|
|
2756
|
-
const [showTooltip, setShowTooltip] =
|
|
2790
|
+
var TextEllipsis = ({ children, lineClamp }) => {
|
|
2791
|
+
const textRef = useRef5(null);
|
|
2792
|
+
const [showTooltip, setShowTooltip] = useState8(false);
|
|
2757
2793
|
useLayoutEffect(() => {
|
|
2758
2794
|
const element = textRef.current;
|
|
2759
|
-
if (element)
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
2763
|
-
|
|
2764
|
-
|
|
2765
|
-
|
|
2766
|
-
|
|
2767
|
-
|
|
2768
|
-
|
|
2795
|
+
if (!element) return;
|
|
2796
|
+
const checkTruncation = () => {
|
|
2797
|
+
const isTruncated = lineClamp && lineClamp > 1 ? element.scrollHeight > element.clientHeight + 1 : element.scrollWidth > element.clientWidth;
|
|
2798
|
+
setShowTooltip(isTruncated);
|
|
2799
|
+
};
|
|
2800
|
+
checkTruncation();
|
|
2801
|
+
const ro = new ResizeObserver(checkTruncation);
|
|
2802
|
+
ro.observe(element);
|
|
2803
|
+
return () => ro.disconnect();
|
|
2804
|
+
}, [children, lineClamp]);
|
|
2805
|
+
return /* @__PURE__ */ React22.createElement(Tooltip_default, { title: showTooltip ? children : "", placement: "top", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React22.createElement(EllipsisDiv, { ref: textRef, lineClamp }, children));
|
|
2769
2806
|
};
|
|
2770
2807
|
var CellTextEllipsis = ({ children }) => {
|
|
2771
|
-
const textRef =
|
|
2772
|
-
const [showTooltip, setShowTooltip] =
|
|
2808
|
+
const textRef = useRef5(null);
|
|
2809
|
+
const [showTooltip, setShowTooltip] = useState8(false);
|
|
2773
2810
|
useLayoutEffect(() => {
|
|
2774
2811
|
const element = textRef.current;
|
|
2775
2812
|
if (element) {
|
|
@@ -2816,12 +2853,13 @@ var HeadCell = (props) => {
|
|
|
2816
2853
|
pinnedEndPosition,
|
|
2817
2854
|
headerRef,
|
|
2818
2855
|
tableColRef,
|
|
2819
|
-
headerClassName
|
|
2856
|
+
headerClassName,
|
|
2857
|
+
headerLineClamp
|
|
2820
2858
|
} = props;
|
|
2821
2859
|
const theme = useTheme();
|
|
2822
2860
|
const ref = headerRef;
|
|
2823
2861
|
const colRef = tableColRef;
|
|
2824
|
-
const [isHovered, setIsHovered] =
|
|
2862
|
+
const [isHovered, setIsHovered] = useState8(false);
|
|
2825
2863
|
const sortable = type === "actions" ? false : _sortable;
|
|
2826
2864
|
const headId = useMemo8(
|
|
2827
2865
|
() => `${tableId}_header_${headerName ?? field}`.trim(),
|
|
@@ -2900,7 +2938,7 @@ var HeadCell = (props) => {
|
|
|
2900
2938
|
ref,
|
|
2901
2939
|
key: field,
|
|
2902
2940
|
style,
|
|
2903
|
-
onClick:
|
|
2941
|
+
onClick: useCallback9(
|
|
2904
2942
|
(e) => sortable && onSortChange?.({ field, currentSort: sort, multiple: e.shiftKey }),
|
|
2905
2943
|
[field, onSortChange, sort, sortable]
|
|
2906
2944
|
),
|
|
@@ -2910,7 +2948,7 @@ var HeadCell = (props) => {
|
|
|
2910
2948
|
initial: "initial",
|
|
2911
2949
|
className: computedHeaderClassName
|
|
2912
2950
|
},
|
|
2913
|
-
/* @__PURE__ */ React22.createElement(Stack_default, { gap: 1, direction: "row", justifyContent: textAlign, alignItems: "center" }, textAlign === "end" && sortIcon, textAlign === "end" && infoSign, /* @__PURE__ */ React22.createElement(TextEllipsis,
|
|
2951
|
+
/* @__PURE__ */ React22.createElement(Stack_default, { gap: 1, direction: "row", justifyContent: textAlign, alignItems: "center", sx: { minWidth: 0 } }, textAlign === "end" && sortIcon, textAlign === "end" && infoSign, /* @__PURE__ */ React22.createElement(TextEllipsis, { lineClamp: headerLineClamp }, headerName ?? field, editMode && required && /* @__PURE__ */ React22.createElement(Asterisk, null, "*")), textAlign === "start" && infoSign, textAlign === "start" && sortIcon),
|
|
2914
2952
|
resizer
|
|
2915
2953
|
);
|
|
2916
2954
|
};
|
|
@@ -2935,8 +2973,8 @@ var BodyCell = (props) => {
|
|
|
2935
2973
|
onCellEditStop
|
|
2936
2974
|
} = props;
|
|
2937
2975
|
const theme = useTheme();
|
|
2938
|
-
const [value, setValue] =
|
|
2939
|
-
const cellRef =
|
|
2976
|
+
const [value, setValue] = useState8(row[field]);
|
|
2977
|
+
const cellRef = useRef5(null);
|
|
2940
2978
|
const params = useMemo8(
|
|
2941
2979
|
() => ({
|
|
2942
2980
|
row,
|
|
@@ -3081,7 +3119,7 @@ var BodyCell = (props) => {
|
|
|
3081
3119
|
() => (typeof cellClassName === "function" ? cellClassName(params) : cellClassName) || "",
|
|
3082
3120
|
[cellClassName, params]
|
|
3083
3121
|
);
|
|
3084
|
-
|
|
3122
|
+
useEffect5(() => {
|
|
3085
3123
|
setValue(row[field]);
|
|
3086
3124
|
}, [row, field]);
|
|
3087
3125
|
return /* @__PURE__ */ React22.createElement(
|
|
@@ -3151,10 +3189,10 @@ var VirtualizedTableRow = memo(StyledTableRow2, (prevProps, nextProps) => {
|
|
|
3151
3189
|
});
|
|
3152
3190
|
|
|
3153
3191
|
// src/components/DataTable/hooks.ts
|
|
3154
|
-
import { useState as
|
|
3192
|
+
import { useState as useState9, useLayoutEffect as useLayoutEffect2, useRef as useRef6, useMemo as useMemo9, useCallback as useCallback10, useEffect as useEffect6, createRef } from "react";
|
|
3155
3193
|
function useColumnWidths(columnsByField) {
|
|
3156
|
-
const [widths, setWidths] =
|
|
3157
|
-
const roRef =
|
|
3194
|
+
const [widths, setWidths] = useState9({});
|
|
3195
|
+
const roRef = useRef6();
|
|
3158
3196
|
useLayoutEffect2(() => {
|
|
3159
3197
|
if (roRef.current) roRef.current.disconnect();
|
|
3160
3198
|
roRef.current = new ResizeObserver((entries) => {
|
|
@@ -3209,14 +3247,14 @@ function useDataTableRenderer({
|
|
|
3209
3247
|
"You cannot use both `pinnedColumns` and `columnGroupingModel` at the same time. Please choose one of them."
|
|
3210
3248
|
);
|
|
3211
3249
|
}
|
|
3212
|
-
const onSelectionModelChangeRef =
|
|
3250
|
+
const onSelectionModelChangeRef = useRef6(onSelectionModelChange);
|
|
3213
3251
|
onSelectionModelChangeRef.current = onSelectionModelChange;
|
|
3214
|
-
const [focusedRowId, setFocusedRowId] =
|
|
3215
|
-
const [selectionAnchor, setSelectionAnchor] =
|
|
3252
|
+
const [focusedRowId, setFocusedRowId] = useState9(null);
|
|
3253
|
+
const [selectionAnchor, setSelectionAnchor] = useState9(null);
|
|
3216
3254
|
const [sortModel, setSortModel] = useControlledState(
|
|
3217
3255
|
controlledSortModel,
|
|
3218
3256
|
initialState?.sorting?.sortModel ?? [],
|
|
3219
|
-
|
|
3257
|
+
useCallback10((sortModel2) => onSortModelChange?.(sortModel2), [onSortModelChange])
|
|
3220
3258
|
);
|
|
3221
3259
|
const reorderedColumns = useMemo9(() => {
|
|
3222
3260
|
if (!columnGroupingModel) return columnsProp;
|
|
@@ -3236,7 +3274,7 @@ function useDataTableRenderer({
|
|
|
3236
3274
|
),
|
|
3237
3275
|
[reorderedColumns]
|
|
3238
3276
|
);
|
|
3239
|
-
const sortComparator =
|
|
3277
|
+
const sortComparator = useCallback10(
|
|
3240
3278
|
(rowA, rowB) => {
|
|
3241
3279
|
for (const sort of sortModel) {
|
|
3242
3280
|
const { field, sort: direction } = sort;
|
|
@@ -3272,9 +3310,9 @@ function useDataTableRenderer({
|
|
|
3272
3310
|
() => Array.from(new Set(_sortOrder || ["asc", "desc", null])),
|
|
3273
3311
|
[_sortOrder]
|
|
3274
3312
|
);
|
|
3275
|
-
const [page, setPage] =
|
|
3313
|
+
const [page, setPage] = useState9(paginationModel?.page || 1);
|
|
3276
3314
|
const pageSize = paginationModel?.pageSize || 20;
|
|
3277
|
-
const getId =
|
|
3315
|
+
const getId = useCallback10(
|
|
3278
3316
|
(row, index) => _getId?.(row) ?? row.id ?? `${(index || 0) + (page - 1) * pageSize}`,
|
|
3279
3317
|
[_getId, page, pageSize]
|
|
3280
3318
|
);
|
|
@@ -3290,7 +3328,7 @@ function useDataTableRenderer({
|
|
|
3290
3328
|
}),
|
|
3291
3329
|
[dataInPage, isRowSelectable, getId]
|
|
3292
3330
|
);
|
|
3293
|
-
const handleRangeSelection =
|
|
3331
|
+
const handleRangeSelection = useCallback10(
|
|
3294
3332
|
(anchor, targetIndex) => {
|
|
3295
3333
|
const startIndex = Math.min(anchor.rowIndex, targetIndex);
|
|
3296
3334
|
const endIndex = Math.max(anchor.rowIndex, targetIndex);
|
|
@@ -3327,7 +3365,7 @@ function useDataTableRenderer({
|
|
|
3327
3365
|
[_isTotalSelected, selectionModel, selectableRowCount]
|
|
3328
3366
|
);
|
|
3329
3367
|
const columnWidths = useColumnWidths(columnsByField);
|
|
3330
|
-
const getWidth =
|
|
3368
|
+
const getWidth = useCallback10(
|
|
3331
3369
|
(f) => columnWidths[f] ?? columnsByField[f].width ?? // Column prop 으로 지정된 width
|
|
3332
3370
|
columnsByField[f].minWidth ?? 0,
|
|
3333
3371
|
[columnWidths, columnsByField]
|
|
@@ -3369,14 +3407,14 @@ function useDataTableRenderer({
|
|
|
3369
3407
|
sortOrder,
|
|
3370
3408
|
getWidth
|
|
3371
3409
|
]);
|
|
3372
|
-
const handlePageChange =
|
|
3410
|
+
const handlePageChange = useCallback10(
|
|
3373
3411
|
(newPage) => {
|
|
3374
3412
|
setPage(newPage);
|
|
3375
3413
|
onPaginationModelChange?.({ page: newPage, pageSize });
|
|
3376
3414
|
},
|
|
3377
3415
|
[onPaginationModelChange, pageSize]
|
|
3378
3416
|
);
|
|
3379
|
-
const handleSortChange =
|
|
3417
|
+
const handleSortChange = useCallback10(
|
|
3380
3418
|
(props) => {
|
|
3381
3419
|
const { field, currentSort, multiple } = props;
|
|
3382
3420
|
const column = columnsByField[field];
|
|
@@ -3399,23 +3437,23 @@ function useDataTableRenderer({
|
|
|
3399
3437
|
},
|
|
3400
3438
|
[sortOrder, columnsByField, sortModel, setSortModel]
|
|
3401
3439
|
);
|
|
3402
|
-
|
|
3440
|
+
useEffect6(() => {
|
|
3403
3441
|
if (!paginationModel) {
|
|
3404
3442
|
handlePageChange(1);
|
|
3405
3443
|
}
|
|
3406
3444
|
}, [rowCount, handlePageChange, paginationModel]);
|
|
3407
|
-
|
|
3445
|
+
useEffect6(() => {
|
|
3408
3446
|
const lastPage = Math.max(1, Math.ceil(rowCount / pageSize));
|
|
3409
3447
|
if (page > lastPage) {
|
|
3410
3448
|
handlePageChange(lastPage);
|
|
3411
3449
|
}
|
|
3412
3450
|
}, [page, rowCount, pageSize, handlePageChange]);
|
|
3413
|
-
|
|
3451
|
+
useEffect6(() => {
|
|
3414
3452
|
onSelectionModelChangeRef.current?.([]);
|
|
3415
3453
|
setSelectionAnchor(null);
|
|
3416
3454
|
}, [page]);
|
|
3417
|
-
const prevRowsRef =
|
|
3418
|
-
|
|
3455
|
+
const prevRowsRef = useRef6(_rows);
|
|
3456
|
+
useEffect6(() => {
|
|
3419
3457
|
if (prevRowsRef.current !== _rows) {
|
|
3420
3458
|
setSelectionAnchor(null);
|
|
3421
3459
|
prevRowsRef.current = _rows;
|
|
@@ -3434,8 +3472,8 @@ function useDataTableRenderer({
|
|
|
3434
3472
|
handleSortChange,
|
|
3435
3473
|
isAllSelected,
|
|
3436
3474
|
isTotalSelected,
|
|
3437
|
-
isSelectedRow:
|
|
3438
|
-
isRowSelectable:
|
|
3475
|
+
isSelectedRow: useCallback10((model) => selectedModelSet.has(model), [selectedModelSet]),
|
|
3476
|
+
isRowSelectable: useCallback10(
|
|
3439
3477
|
(rowId, row) => {
|
|
3440
3478
|
if (!isRowSelectable) return true;
|
|
3441
3479
|
return isRowSelectable({ row, id: rowId });
|
|
@@ -3443,13 +3481,13 @@ function useDataTableRenderer({
|
|
|
3443
3481
|
[isRowSelectable]
|
|
3444
3482
|
),
|
|
3445
3483
|
focusedRowId,
|
|
3446
|
-
onRowFocus:
|
|
3484
|
+
onRowFocus: useCallback10((rowId) => {
|
|
3447
3485
|
setFocusedRowId(rowId);
|
|
3448
3486
|
}, []),
|
|
3449
|
-
onAllCheckboxChange:
|
|
3487
|
+
onAllCheckboxChange: useCallback10(() => {
|
|
3450
3488
|
onSelectionModelChange?.(isAllSelected ? [] : selectableDataInPage.map(getId));
|
|
3451
3489
|
}, [isAllSelected, selectableDataInPage, onSelectionModelChange, getId]),
|
|
3452
|
-
onCheckboxChange:
|
|
3490
|
+
onCheckboxChange: useCallback10(
|
|
3453
3491
|
(event, selectedModel) => {
|
|
3454
3492
|
const isShiftClick = "shiftKey" in event && event.shiftKey;
|
|
3455
3493
|
const rowIndex = dataInPage.findIndex((row, i) => getId(row, i) === selectedModel);
|
|
@@ -3482,7 +3520,7 @@ function useDataTableRenderer({
|
|
|
3482
3520
|
),
|
|
3483
3521
|
columns,
|
|
3484
3522
|
processedColumnGroups,
|
|
3485
|
-
onTotalSelect:
|
|
3523
|
+
onTotalSelect: useCallback10(() => {
|
|
3486
3524
|
const selectableRows = rows.filter((row, i) => {
|
|
3487
3525
|
if (!isRowSelectable) return true;
|
|
3488
3526
|
return isRowSelectable({ row, id: getId(row, i) });
|
|
@@ -3567,7 +3605,7 @@ function TableBody(props) {
|
|
|
3567
3605
|
TableBody.displayName = "TableBody";
|
|
3568
3606
|
|
|
3569
3607
|
// src/components/Pagination/Pagination.tsx
|
|
3570
|
-
import React24, { useCallback as
|
|
3608
|
+
import React24, { useCallback as useCallback11, useEffect as useEffect7 } from "react";
|
|
3571
3609
|
import PreviousIcon from "@mui/icons-material/ChevronLeftRounded";
|
|
3572
3610
|
import NextIcon from "@mui/icons-material/ChevronRightRounded";
|
|
3573
3611
|
import FirstPageIcon from "@mui/icons-material/FirstPageRounded";
|
|
@@ -3636,7 +3674,7 @@ function Pagination(props) {
|
|
|
3636
3674
|
const [paginationModel, setPaginationModel] = useControlledState(
|
|
3637
3675
|
_paginationModel,
|
|
3638
3676
|
defaultPaginationModel,
|
|
3639
|
-
|
|
3677
|
+
useCallback11(
|
|
3640
3678
|
(newPage) => {
|
|
3641
3679
|
onPageChange(newPage.page);
|
|
3642
3680
|
},
|
|
@@ -3652,7 +3690,7 @@ function Pagination(props) {
|
|
|
3652
3690
|
const afterPages = [paginationModel.page + 1, paginationModel.page + 2].filter((p) => p <= lastPage - 1);
|
|
3653
3691
|
const isMoreAfterPages = lastPage > 1 && paginationModel.page < lastPage - 3;
|
|
3654
3692
|
const isMoreBeforePages = lastPage > 1 && paginationModel.page > 4;
|
|
3655
|
-
|
|
3693
|
+
useEffect7(() => {
|
|
3656
3694
|
if (paginationModel.page > lastPage) {
|
|
3657
3695
|
setPaginationModel({ ...paginationModel, page: lastPage });
|
|
3658
3696
|
}
|
|
@@ -3835,8 +3873,8 @@ function Component(props, apiRef) {
|
|
|
3835
3873
|
...innerProps
|
|
3836
3874
|
} = props;
|
|
3837
3875
|
const tableId = useId();
|
|
3838
|
-
const parentRef =
|
|
3839
|
-
const tableBodyRef =
|
|
3876
|
+
const parentRef = useRef7(null);
|
|
3877
|
+
const tableBodyRef = useRef7(null);
|
|
3840
3878
|
const {
|
|
3841
3879
|
columns,
|
|
3842
3880
|
processedColumnGroups,
|
|
@@ -3873,20 +3911,20 @@ function Component(props, apiRef) {
|
|
|
3873
3911
|
const paginationModel = useMemo10(() => ({ page, pageSize }), [page, pageSize]);
|
|
3874
3912
|
const totalSize = virtualizer.getTotalSize();
|
|
3875
3913
|
const virtualizedItems = virtualizer.getVirtualItems();
|
|
3876
|
-
const getRowClickHandler =
|
|
3914
|
+
const getRowClickHandler = useCallback12(
|
|
3877
3915
|
(row, rowId) => (e) => {
|
|
3878
3916
|
onRowClick?.({ row, rowId }, e);
|
|
3879
3917
|
checkboxSelection && !disableSelectionOnClick && isRowSelectableCheck(rowId, row) && onCheckboxChange(e, rowId);
|
|
3880
3918
|
},
|
|
3881
3919
|
[onRowClick, checkboxSelection, disableSelectionOnClick, onCheckboxChange, isRowSelectableCheck]
|
|
3882
3920
|
);
|
|
3883
|
-
const getRowFocusHandler =
|
|
3921
|
+
const getRowFocusHandler = useCallback12(
|
|
3884
3922
|
(rowId) => () => {
|
|
3885
3923
|
onRowFocus(rowId);
|
|
3886
3924
|
},
|
|
3887
3925
|
[onRowFocus]
|
|
3888
3926
|
);
|
|
3889
|
-
const getCheckboxClickHandler =
|
|
3927
|
+
const getCheckboxClickHandler = useCallback12(
|
|
3890
3928
|
(rowId, row) => (e) => {
|
|
3891
3929
|
e.stopPropagation();
|
|
3892
3930
|
if (isRowSelectableCheck(rowId, row)) {
|
|
@@ -3896,7 +3934,7 @@ function Component(props, apiRef) {
|
|
|
3896
3934
|
},
|
|
3897
3935
|
[onCheckboxChange, isRowSelectableCheck, onRowFocus]
|
|
3898
3936
|
);
|
|
3899
|
-
const handleTableKeyDown =
|
|
3937
|
+
const handleTableKeyDown = useCallback12(
|
|
3900
3938
|
(e) => {
|
|
3901
3939
|
const supportedKeys = ["ArrowUp", "ArrowDown", " ", "Home", "End", "PageUp", "PageDown"];
|
|
3902
3940
|
if (!supportedKeys.includes(e.key)) return;
|
|
@@ -4238,7 +4276,7 @@ var DataTable = forwardRef7(Component);
|
|
|
4238
4276
|
DataTable.displayName = "DataTable";
|
|
4239
4277
|
|
|
4240
4278
|
// src/components/DateRangePicker/DateRangePicker.tsx
|
|
4241
|
-
import React26, { forwardRef as forwardRef8, useCallback as
|
|
4279
|
+
import React26, { forwardRef as forwardRef8, useCallback as useCallback13, useEffect as useEffect8, useImperativeHandle as useImperativeHandle3, useMemo as useMemo11, useRef as useRef8, useState as useState10 } from "react";
|
|
4242
4280
|
import { IMaskInput as IMaskInput2, IMask as IMask2 } from "react-imask";
|
|
4243
4281
|
import CalendarTodayIcon2 from "@mui/icons-material/CalendarToday";
|
|
4244
4282
|
import { styled as styled14, useThemeProps as useThemeProps5 } from "@mui/joy";
|
|
@@ -4399,23 +4437,23 @@ var DateRangePicker = forwardRef8((inProps, ref) => {
|
|
|
4399
4437
|
readOnly,
|
|
4400
4438
|
...innerProps
|
|
4401
4439
|
} = props;
|
|
4402
|
-
const innerRef =
|
|
4403
|
-
const buttonRef =
|
|
4440
|
+
const innerRef = useRef8(null);
|
|
4441
|
+
const buttonRef = useRef8(null);
|
|
4404
4442
|
const [value, setValue] = useControlledState(
|
|
4405
4443
|
props.value,
|
|
4406
4444
|
props.defaultValue || "",
|
|
4407
|
-
|
|
4445
|
+
useCallback13((value2) => onChange?.({ target: { name: props.name, value: value2 } }), [props.name, onChange])
|
|
4408
4446
|
);
|
|
4409
|
-
const [displayValue, setDisplayValue] =
|
|
4447
|
+
const [displayValue, setDisplayValue] = useState10(
|
|
4410
4448
|
() => value ? formatValueString2(parseDates(value, format), displayFormat) : ""
|
|
4411
4449
|
);
|
|
4412
|
-
const [anchorEl, setAnchorEl] =
|
|
4450
|
+
const [anchorEl, setAnchorEl] = useState10(null);
|
|
4413
4451
|
const open = Boolean(anchorEl);
|
|
4414
4452
|
const calendarValue = useMemo11(
|
|
4415
4453
|
() => value ? parseDates(value, format) : void 0,
|
|
4416
4454
|
[value, format]
|
|
4417
4455
|
);
|
|
4418
|
-
|
|
4456
|
+
useEffect8(() => {
|
|
4419
4457
|
if (value) {
|
|
4420
4458
|
try {
|
|
4421
4459
|
const dates = parseDates(value, format);
|
|
@@ -4427,13 +4465,13 @@ var DateRangePicker = forwardRef8((inProps, ref) => {
|
|
|
4427
4465
|
setDisplayValue("");
|
|
4428
4466
|
}
|
|
4429
4467
|
}, [displayFormat, value, format]);
|
|
4430
|
-
|
|
4468
|
+
useEffect8(() => {
|
|
4431
4469
|
if (!anchorEl) {
|
|
4432
4470
|
innerRef.current?.blur();
|
|
4433
4471
|
}
|
|
4434
4472
|
}, [anchorEl, innerRef]);
|
|
4435
4473
|
useImperativeHandle3(ref, () => innerRef.current, [innerRef]);
|
|
4436
|
-
const handleChange =
|
|
4474
|
+
const handleChange = useCallback13(
|
|
4437
4475
|
(event) => {
|
|
4438
4476
|
const value2 = event.target.value;
|
|
4439
4477
|
setDisplayValue(value2 ? formatValueString2(parseDates(value2, format), displayFormat) : value2);
|
|
@@ -4441,7 +4479,7 @@ var DateRangePicker = forwardRef8((inProps, ref) => {
|
|
|
4441
4479
|
},
|
|
4442
4480
|
[displayFormat, format, setValue]
|
|
4443
4481
|
);
|
|
4444
|
-
const handleDisplayInputChange =
|
|
4482
|
+
const handleDisplayInputChange = useCallback13(
|
|
4445
4483
|
(event) => {
|
|
4446
4484
|
if (event.target.value === "") {
|
|
4447
4485
|
handleChange({
|
|
@@ -4466,14 +4504,14 @@ var DateRangePicker = forwardRef8((inProps, ref) => {
|
|
|
4466
4504
|
},
|
|
4467
4505
|
[displayFormat, format, handleChange, props.name]
|
|
4468
4506
|
);
|
|
4469
|
-
const handleCalendarToggle =
|
|
4507
|
+
const handleCalendarToggle = useCallback13(
|
|
4470
4508
|
(event) => {
|
|
4471
4509
|
setAnchorEl(anchorEl ? null : event.currentTarget);
|
|
4472
4510
|
innerRef.current?.focus();
|
|
4473
4511
|
},
|
|
4474
4512
|
[anchorEl, setAnchorEl, innerRef]
|
|
4475
4513
|
);
|
|
4476
|
-
const handleCalendarChange =
|
|
4514
|
+
const handleCalendarChange = useCallback13(
|
|
4477
4515
|
([date1, date2]) => {
|
|
4478
4516
|
if (!date1 || !date2) return;
|
|
4479
4517
|
const formattedValue = formatValueString2([date1, date2], format);
|
|
@@ -4487,7 +4525,7 @@ var DateRangePicker = forwardRef8((inProps, ref) => {
|
|
|
4487
4525
|
},
|
|
4488
4526
|
[props.value, props.name, onChange, setValue, setAnchorEl, format, displayFormat]
|
|
4489
4527
|
);
|
|
4490
|
-
const handleInputMouseDown =
|
|
4528
|
+
const handleInputMouseDown = useCallback13(
|
|
4491
4529
|
(event) => {
|
|
4492
4530
|
if (inputReadOnly) {
|
|
4493
4531
|
event.preventDefault();
|
|
@@ -4696,13 +4734,13 @@ var InsetDrawer = styled19(JoyDrawer)(({ theme }) => ({
|
|
|
4696
4734
|
}));
|
|
4697
4735
|
|
|
4698
4736
|
// src/components/FilterableCheckboxGroup/FilterableCheckboxGroup.tsx
|
|
4699
|
-
import React30, { useCallback as
|
|
4737
|
+
import React30, { useCallback as useCallback14, useEffect as useEffect9, useMemo as useMemo12, useRef as useRef9, useState as useState11 } from "react";
|
|
4700
4738
|
import SearchIcon from "@mui/icons-material/Search";
|
|
4701
4739
|
import { useVirtualizer as useVirtualizer3 } from "@tanstack/react-virtual";
|
|
4702
4740
|
function LabelWithTooltip(props) {
|
|
4703
4741
|
const { label, size } = props;
|
|
4704
|
-
const labelContentRef =
|
|
4705
|
-
const [isOverflowing, setIsOverflowing] =
|
|
4742
|
+
const labelContentRef = useRef9(null);
|
|
4743
|
+
const [isOverflowing, setIsOverflowing] = useState11(false);
|
|
4706
4744
|
const labelContent = /* @__PURE__ */ React30.createElement(
|
|
4707
4745
|
"span",
|
|
4708
4746
|
{
|
|
@@ -4719,7 +4757,7 @@ function LabelWithTooltip(props) {
|
|
|
4719
4757
|
},
|
|
4720
4758
|
label
|
|
4721
4759
|
);
|
|
4722
|
-
|
|
4760
|
+
useEffect9(() => {
|
|
4723
4761
|
const element = labelContentRef.current;
|
|
4724
4762
|
if (element) {
|
|
4725
4763
|
setIsOverflowing(element.scrollWidth > element.clientWidth);
|
|
@@ -4743,16 +4781,16 @@ function FilterableCheckboxGroup(props) {
|
|
|
4743
4781
|
maxHeight = 300,
|
|
4744
4782
|
disabled
|
|
4745
4783
|
} = props;
|
|
4746
|
-
const [searchTerm, setSearchTerm] =
|
|
4747
|
-
const [sortedOptions, setSortedOptions] =
|
|
4784
|
+
const [searchTerm, setSearchTerm] = useState11("");
|
|
4785
|
+
const [sortedOptions, setSortedOptions] = useState11(options);
|
|
4748
4786
|
const [internalValue, setInternalValue] = useControlledState(
|
|
4749
4787
|
value,
|
|
4750
4788
|
value ?? [],
|
|
4751
|
-
|
|
4789
|
+
useCallback14((newValue) => onChange?.(newValue), [onChange])
|
|
4752
4790
|
);
|
|
4753
|
-
const parentRef =
|
|
4754
|
-
const isInitialSortRef =
|
|
4755
|
-
const prevOptionsRef =
|
|
4791
|
+
const parentRef = useRef9(null);
|
|
4792
|
+
const isInitialSortRef = useRef9(false);
|
|
4793
|
+
const prevOptionsRef = useRef9([...options]);
|
|
4756
4794
|
const filteredOptions = useMemo12(() => {
|
|
4757
4795
|
if (!searchTerm) return sortedOptions;
|
|
4758
4796
|
return sortedOptions.filter((option) => option.label.toLowerCase().includes(searchTerm.toLowerCase()));
|
|
@@ -4775,7 +4813,7 @@ function FilterableCheckboxGroup(props) {
|
|
|
4775
4813
|
overscan: 5
|
|
4776
4814
|
});
|
|
4777
4815
|
const items = virtualizer.getVirtualItems();
|
|
4778
|
-
|
|
4816
|
+
useEffect9(() => {
|
|
4779
4817
|
const optionsChanged = prevOptionsRef.current.length !== options.length || prevOptionsRef.current.some(
|
|
4780
4818
|
(prevOption, index) => prevOption.value !== options[index]?.value || prevOption.label !== options[index]?.label || prevOption.disabled !== options[index]?.disabled
|
|
4781
4819
|
);
|
|
@@ -4801,13 +4839,13 @@ function FilterableCheckboxGroup(props) {
|
|
|
4801
4839
|
}
|
|
4802
4840
|
}
|
|
4803
4841
|
}, [options, value]);
|
|
4804
|
-
|
|
4842
|
+
useEffect9(() => {
|
|
4805
4843
|
virtualizer.measure();
|
|
4806
4844
|
}, [virtualizer, filteredOptions, size]);
|
|
4807
|
-
const handleSearchChange =
|
|
4845
|
+
const handleSearchChange = useCallback14((event) => {
|
|
4808
4846
|
setSearchTerm(event.target.value);
|
|
4809
4847
|
}, []);
|
|
4810
|
-
const handleCheckboxChange =
|
|
4848
|
+
const handleCheckboxChange = useCallback14(
|
|
4811
4849
|
(optionValue) => (event) => {
|
|
4812
4850
|
const checked = event.target.checked;
|
|
4813
4851
|
const newValue = checked ? [...internalValue, optionValue] : internalValue.filter((v) => v !== optionValue);
|
|
@@ -4815,7 +4853,7 @@ function FilterableCheckboxGroup(props) {
|
|
|
4815
4853
|
},
|
|
4816
4854
|
[internalValue, setInternalValue]
|
|
4817
4855
|
);
|
|
4818
|
-
const handleSelectAll =
|
|
4856
|
+
const handleSelectAll = useCallback14(
|
|
4819
4857
|
(event) => {
|
|
4820
4858
|
const checked = event.target.checked;
|
|
4821
4859
|
const enabledOptions = filteredOptions.filter((option) => !option.disabled);
|
|
@@ -4919,16 +4957,16 @@ function FilterableCheckboxGroup(props) {
|
|
|
4919
4957
|
FilterableCheckboxGroup.displayName = "FilterableCheckboxGroup";
|
|
4920
4958
|
|
|
4921
4959
|
// src/components/FilterMenu/FilterMenu.tsx
|
|
4922
|
-
import React41, { useCallback as
|
|
4960
|
+
import React41, { useCallback as useCallback24 } from "react";
|
|
4923
4961
|
import { Button as Button2, Stack as Stack11 } from "@mui/joy";
|
|
4924
4962
|
|
|
4925
4963
|
// src/components/FilterMenu/components/CheckboxGroup.tsx
|
|
4926
|
-
import React31, { useCallback as
|
|
4964
|
+
import React31, { useCallback as useCallback15 } from "react";
|
|
4927
4965
|
import { Stack as Stack2 } from "@mui/joy";
|
|
4928
4966
|
function CheckboxGroup(props) {
|
|
4929
4967
|
const { id, label, options, value, onChange, hidden } = props;
|
|
4930
4968
|
const [internalValue, setInternalValue] = useControlledState(value, [], onChange);
|
|
4931
|
-
const handleCheckboxChange =
|
|
4969
|
+
const handleCheckboxChange = useCallback15(
|
|
4932
4970
|
(optionValue) => (event) => {
|
|
4933
4971
|
const checked = event.target.checked;
|
|
4934
4972
|
let newValue;
|
|
@@ -4957,12 +4995,12 @@ function CheckboxGroup(props) {
|
|
|
4957
4995
|
CheckboxGroup.displayName = "CheckboxGroup";
|
|
4958
4996
|
|
|
4959
4997
|
// src/components/FilterMenu/components/FilterableCheckboxGroup.tsx
|
|
4960
|
-
import React32, { useCallback as
|
|
4998
|
+
import React32, { useCallback as useCallback16 } from "react";
|
|
4961
4999
|
import { Stack as Stack3 } from "@mui/joy";
|
|
4962
5000
|
function FilterableCheckboxGroup2(props) {
|
|
4963
5001
|
const { id, label, options, value, onChange, hidden, placeholder, maxHeight } = props;
|
|
4964
5002
|
const [internalValue, setInternalValue] = useControlledState(value, [], onChange);
|
|
4965
|
-
const handleChange =
|
|
5003
|
+
const handleChange = useCallback16(
|
|
4966
5004
|
(newValue) => {
|
|
4967
5005
|
setInternalValue(newValue);
|
|
4968
5006
|
},
|
|
@@ -4986,7 +5024,7 @@ function FilterableCheckboxGroup2(props) {
|
|
|
4986
5024
|
FilterableCheckboxGroup2.displayName = "FilterableCheckboxGroup";
|
|
4987
5025
|
|
|
4988
5026
|
// src/components/FilterMenu/components/RadioGroup.tsx
|
|
4989
|
-
import React33, { useCallback as
|
|
5027
|
+
import React33, { useCallback as useCallback17 } from "react";
|
|
4990
5028
|
|
|
4991
5029
|
// src/components/Radio/Radio.tsx
|
|
4992
5030
|
import { Radio as JoyRadio, RadioGroup as JoyRadioGroup } from "@mui/joy";
|
|
@@ -5003,7 +5041,7 @@ import { Stack as Stack4 } from "@mui/joy";
|
|
|
5003
5041
|
function RadioGroup2(props) {
|
|
5004
5042
|
const { id, label, options, value, onChange, hidden } = props;
|
|
5005
5043
|
const [internalValue, setInternalValue] = useControlledState(value, value ?? "", onChange);
|
|
5006
|
-
const handleRadioChange =
|
|
5044
|
+
const handleRadioChange = useCallback17(
|
|
5007
5045
|
(event) => {
|
|
5008
5046
|
const newValue = event.target.value;
|
|
5009
5047
|
const option = options.find((opt) => opt.value.toString() === newValue);
|
|
@@ -5020,7 +5058,7 @@ function RadioGroup2(props) {
|
|
|
5020
5058
|
RadioGroup2.displayName = "RadioGroup";
|
|
5021
5059
|
|
|
5022
5060
|
// src/components/FilterMenu/components/DateRange.tsx
|
|
5023
|
-
import React34, { useCallback as
|
|
5061
|
+
import React34, { useCallback as useCallback18, useMemo as useMemo13, useState as useState12, useEffect as useEffect10 } from "react";
|
|
5024
5062
|
import { Stack as Stack5 } from "@mui/joy";
|
|
5025
5063
|
function DateRange(props) {
|
|
5026
5064
|
const {
|
|
@@ -5038,7 +5076,7 @@ function DateRange(props) {
|
|
|
5038
5076
|
hideClearButton
|
|
5039
5077
|
} = props;
|
|
5040
5078
|
const [internalValue, setInternalValue] = useControlledState(value, null, onChange);
|
|
5041
|
-
const [selectedOption, setSelectedOption] =
|
|
5079
|
+
const [selectedOption, setSelectedOption] = useState12("all-time");
|
|
5042
5080
|
const dateRangeOptions = useMemo13(
|
|
5043
5081
|
() => [
|
|
5044
5082
|
{ label: "All Time", value: "all-time" },
|
|
@@ -5049,7 +5087,7 @@ function DateRange(props) {
|
|
|
5049
5087
|
],
|
|
5050
5088
|
[]
|
|
5051
5089
|
);
|
|
5052
|
-
const getDateRangeForOption =
|
|
5090
|
+
const getDateRangeForOption = useCallback18(
|
|
5053
5091
|
(option) => {
|
|
5054
5092
|
const now = /* @__PURE__ */ new Date();
|
|
5055
5093
|
const currentYear = now.getFullYear();
|
|
@@ -5088,7 +5126,7 @@ function DateRange(props) {
|
|
|
5088
5126
|
},
|
|
5089
5127
|
[internalValue]
|
|
5090
5128
|
);
|
|
5091
|
-
const determineOptionFromValue =
|
|
5129
|
+
const determineOptionFromValue = useCallback18(
|
|
5092
5130
|
(value2) => {
|
|
5093
5131
|
if (!value2) {
|
|
5094
5132
|
return "all-time";
|
|
@@ -5110,11 +5148,11 @@ function DateRange(props) {
|
|
|
5110
5148
|
}
|
|
5111
5149
|
return "";
|
|
5112
5150
|
}, [selectedOption, internalValue]);
|
|
5113
|
-
|
|
5151
|
+
useEffect10(() => {
|
|
5114
5152
|
const newOption = determineOptionFromValue(internalValue);
|
|
5115
5153
|
setSelectedOption(newOption);
|
|
5116
5154
|
}, [internalValue, determineOptionFromValue]);
|
|
5117
|
-
const handleOptionChange =
|
|
5155
|
+
const handleOptionChange = useCallback18(
|
|
5118
5156
|
(event) => {
|
|
5119
5157
|
const newOption = event.target.value;
|
|
5120
5158
|
setSelectedOption(newOption);
|
|
@@ -5123,7 +5161,7 @@ function DateRange(props) {
|
|
|
5123
5161
|
},
|
|
5124
5162
|
[getDateRangeForOption, setInternalValue]
|
|
5125
5163
|
);
|
|
5126
|
-
const handleCustomDateChange =
|
|
5164
|
+
const handleCustomDateChange = useCallback18(
|
|
5127
5165
|
(event) => {
|
|
5128
5166
|
const dateRangeString = event.target.value;
|
|
5129
5167
|
if (dateRangeString && dateRangeString.includes(" - ")) {
|
|
@@ -5163,12 +5201,12 @@ function DateRange(props) {
|
|
|
5163
5201
|
DateRange.displayName = "DateRange";
|
|
5164
5202
|
|
|
5165
5203
|
// src/components/FilterMenu/components/CurrencyInput.tsx
|
|
5166
|
-
import React35, { useCallback as
|
|
5204
|
+
import React35, { useCallback as useCallback19 } from "react";
|
|
5167
5205
|
import { Stack as Stack6 } from "@mui/joy";
|
|
5168
5206
|
function CurrencyInput3(props) {
|
|
5169
5207
|
const { id, label, value, onChange, hidden, max, placeholder, useMinorUnit, currency = "USD" } = props;
|
|
5170
5208
|
const [internalValue, setInternalValue] = useControlledState(value, value, onChange);
|
|
5171
|
-
const handleCurrencyChange =
|
|
5209
|
+
const handleCurrencyChange = useCallback19(
|
|
5172
5210
|
(event) => {
|
|
5173
5211
|
const newValue = event.target.value;
|
|
5174
5212
|
setInternalValue(newValue);
|
|
@@ -5194,14 +5232,14 @@ function CurrencyInput3(props) {
|
|
|
5194
5232
|
CurrencyInput3.displayName = "CurrencyInput";
|
|
5195
5233
|
|
|
5196
5234
|
// src/components/FilterMenu/components/CurrencyRange.tsx
|
|
5197
|
-
import React36, { useCallback as
|
|
5235
|
+
import React36, { useCallback as useCallback20 } from "react";
|
|
5198
5236
|
import { Stack as Stack7 } from "@mui/joy";
|
|
5199
5237
|
function CurrencyRange(props) {
|
|
5200
5238
|
const { id, label, value, onChange, hidden, max, placeholder, useMinorUnit, currency = "USD" } = props;
|
|
5201
5239
|
const [internalValue, setInternalValue] = useControlledState(value, null, onChange);
|
|
5202
5240
|
const minValue = internalValue?.[0];
|
|
5203
5241
|
const maxValue = internalValue?.[1];
|
|
5204
|
-
const handleMinChange =
|
|
5242
|
+
const handleMinChange = useCallback20(
|
|
5205
5243
|
(event) => {
|
|
5206
5244
|
const newMinValue = event.target.value;
|
|
5207
5245
|
const currentMaxValue = maxValue;
|
|
@@ -5215,7 +5253,7 @@ function CurrencyRange(props) {
|
|
|
5215
5253
|
},
|
|
5216
5254
|
[maxValue, setInternalValue]
|
|
5217
5255
|
);
|
|
5218
|
-
const handleMaxChange =
|
|
5256
|
+
const handleMaxChange = useCallback20(
|
|
5219
5257
|
(event) => {
|
|
5220
5258
|
const newMaxValue = event.target.value;
|
|
5221
5259
|
const currentMinValue = minValue;
|
|
@@ -5267,7 +5305,7 @@ import React38 from "react";
|
|
|
5267
5305
|
import { Stack as Stack8, Typography as Typography4 } from "@mui/joy";
|
|
5268
5306
|
|
|
5269
5307
|
// src/components/PercentageInput/PercentageInput.tsx
|
|
5270
|
-
import React37, { useCallback as
|
|
5308
|
+
import React37, { useCallback as useCallback21, useMemo as useMemo14, useState as useState13 } from "react";
|
|
5271
5309
|
import { NumericFormat as NumericFormat2 } from "react-number-format";
|
|
5272
5310
|
import { styled as styled20, useThemeProps as useThemeProps6 } from "@mui/joy";
|
|
5273
5311
|
var padDecimal = (value, decimalScale) => {
|
|
@@ -5324,9 +5362,9 @@ var PercentageInput = React37.forwardRef(
|
|
|
5324
5362
|
const [_value, setValue] = useControlledState(
|
|
5325
5363
|
props.value,
|
|
5326
5364
|
props.defaultValue,
|
|
5327
|
-
|
|
5365
|
+
useCallback21((value2) => onChange?.({ target: { name, value: value2 } }), [onChange, name])
|
|
5328
5366
|
);
|
|
5329
|
-
const [internalError, setInternalError] =
|
|
5367
|
+
const [internalError, setInternalError] = useState13(
|
|
5330
5368
|
max && _value && _value > max || min && _value && _value < min
|
|
5331
5369
|
);
|
|
5332
5370
|
const value = useMemo14(() => {
|
|
@@ -5335,7 +5373,7 @@ var PercentageInput = React37.forwardRef(
|
|
|
5335
5373
|
}
|
|
5336
5374
|
return _value;
|
|
5337
5375
|
}, [_value, useMinorUnit, maxDecimalScale]);
|
|
5338
|
-
const handleChange =
|
|
5376
|
+
const handleChange = useCallback21(
|
|
5339
5377
|
(event) => {
|
|
5340
5378
|
if (event.target.value === "") {
|
|
5341
5379
|
setValue(void 0);
|
|
@@ -5414,7 +5452,7 @@ var PercentageInput3 = ({
|
|
|
5414
5452
|
};
|
|
5415
5453
|
|
|
5416
5454
|
// src/components/FilterMenu/components/PercentageRange.tsx
|
|
5417
|
-
import React39, { useCallback as
|
|
5455
|
+
import React39, { useCallback as useCallback22 } from "react";
|
|
5418
5456
|
import { Stack as Stack9 } from "@mui/joy";
|
|
5419
5457
|
function PercentageRange(props) {
|
|
5420
5458
|
const { id, label, value, onChange, hidden, useMinorUnit, maxDecimalScale, min, max } = props;
|
|
@@ -5425,7 +5463,7 @@ function PercentageRange(props) {
|
|
|
5425
5463
|
);
|
|
5426
5464
|
const minValue = internalValue?.[0];
|
|
5427
5465
|
const maxValue = internalValue?.[1];
|
|
5428
|
-
const handleMinChange =
|
|
5466
|
+
const handleMinChange = useCallback22(
|
|
5429
5467
|
(event) => {
|
|
5430
5468
|
const newMinValue = event.target.value;
|
|
5431
5469
|
const currentMaxValue = maxValue;
|
|
@@ -5437,7 +5475,7 @@ function PercentageRange(props) {
|
|
|
5437
5475
|
},
|
|
5438
5476
|
[maxValue, setInternalValue]
|
|
5439
5477
|
);
|
|
5440
|
-
const handleMaxChange =
|
|
5478
|
+
const handleMaxChange = useCallback22(
|
|
5441
5479
|
(event) => {
|
|
5442
5480
|
const newMaxValue = event.target.value;
|
|
5443
5481
|
const currentMinValue = minValue;
|
|
@@ -5485,13 +5523,13 @@ function PercentageRange(props) {
|
|
|
5485
5523
|
PercentageRange.displayName = "PercentageRange";
|
|
5486
5524
|
|
|
5487
5525
|
// src/components/FilterMenu/components/Autocomplete.tsx
|
|
5488
|
-
import React40, { useCallback as
|
|
5526
|
+
import React40, { useCallback as useCallback23 } from "react";
|
|
5489
5527
|
import { Stack as Stack10 } from "@mui/joy";
|
|
5490
5528
|
function Autocomplete2(props) {
|
|
5491
5529
|
const { id, label, value, onChange, options, multiple, hidden, placeholder } = props;
|
|
5492
5530
|
const [internalValue, setInternalValue] = useControlledState(value, void 0, onChange);
|
|
5493
5531
|
const autocompleteValue = typeof internalValue === "string" || typeof internalValue === "number" ? String(internalValue) : void 0;
|
|
5494
|
-
const handleChange =
|
|
5532
|
+
const handleChange = useCallback23(
|
|
5495
5533
|
(event) => {
|
|
5496
5534
|
const val = event.target.value;
|
|
5497
5535
|
if (val) {
|
|
@@ -5540,7 +5578,7 @@ function FilterMenu(props) {
|
|
|
5540
5578
|
void 0
|
|
5541
5579
|
// onChange는 Apply 버튼에서만 호출
|
|
5542
5580
|
);
|
|
5543
|
-
const handleFilterChange =
|
|
5581
|
+
const handleFilterChange = useCallback24(
|
|
5544
5582
|
(filterId, value) => {
|
|
5545
5583
|
setInternalValues((prev) => ({
|
|
5546
5584
|
...prev,
|
|
@@ -5549,11 +5587,11 @@ function FilterMenu(props) {
|
|
|
5549
5587
|
},
|
|
5550
5588
|
[setInternalValues]
|
|
5551
5589
|
);
|
|
5552
|
-
const handleApply =
|
|
5590
|
+
const handleApply = useCallback24(() => {
|
|
5553
5591
|
onChange?.(internalValues);
|
|
5554
5592
|
onClose?.();
|
|
5555
5593
|
}, [onChange, onClose, internalValues]);
|
|
5556
|
-
const handleClear =
|
|
5594
|
+
const handleClear = useCallback24(() => {
|
|
5557
5595
|
const clearedValues = resetValues || {};
|
|
5558
5596
|
setInternalValues(clearedValues);
|
|
5559
5597
|
onChange?.(clearedValues);
|
|
@@ -5589,7 +5627,7 @@ function FilterMenu(props) {
|
|
|
5589
5627
|
FilterMenu.displayName = "FilterMenu";
|
|
5590
5628
|
|
|
5591
5629
|
// src/components/Uploader/Uploader.tsx
|
|
5592
|
-
import React42, { useCallback as
|
|
5630
|
+
import React42, { useCallback as useCallback25, useEffect as useEffect11, useMemo as useMemo15, useRef as useRef10, useState as useState14 } from "react";
|
|
5593
5631
|
import { styled as styled21, Input as Input2 } from "@mui/joy";
|
|
5594
5632
|
import MuiFileUploadIcon from "@mui/icons-material/CloudUploadRounded";
|
|
5595
5633
|
import MuiUploadFileIcon from "@mui/icons-material/UploadFileRounded";
|
|
@@ -5738,12 +5776,12 @@ var Uploader = React42.memo(
|
|
|
5738
5776
|
error: errorProp,
|
|
5739
5777
|
helperText: helperTextProp
|
|
5740
5778
|
} = props;
|
|
5741
|
-
const dropZoneRef =
|
|
5742
|
-
const inputRef =
|
|
5743
|
-
const [errorText, setErrorText] =
|
|
5744
|
-
const [files, setFiles] =
|
|
5745
|
-
const [uploaded, setUploaded] =
|
|
5746
|
-
const [previewState, setPreviewState] =
|
|
5779
|
+
const dropZoneRef = useRef10(null);
|
|
5780
|
+
const inputRef = useRef10(null);
|
|
5781
|
+
const [errorText, setErrorText] = useState14();
|
|
5782
|
+
const [files, setFiles] = useState14([]);
|
|
5783
|
+
const [uploaded, setUploaded] = useState14(props.uploaded || []);
|
|
5784
|
+
const [previewState, setPreviewState] = useState14("idle");
|
|
5747
5785
|
const accepts = useMemo15(() => accept.split(",").map((accept2) => accept2.trim()), [accept]);
|
|
5748
5786
|
const parsedAccepts = useMemo15(
|
|
5749
5787
|
() => accepts.flatMap((type) => {
|
|
@@ -5789,7 +5827,7 @@ var Uploader = React42.memo(
|
|
|
5789
5827
|
() => !maxCount || maxCount && [...uploaded, ...files].length !== maxCount,
|
|
5790
5828
|
[files, maxCount, uploaded]
|
|
5791
5829
|
);
|
|
5792
|
-
const addFiles =
|
|
5830
|
+
const addFiles = useCallback25(
|
|
5793
5831
|
(uploads) => {
|
|
5794
5832
|
try {
|
|
5795
5833
|
const types = parsedAccepts.map((type) => type.replace(".", "")) || [];
|
|
@@ -5834,7 +5872,7 @@ var Uploader = React42.memo(
|
|
|
5834
5872
|
},
|
|
5835
5873
|
[files, uploaded, maxCount, parsedAccepts, maxFileSize, maxFileTotalSize, name, onChange]
|
|
5836
5874
|
);
|
|
5837
|
-
|
|
5875
|
+
useEffect11(() => {
|
|
5838
5876
|
if (!dropZoneRef.current || disabled) {
|
|
5839
5877
|
return;
|
|
5840
5878
|
}
|
|
@@ -5872,7 +5910,7 @@ var Uploader = React42.memo(
|
|
|
5872
5910
|
);
|
|
5873
5911
|
return () => cleanup?.();
|
|
5874
5912
|
}, [disabled, addFiles]);
|
|
5875
|
-
|
|
5913
|
+
useEffect11(() => {
|
|
5876
5914
|
if (inputRef.current && minCount) {
|
|
5877
5915
|
if (files.length < minCount) {
|
|
5878
5916
|
inputRef.current.setCustomValidity(`At least ${minCount} files are required.`);
|
|
@@ -5881,14 +5919,14 @@ var Uploader = React42.memo(
|
|
|
5881
5919
|
}
|
|
5882
5920
|
}
|
|
5883
5921
|
}, [inputRef, files, minCount]);
|
|
5884
|
-
const handleFileChanged =
|
|
5922
|
+
const handleFileChanged = useCallback25(
|
|
5885
5923
|
(event) => {
|
|
5886
5924
|
const files2 = Array.from(event.target.files || []);
|
|
5887
5925
|
addFiles(files2);
|
|
5888
5926
|
},
|
|
5889
5927
|
[addFiles]
|
|
5890
5928
|
);
|
|
5891
|
-
const handleDeleteFile =
|
|
5929
|
+
const handleDeleteFile = useCallback25(
|
|
5892
5930
|
(deletedFile) => {
|
|
5893
5931
|
if (deletedFile instanceof File) {
|
|
5894
5932
|
setFiles((current) => {
|
|
@@ -5908,7 +5946,7 @@ var Uploader = React42.memo(
|
|
|
5908
5946
|
},
|
|
5909
5947
|
[name, onChange, onDelete]
|
|
5910
5948
|
);
|
|
5911
|
-
const handleUploaderButtonClick =
|
|
5949
|
+
const handleUploaderButtonClick = useCallback25(() => {
|
|
5912
5950
|
inputRef.current?.click();
|
|
5913
5951
|
}, []);
|
|
5914
5952
|
const uploader = /* @__PURE__ */ React42.createElement(
|
|
@@ -6003,16 +6041,16 @@ function IconMenuButton(props) {
|
|
|
6003
6041
|
IconMenuButton.displayName = "IconMenuButton";
|
|
6004
6042
|
|
|
6005
6043
|
// src/components/Markdown/Markdown.tsx
|
|
6006
|
-
import React44, { lazy, Suspense, useEffect as
|
|
6044
|
+
import React44, { lazy, Suspense, useEffect as useEffect12, useState as useState15 } from "react";
|
|
6007
6045
|
import { Skeleton } from "@mui/joy";
|
|
6008
6046
|
import { Link as Link2 } from "@mui/joy";
|
|
6009
6047
|
import remarkGfm from "remark-gfm";
|
|
6010
6048
|
var LazyReactMarkdown = lazy(() => import("react-markdown"));
|
|
6011
6049
|
var Markdown = (props) => {
|
|
6012
|
-
const [
|
|
6013
|
-
|
|
6050
|
+
const [rehypeAccent, setRehypeAccent] = useState15(null);
|
|
6051
|
+
useEffect12(() => {
|
|
6014
6052
|
const loadRehypeAccent = async () => {
|
|
6015
|
-
const module = await
|
|
6053
|
+
const module = await import("./chunks/rehype-accent-FZRUD7VI.js");
|
|
6016
6054
|
setRehypeAccent(() => module.rehypeAccent);
|
|
6017
6055
|
};
|
|
6018
6056
|
loadRehypeAccent();
|
|
@@ -6029,7 +6067,7 @@ var Markdown = (props) => {
|
|
|
6029
6067
|
fallback,
|
|
6030
6068
|
...innerProps
|
|
6031
6069
|
} = props;
|
|
6032
|
-
if (!
|
|
6070
|
+
if (!rehypeAccent) {
|
|
6033
6071
|
return null;
|
|
6034
6072
|
}
|
|
6035
6073
|
return /* @__PURE__ */ React44.createElement(Typography, { component: "div", color, textColor, level: defaultLevel, ...innerProps }, /* @__PURE__ */ React44.createElement(
|
|
@@ -6042,7 +6080,7 @@ var Markdown = (props) => {
|
|
|
6042
6080
|
{
|
|
6043
6081
|
...markdownOptions,
|
|
6044
6082
|
children: content,
|
|
6045
|
-
rehypePlugins: [[
|
|
6083
|
+
rehypePlugins: [[rehypeAccent, { accentColor }]],
|
|
6046
6084
|
remarkPlugins: [remarkGfm],
|
|
6047
6085
|
components: {
|
|
6048
6086
|
a: ({ children, href }) => /* @__PURE__ */ React44.createElement(Link2, { href, target: defaultLinkAction }, children),
|
|
@@ -6184,7 +6222,7 @@ function MenuButton(props) {
|
|
|
6184
6222
|
MenuButton.displayName = "MenuButton";
|
|
6185
6223
|
|
|
6186
6224
|
// src/components/MonthPicker/MonthPicker.tsx
|
|
6187
|
-
import React46, { forwardRef as forwardRef9, useCallback as
|
|
6225
|
+
import React46, { forwardRef as forwardRef9, useCallback as useCallback26, useEffect as useEffect13, useImperativeHandle as useImperativeHandle4, useRef as useRef11, useState as useState16 } from "react";
|
|
6188
6226
|
import CalendarTodayIcon3 from "@mui/icons-material/CalendarToday";
|
|
6189
6227
|
import { styled as styled22, useThemeProps as useThemeProps7 } from "@mui/joy";
|
|
6190
6228
|
import { FocusTrap as FocusTrap3, ClickAwayListener as ClickAwayListener3, Popper as Popper4 } from "@mui/base";
|
|
@@ -6266,14 +6304,14 @@ var MonthPicker = forwardRef9((inProps, ref) => {
|
|
|
6266
6304
|
locale,
|
|
6267
6305
|
...innerProps
|
|
6268
6306
|
} = props;
|
|
6269
|
-
const innerRef =
|
|
6270
|
-
const buttonRef =
|
|
6307
|
+
const innerRef = useRef11(null);
|
|
6308
|
+
const buttonRef = useRef11(null);
|
|
6271
6309
|
const [value, setValue, isControlled] = useControlledState(
|
|
6272
6310
|
props.value,
|
|
6273
6311
|
props.defaultValue || "",
|
|
6274
|
-
|
|
6312
|
+
useCallback26((value2) => onChange?.({ target: { name: props.name, value: value2 } }), [props.name, onChange])
|
|
6275
6313
|
);
|
|
6276
|
-
const getFormattedDisplayValue =
|
|
6314
|
+
const getFormattedDisplayValue = useCallback26(
|
|
6277
6315
|
(inputValue) => {
|
|
6278
6316
|
if (!inputValue) return "";
|
|
6279
6317
|
try {
|
|
@@ -6284,19 +6322,19 @@ var MonthPicker = forwardRef9((inProps, ref) => {
|
|
|
6284
6322
|
},
|
|
6285
6323
|
[format, displayFormat, locale]
|
|
6286
6324
|
);
|
|
6287
|
-
const [displayValue, setDisplayValue] =
|
|
6288
|
-
const [anchorEl, setAnchorEl] =
|
|
6325
|
+
const [displayValue, setDisplayValue] = useState16(() => getFormattedDisplayValue(value));
|
|
6326
|
+
const [anchorEl, setAnchorEl] = useState16(null);
|
|
6289
6327
|
const open = Boolean(anchorEl);
|
|
6290
|
-
|
|
6328
|
+
useEffect13(() => {
|
|
6291
6329
|
if (!anchorEl) {
|
|
6292
6330
|
innerRef.current?.blur();
|
|
6293
6331
|
}
|
|
6294
6332
|
}, [anchorEl, innerRef]);
|
|
6295
6333
|
useImperativeHandle4(ref, () => innerRef.current, [innerRef]);
|
|
6296
|
-
|
|
6334
|
+
useEffect13(() => {
|
|
6297
6335
|
setDisplayValue(getFormattedDisplayValue(value));
|
|
6298
6336
|
}, [value, getFormattedDisplayValue]);
|
|
6299
|
-
const handleChange =
|
|
6337
|
+
const handleChange = useCallback26(
|
|
6300
6338
|
(event) => {
|
|
6301
6339
|
const newValue = event.target.value;
|
|
6302
6340
|
setValue(newValue);
|
|
@@ -6306,14 +6344,14 @@ var MonthPicker = forwardRef9((inProps, ref) => {
|
|
|
6306
6344
|
},
|
|
6307
6345
|
[setValue, getFormattedDisplayValue, isControlled]
|
|
6308
6346
|
);
|
|
6309
|
-
const handleCalendarToggle =
|
|
6347
|
+
const handleCalendarToggle = useCallback26(
|
|
6310
6348
|
(event) => {
|
|
6311
6349
|
setAnchorEl(anchorEl ? null : event.currentTarget);
|
|
6312
6350
|
innerRef.current?.focus();
|
|
6313
6351
|
},
|
|
6314
6352
|
[anchorEl, setAnchorEl, innerRef]
|
|
6315
6353
|
);
|
|
6316
|
-
const handleInputMouseDown =
|
|
6354
|
+
const handleInputMouseDown = useCallback26(
|
|
6317
6355
|
(event) => {
|
|
6318
6356
|
event.preventDefault();
|
|
6319
6357
|
buttonRef.current?.focus();
|
|
@@ -6437,7 +6475,7 @@ var MonthPicker = forwardRef9((inProps, ref) => {
|
|
|
6437
6475
|
});
|
|
6438
6476
|
|
|
6439
6477
|
// src/components/MonthRangePicker/MonthRangePicker.tsx
|
|
6440
|
-
import React47, { forwardRef as forwardRef10, useCallback as
|
|
6478
|
+
import React47, { forwardRef as forwardRef10, useCallback as useCallback27, useEffect as useEffect14, useImperativeHandle as useImperativeHandle5, useMemo as useMemo16, useRef as useRef12, useState as useState17 } from "react";
|
|
6441
6479
|
import { IMaskInput as IMaskInput3, IMask as IMask3 } from "react-imask";
|
|
6442
6480
|
import CalendarTodayIcon4 from "@mui/icons-material/CalendarToday";
|
|
6443
6481
|
import { styled as styled23, useThemeProps as useThemeProps8 } from "@mui/joy";
|
|
@@ -6545,35 +6583,35 @@ var MonthRangePicker = forwardRef10((inProps, ref) => {
|
|
|
6545
6583
|
size,
|
|
6546
6584
|
...innerProps
|
|
6547
6585
|
} = props;
|
|
6548
|
-
const innerRef =
|
|
6586
|
+
const innerRef = useRef12(null);
|
|
6549
6587
|
const [value, setValue] = useControlledState(
|
|
6550
6588
|
props.value,
|
|
6551
6589
|
props.defaultValue || "",
|
|
6552
|
-
|
|
6590
|
+
useCallback27((value2) => onChange?.({ target: { name: props.name, value: value2 } }), [props.name, onChange])
|
|
6553
6591
|
);
|
|
6554
|
-
const [anchorEl, setAnchorEl] =
|
|
6592
|
+
const [anchorEl, setAnchorEl] = useState17(null);
|
|
6555
6593
|
const open = Boolean(anchorEl);
|
|
6556
6594
|
const calendarValue = useMemo16(() => value ? parseDates2(value) : void 0, [value]);
|
|
6557
|
-
|
|
6595
|
+
useEffect14(() => {
|
|
6558
6596
|
if (!anchorEl) {
|
|
6559
6597
|
innerRef.current?.blur();
|
|
6560
6598
|
}
|
|
6561
6599
|
}, [anchorEl, innerRef]);
|
|
6562
6600
|
useImperativeHandle5(ref, () => innerRef.current, [innerRef]);
|
|
6563
|
-
const handleChange =
|
|
6601
|
+
const handleChange = useCallback27(
|
|
6564
6602
|
(event) => {
|
|
6565
6603
|
setValue(event.target.value);
|
|
6566
6604
|
},
|
|
6567
6605
|
[setValue]
|
|
6568
6606
|
);
|
|
6569
|
-
const handleCalendarToggle =
|
|
6607
|
+
const handleCalendarToggle = useCallback27(
|
|
6570
6608
|
(event) => {
|
|
6571
6609
|
setAnchorEl(anchorEl ? null : event.currentTarget);
|
|
6572
6610
|
innerRef.current?.focus();
|
|
6573
6611
|
},
|
|
6574
6612
|
[anchorEl, setAnchorEl, innerRef]
|
|
6575
6613
|
);
|
|
6576
|
-
const handleCalendarChange =
|
|
6614
|
+
const handleCalendarChange = useCallback27(
|
|
6577
6615
|
([date1, date2]) => {
|
|
6578
6616
|
if (!date1 || !date2) return;
|
|
6579
6617
|
setValue(formatValueString4([date1, date2], format));
|
|
@@ -6800,7 +6838,7 @@ function Navigator(props) {
|
|
|
6800
6838
|
Navigator.displayName = "Navigator";
|
|
6801
6839
|
|
|
6802
6840
|
// src/components/ProfileMenu/ProfileMenu.tsx
|
|
6803
|
-
import React51, { useCallback as
|
|
6841
|
+
import React51, { useCallback as useCallback28, useMemo as useMemo17 } from "react";
|
|
6804
6842
|
import { Dropdown as Dropdown2, ListDivider, menuItemClasses, styled as styled26, MenuButton as MenuButton2 } from "@mui/joy";
|
|
6805
6843
|
import { ClickAwayListener as ClickAwayListener5 } from "@mui/base";
|
|
6806
6844
|
import DropdownIcon from "@mui/icons-material/ArrowDropDown";
|
|
@@ -6852,7 +6890,7 @@ function ProfileMenu(props) {
|
|
|
6852
6890
|
const [open, setOpen] = useControlledState(
|
|
6853
6891
|
_open,
|
|
6854
6892
|
defaultOpen ?? false,
|
|
6855
|
-
|
|
6893
|
+
useCallback28((value) => onOpenChange?.(value), [onOpenChange])
|
|
6856
6894
|
);
|
|
6857
6895
|
return /* @__PURE__ */ React51.createElement(ClickAwayListener5, { onClickAway: () => setOpen(false) }, /* @__PURE__ */ React51.createElement("div", null, /* @__PURE__ */ React51.createElement(Dropdown2, { open }, /* @__PURE__ */ React51.createElement(
|
|
6858
6896
|
ProfileMenuButton,
|