@react-spectrum/datepicker 3.9.4 → 3.9.5

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 (108) hide show
  1. package/dist/DateField.main.js +110 -0
  2. package/dist/DateField.main.js.map +1 -0
  3. package/dist/DateField.mjs +105 -0
  4. package/dist/DateField.module.js +105 -0
  5. package/dist/DateField.module.js.map +1 -0
  6. package/dist/DatePicker.main.js +198 -0
  7. package/dist/DatePicker.main.js.map +1 -0
  8. package/dist/DatePicker.mjs +193 -0
  9. package/dist/DatePicker.module.js +193 -0
  10. package/dist/DatePicker.module.js.map +1 -0
  11. package/dist/DatePickerField.main.js +72 -0
  12. package/dist/DatePickerField.main.js.map +1 -0
  13. package/dist/DatePickerField.mjs +67 -0
  14. package/dist/DatePickerField.module.js +67 -0
  15. package/dist/DatePickerField.module.js.map +1 -0
  16. package/dist/DatePickerSegment.main.js +76 -0
  17. package/dist/DatePickerSegment.main.js.map +1 -0
  18. package/dist/DatePickerSegment.mjs +71 -0
  19. package/dist/DatePickerSegment.module.js +71 -0
  20. package/dist/DatePickerSegment.module.js.map +1 -0
  21. package/dist/DateRangePicker.main.js +225 -0
  22. package/dist/DateRangePicker.main.js.map +1 -0
  23. package/dist/DateRangePicker.mjs +220 -0
  24. package/dist/DateRangePicker.module.js +220 -0
  25. package/dist/DateRangePicker.module.js.map +1 -0
  26. package/dist/Input.main.js +123 -0
  27. package/dist/Input.main.js.map +1 -0
  28. package/dist/Input.mjs +118 -0
  29. package/dist/Input.module.js +118 -0
  30. package/dist/Input.module.js.map +1 -0
  31. package/dist/TimeField.main.js +102 -0
  32. package/dist/TimeField.main.js.map +1 -0
  33. package/dist/TimeField.mjs +97 -0
  34. package/dist/TimeField.module.js +97 -0
  35. package/dist/TimeField.module.js.map +1 -0
  36. package/dist/ar-AE.mjs +1 -1
  37. package/dist/bg-BG.mjs +1 -1
  38. package/dist/cs-CZ.mjs +1 -1
  39. package/dist/da-DK.mjs +1 -1
  40. package/dist/de-DE.mjs +1 -1
  41. package/dist/el-GR.mjs +1 -1
  42. package/dist/en-US.mjs +1 -1
  43. package/dist/es-ES.mjs +1 -1
  44. package/dist/et-EE.mjs +1 -1
  45. package/dist/fi-FI.mjs +1 -1
  46. package/dist/fr-FR.mjs +1 -1
  47. package/dist/he-IL.mjs +1 -1
  48. package/dist/hr-HR.mjs +1 -1
  49. package/dist/hu-HU.mjs +1 -1
  50. package/dist/import.mjs +4 -1136
  51. package/dist/inputgroup_vars_css.main.js +86 -0
  52. package/dist/inputgroup_vars_css.main.js.map +1 -0
  53. package/dist/inputgroup_vars_css.mjs +88 -0
  54. package/dist/inputgroup_vars_css.module.js +88 -0
  55. package/dist/inputgroup_vars_css.module.js.map +1 -0
  56. package/dist/intlStrings.main.js +108 -0
  57. package/dist/intlStrings.main.js.map +1 -0
  58. package/dist/intlStrings.mjs +110 -0
  59. package/dist/intlStrings.module.js +110 -0
  60. package/dist/intlStrings.module.js.map +1 -0
  61. package/dist/it-IT.mjs +1 -1
  62. package/dist/ja-JP.mjs +1 -1
  63. package/dist/ko-KR.mjs +1 -1
  64. package/dist/lt-LT.mjs +1 -1
  65. package/dist/lv-LV.mjs +1 -1
  66. package/dist/main.js +8 -1136
  67. package/dist/main.js.map +1 -1
  68. package/dist/module.js +4 -1136
  69. package/dist/module.js.map +1 -1
  70. package/dist/nb-NO.mjs +1 -1
  71. package/dist/nl-NL.mjs +1 -1
  72. package/dist/pl-PL.mjs +1 -1
  73. package/dist/pt-BR.mjs +1 -1
  74. package/dist/pt-PT.mjs +1 -1
  75. package/dist/ro-RO.mjs +1 -1
  76. package/dist/ru-RU.mjs +1 -1
  77. package/dist/sk-SK.mjs +1 -1
  78. package/dist/sl-SI.mjs +1 -1
  79. package/dist/sr-SP.mjs +1 -1
  80. package/dist/styles.36ea4632.css +209 -0
  81. package/dist/styles.36ea4632.css.map +1 -0
  82. package/dist/styles_css.main.js +74 -0
  83. package/dist/styles_css.main.js.map +1 -0
  84. package/dist/styles_css.mjs +76 -0
  85. package/dist/styles_css.module.js +76 -0
  86. package/dist/styles_css.module.js.map +1 -0
  87. package/dist/sv-SE.mjs +1 -1
  88. package/dist/textfield_vars_css.main.js +74 -0
  89. package/dist/textfield_vars_css.main.js.map +1 -0
  90. package/dist/textfield_vars_css.mjs +76 -0
  91. package/dist/textfield_vars_css.module.js +76 -0
  92. package/dist/textfield_vars_css.module.js.map +1 -0
  93. package/dist/tr-TR.mjs +1 -1
  94. package/dist/uk-UA.mjs +1 -1
  95. package/dist/utils.main.js +89 -0
  96. package/dist/utils.main.js.map +1 -0
  97. package/dist/utils.mjs +82 -0
  98. package/dist/utils.module.js +82 -0
  99. package/dist/utils.module.js.map +1 -0
  100. package/dist/vars.3692148b.css +549 -0
  101. package/dist/vars.3692148b.css.map +1 -0
  102. package/dist/vars.ccbd2e3f.css +649 -0
  103. package/dist/vars.ccbd2e3f.css.map +1 -0
  104. package/dist/zh-CN.mjs +1 -1
  105. package/dist/zh-TW.mjs +1 -1
  106. package/package.json +22 -22
  107. package/dist/main.css +0 -1626
  108. package/dist/main.css.map +0 -1
