@osdk/react-components 0.21.0 → 0.21.1-main-8965bdf6a0c540d35214e7ff7328defbf04cf4c8
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/CHANGELOG.md +11 -0
- package/build/browser/shared/calendar/DateCalendar.js +27 -4
- package/build/browser/shared/calendar/DateCalendar.js.map +1 -1
- package/build/browser/shared/calendar/DatePicker.js +4 -17
- package/build/browser/shared/calendar/DatePicker.js.map +1 -1
- package/build/browser/shared/calendar/DatePicker.module.css +0 -5
- package/build/browser/shared/calendar/DatePicker.module.css.js +1 -2
- package/build/browser/shared/calendar/DateRangePicker.js +4 -2
- package/build/browser/shared/calendar/DateRangePicker.js.map +1 -1
- package/build/browser/shared/calendar/TimePicker.js +24 -45
- package/build/browser/shared/calendar/TimePicker.js.map +1 -1
- package/build/browser/styles.css +0 -5
- package/build/browser/util/UserAgent.js +1 -1
- package/build/browser/util/UserAgent.js.map +1 -1
- package/build/cjs/{DateCalendar-OLI4WF2E.cjs → DateCalendar-PZO23MYM.cjs} +6 -6
- package/build/cjs/{DateCalendar-OLI4WF2E.cjs.map → DateCalendar-PZO23MYM.cjs.map} +1 -1
- package/build/cjs/{DateCalendar-7E5ZCI7U.css → DateCalendar-XTX3RI6O.css} +35 -1
- package/build/cjs/DateCalendar-XTX3RI6O.css.map +1 -0
- package/build/cjs/DateRangeCalendar-2MBQAU3Z.cjs +12 -0
- package/build/cjs/{DateRangeCalendar-TC7G2J2D.cjs.map → DateRangeCalendar-2MBQAU3Z.cjs.map} +1 -1
- package/build/cjs/{DateRangeCalendar-R3RYMAD4.css → DateRangeCalendar-R7KHDKJT.css} +35 -1
- package/build/cjs/DateRangeCalendar-R7KHDKJT.css.map +1 -0
- package/build/cjs/{chunk-Y6BGC7DP.cjs → chunk-3S52UDZM.cjs} +22 -22
- package/build/cjs/{chunk-Y6BGC7DP.cjs.map → chunk-3S52UDZM.cjs.map} +1 -1
- package/build/cjs/{chunk-5XDYMIRI.cjs → chunk-BOPWPSHS.cjs} +17 -17
- package/build/cjs/{chunk-5XDYMIRI.cjs.map → chunk-BOPWPSHS.cjs.map} +1 -1
- package/build/cjs/{chunk-XA3S7YAO.cjs → chunk-E5OKIBYJ.cjs} +145 -317
- package/build/cjs/chunk-E5OKIBYJ.cjs.map +1 -0
- package/build/cjs/{chunk-TIFUKHW7.cjs → chunk-ESXB4FJ3.cjs} +3 -3
- package/build/cjs/chunk-ESXB4FJ3.cjs.map +1 -0
- package/build/cjs/chunk-GUV4HDHF.cjs +11 -0
- package/build/cjs/{chunk-F2WUXH2W.cjs.map → chunk-GUV4HDHF.cjs.map} +1 -1
- package/build/cjs/{chunk-MZPKV7JC.cjs → chunk-HN6TTUZV.cjs} +4 -4
- package/build/cjs/{chunk-MZPKV7JC.cjs.map → chunk-HN6TTUZV.cjs.map} +1 -1
- package/build/cjs/chunk-HY74JMBD.cjs +11 -0
- package/build/cjs/{chunk-XBIJFLHM.cjs.map → chunk-HY74JMBD.cjs.map} +1 -1
- package/build/cjs/{chunk-LBWASTWS.cjs → chunk-KPLJJZUF.cjs} +12 -12
- package/build/cjs/{chunk-LBWASTWS.cjs.map → chunk-KPLJJZUF.cjs.map} +1 -1
- package/build/cjs/{chunk-ZGW2CPEY.cjs → chunk-MXHPDZRJ.cjs} +11 -11
- package/build/cjs/{chunk-ZGW2CPEY.cjs.map → chunk-MXHPDZRJ.cjs.map} +1 -1
- package/build/cjs/chunk-NE7GRF7G.cjs +366 -0
- package/build/cjs/chunk-NE7GRF7G.cjs.map +1 -0
- package/build/cjs/chunk-OXPFQGCX.cjs +11 -0
- package/build/cjs/{chunk-JOVWU475.cjs.map → chunk-OXPFQGCX.cjs.map} +1 -1
- package/build/cjs/chunk-QKRCTJ73.cjs +11 -0
- package/build/cjs/{chunk-DUQXYBH2.cjs.map → chunk-QKRCTJ73.cjs.map} +1 -1
- package/build/cjs/{chunk-RHIG474S.cjs → chunk-SUQDMDNS.cjs} +4 -4
- package/build/cjs/{chunk-RHIG474S.cjs.map → chunk-SUQDMDNS.cjs.map} +1 -1
- package/build/cjs/{chunk-7NQZT4VM.cjs → chunk-U7OJ52TT.cjs} +4 -4
- package/build/cjs/{chunk-7NQZT4VM.cjs.map → chunk-U7OJ52TT.cjs.map} +1 -1
- package/build/cjs/{chunk-FIM67ZE2.cjs → chunk-VEICVFRI.cjs} +51 -51
- package/build/cjs/{chunk-FIM67ZE2.cjs.map → chunk-VEICVFRI.cjs.map} +1 -1
- package/build/cjs/chunk-WCXGGFZ6.cjs +11 -0
- package/build/cjs/{chunk-VA2HOEKY.cjs.map → chunk-WCXGGFZ6.cjs.map} +1 -1
- package/build/cjs/{chunk-53QFFROW.cjs → chunk-XARSK3Q7.cjs} +4 -4
- package/build/cjs/{chunk-53QFFROW.cjs.map → chunk-XARSK3Q7.cjs.map} +1 -1
- package/build/cjs/public/experimental/action-form.cjs +8 -8
- package/build/cjs/public/experimental/action-form.css +34 -38
- package/build/cjs/public/experimental/action-form.css.map +1 -1
- package/build/cjs/public/experimental/document-viewer.cjs +4 -4
- package/build/cjs/public/experimental/email-viewer.cjs +3 -3
- package/build/cjs/public/experimental/excel-viewer.cjs +3 -3
- package/build/cjs/public/experimental/filter-list.cjs +17 -17
- package/build/cjs/public/experimental/filter-list.css +34 -38
- package/build/cjs/public/experimental/filter-list.css.map +1 -1
- package/build/cjs/public/experimental/image-viewer.cjs +3 -3
- package/build/cjs/public/experimental/markdown-renderer.cjs +3 -3
- package/build/cjs/public/experimental/object-table.cjs +12 -12
- package/build/cjs/public/experimental/object-table.css +34 -38
- package/build/cjs/public/experimental/object-table.css.map +1 -1
- package/build/cjs/public/experimental/pdf-viewer.cjs +7 -7
- package/build/cjs/public/experimental/tiff-renderer.cjs +3 -3
- package/build/cjs/public/experimental/video-viewer.cjs +3 -3
- package/build/cjs/public/experimental/xml-viewer.cjs +3 -3
- package/build/cjs/public/experimental.cjs +51 -51
- package/build/cjs/public/experimental.css +34 -38
- package/build/cjs/public/experimental.css.map +1 -1
- package/build/esm/shared/calendar/DateCalendar.js +27 -4
- package/build/esm/shared/calendar/DateCalendar.js.map +1 -1
- package/build/esm/shared/calendar/DatePicker.js +4 -17
- package/build/esm/shared/calendar/DatePicker.js.map +1 -1
- package/build/esm/shared/calendar/DatePicker.module.css +0 -5
- package/build/esm/shared/calendar/DateRangePicker.js +4 -2
- package/build/esm/shared/calendar/DateRangePicker.js.map +1 -1
- package/build/esm/shared/calendar/TimePicker.js +24 -45
- package/build/esm/shared/calendar/TimePicker.js.map +1 -1
- package/build/esm/util/UserAgent.js +1 -1
- package/build/esm/util/UserAgent.js.map +1 -1
- package/build/types/shared/calendar/DateCalendar.d.ts +2 -2
- package/build/types/shared/calendar/DateCalendar.d.ts.map +1 -1
- package/build/types/shared/calendar/DatePicker.d.ts.map +1 -1
- package/build/types/shared/calendar/TimePicker.d.ts.map +1 -1
- package/package.json +8 -8
- package/build/cjs/DateCalendar-7E5ZCI7U.css.map +0 -1
- package/build/cjs/DateRangeCalendar-R3RYMAD4.css.map +0 -1
- package/build/cjs/DateRangeCalendar-TC7G2J2D.cjs +0 -12
- package/build/cjs/chunk-DUQXYBH2.cjs +0 -11
- package/build/cjs/chunk-F2WUXH2W.cjs +0 -11
- package/build/cjs/chunk-JBRNNWYC.cjs +0 -197
- package/build/cjs/chunk-JBRNNWYC.cjs.map +0 -1
- package/build/cjs/chunk-JOVWU475.cjs +0 -11
- package/build/cjs/chunk-TIFUKHW7.cjs.map +0 -1
- package/build/cjs/chunk-VA2HOEKY.cjs +0 -11
- package/build/cjs/chunk-XA3S7YAO.cjs.map +0 -1
- package/build/cjs/chunk-XBIJFLHM.cjs +0 -11
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkNE7GRF7G_cjs = require('./chunk-NE7GRF7G.cjs');
|
|
4
4
|
var input = require('@base-ui/react/input');
|
|
5
5
|
var popover = require('@base-ui/react/popover');
|
|
6
6
|
var classnames3 = require('classnames');
|
|
7
|
-
var
|
|
7
|
+
var React6 = require('react');
|
|
8
8
|
var combobox = require('@base-ui/react/combobox');
|
|
9
9
|
var icons = require('@blueprintjs/icons');
|
|
10
10
|
|
|
11
11
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
12
|
|
|
13
13
|
var classnames3__default = /*#__PURE__*/_interopDefault(classnames3);
|
|
14
|
-
var
|
|
14
|
+
var React6__default = /*#__PURE__*/_interopDefault(React6);
|
|
15
15
|
|
|
16
16
|
// src/shared/PortalDismissLayer.module.css
|
|
17
17
|
var PortalDismissLayer_default = {};
|
|
18
18
|
|
|
19
19
|
// src/shared/PortalDismissLayer.tsx
|
|
20
|
-
var PortalDismissLayer = /* @__PURE__ */
|
|
20
|
+
var PortalDismissLayer = /* @__PURE__ */ React6__default.default.memo(function PortalDismissLayer2({
|
|
21
21
|
className,
|
|
22
22
|
onDismiss
|
|
23
23
|
}) {
|
|
24
|
-
const handlePointerDown =
|
|
24
|
+
const handlePointerDown = React6.useCallback((event) => {
|
|
25
25
|
event.preventDefault();
|
|
26
26
|
onDismiss();
|
|
27
27
|
}, [onDismiss]);
|
|
28
|
-
return /* @__PURE__ */
|
|
28
|
+
return /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
29
29
|
"aria-hidden": "true",
|
|
30
30
|
className: classnames3__default.default(PortalDismissLayer_default.osdkPortalDismissLayer, className),
|
|
31
31
|
"data-osdk-portal-dismiss-layer": "",
|
|
@@ -38,178 +38,13 @@ var DatePicker_default = {};
|
|
|
38
38
|
|
|
39
39
|
// src/shared/calendar/DatePickerCommon.module.css
|
|
40
40
|
var DatePickerCommon_default = {};
|
|
41
|
-
var DateCalendarLazy = /* @__PURE__ */
|
|
41
|
+
var DateCalendarLazy = /* @__PURE__ */ React6__default.default.lazy(() => import('./DateCalendar-PZO23MYM.cjs'));
|
|
42
42
|
function LazyDateCalendar(props) {
|
|
43
|
-
return /* @__PURE__ */
|
|
44
|
-
fallback: /* @__PURE__ */
|
|
43
|
+
return /* @__PURE__ */ React6__default.default.createElement(React6.Suspense, {
|
|
44
|
+
fallback: /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
45
45
|
className: DatePickerCommon_default.osdkDatePickerFallback
|
|
46
46
|
})
|
|
47
|
-
}, /* @__PURE__ */
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
// src/shared/calendar/TimePicker.module.css
|
|
51
|
-
var TimePicker_default = {};
|
|
52
|
-
|
|
53
|
-
// src/shared/calendar/TimePicker.tsx
|
|
54
|
-
var NUMERIC_INPUT_PATTERN = "[0-9]*";
|
|
55
|
-
var SEGMENT_LIMITS = {
|
|
56
|
-
hours: {
|
|
57
|
-
min: 0,
|
|
58
|
-
max: 23
|
|
59
|
-
},
|
|
60
|
-
minutes: {
|
|
61
|
-
min: 0,
|
|
62
|
-
max: 59
|
|
63
|
-
}
|
|
64
|
-
};
|
|
65
|
-
var TimePicker = /* @__PURE__ */ React7__default.default.memo(function TimePickerFn({
|
|
66
|
-
value,
|
|
67
|
-
onChange,
|
|
68
|
-
label = "Time"
|
|
69
|
-
}) {
|
|
70
|
-
const valueTimestamp = value?.getTime() ?? null;
|
|
71
|
-
const [internalSegments, setInternalSegments] = React7.useState(() => createInternalSegments(valueTimestamp, segmentsFromTimestamp(valueTimestamp)));
|
|
72
|
-
const valueSegments = React7.useMemo(() => segmentsFromTimestamp(valueTimestamp), [valueTimestamp]);
|
|
73
|
-
const activeSegments = internalSegments.valueTimestamp === valueTimestamp ? internalSegments : createInternalSegments(valueTimestamp, valueSegments);
|
|
74
|
-
const hourText = activeSegments.hours;
|
|
75
|
-
const minuteText = activeSegments.minutes;
|
|
76
|
-
const hourInvalid = isSegmentInvalid(hourText, "hours");
|
|
77
|
-
const minuteInvalid = isSegmentInvalid(minuteText, "minutes");
|
|
78
|
-
const emitChange = React7.useCallback((hours, minutes) => {
|
|
79
|
-
const nextDate = value != null ? new Date(value.getTime()) : /* @__PURE__ */ new Date();
|
|
80
|
-
nextDate.setHours(hours, minutes, 0, 0);
|
|
81
|
-
onChange?.(nextDate);
|
|
82
|
-
}, [onChange, value]);
|
|
83
|
-
const handleSegmentChange = React7.useCallback((segment, nextText) => {
|
|
84
|
-
setInternalSegments({
|
|
85
|
-
valueTimestamp,
|
|
86
|
-
...replaceSegmentText({
|
|
87
|
-
hours: hourText,
|
|
88
|
-
minutes: minuteText
|
|
89
|
-
}, {
|
|
90
|
-
segment,
|
|
91
|
-
nextText
|
|
92
|
-
})
|
|
93
|
-
});
|
|
94
|
-
}, [hourText, minuteText, valueTimestamp]);
|
|
95
|
-
const handleSegmentBlur = React7.useCallback((segment, text) => {
|
|
96
|
-
const parsedSegment = parseNumber(text);
|
|
97
|
-
if (parsedSegment == null) {
|
|
98
|
-
setInternalSegments(createInternalSegments(valueTimestamp, valueSegments));
|
|
99
|
-
return;
|
|
100
|
-
}
|
|
101
|
-
const clampedSegment = clampSegment(parsedSegment, segment);
|
|
102
|
-
const nextSegments = replaceSegmentText({
|
|
103
|
-
hours: hourText,
|
|
104
|
-
minutes: minuteText
|
|
105
|
-
}, {
|
|
106
|
-
segment,
|
|
107
|
-
nextText: formatSegment(clampedSegment, segment)
|
|
108
|
-
});
|
|
109
|
-
const nextHours = parseSegment(nextSegments.hours, "hours") ?? Number(valueSegments.hours);
|
|
110
|
-
const nextMinutes = parseSegment(nextSegments.minutes, "minutes") ?? Number(valueSegments.minutes);
|
|
111
|
-
setInternalSegments({
|
|
112
|
-
valueTimestamp,
|
|
113
|
-
hours: formatSegment(nextHours, "hours"),
|
|
114
|
-
minutes: formatSegment(nextMinutes, "minutes")
|
|
115
|
-
});
|
|
116
|
-
const currentHours = Number(valueSegments.hours);
|
|
117
|
-
const currentMinutes = Number(valueSegments.minutes);
|
|
118
|
-
if (nextHours !== currentHours || nextMinutes !== currentMinutes) {
|
|
119
|
-
emitChange(nextHours, nextMinutes);
|
|
120
|
-
}
|
|
121
|
-
}, [emitChange, hourText, minuteText, valueTimestamp, valueSegments]);
|
|
122
|
-
const handleHourChange = React7.useCallback((nextText) => handleSegmentChange("hours", nextText), [handleSegmentChange]);
|
|
123
|
-
const handleMinuteChange = React7.useCallback((nextText) => handleSegmentChange("minutes", nextText), [handleSegmentChange]);
|
|
124
|
-
const handleHourBlur = React7.useCallback(() => handleSegmentBlur("hours", hourText), [handleSegmentBlur, hourText]);
|
|
125
|
-
const handleMinuteBlur = React7.useCallback(() => handleSegmentBlur("minutes", minuteText), [handleSegmentBlur, minuteText]);
|
|
126
|
-
return /* @__PURE__ */ React7__default.default.createElement("div", {
|
|
127
|
-
className: TimePicker_default.osdkTimePickerRoot,
|
|
128
|
-
role: "group",
|
|
129
|
-
"aria-label": label
|
|
130
|
-
}, /* @__PURE__ */ React7__default.default.createElement(input.Input, {
|
|
131
|
-
type: "text",
|
|
132
|
-
inputMode: "numeric",
|
|
133
|
-
pattern: NUMERIC_INPUT_PATTERN,
|
|
134
|
-
value: hourText,
|
|
135
|
-
onValueChange: handleHourChange,
|
|
136
|
-
onBlur: handleHourBlur,
|
|
137
|
-
className: TimePicker_default.osdkTimePickerInput,
|
|
138
|
-
"aria-label": `${label} hours`,
|
|
139
|
-
"aria-invalid": hourInvalid || void 0
|
|
140
|
-
}), /* @__PURE__ */ React7__default.default.createElement("span", {
|
|
141
|
-
className: TimePicker_default.osdkTimePickerSeparator,
|
|
142
|
-
"aria-hidden": "true"
|
|
143
|
-
}, ":"), /* @__PURE__ */ React7__default.default.createElement(input.Input, {
|
|
144
|
-
type: "text",
|
|
145
|
-
inputMode: "numeric",
|
|
146
|
-
pattern: NUMERIC_INPUT_PATTERN,
|
|
147
|
-
value: minuteText,
|
|
148
|
-
onValueChange: handleMinuteChange,
|
|
149
|
-
onBlur: handleMinuteBlur,
|
|
150
|
-
className: TimePicker_default.osdkTimePickerInput,
|
|
151
|
-
"aria-label": `${label} minutes`,
|
|
152
|
-
"aria-invalid": minuteInvalid || void 0
|
|
153
|
-
}));
|
|
154
|
-
});
|
|
155
|
-
function createInternalSegments(valueTimestamp, segments) {
|
|
156
|
-
return {
|
|
157
|
-
valueTimestamp,
|
|
158
|
-
...segments
|
|
159
|
-
};
|
|
160
|
-
}
|
|
161
|
-
function replaceSegmentText(segments, {
|
|
162
|
-
segment,
|
|
163
|
-
nextText
|
|
164
|
-
}) {
|
|
165
|
-
return {
|
|
166
|
-
...segments,
|
|
167
|
-
[segment]: nextText
|
|
168
|
-
};
|
|
169
|
-
}
|
|
170
|
-
function segmentsFromTimestamp(valueTimestamp) {
|
|
171
|
-
if (valueTimestamp == null) {
|
|
172
|
-
return {
|
|
173
|
-
hours: formatSegment(0, "hours"),
|
|
174
|
-
minutes: formatSegment(0, "minutes")
|
|
175
|
-
};
|
|
176
|
-
}
|
|
177
|
-
const value = new Date(valueTimestamp);
|
|
178
|
-
return {
|
|
179
|
-
hours: formatSegment(value.getHours(), "hours"),
|
|
180
|
-
minutes: formatSegment(value.getMinutes(), "minutes")
|
|
181
|
-
};
|
|
182
|
-
}
|
|
183
|
-
function formatSegment(value, segment) {
|
|
184
|
-
return segment === "hours" ? String(value) : String(value).padStart(2, "0");
|
|
185
|
-
}
|
|
186
|
-
function parseNumber(text) {
|
|
187
|
-
if (!/^\d{1,2}$/.test(text)) {
|
|
188
|
-
return void 0;
|
|
189
|
-
}
|
|
190
|
-
const parsed = Number(text);
|
|
191
|
-
return Number.isNaN(parsed) ? void 0 : parsed;
|
|
192
|
-
}
|
|
193
|
-
function parseSegment(text, segment) {
|
|
194
|
-
const parsed = parseNumber(text);
|
|
195
|
-
if (parsed == null) {
|
|
196
|
-
return void 0;
|
|
197
|
-
}
|
|
198
|
-
const {
|
|
199
|
-
min,
|
|
200
|
-
max
|
|
201
|
-
} = SEGMENT_LIMITS[segment];
|
|
202
|
-
return parsed >= min && parsed <= max ? parsed : void 0;
|
|
203
|
-
}
|
|
204
|
-
function isSegmentInvalid(text, segment) {
|
|
205
|
-
return parseSegment(text, segment) == null;
|
|
206
|
-
}
|
|
207
|
-
function clampSegment(value, segment) {
|
|
208
|
-
const {
|
|
209
|
-
min,
|
|
210
|
-
max
|
|
211
|
-
} = SEGMENT_LIMITS[segment];
|
|
212
|
-
return Math.min(Math.max(value, min), max);
|
|
47
|
+
}, /* @__PURE__ */ React6__default.default.createElement(DateCalendarLazy, props));
|
|
213
48
|
}
|
|
214
49
|
function useDateEditState({
|
|
215
50
|
value,
|
|
@@ -220,9 +55,9 @@ function useDateEditState({
|
|
|
220
55
|
max,
|
|
221
56
|
onChange
|
|
222
57
|
}) {
|
|
223
|
-
const [isEditing, setIsEditing] =
|
|
224
|
-
const [inputValue, setInputValue] =
|
|
225
|
-
const prevValueTimeRef =
|
|
58
|
+
const [isEditing, setIsEditing] = React6.useState(false);
|
|
59
|
+
const [inputValue, setInputValue] = React6.useState("");
|
|
60
|
+
const prevValueTimeRef = React6.useRef(value?.getTime() ?? null);
|
|
226
61
|
const currentValueTime = value?.getTime() ?? null;
|
|
227
62
|
if (prevValueTimeRef.current !== currentValueTime) {
|
|
228
63
|
prevValueTimeRef.current = currentValueTime;
|
|
@@ -235,26 +70,26 @@ function useDateEditState({
|
|
|
235
70
|
const inputError = (() => {
|
|
236
71
|
if (!isEditing || inputValue === "") return null;
|
|
237
72
|
if (dateValue == null) return "invalid";
|
|
238
|
-
if (!
|
|
73
|
+
if (!chunkNE7GRF7G_cjs.isDateInRange(dateValue, min, max)) return "out-of-range";
|
|
239
74
|
return null;
|
|
240
75
|
})();
|
|
241
76
|
const validatedDate = inputError == null && dateValue != null ? dateValue : null;
|
|
242
|
-
const setDateValue =
|
|
77
|
+
const setDateValue = React6.useCallback((date) => {
|
|
243
78
|
setInputValue(date != null ? editFormatFn(date) : "");
|
|
244
79
|
}, [editFormatFn]);
|
|
245
|
-
const startEditing =
|
|
80
|
+
const startEditing = React6.useCallback(() => {
|
|
246
81
|
setIsEditing(true);
|
|
247
82
|
setDateValue(value);
|
|
248
83
|
}, [value, setDateValue]);
|
|
249
|
-
const stopEditing =
|
|
84
|
+
const stopEditing = React6.useCallback(() => {
|
|
250
85
|
setIsEditing(false);
|
|
251
86
|
setDateValue(value);
|
|
252
87
|
}, [value, setDateValue]);
|
|
253
|
-
const inputValueRef =
|
|
88
|
+
const inputValueRef = React6.useRef(inputValue);
|
|
254
89
|
inputValueRef.current = inputValue;
|
|
255
|
-
const validatedDateRef =
|
|
90
|
+
const validatedDateRef = React6.useRef(validatedDate);
|
|
256
91
|
validatedDateRef.current = validatedDate;
|
|
257
|
-
const commitAndStopEditing =
|
|
92
|
+
const commitAndStopEditing = React6.useCallback(() => {
|
|
258
93
|
if (inputValueRef.current === "") {
|
|
259
94
|
onChange?.(null);
|
|
260
95
|
} else if (validatedDateRef.current != null) {
|
|
@@ -277,7 +112,7 @@ function useDateEditState({
|
|
|
277
112
|
}
|
|
278
113
|
|
|
279
114
|
// src/shared/calendar/DatePicker.tsx
|
|
280
|
-
var DatePicker = /* @__PURE__ */
|
|
115
|
+
var DatePicker = /* @__PURE__ */ React6__default.default.memo(function DatePicker2({
|
|
281
116
|
id,
|
|
282
117
|
value,
|
|
283
118
|
onChange,
|
|
@@ -297,17 +132,17 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
297
132
|
}) {
|
|
298
133
|
const isModal = modal !== false;
|
|
299
134
|
const shouldCloseOnSelection = closeOnSelection ?? !showTime;
|
|
300
|
-
const popoverId =
|
|
301
|
-
const wrapperRef =
|
|
302
|
-
const inputRef =
|
|
303
|
-
const popoverRef =
|
|
304
|
-
const [isOpen, setIsOpen] =
|
|
305
|
-
const [visibleCalendarMonth, setVisibleCalendarMonth] =
|
|
306
|
-
const skipReopenRef =
|
|
307
|
-
const editFormatFn = showTime ?
|
|
308
|
-
const displayFormatFn = formatDate ?? (showTime ?
|
|
309
|
-
const parseFn = parseDate ?? (showTime ?
|
|
310
|
-
const handleChange =
|
|
135
|
+
const popoverId = React6.useId();
|
|
136
|
+
const wrapperRef = React6.useRef(null);
|
|
137
|
+
const inputRef = React6.useRef(null);
|
|
138
|
+
const popoverRef = React6.useRef(null);
|
|
139
|
+
const [isOpen, setIsOpen] = React6.useState(false);
|
|
140
|
+
const [visibleCalendarMonth, setVisibleCalendarMonth] = React6.useState(value ?? /* @__PURE__ */ new Date());
|
|
141
|
+
const skipReopenRef = React6.useRef(false);
|
|
142
|
+
const editFormatFn = showTime ? chunkNE7GRF7G_cjs.formatDatetimeForInput : chunkNE7GRF7G_cjs.formatDateForInput;
|
|
143
|
+
const displayFormatFn = formatDate ?? (showTime ? chunkNE7GRF7G_cjs.formatDatetimeForInput : chunkNE7GRF7G_cjs.formatDateForInput);
|
|
144
|
+
const parseFn = parseDate ?? (showTime ? chunkNE7GRF7G_cjs.parseDatetimeFromInput : chunkNE7GRF7G_cjs.parseDateFromInput);
|
|
145
|
+
const handleChange = React6.useCallback((date) => {
|
|
311
146
|
if (onChange == null) {
|
|
312
147
|
return;
|
|
313
148
|
}
|
|
@@ -337,7 +172,8 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
337
172
|
max,
|
|
338
173
|
onChange: handleChange
|
|
339
174
|
});
|
|
340
|
-
const
|
|
175
|
+
const activeDateValue = isEditing && inputError == null ? dateValue : value ?? void 0;
|
|
176
|
+
const handleFocus = React6.useCallback(() => {
|
|
341
177
|
if (skipReopenRef.current) {
|
|
342
178
|
skipReopenRef.current = false;
|
|
343
179
|
startEditing();
|
|
@@ -347,18 +183,18 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
347
183
|
setVisibleCalendarMonth(value ?? void 0);
|
|
348
184
|
setIsOpen(true);
|
|
349
185
|
}, [startEditing, value]);
|
|
350
|
-
const handlePointerDown =
|
|
186
|
+
const handlePointerDown = React6.useCallback(() => {
|
|
351
187
|
inputRef.current?.focus();
|
|
352
188
|
handleFocus();
|
|
353
189
|
}, [handleFocus]);
|
|
354
|
-
const handleInputValueChange =
|
|
190
|
+
const handleInputValueChange = React6.useCallback((nextValue) => {
|
|
355
191
|
setInputValue(nextValue);
|
|
356
192
|
const parsedDate = nextValue !== "" ? parseFn(nextValue) : void 0;
|
|
357
|
-
if (parsedDate != null &&
|
|
193
|
+
if (parsedDate != null && chunkNE7GRF7G_cjs.isDateInRange(parsedDate, min, max)) {
|
|
358
194
|
setVisibleCalendarMonth(parsedDate);
|
|
359
195
|
}
|
|
360
196
|
}, [max, min, parseFn, setInputValue]);
|
|
361
|
-
const handleBlur =
|
|
197
|
+
const handleBlur = React6.useCallback((e) => {
|
|
362
198
|
const relatedTarget = e.relatedTarget ?? document.activeElement;
|
|
363
199
|
if (popoverRef.current?.contains(relatedTarget)) {
|
|
364
200
|
e.stopPropagation();
|
|
@@ -366,12 +202,12 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
366
202
|
}
|
|
367
203
|
commitAndStopEditing();
|
|
368
204
|
}, [commitAndStopEditing]);
|
|
369
|
-
const closePopover =
|
|
205
|
+
const closePopover = React6.useCallback(() => {
|
|
370
206
|
setIsOpen(false);
|
|
371
207
|
stopEditing();
|
|
372
208
|
inputRef.current?.blur();
|
|
373
209
|
}, [stopEditing]);
|
|
374
|
-
const handleKeyDown =
|
|
210
|
+
const handleKeyDown = React6.useCallback((e) => {
|
|
375
211
|
if (e.key === "Enter") {
|
|
376
212
|
e.preventDefault();
|
|
377
213
|
commitAndStopEditing();
|
|
@@ -390,42 +226,39 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
390
226
|
setIsOpen(false);
|
|
391
227
|
}
|
|
392
228
|
}, [commitAndStopEditing, closePopover, isOpen, isModal]);
|
|
393
|
-
const handleOpenChange =
|
|
229
|
+
const handleOpenChange = React6.useCallback((nextOpen) => {
|
|
394
230
|
if (nextOpen) {
|
|
395
231
|
setIsOpen(true);
|
|
396
232
|
} else {
|
|
397
233
|
closePopover();
|
|
398
234
|
}
|
|
399
235
|
}, [closePopover]);
|
|
400
|
-
const handleCalendarSelect =
|
|
236
|
+
const handleCalendarSelect = React6.useCallback((selected) => {
|
|
401
237
|
if (selected == null) {
|
|
402
238
|
handleChange(null);
|
|
403
239
|
setInputValue("");
|
|
404
240
|
return;
|
|
405
241
|
}
|
|
406
242
|
const date = new Date(selected.getTime());
|
|
407
|
-
if (showTime && value != null) {
|
|
408
|
-
date.setHours(value.getHours(), value.getMinutes());
|
|
409
|
-
}
|
|
410
243
|
handleChange(date);
|
|
411
244
|
setDateValue(date);
|
|
412
245
|
setVisibleCalendarMonth(date);
|
|
413
246
|
if (shouldCloseOnSelection) {
|
|
414
247
|
closePopover();
|
|
415
248
|
}
|
|
416
|
-
}, [handleChange,
|
|
417
|
-
const handleTimeChange =
|
|
249
|
+
}, [handleChange, shouldCloseOnSelection, setDateValue, setInputValue, closePopover]);
|
|
250
|
+
const handleTimeChange = React6.useCallback((time) => {
|
|
418
251
|
handleChange(time);
|
|
419
252
|
setDateValue(time);
|
|
420
253
|
}, [handleChange, setDateValue]);
|
|
421
|
-
const handleCalendarClear =
|
|
254
|
+
const handleCalendarClear = React6.useCallback(() => {
|
|
422
255
|
handleChange(null);
|
|
423
256
|
setDateValue(null);
|
|
424
257
|
}, [handleChange, setDateValue]);
|
|
425
|
-
const handleStartFocusBoundary =
|
|
258
|
+
const handleStartFocusBoundary = React6.useCallback(() => {
|
|
426
259
|
inputRef.current?.focus();
|
|
427
260
|
}, []);
|
|
428
|
-
const handleEndFocusBoundary =
|
|
261
|
+
const handleEndFocusBoundary = React6.useCallback((e) => {
|
|
429
262
|
const relatedTarget = e.relatedTarget ?? document.activeElement;
|
|
430
263
|
if (popoverRef.current?.contains(relatedTarget)) {
|
|
431
264
|
skipReopenRef.current = true;
|
|
@@ -438,26 +271,19 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
438
271
|
lastButton?.focus();
|
|
439
272
|
}
|
|
440
273
|
}, [stopEditing]);
|
|
441
|
-
const activeDateValue = isEditing && inputError == null ? dateValue : value ?? void 0;
|
|
442
|
-
const timeFooter = showTime ? /* @__PURE__ */ React7__default.default.createElement("div", {
|
|
443
|
-
className: DatePicker_default.osdkDatetimeTimeFooter
|
|
444
|
-
}, /* @__PURE__ */ React7__default.default.createElement(TimePicker, {
|
|
445
|
-
value: activeDateValue ?? null,
|
|
446
|
-
onChange: handleTimeChange
|
|
447
|
-
})) : void 0;
|
|
448
274
|
const wrapperClassName = classnames3__default.default(DatePickerCommon_default.osdkDatePickerInputWrapper, DatePicker_default.osdkDatetimeInputWrapper, inputError != null && DatePickerCommon_default.osdkDatePickerInputWrapperError);
|
|
449
275
|
const isPopoverOpen = !disabled && isOpen;
|
|
450
|
-
return /* @__PURE__ */
|
|
276
|
+
return /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Root, {
|
|
451
277
|
open: isPopoverOpen,
|
|
452
278
|
onOpenChange: handleOpenChange,
|
|
453
279
|
modal
|
|
454
|
-
}, /* @__PURE__ */
|
|
280
|
+
}, /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
455
281
|
ref: wrapperRef,
|
|
456
282
|
className: wrapperClassName,
|
|
457
283
|
"data-disabled": disabled || void 0
|
|
458
|
-
}, /* @__PURE__ */
|
|
284
|
+
}, /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Trigger, {
|
|
459
285
|
nativeButton: false,
|
|
460
|
-
render: /* @__PURE__ */
|
|
286
|
+
render: /* @__PURE__ */ React6__default.default.createElement(input.Input, {
|
|
461
287
|
ref: inputRef,
|
|
462
288
|
id,
|
|
463
289
|
className: DatePickerCommon_default.osdkDatePickerInput,
|
|
@@ -468,7 +294,7 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
468
294
|
onFocus: handleFocus,
|
|
469
295
|
onPointerDown: handlePointerDown,
|
|
470
296
|
onBlur: handleBlur,
|
|
471
|
-
onClick:
|
|
297
|
+
onClick: chunkNE7GRF7G_cjs.stopPropagation,
|
|
472
298
|
onKeyDown: handleKeyDown,
|
|
473
299
|
placeholder,
|
|
474
300
|
autoComplete: "off",
|
|
@@ -478,40 +304,40 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
478
304
|
"aria-haspopup": "dialog",
|
|
479
305
|
"aria-label": ariaLabel
|
|
480
306
|
})
|
|
481
|
-
})), /* @__PURE__ */
|
|
307
|
+
})), /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Portal, {
|
|
482
308
|
ref: portalRef,
|
|
483
309
|
container: portalContainer
|
|
484
|
-
}, isModal && /* @__PURE__ */
|
|
310
|
+
}, isModal && /* @__PURE__ */ React6__default.default.createElement(PortalDismissLayer, {
|
|
485
311
|
className: DatePickerCommon_default.osdkDatePickerDismissLayer,
|
|
486
312
|
onDismiss: closePopover
|
|
487
|
-
}), /* @__PURE__ */
|
|
313
|
+
}), /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Positioner, {
|
|
488
314
|
anchor: wrapperRef,
|
|
489
315
|
className: DatePickerCommon_default.osdkDatePickerPositioner,
|
|
490
316
|
sideOffset: 4,
|
|
491
317
|
side: "bottom",
|
|
492
318
|
align: "start"
|
|
493
|
-
}, /* @__PURE__ */
|
|
319
|
+
}, /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Popup, {
|
|
494
320
|
ref: popoverRef,
|
|
495
321
|
className: DatePickerCommon_default.osdkDatePickerPopover,
|
|
496
322
|
id: popoverId,
|
|
497
323
|
role: "dialog",
|
|
498
324
|
"aria-label": "Date picker",
|
|
499
325
|
finalFocus: false
|
|
500
|
-
}, isModal && /* @__PURE__ */
|
|
326
|
+
}, isModal && /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
501
327
|
onFocus: handleStartFocusBoundary,
|
|
502
328
|
tabIndex: 0,
|
|
503
329
|
"aria-label": "Start of date picker dialog",
|
|
504
330
|
className: DatePickerCommon_default.osdkDatePickerFocusBoundary
|
|
505
|
-
}), /* @__PURE__ */
|
|
331
|
+
}), /* @__PURE__ */ React6__default.default.createElement(LazyDateCalendar, {
|
|
506
332
|
dateSelected: activeDateValue,
|
|
507
333
|
onSelect: handleCalendarSelect,
|
|
334
|
+
onTimeChange: showTime ? handleTimeChange : void 0,
|
|
508
335
|
onClear: handleCalendarClear,
|
|
509
336
|
month: visibleCalendarMonth,
|
|
510
337
|
onMonthChange: setVisibleCalendarMonth,
|
|
511
338
|
min,
|
|
512
|
-
max
|
|
513
|
-
|
|
514
|
-
}), isModal && /* @__PURE__ */ React7__default.default.createElement("div", {
|
|
339
|
+
max
|
|
340
|
+
}), isModal && /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
515
341
|
onFocus: handleEndFocusBoundary,
|
|
516
342
|
tabIndex: 0,
|
|
517
343
|
"aria-label": "End of date picker dialog",
|
|
@@ -521,13 +347,13 @@ var DatePicker = /* @__PURE__ */ React7__default.default.memo(function DatePicke
|
|
|
521
347
|
|
|
522
348
|
// src/shared/calendar/DateRangePicker.module.css
|
|
523
349
|
var DateRangePicker_default = {};
|
|
524
|
-
var DateRangeCalendarLazy = /* @__PURE__ */
|
|
350
|
+
var DateRangeCalendarLazy = /* @__PURE__ */ React6__default.default.lazy(() => import('./DateRangeCalendar-2MBQAU3Z.cjs'));
|
|
525
351
|
function LazyDateRangeCalendar(props) {
|
|
526
|
-
return /* @__PURE__ */
|
|
527
|
-
fallback: /* @__PURE__ */
|
|
352
|
+
return /* @__PURE__ */ React6__default.default.createElement(React6.Suspense, {
|
|
353
|
+
fallback: /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
528
354
|
className: DatePickerCommon_default.osdkDatePickerFallback
|
|
529
355
|
})
|
|
530
|
-
}, /* @__PURE__ */
|
|
356
|
+
}, /* @__PURE__ */ React6__default.default.createElement(DateRangeCalendarLazy, props));
|
|
531
357
|
}
|
|
532
358
|
|
|
533
359
|
// src/shared/calendar/DateRangePicker.tsx
|
|
@@ -544,12 +370,12 @@ var EMPTY_RANGE = [null, null];
|
|
|
544
370
|
var SHARED_INPUT_PROPS = {
|
|
545
371
|
className: DatePickerCommon_default.osdkDatePickerInput,
|
|
546
372
|
type: "text",
|
|
547
|
-
onClick:
|
|
373
|
+
onClick: chunkNE7GRF7G_cjs.stopPropagation,
|
|
548
374
|
autoComplete: "off",
|
|
549
375
|
role: "combobox",
|
|
550
376
|
"aria-haspopup": "dialog"
|
|
551
377
|
};
|
|
552
|
-
var DateRangePicker = /* @__PURE__ */
|
|
378
|
+
var DateRangePicker = /* @__PURE__ */ React6__default.default.memo(function DateRangePicker2({
|
|
553
379
|
id,
|
|
554
380
|
value,
|
|
555
381
|
onChange,
|
|
@@ -566,25 +392,25 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
566
392
|
disabled = false
|
|
567
393
|
}) {
|
|
568
394
|
const shouldCloseOnSelection = !showTime;
|
|
569
|
-
const popoverId =
|
|
570
|
-
const triggerRef =
|
|
571
|
-
const startInputRef =
|
|
572
|
-
const endInputRef =
|
|
573
|
-
const popoverRef =
|
|
574
|
-
const [isOpen, setIsOpen] =
|
|
575
|
-
const skipReopenRef =
|
|
576
|
-
const [activeBoundary, setActiveBoundary] =
|
|
395
|
+
const popoverId = React6.useId();
|
|
396
|
+
const triggerRef = React6.useRef(null);
|
|
397
|
+
const startInputRef = React6.useRef(null);
|
|
398
|
+
const endInputRef = React6.useRef(null);
|
|
399
|
+
const popoverRef = React6.useRef(null);
|
|
400
|
+
const [isOpen, setIsOpen] = React6.useState(false);
|
|
401
|
+
const skipReopenRef = React6.useRef(false);
|
|
402
|
+
const [activeBoundary, setActiveBoundary] = React6.useState("start");
|
|
577
403
|
const [startDate, endDate] = value ?? EMPTY_RANGE;
|
|
578
|
-
const editFormatFn = showTime ?
|
|
579
|
-
const displayFormatFn = formatDate ?? (showTime ?
|
|
580
|
-
const parseFn = parseDate ?? (showTime ?
|
|
581
|
-
const startOnChange =
|
|
404
|
+
const editFormatFn = showTime ? chunkNE7GRF7G_cjs.formatDatetimeForInput : chunkNE7GRF7G_cjs.formatDateForInput;
|
|
405
|
+
const displayFormatFn = formatDate ?? (showTime ? chunkNE7GRF7G_cjs.formatDatetimeForInput : chunkNE7GRF7G_cjs.formatDateForInput);
|
|
406
|
+
const parseFn = parseDate ?? (showTime ? chunkNE7GRF7G_cjs.parseDatetimeFromInput : chunkNE7GRF7G_cjs.parseDateFromInput);
|
|
407
|
+
const startOnChange = React6.useCallback((date) => {
|
|
582
408
|
if (date != null && isOverlapping(date, endDate, allowSingleDayRange)) {
|
|
583
409
|
return;
|
|
584
410
|
}
|
|
585
411
|
onChange?.([date, endDate ?? null]);
|
|
586
412
|
}, [endDate, onChange, allowSingleDayRange]);
|
|
587
|
-
const endOnChange =
|
|
413
|
+
const endOnChange = React6.useCallback((date) => {
|
|
588
414
|
if (date != null && isOverlapping(startDate, date, allowSingleDayRange)) {
|
|
589
415
|
return;
|
|
590
416
|
}
|
|
@@ -636,8 +462,10 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
636
462
|
})();
|
|
637
463
|
const startInvalid = startInputError != null || hasOverlapError;
|
|
638
464
|
const endInvalid = endInputError != null || hasOverlapError;
|
|
639
|
-
const
|
|
640
|
-
const
|
|
465
|
+
const activeStartDateValue = startInputError == null && startParsedValue != null ? startParsedValue : startDate ?? void 0;
|
|
466
|
+
const activeEndDateValue = endInputError == null && endParsedValue != null ? endParsedValue : endDate ?? void 0;
|
|
467
|
+
const getActiveInputRef = React6.useCallback(() => activeBoundary === "start" ? startInputRef : endInputRef, [activeBoundary]);
|
|
468
|
+
const beginEditing = React6.useCallback((boundary) => {
|
|
641
469
|
if (boundary === "start") {
|
|
642
470
|
beginStartEditing();
|
|
643
471
|
} else {
|
|
@@ -645,7 +473,7 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
645
473
|
}
|
|
646
474
|
setActiveBoundary(boundary);
|
|
647
475
|
}, [beginStartEditing, beginEndEditing]);
|
|
648
|
-
const handleInputFocus =
|
|
476
|
+
const handleInputFocus = React6.useCallback((boundary) => {
|
|
649
477
|
beginEditing(boundary);
|
|
650
478
|
if (skipReopenRef.current) {
|
|
651
479
|
skipReopenRef.current = false;
|
|
@@ -653,28 +481,28 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
653
481
|
}
|
|
654
482
|
setIsOpen(true);
|
|
655
483
|
}, [beginEditing]);
|
|
656
|
-
const handleStartFocus =
|
|
484
|
+
const handleStartFocus = React6.useCallback(() => {
|
|
657
485
|
handleInputFocus("start");
|
|
658
486
|
}, [handleInputFocus]);
|
|
659
|
-
const handleEndFocus =
|
|
487
|
+
const handleEndFocus = React6.useCallback(() => {
|
|
660
488
|
handleInputFocus("end");
|
|
661
489
|
}, [handleInputFocus]);
|
|
662
|
-
const closePopoverForBoundaryExit =
|
|
490
|
+
const closePopoverForBoundaryExit = React6.useCallback(() => {
|
|
663
491
|
skipReopenRef.current = true;
|
|
664
492
|
setIsOpen(false);
|
|
665
493
|
stopStartEditing();
|
|
666
494
|
stopEndEditing();
|
|
667
495
|
getActiveInputRef().current?.focus();
|
|
668
496
|
}, [getActiveInputRef, stopStartEditing, stopEndEditing]);
|
|
669
|
-
const handleStartPointerDown =
|
|
497
|
+
const handleStartPointerDown = React6.useCallback(() => {
|
|
670
498
|
startInputRef.current?.focus();
|
|
671
499
|
handleStartFocus();
|
|
672
500
|
}, [handleStartFocus]);
|
|
673
|
-
const handleEndPointerDown =
|
|
501
|
+
const handleEndPointerDown = React6.useCallback(() => {
|
|
674
502
|
endInputRef.current?.focus();
|
|
675
503
|
handleEndFocus();
|
|
676
504
|
}, [handleEndFocus]);
|
|
677
|
-
const handleStartBlur =
|
|
505
|
+
const handleStartBlur = React6.useCallback((e) => {
|
|
678
506
|
const related = e.relatedTarget ?? document.activeElement;
|
|
679
507
|
if (popoverRef.current?.contains(related)) {
|
|
680
508
|
e.stopPropagation();
|
|
@@ -685,7 +513,7 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
685
513
|
}
|
|
686
514
|
commitStartAndStopEditing();
|
|
687
515
|
}, [commitStartAndStopEditing]);
|
|
688
|
-
const handleEndBlur =
|
|
516
|
+
const handleEndBlur = React6.useCallback((e) => {
|
|
689
517
|
const related = e.relatedTarget ?? document.activeElement;
|
|
690
518
|
if (popoverRef.current?.contains(related)) {
|
|
691
519
|
e.stopPropagation();
|
|
@@ -696,14 +524,14 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
696
524
|
}
|
|
697
525
|
commitEndAndStopEditing();
|
|
698
526
|
}, [commitEndAndStopEditing]);
|
|
699
|
-
const closePopover =
|
|
527
|
+
const closePopover = React6.useCallback(() => {
|
|
700
528
|
setIsOpen(false);
|
|
701
529
|
stopStartEditing();
|
|
702
530
|
stopEndEditing();
|
|
703
531
|
startInputRef.current?.blur();
|
|
704
532
|
endInputRef.current?.blur();
|
|
705
533
|
}, [stopStartEditing, stopEndEditing]);
|
|
706
|
-
const handleStartKeyDown =
|
|
534
|
+
const handleStartKeyDown = React6.useCallback((e) => {
|
|
707
535
|
if (e.key === "Enter") {
|
|
708
536
|
e.preventDefault();
|
|
709
537
|
commitStartAndStopEditing();
|
|
@@ -715,7 +543,7 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
715
543
|
setIsOpen(false);
|
|
716
544
|
}
|
|
717
545
|
}, [commitStartAndStopEditing, closePopover]);
|
|
718
|
-
const handleEndKeyDown =
|
|
546
|
+
const handleEndKeyDown = React6.useCallback((e) => {
|
|
719
547
|
if (e.key === "Enter") {
|
|
720
548
|
e.preventDefault();
|
|
721
549
|
commitEndAndStopEditing();
|
|
@@ -731,14 +559,14 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
731
559
|
}
|
|
732
560
|
}
|
|
733
561
|
}, [commitEndAndStopEditing, closePopover, isOpen]);
|
|
734
|
-
const handleOpenChange =
|
|
562
|
+
const handleOpenChange = React6.useCallback((nextOpen) => {
|
|
735
563
|
if (nextOpen) {
|
|
736
564
|
setIsOpen(true);
|
|
737
565
|
} else {
|
|
738
566
|
closePopover();
|
|
739
567
|
}
|
|
740
568
|
}, [closePopover]);
|
|
741
|
-
const handleRangeSelect =
|
|
569
|
+
const handleRangeSelect = React6.useCallback((range) => {
|
|
742
570
|
const newStart = range?.from ?? null;
|
|
743
571
|
const newEnd = range?.to ?? null;
|
|
744
572
|
onChange?.([newStart, newEnd]);
|
|
@@ -753,18 +581,18 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
753
581
|
setEndDateValue(newEnd);
|
|
754
582
|
}
|
|
755
583
|
}, [onChange, shouldCloseOnSelection, closePopover, stopStartEditing, setStartDateValue, setEndDateValue]);
|
|
756
|
-
const handleStartTimeChange =
|
|
584
|
+
const handleStartTimeChange = React6.useCallback((time) => {
|
|
757
585
|
onChange?.([time, endDate ?? null]);
|
|
758
586
|
setStartDateValue(time);
|
|
759
587
|
}, [endDate, onChange, setStartDateValue]);
|
|
760
|
-
const handleEndTimeChange =
|
|
588
|
+
const handleEndTimeChange = React6.useCallback((time) => {
|
|
761
589
|
onChange?.([startDate ?? null, time]);
|
|
762
590
|
setEndDateValue(time);
|
|
763
591
|
}, [startDate, onChange, setEndDateValue]);
|
|
764
|
-
const handleStartFocusBoundary =
|
|
592
|
+
const handleStartFocusBoundary = React6.useCallback(() => {
|
|
765
593
|
getActiveInputRef().current?.focus();
|
|
766
594
|
}, [getActiveInputRef]);
|
|
767
|
-
const handleEndFocusBoundary =
|
|
595
|
+
const handleEndFocusBoundary = React6.useCallback((e) => {
|
|
768
596
|
const related = e.relatedTarget ?? document.activeElement;
|
|
769
597
|
if (popoverRef.current?.contains(related)) {
|
|
770
598
|
closePopoverForBoundaryExit();
|
|
@@ -778,12 +606,12 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
778
606
|
from: startDate ?? void 0,
|
|
779
607
|
to: endDate ?? void 0
|
|
780
608
|
} : void 0;
|
|
781
|
-
const timeFooter = showTime ? /* @__PURE__ */
|
|
782
|
-
value:
|
|
609
|
+
const timeFooter = showTime ? /* @__PURE__ */ React6__default.default.createElement(React6__default.default.Fragment, null, /* @__PURE__ */ React6__default.default.createElement(chunkNE7GRF7G_cjs.TimePicker, {
|
|
610
|
+
value: activeStartDateValue ?? null,
|
|
783
611
|
onChange: handleStartTimeChange,
|
|
784
612
|
label: "Start time"
|
|
785
|
-
}), /* @__PURE__ */
|
|
786
|
-
value:
|
|
613
|
+
}), /* @__PURE__ */ React6__default.default.createElement(chunkNE7GRF7G_cjs.TimePicker, {
|
|
614
|
+
value: activeEndDateValue ?? null,
|
|
787
615
|
onChange: handleEndTimeChange,
|
|
788
616
|
label: "End time"
|
|
789
617
|
})) : void 0;
|
|
@@ -792,20 +620,20 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
792
620
|
"aria-controls": popoverId
|
|
793
621
|
};
|
|
794
622
|
const isPopoverOpen = !disabled && isOpen;
|
|
795
|
-
return /* @__PURE__ */
|
|
623
|
+
return /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Root, {
|
|
796
624
|
open: isPopoverOpen,
|
|
797
625
|
onOpenChange: handleOpenChange,
|
|
798
626
|
modal
|
|
799
|
-
}, /* @__PURE__ */
|
|
627
|
+
}, /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
800
628
|
ref: triggerRef,
|
|
801
629
|
className: DateRangePicker_default.osdkDateRangeContainer,
|
|
802
630
|
"data-disabled": disabled || void 0
|
|
803
|
-
}, /* @__PURE__ */
|
|
631
|
+
}, /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
804
632
|
className: classnames3__default.default(DatePickerCommon_default.osdkDatePickerInputWrapper, DateRangePicker_default.osdkDateRangeInputWrapper, startInvalid && DatePickerCommon_default.osdkDatePickerInputWrapperError),
|
|
805
633
|
"data-disabled": disabled || void 0
|
|
806
|
-
}, /* @__PURE__ */
|
|
634
|
+
}, /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Trigger, {
|
|
807
635
|
nativeButton: false,
|
|
808
|
-
render: /* @__PURE__ */
|
|
636
|
+
render: /* @__PURE__ */ React6__default.default.createElement(input.Input, _extends({
|
|
809
637
|
ref: startInputRef,
|
|
810
638
|
id: id != null ? `${id}-start` : void 0,
|
|
811
639
|
value: displayedStart,
|
|
@@ -820,12 +648,12 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
820
648
|
"aria-label": "Start date",
|
|
821
649
|
"aria-invalid": startInvalid || void 0
|
|
822
650
|
}, sharedInputProps))
|
|
823
|
-
})), /* @__PURE__ */
|
|
651
|
+
})), /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
824
652
|
className: classnames3__default.default(DatePickerCommon_default.osdkDatePickerInputWrapper, DateRangePicker_default.osdkDateRangeInputWrapper, endInvalid && DatePickerCommon_default.osdkDatePickerInputWrapperError),
|
|
825
653
|
"data-disabled": disabled || void 0
|
|
826
|
-
}, /* @__PURE__ */
|
|
654
|
+
}, /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Trigger, {
|
|
827
655
|
nativeButton: false,
|
|
828
|
-
render: /* @__PURE__ */
|
|
656
|
+
render: /* @__PURE__ */ React6__default.default.createElement(input.Input, _extends({
|
|
829
657
|
ref: endInputRef,
|
|
830
658
|
id: id != null ? `${id}-end` : void 0,
|
|
831
659
|
value: displayedEnd,
|
|
@@ -840,36 +668,36 @@ var DateRangePicker = /* @__PURE__ */ React7__default.default.memo(function Date
|
|
|
840
668
|
"aria-label": "End date",
|
|
841
669
|
"aria-invalid": endInvalid || void 0
|
|
842
670
|
}, sharedInputProps))
|
|
843
|
-
}))), /* @__PURE__ */
|
|
671
|
+
}))), /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Portal, {
|
|
844
672
|
container: portalContainer
|
|
845
|
-
}, /* @__PURE__ */
|
|
673
|
+
}, /* @__PURE__ */ React6__default.default.createElement(PortalDismissLayer, {
|
|
846
674
|
className: DatePickerCommon_default.osdkDatePickerDismissLayer,
|
|
847
675
|
onDismiss: closePopover
|
|
848
|
-
}), /* @__PURE__ */
|
|
676
|
+
}), /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Positioner, {
|
|
849
677
|
anchor: triggerRef,
|
|
850
678
|
className: DatePickerCommon_default.osdkDatePickerPositioner,
|
|
851
679
|
sideOffset: 4,
|
|
852
680
|
side: "bottom",
|
|
853
681
|
align: "start"
|
|
854
|
-
}, /* @__PURE__ */
|
|
682
|
+
}, /* @__PURE__ */ React6__default.default.createElement(popover.Popover.Popup, {
|
|
855
683
|
ref: popoverRef,
|
|
856
684
|
className: DatePickerCommon_default.osdkDatePickerPopover,
|
|
857
685
|
id: popoverId,
|
|
858
686
|
role: "dialog",
|
|
859
687
|
"aria-label": "date range picker",
|
|
860
688
|
finalFocus: false
|
|
861
|
-
}, /* @__PURE__ */
|
|
689
|
+
}, /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
862
690
|
onFocus: handleStartFocusBoundary,
|
|
863
691
|
tabIndex: 0,
|
|
864
692
|
"aria-label": "Start of date range picker dialog",
|
|
865
693
|
className: DatePickerCommon_default.osdkDatePickerFocusBoundary
|
|
866
|
-
}), /* @__PURE__ */
|
|
694
|
+
}), /* @__PURE__ */ React6__default.default.createElement(LazyDateRangeCalendar, {
|
|
867
695
|
selected: calendarSelected,
|
|
868
696
|
onSelect: handleRangeSelect,
|
|
869
697
|
min,
|
|
870
698
|
max,
|
|
871
699
|
footer: timeFooter
|
|
872
|
-
}), /* @__PURE__ */
|
|
700
|
+
}), /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
873
701
|
onFocus: handleEndFocusBoundary,
|
|
874
702
|
tabIndex: 0,
|
|
875
703
|
"aria-label": "End of date range picker dialog",
|
|
@@ -900,30 +728,30 @@ function ComboboxTrigger({
|
|
|
900
728
|
children,
|
|
901
729
|
...rest
|
|
902
730
|
}) {
|
|
903
|
-
return /* @__PURE__ */
|
|
731
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Trigger, _extends2({
|
|
904
732
|
className: classnames3__default.default(Combobox_default.osdkComboboxTrigger, className)
|
|
905
|
-
}, rest), children ?? /* @__PURE__ */
|
|
733
|
+
}, rest), children ?? /* @__PURE__ */ React6__default.default.createElement(React6__default.default.Fragment, null, /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
906
734
|
className: Combobox_default.osdkComboboxValueContainer
|
|
907
|
-
}, /* @__PURE__ */
|
|
735
|
+
}, /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Value, null)), /* @__PURE__ */ React6__default.default.createElement(ComboboxIcon, null)));
|
|
908
736
|
}
|
|
909
737
|
function ComboboxIcon({
|
|
910
738
|
className,
|
|
911
739
|
children,
|
|
912
740
|
...rest
|
|
913
741
|
}) {
|
|
914
|
-
return /* @__PURE__ */
|
|
742
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Icon, _extends2({
|
|
915
743
|
className: classnames3__default.default(Combobox_default.osdkComboboxIcon, className)
|
|
916
|
-
}, rest), children ?? /* @__PURE__ */
|
|
744
|
+
}, rest), children ?? /* @__PURE__ */ React6__default.default.createElement(icons.CaretDown, null));
|
|
917
745
|
}
|
|
918
746
|
function ComboboxSearchInput({
|
|
919
747
|
className,
|
|
920
748
|
...rest
|
|
921
749
|
}) {
|
|
922
|
-
return /* @__PURE__ */
|
|
750
|
+
return /* @__PURE__ */ React6__default.default.createElement("div", {
|
|
923
751
|
className: classnames3__default.default(Combobox_default.osdkComboboxInputWrapper, className)
|
|
924
|
-
}, /* @__PURE__ */
|
|
752
|
+
}, /* @__PURE__ */ React6__default.default.createElement(icons.Search, {
|
|
925
753
|
className: Combobox_default.osdkComboboxSearchIcon
|
|
926
|
-
}), /* @__PURE__ */
|
|
754
|
+
}), /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Input, _extends2({
|
|
927
755
|
className: Combobox_default.osdkComboboxInput
|
|
928
756
|
}, rest)));
|
|
929
757
|
}
|
|
@@ -931,7 +759,7 @@ function ComboboxInput({
|
|
|
931
759
|
className,
|
|
932
760
|
...rest
|
|
933
761
|
}) {
|
|
934
|
-
return /* @__PURE__ */
|
|
762
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Input, _extends2({
|
|
935
763
|
className: classnames3__default.default(Combobox_default.osdkComboboxInput, className)
|
|
936
764
|
}, rest));
|
|
937
765
|
}
|
|
@@ -940,7 +768,7 @@ function ComboboxPositioner({
|
|
|
940
768
|
children,
|
|
941
769
|
...rest
|
|
942
770
|
}) {
|
|
943
|
-
return /* @__PURE__ */
|
|
771
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Positioner, _extends2({
|
|
944
772
|
className: classnames3__default.default(Combobox_default.osdkComboboxPositioner, className),
|
|
945
773
|
sideOffset: 4
|
|
946
774
|
}, rest), children);
|
|
@@ -950,7 +778,7 @@ function ComboboxPopup({
|
|
|
950
778
|
children,
|
|
951
779
|
...rest
|
|
952
780
|
}) {
|
|
953
|
-
return /* @__PURE__ */
|
|
781
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Popup, _extends2({
|
|
954
782
|
className: classnames3__default.default(Combobox_default.osdkComboboxPopup, className)
|
|
955
783
|
}, rest), children);
|
|
956
784
|
}
|
|
@@ -959,7 +787,7 @@ function ComboboxItem({
|
|
|
959
787
|
children,
|
|
960
788
|
...rest
|
|
961
789
|
}) {
|
|
962
|
-
return /* @__PURE__ */
|
|
790
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Item, _extends2({
|
|
963
791
|
className: classnames3__default.default(Combobox_default.osdkComboboxItem, className)
|
|
964
792
|
}, rest), children);
|
|
965
793
|
}
|
|
@@ -967,8 +795,8 @@ function ComboboxChips({
|
|
|
967
795
|
children,
|
|
968
796
|
className
|
|
969
797
|
}) {
|
|
970
|
-
return /* @__PURE__ */
|
|
971
|
-
render: (props) => /* @__PURE__ */
|
|
798
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Chips, {
|
|
799
|
+
render: (props) => /* @__PURE__ */ React6__default.default.createElement("div", _extends2({}, props, {
|
|
972
800
|
className: classnames3__default.default(Combobox_default.osdkComboboxInputWrapper, className)
|
|
973
801
|
}), props.children)
|
|
974
802
|
}, children);
|
|
@@ -978,7 +806,7 @@ function ComboboxChip({
|
|
|
978
806
|
children,
|
|
979
807
|
...rest
|
|
980
808
|
}) {
|
|
981
|
-
return /* @__PURE__ */
|
|
809
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Chip, _extends2({
|
|
982
810
|
className: classnames3__default.default(Combobox_default.osdkComboboxChip, className)
|
|
983
811
|
}, rest), children);
|
|
984
812
|
}
|
|
@@ -986,25 +814,25 @@ function ComboboxChipRemove({
|
|
|
986
814
|
className,
|
|
987
815
|
...rest
|
|
988
816
|
}) {
|
|
989
|
-
return /* @__PURE__ */
|
|
817
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.ChipRemove, _extends2({
|
|
990
818
|
className: classnames3__default.default(Combobox_default.osdkComboboxChipRemove, className),
|
|
991
819
|
"aria-label": "Remove"
|
|
992
|
-
}, rest), /* @__PURE__ */
|
|
820
|
+
}, rest), /* @__PURE__ */ React6__default.default.createElement(icons.Cross, null));
|
|
993
821
|
}
|
|
994
822
|
function ComboboxClear({
|
|
995
823
|
className,
|
|
996
824
|
...rest
|
|
997
825
|
}) {
|
|
998
|
-
return /* @__PURE__ */
|
|
826
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Clear, _extends2({
|
|
999
827
|
className: classnames3__default.default(Combobox_default.osdkComboboxClear, className),
|
|
1000
828
|
"aria-label": "Clear all"
|
|
1001
|
-
}, rest), /* @__PURE__ */
|
|
829
|
+
}, rest), /* @__PURE__ */ React6__default.default.createElement(icons.Cross, null));
|
|
1002
830
|
}
|
|
1003
831
|
function ComboboxEmpty({
|
|
1004
832
|
children,
|
|
1005
833
|
className
|
|
1006
834
|
}) {
|
|
1007
|
-
return /* @__PURE__ */
|
|
835
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.Empty, {
|
|
1008
836
|
className: classnames3__default.default(Combobox_default.osdkComboboxEmpty, className)
|
|
1009
837
|
}, children);
|
|
1010
838
|
}
|
|
@@ -1013,7 +841,7 @@ function ComboboxList({
|
|
|
1013
841
|
children,
|
|
1014
842
|
...rest
|
|
1015
843
|
}) {
|
|
1016
|
-
return /* @__PURE__ */
|
|
844
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.List, _extends2({
|
|
1017
845
|
className: classnames3__default.default(Combobox_default.osdkComboboxList, className)
|
|
1018
846
|
}, rest), children);
|
|
1019
847
|
}
|
|
@@ -1022,10 +850,10 @@ function ComboboxItemIndicator({
|
|
|
1022
850
|
children,
|
|
1023
851
|
...rest
|
|
1024
852
|
}) {
|
|
1025
|
-
return /* @__PURE__ */
|
|
853
|
+
return /* @__PURE__ */ React6__default.default.createElement(combobox.Combobox.ItemIndicator, _extends2({
|
|
1026
854
|
className: classnames3__default.default(Combobox_default.osdkComboboxItemIndicator, className),
|
|
1027
855
|
keepMounted: true
|
|
1028
|
-
}, rest), children ?? /* @__PURE__ */
|
|
856
|
+
}, rest), children ?? /* @__PURE__ */ React6__default.default.createElement(icons.Tick, {
|
|
1029
857
|
size: 16
|
|
1030
858
|
}));
|
|
1031
859
|
}
|
|
@@ -1056,5 +884,5 @@ exports.DatePicker = DatePicker;
|
|
|
1056
884
|
exports.DateRangePicker = DateRangePicker;
|
|
1057
885
|
exports.EMPTY_RANGE = EMPTY_RANGE;
|
|
1058
886
|
exports.PortalDismissLayer = PortalDismissLayer;
|
|
1059
|
-
//# sourceMappingURL=chunk-
|
|
1060
|
-
//# sourceMappingURL=chunk-
|
|
887
|
+
//# sourceMappingURL=chunk-E5OKIBYJ.cjs.map
|
|
888
|
+
//# sourceMappingURL=chunk-E5OKIBYJ.cjs.map
|