@react-aria/datepicker 3.7.0 → 3.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/import.mjs +18 -18
- package/dist/main.js +18 -18
- package/dist/main.js.map +1 -1
- package/dist/module.js +18 -18
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +4 -4
- package/dist/types.d.ts.map +1 -1
- package/package.json +15 -15
- package/src/useDateField.ts +4 -4
- package/src/useDatePicker.ts +4 -4
- package/src/useDateRangePicker.ts +4 -4
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;AC0BA,sCAAsC,CAAC,SAAS,SAAS,CAAE,SAAQ,IAAI,CAAC,mBAAuB,CAAC,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,GAAG,kBAAkB,CAAC;IACtL,mEAAmE;IACnE,QAAQ,CAAC,EAAE,UAAU,gBAAgB,CAAC,CAAA;CACvC;AAED;IACG,2DAA2D;IAC5D,UAAU,EAAE,aAAa,CAAC;IACzB,4CAA4C;IAC7C,UAAU,EAAE,
|
|
1
|
+
{"mappings":";;;;;;;AC0BA,sCAAsC,CAAC,SAAS,SAAS,CAAE,SAAQ,IAAI,CAAC,mBAAuB,CAAC,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,GAAG,kBAAkB,CAAC;IACtL,mEAAmE;IACnE,QAAQ,CAAC,EAAE,UAAU,gBAAgB,CAAC,CAAA;CACvC;AAED;IACG,2DAA2D;IAC5D,UAAU,EAAE,aAAa,CAAC;IACzB,4CAA4C;IAC7C,UAAU,EAAE,kBAAkB,CAAC;IAC/B,mEAAmE;IACnE,UAAU,EAAE,oBAAoB,gBAAgB,CAAC,CAAC;IAClD,iDAAiD;IACjD,gBAAgB,EAAE,aAAa,CAAC;IAChC,mDAAmD;IACnD,iBAAiB,EAAE,aAAa,CAAA;CACjC;AAiBD;;;;GAIG;AACH,6BAA6B,CAAC,SAAS,SAAS,EAAE,KAAK,EAAE,qBAAqB,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,OAAO,CAAC,GAAG,aAAa,CAkG/I;AAED,+BAAsC,CAAC,SAAS,SAAS,CAAE,SAAQ,mBAAmB,CAAC,CAAC;IACtF,mEAAmE;IACnE,QAAQ,CAAC,EAAE,UAAU,gBAAgB,CAAC,CAAA;CACvC;AAED;;;;GAIG;AACH,6BAA6B,CAAC,SAAS,SAAS,EAAE,KAAK,EAAE,qBAAqB,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,OAAO,CAAC,GAAG,aAAa,CAI/I;ACrJD;IACE,iEAAiE;IACjE,UAAU,EAAE,aAAa,CAAC;IAC1B,2EAA2E;IAC3E,UAAU,EAAE,kBAAkB,CAAC;IAC/B,gCAAgC;IAChC,UAAU,EAAE,oBAAoB,SAAS,CAAC,CAAC;IAC3C,4CAA4C;IAC5C,WAAW,EAAE,eAAe,CAAC;IAC7B,iDAAiD;IACjD,gBAAgB,EAAE,aAAa,CAAC;IAChC,mDAAmD;IACnD,iBAAiB,EAAE,aAAa,CAAC;IACjC,oCAAoC;IACpC,WAAW,EAAE,eAAe,CAAC;IAC7B,wDAAwD;IACxD,aAAa,EAAE,cAAc,SAAS,CAAC,CAAA;CACxC;AAED;;;GAGG;AACH,8BAA8B,CAAC,SAAS,SAAS,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,GAAG,EAAE,UAAU,OAAO,CAAC,GAAG,cAAc,CAiHjJ;ACnJD,aAAa,KAAK,uBAAuB,CAAC;AAC1C;IACE,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM,CAAA;CACzB;AAED,eAAe;AACf,mCAAmC,YAAY,CAY9C;ACbD;IACE,qCAAqC;IACrC,YAAY,EAAE,aAAa,CAAA;CAC5B;AAED;;;;GAIG;AACH,+BAA+B,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,WAAW,CAAC,GAAG,eAAe,CAwWxH;AC5WD;IACE,uEAAuE;IACvE,UAAU,EAAE,aAAa,CAAC;IAC1B,4EAA4E;IAC5E,UAAU,EAAE,kBAAkB,CAAC;IAC/B,sCAAsC;IACtC,eAAe,EAAE,oBAAoB,SAAS,CAAC,CAAC;IAChD,oCAAoC;IACpC,aAAa,EAAE,oBAAoB,SAAS,CAAC,CAAC;IAC9C,4CAA4C;IAC5C,WAAW,EAAE,eAAe,CAAC;IAC7B,iDAAiD;IACjD,gBAAgB,EAAE,aAAa,CAAC;IAChC,mDAAmD;IACnD,iBAAiB,EAAE,aAAa,CAAC;IACjC,oCAAoC;IACpC,WAAW,EAAE,eAAe,CAAC;IAC7B,8DAA8D;IAC9D,aAAa,EAAE,mBAAmB,SAAS,CAAC,CAAA;CAC7C;AAED;;;;GAIG;AACH,mCAAmC,CAAC,SAAS,SAAS,EAAE,KAAK,EAAE,yBAAyB,CAAC,CAAC,EAAE,KAAK,EAAE,oBAAoB,EAAE,GAAG,EAAE,UAAU,OAAO,CAAC,GAAG,mBAAmB,CA0IrK;AC/KD,YAAY,EAAC,kBAAkB,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAC,MAAM,yBAAyB,CAAC;AAKhJ,YAAY,EAAC,kBAAkB,EAAC,MAAM,yBAAyB,CAAC","sources":["packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/useDatePickerGroup.ts","packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/useDateField.ts","packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/useDatePicker.ts","packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/useDisplayNames.ts","packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/useDateSegment.ts","packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/useDateRangePicker.ts","packages/@react-aria/datepicker/src/packages/@react-aria/datepicker/src/index.ts","packages/@react-aria/datepicker/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\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\nexport {useDatePicker} from './useDatePicker';\nexport {useDateSegment} from './useDateSegment';\nexport {useDateField, useTimeField} from './useDateField';\nexport {useDateRangePicker} from './useDateRangePicker';\nexport {useDisplayNames} from './useDisplayNames';\n\nexport type {AriaDateFieldProps, AriaDatePickerProps, AriaDateRangePickerProps, DateRange, DateValue, TimeValue} from '@react-types/datepicker';\nexport type {AriaDateFieldOptions, DateFieldAria} from './useDateField';\nexport type {DatePickerAria} from './useDatePicker';\nexport type {DateRangePickerAria} from './useDateRangePicker';\nexport type {DateSegmentAria} from './useDateSegment';\nexport type {AriaTimeFieldProps} from '@react-types/datepicker';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/datepicker",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.8.0",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -23,20 +23,20 @@
|
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
25
|
"@internationalized/date": "^3.5.0",
|
|
26
|
-
"@internationalized/number": "^3.
|
|
26
|
+
"@internationalized/number": "^3.3.0",
|
|
27
27
|
"@internationalized/string": "^3.1.1",
|
|
28
|
-
"@react-aria/focus": "^3.14.
|
|
29
|
-
"@react-aria/i18n": "^3.8.
|
|
30
|
-
"@react-aria/interactions": "^3.
|
|
31
|
-
"@react-aria/label": "^3.7.
|
|
32
|
-
"@react-aria/spinbutton": "^3.5.
|
|
33
|
-
"@react-aria/utils": "^3.
|
|
34
|
-
"@react-stately/datepicker": "^3.
|
|
35
|
-
"@react-types/button": "^3.
|
|
36
|
-
"@react-types/calendar": "^3.4.
|
|
37
|
-
"@react-types/datepicker": "^3.6.
|
|
38
|
-
"@react-types/dialog": "^3.5.
|
|
39
|
-
"@react-types/shared": "^3.
|
|
28
|
+
"@react-aria/focus": "^3.14.2",
|
|
29
|
+
"@react-aria/i18n": "^3.8.3",
|
|
30
|
+
"@react-aria/interactions": "^3.19.0",
|
|
31
|
+
"@react-aria/label": "^3.7.1",
|
|
32
|
+
"@react-aria/spinbutton": "^3.5.3",
|
|
33
|
+
"@react-aria/utils": "^3.21.0",
|
|
34
|
+
"@react-stately/datepicker": "^3.8.0",
|
|
35
|
+
"@react-types/button": "^3.9.0",
|
|
36
|
+
"@react-types/calendar": "^3.4.1",
|
|
37
|
+
"@react-types/datepicker": "^3.6.1",
|
|
38
|
+
"@react-types/dialog": "^3.5.6",
|
|
39
|
+
"@react-types/shared": "^3.21.0",
|
|
40
40
|
"@swc/helpers": "^0.5.0"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"publishConfig": {
|
|
47
47
|
"access": "public"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "4122e44d1991c90507d630d35ed297f89db435d3"
|
|
50
50
|
}
|
package/src/useDateField.ts
CHANGED
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
import {AriaDateFieldProps as AriaDateFieldPropsBase, AriaTimeFieldProps, DateValue, TimeValue} from '@react-types/datepicker';
|
|
14
14
|
import {createFocusManager, FocusManager} from '@react-aria/focus';
|
|
15
15
|
import {DateFieldState, TimeFieldState} from '@react-stately/datepicker';
|
|
16
|
-
import {DOMAttributes, KeyboardEvent} from '@react-types/shared';
|
|
16
|
+
import {DOMAttributes, GroupDOMAttributes, KeyboardEvent} from '@react-types/shared';
|
|
17
17
|
import {filterDOMProps, mergeProps, useDescription, useFormReset} from '@react-aria/utils';
|
|
18
18
|
import {FocusEvent, InputHTMLAttributes, RefObject, useEffect, useMemo, useRef} from 'react';
|
|
19
19
|
// @ts-ignore
|
|
@@ -33,7 +33,7 @@ export interface DateFieldAria {
|
|
|
33
33
|
/** Props for the field's visible label element, if any. */
|
|
34
34
|
labelProps: DOMAttributes,
|
|
35
35
|
/** Props for the field grouping element. */
|
|
36
|
-
fieldProps:
|
|
36
|
+
fieldProps: GroupDOMAttributes,
|
|
37
37
|
/** Props for the hidden input element for HTML form submission. */
|
|
38
38
|
inputProps: InputHTMLAttributes<HTMLInputElement>,
|
|
39
39
|
/** Props for the description element, if any. */
|
|
@@ -110,14 +110,14 @@ export function useDateField<T extends DateValue>(props: AriaDateFieldOptions<T>
|
|
|
110
110
|
// rather than role="group". Since the date picker/date range picker already has a role="group"
|
|
111
111
|
// with a label and description, and the segments are already labeled by this as well, this
|
|
112
112
|
// avoids very verbose duplicate announcements.
|
|
113
|
-
let fieldDOMProps:
|
|
113
|
+
let fieldDOMProps: GroupDOMAttributes;
|
|
114
114
|
if (props[roleSymbol] === 'presentation') {
|
|
115
115
|
fieldDOMProps = {
|
|
116
116
|
role: 'presentation'
|
|
117
117
|
};
|
|
118
118
|
} else {
|
|
119
119
|
fieldDOMProps = mergeProps(fieldProps, {
|
|
120
|
-
role: 'group',
|
|
120
|
+
role: 'group' as const,
|
|
121
121
|
'aria-disabled': props.isDisabled || undefined,
|
|
122
122
|
'aria-describedby': describedBy
|
|
123
123
|
});
|
package/src/useDatePicker.ts
CHANGED
|
@@ -16,7 +16,7 @@ import {AriaDialogProps} from '@react-types/dialog';
|
|
|
16
16
|
import {CalendarProps} from '@react-types/calendar';
|
|
17
17
|
import {createFocusManager} from '@react-aria/focus';
|
|
18
18
|
import {DatePickerState} from '@react-stately/datepicker';
|
|
19
|
-
import {DOMAttributes, KeyboardEvent} from '@react-types/shared';
|
|
19
|
+
import {DOMAttributes, GroupDOMAttributes, KeyboardEvent} from '@react-types/shared';
|
|
20
20
|
import {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';
|
|
21
21
|
// @ts-ignore
|
|
22
22
|
import intlMessages from '../intl/*.json';
|
|
@@ -31,7 +31,7 @@ export interface DatePickerAria {
|
|
|
31
31
|
/** Props for the date picker's visible label element, if any. */
|
|
32
32
|
labelProps: DOMAttributes,
|
|
33
33
|
/** Props for the grouping element containing the date field and button. */
|
|
34
|
-
groupProps:
|
|
34
|
+
groupProps: GroupDOMAttributes,
|
|
35
35
|
/** Props for the date field. */
|
|
36
36
|
fieldProps: AriaDatePickerProps<DateValue>,
|
|
37
37
|
/** Props for the popover trigger button. */
|
|
@@ -83,7 +83,7 @@ export function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>
|
|
|
83
83
|
|
|
84
84
|
return {
|
|
85
85
|
groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
|
|
86
|
-
role: 'group',
|
|
86
|
+
role: 'group' as const,
|
|
87
87
|
'aria-disabled': props.isDisabled || null,
|
|
88
88
|
'aria-labelledby': labelledBy,
|
|
89
89
|
'aria-describedby': ariaDescribedBy,
|
|
@@ -142,7 +142,7 @@ export function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>
|
|
|
142
142
|
'aria-label': stringFormatter.format('calendar'),
|
|
143
143
|
'aria-labelledby': `${buttonId} ${labelledBy}`,
|
|
144
144
|
'aria-describedby': ariaDescribedBy,
|
|
145
|
-
'aria-expanded': state.isOpen
|
|
145
|
+
'aria-expanded': state.isOpen,
|
|
146
146
|
onPress: () => state.setOpen(true)
|
|
147
147
|
},
|
|
148
148
|
dialogProps: {
|
|
@@ -15,7 +15,7 @@ import {AriaDatePickerProps, AriaDateRangePickerProps, DateValue} from '@react-t
|
|
|
15
15
|
import {AriaDialogProps} from '@react-types/dialog';
|
|
16
16
|
import {createFocusManager} from '@react-aria/focus';
|
|
17
17
|
import {DateRangePickerState} from '@react-stately/datepicker';
|
|
18
|
-
import {DOMAttributes, KeyboardEvent} from '@react-types/shared';
|
|
18
|
+
import {DOMAttributes, GroupDOMAttributes, KeyboardEvent} from '@react-types/shared';
|
|
19
19
|
import {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';
|
|
20
20
|
import {focusManagerSymbol, roleSymbol} from './useDateField';
|
|
21
21
|
// @ts-ignore
|
|
@@ -31,7 +31,7 @@ export interface DateRangePickerAria {
|
|
|
31
31
|
/** Props for the date range picker's visible label element, if any. */
|
|
32
32
|
labelProps: DOMAttributes,
|
|
33
33
|
/** Props for the grouping element containing the date fields and button. */
|
|
34
|
-
groupProps:
|
|
34
|
+
groupProps: GroupDOMAttributes,
|
|
35
35
|
/** Props for the start date field. */
|
|
36
36
|
startFieldProps: AriaDatePickerProps<DateValue>,
|
|
37
37
|
/** Props for the end date field. */
|
|
@@ -117,7 +117,7 @@ export function useDateRangePicker<T extends DateValue>(props: AriaDateRangePick
|
|
|
117
117
|
|
|
118
118
|
return {
|
|
119
119
|
groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
|
|
120
|
-
role: 'group',
|
|
120
|
+
role: 'group' as const,
|
|
121
121
|
'aria-disabled': props.isDisabled || null,
|
|
122
122
|
'aria-describedby': ariaDescribedBy,
|
|
123
123
|
onKeyDown(e: KeyboardEvent) {
|
|
@@ -152,7 +152,7 @@ export function useDateRangePicker<T extends DateValue>(props: AriaDateRangePick
|
|
|
152
152
|
'aria-label': stringFormatter.format('calendar'),
|
|
153
153
|
'aria-labelledby': `${buttonId} ${labelledBy}`,
|
|
154
154
|
'aria-describedby': ariaDescribedBy,
|
|
155
|
-
'aria-expanded': state.isOpen
|
|
155
|
+
'aria-expanded': state.isOpen,
|
|
156
156
|
onPress: () => state.setOpen(true)
|
|
157
157
|
},
|
|
158
158
|
dialogProps: {
|