@react-aria/datepicker 3.15.3 → 3.16.1
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/types.d.ts.map +1 -1
- package/dist/useDatePicker.main.js +1 -1
- package/dist/useDatePicker.main.js.map +1 -1
- package/dist/useDatePicker.mjs +2 -2
- package/dist/useDatePicker.module.js +2 -2
- package/dist/useDatePicker.module.js.map +1 -1
- package/dist/useDatePickerGroup.main.js +4 -5
- package/dist/useDatePickerGroup.main.js.map +1 -1
- package/dist/useDatePickerGroup.mjs +5 -6
- package/dist/useDatePickerGroup.module.js +5 -6
- package/dist/useDatePickerGroup.module.js.map +1 -1
- package/dist/useDateRangePicker.main.js +1 -1
- package/dist/useDateRangePicker.main.js.map +1 -1
- package/dist/useDateRangePicker.mjs +2 -2
- package/dist/useDateRangePicker.module.js +2 -2
- package/dist/useDateRangePicker.module.js.map +1 -1
- package/dist/useDateSegment.main.js +11 -24
- package/dist/useDateSegment.main.js.map +1 -1
- package/dist/useDateSegment.mjs +12 -25
- package/dist/useDateSegment.module.js +12 -25
- package/dist/useDateSegment.module.js.map +1 -1
- package/package.json +17 -17
- package/src/useDatePicker.ts +2 -2
- package/src/useDatePickerGroup.ts +5 -5
- package/src/useDateRangePicker.ts +2 -2
- package/src/useDateSegment.ts +11 -39
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;AC2BA,sCAAsC,CAAC,SAAS,SAAS,CAAE,SAAQ,IAAI,CAAC,mBAAuB,CAAC,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,GAAG,kBAAkB,GAAG,UAAU,CAAC;IACnM,mEAAmE;IACnE,QAAQ,CAAC,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,CAAA;CAC9C;AAED,8BAA+B,SAAQ,gBAAgB;IACpD,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,GAAG,IAAI,CAAC,GAAG,aAAa,CAmItJ;AAED,+BAAsC,CAAC,SAAS,SAAS,CAAE,SAAQ,mBAAmB,CAAC,CAAC;IACtF,mEAAmE;IACnE,QAAQ,CAAC,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,CAAA;CAC9C;AAED;;;;GAIG;AACH,6BAA6B,CAAC,SAAS,SAAS,EAAE,KAAK,EAAE,qBAAqB,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,OAAO,GAAG,IAAI,CAAC,GAAG,aAAa,CAItJ;ACtLD,+BAAgC,SAAQ,gBAAgB;IACtD,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,GAAG,IAAI,CAAC,GAAG,cAAc,CA0IxJ;AC7KD,aAAa,KAAK,uBAAuB,CAAC;AAC1C;IACE,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM,GAAG,SAAS,CAAA;CACrC;AAED,eAAe;AACf,mCAAmC,YAAY,CAY9C;ACbD;IACE,qCAAqC;IACrC,YAAY,EAAE,MAAM,cAAc,CAAC,cAAc,CAAC,CAAA;CACnD;AAED;;;;GAIG;AACH,+BAA+B,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,WAAW,GAAG,IAAI,CAAC,GAAG,eAAe,
|
|
1
|
+
{"mappings":"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","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"}
|
|
@@ -76,7 +76,7 @@ function $e90ae7c26a69c6b1$export$42df105a73306d51(props, state, ref) {
|
|
|
76
76
|
onBlurWithin: (e)=>{
|
|
77
77
|
// Ignore when focus moves into the popover.
|
|
78
78
|
let dialog = document.getElementById(dialogId);
|
|
79
|
-
if (!(
|
|
79
|
+
if (!(0, $bxHoL$reactariautils.nodeContains)(dialog, e.relatedTarget)) {
|
|
80
80
|
var _props_onBlur, _props_onFocusChange;
|
|
81
81
|
isFocused.current = false;
|
|
82
82
|
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {CalendarProps} from '@react-types/calendar';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DatePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {privateValidationStateProp} from '@react-stately/form';\nimport {roleSymbol} from './useDateField';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DatePickerAria extends ValidationResult {\n /** Props for the date picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date field and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the date field. */\n fieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the calendar within the popover dialog. */\n calendarProps: CalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>, state: DatePickerState, ref: RefObject<Element | null>): DatePickerAria {\n let buttonId = useId();\n let dialogId = useId();\n let fieldId = useId();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let date = state.formatValue(locale, {month: 'long'});\n let description = date ? stringFormatter.format('selectedDateDescription', {date}) : '';\n let descProps = useDescription(description);\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let domProps = filterDOMProps(props);\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!dialog?.contains(e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-labelledby': labelledBy,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n fieldProps: {\n ...fieldProps,\n id: fieldId,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n value: state.value,\n defaultValue: state.defaultValue,\n onChange: state.setValue,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n granularity: props.granularity,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior,\n // DatePicker owns the validation state for the date field.\n [privateValidationStateProp]: state,\n autoFocus: props.autoFocus,\n name: props.name,\n form: props.form\n },\n descriptionProps,\n errorMessageProps,\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n calendarProps: {\n autoFocus: true,\n value: state.dateValue,\n onChange: state.setDateValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n defaultFocusedValue: state.dateValue ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDatePicker.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {CalendarProps} from '@react-types/calendar';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DatePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, nodeContains, useDescription, useId} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {privateValidationStateProp} from '@react-stately/form';\nimport {roleSymbol} from './useDateField';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DatePickerAria extends ValidationResult {\n /** Props for the date picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date field and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the date field. */\n fieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the calendar within the popover dialog. */\n calendarProps: CalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>, state: DatePickerState, ref: RefObject<Element | null>): DatePickerAria {\n let buttonId = useId();\n let dialogId = useId();\n let fieldId = useId();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let date = state.formatValue(locale, {month: 'long'});\n let description = date ? stringFormatter.format('selectedDateDescription', {date}) : '';\n let descProps = useDescription(description);\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let domProps = filterDOMProps(props);\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!nodeContains(dialog, e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-labelledby': labelledBy,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n fieldProps: {\n ...fieldProps,\n id: fieldId,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n value: state.value,\n defaultValue: state.defaultValue,\n onChange: state.setValue,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n granularity: props.granularity,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior,\n // DatePicker owns the validation state for the date field.\n [privateValidationStateProp]: state,\n autoFocus: props.autoFocus,\n name: props.name,\n form: props.form\n },\n descriptionProps,\n errorMessageProps,\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n calendarProps: {\n autoFocus: true,\n value: state.dateValue,\n onChange: state.setDateValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n defaultFocusedValue: state.dateValue ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDatePicker.main.js.map"}
|
package/dist/useDatePicker.mjs
CHANGED
|
@@ -2,7 +2,7 @@ import $4lVjK$intlStringsmodulejs from "./intlStrings.mjs";
|
|
|
2
2
|
import {roleSymbol as $16f0b7bb276bc17e$export$300019f83c56d282} from "./useDateField.mjs";
|
|
3
3
|
import {useDatePickerGroup as $3dfb0f96be0d6a08$export$4a931266a3838b86} from "./useDatePickerGroup.mjs";
|
|
4
4
|
import {createFocusManager as $4lVjK$createFocusManager} from "@react-aria/focus";
|
|
5
|
-
import {useId as $4lVjK$useId, useDescription as $4lVjK$useDescription, filterDOMProps as $4lVjK$filterDOMProps, mergeProps as $4lVjK$mergeProps} from "@react-aria/utils";
|
|
5
|
+
import {useId as $4lVjK$useId, useDescription as $4lVjK$useDescription, filterDOMProps as $4lVjK$filterDOMProps, nodeContains as $4lVjK$nodeContains, mergeProps as $4lVjK$mergeProps} from "@react-aria/utils";
|
|
6
6
|
import {privateValidationStateProp as $4lVjK$privateValidationStateProp} from "@react-stately/form";
|
|
7
7
|
import {useField as $4lVjK$useField} from "@react-aria/label";
|
|
8
8
|
import {useFocusWithin as $4lVjK$useFocusWithin} from "@react-aria/interactions";
|
|
@@ -70,7 +70,7 @@ function $6057a3d2a53a12fd$export$42df105a73306d51(props, state, ref) {
|
|
|
70
70
|
onBlurWithin: (e)=>{
|
|
71
71
|
// Ignore when focus moves into the popover.
|
|
72
72
|
let dialog = document.getElementById(dialogId);
|
|
73
|
-
if (!(
|
|
73
|
+
if (!(0, $4lVjK$nodeContains)(dialog, e.relatedTarget)) {
|
|
74
74
|
var _props_onBlur, _props_onFocusChange;
|
|
75
75
|
isFocused.current = false;
|
|
76
76
|
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
@@ -2,7 +2,7 @@ import $4lVjK$intlStringsmodulejs from "./intlStrings.module.js";
|
|
|
2
2
|
import {roleSymbol as $16f0b7bb276bc17e$export$300019f83c56d282} from "./useDateField.module.js";
|
|
3
3
|
import {useDatePickerGroup as $3dfb0f96be0d6a08$export$4a931266a3838b86} from "./useDatePickerGroup.module.js";
|
|
4
4
|
import {createFocusManager as $4lVjK$createFocusManager} from "@react-aria/focus";
|
|
5
|
-
import {useId as $4lVjK$useId, useDescription as $4lVjK$useDescription, filterDOMProps as $4lVjK$filterDOMProps, mergeProps as $4lVjK$mergeProps} from "@react-aria/utils";
|
|
5
|
+
import {useId as $4lVjK$useId, useDescription as $4lVjK$useDescription, filterDOMProps as $4lVjK$filterDOMProps, nodeContains as $4lVjK$nodeContains, mergeProps as $4lVjK$mergeProps} from "@react-aria/utils";
|
|
6
6
|
import {privateValidationStateProp as $4lVjK$privateValidationStateProp} from "@react-stately/form";
|
|
7
7
|
import {useField as $4lVjK$useField} from "@react-aria/label";
|
|
8
8
|
import {useFocusWithin as $4lVjK$useFocusWithin} from "@react-aria/interactions";
|
|
@@ -70,7 +70,7 @@ function $6057a3d2a53a12fd$export$42df105a73306d51(props, state, ref) {
|
|
|
70
70
|
onBlurWithin: (e)=>{
|
|
71
71
|
// Ignore when focus moves into the popover.
|
|
72
72
|
let dialog = document.getElementById(dialogId);
|
|
73
|
-
if (!(
|
|
73
|
+
if (!(0, $4lVjK$nodeContains)(dialog, e.relatedTarget)) {
|
|
74
74
|
var _props_onBlur, _props_onFocusChange;
|
|
75
75
|
isFocused.current = false;
|
|
76
76
|
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {CalendarProps} from '@react-types/calendar';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DatePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {privateValidationStateProp} from '@react-stately/form';\nimport {roleSymbol} from './useDateField';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DatePickerAria extends ValidationResult {\n /** Props for the date picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date field and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the date field. */\n fieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the calendar within the popover dialog. */\n calendarProps: CalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>, state: DatePickerState, ref: RefObject<Element | null>): DatePickerAria {\n let buttonId = useId();\n let dialogId = useId();\n let fieldId = useId();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let date = state.formatValue(locale, {month: 'long'});\n let description = date ? stringFormatter.format('selectedDateDescription', {date}) : '';\n let descProps = useDescription(description);\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let domProps = filterDOMProps(props);\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!dialog?.contains(e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-labelledby': labelledBy,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n fieldProps: {\n ...fieldProps,\n id: fieldId,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n value: state.value,\n defaultValue: state.defaultValue,\n onChange: state.setValue,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n granularity: props.granularity,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior,\n // DatePicker owns the validation state for the date field.\n [privateValidationStateProp]: state,\n autoFocus: props.autoFocus,\n name: props.name,\n form: props.form\n },\n descriptionProps,\n errorMessageProps,\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n calendarProps: {\n autoFocus: true,\n value: state.dateValue,\n onChange: state.setDateValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n defaultFocusedValue: state.dateValue ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDatePicker.module.js.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA2CM,SAAS,0CAAmC,KAA6B,EAAE,KAAsB,EAAE,GAA8B;IACtI,IAAI,WAAW,CAAA,GAAA,YAAI;IACnB,IAAI,WAAW,CAAA,GAAA,YAAI;IACnB,IAAI,UAAU,CAAA,GAAA,YAAI;IAClB,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,oDAAW,GAAG;IAEhE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAC,GAAG,MAAM,iBAAiB;IAC9E,IAAI,cAAC,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAC3E,GAAG,KAAK;QACR,kBAAkB;mBAClB;QACA,cAAc,MAAM,YAAY,IAAI;IACtC;IAEA,IAAI,aAAa,CAAA,GAAA,yCAAiB,EAAE,OAAO;IAE3C,IAAI,aAAa,UAAU,CAAC,kBAAkB,IAAI,WAAW,EAAE;IAE/D,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,OAAO,MAAM,WAAW,CAAC,QAAQ;QAAC,OAAO;IAAM;IACnD,IAAI,cAAc,OAAO,gBAAgB,MAAM,CAAC,2BAA2B;cAAC;IAAI,KAAK;IACrF,IAAI,YAAY,CAAA,GAAA,qBAAa,EAAE;IAC/B,IAAI,kBAAkB;QAAC,SAAS,CAAC,mBAAmB;QAAE,UAAU,CAAC,mBAAmB;KAAC,CAAC,MAAM,CAAC,SAAS,IAAI,CAAC,QAAQ;IACnH,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE;IAC9B,IAAI,eAAe,CAAA,GAAA,cAAM,EAAE,IAAM,CAAA,GAAA,yBAAiB,EAAE,MAAM;QAAC;KAAI;IAE/D,IAAI,YAAY,CAAA,GAAA,aAAK,EAAE;IACvB,IAAI,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;QACtC,GAAG,KAAK;QACR,YAAY,MAAM,MAAM;QACxB,cAAc,CAAA;YACZ,4CAA4C;YAC5C,IAAI,SAAS,SAAS,cAAc,CAAC;YACrC,IAAI,CAAC,CAAA,GAAA,mBAAW,EAAE,QAAQ,EAAE,aAAa,GAAG;oBAE1C,eACA;gBAFA,UAAU,OAAO,GAAG;iBACpB,gBAAA,MAAM,MAAM,cAAZ,oCAAA,mBAAA,OAAe;iBACf,uBAAA,MAAM,aAAa,cAAnB,2CAAA,0BAAA,OAAsB;YACxB;QACF;QACA,eAAe,CAAA;YACb,IAAI,CAAC,UAAU,OAAO,EAAE;oBAEtB,gBACA;gBAFA,UAAU,OAAO,GAAG;iBACpB,iBAAA,MAAM,OAAO,cAAb,qCAAA,oBAAA,OAAgB;iBAChB,uBAAA,MAAM,aAAa,cAAnB,2CAAA,0BAAA,OAAsB;YACxB;QACF;IACF;IAEA,OAAO;QACL,YAAY,CAAA,GAAA,iBAAS,EAAE,UAAU,YAAY,YAAY,WAAW,kBAAkB;YACpF,MAAM;YACN,iBAAiB,MAAM,UAAU,IAAI;YACrC,mBAAmB;YACnB,oBAAoB;YACpB,WAAU,CAAgB;gBACxB,IAAI,MAAM,MAAM,EACd;gBAGF,IAAI,MAAM,SAAS,EACjB,MAAM,SAAS,CAAC;YAEpB;YACA,SAAQ,CAAgB;gBACtB,IAAI,MAAM,MAAM,EACd;gBAGF,IAAI,MAAM,OAAO,EACf,MAAM,OAAO,CAAC;YAElB;QACF;QACA,YAAY;YACV,GAAG,UAAU;YACb,SAAS;gBACP,aAAa,UAAU;YACzB;QACF;QACA,YAAY;YACV,GAAG,UAAU;YACb,IAAI;YACJ,CAAC,CAAA,GAAA,yCAAS,EAAE,EAAE;YACd,oBAAoB;YACpB,OAAO,MAAM,KAAK;YAClB,cAAc,MAAM,YAAY;YAChC,UAAU,MAAM,QAAQ;YACxB,kBAAkB,MAAM,gBAAgB;YACxC,cAAc,MAAM,YAAY;YAChC,WAAW,MAAM,SAAS;YAC1B,yBAAyB,MAAM,uBAAuB;YACtD,aAAa,MAAM,WAAW;YAC9B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,oBAAoB,MAAM,kBAAkB;YAC5C,2DAA2D;YAC3D,CAAC,CAAA,GAAA,iCAAyB,EAAE,EAAE;YAC9B,WAAW,MAAM,SAAS;YAC1B,MAAM,MAAM,IAAI;YAChB,MAAM,MAAM,IAAI;QAClB;0BACA;2BACA;QACA,aAAa;YACX,GAAG,SAAS;YACZ,IAAI;YACJ,iBAAiB;YACjB,cAAc,gBAAgB,MAAM,CAAC;YACrC,mBAAmB,GAAG,SAAS,CAAC,EAAE,YAAY;YAC9C,oBAAoB;YACpB,iBAAiB,MAAM,MAAM;YAC7B,YAAY,MAAM,UAAU,IAAI,MAAM,UAAU;YAChD,SAAS,IAAM,MAAM,OAAO,CAAC;QAC/B;QACA,aAAa;YACX,IAAI;YACJ,mBAAmB,GAAG,SAAS,CAAC,EAAE,YAAY;QAChD;QACA,eAAe;YACb,WAAW;YACX,OAAO,MAAM,SAAS;YACtB,UAAU,MAAM,YAAY;YAC5B,UAAU,MAAM,QAAQ;YACxB,UAAU,MAAM,QAAQ;YACxB,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,mBAAmB,MAAM,iBAAiB;YAC1C,qBAAqB,MAAM,SAAS,GAAG,YAAY,MAAM,gBAAgB;YACzE,WAAW,MAAM,SAAS;YAC1B,cAAc,OAAO,MAAM,YAAY,KAAK,aAAa,MAAM,YAAY,CAAC,MAAM,iBAAiB,IAAK,MAAM,YAAY,IAAI,MAAM,iBAAiB,CAAC,gBAAgB,CAAC,IAAI,CAAC;YAC5K,gBAAgB,MAAM,cAAc;YACpC,cAAc,MAAM,YAAY;QAClC;mBACA;0BACA;2BACA;IACF;AACF","sources":["packages/@react-aria/datepicker/src/useDatePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {CalendarProps} from '@react-types/calendar';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DatePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, nodeContains, useDescription, useId} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {privateValidationStateProp} from '@react-stately/form';\nimport {roleSymbol} from './useDateField';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DatePickerAria extends ValidationResult {\n /** Props for the date picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date field and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the date field. */\n fieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the calendar within the popover dialog. */\n calendarProps: CalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>, state: DatePickerState, ref: RefObject<Element | null>): DatePickerAria {\n let buttonId = useId();\n let dialogId = useId();\n let fieldId = useId();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let date = state.formatValue(locale, {month: 'long'});\n let description = date ? stringFormatter.format('selectedDateDescription', {date}) : '';\n let descProps = useDescription(description);\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let domProps = filterDOMProps(props);\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!nodeContains(dialog, e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-labelledby': labelledBy,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n fieldProps: {\n ...fieldProps,\n id: fieldId,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n value: state.value,\n defaultValue: state.defaultValue,\n onChange: state.setValue,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n granularity: props.granularity,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior,\n // DatePicker owns the validation state for the date field.\n [privateValidationStateProp]: state,\n autoFocus: props.autoFocus,\n name: props.name,\n form: props.form\n },\n descriptionProps,\n errorMessageProps,\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n calendarProps: {\n autoFocus: true,\n value: state.dateValue,\n onChange: state.setDateValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n defaultFocusedValue: state.dateValue ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDatePicker.module.js.map"}
|
|
@@ -22,7 +22,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
22
22
|
]);
|
|
23
23
|
// Open the popover on alt + arrow down
|
|
24
24
|
let onKeyDown = (e)=>{
|
|
25
|
-
if (!e.currentTarget.
|
|
25
|
+
if (!(0, $19S5E$reactariautils.nodeContains)(e.currentTarget, (0, $19S5E$reactariautils.getEventTarget)(e))) return;
|
|
26
26
|
if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {
|
|
27
27
|
e.preventDefault();
|
|
28
28
|
e.stopPropagation();
|
|
@@ -35,7 +35,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
35
35
|
e.stopPropagation();
|
|
36
36
|
if (direction === 'rtl') {
|
|
37
37
|
if (ref.current) {
|
|
38
|
-
let target = e
|
|
38
|
+
let target = (0, $19S5E$reactariautils.getEventTarget)(e);
|
|
39
39
|
let prev = $715562ad3b4cced4$var$findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
40
40
|
if (prev) prev.focus();
|
|
41
41
|
}
|
|
@@ -46,7 +46,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
46
46
|
e.stopPropagation();
|
|
47
47
|
if (direction === 'rtl') {
|
|
48
48
|
if (ref.current) {
|
|
49
|
-
let target = e
|
|
49
|
+
let target = (0, $19S5E$reactariautils.getEventTarget)(e);
|
|
50
50
|
let next = $715562ad3b4cced4$var$findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
51
51
|
if (next) next.focus();
|
|
52
52
|
}
|
|
@@ -56,10 +56,9 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
56
56
|
};
|
|
57
57
|
// Focus the first placeholder segment from the end on mouse down/touch up in the field.
|
|
58
58
|
let focusLast = ()=>{
|
|
59
|
-
var _window_event;
|
|
60
59
|
if (!ref.current) return;
|
|
61
60
|
// Try to find the segment prior to the element that was clicked on.
|
|
62
|
-
let target =
|
|
61
|
+
let target = window.event ? (0, $19S5E$reactariautils.getEventTarget)(window.event) : null;
|
|
63
62
|
let walker = (0, $19S5E$reactariafocus.getFocusableTreeWalker)(ref.current, {
|
|
64
63
|
tabbable: true
|
|
65
64
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;AAQO,SAAS,0CAAmB,KAA8D,EAAE,GAA8B,EAAE,sBAAgC;IACjK,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,8BAAQ;IAC1B,IAAI,eAAe,CAAA,GAAA,oBAAM,EAAE,IAAM,CAAA,GAAA,wCAAiB,EAAE,MAAM;QAAC;KAAI;IAE/D,uCAAuC;IACvC,IAAI,YAAY,CAAC;QACf,IAAI,CAAC,EAAE,aAAa,
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePickerGroup.ts"],"sourcesContent":["import {createFocusManager, getFocusableTreeWalker} from '@react-aria/focus';\nimport {DateFieldState, DatePickerState, DateRangePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {getEventTarget, mergeProps, nodeContains} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useMemo} from 'react';\nimport {usePress} from '@react-aria/interactions';\n\nexport function useDatePickerGroup(state: DatePickerState | DateRangePickerState | DateFieldState, ref: RefObject<Element | null>, disableArrowNavigation?: boolean): DOMAttributes<FocusableElement> {\n let {direction} = useLocale();\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n // Open the popover on alt + arrow down\n let onKeyDown = (e: KeyboardEvent) => {\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element)) {\n return;\n }\n\n if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true);\n }\n\n if (disableArrowNavigation) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowLeft':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let prev = findNextSegment(ref.current, target.getBoundingClientRect().left, -1);\n\n if (prev) {\n prev.focus();\n }\n }\n } else {\n focusManager.focusPrevious();\n }\n break;\n case 'ArrowRight':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let next = findNextSegment(ref.current, target.getBoundingClientRect().left, 1);\n\n if (next) {\n next.focus();\n }\n }\n } else {\n focusManager.focusNext();\n }\n break;\n }\n };\n\n // Focus the first placeholder segment from the end on mouse down/touch up in the field.\n let focusLast = () => {\n if (!ref.current) {\n return;\n }\n // Try to find the segment prior to the element that was clicked on.\n let target = window.event ? getEventTarget(window.event) as FocusableElement : null;\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n if (target) {\n walker.currentNode = target;\n target = walker.previousNode() as FocusableElement;\n }\n\n // If no target found, find the last element from the end.\n if (!target) {\n let last: FocusableElement;\n do {\n last = walker.lastChild() as FocusableElement;\n if (last) {\n target = last;\n }\n } while (last);\n }\n\n // Now go backwards until we find an element that is not a placeholder.\n while (target?.hasAttribute('data-placeholder')) {\n let prev = walker.previousNode() as FocusableElement;\n if (prev && prev.hasAttribute('data-placeholder')) {\n target = prev;\n } else {\n break;\n }\n }\n\n if (target) {\n target.focus();\n }\n };\n\n let {pressProps} = usePress({\n preventFocusOnPress: true,\n allowTextSelectionOnPress: true,\n onPressStart(e) {\n if (e.pointerType === 'mouse') {\n focusLast();\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' || e.pointerType === 'pen') {\n focusLast();\n }\n }\n });\n\n return mergeProps(pressProps, {onKeyDown});\n}\n\nfunction findNextSegment(group: Element, fromX: number, direction: number) {\n let walker = getFocusableTreeWalker(group, {tabbable: true});\n let node = walker.nextNode();\n let closest: FocusableElement | null = null;\n let closestDistance = Infinity;\n while (node) {\n let x = (node as Element).getBoundingClientRect().left;\n let distance = x - fromX;\n let absoluteDistance = Math.abs(distance);\n if (Math.sign(distance) === direction && absoluteDistance < closestDistance) {\n closest = node as FocusableElement;\n closestDistance = absoluteDistance;\n }\n node = walker.nextNode();\n }\n return closest;\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.main.js.map"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {createFocusManager as $7CEvq$createFocusManager, getFocusableTreeWalker as $7CEvq$getFocusableTreeWalker} from "@react-aria/focus";
|
|
2
|
-
import {mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
2
|
+
import {nodeContains as $7CEvq$nodeContains, getEventTarget as $7CEvq$getEventTarget, mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
3
3
|
import {useLocale as $7CEvq$useLocale} from "@react-aria/i18n";
|
|
4
4
|
import {useMemo as $7CEvq$useMemo} from "react";
|
|
5
5
|
import {usePress as $7CEvq$usePress} from "@react-aria/interactions";
|
|
@@ -16,7 +16,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
16
16
|
]);
|
|
17
17
|
// Open the popover on alt + arrow down
|
|
18
18
|
let onKeyDown = (e)=>{
|
|
19
|
-
if (!e.currentTarget
|
|
19
|
+
if (!(0, $7CEvq$nodeContains)(e.currentTarget, (0, $7CEvq$getEventTarget)(e))) return;
|
|
20
20
|
if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {
|
|
21
21
|
e.preventDefault();
|
|
22
22
|
e.stopPropagation();
|
|
@@ -29,7 +29,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
29
29
|
e.stopPropagation();
|
|
30
30
|
if (direction === 'rtl') {
|
|
31
31
|
if (ref.current) {
|
|
32
|
-
let target = e
|
|
32
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
33
33
|
let prev = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
34
34
|
if (prev) prev.focus();
|
|
35
35
|
}
|
|
@@ -40,7 +40,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
40
40
|
e.stopPropagation();
|
|
41
41
|
if (direction === 'rtl') {
|
|
42
42
|
if (ref.current) {
|
|
43
|
-
let target = e
|
|
43
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
44
44
|
let next = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
45
45
|
if (next) next.focus();
|
|
46
46
|
}
|
|
@@ -50,10 +50,9 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
50
50
|
};
|
|
51
51
|
// Focus the first placeholder segment from the end on mouse down/touch up in the field.
|
|
52
52
|
let focusLast = ()=>{
|
|
53
|
-
var _window_event;
|
|
54
53
|
if (!ref.current) return;
|
|
55
54
|
// Try to find the segment prior to the element that was clicked on.
|
|
56
|
-
let target =
|
|
55
|
+
let target = window.event ? (0, $7CEvq$getEventTarget)(window.event) : null;
|
|
57
56
|
let walker = (0, $7CEvq$getFocusableTreeWalker)(ref.current, {
|
|
58
57
|
tabbable: true
|
|
59
58
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {createFocusManager as $7CEvq$createFocusManager, getFocusableTreeWalker as $7CEvq$getFocusableTreeWalker} from "@react-aria/focus";
|
|
2
|
-
import {mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
2
|
+
import {nodeContains as $7CEvq$nodeContains, getEventTarget as $7CEvq$getEventTarget, mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
3
3
|
import {useLocale as $7CEvq$useLocale} from "@react-aria/i18n";
|
|
4
4
|
import {useMemo as $7CEvq$useMemo} from "react";
|
|
5
5
|
import {usePress as $7CEvq$usePress} from "@react-aria/interactions";
|
|
@@ -16,7 +16,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
16
16
|
]);
|
|
17
17
|
// Open the popover on alt + arrow down
|
|
18
18
|
let onKeyDown = (e)=>{
|
|
19
|
-
if (!e.currentTarget
|
|
19
|
+
if (!(0, $7CEvq$nodeContains)(e.currentTarget, (0, $7CEvq$getEventTarget)(e))) return;
|
|
20
20
|
if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {
|
|
21
21
|
e.preventDefault();
|
|
22
22
|
e.stopPropagation();
|
|
@@ -29,7 +29,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
29
29
|
e.stopPropagation();
|
|
30
30
|
if (direction === 'rtl') {
|
|
31
31
|
if (ref.current) {
|
|
32
|
-
let target = e
|
|
32
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
33
33
|
let prev = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
34
34
|
if (prev) prev.focus();
|
|
35
35
|
}
|
|
@@ -40,7 +40,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
40
40
|
e.stopPropagation();
|
|
41
41
|
if (direction === 'rtl') {
|
|
42
42
|
if (ref.current) {
|
|
43
|
-
let target = e
|
|
43
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
44
44
|
let next = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
45
45
|
if (next) next.focus();
|
|
46
46
|
}
|
|
@@ -50,10 +50,9 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
50
50
|
};
|
|
51
51
|
// Focus the first placeholder segment from the end on mouse down/touch up in the field.
|
|
52
52
|
let focusLast = ()=>{
|
|
53
|
-
var _window_event;
|
|
54
53
|
if (!ref.current) return;
|
|
55
54
|
// Try to find the segment prior to the element that was clicked on.
|
|
56
|
-
let target =
|
|
55
|
+
let target = window.event ? (0, $7CEvq$getEventTarget)(window.event) : null;
|
|
57
56
|
let walker = (0, $7CEvq$getFocusableTreeWalker)(ref.current, {
|
|
58
57
|
tabbable: true
|
|
59
58
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;AAQO,SAAS,0CAAmB,KAA8D,EAAE,GAA8B,EAAE,sBAAgC;IACjK,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,IAAI,eAAe,CAAA,GAAA,cAAM,EAAE,IAAM,CAAA,GAAA,yBAAiB,EAAE,MAAM;QAAC;KAAI;IAE/D,uCAAuC;IACvC,IAAI,YAAY,CAAC;QACf,IAAI,CAAC,EAAE,aAAa,
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePickerGroup.ts"],"sourcesContent":["import {createFocusManager, getFocusableTreeWalker} from '@react-aria/focus';\nimport {DateFieldState, DatePickerState, DateRangePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {getEventTarget, mergeProps, nodeContains} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useMemo} from 'react';\nimport {usePress} from '@react-aria/interactions';\n\nexport function useDatePickerGroup(state: DatePickerState | DateRangePickerState | DateFieldState, ref: RefObject<Element | null>, disableArrowNavigation?: boolean): DOMAttributes<FocusableElement> {\n let {direction} = useLocale();\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n // Open the popover on alt + arrow down\n let onKeyDown = (e: KeyboardEvent) => {\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element)) {\n return;\n }\n\n if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true);\n }\n\n if (disableArrowNavigation) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowLeft':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let prev = findNextSegment(ref.current, target.getBoundingClientRect().left, -1);\n\n if (prev) {\n prev.focus();\n }\n }\n } else {\n focusManager.focusPrevious();\n }\n break;\n case 'ArrowRight':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let next = findNextSegment(ref.current, target.getBoundingClientRect().left, 1);\n\n if (next) {\n next.focus();\n }\n }\n } else {\n focusManager.focusNext();\n }\n break;\n }\n };\n\n // Focus the first placeholder segment from the end on mouse down/touch up in the field.\n let focusLast = () => {\n if (!ref.current) {\n return;\n }\n // Try to find the segment prior to the element that was clicked on.\n let target = window.event ? getEventTarget(window.event) as FocusableElement : null;\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n if (target) {\n walker.currentNode = target;\n target = walker.previousNode() as FocusableElement;\n }\n\n // If no target found, find the last element from the end.\n if (!target) {\n let last: FocusableElement;\n do {\n last = walker.lastChild() as FocusableElement;\n if (last) {\n target = last;\n }\n } while (last);\n }\n\n // Now go backwards until we find an element that is not a placeholder.\n while (target?.hasAttribute('data-placeholder')) {\n let prev = walker.previousNode() as FocusableElement;\n if (prev && prev.hasAttribute('data-placeholder')) {\n target = prev;\n } else {\n break;\n }\n }\n\n if (target) {\n target.focus();\n }\n };\n\n let {pressProps} = usePress({\n preventFocusOnPress: true,\n allowTextSelectionOnPress: true,\n onPressStart(e) {\n if (e.pointerType === 'mouse') {\n focusLast();\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' || e.pointerType === 'pen') {\n focusLast();\n }\n }\n });\n\n return mergeProps(pressProps, {onKeyDown});\n}\n\nfunction findNextSegment(group: Element, fromX: number, direction: number) {\n let walker = getFocusableTreeWalker(group, {tabbable: true});\n let node = walker.nextNode();\n let closest: FocusableElement | null = null;\n let closestDistance = Infinity;\n while (node) {\n let x = (node as Element).getBoundingClientRect().left;\n let distance = x - fromX;\n let absoluteDistance = Math.abs(distance);\n if (Math.sign(distance) === direction && absoluteDistance < closestDistance) {\n closest = node as FocusableElement;\n closestDistance = absoluteDistance;\n }\n node = walker.nextNode();\n }\n return closest;\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.module.js.map"}
|
|
@@ -103,7 +103,7 @@ function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
|
|
|
103
103
|
onBlurWithin: (e)=>{
|
|
104
104
|
// Ignore when focus moves into the popover.
|
|
105
105
|
let dialog = document.getElementById(dialogId);
|
|
106
|
-
if (!(
|
|
106
|
+
if (!(0, $Xt1Bd$reactariautils.nodeContains)(dialog, e.relatedTarget)) {
|
|
107
107
|
var _props_onBlur, _props_onFocusChange;
|
|
108
108
|
isFocused.current = false;
|
|
109
109
|
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDateRangePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DateRange, RangeCalendarProps} from '@react-types/calendar';\nimport {DateRangePickerState} from '@react-stately/datepicker';\nimport {DEFAULT_VALIDATION_RESULT, mergeValidation, privateValidationStateProp} from '@react-stately/form';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';\nimport {focusManagerSymbol, roleSymbol} from './useDateField';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DateRangePickerAria extends ValidationResult {\n /** Props for the date range picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date fields and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the start date field. */\n startFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the end date field. */\n endFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the range calendar within the popover dialog. */\n calendarProps: RangeCalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport function useDateRangePicker<T extends DateValue>(props: AriaDateRangePickerProps<T>, state: DateRangePickerState, ref: RefObject<Element | null>): DateRangePickerAria {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let range = state.formatValue(locale, {month: 'long'});\n let description = range ? stringFormatter.format('selectedRangeDescription', {startDate: range.start, endDate: range.end}) : '';\n let descProps = useDescription(description);\n\n let startFieldProps = {\n 'aria-label': stringFormatter.format('startDate'),\n 'aria-labelledby': labelledBy\n };\n\n let endFieldProps = {\n 'aria-label': stringFormatter.format('endDate'),\n 'aria-labelledby': labelledBy\n };\n\n let buttonId = useId();\n let dialogId = useId();\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let focusManager = useMemo(() => createFocusManager(ref, {\n // Exclude the button from the focus manager.\n accept: element => element.id !== buttonId\n }), [ref, buttonId]);\n\n let commonFieldProps = {\n [focusManagerSymbol]: focusManager,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n granularity: props.granularity,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior\n };\n\n let domProps = filterDOMProps(props);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!dialog?.contains(e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n let startFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n let endFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n startFieldProps: {\n ...startFieldProps,\n ...commonFieldProps,\n value: state.value?.start ?? null,\n defaultValue: state.defaultValue?.start,\n onChange: start => state.setDateTime('start', start),\n autoFocus: props.autoFocus,\n name: props.startName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n startFieldValidation.current = e;\n state.updateValidation(mergeValidation(e, endFieldValidation.current));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n endFieldProps: {\n ...endFieldProps,\n ...commonFieldProps,\n value: state.value?.end ?? null,\n defaultValue: state.defaultValue?.end,\n onChange: end => state.setDateTime('end', end),\n name: props.endName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n endFieldValidation.current = e;\n state.updateValidation(mergeValidation(startFieldValidation.current, e));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n descriptionProps,\n errorMessageProps,\n calendarProps: {\n autoFocus: true,\n value: state.dateRange?.start && state.dateRange.end ? state.dateRange as DateRange : null,\n onChange: state.setDateRange,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n allowsNonContiguousRanges: props.allowsNonContiguousRanges,\n defaultFocusedValue: state.dateRange ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDateRangePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DateRange, RangeCalendarProps} from '@react-types/calendar';\nimport {DateRangePickerState} from '@react-stately/datepicker';\nimport {DEFAULT_VALIDATION_RESULT, mergeValidation, privateValidationStateProp} from '@react-stately/form';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, nodeContains, useDescription, useId} from '@react-aria/utils';\nimport {focusManagerSymbol, roleSymbol} from './useDateField';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DateRangePickerAria extends ValidationResult {\n /** Props for the date range picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date fields and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the start date field. */\n startFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the end date field. */\n endFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the range calendar within the popover dialog. */\n calendarProps: RangeCalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport function useDateRangePicker<T extends DateValue>(props: AriaDateRangePickerProps<T>, state: DateRangePickerState, ref: RefObject<Element | null>): DateRangePickerAria {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let range = state.formatValue(locale, {month: 'long'});\n let description = range ? stringFormatter.format('selectedRangeDescription', {startDate: range.start, endDate: range.end}) : '';\n let descProps = useDescription(description);\n\n let startFieldProps = {\n 'aria-label': stringFormatter.format('startDate'),\n 'aria-labelledby': labelledBy\n };\n\n let endFieldProps = {\n 'aria-label': stringFormatter.format('endDate'),\n 'aria-labelledby': labelledBy\n };\n\n let buttonId = useId();\n let dialogId = useId();\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let focusManager = useMemo(() => createFocusManager(ref, {\n // Exclude the button from the focus manager.\n accept: element => element.id !== buttonId\n }), [ref, buttonId]);\n\n let commonFieldProps = {\n [focusManagerSymbol]: focusManager,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n granularity: props.granularity,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior\n };\n\n let domProps = filterDOMProps(props);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!nodeContains(dialog, e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n let startFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n let endFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n startFieldProps: {\n ...startFieldProps,\n ...commonFieldProps,\n value: state.value?.start ?? null,\n defaultValue: state.defaultValue?.start,\n onChange: start => state.setDateTime('start', start),\n autoFocus: props.autoFocus,\n name: props.startName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n startFieldValidation.current = e;\n state.updateValidation(mergeValidation(e, endFieldValidation.current));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n endFieldProps: {\n ...endFieldProps,\n ...commonFieldProps,\n value: state.value?.end ?? null,\n defaultValue: state.defaultValue?.end,\n onChange: end => state.setDateTime('end', end),\n name: props.endName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n endFieldValidation.current = e;\n state.updateValidation(mergeValidation(startFieldValidation.current, e));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n descriptionProps,\n errorMessageProps,\n calendarProps: {\n autoFocus: true,\n value: state.dateRange?.start && state.dateRange.end ? state.dateRange as DateRange : null,\n onChange: state.setDateRange,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n allowsNonContiguousRanges: props.allowsNonContiguousRanges,\n defaultFocusedValue: state.dateRange ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.main.js.map"}
|
|
@@ -3,7 +3,7 @@ import $eIQ1H$intlStringsmodulejs from "./intlStrings.mjs";
|
|
|
3
3
|
import {useDatePickerGroup as $3dfb0f96be0d6a08$export$4a931266a3838b86} from "./useDatePickerGroup.mjs";
|
|
4
4
|
import {createFocusManager as $eIQ1H$createFocusManager} from "@react-aria/focus";
|
|
5
5
|
import {DEFAULT_VALIDATION_RESULT as $eIQ1H$DEFAULT_VALIDATION_RESULT, privateValidationStateProp as $eIQ1H$privateValidationStateProp, mergeValidation as $eIQ1H$mergeValidation} from "@react-stately/form";
|
|
6
|
-
import {useDescription as $eIQ1H$useDescription, useId as $eIQ1H$useId, filterDOMProps as $eIQ1H$filterDOMProps, mergeProps as $eIQ1H$mergeProps} from "@react-aria/utils";
|
|
6
|
+
import {useDescription as $eIQ1H$useDescription, useId as $eIQ1H$useId, filterDOMProps as $eIQ1H$filterDOMProps, nodeContains as $eIQ1H$nodeContains, mergeProps as $eIQ1H$mergeProps} from "@react-aria/utils";
|
|
7
7
|
import {useField as $eIQ1H$useField} from "@react-aria/label";
|
|
8
8
|
import {useFocusWithin as $eIQ1H$useFocusWithin} from "@react-aria/interactions";
|
|
9
9
|
import {useLocalizedStringFormatter as $eIQ1H$useLocalizedStringFormatter, useLocale as $eIQ1H$useLocale} from "@react-aria/i18n";
|
|
@@ -97,7 +97,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
|
|
|
97
97
|
onBlurWithin: (e)=>{
|
|
98
98
|
// Ignore when focus moves into the popover.
|
|
99
99
|
let dialog = document.getElementById(dialogId);
|
|
100
|
-
if (!(
|
|
100
|
+
if (!(0, $eIQ1H$nodeContains)(dialog, e.relatedTarget)) {
|
|
101
101
|
var _props_onBlur, _props_onFocusChange;
|
|
102
102
|
isFocused.current = false;
|
|
103
103
|
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
@@ -3,7 +3,7 @@ import $eIQ1H$intlStringsmodulejs from "./intlStrings.module.js";
|
|
|
3
3
|
import {useDatePickerGroup as $3dfb0f96be0d6a08$export$4a931266a3838b86} from "./useDatePickerGroup.module.js";
|
|
4
4
|
import {createFocusManager as $eIQ1H$createFocusManager} from "@react-aria/focus";
|
|
5
5
|
import {DEFAULT_VALIDATION_RESULT as $eIQ1H$DEFAULT_VALIDATION_RESULT, privateValidationStateProp as $eIQ1H$privateValidationStateProp, mergeValidation as $eIQ1H$mergeValidation} from "@react-stately/form";
|
|
6
|
-
import {useDescription as $eIQ1H$useDescription, useId as $eIQ1H$useId, filterDOMProps as $eIQ1H$filterDOMProps, mergeProps as $eIQ1H$mergeProps} from "@react-aria/utils";
|
|
6
|
+
import {useDescription as $eIQ1H$useDescription, useId as $eIQ1H$useId, filterDOMProps as $eIQ1H$filterDOMProps, nodeContains as $eIQ1H$nodeContains, mergeProps as $eIQ1H$mergeProps} from "@react-aria/utils";
|
|
7
7
|
import {useField as $eIQ1H$useField} from "@react-aria/label";
|
|
8
8
|
import {useFocusWithin as $eIQ1H$useFocusWithin} from "@react-aria/interactions";
|
|
9
9
|
import {useLocalizedStringFormatter as $eIQ1H$useLocalizedStringFormatter, useLocale as $eIQ1H$useLocale} from "@react-aria/i18n";
|
|
@@ -97,7 +97,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
|
|
|
97
97
|
onBlurWithin: (e)=>{
|
|
98
98
|
// Ignore when focus moves into the popover.
|
|
99
99
|
let dialog = document.getElementById(dialogId);
|
|
100
|
-
if (!(
|
|
100
|
+
if (!(0, $eIQ1H$nodeContains)(dialog, e.relatedTarget)) {
|
|
101
101
|
var _props_onBlur, _props_onFocusChange;
|
|
102
102
|
isFocused.current = false;
|
|
103
103
|
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDateRangePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DateRange, RangeCalendarProps} from '@react-types/calendar';\nimport {DateRangePickerState} from '@react-stately/datepicker';\nimport {DEFAULT_VALIDATION_RESULT, mergeValidation, privateValidationStateProp} from '@react-stately/form';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';\nimport {focusManagerSymbol, roleSymbol} from './useDateField';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DateRangePickerAria extends ValidationResult {\n /** Props for the date range picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date fields and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the start date field. */\n startFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the end date field. */\n endFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the range calendar within the popover dialog. */\n calendarProps: RangeCalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport function useDateRangePicker<T extends DateValue>(props: AriaDateRangePickerProps<T>, state: DateRangePickerState, ref: RefObject<Element | null>): DateRangePickerAria {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let range = state.formatValue(locale, {month: 'long'});\n let description = range ? stringFormatter.format('selectedRangeDescription', {startDate: range.start, endDate: range.end}) : '';\n let descProps = useDescription(description);\n\n let startFieldProps = {\n 'aria-label': stringFormatter.format('startDate'),\n 'aria-labelledby': labelledBy\n };\n\n let endFieldProps = {\n 'aria-label': stringFormatter.format('endDate'),\n 'aria-labelledby': labelledBy\n };\n\n let buttonId = useId();\n let dialogId = useId();\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let focusManager = useMemo(() => createFocusManager(ref, {\n // Exclude the button from the focus manager.\n accept: element => element.id !== buttonId\n }), [ref, buttonId]);\n\n let commonFieldProps = {\n [focusManagerSymbol]: focusManager,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n granularity: props.granularity,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior\n };\n\n let domProps = filterDOMProps(props);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!dialog?.contains(e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n let startFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n let endFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n startFieldProps: {\n ...startFieldProps,\n ...commonFieldProps,\n value: state.value?.start ?? null,\n defaultValue: state.defaultValue?.start,\n onChange: start => state.setDateTime('start', start),\n autoFocus: props.autoFocus,\n name: props.startName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n startFieldValidation.current = e;\n state.updateValidation(mergeValidation(e, endFieldValidation.current));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n endFieldProps: {\n ...endFieldProps,\n ...commonFieldProps,\n value: state.value?.end ?? null,\n defaultValue: state.defaultValue?.end,\n onChange: end => state.setDateTime('end', end),\n name: props.endName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n endFieldValidation.current = e;\n state.updateValidation(mergeValidation(startFieldValidation.current, e));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n descriptionProps,\n errorMessageProps,\n calendarProps: {\n autoFocus: true,\n value: state.dateRange?.start && state.dateRange.end ? state.dateRange as DateRange : null,\n onChange: state.setDateRange,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n allowsNonContiguousRanges: props.allowsNonContiguousRanges,\n defaultFocusedValue: state.dateRange ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDateRangePicker.ts"],"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 {AriaButtonProps} from '@react-types/button';\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue} from '@react-types/datepicker';\nimport {AriaDialogProps} from '@react-types/dialog';\nimport {createFocusManager} from '@react-aria/focus';\nimport {DateRange, RangeCalendarProps} from '@react-types/calendar';\nimport {DateRangePickerState} from '@react-stately/datepicker';\nimport {DEFAULT_VALIDATION_RESULT, mergeValidation, privateValidationStateProp} from '@react-stately/form';\nimport {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, nodeContains, useDescription, useId} from '@react-aria/utils';\nimport {focusManagerSymbol, roleSymbol} from './useDateField';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {useDatePickerGroup} from './useDatePickerGroup';\nimport {useField} from '@react-aria/label';\nimport {useFocusWithin} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMemo, useRef} from 'react';\n\nexport interface DateRangePickerAria extends ValidationResult {\n /** Props for the date range picker's visible label element, if any. */\n labelProps: DOMAttributes,\n /** Props for the grouping element containing the date fields and button. */\n groupProps: GroupDOMAttributes,\n /** Props for the start date field. */\n startFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the end date field. */\n endFieldProps: AriaDatePickerProps<DateValue>,\n /** Props for the popover trigger button. */\n buttonProps: AriaButtonProps,\n /** Props for the description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the error message element, if any. */\n errorMessageProps: DOMAttributes,\n /** Props for the popover dialog. */\n dialogProps: AriaDialogProps,\n /** Props for the range calendar within the popover dialog. */\n calendarProps: RangeCalendarProps<DateValue>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a date picker component.\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport function useDateRangePicker<T extends DateValue>(props: AriaDateRangePickerProps<T>, state: DateRangePickerState, ref: RefObject<Element | null>): DateRangePickerAria {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/datepicker');\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n ...props,\n labelElementType: 'span',\n isInvalid,\n errorMessage: props.errorMessage || validationErrors\n });\n\n let labelledBy = fieldProps['aria-labelledby'] || fieldProps.id;\n\n let {locale} = useLocale();\n let range = state.formatValue(locale, {month: 'long'});\n let description = range ? stringFormatter.format('selectedRangeDescription', {startDate: range.start, endDate: range.end}) : '';\n let descProps = useDescription(description);\n\n let startFieldProps = {\n 'aria-label': stringFormatter.format('startDate'),\n 'aria-labelledby': labelledBy\n };\n\n let endFieldProps = {\n 'aria-label': stringFormatter.format('endDate'),\n 'aria-labelledby': labelledBy\n };\n\n let buttonId = useId();\n let dialogId = useId();\n\n let groupProps = useDatePickerGroup(state, ref);\n\n let ariaDescribedBy = [descProps['aria-describedby'], fieldProps['aria-describedby']].filter(Boolean).join(' ') || undefined;\n let focusManager = useMemo(() => createFocusManager(ref, {\n // Exclude the button from the focus manager.\n accept: element => element.id !== buttonId\n }), [ref, buttonId]);\n\n let commonFieldProps = {\n [focusManagerSymbol]: focusManager,\n [roleSymbol]: 'presentation',\n 'aria-describedby': ariaDescribedBy,\n placeholderValue: props.placeholderValue,\n hideTimeZone: props.hideTimeZone,\n hourCycle: props.hourCycle,\n granularity: props.granularity,\n shouldForceLeadingZeros: props.shouldForceLeadingZeros,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isRequired: props.isRequired,\n validationBehavior: props.validationBehavior\n };\n\n let domProps = filterDOMProps(props);\n\n let isFocused = useRef(false);\n let {focusWithinProps} = useFocusWithin({\n ...props,\n isDisabled: state.isOpen,\n onBlurWithin: e => {\n // Ignore when focus moves into the popover.\n let dialog = document.getElementById(dialogId);\n if (!nodeContains(dialog, e.relatedTarget)) {\n isFocused.current = false;\n props.onBlur?.(e);\n props.onFocusChange?.(false);\n }\n },\n onFocusWithin: e => {\n if (!isFocused.current) {\n isFocused.current = true;\n props.onFocus?.(e);\n props.onFocusChange?.(true);\n }\n }\n });\n\n let startFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n let endFieldValidation = useRef(DEFAULT_VALIDATION_RESULT);\n\n return {\n groupProps: mergeProps(domProps, groupProps, fieldProps, descProps, focusWithinProps, {\n role: 'group' as const,\n 'aria-disabled': props.isDisabled || null,\n 'aria-describedby': ariaDescribedBy,\n onKeyDown(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyDown) {\n props.onKeyDown(e);\n }\n },\n onKeyUp(e: KeyboardEvent) {\n if (state.isOpen) {\n return;\n }\n\n if (props.onKeyUp) {\n props.onKeyUp(e);\n }\n }\n }),\n labelProps: {\n ...labelProps,\n onClick: () => {\n focusManager.focusFirst();\n }\n },\n buttonProps: {\n ...descProps,\n id: buttonId,\n 'aria-haspopup': 'dialog',\n 'aria-label': stringFormatter.format('calendar'),\n 'aria-labelledby': `${buttonId} ${labelledBy}`,\n 'aria-describedby': ariaDescribedBy,\n 'aria-expanded': state.isOpen,\n isDisabled: props.isDisabled || props.isReadOnly,\n onPress: () => state.setOpen(true)\n },\n dialogProps: {\n id: dialogId,\n 'aria-labelledby': `${buttonId} ${labelledBy}`\n },\n startFieldProps: {\n ...startFieldProps,\n ...commonFieldProps,\n value: state.value?.start ?? null,\n defaultValue: state.defaultValue?.start,\n onChange: start => state.setDateTime('start', start),\n autoFocus: props.autoFocus,\n name: props.startName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n startFieldValidation.current = e;\n state.updateValidation(mergeValidation(e, endFieldValidation.current));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n endFieldProps: {\n ...endFieldProps,\n ...commonFieldProps,\n value: state.value?.end ?? null,\n defaultValue: state.defaultValue?.end,\n onChange: end => state.setDateTime('end', end),\n name: props.endName,\n form: props.form,\n [privateValidationStateProp]: {\n realtimeValidation: state.realtimeValidation,\n displayValidation: state.displayValidation,\n updateValidation(e) {\n endFieldValidation.current = e;\n state.updateValidation(mergeValidation(startFieldValidation.current, e));\n },\n resetValidation: state.resetValidation,\n commitValidation: state.commitValidation\n }\n },\n descriptionProps,\n errorMessageProps,\n calendarProps: {\n autoFocus: true,\n value: state.dateRange?.start && state.dateRange.end ? state.dateRange as DateRange : null,\n onChange: state.setDateRange,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDisabled: props.isDisabled,\n isReadOnly: props.isReadOnly,\n isDateUnavailable: props.isDateUnavailable,\n allowsNonContiguousRanges: props.allowsNonContiguousRanges,\n defaultFocusedValue: state.dateRange ? undefined : props.placeholderValue,\n isInvalid: state.isInvalid,\n errorMessage: typeof props.errorMessage === 'function' ? props.errorMessage(state.displayValidation) : (props.errorMessage || state.displayValidation.validationErrors.join(' ')),\n firstDayOfWeek: props.firstDayOfWeek,\n pageBehavior: props.pageBehavior\n },\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.module.js.map"}
|