@dmsi/wedgekit-react 0.0.503 → 0.0.504
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/{chunk-VOSQMHNF.js → chunk-U5V2IRZX.js} +4 -29
- package/dist/{chunk-S5ZJ3Q7P.js → chunk-VJVY6NPF.js} +3 -3
- package/dist/components/CalendarRange.cjs +75 -128
- package/dist/components/CalendarRange.js +1 -7
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.cjs +33 -86
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.js +1 -7
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.cjs +43 -96
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.js +1 -7
- package/dist/components/DataGrid/PinnedColumns.cjs +58 -111
- package/dist/components/DataGrid/PinnedColumns.js +1 -7
- package/dist/components/DataGrid/TableBody/LoadingCell.cjs +34 -87
- package/dist/components/DataGrid/TableBody/LoadingCell.js +1 -7
- package/dist/components/DataGrid/TableBody/TableBodyRow.cjs +40 -93
- package/dist/components/DataGrid/TableBody/TableBodyRow.js +1 -7
- package/dist/components/DataGrid/TableBody/index.cjs +55 -108
- package/dist/components/DataGrid/TableBody/index.js +1 -7
- package/dist/components/DataGrid/index.cjs +144 -197
- package/dist/components/DataGrid/index.js +1 -7
- package/dist/components/DataGrid/utils.cjs +34 -87
- package/dist/components/DataGrid/utils.js +1 -7
- package/dist/components/DateInput.cjs +94 -147
- package/dist/components/DateInput.js +1 -7
- package/dist/components/DateRangeInput.cjs +94 -147
- package/dist/components/DateRangeInput.js +1 -7
- package/dist/components/MobileDataGrid/ColumnSelector/index.cjs +41 -94
- package/dist/components/MobileDataGrid/ColumnSelector/index.js +1 -7
- package/dist/components/MobileDataGrid/MobileDataGridHeader.cjs +49 -102
- package/dist/components/MobileDataGrid/MobileDataGridHeader.js +1 -7
- package/dist/components/MobileDataGrid/index.cjs +868 -921
- package/dist/components/MobileDataGrid/index.js +1 -7
- package/dist/components/PDFViewer/PDFElement.cjs +5 -31
- package/dist/components/PDFViewer/PDFElement.js +2 -3
- package/dist/components/PDFViewer/PDFPage.cjs +3 -3
- package/dist/components/PDFViewer/PDFPage.js +1 -1
- package/dist/components/PDFViewer/index.cjs +5 -35
- package/dist/components/PDFViewer/index.js +111 -8
- package/dist/components/index.cjs +56 -402
- package/dist/components/index.js +1 -10
- package/package.json +1 -1
- package/src/components/PDFViewer/PDFElement.tsx +3 -38
- package/src/components/PDFViewer/PDFPage.tsx +2 -4
- package/src/components/PDFViewer/index.tsx +1 -9
- package/src/components/index.ts +0 -1
- package/dist/chunk-6XLESQ2U.js +0 -119
- /package/dist/{chunk-C2YTC2CN.js → chunk-JWVZOEF5.js} +0 -0
|
@@ -62,7 +62,7 @@ __export(DateInput_exports, {
|
|
|
62
62
|
DateInput: () => DateInput
|
|
63
63
|
});
|
|
64
64
|
module.exports = __toCommonJS(DateInput_exports);
|
|
65
|
-
var
|
|
65
|
+
var import_react37 = require("react");
|
|
66
66
|
var import_react_dom4 = require("react-dom");
|
|
67
67
|
|
|
68
68
|
// src/components/Input.tsx
|
|
@@ -790,8 +790,8 @@ Currency.displayName = "Currency";
|
|
|
790
790
|
Percentage.displayName = "Percentage";
|
|
791
791
|
|
|
792
792
|
// src/components/CalendarRange.tsx
|
|
793
|
-
var
|
|
794
|
-
var
|
|
793
|
+
var import_clsx39 = __toESM(require("clsx"), 1);
|
|
794
|
+
var import_react36 = __toESM(require("react"), 1);
|
|
795
795
|
var import_polyfill = require("@js-temporal/polyfill");
|
|
796
796
|
|
|
797
797
|
// src/components/DataGridCell.tsx
|
|
@@ -4897,68 +4897,15 @@ var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
|
4897
4897
|
var import_clsx35 = __toESM(require("clsx"), 1);
|
|
4898
4898
|
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
4899
4899
|
|
|
4900
|
-
// src/components/
|
|
4901
|
-
var import_react34 = require("react");
|
|
4902
|
-
|
|
4903
|
-
// src/components/PDFViewer/PDFElement.tsx
|
|
4904
|
-
var import_react33 = require("react");
|
|
4905
|
-
|
|
4906
|
-
// src/components/Spinner.tsx
|
|
4907
|
-
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
4908
|
-
var Spinner = ({ size = "small", testid }) => {
|
|
4909
|
-
const dimension = size === "large" ? 48 : 24;
|
|
4910
|
-
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
4911
|
-
"svg",
|
|
4912
|
-
{
|
|
4913
|
-
"data-testid": testid,
|
|
4914
|
-
width: dimension,
|
|
4915
|
-
height: dimension,
|
|
4916
|
-
viewBox: "0 0 24 24",
|
|
4917
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
4918
|
-
fill: "#1D1E1E",
|
|
4919
|
-
className: "spinner",
|
|
4920
|
-
"aria-label": "Loading",
|
|
4921
|
-
children: [
|
|
4922
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "12", cy: "4", r: "2", opacity: "1" }),
|
|
4923
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "17.666", cy: "6.334", r: "2", opacity: "0.125" }),
|
|
4924
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "20", cy: "12", r: "2", opacity: "0.25" }),
|
|
4925
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "17.666", cy: "17.666", r: "2", opacity: "0.375" }),
|
|
4926
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "12", cy: "20", r: "2", opacity: "0.5" }),
|
|
4927
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "6.334", cy: "17.666", r: "2", opacity: "0.625" }),
|
|
4928
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "4", cy: "12", r: "2", opacity: "0.75" }),
|
|
4929
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("circle", { cx: "6.334", cy: "6.334", r: "2", opacity: "0.875" })
|
|
4930
|
-
]
|
|
4931
|
-
}
|
|
4932
|
-
);
|
|
4933
|
-
};
|
|
4934
|
-
Spinner.displayName = "Spinner";
|
|
4935
|
-
|
|
4936
|
-
// src/components/PDFViewer/PDFPage.tsx
|
|
4900
|
+
// src/components/ListGroup.tsx
|
|
4937
4901
|
var import_react32 = require("react");
|
|
4938
|
-
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
4939
|
-
|
|
4940
|
-
// src/components/PDFViewer/PDFElement.tsx
|
|
4941
4902
|
var import_clsx36 = __toESM(require("clsx"), 1);
|
|
4942
|
-
var
|
|
4943
|
-
|
|
4944
|
-
// src/components/PDFViewer/DownloadIcon.tsx
|
|
4945
|
-
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
4946
|
-
|
|
4947
|
-
// src/components/PDFViewer/PDFNavigation.tsx
|
|
4948
|
-
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
4949
|
-
|
|
4950
|
-
// src/components/PDFViewer/index.tsx
|
|
4951
|
-
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
4952
|
-
|
|
4953
|
-
// src/components/ListGroup.tsx
|
|
4954
|
-
var import_react35 = require("react");
|
|
4955
|
-
var import_clsx37 = __toESM(require("clsx"), 1);
|
|
4956
|
-
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
4903
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
4957
4904
|
|
|
4958
4905
|
// src/components/Pagination.tsx
|
|
4959
|
-
var
|
|
4960
|
-
var
|
|
4961
|
-
var
|
|
4906
|
+
var import_react33 = require("react");
|
|
4907
|
+
var import_clsx37 = __toESM(require("clsx"), 1);
|
|
4908
|
+
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
4962
4909
|
var Pagination = ({
|
|
4963
4910
|
totalPages,
|
|
4964
4911
|
currentPage,
|
|
@@ -4968,7 +4915,7 @@ var Pagination = ({
|
|
|
4968
4915
|
className,
|
|
4969
4916
|
disabled
|
|
4970
4917
|
}) => {
|
|
4971
|
-
const goTo = (0,
|
|
4918
|
+
const goTo = (0, import_react33.useCallback)(
|
|
4972
4919
|
(page) => {
|
|
4973
4920
|
if (disabled) return;
|
|
4974
4921
|
onPageChange(page);
|
|
@@ -4985,7 +4932,7 @@ var Pagination = ({
|
|
|
4985
4932
|
goTo(currentPage + 1);
|
|
4986
4933
|
}
|
|
4987
4934
|
};
|
|
4988
|
-
const pageTokens = (0,
|
|
4935
|
+
const pageTokens = (0, import_react33.useMemo)(() => {
|
|
4989
4936
|
if (totalPages <= 5) {
|
|
4990
4937
|
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
4991
4938
|
}
|
|
@@ -5022,7 +4969,7 @@ var Pagination = ({
|
|
|
5022
4969
|
return tokens;
|
|
5023
4970
|
}, [totalPages, currentPage]);
|
|
5024
4971
|
if (totalPages <= 1) return null;
|
|
5025
|
-
const buttonClass = (0,
|
|
4972
|
+
const buttonClass = (0, import_clsx37.default)(
|
|
5026
4973
|
"cursor-pointer disabled:cursor-default",
|
|
5027
4974
|
paddingUsingComponentGap,
|
|
5028
4975
|
"w-8 h-8",
|
|
@@ -5033,14 +4980,14 @@ var Pagination = ({
|
|
|
5033
4980
|
"focus:bg-background-grouped-secondary-normal focus:outline-0",
|
|
5034
4981
|
"disabled:bg-transparent disabled:text-text-action-primary-disabled"
|
|
5035
4982
|
);
|
|
5036
|
-
return /* @__PURE__ */ (0,
|
|
4983
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
|
|
5037
4984
|
"nav",
|
|
5038
4985
|
{
|
|
5039
4986
|
id,
|
|
5040
4987
|
"data-testid": testid,
|
|
5041
4988
|
"aria-label": "Pagination",
|
|
5042
4989
|
onKeyDown: handleKey,
|
|
5043
|
-
className: (0,
|
|
4990
|
+
className: (0, import_clsx37.default)(
|
|
5044
4991
|
"flex items-center",
|
|
5045
4992
|
"border border-border-primary-normal",
|
|
5046
4993
|
"bg-background-grouped-primary-normal",
|
|
@@ -5048,19 +4995,19 @@ var Pagination = ({
|
|
|
5048
4995
|
className
|
|
5049
4996
|
),
|
|
5050
4997
|
children: [
|
|
5051
|
-
/* @__PURE__ */ (0,
|
|
4998
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
5052
4999
|
"button",
|
|
5053
5000
|
{
|
|
5054
5001
|
disabled: disabled || currentPage <= 1,
|
|
5055
5002
|
"aria-label": "Previous page",
|
|
5056
5003
|
onClick: () => goTo(currentPage - 1),
|
|
5057
|
-
className: (0,
|
|
5058
|
-
children: /* @__PURE__ */ (0,
|
|
5004
|
+
className: (0, import_clsx37.default)(buttonClass, "border-r-1 border-border-primary-normal"),
|
|
5005
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Icon, { name: "keyboard_arrow_left" })
|
|
5059
5006
|
}
|
|
5060
5007
|
),
|
|
5061
|
-
/* @__PURE__ */ (0,
|
|
5008
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("ul", { className: (0, import_clsx37.default)("flex items-center"), children: pageTokens.map((token, index) => {
|
|
5062
5009
|
if (token === "ellipsis") {
|
|
5063
|
-
return /* @__PURE__ */ (0,
|
|
5010
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
5064
5011
|
"li",
|
|
5065
5012
|
{
|
|
5066
5013
|
className: "w-8 h-8 select-none text-text-action-primary-disabled",
|
|
@@ -5070,29 +5017,29 @@ var Pagination = ({
|
|
|
5070
5017
|
);
|
|
5071
5018
|
}
|
|
5072
5019
|
const selected = token === currentPage;
|
|
5073
|
-
return /* @__PURE__ */ (0,
|
|
5020
|
+
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
5074
5021
|
"button",
|
|
5075
5022
|
{
|
|
5076
5023
|
"aria-label": `Page ${token}`,
|
|
5077
5024
|
"aria-current": selected ? "page" : void 0,
|
|
5078
5025
|
disabled,
|
|
5079
5026
|
onClick: () => goTo(token),
|
|
5080
|
-
className: (0,
|
|
5027
|
+
className: (0, import_clsx37.default)(
|
|
5081
5028
|
buttonClass,
|
|
5082
5029
|
selected && "border-x-1 bg-background-grouped-secondary-normal border-border-primary-normal"
|
|
5083
5030
|
),
|
|
5084
|
-
children: /* @__PURE__ */ (0,
|
|
5031
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Subheader, { align: "center", weight: "bold", children: token })
|
|
5085
5032
|
}
|
|
5086
5033
|
) }, token);
|
|
5087
5034
|
}) }),
|
|
5088
|
-
/* @__PURE__ */ (0,
|
|
5035
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
5089
5036
|
"button",
|
|
5090
5037
|
{
|
|
5091
5038
|
disabled: disabled || currentPage >= totalPages,
|
|
5092
5039
|
"aria-label": "Next page",
|
|
5093
5040
|
onClick: () => goTo(currentPage + 1),
|
|
5094
|
-
className: (0,
|
|
5095
|
-
children: /* @__PURE__ */ (0,
|
|
5041
|
+
className: (0, import_clsx37.default)(buttonClass, "border-l-1 border-border-primary-normal"),
|
|
5042
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Icon, { name: "keyboard_arrow_right" })
|
|
5096
5043
|
}
|
|
5097
5044
|
)
|
|
5098
5045
|
]
|
|
@@ -5102,25 +5049,25 @@ var Pagination = ({
|
|
|
5102
5049
|
Pagination.displayName = "Pagination";
|
|
5103
5050
|
|
|
5104
5051
|
// src/components/SkeletonParagraph.tsx
|
|
5105
|
-
var
|
|
5052
|
+
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
5106
5053
|
|
|
5107
5054
|
// src/components/EmptyCartIcon.tsx
|
|
5108
|
-
var
|
|
5055
|
+
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
5109
5056
|
|
|
5110
5057
|
// src/components/SearchResultImage/index.tsx
|
|
5111
|
-
var
|
|
5112
|
-
var
|
|
5058
|
+
var import_react34 = require("react");
|
|
5059
|
+
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
5113
5060
|
|
|
5114
5061
|
// src/components/Alert.tsx
|
|
5115
|
-
var
|
|
5116
|
-
var
|
|
5117
|
-
var
|
|
5062
|
+
var import_clsx38 = __toESM(require("clsx"), 1);
|
|
5063
|
+
var import_react35 = require("react");
|
|
5064
|
+
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
5118
5065
|
|
|
5119
5066
|
// src/components/OrderCheckIcon.tsx
|
|
5120
|
-
var
|
|
5067
|
+
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
5121
5068
|
|
|
5122
5069
|
// src/components/CalendarRange.tsx
|
|
5123
|
-
var
|
|
5070
|
+
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
5124
5071
|
function DateCell(_a) {
|
|
5125
5072
|
var _b = _a, {
|
|
5126
5073
|
date,
|
|
@@ -5155,12 +5102,12 @@ function DateCell(_a) {
|
|
|
5155
5102
|
"id",
|
|
5156
5103
|
"testid"
|
|
5157
5104
|
]);
|
|
5158
|
-
return /* @__PURE__ */ (0,
|
|
5105
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5159
5106
|
"span",
|
|
5160
5107
|
__spreadProps(__spreadValues({}, props), {
|
|
5161
5108
|
id,
|
|
5162
5109
|
"data-testid": testid,
|
|
5163
|
-
className: (0,
|
|
5110
|
+
className: (0, import_clsx39.default)(
|
|
5164
5111
|
"flex items-center justify-center aspect-square select-none transition-colors border duration-100 font-medium",
|
|
5165
5112
|
typography.caption,
|
|
5166
5113
|
cellPadding,
|
|
@@ -5231,20 +5178,20 @@ function CalendarRange({
|
|
|
5231
5178
|
const fromDate = parseDate(from);
|
|
5232
5179
|
const toDate = parseDate(to);
|
|
5233
5180
|
const today = import_polyfill.Temporal.Now.plainDateISO();
|
|
5234
|
-
const [baseMonth, setBaseMonth] = (0,
|
|
5181
|
+
const [baseMonth, setBaseMonth] = (0, import_react36.useState)(
|
|
5235
5182
|
fromDate != null ? fromDate : today.with({ day: 1 })
|
|
5236
5183
|
);
|
|
5237
|
-
const [selecting, setSelecting] = (0,
|
|
5238
|
-
const [pendingFrom, setPendingFrom] = (0,
|
|
5239
|
-
const [hoveredDate, setHoveredDate] = (0,
|
|
5240
|
-
(0,
|
|
5184
|
+
const [selecting, setSelecting] = (0, import_react36.useState)("from");
|
|
5185
|
+
const [pendingFrom, setPendingFrom] = (0, import_react36.useState)(void 0);
|
|
5186
|
+
const [hoveredDate, setHoveredDate] = (0, import_react36.useState)(void 0);
|
|
5187
|
+
(0, import_react36.useEffect)(() => {
|
|
5241
5188
|
if (fromDate) {
|
|
5242
5189
|
setBaseMonth(fromDate.with({ day: 1 }));
|
|
5243
5190
|
} else if (toDate) {
|
|
5244
5191
|
setBaseMonth(toDate.with({ day: 1 }));
|
|
5245
5192
|
}
|
|
5246
5193
|
}, [from, to]);
|
|
5247
|
-
(0,
|
|
5194
|
+
(0, import_react36.useEffect)(() => {
|
|
5248
5195
|
if (fromDate && toDate) {
|
|
5249
5196
|
setSelecting("from");
|
|
5250
5197
|
setPendingFrom(void 0);
|
|
@@ -5311,12 +5258,12 @@ function CalendarRange({
|
|
|
5311
5258
|
}
|
|
5312
5259
|
return false;
|
|
5313
5260
|
}
|
|
5314
|
-
return /* @__PURE__ */ (0,
|
|
5261
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5315
5262
|
"div",
|
|
5316
5263
|
{
|
|
5317
5264
|
id,
|
|
5318
5265
|
"data-testid": testid,
|
|
5319
|
-
className: (0,
|
|
5266
|
+
className: (0, import_clsx39.default)(
|
|
5320
5267
|
"relative bg-background-grouped-primary-normal rounded-base w-fit",
|
|
5321
5268
|
layoutPaddding,
|
|
5322
5269
|
layoutGap,
|
|
@@ -5324,15 +5271,15 @@ function CalendarRange({
|
|
|
5324
5271
|
// baseTransition,
|
|
5325
5272
|
"overflow-hidden"
|
|
5326
5273
|
),
|
|
5327
|
-
children: /* @__PURE__ */ (0,
|
|
5274
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5328
5275
|
"div",
|
|
5329
5276
|
{
|
|
5330
|
-
className: (0,
|
|
5277
|
+
className: (0, import_clsx39.default)(
|
|
5331
5278
|
"flex flex-row items-start justify-start bg-background-primary-normal overflow-clip",
|
|
5332
5279
|
layoutGap
|
|
5333
5280
|
),
|
|
5334
5281
|
children: (mode === "double" ? [0, 1] : [0]).map((offset, idx) => {
|
|
5335
|
-
return /* @__PURE__ */ (0,
|
|
5282
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5336
5283
|
CalendarPane,
|
|
5337
5284
|
{
|
|
5338
5285
|
getMonthData,
|
|
@@ -5390,45 +5337,45 @@ function CalendarPane({
|
|
|
5390
5337
|
const years = Array.from({ length: 100 }).map(
|
|
5391
5338
|
(_, i) => baseMonth.year - 50 + i
|
|
5392
5339
|
);
|
|
5393
|
-
const [monthMenuOpen, setMonthMenuOpen] = (0,
|
|
5394
|
-
const [yearMenuOpen, setYearMenuOpen] = (0,
|
|
5395
|
-
const monthMenuRef = (0,
|
|
5396
|
-
const yearMenuRef = (0,
|
|
5340
|
+
const [monthMenuOpen, setMonthMenuOpen] = (0, import_react36.useState)(false);
|
|
5341
|
+
const [yearMenuOpen, setYearMenuOpen] = (0, import_react36.useState)(false);
|
|
5342
|
+
const monthMenuRef = (0, import_react36.useRef)(null);
|
|
5343
|
+
const yearMenuRef = (0, import_react36.useRef)(null);
|
|
5397
5344
|
const month = getMonthData(offset);
|
|
5398
5345
|
const totalCells = 42;
|
|
5399
5346
|
const emptyCells = month.firstDayOffset;
|
|
5400
|
-
return /* @__PURE__ */ (0,
|
|
5401
|
-
/* @__PURE__ */ (0,
|
|
5347
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_react36.default.Fragment, { children: [
|
|
5348
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
|
|
5402
5349
|
"div",
|
|
5403
5350
|
{
|
|
5404
|
-
className: (0,
|
|
5351
|
+
className: (0, import_clsx39.default)("flex flex-col"),
|
|
5405
5352
|
children: [
|
|
5406
|
-
/* @__PURE__ */ (0,
|
|
5353
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
|
|
5407
5354
|
"div",
|
|
5408
5355
|
{
|
|
5409
|
-
className: (0,
|
|
5356
|
+
className: (0, import_clsx39.default)(
|
|
5410
5357
|
"flex flex-row items-center justify-between",
|
|
5411
5358
|
typography.label,
|
|
5412
5359
|
"text-text-action-primary-normal"
|
|
5413
5360
|
),
|
|
5414
5361
|
children: [
|
|
5415
|
-
idx === 0 ? /* @__PURE__ */ (0,
|
|
5362
|
+
idx === 0 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5416
5363
|
"button",
|
|
5417
5364
|
{
|
|
5418
5365
|
id: id ? `${id}-prev-month-button` : void 0,
|
|
5419
5366
|
"data-testid": testid ? `${testid}-prev-month-button` : void 0,
|
|
5420
5367
|
type: "button",
|
|
5421
|
-
className: (0,
|
|
5368
|
+
className: (0, import_clsx39.default)(
|
|
5422
5369
|
"flex items-center justify-center rounded-base hover:bg-action-100 active:bg-action-300 text-icon-action-primary-normal",
|
|
5423
5370
|
componentPadding
|
|
5424
5371
|
),
|
|
5425
5372
|
"aria-label": "Previous month",
|
|
5426
5373
|
onClick: () => setBaseMonth(baseMonth.subtract({ months: 1 })),
|
|
5427
|
-
children: /* @__PURE__ */ (0,
|
|
5374
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: "chevron_left", size: 24 })
|
|
5428
5375
|
}
|
|
5429
|
-
) : /* @__PURE__ */ (0,
|
|
5430
|
-
/* @__PURE__ */ (0,
|
|
5431
|
-
/* @__PURE__ */ (0,
|
|
5376
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: (0, import_clsx39.default)(componentPadding, "mr-1") }),
|
|
5377
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "flex gap-desktop-compact-component-padding", children: [
|
|
5378
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5432
5379
|
"button",
|
|
5433
5380
|
{
|
|
5434
5381
|
ref: (el) => {
|
|
@@ -5443,13 +5390,13 @@ function CalendarPane({
|
|
|
5443
5390
|
children: month.name
|
|
5444
5391
|
}
|
|
5445
5392
|
),
|
|
5446
|
-
/* @__PURE__ */ (0,
|
|
5393
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5447
5394
|
Menu,
|
|
5448
5395
|
{
|
|
5449
5396
|
show: monthMenuOpen,
|
|
5450
5397
|
positionTo: monthMenuRef,
|
|
5451
5398
|
setShow: () => setMonthMenuOpen(false),
|
|
5452
|
-
children: months.map((x) => [x, getMonthDataWith(x + 1)]).map(([x, m]) => /* @__PURE__ */ (0,
|
|
5399
|
+
children: months.map((x) => [x, getMonthDataWith(x + 1)]).map(([x, m]) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5453
5400
|
MenuOption,
|
|
5454
5401
|
{
|
|
5455
5402
|
selected: baseMonth.month === x + 1,
|
|
@@ -5463,7 +5410,7 @@ function CalendarPane({
|
|
|
5463
5410
|
))
|
|
5464
5411
|
}
|
|
5465
5412
|
),
|
|
5466
|
-
/* @__PURE__ */ (0,
|
|
5413
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5467
5414
|
"button",
|
|
5468
5415
|
{
|
|
5469
5416
|
ref: (el) => {
|
|
@@ -5478,13 +5425,13 @@ function CalendarPane({
|
|
|
5478
5425
|
children: month.year
|
|
5479
5426
|
}
|
|
5480
5427
|
),
|
|
5481
|
-
/* @__PURE__ */ (0,
|
|
5428
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5482
5429
|
Menu,
|
|
5483
5430
|
{
|
|
5484
5431
|
show: yearMenuOpen,
|
|
5485
5432
|
positionTo: yearMenuRef,
|
|
5486
5433
|
setShow: () => setYearMenuOpen(false),
|
|
5487
|
-
children: years.map((y) => /* @__PURE__ */ (0,
|
|
5434
|
+
children: years.map((y) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5488
5435
|
MenuOption,
|
|
5489
5436
|
{
|
|
5490
5437
|
selected: baseMonth.year === y,
|
|
@@ -5499,28 +5446,28 @@ function CalendarPane({
|
|
|
5499
5446
|
}
|
|
5500
5447
|
)
|
|
5501
5448
|
] }),
|
|
5502
|
-
(mode === "double" ? idx === 1 : true) ? /* @__PURE__ */ (0,
|
|
5449
|
+
(mode === "double" ? idx === 1 : true) ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5503
5450
|
"button",
|
|
5504
5451
|
{
|
|
5505
5452
|
id: id ? `${id}-next-month-button` : void 0,
|
|
5506
5453
|
"data-testid": testid ? `${testid}-next-month-button` : void 0,
|
|
5507
5454
|
type: "button",
|
|
5508
|
-
className: (0,
|
|
5455
|
+
className: (0, import_clsx39.default)(
|
|
5509
5456
|
"flex items-center justify-center rounded-base hover:bg-action-100 active:bg-action-300 text-icon-action-primary-normal",
|
|
5510
5457
|
componentPadding
|
|
5511
5458
|
),
|
|
5512
5459
|
"aria-label": "Next month",
|
|
5513
5460
|
onClick: () => setBaseMonth(baseMonth.add({ months: 1 })),
|
|
5514
|
-
children: /* @__PURE__ */ (0,
|
|
5461
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: "chevron_right", size: 24 })
|
|
5515
5462
|
}
|
|
5516
|
-
) : /* @__PURE__ */ (0,
|
|
5463
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: (0, import_clsx39.default)(componentPadding, "ml-1") })
|
|
5517
5464
|
]
|
|
5518
5465
|
}
|
|
5519
5466
|
),
|
|
5520
|
-
/* @__PURE__ */ (0,
|
|
5467
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: (0, import_clsx39.default)("grid grid-cols-7"), children: weekDays.map((d) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5521
5468
|
"span",
|
|
5522
5469
|
{
|
|
5523
|
-
className: (0,
|
|
5470
|
+
className: (0, import_clsx39.default)(
|
|
5524
5471
|
typography.caption,
|
|
5525
5472
|
"text-text-secondary-normal text-center",
|
|
5526
5473
|
"w-10"
|
|
@@ -5529,7 +5476,7 @@ function CalendarPane({
|
|
|
5529
5476
|
},
|
|
5530
5477
|
d
|
|
5531
5478
|
)) }),
|
|
5532
|
-
/* @__PURE__ */ (0,
|
|
5479
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: (0, import_clsx39.default)("grid grid-cols-7"), children: Array.from({ length: totalCells }).map((_, i) => {
|
|
5533
5480
|
const day = i - emptyCells + 1;
|
|
5534
5481
|
const date = month.date.with({ day: 1 }).add({
|
|
5535
5482
|
days: i - emptyCells
|
|
@@ -5543,7 +5490,7 @@ function CalendarPane({
|
|
|
5543
5490
|
const hoverDateIsAfterPendingFrom = hoveredDate && pendingFrom && import_polyfill.Temporal.PlainDate.compare(hoveredDate, pendingFrom) >= 0;
|
|
5544
5491
|
const isRangeStart = mode === "single" && disableRange ? false : !pendingFrom && isInMonth && fromDate && date.equals(fromDate) || hoverDateIsAfterPendingFrom && date.equals(pendingFrom);
|
|
5545
5492
|
const isRangeEnd = mode === "single" && disableRange ? false : !pendingFrom && isInMonth && toDate && date.equals(toDate) || hoverDateIsBeforePendingFrom && date.equals(pendingFrom);
|
|
5546
|
-
return /* @__PURE__ */ (0,
|
|
5493
|
+
return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5547
5494
|
DateCell,
|
|
5548
5495
|
{
|
|
5549
5496
|
id: id ? `${id}-date-${date.toString()}` : void 0,
|
|
@@ -5568,10 +5515,10 @@ function CalendarPane({
|
|
|
5568
5515
|
]
|
|
5569
5516
|
}
|
|
5570
5517
|
),
|
|
5571
|
-
mode === "double" && idx === 0 && /* @__PURE__ */ (0,
|
|
5518
|
+
mode === "double" && idx === 0 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
|
|
5572
5519
|
"div",
|
|
5573
5520
|
{
|
|
5574
|
-
className: (0,
|
|
5521
|
+
className: (0, import_clsx39.default)(
|
|
5575
5522
|
"self-stretch bg-border-primary-normal rounded-base",
|
|
5576
5523
|
// 1px width, full height, matches Figma divider
|
|
5577
5524
|
"w-px"
|
|
@@ -5582,7 +5529,7 @@ function CalendarPane({
|
|
|
5582
5529
|
}
|
|
5583
5530
|
|
|
5584
5531
|
// src/components/DateInput.tsx
|
|
5585
|
-
var
|
|
5532
|
+
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
5586
5533
|
var DateInput = (_a) => {
|
|
5587
5534
|
var _b = _a, {
|
|
5588
5535
|
id,
|
|
@@ -5603,24 +5550,24 @@ var DateInput = (_a) => {
|
|
|
5603
5550
|
"readOnly",
|
|
5604
5551
|
"label"
|
|
5605
5552
|
]);
|
|
5606
|
-
const [visible, setVisible] = (0,
|
|
5607
|
-
const [inputValue, setInputValue] = (0,
|
|
5608
|
-
const [isTyping, setIsTyping] = (0,
|
|
5609
|
-
const popoverRef = (0,
|
|
5610
|
-
const triggerRef = (0,
|
|
5611
|
-
const rootRef = (0,
|
|
5612
|
-
const [calendarPosition, setCalendarPosition] = (0,
|
|
5553
|
+
const [visible, setVisible] = (0, import_react37.useState)(false);
|
|
5554
|
+
const [inputValue, setInputValue] = (0, import_react37.useState)("");
|
|
5555
|
+
const [isTyping, setIsTyping] = (0, import_react37.useState)(false);
|
|
5556
|
+
const popoverRef = (0, import_react37.useRef)(null);
|
|
5557
|
+
const triggerRef = (0, import_react37.useRef)(null);
|
|
5558
|
+
const rootRef = (0, import_react37.useRef)(null);
|
|
5559
|
+
const [calendarPosition, setCalendarPosition] = (0, import_react37.useState)({
|
|
5613
5560
|
top: 0,
|
|
5614
5561
|
left: 0,
|
|
5615
5562
|
width: 0
|
|
5616
5563
|
});
|
|
5617
5564
|
const [from, to] = [value, ""];
|
|
5618
|
-
(0,
|
|
5565
|
+
(0, import_react37.useEffect)(() => {
|
|
5619
5566
|
if (!isTyping) {
|
|
5620
5567
|
setInputValue(formatDisplayValue(from));
|
|
5621
5568
|
}
|
|
5622
5569
|
}, [from, isTyping]);
|
|
5623
|
-
(0,
|
|
5570
|
+
(0, import_react37.useLayoutEffect)(() => {
|
|
5624
5571
|
if (visible) {
|
|
5625
5572
|
updatePosition();
|
|
5626
5573
|
}
|
|
@@ -5635,7 +5582,7 @@ var DateInput = (_a) => {
|
|
|
5635
5582
|
});
|
|
5636
5583
|
}
|
|
5637
5584
|
};
|
|
5638
|
-
(0,
|
|
5585
|
+
(0, import_react37.useEffect)(() => {
|
|
5639
5586
|
updatePosition();
|
|
5640
5587
|
const resizeObserver = new ResizeObserver(updatePosition);
|
|
5641
5588
|
if (triggerRef.current) {
|
|
@@ -5647,7 +5594,7 @@ var DateInput = (_a) => {
|
|
|
5647
5594
|
window.removeEventListener("scroll", updatePosition);
|
|
5648
5595
|
};
|
|
5649
5596
|
}, []);
|
|
5650
|
-
(0,
|
|
5597
|
+
(0, import_react37.useEffect)(() => {
|
|
5651
5598
|
const handleKeyDown2 = (event) => {
|
|
5652
5599
|
var _a2;
|
|
5653
5600
|
if (event.key === "Escape" && popoverRef.current) {
|
|
@@ -5660,7 +5607,7 @@ var DateInput = (_a) => {
|
|
|
5660
5607
|
document.removeEventListener("keydown", handleKeyDown2);
|
|
5661
5608
|
};
|
|
5662
5609
|
});
|
|
5663
|
-
(0,
|
|
5610
|
+
(0, import_react37.useEffect)(() => {
|
|
5664
5611
|
const handleClickOutside = (event) => {
|
|
5665
5612
|
if (popoverRef.current && !popoverRef.current.contains(event.target) && triggerRef.current && !triggerRef.current.contains(event.target)) {
|
|
5666
5613
|
setVisible(false);
|
|
@@ -5741,8 +5688,8 @@ var DateInput = (_a) => {
|
|
|
5741
5688
|
}
|
|
5742
5689
|
}
|
|
5743
5690
|
};
|
|
5744
|
-
return /* @__PURE__ */ (0,
|
|
5745
|
-
/* @__PURE__ */ (0,
|
|
5691
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "relative", children: [
|
|
5692
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5746
5693
|
InputBase,
|
|
5747
5694
|
__spreadProps(__spreadValues({
|
|
5748
5695
|
id,
|
|
@@ -5756,7 +5703,7 @@ var DateInput = (_a) => {
|
|
|
5756
5703
|
placeholder,
|
|
5757
5704
|
disabled,
|
|
5758
5705
|
readOnly,
|
|
5759
|
-
after: /* @__PURE__ */ (0,
|
|
5706
|
+
after: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: "calendar_month" }),
|
|
5760
5707
|
onFocus: handleFocus,
|
|
5761
5708
|
onClick: handleClick,
|
|
5762
5709
|
onChange: handleInputChange,
|
|
@@ -5767,7 +5714,7 @@ var DateInput = (_a) => {
|
|
|
5767
5714
|
})
|
|
5768
5715
|
),
|
|
5769
5716
|
visible && !readOnly && (0, import_react_dom4.createPortal)(
|
|
5770
|
-
/* @__PURE__ */ (0,
|
|
5717
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5771
5718
|
"div",
|
|
5772
5719
|
{
|
|
5773
5720
|
ref: (el) => {
|
|
@@ -5779,7 +5726,7 @@ var DateInput = (_a) => {
|
|
|
5779
5726
|
left: `${calendarPosition.left}px`,
|
|
5780
5727
|
minWidth: `${calendarPosition.width}px`
|
|
5781
5728
|
},
|
|
5782
|
-
children: /* @__PURE__ */ (0,
|
|
5729
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5783
5730
|
CalendarRange,
|
|
5784
5731
|
{
|
|
5785
5732
|
id: id ? `${id}-calendar` : void 0,
|
|
@@ -1,16 +1,12 @@
|
|
|
1
1
|
import {
|
|
2
2
|
DateInput
|
|
3
|
-
} from "../chunk-
|
|
3
|
+
} from "../chunk-JWVZOEF5.js";
|
|
4
4
|
import "../chunk-M7INAUAJ.js";
|
|
5
5
|
import "../chunk-ELXVDRWS.js";
|
|
6
6
|
import "../chunk-3UUCDNX3.js";
|
|
7
7
|
import "../chunk-FJRYHJUV.js";
|
|
8
8
|
import "../chunk-BQNPOGD5.js";
|
|
9
9
|
import "../chunk-Y5GD2FJA.js";
|
|
10
|
-
import "../chunk-6XLESQ2U.js";
|
|
11
|
-
import "../chunk-VOSQMHNF.js";
|
|
12
|
-
import "../chunk-YJGDVWTH.js";
|
|
13
|
-
import "../chunk-S5ZJ3Q7P.js";
|
|
14
10
|
import "../chunk-MBZ55T2D.js";
|
|
15
11
|
import "../chunk-2IKT6IHB.js";
|
|
16
12
|
import "../chunk-YCDDBSVU.js";
|
|
@@ -20,7 +16,6 @@ import "../chunk-5YNEY3WO.js";
|
|
|
20
16
|
import "../chunk-5IFPG6TS.js";
|
|
21
17
|
import "../chunk-AJ5M6MVX.js";
|
|
22
18
|
import "../chunk-UI7P5J5S.js";
|
|
23
|
-
import "../chunk-56RPZLV7.js";
|
|
24
19
|
import "../chunk-MDB26F6T.js";
|
|
25
20
|
import "../chunk-AT4AWD6B.js";
|
|
26
21
|
import "../chunk-EWGHVZL5.js";
|
|
@@ -36,7 +31,6 @@ import "../chunk-CMMQTIVM.js";
|
|
|
36
31
|
import "../chunk-AG43RS4Q.js";
|
|
37
32
|
import "../chunk-AKJUBFJK.js";
|
|
38
33
|
import "../chunk-SUSUNSVZ.js";
|
|
39
|
-
import "../chunk-SBRRNFOP.js";
|
|
40
34
|
import "../chunk-Y2GK27RX.js";
|
|
41
35
|
import "../chunk-QVWYTQKL.js";
|
|
42
36
|
import "../chunk-F6RZ7MUE.js";
|