@react-aria/datepicker 3.9.3 → 3.10.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.
Files changed (77) hide show
  1. package/dist/ar-AE.mjs +1 -1
  2. package/dist/bg-BG.mjs +1 -1
  3. package/dist/cs-CZ.mjs +1 -1
  4. package/dist/da-DK.mjs +1 -1
  5. package/dist/de-DE.mjs +1 -1
  6. package/dist/el-GR.mjs +1 -1
  7. package/dist/en-US.mjs +1 -1
  8. package/dist/es-ES.mjs +1 -1
  9. package/dist/et-EE.mjs +1 -1
  10. package/dist/fi-FI.mjs +1 -1
  11. package/dist/fr-FR.mjs +1 -1
  12. package/dist/he-IL.mjs +1 -1
  13. package/dist/hr-HR.mjs +1 -1
  14. package/dist/hu-HU.mjs +1 -1
  15. package/dist/import.mjs +5 -1047
  16. package/dist/intlStrings.main.js +108 -0
  17. package/dist/intlStrings.main.js.map +1 -0
  18. package/dist/intlStrings.mjs +110 -0
  19. package/dist/intlStrings.module.js +110 -0
  20. package/dist/intlStrings.module.js.map +1 -0
  21. package/dist/it-IT.mjs +1 -1
  22. package/dist/ja-JP.mjs +1 -1
  23. package/dist/ko-KR.mjs +1 -1
  24. package/dist/lt-LT.mjs +1 -1
  25. package/dist/lv-LV.mjs +1 -1
  26. package/dist/main.js +11 -1053
  27. package/dist/main.js.map +1 -1
  28. package/dist/module.js +5 -1047
  29. package/dist/module.js.map +1 -1
  30. package/dist/nb-NO.mjs +1 -1
  31. package/dist/nl-NL.mjs +1 -1
  32. package/dist/pl-PL.mjs +1 -1
  33. package/dist/pt-BR.mjs +1 -1
  34. package/dist/pt-PT.mjs +1 -1
  35. package/dist/ro-RO.mjs +1 -1
  36. package/dist/ru-RU.mjs +1 -1
  37. package/dist/sk-SK.mjs +1 -1
  38. package/dist/sl-SI.mjs +1 -1
  39. package/dist/sr-SP.mjs +1 -1
  40. package/dist/sv-SE.mjs +1 -1
  41. package/dist/tr-TR.mjs +1 -1
  42. package/dist/types.d.ts.map +1 -1
  43. package/dist/uk-UA.mjs +1 -1
  44. package/dist/useDateField.main.js +176 -0
  45. package/dist/useDateField.main.js.map +1 -0
  46. package/dist/useDateField.mjs +167 -0
  47. package/dist/useDateField.module.js +167 -0
  48. package/dist/useDateField.module.js.map +1 -0
  49. package/dist/useDatePicker.main.js +158 -0
  50. package/dist/useDatePicker.main.js.map +1 -0
  51. package/dist/useDatePicker.mjs +153 -0
  52. package/dist/useDatePicker.module.js +153 -0
  53. package/dist/useDatePicker.module.js.map +1 -0
  54. package/dist/useDatePickerGroup.main.js +91 -0
  55. package/dist/useDatePickerGroup.main.js.map +1 -0
  56. package/dist/useDatePickerGroup.mjs +86 -0
  57. package/dist/useDatePickerGroup.module.js +86 -0
  58. package/dist/useDatePickerGroup.module.js.map +1 -0
  59. package/dist/useDateRangePicker.main.js +201 -0
  60. package/dist/useDateRangePicker.main.js.map +1 -0
  61. package/dist/useDateRangePicker.mjs +196 -0
  62. package/dist/useDateRangePicker.module.js +196 -0
  63. package/dist/useDateRangePicker.module.js.map +1 -0
  64. package/dist/useDateSegment.main.js +366 -0
  65. package/dist/useDateSegment.main.js.map +1 -0
  66. package/dist/useDateSegment.mjs +357 -0
  67. package/dist/useDateSegment.module.js +357 -0
  68. package/dist/useDateSegment.module.js.map +1 -0
  69. package/dist/useDisplayNames.main.js +59 -0
  70. package/dist/useDisplayNames.main.js.map +1 -0
  71. package/dist/useDisplayNames.mjs +54 -0
  72. package/dist/useDisplayNames.module.js +54 -0
  73. package/dist/useDisplayNames.module.js.map +1 -0
  74. package/dist/zh-CN.mjs +1 -1
  75. package/dist/zh-TW.mjs +1 -1
  76. package/package.json +19 -19
  77. package/src/useDateSegment.ts +4 -0
package/dist/main.js CHANGED
@@ -1,509 +1,20 @@
1
- var $aa344be62785b256$exports = require("./ar-AE.main.js");
2
- var $615986c3475e7c8c$exports = require("./bg-BG.main.js");
3
- var $6c6207692f1ab248$exports = require("./cs-CZ.main.js");
4
- var $fb37a9d024dd70f8$exports = require("./da-DK.main.js");
5
- var $d7780bd4790f7ae9$exports = require("./de-DE.main.js");
6
- var $9cdf03311f06c4ac$exports = require("./el-GR.main.js");
7
- var $f93fc9e164ae811c$exports = require("./en-US.main.js");
8
- var $7426c3264bf5ffea$exports = require("./es-ES.main.js");
9
- var $1115cc0042de790c$exports = require("./et-EE.main.js");
10
- var $4e80389dccb9283f$exports = require("./fi-FI.main.js");
11
- var $78ad6f738c1f38d1$exports = require("./fr-FR.main.js");
12
- var $50fa4716d827cd97$exports = require("./he-IL.main.js");
13
- var $7297908fac4cf6c2$exports = require("./hr-HR.main.js");
14
- var $f95c1b06e1d5ba32$exports = require("./hu-HU.main.js");
15
- var $437a8dc519258a01$exports = require("./it-IT.main.js");
16
- var $bd0aa2b50092a836$exports = require("./ja-JP.main.js");
17
- var $bbd8176c2e044bc1$exports = require("./ko-KR.main.js");
18
- var $1af703df56ff5180$exports = require("./lt-LT.main.js");
19
- var $9705eb4511dea9f8$exports = require("./lv-LV.main.js");
20
- var $8ef984876a7160bc$exports = require("./nb-NO.main.js");
21
- var $b6e9809e1ecaa25e$exports = require("./nl-NL.main.js");
22
- var $deb2fa609661fe31$exports = require("./pl-PL.main.js");
23
- var $591c8c054c84fa56$exports = require("./pt-BR.main.js");
24
- var $f1633bd6cbc228e8$exports = require("./pt-PT.main.js");
25
- var $14e09da03f3d1c5b$exports = require("./ro-RO.main.js");
26
- var $63247a3456bc40d1$exports = require("./ru-RU.main.js");
27
- var $22150dd20c353dd4$exports = require("./sk-SK.main.js");
28
- var $701eb9a0385c55fd$exports = require("./sl-SI.main.js");
29
- var $54684a4891ca6dc5$exports = require("./sr-SP.main.js");
30
- var $545887f88a5a52db$exports = require("./sv-SE.main.js");
31
- var $492d49420dd96ff4$exports = require("./tr-TR.main.js");
32
- var $dc85765e85e8f267$exports = require("./uk-UA.main.js");
33
- var $2157d63cb80c7c63$exports = require("./zh-CN.main.js");
34
- var $0335c3ddb5f70cbe$exports = require("./zh-TW.main.js");
35
- var $IwcIq$reactariafocus = require("@react-aria/focus");
36
- var $IwcIq$reactariautils = require("@react-aria/utils");
37
- var $IwcIq$reactstatelyform = require("@react-stately/form");
38
- var $IwcIq$react = require("react");
39
- var $IwcIq$reactarialabel = require("@react-aria/label");
40
- var $IwcIq$reactariainteractions = require("@react-aria/interactions");
41
- var $IwcIq$reactariai18n = require("@react-aria/i18n");
42
- var $IwcIq$reactariaform = require("@react-aria/form");
43
- var $IwcIq$internationalizeddate = require("@internationalized/date");
44
- var $IwcIq$internationalizednumber = require("@internationalized/number");
45
- var $IwcIq$reactariaspinbutton = require("@react-aria/spinbutton");
1
+ var $e90ae7c26a69c6b1$exports = require("./useDatePicker.main.js");
2
+ var $5c015c6316d1904d$exports = require("./useDateSegment.main.js");
3
+ var $4acc2f407c169e55$exports = require("./useDateField.main.js");
4
+ var $20f695b1b69e6b9e$exports = require("./useDateRangePicker.main.js");
5
+ var $934ac650a0aceb4b$exports = require("./useDisplayNames.main.js");
46
6
 