@@ -0,0 +1,110 @@
1
+ var $edac158d20ebe4a9$exports = require("./DatePickerSegment.main.js");
2
+ require("./styles.36ea4632.css");
3
+ var $91c3db8c6a21ca71$exports = require("./styles_css.main.js");
4
+ var $c3ebc4931d9b9977$exports = require("./Input.main.js");
5
+ var $4d2e419f522adb48$exports = require("./utils.main.js");
6
+ var $2sBGl$reactspectrumutils = require("@react-spectrum/utils");
7
+ var $2sBGl$internationalizeddate = require("@internationalized/date");
8
+ var $2sBGl$reactspectrumlabel = require("@react-spectrum/label");
9
+ var $2sBGl$react = require("react");
10
+ var $2sBGl$reactariadatepicker = require("@react-aria/datepicker");
11
+ var $2sBGl$reactstatelydatepicker = require("@react-stately/datepicker");
12
+ var $2sBGl$reactspectrumform = require("@react-spectrum/form");
13
+ var $2sBGl$reactariai18n = require("@react-aria/i18n");
14
+ var $2sBGl$reactspectrumprovider = require("@react-spectrum/provider");
15
+
16
+
17
+ function $parcel$interopDefault(a) {
18
+ return a && a.__esModule ? a.default : a;
19
+ }
20
+
21
+ function $parcel$export(e, n, v, s) {
22
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
23
+ }
24
+
25
+ $parcel$export(module.exports, "DateField", () => $1ab74d2cd1dc2e45$export$d9781c7894a82487);
26
+ /*
27
+ * Copyright 2020 Adobe. All rights reserved.
28
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
29
+ * you may not use this file except in compliance with the License. You may obtain a copy
30
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
31
+ *
32
+ * Unless required by applicable law or agreed to in writing, software distributed under
33
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
34
+ * OF ANY KIND, either express or implied. See the License for the specific language
35
+ * governing permissions and limitations under the License.
36
+ */
37
+
38
+
39
+
40
+
41
+
42
+
43
+
44
+
45
+
46
+
47
+
48
+
49
+ function $1ab74d2cd1dc2e45$var$DateField(props, ref) {
50
+ props = (0, $2sBGl$reactspectrumprovider.useProviderProps)(props);
51
+ props = (0, $2sBGl$reactspectrumform.useFormProps)(props);
52
+ let { autoFocus: autoFocus, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, isQuiet: isQuiet } = props;
53
+ let domRef = (0, $4d2e419f522adb48$exports.useFocusManagerRef)(ref);
54
+ let { locale: locale } = (0, $2sBGl$reactariai18n.useLocale)();
55
+ let state = (0, $2sBGl$reactstatelydatepicker.useDateFieldState)({
56
+ ...props,
57
+ locale: locale,
58
+ createCalendar: $2sBGl$internationalizeddate.createCalendar
59
+ });
60
+ let fieldRef = (0, $2sBGl$react.useRef)(null);
61
+ let inputRef = (0, $2sBGl$react.useRef)(null);
62
+ let { labelProps: labelProps, fieldProps: fieldProps, inputProps: inputProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = (0, $2sBGl$reactariadatepicker.useDateField)({
63
+ ...props,
64
+ inputRef: inputRef
65
+ }, state, fieldRef);
66
+ // Note: this description is intentionally not passed to useDatePicker.
67
+ // The format help text is unnecessary for screen reader users because each segment already has a label.
68
+ let description = (0, $4d2e419f522adb48$exports.useFormatHelpText)(props);
69
+ if (description && !props.description) descriptionProps.id = null;
70
+ let validationState = state.validationState || (isInvalid ? "invalid" : null);
71
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($2sBGl$react))).createElement((0, $2sBGl$reactspectrumlabel.Field), {
72
+ ...props,
73
+ ref: domRef,
74
+ elementType: "span",
75
+ description: description,
76
+ labelProps: labelProps,
77
+ descriptionProps: descriptionProps,
78
+ errorMessageProps: errorMessageProps,
79
+ validationState: validationState,
80
+ isInvalid: isInvalid,
81
+ validationErrors: validationErrors,
82
+ validationDetails: validationDetails,
83
+ wrapperClassName: (0, $2sBGl$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-Datepicker-fieldWrapper")
84
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2sBGl$react))).createElement((0, $c3ebc4931d9b9977$exports.Input), {
85
+ ref: fieldRef,
86
+ fieldProps: fieldProps,
87
+ isDisabled: isDisabled,
88
+ isQuiet: isQuiet,
89
+ autoFocus: autoFocus,
90
+ validationState: validationState,
91
+ className: (0, $2sBGl$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-DateField")
92
+ }, state.segments.map((segment, i)=>/*#__PURE__*/ (0, ($parcel$interopDefault($2sBGl$react))).createElement((0, $edac158d20ebe4a9$exports.DatePickerSegment), {
93
+ key: i,
94
+ segment: segment,
95
+ state: state,
96
+ isDisabled: isDisabled,
97
+ isReadOnly: isReadOnly,
98
+ isRequired: isRequired
99
+ })), /*#__PURE__*/ (0, ($parcel$interopDefault($2sBGl$react))).createElement("input", {
100
+ ...inputProps,
101
+ ref: inputRef
102
+ })));
103
+ }
104
+ /**
105
+ * DateFields allow users to enter and edit date and time values using a keyboard.
106
+ * Each part of a date value is displayed in an individually editable segment.
107
+ */ const $1ab74d2cd1dc2e45$export$d9781c7894a82487 = /*#__PURE__*/ (0, ($parcel$interopDefault($2sBGl$react))).forwardRef($1ab74d2cd1dc2e45$var$DateField);
108
+
109
+
110
+ //# sourceMappingURL=DateField.main.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAkBD,SAAS,gCAA+B,KAAgC,EAAE,GAA8B;IACtG,QAAQ,CAAA,GAAA,6CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,qCAAW,EAAE;IACrB,IAAI,aACF,SAAS,cACT,UAAU,cACV,UAAU,cACV,UAAU,WACV,OAAO,EACR,GAAG;IAEJ,IAAI,SAAS,CAAA,GAAA,4CAAiB,EAAE;IAChC,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,8BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,+CAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;wBACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,aAAE,SAAS,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAC,GAAG,CAAA,GAAA,uCAAW,EAAE;QAC3I,GAAG,KAAK;kBACR;IACF,GAAG,OAAO;IAEV,uEAAuE;IACvE,wGAAwG;IACxG,IAAI,cAAc,CAAA,GAAA,2CAAgB,EAAE;IACpC,IAAI,eAAe,CAAC,MAAM,WAAW,EACnC,iBAAiB,EAAE,GAAG;IAGxB,IAAI,kBAAkB,MAAM,eAAe,IAAK,CAAA,YAAY,YAAY,IAAG;IAE3E,qBACE,0DAAC,CAAA,GAAA,+BAAI;QACF,GAAG,KAAK;QACT,KAAK;QACL,aAAY;QACZ,aAAa;QACb,YAAY;QACZ,kBAAkB;QAClB,mBAAmB;QACnB,iBAAiB;QACjB,WAAW;QACX,kBAAkB;QAClB,mBAAmB;QACnB,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAe,GAAG;qBAC/C,0DAAC,CAAA,GAAA,+BAAI;QACH,KAAK;QACL,YAAY;QACZ,YAAY;QACZ,SAAS;QACT,WAAW;QACX,iBAAiB;QACjB,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAe,GAAG;OACvC,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC,SAAS,kBAC3B,0DAAC,CAAA,GAAA,2CAAgB;YAChB,KAAK;YACL,SAAS;YACT,OAAO;YACP,YAAY;YACZ,YAAY;YACZ,YAAY;2BAEhB,0DAAC;QAAO,GAAG,UAAU;QAAE,KAAK;;AAIpC;AAEA;;;CAGC,GACD,MAAM,0DAAa,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC","sources":["packages/@react-spectrum/datepicker/src/DateField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames} from '@react-spectrum/utils';\nimport {createCalendar} from '@internationalized/date';\nimport {DatePickerSegment} from './DatePickerSegment';\nimport datepickerStyles from './styles.css';\nimport {DateValue, SpectrumDateFieldProps} from '@react-types/datepicker';\nimport {Field} from '@react-spectrum/label';\nimport {FocusableRef} from '@react-types/shared';\nimport {Input} from './Input';\nimport React, {ReactElement, useRef} from 'react';\nimport {useDateField} from '@react-aria/datepicker';\nimport {useDateFieldState} from '@react-stately/datepicker';\nimport {useFocusManagerRef, useFormatHelpText} from './utils';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction DateField<T extends DateValue>(props: SpectrumDateFieldProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n let {\n autoFocus,\n isDisabled,\n isReadOnly,\n isRequired,\n isQuiet\n } = props;\n\n let domRef = useFocusManagerRef(ref);\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...props,\n locale,\n createCalendar\n });\n\n let fieldRef = useRef(null);\n let inputRef = useRef(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, isInvalid, validationErrors, validationDetails} = useDateField({\n ...props,\n inputRef\n }, state, fieldRef);\n\n // Note: this description is intentionally not passed to useDatePicker.\n // The format help text is unnecessary for screen reader users because each segment already has a label.\n let description = useFormatHelpText(props);\n if (description && !props.description) {\n descriptionProps.id = null;\n }\n\n let validationState = state.validationState || (isInvalid ? 'invalid' : null);\n\n return (\n <Field\n {...props}\n ref={domRef}\n elementType=\"span\"\n description={description}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n validationState={validationState}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n wrapperClassName={classNames(datepickerStyles, 'react-spectrum-Datepicker-fieldWrapper')}>\n <Input\n ref={fieldRef}\n fieldProps={fieldProps}\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n autoFocus={autoFocus}\n validationState={validationState}\n className={classNames(datepickerStyles, 'react-spectrum-DateField')}>\n {state.segments.map((segment, i) =>\n (<DatePickerSegment\n key={i}\n segment={segment}\n state={state}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isRequired={isRequired} />)\n )}\n <input {...inputProps} ref={inputRef} />\n </Input>\n </Field>\n );\n}\n\n/**\n * DateFields allow users to enter and edit date and time values using a keyboard.\n * Each part of a date value is displayed in an individually editable segment.\n */\nconst _DateField = React.forwardRef(DateField) as <T extends DateValue>(props: SpectrumDateFieldProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_DateField as DateField};\n"],"names":[],"version":3,"file":"DateField.main.js.map"}
@@ -0,0 +1,105 @@
1
+ import {DatePickerSegment as $cfa347761f172638$export$6388987c5223b54e} from "./DatePickerSegment.mjs";
2
+ import "./styles.36ea4632.css";
3
+ import $6iHxC$styles_cssmodulejs from "./styles_css.mjs";
4
+ import {Input as $79348162c55d687f$export$f5b8910cec6cf069} from "./Input.mjs";
5
+ import {useFocusManagerRef as $04e96200274b03de$export$71a23a36270e4bf0, useFormatHelpText as $04e96200274b03de$export$322f4580ccd8dde6} from "./utils.mjs";
6
+ import {classNames as $6iHxC$classNames} from "@react-spectrum/utils";
7
+ import {createCalendar as $6iHxC$createCalendar} from "@internationalized/date";
8
+ import {Field as $6iHxC$Field} from "@react-spectrum/label";
9
+ import $6iHxC$react, {useRef as $6iHxC$useRef} from "react";
10
+ import {useDateField as $6iHxC$useDateField} from "@react-aria/datepicker";
11
+ import {useDateFieldState as $6iHxC$useDateFieldState} from "@react-stately/datepicker";
12
+ import {useFormProps as $6iHxC$useFormProps} from "@react-spectrum/form";
13
+ import {useLocale as $6iHxC$useLocale} from "@react-aria/i18n";
14
+ import {useProviderProps as $6iHxC$useProviderProps} from "@react-spectrum/provider";
15
+
16
+
17
+ function $parcel$interopDefault(a) {
18
+ return a && a.__esModule ? a.default : a;
19
+ }
20
+ /*
21
+ * Copyright 2020 Adobe. All rights reserved.
22
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
23
+ * you may not use this file except in compliance with the License. You may obtain a copy
24
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
25
+ *
26
+ * Unless required by applicable law or agreed to in writing, software distributed under
27
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
28
+ * OF ANY KIND, either express or implied. See the License for the specific language
29
+ * governing permissions and limitations under the License.
30
+ */
31
+
32
+
33
+
34
+
35
+
36
+
37
+
38
+
39
+
40
+
41
+
42
+
43
+ function $0129798af6791690$var$DateField(props, ref) {
44
+ props = (0, $6iHxC$useProviderProps)(props);
45
+ props = (0, $6iHxC$useFormProps)(props);
46
+ let { autoFocus: autoFocus, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, isQuiet: isQuiet } = props;
47
+ let domRef = (0, $04e96200274b03de$export$71a23a36270e4bf0)(ref);
48
+ let { locale: locale } = (0, $6iHxC$useLocale)();
49
+ let state = (0, $6iHxC$useDateFieldState)({
50
+ ...props,
51
+ locale: locale,
52
+ createCalendar: $6iHxC$createCalendar
53
+ });
54
+ let fieldRef = (0, $6iHxC$useRef)(null);
55
+ let inputRef = (0, $6iHxC$useRef)(null);
56
+ let { labelProps: labelProps, fieldProps: fieldProps, inputProps: inputProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = (0, $6iHxC$useDateField)({
57
+ ...props,
58
+ inputRef: inputRef
59
+ }, state, fieldRef);
60
+ // Note: this description is intentionally not passed to useDatePicker.
61
+ // The format help text is unnecessary for screen reader users because each segment already has a label.
62
+ let description = (0, $04e96200274b03de$export$322f4580ccd8dde6)(props);
63
+ if (description && !props.description) descriptionProps.id = null;
64
+ let validationState = state.validationState || (isInvalid ? "invalid" : null);
65
+ return /*#__PURE__*/ (0, $6iHxC$react).createElement((0, $6iHxC$Field), {
66
+ ...props,
67
+ ref: domRef,
68
+ elementType: "span",
69
+ description: description,
70
+ labelProps: labelProps,
71
+ descriptionProps: descriptionProps,
72
+ errorMessageProps: errorMessageProps,
73
+ validationState: validationState,
74
+ isInvalid: isInvalid,
75
+ validationErrors: validationErrors,
76
+ validationDetails: validationDetails,
77
+ wrapperClassName: (0, $6iHxC$classNames)((0, ($parcel$interopDefault($6iHxC$styles_cssmodulejs))), "react-spectrum-Datepicker-fieldWrapper")
78
+ }, /*#__PURE__*/ (0, $6iHxC$react).createElement((0, $79348162c55d687f$export$f5b8910cec6cf069), {
79
+ ref: fieldRef,
80
+ fieldProps: fieldProps,
81
+ isDisabled: isDisabled,
82
+ isQuiet: isQuiet,
83
+ autoFocus: autoFocus,
84
+ validationState: validationState,
85
+ className: (0, $6iHxC$classNames)((0, ($parcel$interopDefault($6iHxC$styles_cssmodulejs))), "react-spectrum-DateField")
86
+ }, state.segments.map((segment, i)=>/*#__PURE__*/ (0, $6iHxC$react).createElement((0, $cfa347761f172638$export$6388987c5223b54e), {
87
+ key: i,
88
+ segment: segment,
89
+ state: state,
90
+ isDisabled: isDisabled,
91
+ isReadOnly: isReadOnly,
92
+ isRequired: isRequired
93
+ })), /*#__PURE__*/ (0, $6iHxC$react).createElement("input", {
94
+ ...inputProps,
95
+ ref: inputRef
96
+ })));
97
+ }
98
+ /**
99
+ * DateFields allow users to enter and edit date and time values using a keyboard.
100
+ * Each part of a date value is displayed in an individually editable segment.
101
+ */ const $0129798af6791690$export$d9781c7894a82487 = /*#__PURE__*/ (0, $6iHxC$react).forwardRef($0129798af6791690$var$DateField);
102
+
103
+
104
+ export {$0129798af6791690$export$d9781c7894a82487 as DateField};
105
+ //# sourceMappingURL=DateField.mjs.map
@@ -0,0 +1,105 @@
1
+ import {DatePickerSegment as $cfa347761f172638$export$6388987c5223b54e} from "./DatePickerSegment.module.js";
2
+ import "./styles.36ea4632.css";
3
+ import $6iHxC$styles_cssmodulejs from "./styles_css.module.js";
4
+ import {Input as $79348162c55d687f$export$f5b8910cec6cf069} from "./Input.module.js";
5
+ import {useFocusManagerRef as $04e96200274b03de$export$71a23a36270e4bf0, useFormatHelpText as $04e96200274b03de$export$322f4580ccd8dde6} from "./utils.module.js";
6
+ import {classNames as $6iHxC$classNames} from "@react-spectrum/utils";
7
+ import {createCalendar as $6iHxC$createCalendar} from "@internationalized/date";
8
+ import {Field as $6iHxC$Field} from "@react-spectrum/label";
9
+ import $6iHxC$react, {useRef as $6iHxC$useRef} from "react";
10
+ import {useDateField as $6iHxC$useDateField} from "@react-aria/datepicker";
11
+ import {useDateFieldState as $6iHxC$useDateFieldState} from "@react-stately/datepicker";
12
+ import {useFormProps as $6iHxC$useFormProps} from "@react-spectrum/form";
13
+ import {useLocale as $6iHxC$useLocale} from "@react-aria/i18n";
14
+ import {useProviderProps as $6iHxC$useProviderProps} from "@react-spectrum/provider";
15
+
16
+
17
+ function $parcel$interopDefault(a) {
18
+ return a && a.__esModule ? a.default : a;
19
+ }
20
+ /*
21
+ * Copyright 2020 Adobe. All rights reserved.
22
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
23
+ * you may not use this file except in compliance with the License. You may obtain a copy
24
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
25
+ *
26
+ * Unless required by applicable law or agreed to in writing, software distributed under
27
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
28
+ * OF ANY KIND, either express or implied. See the License for the specific language
29
+ * governing permissions and limitations under the License.
30
+ */
31
+
32
+
33
+
34
+
35
+
36
+
37
+
38
+
39
+
40
+
41
+
42
+
43
+ function $0129798af6791690$var$DateField(props, ref) {
44
+ props = (0, $6iHxC$useProviderProps)(props);
45
+ props = (0, $6iHxC$useFormProps)(props);
46
+ let { autoFocus: autoFocus, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, isQuiet: isQuiet } = props;
47
+ let domRef = (0, $04e96200274b03de$export$71a23a36270e4bf0)(ref);
48
+ let { locale: locale } = (0, $6iHxC$useLocale)();
49
+ let state = (0, $6iHxC$useDateFieldState)({
50
+ ...props,
51
+ locale: locale,
52
+ createCalendar: $6iHxC$createCalendar
53
+ });
54
+ let fieldRef = (0, $6iHxC$useRef)(null);
55
+ let inputRef = (0, $6iHxC$useRef)(null);
56
+ let { labelProps: labelProps, fieldProps: fieldProps, inputProps: inputProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = (0, $6iHxC$useDateField)({
57
+ ...props,
58
+ inputRef: inputRef
59
+ }, state, fieldRef);
60
+ // Note: this description is intentionally not passed to useDatePicker.
61
+ // The format help text is unnecessary for screen reader users because each segment already has a label.
62
+ let description = (0, $04e96200274b03de$export$322f4580ccd8dde6)(props);
63
+ if (description && !props.description) descriptionProps.id = null;
64
+ let validationState = state.validationState || (isInvalid ? "invalid" : null);
65
+ return /*#__PURE__*/ (0, $6iHxC$react).createElement((0, $6iHxC$Field), {
66
+ ...props,
67
+ ref: domRef,
68
+ elementType: "span",
69
+ description: description,
70
+ labelProps: labelProps,
71
+ descriptionProps: descriptionProps,
72
+ errorMessageProps: errorMessageProps,
73
+ validationState: validationState,
74
+ isInvalid: isInvalid,
75
+ validationErrors: validationErrors,
76
+ validationDetails: validationDetails,
77
+ wrapperClassName: (0, $6iHxC$classNames)((0, ($parcel$interopDefault($6iHxC$styles_cssmodulejs))), "react-spectrum-Datepicker-fieldWrapper")
78
+ }, /*#__PURE__*/ (0, $6iHxC$react).createElement((0, $79348162c55d687f$export$f5b8910cec6cf069), {
79
+ ref: fieldRef,
80
+ fieldProps: fieldProps,
81
+ isDisabled: isDisabled,
82
+ isQuiet: isQuiet,
83
+ autoFocus: autoFocus,
84
+ validationState: validationState,
85
+ className: (0, $6iHxC$classNames)((0, ($parcel$interopDefault($6iHxC$styles_cssmodulejs))), "react-spectrum-DateField")
86
+ }, state.segments.map((segment, i)=>/*#__PURE__*/ (0, $6iHxC$react).createElement((0, $cfa347761f172638$export$6388987c5223b54e), {
87
+ key: i,
88
+ segment: segment,
89
+ state: state,
90
+ isDisabled: isDisabled,
91
+ isReadOnly: isReadOnly,
92
+ isRequired: isRequired
93
+ })), /*#__PURE__*/ (0, $6iHxC$react).createElement("input", {
94
+ ...inputProps,
95
+ ref: inputRef
96
+ })));
97
+ }
98
+ /**
99
+ * DateFields allow users to enter and edit date and time values using a keyboard.
100
+ * Each part of a date value is displayed in an individually editable segment.
101
+ */ const $0129798af6791690$export$d9781c7894a82487 = /*#__PURE__*/ (0, $6iHxC$react).forwardRef($0129798af6791690$var$DateField);
102
+
103
+
104
+ export {$0129798af6791690$export$d9781c7894a82487 as DateField};
105
+ //# sourceMappingURL=DateField.module.js.map
@@ -0,0 +1 @@
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAkBD,SAAS,gCAA+B,KAAgC,EAAE,GAA8B;IACtG,QAAQ,CAAA,GAAA,uBAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,mBAAW,EAAE;IACrB,IAAI,aACF,SAAS,cACT,UAAU,cACV,UAAU,cACV,UAAU,WACV,OAAO,EACR,GAAG;IAEJ,IAAI,SAAS,CAAA,GAAA,yCAAiB,EAAE;IAChC,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,wBAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;wBACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAAE;IACtB,IAAI,WAAW,CAAA,GAAA,aAAK,EAAE;IACtB,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,aAAE,SAAS,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAC,GAAG,CAAA,GAAA,mBAAW,EAAE;QAC3I,GAAG,KAAK;kBACR;IACF,GAAG,OAAO;IAEV,uEAAuE;IACvE,wGAAwG;IACxG,IAAI,cAAc,CAAA,GAAA,yCAAgB,EAAE;IACpC,IAAI,eAAe,CAAC,MAAM,WAAW,EACnC,iBAAiB,EAAE,GAAG;IAGxB,IAAI,kBAAkB,MAAM,eAAe,IAAK,CAAA,YAAY,YAAY,IAAG;IAE3E,qBACE,gCAAC,CAAA,GAAA,YAAI;QACF,GAAG,KAAK;QACT,KAAK;QACL,aAAY;QACZ,aAAa;QACb,YAAY;QACZ,kBAAkB;QAClB,mBAAmB;QACnB,iBAAiB;QACjB,WAAW;QACX,kBAAkB;QAClB,mBAAmB;QACnB,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAe,GAAG;qBAC/C,gCAAC,CAAA,GAAA,yCAAI;QACH,KAAK;QACL,YAAY;QACZ,YAAY;QACZ,SAAS;QACT,WAAW;QACX,iBAAiB;QACjB,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAe,GAAG;OACvC,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC,SAAS,kBAC3B,gCAAC,CAAA,GAAA,yCAAgB;YAChB,KAAK;YACL,SAAS;YACT,OAAO;YACP,YAAY;YACZ,YAAY;YACZ,YAAY;2BAEhB,gCAAC;QAAO,GAAG,UAAU;QAAE,KAAK;;AAIpC;AAEA;;;CAGC,GACD,MAAM,0DAAa,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC","sources":["packages/@react-spectrum/datepicker/src/DateField.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames} from '@react-spectrum/utils';\nimport {createCalendar} from '@internationalized/date';\nimport {DatePickerSegment} from './DatePickerSegment';\nimport datepickerStyles from './styles.css';\nimport {DateValue, SpectrumDateFieldProps} from '@react-types/datepicker';\nimport {Field} from '@react-spectrum/label';\nimport {FocusableRef} from '@react-types/shared';\nimport {Input} from './Input';\nimport React, {ReactElement, useRef} from 'react';\nimport {useDateField} from '@react-aria/datepicker';\nimport {useDateFieldState} from '@react-stately/datepicker';\nimport {useFocusManagerRef, useFormatHelpText} from './utils';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction DateField<T extends DateValue>(props: SpectrumDateFieldProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n let {\n autoFocus,\n isDisabled,\n isReadOnly,\n isRequired,\n isQuiet\n } = props;\n\n let domRef = useFocusManagerRef(ref);\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...props,\n locale,\n createCalendar\n });\n\n let fieldRef = useRef(null);\n let inputRef = useRef(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, isInvalid, validationErrors, validationDetails} = useDateField({\n ...props,\n inputRef\n }, state, fieldRef);\n\n // Note: this description is intentionally not passed to useDatePicker.\n // The format help text is unnecessary for screen reader users because each segment already has a label.\n let description = useFormatHelpText(props);\n if (description && !props.description) {\n descriptionProps.id = null;\n }\n\n let validationState = state.validationState || (isInvalid ? 'invalid' : null);\n\n return (\n <Field\n {...props}\n ref={domRef}\n elementType=\"span\"\n description={description}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n validationState={validationState}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n wrapperClassName={classNames(datepickerStyles, 'react-spectrum-Datepicker-fieldWrapper')}>\n <Input\n ref={fieldRef}\n fieldProps={fieldProps}\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n autoFocus={autoFocus}\n validationState={validationState}\n className={classNames(datepickerStyles, 'react-spectrum-DateField')}>\n {state.segments.map((segment, i) =>\n (<DatePickerSegment\n key={i}\n segment={segment}\n state={state}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isRequired={isRequired} />)\n )}\n <input {...inputProps} ref={inputRef} />\n </Input>\n </Field>\n );\n}\n\n/**\n * DateFields allow users to enter and edit date and time values using a keyboard.\n * Each part of a date value is displayed in an individually editable segment.\n */\nconst _DateField = React.forwardRef(DateField) as <T extends DateValue>(props: SpectrumDateFieldProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_DateField as DateField};\n"],"names":[],"version":3,"file":"DateField.module.js.map"}
@@ -0,0 +1,198 @@
1
+ var $bd22dc8dad9522bc$exports = require("./DatePickerField.main.js");
2
+ require("./styles.36ea4632.css");
3
+ var $91c3db8c6a21ca71$exports = require("./styles_css.main.js");
4
+ var $c3ebc4931d9b9977$exports = require("./Input.main.js");
5
+ var $0045b32a117743a7$exports = require("./intlStrings.main.js");
6
+ require("./vars.3692148b.css");
7
+ require("./textfield_vars_css.main.js");
8
+ require("./vars.ccbd2e3f.css");
9
+ var $2f86633ce5b04f1e$exports = require("./inputgroup_vars_css.main.js");
10
+ var $740ff83729a8f317$exports = require("./TimeField.main.js");
11
+ var $4d2e419f522adb48$exports = require("./utils.main.js");
12
+ var $2ni54$reactspectrumcalendar = require("@react-spectrum/calendar");
13
+ var $2ni54$spectrumiconsworkflowCalendar = require("@spectrum-icons/workflow/Calendar");
14
+ var $2ni54$reactspectrumutils = require("@react-spectrum/utils");
15
+ var $2ni54$reactspectrumview = require("@react-spectrum/view");
16
+ var $2ni54$reactspectrumdialog = require("@react-spectrum/dialog");
17
+ var $2ni54$reactspectrumlabel = require("@react-spectrum/label");
18
+ var $2ni54$reactspectrumbutton = require("@react-spectrum/button");
19
+ var $2ni54$reactariautils = require("@react-aria/utils");
20
+ var $2ni54$react = require("react");
21
+ var $2ni54$reactariadatepicker = require("@react-aria/datepicker");
22
+ var $2ni54$reactstatelydatepicker = require("@react-stately/datepicker");
23
+ var $2ni54$reactariafocus = require("@react-aria/focus");
24
+ var $2ni54$reactspectrumform = require("@react-spectrum/form");
25
+ var $2ni54$reactariainteractions = require("@react-aria/interactions");
26
+ var $2ni54$reactariai18n = require("@react-aria/i18n");
27
+ var $2ni54$reactspectrumprovider = require("@react-spectrum/provider");
28
+
29
+
30
+ function $parcel$interopDefault(a) {
31
+ return a && a.__esModule ? a.default : a;
32
+ }
33
+
34
+ function $parcel$export(e, n, v, s) {
35
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
36
+ }
37
+
38
+ $parcel$export(module.exports, "DatePicker", () => $5c1ddf85d7c27889$export$5109c6dd95d8fb00);
39
+ /*
40
+ * Copyright 2020 Adobe. All rights reserved.
41
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
42
+ * you may not use this file except in compliance with the License. You may obtain a copy
43
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
44
+ *
45
+ * Unless required by applicable law or agreed to in writing, software distributed under
46
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
47
+ * OF ANY KIND, either express or implied. See the License for the specific language
48
+ * governing permissions and limitations under the License.
49
+ */
50
+
51
+
52
+
53
+
54
+
55
+
56
+
57
+
58
+
59
+
60
+
61
+
62
+
63
+
64
+
65
+
66
+
67
+
68
+
69
+
70
+
71
+
72
+
73
+ function $5c1ddf85d7c27889$var$DatePicker(props, ref) {
74
+ props = (0, $2ni54$reactspectrumprovider.useProviderProps)(props);
75
+ props = (0, $2ni54$reactspectrumform.useFormProps)(props);
76
+ let { autoFocus: autoFocus, isQuiet: isQuiet, isDisabled: isDisabled, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, pageBehavior: pageBehavior } = props;
77
+ let { hoverProps: hoverProps, isHovered: isHovered } = (0, $2ni54$reactariainteractions.useHover)({
78
+ isDisabled: isDisabled
79
+ });
80
+ let targetRef = (0, $2ni54$react.useRef)();
81
+ let state = (0, $2ni54$reactstatelydatepicker.useDatePickerState)({
82
+ ...props,
83
+ shouldCloseOnSelect: ()=>!state.hasTime
84
+ });
85
+ let { groupProps: groupProps, labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, buttonProps: buttonProps, dialogProps: dialogProps, calendarProps: calendarProps, isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = (0, $2ni54$reactariadatepicker.useDatePicker)(props, state, targetRef);
86
+ let { isOpen: isOpen, setOpen: setOpen } = state;
87
+ let { direction: direction } = (0, $2ni54$reactariai18n.useLocale)();
88
+ let domRef = (0, $4d2e419f522adb48$exports.useFocusManagerRef)(ref);
89
+ let stringFormatter = (0, $2ni54$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($0045b32a117743a7$exports))), "@react-spectrum/datepicker");
90
+ let { isFocused: isFocused, isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $2ni54$reactariafocus.useFocusRing)({
91
+ within: true,
92
+ isTextInput: true,
93
+ autoFocus: autoFocus
94
+ });
95
+ let { isFocused: isFocusedButton, focusProps: focusPropsButton } = (0, $2ni54$reactariafocus.useFocusRing)({
96
+ within: false,
97
+ isTextInput: false,
98
+ autoFocus: autoFocus
99
+ });
100
+ let className = (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2f86633ce5b04f1e$exports))), "spectrum-InputGroup", {
101
+ "spectrum-InputGroup--quiet": isQuiet,
102
+ "spectrum-InputGroup--invalid": isInvalid && !isDisabled,
103
+ "is-disabled": isDisabled,
104
+ "is-hovered": isHovered,
105
+ "is-focused": isFocused,
106
+ "focus-ring": isFocusVisible && !isFocusedButton
107
+ });
108
+ let fieldClassName = (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2f86633ce5b04f1e$exports))), "spectrum-InputGroup-input", {
109
+ "is-disabled": isDisabled,
110
+ "is-invalid": isInvalid && !isDisabled
111
+ });
112
+ // Note: this description is intentionally not passed to useDatePicker.
113
+ // The format help text is unnecessary for screen reader users because each segment already has a label.
114
+ let description = (0, $4d2e419f522adb48$exports.useFormatHelpText)(props);
115
+ if (description && !props.description) descriptionProps.id = null;
116
+ let placeholder = placeholderValue;
117
+ let timePlaceholder = placeholder && "hour" in placeholder ? placeholder : null;
118
+ let timeMinValue = props.minValue && "hour" in props.minValue ? props.minValue : null;
119
+ let timeMaxValue = props.maxValue && "hour" in props.maxValue ? props.maxValue : null;
120
+ let timeGranularity = state.granularity === "hour" || state.granularity === "minute" || state.granularity === "second" ? state.granularity : null;
121
+ let showTimeField = !!timeGranularity;
122
+ let visibleMonths = (0, $4d2e419f522adb48$exports.useVisibleMonths)(maxVisibleMonths);
123
+ let validationState = state.validationState || (isInvalid ? "invalid" : null);
124
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $2ni54$reactspectrumlabel.Field), {
125
+ ...props,
126
+ ref: domRef,
127
+ elementType: "span",
128
+ description: description,
129
+ labelProps: labelProps,
130
+ descriptionProps: descriptionProps,
131
+ errorMessageProps: errorMessageProps,
132
+ validationState: validationState,
133
+ isInvalid: isInvalid,
134
+ validationErrors: validationErrors,
135
+ validationDetails: validationDetails,
136
+ wrapperClassName: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-Datepicker-fieldWrapper")
137
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement("div", {
138
+ ...(0, $2ni54$reactariautils.mergeProps)(groupProps, hoverProps, focusProps),
139
+ className: className,
140
+ ref: targetRef
141
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $c3ebc4931d9b9977$exports.Input), {
142
+ isDisabled: isDisabled,
143
+ isQuiet: isQuiet,
144
+ validationState: validationState,
145
+ className: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2f86633ce5b04f1e$exports))), "spectrum-InputGroup-field"),
146
+ inputClassName: fieldClassName,
147
+ disableFocusRing: true
148
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $bd22dc8dad9522bc$exports.DatePickerField), {
149
+ ...fieldProps,
150
+ "data-testid": "date-field",
151
+ isQuiet: isQuiet
152
+ })), /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $2ni54$reactspectrumdialog.DialogTrigger), {
153
+ type: "popover",
154
+ mobileType: "tray",
155
+ placement: direction === "rtl" ? "bottom right" : "bottom left",
156
+ targetRef: targetRef,
157
+ hideArrow: true,
158
+ isOpen: isOpen,
159
+ onOpenChange: setOpen,
160
+ shouldFlip: props.shouldFlip
161
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $2ni54$reactspectrumbutton.FieldButton), {
162
+ ...(0, $2ni54$reactariautils.mergeProps)(buttonProps, focusPropsButton),
163
+ UNSAFE_className: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2f86633ce5b04f1e$exports))), "spectrum-FieldButton"),
164
+ isQuiet: isQuiet,
165
+ validationState: validationState
166
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, ($parcel$interopDefault($2ni54$spectrumiconsworkflowCalendar))), null)), /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $2ni54$reactspectrumdialog.Dialog), {
167
+ UNSAFE_className: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-Datepicker-dialog"),
168
+ ...dialogProps
169
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $2ni54$reactspectrumview.Content), null, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement("div", {
170
+ className: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-Datepicker-dialogContent")
171
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $2ni54$reactspectrumcalendar.Calendar), {
172
+ ...calendarProps,
173
+ visibleMonths: visibleMonths,
174
+ pageBehavior: pageBehavior,
175
+ UNSAFE_className: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-Datepicker-calendar", {
176
+ "is-invalid": isInvalid
177
+ })
178
+ }), showTimeField && /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement("div", {
179
+ className: (0, $2ni54$reactspectrumutils.classNames)((0, ($parcel$interopDefault($91c3db8c6a21ca71$exports))), "react-spectrum-Datepicker-timeFields")
180
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).createElement((0, $740ff83729a8f317$exports.TimeField), {
181
+ label: stringFormatter.format("time"),
182
+ value: state.timeValue,
183
+ onChange: state.setTimeValue,
184
+ placeholderValue: timePlaceholder,
185
+ granularity: timeGranularity,
186
+ minValue: timeMinValue,
187
+ maxValue: timeMaxValue,
188
+ hourCycle: props.hourCycle,
189
+ hideTimeZone: props.hideTimeZone,
190
+ marginTop: "size-100"
191
+ }))))))));
192
+ }
193
+ /**
194
+ * DatePickers combine a DateField and a Calendar popover to allow users to enter or select a date and time value.
195
+ */ const $5c1ddf85d7c27889$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, ($parcel$interopDefault($2ni54$react))).forwardRef($5c1ddf85d7c27889$var$DatePicker);
196
+
197
+
198
+ //# sourceMappingURL=DatePicker.main.js.map
@@ -0,0 +1 @@
1
+ {"mappings":"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","sources":["packages/@react-spectrum/datepicker/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Calendar} from '@react-spectrum/calendar';\nimport CalendarIcon from '@spectrum-icons/workflow/Calendar';\nimport {classNames} from '@react-spectrum/utils';\nimport {Content} from '@react-spectrum/view';\nimport {DatePickerField} from './DatePickerField';\nimport datepickerStyles from './styles.css';\nimport {DateValue, SpectrumDatePickerProps} from '@react-types/datepicker';\nimport {Dialog, DialogTrigger} from '@react-spectrum/dialog';\nimport {Field} from '@react-spectrum/label';\nimport {FieldButton} from '@react-spectrum/button';\nimport {FocusableRef} from '@react-types/shared';\nimport {Input} from './Input';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {ReactElement, useRef} from 'react';\nimport '@adobe/spectrum-css-temp/components/textfield/vars.css'; // HACK: must be included BEFORE inputgroup\nimport styles from '@adobe/spectrum-css-temp/components/inputgroup/vars.css';\nimport {TimeField} from './TimeField';\nimport {useDatePicker} from '@react-aria/datepicker';\nimport {useDatePickerState} from '@react-stately/datepicker';\nimport {useFocusManagerRef, useFormatHelpText, useVisibleMonths} from './utils';\nimport {useFocusRing} from '@react-aria/focus';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction DatePicker<T extends DateValue>(props: SpectrumDatePickerProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n let {\n autoFocus,\n isQuiet,\n isDisabled,\n placeholderValue,\n maxVisibleMonths = 1,\n pageBehavior\n } = props;\n let {hoverProps, isHovered} = useHover({isDisabled});\n let targetRef = useRef<HTMLDivElement>();\n let state = useDatePickerState({\n ...props,\n shouldCloseOnSelect: () => !state.hasTime\n });\n let {groupProps, labelProps, fieldProps, descriptionProps, errorMessageProps, buttonProps, dialogProps, calendarProps, isInvalid, validationErrors, validationDetails} = useDatePicker(props, state, targetRef);\n let {isOpen, setOpen} = state;\n let {direction} = useLocale();\n let domRef = useFocusManagerRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/datepicker');\n\n let {isFocused, isFocusVisible, focusProps} = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus\n });\n\n let {isFocused: isFocusedButton, focusProps: focusPropsButton} = useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus\n });\n\n let className = classNames(\n styles,\n 'spectrum-InputGroup',\n {\n 'spectrum-InputGroup--quiet': isQuiet,\n 'spectrum-InputGroup--invalid': isInvalid && !isDisabled,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered,\n 'is-focused': isFocused,\n 'focus-ring': isFocusVisible && !isFocusedButton\n }\n );\n\n let fieldClassName = classNames(\n styles,\n 'spectrum-InputGroup-input',\n {\n 'is-disabled': isDisabled,\n 'is-invalid': isInvalid && !isDisabled\n }\n );\n\n // Note: this description is intentionally not passed to useDatePicker.\n // The format help text is unnecessary for screen reader users because each segment already has a label.\n let description = useFormatHelpText(props);\n if (description && !props.description) {\n descriptionProps.id = null;\n }\n\n let placeholder: DateValue = placeholderValue;\n let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : null;\n let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : null;\n let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : null;\n let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : null;\n let showTimeField = !!timeGranularity;\n\n let visibleMonths = useVisibleMonths(maxVisibleMonths);\n let validationState = state.validationState || (isInvalid ? 'invalid' : null);\n\n return (\n <Field\n {...props}\n ref={domRef}\n elementType=\"span\"\n description={description}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n validationState={validationState}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n wrapperClassName={classNames(datepickerStyles, 'react-spectrum-Datepicker-fieldWrapper')}>\n <div\n {...mergeProps(groupProps, hoverProps, focusProps)}\n className={className}\n ref={targetRef}>\n <Input\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n validationState={validationState}\n className={classNames(styles, 'spectrum-InputGroup-field')}\n inputClassName={fieldClassName}\n disableFocusRing>\n <DatePickerField\n {...fieldProps}\n data-testid=\"date-field\"\n isQuiet={isQuiet} />\n </Input>\n <DialogTrigger\n type=\"popover\"\n mobileType=\"tray\"\n placement={direction === 'rtl' ? 'bottom right' : 'bottom left'}\n targetRef={targetRef}\n hideArrow\n isOpen={isOpen}\n onOpenChange={setOpen}\n shouldFlip={props.shouldFlip}>\n <FieldButton\n {...mergeProps(buttonProps, focusPropsButton)}\n UNSAFE_className={classNames(styles, 'spectrum-FieldButton')}\n isQuiet={isQuiet}\n validationState={validationState}>\n <CalendarIcon />\n </FieldButton>\n <Dialog UNSAFE_className={classNames(datepickerStyles, 'react-spectrum-Datepicker-dialog')} {...dialogProps}>\n <Content>\n <div className={classNames(datepickerStyles, 'react-spectrum-Datepicker-dialogContent')}>\n <Calendar\n {...calendarProps}\n visibleMonths={visibleMonths}\n pageBehavior={pageBehavior}\n UNSAFE_className={classNames(datepickerStyles, 'react-spectrum-Datepicker-calendar', {'is-invalid': isInvalid})} />\n {showTimeField &&\n <div className={classNames(datepickerStyles, 'react-spectrum-Datepicker-timeFields')}>\n <TimeField\n label={stringFormatter.format('time')}\n value={state.timeValue}\n onChange={state.setTimeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n marginTop=\"size-100\" />\n </div>\n }\n </div>\n </Content>\n </Dialog>\n </DialogTrigger>\n </div>\n </Field>\n );\n}\n\n/**\n * DatePickers combine a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nconst _DatePicker = React.forwardRef(DatePicker) as <T extends DateValue>(props: SpectrumDatePickerProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_DatePicker as DatePicker};\n"],"names":[],"version":3,"file":"DatePicker.main.js.map"}