47
7
 
48
8
  function $parcel$export(e, n, v, s) {
49
9
  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
50
10
  }
51
11
 
52
- function $parcel$interopDefault(a) {
53
- return a && a.__esModule ? a.default : a;
54
- }
55
-
56
- $parcel$export(module.exports, "useDatePicker", () => $e90ae7c26a69c6b1$export$42df105a73306d51);
57
- $parcel$export(module.exports, "useDateSegment", () => $5c015c6316d1904d$export$1315d136e6f7581);
58
- $parcel$export(module.exports, "useDateField", () => $4acc2f407c169e55$export$5591b0b878c1a989);
59
- $parcel$export(module.exports, "useTimeField", () => $4acc2f407c169e55$export$4c842f6a241dc825);
60
- $parcel$export(module.exports, "useDateRangePicker", () => $20f695b1b69e6b9e$export$12fd5f0e9f4bb192);
61
- $parcel$export(module.exports, "useDisplayNames", () => $934ac650a0aceb4b$export$d42c60378c8168f8);
62
- /*
63
- * Copyright 2020 Adobe. All rights reserved.
64
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
65
- * you may not use this file except in compliance with the License. You may obtain a copy
66
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
67
- *
68
- * Unless required by applicable law or agreed to in writing, software distributed under
69
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
70
- * OF ANY KIND, either express or implied. See the License for the specific language
71
- * governing permissions and limitations under the License.
72
- */ /*
73
- * Copyright 2020 Adobe. All rights reserved.
74
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
75
- * you may not use this file except in compliance with the License. You may obtain a copy
76
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
77
- *
78
- * Unless required by applicable law or agreed to in writing, software distributed under
79
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
80
- * OF ANY KIND, either express or implied. See the License for the specific language
81
- * governing permissions and limitations under the License.
82
- */
83
-
84
- var $c1905b78f6d2f5bf$exports = {};
85
-
86
-
87
-
88
-
89
-
90
-
91
-
92
-
93
-
94
-
95
-
96
-
97
-
98
-
99
-
100
-
101
-
102
-
103
-
104
-
105
-
106
-
107
-
108
-
109
-
110
-
111
-
112
-
113
-
114
-
115
-
116
-
117
-
118
-
119
- $c1905b78f6d2f5bf$exports = {
120
- "ar-AE": $aa344be62785b256$exports,
121
- "bg-BG": $615986c3475e7c8c$exports,
122
- "cs-CZ": $6c6207692f1ab248$exports,
123
- "da-DK": $fb37a9d024dd70f8$exports,
124
- "de-DE": $d7780bd4790f7ae9$exports,
125
- "el-GR": $9cdf03311f06c4ac$exports,
126
- "en-US": $f93fc9e164ae811c$exports,
127
- "es-ES": $7426c3264bf5ffea$exports,
128
- "et-EE": $1115cc0042de790c$exports,
129
- "fi-FI": $4e80389dccb9283f$exports,
130
- "fr-FR": $78ad6f738c1f38d1$exports,
131
- "he-IL": $50fa4716d827cd97$exports,
132
- "hr-HR": $7297908fac4cf6c2$exports,
133
- "hu-HU": $f95c1b06e1d5ba32$exports,
134
- "it-IT": $437a8dc519258a01$exports,
135
- "ja-JP": $bd0aa2b50092a836$exports,
136
- "ko-KR": $bbd8176c2e044bc1$exports,
137
- "lt-LT": $1af703df56ff5180$exports,
138
- "lv-LV": $9705eb4511dea9f8$exports,
139
- "nb-NO": $8ef984876a7160bc$exports,
140
- "nl-NL": $b6e9809e1ecaa25e$exports,
141
- "pl-PL": $deb2fa609661fe31$exports,
142
- "pt-BR": $591c8c054c84fa56$exports,
143
- "pt-PT": $f1633bd6cbc228e8$exports,
144
- "ro-RO": $14e09da03f3d1c5b$exports,
145
- "ru-RU": $63247a3456bc40d1$exports,
146
- "sk-SK": $22150dd20c353dd4$exports,
147
- "sl-SI": $701eb9a0385c55fd$exports,
148
- "sr-SP": $54684a4891ca6dc5$exports,
149
- "sv-SE": $545887f88a5a52db$exports,
150
- "tr-TR": $492d49420dd96ff4$exports,
151
- "uk-UA": $dc85765e85e8f267$exports,
152
- "zh-CN": $2157d63cb80c7c63$exports,
153
- "zh-TW": $0335c3ddb5f70cbe$exports
154
- };
155
-
156
-
157
-
158
-
159
- /*
160
- * Copyright 2020 Adobe. All rights reserved.
161
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
162
- * you may not use this file except in compliance with the License. You may obtain a copy
163
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
164
- *
165
- * Unless required by applicable law or agreed to in writing, software distributed under
166
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
167
- * OF ANY KIND, either express or implied. See the License for the specific language
168
- * governing permissions and limitations under the License.
169
- */
170
-
171
-
172
-
173
-
174
-
175
-
176
-
177
-
178
- function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavigation) {
179
- let { direction: direction } = (0, $IwcIq$reactariai18n.useLocale)();
180
- let focusManager = (0, $IwcIq$react.useMemo)(()=>(0, $IwcIq$reactariafocus.createFocusManager)(ref), [
181
- ref
182
- ]);
183
- // Open the popover on alt + arrow down
184
- let onKeyDown = (e)=>{
185
- if (!e.currentTarget.contains(e.target)) return;
186
- if (e.altKey && (e.key === "ArrowDown" || e.key === "ArrowUp") && "setOpen" in state) {
187
- e.preventDefault();
188
- e.stopPropagation();
189
- state.setOpen(true);
190
- }
191
- if (disableArrowNavigation) return;
192
- switch(e.key){
193
- case "ArrowLeft":
194
- e.preventDefault();
195
- e.stopPropagation();
196
- if (direction === "rtl") focusManager.focusNext();
197
- else focusManager.focusPrevious();
198
- break;
199
- case "ArrowRight":
200
- e.preventDefault();
201
- e.stopPropagation();
202
- if (direction === "rtl") focusManager.focusPrevious();
203
- else focusManager.focusNext();
204
- break;
205
- }
206
- };
207
- // Focus the first placeholder segment from the end on mouse down/touch up in the field.
208
- let focusLast = ()=>{
209
- var _window_event;
210
- // Try to find the segment prior to the element that was clicked on.
211
- let target = (_window_event = window.event) === null || _window_event === void 0 ? void 0 : _window_event.target;
212
- let walker = (0, $IwcIq$reactariafocus.getFocusableTreeWalker)(ref.current, {
213
- tabbable: true
214
- });
215
- if (target) {
216
- walker.currentNode = target;
217
- target = walker.previousNode();
218
- }
219
- // If no target found, find the last element from the end.
220
- if (!target) {
221
- let last;
222
- do {
223
- last = walker.lastChild();
224
- if (last) target = last;
225
- }while (last);
226
- }
227
- // Now go backwards until we find an element that is not a placeholder.
228
- while(target === null || target === void 0 ? void 0 : target.hasAttribute("data-placeholder")){
229
- let prev = walker.previousNode();
230
- if (prev && prev.hasAttribute("data-placeholder")) target = prev;
231
- else break;
232
- }
233
- if (target) target.focus();
234
- };
235
- let { pressProps: pressProps } = (0, $IwcIq$reactariainteractions.usePress)({
236
- preventFocusOnPress: true,
237
- allowTextSelectionOnPress: true,
238
- onPressStart (e) {
239
- if (e.pointerType === "mouse") focusLast();
240
- },
241
- onPress (e) {
242
- if (e.pointerType !== "mouse") focusLast();
243
- }
244
- });
245
- return (0, $IwcIq$reactariautils.mergeProps)(pressProps, {
246
- onKeyDown: onKeyDown
247
- });
248
- }
249
-
250
-
251
-
252
-
253
-
254
-
255
- const $4acc2f407c169e55$export$653eddfc964b0f8a = new WeakMap();
256
- const $4acc2f407c169e55$export$300019f83c56d282 = "__role_" + Date.now();
257
- const $4acc2f407c169e55$export$7b3062cd49e80452 = "__focusManager_" + Date.now();
258
- function $4acc2f407c169e55$export$5591b0b878c1a989(props, state, ref) {
259
- var _state_value;
260
- let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
261
- let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $IwcIq$reactarialabel.useField)({
262
- ...props,
263
- labelElementType: "span",
264
- isInvalid: isInvalid,
265
- errorMessage: props.errorMessage || validationErrors
266
- });
267
- let valueOnFocus = (0, $IwcIq$react.useRef)(null);
268
- let { focusWithinProps: focusWithinProps } = (0, $IwcIq$reactariainteractions.useFocusWithin)({
269
- ...props,
270
- onFocusWithin (e) {
271
- var _props_onFocus;
272
- valueOnFocus.current = state.value;
273
- (_props_onFocus = props.onFocus) === null || _props_onFocus === void 0 ? void 0 : _props_onFocus.call(props, e);
274
- },
275
- onBlurWithin: (e)=>{
276
- var _props_onBlur;
277
- state.confirmPlaceholder();
278
- if (state.value !== valueOnFocus.current) state.commitValidation();
279
- (_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
280
- },
281
- onFocusWithinChange: props.onFocusChange
282
- });
283
- let stringFormatter = (0, $IwcIq$reactariai18n.useLocalizedStringFormatter)((0, (/*@__PURE__*/$parcel$interopDefault($c1905b78f6d2f5bf$exports))), "@react-aria/datepicker");
284
- let message = state.maxGranularity === "hour" ? "selectedTimeDescription" : "selectedDateDescription";
285
- let field = state.maxGranularity === "hour" ? "time" : "date";
286
- let description = state.value ? stringFormatter.format(message, {
287
- [field]: state.formatValue({
288
- month: "long"
289
- })
290
- }) : "";
291
- let descProps = (0, $IwcIq$reactariautils.useDescription)(description);
292
- // If within a date picker or date range picker, the date field will have role="presentation" and an aria-describedby
293
- // will be passed in that references the value (e.g. entire range). Otherwise, add the field's value description.
294
- let describedBy = props[$4acc2f407c169e55$export$300019f83c56d282] === "presentation" ? fieldProps["aria-describedby"] : [
295
- descProps["aria-describedby"],
296
- fieldProps["aria-describedby"]
297
- ].filter(Boolean).join(" ") || undefined;
298
- let propsFocusManager = props[$4acc2f407c169e55$export$7b3062cd49e80452];
299
- let focusManager = (0, $IwcIq$react.useMemo)(()=>propsFocusManager || (0, $IwcIq$reactariafocus.createFocusManager)(ref), [
300
- propsFocusManager,
301
- ref
302
- ]);
303
- let groupProps = (0, $715562ad3b4cced4$export$4a931266a3838b86)(state, ref, props[$4acc2f407c169e55$export$300019f83c56d282] === "presentation");
304
- // Pass labels and other information to segments.
305
- $4acc2f407c169e55$export$653eddfc964b0f8a.set(state, {
306
- ariaLabel: props["aria-label"],
307
- ariaLabelledBy: [
308
- labelProps.id,
309
- props["aria-labelledby"]
310
- ].filter(Boolean).join(" ") || undefined,
311
- ariaDescribedBy: describedBy,
312
- focusManager: focusManager
313
- });
314
- let autoFocusRef = (0, $IwcIq$react.useRef)(props.autoFocus);
315
- // When used within a date picker or date range picker, the field gets role="presentation"
316
- // rather than role="group". Since the date picker/date range picker already has a role="group"
317
- // with a label and description, and the segments are already labeled by this as well, this
318
- // avoids very verbose duplicate announcements.
319
- let fieldDOMProps;
320
- if (props[$4acc2f407c169e55$export$300019f83c56d282] === "presentation") fieldDOMProps = {
321
- role: "presentation"
322
- };
323
- else fieldDOMProps = (0, $IwcIq$reactariautils.mergeProps)(fieldProps, {
324
- role: "group",
325
- "aria-disabled": props.isDisabled || undefined,
326
- "aria-describedby": describedBy
327
- });
328
- (0, $IwcIq$react.useEffect)(()=>{
329
- if (autoFocusRef.current) focusManager.focusFirst();
330
- autoFocusRef.current = false;
331
- }, [
332
- focusManager
333
- ]);
334
- (0, $IwcIq$reactariautils.useFormReset)(props.inputRef, state.value, state.setValue);
335
- (0, $IwcIq$reactariaform.useFormValidation)({
336
- ...props,
337
- focus () {
338
- focusManager.focusFirst();
339
- }
340
- }, state, props.inputRef);
341
- let inputProps = {
342
- type: "hidden",
343
- name: props.name,
344
- value: ((_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.toString()) || ""
345
- };
346
- if (props.validationBehavior === "native") {
347
- // Use a hidden <input type="text"> rather than <input type="hidden">
348
- // so that an empty value blocks HTML form submission when the field is required.
349
- inputProps.type = "text";
350
- inputProps.hidden = true;
351
- inputProps.required = props.isRequired;
352
- // Ignore react warning.
353
- inputProps.onChange = ()=>{};
354
- }
355
- let domProps = (0, $IwcIq$reactariautils.filterDOMProps)(props);
356
- return {
357
- labelProps: {
358
- ...labelProps,
359
- onClick: ()=>{
360
- focusManager.focusFirst();
361
- }
362
- },
363
- fieldProps: (0, $IwcIq$reactariautils.mergeProps)(domProps, fieldDOMProps, groupProps, focusWithinProps, {
364
- onKeyDown (e) {
365
- if (props.onKeyDown) props.onKeyDown(e);
366
- },
367
- onKeyUp (e) {
368
- if (props.onKeyUp) props.onKeyUp(e);
369
- }
370
- }),
371
- inputProps: inputProps,
372
- descriptionProps: descriptionProps,
373
- errorMessageProps: errorMessageProps,
374
- isInvalid: isInvalid,
375
- validationErrors: validationErrors,
376
- validationDetails: validationDetails
377
- };
378
- }
379
- function $4acc2f407c169e55$export$4c842f6a241dc825(props, state, ref) {
380
- var _state_timeValue;
381
- let res = $4acc2f407c169e55$export$5591b0b878c1a989(props, state, ref);
382
- res.inputProps.value = ((_state_timeValue = state.timeValue) === null || _state_timeValue === void 0 ? void 0 : _state_timeValue.toString()) || "";
383
- return res;
384
- }
385
-
386
-
387
-
388
-
389
-
390
-
391
- function $e90ae7c26a69c6b1$export$42df105a73306d51(props, state, ref) {
392
- let buttonId = (0, $IwcIq$reactariautils.useId)();
393
- let dialogId = (0, $IwcIq$reactariautils.useId)();
394
- let fieldId = (0, $IwcIq$reactariautils.useId)();
395
- let stringFormatter = (0, $IwcIq$reactariai18n.useLocalizedStringFormatter)((0, (/*@__PURE__*/$parcel$interopDefault($c1905b78f6d2f5bf$exports))), "@react-aria/datepicker");
396
- let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
397
- let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $IwcIq$reactarialabel.useField)({
398
- ...props,
399
- labelElementType: "span",
400
- isInvalid: isInvalid,
401
- errorMessage: props.errorMessage || validationErrors
402
- });
403
- let groupProps = (0, $715562ad3b4cced4$export$4a931266a3838b86)(state, ref);
404
- let labelledBy = fieldProps["aria-labelledby"] || fieldProps.id;
405
- let { locale: locale } = (0, $IwcIq$reactariai18n.useLocale)();
406
- let date = state.formatValue(locale, {
407
- month: "long"
408
- });
409
- let description = date ? stringFormatter.format("selectedDateDescription", {
410
- date: date
411
- }) : "";
412
- let descProps = (0, $IwcIq$reactariautils.useDescription)(description);
413
- let ariaDescribedBy = [
414
- descProps["aria-describedby"],
415
- fieldProps["aria-describedby"]
416
- ].filter(Boolean).join(" ") || undefined;
417
- let domProps = (0, $IwcIq$reactariautils.filterDOMProps)(props);
418
- let focusManager = (0, $IwcIq$react.useMemo)(()=>(0, $IwcIq$reactariafocus.createFocusManager)(ref), [
419
- ref
420
- ]);
421
- let { focusWithinProps: focusWithinProps } = (0, $IwcIq$reactariainteractions.useFocusWithin)({
422
- ...props,
423
- isDisabled: state.isOpen,
424
- onBlurWithin: props.onBlur,
425
- onFocusWithin: props.onFocus,
426
- onFocusWithinChange: props.onFocusChange
427
- });
428
- return {
429
- groupProps: (0, $IwcIq$reactariautils.mergeProps)(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
430
- role: "group",
431
- "aria-disabled": props.isDisabled || null,
432
- "aria-labelledby": labelledBy,
433
- "aria-describedby": ariaDescribedBy,
434
- onKeyDown (e) {
435
- if (state.isOpen) return;
436
- if (props.onKeyDown) props.onKeyDown(e);
437
- },
438
- onKeyUp (e) {
439
- if (state.isOpen) return;
440
- if (props.onKeyUp) props.onKeyUp(e);
441
- }
442
- }),
443
- labelProps: {
444
- ...labelProps,
445
- onClick: ()=>{
446
- focusManager.focusFirst();
447
- }
448
- },
449
- fieldProps: {
450
- ...fieldProps,
451
- id: fieldId,
452
- [(0, $4acc2f407c169e55$export$300019f83c56d282)]: "presentation",
453
- "aria-describedby": ariaDescribedBy,
454
- value: state.value,
455
- onChange: state.setValue,
456
- placeholderValue: props.placeholderValue,
457
- hideTimeZone: props.hideTimeZone,
458
- hourCycle: props.hourCycle,
459
- shouldForceLeadingZeros: props.shouldForceLeadingZeros,
460
- granularity: props.granularity,
461
- isDisabled: props.isDisabled,
462
- isReadOnly: props.isReadOnly,
463
- isRequired: props.isRequired,
464
- validationBehavior: props.validationBehavior,
465
- // DatePicker owns the validation state for the date field.
466
- [(0, $IwcIq$reactstatelyform.privateValidationStateProp)]: state,
467
- autoFocus: props.autoFocus,
468
- name: props.name
469
- },
470
- descriptionProps: descriptionProps,
471
- errorMessageProps: errorMessageProps,
472
- buttonProps: {
473
- ...descProps,
474
- id: buttonId,
475
- "aria-haspopup": "dialog",
476
- "aria-label": stringFormatter.format("calendar"),
477
- "aria-labelledby": `${buttonId} ${labelledBy}`,
478
- "aria-describedby": ariaDescribedBy,
479
- "aria-expanded": state.isOpen,
480
- isDisabled: props.isDisabled || props.isReadOnly,
481
- onPress: ()=>state.setOpen(true)
482
- },
483
- dialogProps: {
484
- id: dialogId,
485
- "aria-labelledby": `${buttonId} ${labelledBy}`
486
- },
487
- calendarProps: {
488
- autoFocus: true,
489
- value: state.dateValue,
490
- onChange: state.setDateValue,
491
- minValue: props.minValue,
492
- maxValue: props.maxValue,
493
- isDisabled: props.isDisabled,
494
- isReadOnly: props.isReadOnly,
495
- isDateUnavailable: props.isDateUnavailable,
496
- defaultFocusedValue: state.dateValue ? undefined : props.placeholderValue,
497
- isInvalid: state.isInvalid,
498
- errorMessage: typeof props.errorMessage === "function" ? props.errorMessage(state.displayValidation) : props.errorMessage || state.displayValidation.validationErrors.join(" ")
499
- },
500
- isInvalid: isInvalid,
501
- validationErrors: validationErrors,
502
- validationDetails: validationDetails
503
- };
504
- }
505
-
506
-
12
+ $parcel$export(module.exports, "useDatePicker", () => $e90ae7c26a69c6b1$exports.useDatePicker);
13
+ $parcel$export(module.exports, "useDateSegment", () => $5c015c6316d1904d$exports.useDateSegment);
14
+ $parcel$export(module.exports, "useDateField", () => $4acc2f407c169e55$exports.useDateField);
15
+ $parcel$export(module.exports, "useTimeField", () => $4acc2f407c169e55$exports.useTimeField);
16
+ $parcel$export(module.exports, "useDateRangePicker", () => $20f695b1b69e6b9e$exports.useDateRangePicker);
17
+ $parcel$export(module.exports, "useDisplayNames", () => $934ac650a0aceb4b$exports.useDisplayNames);
507
18
  /*
508
19
  * Copyright 2020 Adobe. All rights reserved.
509
20
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -520,558 +31,5 @@ function $e90ae7c26a69c6b1$export$42df105a73306d51(props, state, ref) {
520
31
 
521
32
 
522
33
 
523
- /*
524
- * Copyright 2020 Adobe. All rights reserved.
525
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
526
- * you may not use this file except in compliance with the License. You may obtain a copy
527
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
528
- *
529
- * Unless required by applicable law or agreed to in writing, software distributed under
530
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
531
- * OF ANY KIND, either express or implied. See the License for the specific language
532
- * governing permissions and limitations under the License.
533
- */ // @ts-ignore
534
-
535
-
536
-
537
- function $934ac650a0aceb4b$export$d42c60378c8168f8() {
538
- let { locale: locale } = (0, $IwcIq$reactariai18n.useLocale)();
539
- let dictionary = (0, $IwcIq$reactariai18n.useLocalizedStringDictionary)((0, (/*@__PURE__*/$parcel$interopDefault($c1905b78f6d2f5bf$exports))), "@react-aria/datepicker");
540
- return (0, $IwcIq$react.useMemo)(()=>{
541
- // Try to use Intl.DisplayNames if possible. It may be supported in browsers, but not support the dateTimeField
542
- // type as that was only added in v2. https://github.com/tc39/intl-displaynames-v2
543
- try {
544
- // @ts-ignore
545
- return new Intl.DisplayNames(locale, {
546
- type: "dateTimeField"
547
- });
548
- } catch (err) {
549
- return new $934ac650a0aceb4b$var$DisplayNamesPolyfill(locale, dictionary);
550
- }
551
- }, [
552
- locale,
553
- dictionary
554
- ]);
555
- }
556
- class $934ac650a0aceb4b$var$DisplayNamesPolyfill {
557
- of(field) {
558
- return this.dictionary.getStringForLocale(field, this.locale);
559
- }
560
- constructor(locale, dictionary){
561
- this.locale = locale;
562
- this.dictionary = dictionary;
563
- }
564
- }
565
-
566
-
567
-
568
- function $5c015c6316d1904d$export$1315d136e6f7581(segment, state, ref) {
569
- let enteredKeys = (0, $IwcIq$react.useRef)("");
570
- let { locale: locale } = (0, $IwcIq$reactariai18n.useLocale)();
571
- let displayNames = (0, $934ac650a0aceb4b$export$d42c60378c8168f8)();
572
- let { ariaLabel: ariaLabel, ariaLabelledBy: ariaLabelledBy, ariaDescribedBy: ariaDescribedBy, focusManager: focusManager } = (0, $4acc2f407c169e55$export$653eddfc964b0f8a).get(state);
573
- let textValue = segment.isPlaceholder ? "" : segment.text;
574
- let options = (0, $IwcIq$react.useMemo)(()=>state.dateFormatter.resolvedOptions(), [
575
- state.dateFormatter
576
- ]);
577
- let monthDateFormatter = (0, $IwcIq$reactariai18n.useDateFormatter)({
578
- month: "long",
579
- timeZone: options.timeZone
580
- });
581
- let hourDateFormatter = (0, $IwcIq$reactariai18n.useDateFormatter)({
582
- hour: "numeric",
583
- hour12: options.hour12,
584
- timeZone: options.timeZone
585
- });
586
- if (segment.type === "month" && !segment.isPlaceholder) {
587
- let monthTextValue = monthDateFormatter.format(state.dateValue);
588
- textValue = monthTextValue !== textValue ? `${textValue} \u{2013} ${monthTextValue}` : monthTextValue;
589
- } else if (segment.type === "hour" && !segment.isPlaceholder) textValue = hourDateFormatter.format(state.dateValue);
590
- let { spinButtonProps: spinButtonProps } = (0, $IwcIq$reactariaspinbutton.useSpinButton)({
591
- // The ARIA spec says aria-valuenow is optional if there's no value, but aXe seems to require it.
592
- // This doesn't seem to have any negative effects with real AT since we also use aria-valuetext.
593
- // https://github.com/dequelabs/axe-core/issues/3505
594
- value: segment.value,
595
- textValue: textValue,
596
- minValue: segment.minValue,
597
- maxValue: segment.maxValue,
598
- isDisabled: state.isDisabled,
599
- isReadOnly: state.isReadOnly || !segment.isEditable,
600
- isRequired: state.isRequired,
601
- onIncrement: ()=>{
602
- enteredKeys.current = "";
603
- state.increment(segment.type);
604
- },
605
- onDecrement: ()=>{
606
- enteredKeys.current = "";
607
- state.decrement(segment.type);
608
- },
609
- onIncrementPage: ()=>{
610
- enteredKeys.current = "";
611
- state.incrementPage(segment.type);
612
- },
613
- onDecrementPage: ()=>{
614
- enteredKeys.current = "";
615
- state.decrementPage(segment.type);
616
- },
617
- onIncrementToMax: ()=>{
618
- enteredKeys.current = "";
619
- state.setSegment(segment.type, segment.maxValue);
620
- },
621
- onDecrementToMin: ()=>{
622
- enteredKeys.current = "";
623
- state.setSegment(segment.type, segment.minValue);
624
- }
625
- });
626
- let parser = (0, $IwcIq$react.useMemo)(()=>new (0, $IwcIq$internationalizednumber.NumberParser)(locale, {
627
- maximumFractionDigits: 0
628
- }), [
629
- locale
630
- ]);
631
- let backspace = ()=>{
632
- if (parser.isValidPartialNumber(segment.text) && !state.isReadOnly && !segment.isPlaceholder) {
633
- let newValue = segment.text.slice(0, -1);
634
- let parsed = parser.parse(newValue);
635
- if (newValue.length === 0 || parsed === 0) state.clearSegment(segment.type);
636
- else state.setSegment(segment.type, parsed);
637
- enteredKeys.current = newValue;
638
- } else if (segment.type === "dayPeriod") state.clearSegment(segment.type);
639
- };
640
- let onKeyDown = (e)=>{
641
- // Firefox does not fire selectstart for Ctrl/Cmd + A
642
- // https://bugzilla.mozilla.org/show_bug.cgi?id=1742153
643
- if (e.key === "a" && ((0, $IwcIq$reactariautils.isMac)() ? e.metaKey : e.ctrlKey)) e.preventDefault();
644
- if (e.ctrlKey || e.metaKey || e.shiftKey || e.altKey) return;
645
- switch(e.key){
646
- case "Backspace":
647
- case "Delete":
648
- // Safari on iOS does not fire beforeinput for the backspace key because the cursor is at the start.
649
- e.preventDefault();
650
- e.stopPropagation();
651
- backspace();
652
- break;
653
- }
654
- };
655
- // Safari dayPeriod option doesn't work...
656
- let { startsWith: startsWith } = (0, $IwcIq$reactariai18n.useFilter)({
657
- sensitivity: "base"
658
- });
659
- let amPmFormatter = (0, $IwcIq$reactariai18n.useDateFormatter)({
660
- hour: "numeric",
661
- hour12: true
662
- });
663
- let am = (0, $IwcIq$react.useMemo)(()=>{
664
- let date = new Date();
665
- date.setHours(0);
666
- return amPmFormatter.formatToParts(date).find((part)=>part.type === "dayPeriod").value;
667
- }, [
668
- amPmFormatter
669
- ]);
670
- let pm = (0, $IwcIq$react.useMemo)(()=>{
671
- let date = new Date();
672
- date.setHours(12);
673
- return amPmFormatter.formatToParts(date).find((part)=>part.type === "dayPeriod").value;
674
- }, [
675
- amPmFormatter
676
- ]);
677
- // Get a list of formatted era names so users can type the first character to choose one.
678
- let eraFormatter = (0, $IwcIq$reactariai18n.useDateFormatter)({
679
- year: "numeric",
680
- era: "narrow",
681
- timeZone: "UTC"
682
- });
683
- let eras = (0, $IwcIq$react.useMemo)(()=>{
684
- if (segment.type !== "era") return [];
685
- let date = (0, $IwcIq$internationalizeddate.toCalendar)(new (0, $IwcIq$internationalizeddate.CalendarDate)(1, 1, 1), state.calendar);
686
- let eras = state.calendar.getEras().map((era)=>{
687
- let eraDate = date.set({
688
- year: 1,
689
- month: 1,
690
- day: 1,
691
- era: era
692
- }).toDate("UTC");
693
- let parts = eraFormatter.formatToParts(eraDate);
694
- let formatted = parts.find((p)=>p.type === "era").value;
695
- return {
696
- era: era,
697
- formatted: formatted
698
- };
699
- });
700
- // Remove the common prefix from formatted values. This is so that in calendars with eras like
701
- // ERA0 and ERA1 (e.g. Ethiopic), users can press "0" and "1" to select an era. In other cases,
702
- // the first letter is used.
703
- let prefixLength = $5c015c6316d1904d$var$commonPrefixLength(eras.map((era)=>era.formatted));
704
- if (prefixLength) for (let era of eras)era.formatted = era.formatted.slice(prefixLength);
705
- return eras;
706
- }, [
707
- eraFormatter,
708
- state.calendar,
709
- segment.type
710
- ]);
711
- let onInput = (key)=>{
712
- if (state.isDisabled || state.isReadOnly) return;
713
- let newValue = enteredKeys.current + key;
714
- switch(segment.type){
715
- case "dayPeriod":
716
- if (startsWith(am, key)) state.setSegment("dayPeriod", 0);
717
- else if (startsWith(pm, key)) state.setSegment("dayPeriod", 12);
718
- else break;
719
- focusManager.focusNext();
720
- break;
721
- case "era":
722
- {
723
- let matched = eras.find((e)=>startsWith(e.formatted, key));
724
- if (matched) {
725
- state.setSegment("era", matched.era);
726
- focusManager.focusNext();
727
- }
728
- break;
729
- }
730
- case "day":
731
- case "hour":
732
- case "minute":
733
- case "second":
734
- case "month":
735
- case "year":
736
- {
737
- if (!parser.isValidPartialNumber(newValue)) return;
738
- let numberValue = parser.parse(newValue);
739
- let segmentValue = numberValue;
740
- let allowsZero = segment.minValue === 0;
741
- if (segment.type === "hour" && state.dateFormatter.resolvedOptions().hour12) {
742
- switch(state.dateFormatter.resolvedOptions().hourCycle){
743
- case "h11":
744
- if (numberValue > 11) segmentValue = parser.parse(key);
745
- break;
746
- case "h12":
747
- allowsZero = false;
748
- if (numberValue > 12) segmentValue = parser.parse(key);
749
- break;
750
- }
751
- if (segment.value >= 12 && numberValue > 1) numberValue += 12;
752
- } else if (numberValue > segment.maxValue) segmentValue = parser.parse(key);
753
- if (isNaN(numberValue)) return;
754
- let shouldSetValue = segmentValue !== 0 || allowsZero;
755
- if (shouldSetValue) state.setSegment(segment.type, segmentValue);
756
- if (Number(numberValue + "0") > segment.maxValue || newValue.length >= String(segment.maxValue).length) {
757
- enteredKeys.current = "";
758
- if (shouldSetValue) focusManager.focusNext();
759
- } else enteredKeys.current = newValue;
760
- break;
761
- }
762
- }
763
- };
764
- let onFocus = ()=>{
765
- enteredKeys.current = "";
766
- (0, $IwcIq$reactariautils.scrollIntoViewport)(ref.current, {
767
- containingElement: (0, $IwcIq$reactariautils.getScrollParent)(ref.current)
768
- });
769
- // Collapse selection to start or Chrome won't fire input events.
770
- let selection = window.getSelection();
771
- selection.collapse(ref.current);
772
- };
773
- let compositionRef = (0, $IwcIq$react.useRef)("");
774
- // @ts-ignore - TODO: possibly old TS version? doesn't fail in my editor...
775
- (0, $IwcIq$reactariautils.useEvent)(ref, "beforeinput", (e)=>{
776
- e.preventDefault();
777
- switch(e.inputType){
778
- case "deleteContentBackward":
779
- case "deleteContentForward":
780
- if (parser.isValidPartialNumber(segment.text) && !state.isReadOnly) backspace();
781
- break;
782
- case "insertCompositionText":
783
- // insertCompositionText cannot be canceled.
784
- // Record the current state of the element so we can restore it in the `input` event below.
785
- compositionRef.current = ref.current.textContent;
786
- // Safari gets stuck in a composition state unless we also assign to the value here.
787
- // eslint-disable-next-line no-self-assign
788
- ref.current.textContent = ref.current.textContent;
789
- break;
790
- default:
791
- if (e.data != null) onInput(e.data);
792
- break;
793
- }
794
- });
795
- (0, $IwcIq$reactariautils.useEvent)(ref, "input", (e)=>{
796
- let { inputType: inputType, data: data } = e;
797
- switch(inputType){
798
- case "insertCompositionText":
799
- // Reset the DOM to how it was in the beforeinput event.
800
- ref.current.textContent = compositionRef.current;
801
- // Android sometimes fires key presses of letters as composition events. Need to handle am/pm keys here too.
802
- // Can also happen e.g. with Pinyin keyboard on iOS.
803
- if (startsWith(am, data) || startsWith(pm, data)) onInput(data);
804
- break;
805
- }
806
- });
807
- (0, $IwcIq$reactariautils.useLayoutEffect)(()=>{
808
- let element = ref.current;
809
- return ()=>{
810
- // If the focused segment is removed, focus the previous one, or the next one if there was no previous one.
811
- if (document.activeElement === element) {
812
- let prev = focusManager.focusPrevious();
813
- if (!prev) focusManager.focusNext();
814
- }
815
- };
816
- }, [
817
- ref,
818
- focusManager
819
- ]);
820
- // spinbuttons cannot be focused with VoiceOver on iOS.
821
- let touchPropOverrides = (0, $IwcIq$reactariautils.isIOS)() || segment.type === "timeZoneName" ? {
822
- role: "textbox",
823
- "aria-valuemax": null,
824
- "aria-valuemin": null,
825
- "aria-valuetext": null,
826
- "aria-valuenow": null
827
- } : {};
828
- // Only apply aria-describedby to the first segment, unless the field is invalid. This avoids it being
829
- // read every time the user navigates to a new segment.
830
- let firstSegment = (0, $IwcIq$react.useMemo)(()=>state.segments.find((s)=>s.isEditable), [
831
- state.segments
832
- ]);
833
- if (segment !== firstSegment && !state.isInvalid) ariaDescribedBy = undefined;
834
- let id = (0, $IwcIq$reactariautils.useId)();
835
- let isEditable = !state.isDisabled && !state.isReadOnly && segment.isEditable;
836
- // Prepend the label passed from the field to each segment name.
837
- // This is needed because VoiceOver on iOS does not announce groups.
838
- let name = segment.type === "literal" ? "" : displayNames.of(segment.type);
839
- let labelProps = (0, $IwcIq$reactariautils.useLabels)({
840
- "aria-label": `${name}${ariaLabel ? `, ${ariaLabel}` : ""}${ariaLabelledBy ? ", " : ""}`,
841
- "aria-labelledby": ariaLabelledBy
842
- });
843
- // Literal segments should not be visible to screen readers. We don't really need any of the above,
844
- // but the rules of hooks mean hooks cannot be conditional so we have to put this condition here.
845
- if (segment.type === "literal") return {
846
- segmentProps: {
847
- "aria-hidden": true
848
- }
849
- };
850
- return {
851
- segmentProps: (0, $IwcIq$reactariautils.mergeProps)(spinButtonProps, labelProps, {
852
- id: id,
853
- ...touchPropOverrides,
854
- "aria-invalid": state.isInvalid ? "true" : undefined,
855
- "aria-describedby": ariaDescribedBy,
856
- "aria-readonly": state.isReadOnly || !segment.isEditable ? "true" : undefined,
857
- "data-placeholder": segment.isPlaceholder || undefined,
858
- contentEditable: isEditable,
859
- suppressContentEditableWarning: isEditable,
860
- spellCheck: isEditable ? "false" : undefined,
861
- autoCapitalize: isEditable ? "off" : undefined,
862
- autoCorrect: isEditable ? "off" : undefined,
863
- // Capitalization was changed in React 17...
864
- [parseInt((0, ($parcel$interopDefault($IwcIq$react))).version, 10) >= 17 ? "enterKeyHint" : "enterkeyhint"]: isEditable ? "next" : undefined,
865
- inputMode: state.isDisabled || segment.type === "dayPeriod" || segment.type === "era" || !isEditable ? undefined : "numeric",
866
- tabIndex: state.isDisabled ? undefined : 0,
867
- onKeyDown: onKeyDown,
868
- onFocus: onFocus,
869
- style: {
870
- caretColor: "transparent"
871
- },
872
- // Prevent pointer events from reaching useDatePickerGroup, and allow native browser behavior to focus the segment.
873
- onPointerDown (e) {
874
- e.stopPropagation();
875
- },
876
- onMouseDown (e) {
877
- e.stopPropagation();
878
- }
879
- })
880
- };
881
- }
882
- function $5c015c6316d1904d$var$commonPrefixLength(strings) {
883
- // Sort the strings, and compare the characters in the first and last to find the common prefix.
884
- strings.sort();
885
- let first = strings[0];
886
- let last = strings[strings.length - 1];
887
- for(let i = 0; i < first.length; i++){
888
- if (first[i] !== last[i]) return i;
889
- }
890
- return 0;
891
- }
892
-
893
-
894
-
895
- /*
896
- * Copyright 2020 Adobe. All rights reserved.
897
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
898
- * you may not use this file except in compliance with the License. You may obtain a copy
899
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
900
- *
901
- * Unless required by applicable law or agreed to in writing, software distributed under
902
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
903
- * OF ANY KIND, either express or implied. See the License for the specific language
904
- * governing permissions and limitations under the License.
905
- */
906
-
907
-
908
-
909
-
910
-
911
-
912
-
913
-
914
-
915
- function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
916
- var _state_value, _state_value1;
917
- let stringFormatter = (0, $IwcIq$reactariai18n.useLocalizedStringFormatter)((0, (/*@__PURE__*/$parcel$interopDefault($c1905b78f6d2f5bf$exports))), "@react-aria/datepicker");
918
- let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
919
- let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $IwcIq$reactarialabel.useField)({
920
- ...props,
921
- labelElementType: "span",
922
- isInvalid: isInvalid,
923
- errorMessage: props.errorMessage || validationErrors
924
- });
925
- let labelledBy = fieldProps["aria-labelledby"] || fieldProps.id;
926
- let { locale: locale } = (0, $IwcIq$reactariai18n.useLocale)();
927
- let range = state.formatValue(locale, {
928
- month: "long"
929
- });
930
- let description = range ? stringFormatter.format("selectedRangeDescription", {
931
- startDate: range.start,
932
- endDate: range.end
933
- }) : "";
934
- let descProps = (0, $IwcIq$reactariautils.useDescription)(description);
935
- let startFieldProps = {
936
- "aria-label": stringFormatter.format("startDate"),
937
- "aria-labelledby": labelledBy
938
- };
939
- let endFieldProps = {
940
- "aria-label": stringFormatter.format("endDate"),
941
- "aria-labelledby": labelledBy
942
- };
943
- let buttonId = (0, $IwcIq$reactariautils.useId)();
944
- let dialogId = (0, $IwcIq$reactariautils.useId)();
945
- let groupProps = (0, $715562ad3b4cced4$export$4a931266a3838b86)(state, ref);
946
- let ariaDescribedBy = [
947
- descProps["aria-describedby"],
948
- fieldProps["aria-describedby"]
949
- ].filter(Boolean).join(" ") || undefined;
950
- let focusManager = (0, $IwcIq$react.useMemo)(()=>(0, $IwcIq$reactariafocus.createFocusManager)(ref, {
951
- // Exclude the button from the focus manager.
952
- accept: (element)=>element.id !== buttonId
953
- }), [
954
- ref,
955
- buttonId
956
- ]);
957
- let commonFieldProps = {
958
- [(0, $4acc2f407c169e55$export$7b3062cd49e80452)]: focusManager,
959
- [(0, $4acc2f407c169e55$export$300019f83c56d282)]: "presentation",
960
- "aria-describedby": ariaDescribedBy,
961
- placeholderValue: props.placeholderValue,
962
- hideTimeZone: props.hideTimeZone,
963
- hourCycle: props.hourCycle,
964
- granularity: props.granularity,
965
- shouldForceLeadingZeros: props.shouldForceLeadingZeros,
966
- isDisabled: props.isDisabled,
967
- isReadOnly: props.isReadOnly,
968
- isRequired: props.isRequired,
969
- validationBehavior: props.validationBehavior
970
- };
971
- let domProps = (0, $IwcIq$reactariautils.filterDOMProps)(props);
972
- let { focusWithinProps: focusWithinProps } = (0, $IwcIq$reactariainteractions.useFocusWithin)({
973
- ...props,
974
- isDisabled: state.isOpen,
975
- onBlurWithin: props.onBlur,
976
- onFocusWithin: props.onFocus,
977
- onFocusWithinChange: props.onFocusChange
978
- });
979
- let startFieldValidation = (0, $IwcIq$react.useRef)((0, $IwcIq$reactstatelyform.DEFAULT_VALIDATION_RESULT));
980
- let endFieldValidation = (0, $IwcIq$react.useRef)((0, $IwcIq$reactstatelyform.DEFAULT_VALIDATION_RESULT));
981
- return {
982
- groupProps: (0, $IwcIq$reactariautils.mergeProps)(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
983
- role: "group",
984
- "aria-disabled": props.isDisabled || null,
985
- "aria-describedby": ariaDescribedBy,
986
- onKeyDown (e) {
987
- if (state.isOpen) return;
988
- if (props.onKeyDown) props.onKeyDown(e);
989
- },
990
- onKeyUp (e) {
991
- if (state.isOpen) return;
992
- if (props.onKeyUp) props.onKeyUp(e);
993
- }
994
- }),
995
- labelProps: {
996
- ...labelProps,
997
- onClick: ()=>{
998
- focusManager.focusFirst();
999
- }
1000
- },
1001
- buttonProps: {
1002
- ...descProps,
1003
- id: buttonId,
1004
- "aria-haspopup": "dialog",
1005
- "aria-label": stringFormatter.format("calendar"),
1006
- "aria-labelledby": `${buttonId} ${labelledBy}`,
1007
- "aria-describedby": ariaDescribedBy,
1008
- "aria-expanded": state.isOpen,
1009
- isDisabled: props.isDisabled || props.isReadOnly,
1010
- onPress: ()=>state.setOpen(true)
1011
- },
1012
- dialogProps: {
1013
- id: dialogId,
1014
- "aria-labelledby": `${buttonId} ${labelledBy}`
1015
- },
1016
- startFieldProps: {
1017
- ...startFieldProps,
1018
- ...commonFieldProps,
1019
- value: (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start,
1020
- onChange: (start)=>state.setDateTime("start", start),
1021
- autoFocus: props.autoFocus,
1022
- name: props.startName,
1023
- [(0, $IwcIq$reactstatelyform.privateValidationStateProp)]: {
1024
- realtimeValidation: state.realtimeValidation,
1025
- displayValidation: state.displayValidation,
1026
- updateValidation (e) {
1027
- startFieldValidation.current = e;
1028
- state.updateValidation((0, $IwcIq$reactstatelyform.mergeValidation)(e, endFieldValidation.current));
1029
- },
1030
- resetValidation: state.resetValidation,
1031
- commitValidation: state.commitValidation
1032
- }
1033
- },
1034
- endFieldProps: {
1035
- ...endFieldProps,
1036
- ...commonFieldProps,
1037
- value: (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end,
1038
- onChange: (end)=>state.setDateTime("end", end),
1039
- name: props.endName,
1040
- [(0, $IwcIq$reactstatelyform.privateValidationStateProp)]: {
1041
- realtimeValidation: state.realtimeValidation,
1042
- displayValidation: state.displayValidation,
1043
- updateValidation (e) {
1044
- endFieldValidation.current = e;
1045
- state.updateValidation((0, $IwcIq$reactstatelyform.mergeValidation)(startFieldValidation.current, e));
1046
- },
1047
- resetValidation: state.resetValidation,
1048
- commitValidation: state.commitValidation
1049
- }
1050
- },
1051
- descriptionProps: descriptionProps,
1052
- errorMessageProps: errorMessageProps,
1053
- calendarProps: {
1054
- autoFocus: true,
1055
- value: state.dateRange,
1056
- onChange: state.setDateRange,
1057
- minValue: props.minValue,
1058
- maxValue: props.maxValue,
1059
- isDisabled: props.isDisabled,
1060
- isReadOnly: props.isReadOnly,
1061
- isDateUnavailable: props.isDateUnavailable,
1062
- allowsNonContiguousRanges: props.allowsNonContiguousRanges,
1063
- defaultFocusedValue: state.dateRange ? undefined : props.placeholderValue,
1064
- isInvalid: state.isInvalid,
1065
- errorMessage: typeof props.errorMessage === "function" ? props.errorMessage(state.displayValidation) : props.errorMessage || state.displayValidation.validationErrors.join(" ")
1066
- },
1067
- isInvalid: isInvalid,
1068
- validationErrors: validationErrors,
1069
- validationDetails: validationDetails
1070
- };
1071
- }
1072
-
1073
-
1074
-
1075
-
1076
34
 
1077
35
  //# sourceMappingURL=main.js.map