@react-aria/datepicker 3.11.3 → 3.12.0

package/dist/useDatePicker.main.js.map

@@ -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} 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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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      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    },\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDatePicker.main.js.map"}
+{"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} 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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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      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    },\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDatePicker.main.js.map"}

package/dist/useDatePicker.module.js.map

@@ -1 +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,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;QACtC,GAAG,KAAK;QACR,YAAY,MAAM,MAAM;QACxB,cAAc,MAAM,MAAM;QAC1B,eAAe,MAAM,OAAO;QAC5B,qBAAqB,MAAM,aAAa;IAC1C;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,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;QAClB;0BACA;2BACA;QACA,aAAa;YACX,GAAG,SAAS;YACZ,IAAI;YACJ,iBAAiB;YACjB,cAAc,gBAAgB,MAAM,CAAC;YACrC,mBAAmB,CAAC,EAAE,SAAS,CAAC,EAAE,WAAW,CAAC;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,CAAC,EAAE,SAAS,CAAC,EAAE,WAAW,CAAC;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;QAC9K;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, 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} 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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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      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    },\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDatePicker.module.js.map"}
+{"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} 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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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      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    },\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDatePicker.module.js.map"}

package/dist/useDatePickerGroup.main.js

@@ -47,6 +47,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
     // Focus the first placeholder segment from the end on mouse down/touch up in the field.
     let focusLast = ()=>{
         var _window_event;
+        if (!ref.current) return;
         // Try to find the segment prior to the element that was clicked on.
         let target = (_window_event = window.event) === null || _window_event === void 0 ? void 0 : _window_event.target;
         let walker = (0, $19S5E$reactariafocus.getFocusableTreeWalker)(ref.current, {

package/dist/useDatePickerGroup.main.js.map

@@ -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,CAAC,QAAQ,CAAC,EAAE,MAAM,GACpC;QAGF,IAAI,EAAE,MAAM,IAAK,CAAA,EAAE,GAAG,KAAK,eAAe,EAAE,GAAG,KAAK,SAAQ,KAAM,aAAa,OAAO;YACpF,EAAE,cAAc;YAChB,EAAE,eAAe;YACjB,MAAM,OAAO,CAAC;QAChB;QAEA,IAAI,wBACF;QAGF,OAAQ,EAAE,GAAG;YACX,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,SAAS;qBAEtB,aAAa,aAAa;gBAE5B;YACF,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,aAAa;qBAE1B,aAAa,SAAS;gBAExB;QACJ;IACF;IAEA,wFAAwF;IACxF,IAAI,YAAY;YAED;QADb,oEAAoE;QACpE,IAAI,UAAS,gBAAA,OAAO,KAAK,cAAZ,oCAAA,cAAc,MAAM;QACjC,IAAI,SAAS,CAAA,GAAA,4CAAqB,EAAE,IAAI,OAAO,EAAE;YAAC,UAAU;QAAI;QAChE,IAAI,QAAQ;YACV,OAAO,WAAW,GAAG;YACrB,SAAS,OAAO,YAAY;QAC9B;QAEA,0DAA0D;QAC1D,IAAI,CAAC,QAAQ;YACX,IAAI;YACJ,GAAG;gBACD,OAAO,OAAO,SAAS;gBACvB,IAAI,MACF,SAAS;YAEb,QAAS,MAAM;QACjB;QAEA,uEAAuE;QACvE,MAAO,mBAAA,6BAAA,OAAQ,YAAY,CAAC,oBAAqB;YAC/C,IAAI,OAAO,OAAO,YAAY;YAC9B,IAAI,QAAQ,KAAK,YAAY,CAAC,qBAC5B,SAAS;iBAET;QAEJ;QAEA,IAAI,QACF,OAAO,KAAK;IAEhB;IAEA,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,qCAAO,EAAE;QAC1B,qBAAqB;QACrB,2BAA2B;QAC3B,cAAa,CAAC;YACZ,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;QACA,SAAQ,CAAC;YACP,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;IACF;IAEA,OAAO,CAAA,GAAA,gCAAS,EAAE,YAAY;mBAAC;IAAS;AAC1C","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 {FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {mergeProps} 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) {\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 (!e.currentTarget.contains(e.target)) {\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          focusManager.focusNext();\n        } else {\n          focusManager.focusPrevious();\n        }\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          focusManager.focusPrevious();\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    // Try to find the segment prior to the element that was clicked on.\n    let target = window.event?.target as FocusableElement;\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 !== 'mouse') {\n        focusLast();\n      }\n    }\n  });\n\n  return mergeProps(pressProps, {onKeyDown});\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.main.js.map"}
+{"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,CAAC,QAAQ,CAAC,EAAE,MAAM,GACpC;QAGF,IAAI,EAAE,MAAM,IAAK,CAAA,EAAE,GAAG,KAAK,eAAe,EAAE,GAAG,KAAK,SAAQ,KAAM,aAAa,OAAO;YACpF,EAAE,cAAc;YAChB,EAAE,eAAe;YACjB,MAAM,OAAO,CAAC;QAChB;QAEA,IAAI,wBACF;QAGF,OAAQ,EAAE,GAAG;YACX,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,SAAS;qBAEtB,aAAa,aAAa;gBAE5B;YACF,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,aAAa;qBAE1B,aAAa,SAAS;gBAExB;QACJ;IACF;IAEA,wFAAwF;IACxF,IAAI,YAAY;YAKD;QAJb,IAAI,CAAC,IAAI,OAAO,EACd;QAEF,oEAAoE;QACpE,IAAI,UAAS,gBAAA,OAAO,KAAK,cAAZ,oCAAA,cAAc,MAAM;QACjC,IAAI,SAAS,CAAA,GAAA,4CAAqB,EAAE,IAAI,OAAO,EAAE;YAAC,UAAU;QAAI;QAChE,IAAI,QAAQ;YACV,OAAO,WAAW,GAAG;YACrB,SAAS,OAAO,YAAY;QAC9B;QAEA,0DAA0D;QAC1D,IAAI,CAAC,QAAQ;YACX,IAAI;YACJ,GAAG;gBACD,OAAO,OAAO,SAAS;gBACvB,IAAI,MACF,SAAS;YAEb,QAAS,MAAM;QACjB;QAEA,uEAAuE;QACvE,MAAO,mBAAA,6BAAA,OAAQ,YAAY,CAAC,oBAAqB;YAC/C,IAAI,OAAO,OAAO,YAAY;YAC9B,IAAI,QAAQ,KAAK,YAAY,CAAC,qBAC5B,SAAS;iBAET;QAEJ;QAEA,IAAI,QACF,OAAO,KAAK;IAEhB;IAEA,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,qCAAO,EAAE;QAC1B,qBAAqB;QACrB,2BAA2B;QAC3B,cAAa,CAAC;YACZ,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;QACA,SAAQ,CAAC;YACP,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;IACF;IAEA,OAAO,CAAA,GAAA,gCAAS,EAAE,YAAY;mBAAC;IAAS;AAC1C","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 {FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {mergeProps} 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) {\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 (!e.currentTarget.contains(e.target)) {\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          focusManager.focusNext();\n        } else {\n          focusManager.focusPrevious();\n        }\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          focusManager.focusPrevious();\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?.target as FocusableElement;\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 !== 'mouse') {\n        focusLast();\n      }\n    }\n  });\n\n  return mergeProps(pressProps, {onKeyDown});\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.main.js.map"}

package/dist/useDatePickerGroup.mjs

@@ -41,6 +41,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
     // Focus the first placeholder segment from the end on mouse down/touch up in the field.
     let focusLast = ()=>{
         var _window_event;
+        if (!ref.current) return;
         // Try to find the segment prior to the element that was clicked on.
         let target = (_window_event = window.event) === null || _window_event === void 0 ? void 0 : _window_event.target;
         let walker = (0, $7CEvq$getFocusableTreeWalker)(ref.current, {

package/dist/useDatePickerGroup.module.js

@@ -41,6 +41,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
     // Focus the first placeholder segment from the end on mouse down/touch up in the field.
     let focusLast = ()=>{
         var _window_event;
+        if (!ref.current) return;
         // Try to find the segment prior to the element that was clicked on.
         let target = (_window_event = window.event) === null || _window_event === void 0 ? void 0 : _window_event.target;
         let walker = (0, $7CEvq$getFocusableTreeWalker)(ref.current, {

package/dist/useDatePickerGroup.module.js.map

@@ -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,CAAC,QAAQ,CAAC,EAAE,MAAM,GACpC;QAGF,IAAI,EAAE,MAAM,IAAK,CAAA,EAAE,GAAG,KAAK,eAAe,EAAE,GAAG,KAAK,SAAQ,KAAM,aAAa,OAAO;YACpF,EAAE,cAAc;YAChB,EAAE,eAAe;YACjB,MAAM,OAAO,CAAC;QAChB;QAEA,IAAI,wBACF;QAGF,OAAQ,EAAE,GAAG;YACX,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,SAAS;qBAEtB,aAAa,aAAa;gBAE5B;YACF,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,aAAa;qBAE1B,aAAa,SAAS;gBAExB;QACJ;IACF;IAEA,wFAAwF;IACxF,IAAI,YAAY;YAED;QADb,oEAAoE;QACpE,IAAI,UAAS,gBAAA,OAAO,KAAK,cAAZ,oCAAA,cAAc,MAAM;QACjC,IAAI,SAAS,CAAA,GAAA,6BAAqB,EAAE,IAAI,OAAO,EAAE;YAAC,UAAU;QAAI;QAChE,IAAI,QAAQ;YACV,OAAO,WAAW,GAAG;YACrB,SAAS,OAAO,YAAY;QAC9B;QAEA,0DAA0D;QAC1D,IAAI,CAAC,QAAQ;YACX,IAAI;YACJ,GAAG;gBACD,OAAO,OAAO,SAAS;gBACvB,IAAI,MACF,SAAS;YAEb,QAAS,MAAM;QACjB;QAEA,uEAAuE;QACvE,MAAO,mBAAA,6BAAA,OAAQ,YAAY,CAAC,oBAAqB;YAC/C,IAAI,OAAO,OAAO,YAAY;YAC9B,IAAI,QAAQ,KAAK,YAAY,CAAC,qBAC5B,SAAS;iBAET;QAEJ;QAEA,IAAI,QACF,OAAO,KAAK;IAEhB;IAEA,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAC1B,qBAAqB;QACrB,2BAA2B;QAC3B,cAAa,CAAC;YACZ,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;QACA,SAAQ,CAAC;YACP,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;IACF;IAEA,OAAO,CAAA,GAAA,iBAAS,EAAE,YAAY;mBAAC;IAAS;AAC1C","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 {FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {mergeProps} 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) {\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 (!e.currentTarget.contains(e.target)) {\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          focusManager.focusNext();\n        } else {\n          focusManager.focusPrevious();\n        }\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          focusManager.focusPrevious();\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    // Try to find the segment prior to the element that was clicked on.\n    let target = window.event?.target as FocusableElement;\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 !== 'mouse') {\n        focusLast();\n      }\n    }\n  });\n\n  return mergeProps(pressProps, {onKeyDown});\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.module.js.map"}
+{"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,CAAC,QAAQ,CAAC,EAAE,MAAM,GACpC;QAGF,IAAI,EAAE,MAAM,IAAK,CAAA,EAAE,GAAG,KAAK,eAAe,EAAE,GAAG,KAAK,SAAQ,KAAM,aAAa,OAAO;YACpF,EAAE,cAAc;YAChB,EAAE,eAAe;YACjB,MAAM,OAAO,CAAC;QAChB;QAEA,IAAI,wBACF;QAGF,OAAQ,EAAE,GAAG;YACX,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,SAAS;qBAEtB,aAAa,aAAa;gBAE5B;YACF,KAAK;gBACH,EAAE,cAAc;gBAChB,EAAE,eAAe;gBACjB,IAAI,cAAc,OAChB,aAAa,aAAa;qBAE1B,aAAa,SAAS;gBAExB;QACJ;IACF;IAEA,wFAAwF;IACxF,IAAI,YAAY;YAKD;QAJb,IAAI,CAAC,IAAI,OAAO,EACd;QAEF,oEAAoE;QACpE,IAAI,UAAS,gBAAA,OAAO,KAAK,cAAZ,oCAAA,cAAc,MAAM;QACjC,IAAI,SAAS,CAAA,GAAA,6BAAqB,EAAE,IAAI,OAAO,EAAE;YAAC,UAAU;QAAI;QAChE,IAAI,QAAQ;YACV,OAAO,WAAW,GAAG;YACrB,SAAS,OAAO,YAAY;QAC9B;QAEA,0DAA0D;QAC1D,IAAI,CAAC,QAAQ;YACX,IAAI;YACJ,GAAG;gBACD,OAAO,OAAO,SAAS;gBACvB,IAAI,MACF,SAAS;YAEb,QAAS,MAAM;QACjB;QAEA,uEAAuE;QACvE,MAAO,mBAAA,6BAAA,OAAQ,YAAY,CAAC,oBAAqB;YAC/C,IAAI,OAAO,OAAO,YAAY;YAC9B,IAAI,QAAQ,KAAK,YAAY,CAAC,qBAC5B,SAAS;iBAET;QAEJ;QAEA,IAAI,QACF,OAAO,KAAK;IAEhB;IAEA,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAC1B,qBAAqB;QACrB,2BAA2B;QAC3B,cAAa,CAAC;YACZ,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;QACA,SAAQ,CAAC;YACP,IAAI,EAAE,WAAW,KAAK,SACpB;QAEJ;IACF;IAEA,OAAO,CAAA,GAAA,iBAAS,EAAE,YAAY;mBAAC;IAAS;AAC1C","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 {FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {mergeProps} 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) {\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 (!e.currentTarget.contains(e.target)) {\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          focusManager.focusNext();\n        } else {\n          focusManager.focusPrevious();\n        }\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          focusManager.focusPrevious();\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?.target as FocusableElement;\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 !== 'mouse') {\n        focusLast();\n      }\n    }\n  });\n\n  return mergeProps(pressProps, {onKeyDown});\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.module.js.map"}

package/dist/useDateRangePicker.main.js

@@ -40,7 +40,7 @@ $parcel$export(module.exports, "useDateRangePicker", () => $20f695b1b69e6b9e$exp
 
 
 function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
-    var _state_value, _state_value1;
+    var _state_value, _state_value1, _state_dateRange;
     let stringFormatter = (0, $Xt1Bd$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($c1905b78f6d2f5bf$exports))), '@react-aria/datepicker');
     let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
     let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $Xt1Bd$reactarialabel.useField)({
@@ -105,6 +105,7 @@ function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
     });
     let startFieldValidation = (0, $Xt1Bd$react.useRef)((0, $Xt1Bd$reactstatelyform.DEFAULT_VALIDATION_RESULT));
     let endFieldValidation = (0, $Xt1Bd$react.useRef)((0, $Xt1Bd$reactstatelyform.DEFAULT_VALIDATION_RESULT));
+    var _state_value_start, _state_value_end;
     return {
         groupProps: (0, $Xt1Bd$reactariautils.mergeProps)(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
             role: 'group',
@@ -143,7 +144,7 @@ function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
         startFieldProps: {
             ...startFieldProps,
             ...commonFieldProps,
-            value: (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start,
+            value: (_state_value_start = (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start) !== null && _state_value_start !== void 0 ? _state_value_start : null,
             onChange: (start)=>state.setDateTime('start', start),
             autoFocus: props.autoFocus,
             name: props.startName,
@@ -161,7 +162,7 @@ function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
         endFieldProps: {
             ...endFieldProps,
             ...commonFieldProps,
-            value: (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end,
+            value: (_state_value_end = (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end) !== null && _state_value_end !== void 0 ? _state_value_end : null,
             onChange: (end)=>state.setDateTime('end', end),
             name: props.endName,
             [(0, $Xt1Bd$reactstatelyform.privateValidationStateProp)]: {
@@ -179,7 +180,7 @@ function $20f695b1b69e6b9e$export$12fd5f0e9f4bb192(props, state, ref) {
         errorMessageProps: errorMessageProps,
         calendarProps: {
             autoFocus: true,
-            value: state.dateRange,
+            value: ((_state_dateRange = state.dateRange) === null || _state_dateRange === void 0 ? void 0 : _state_dateRange.start) && state.dateRange.end ? state.dateRange : null,
             onChange: state.setDateRange,
             minValue: props.minValue,
             maxValue: props.maxValue,

package/dist/useDateRangePicker.main.js.map

@@ -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 {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 {RangeCalendarProps} from '@react-types/calendar';\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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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,\n      onChange: start => state.setDateTime('start', start),\n      autoFocus: props.autoFocus,\n      name: props.startName,\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,\n      onChange: end => state.setDateTime('end', end),\n      name: props.endName,\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,\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.main.js.map"}
+{"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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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      onChange: start => state.setDateTime('start', start),\n      autoFocus: props.autoFocus,\n      name: props.startName,\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      onChange: end => state.setDateTime('end', end),\n      name: props.endName,\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.main.js.map"}

package/dist/useDateRangePicker.mjs

@@ -34,7 +34,7 @@ function $parcel$interopDefault(a) {
 
 
 function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
-    var _state_value, _state_value1;
+    var _state_value, _state_value1, _state_dateRange;
     let stringFormatter = (0, $eIQ1H$useLocalizedStringFormatter)((0, ($parcel$interopDefault($eIQ1H$intlStringsmodulejs))), '@react-aria/datepicker');
     let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
     let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $eIQ1H$useField)({
@@ -99,6 +99,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
     });
     let startFieldValidation = (0, $eIQ1H$useRef)((0, $eIQ1H$DEFAULT_VALIDATION_RESULT));
     let endFieldValidation = (0, $eIQ1H$useRef)((0, $eIQ1H$DEFAULT_VALIDATION_RESULT));
+    var _state_value_start, _state_value_end;
     return {
         groupProps: (0, $eIQ1H$mergeProps)(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
             role: 'group',
@@ -137,7 +138,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
         startFieldProps: {
             ...startFieldProps,
             ...commonFieldProps,
-            value: (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start,
+            value: (_state_value_start = (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start) !== null && _state_value_start !== void 0 ? _state_value_start : null,
             onChange: (start)=>state.setDateTime('start', start),
             autoFocus: props.autoFocus,
             name: props.startName,
@@ -155,7 +156,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
         endFieldProps: {
             ...endFieldProps,
             ...commonFieldProps,
-            value: (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end,
+            value: (_state_value_end = (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end) !== null && _state_value_end !== void 0 ? _state_value_end : null,
             onChange: (end)=>state.setDateTime('end', end),
             name: props.endName,
             [(0, $eIQ1H$privateValidationStateProp)]: {
@@ -173,7 +174,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
         errorMessageProps: errorMessageProps,
         calendarProps: {
             autoFocus: true,
-            value: state.dateRange,
+            value: ((_state_dateRange = state.dateRange) === null || _state_dateRange === void 0 ? void 0 : _state_dateRange.start) && state.dateRange.end ? state.dateRange : null,
             onChange: state.setDateRange,
             minValue: props.minValue,
             maxValue: props.maxValue,

package/dist/useDateRangePicker.module.js

@@ -34,7 +34,7 @@ function $parcel$interopDefault(a) {
 
 
 function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
-    var _state_value, _state_value1;
+    var _state_value, _state_value1, _state_dateRange;
     let stringFormatter = (0, $eIQ1H$useLocalizedStringFormatter)((0, ($parcel$interopDefault($eIQ1H$intlStringsmodulejs))), '@react-aria/datepicker');
     let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
     let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $eIQ1H$useField)({
@@ -99,6 +99,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
     });
     let startFieldValidation = (0, $eIQ1H$useRef)((0, $eIQ1H$DEFAULT_VALIDATION_RESULT));
     let endFieldValidation = (0, $eIQ1H$useRef)((0, $eIQ1H$DEFAULT_VALIDATION_RESULT));
+    var _state_value_start, _state_value_end;
     return {
         groupProps: (0, $eIQ1H$mergeProps)(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
             role: 'group',
@@ -137,7 +138,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
         startFieldProps: {
             ...startFieldProps,
             ...commonFieldProps,
-            value: (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start,
+            value: (_state_value_start = (_state_value = state.value) === null || _state_value === void 0 ? void 0 : _state_value.start) !== null && _state_value_start !== void 0 ? _state_value_start : null,
             onChange: (start)=>state.setDateTime('start', start),
             autoFocus: props.autoFocus,
             name: props.startName,
@@ -155,7 +156,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
         endFieldProps: {
             ...endFieldProps,
             ...commonFieldProps,
-            value: (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end,
+            value: (_state_value_end = (_state_value1 = state.value) === null || _state_value1 === void 0 ? void 0 : _state_value1.end) !== null && _state_value_end !== void 0 ? _state_value_end : null,
             onChange: (end)=>state.setDateTime('end', end),
             name: props.endName,
             [(0, $eIQ1H$privateValidationStateProp)]: {
@@ -173,7 +174,7 @@ function $887cac91b7cc8801$export$12fd5f0e9f4bb192(props, state, ref) {
         errorMessageProps: errorMessageProps,
         calendarProps: {
             autoFocus: true,
-            value: state.dateRange,
+            value: ((_state_dateRange = state.dateRange) === null || _state_dateRange === void 0 ? void 0 : _state_dateRange.start) && state.dateRange.end ? state.dateRange : null,
             onChange: state.setDateRange,
             minValue: props.minValue,
             maxValue: props.maxValue,

package/dist/useDateRangePicker.module.js.map

@@ -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 {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 {RangeCalendarProps} from '@react-types/calendar';\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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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,\n      onChange: start => state.setDateTime('start', start),\n      autoFocus: props.autoFocus,\n      name: props.startName,\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,\n      onChange: end => state.setDateTime('end', end),\n      name: props.endName,\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,\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.module.js.map"}
+{"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 {focusWithinProps} = useFocusWithin({\n    ...props,\n    isDisabled: state.isOpen,\n    onBlurWithin: props.onBlur,\n    onFocusWithin: props.onFocus,\n    onFocusWithinChange: props.onFocusChange\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      onChange: start => state.setDateTime('start', start),\n      autoFocus: props.autoFocus,\n      name: props.startName,\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      onChange: end => state.setDateTime('end', end),\n      name: props.endName,\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    },\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useDateRangePicker.module.js.map"}

package/dist/useDateSegment.main.js

@@ -86,11 +86,11 @@ function $5c015c6316d1904d$export$1315d136e6f7581(segment, state, ref) {
         },
         onIncrementToMax: ()=>{
             enteredKeys.current = '';
-            state.setSegment(segment.type, segment.maxValue);
+            if (segment.maxValue !== undefined) state.setSegment(segment.type, segment.maxValue);
         },
         onDecrementToMin: ()=>{
             enteredKeys.current = '';
-            state.setSegment(segment.type, segment.minValue);
+            if (segment.minValue !== undefined) state.setSegment(segment.type, segment.minValue);
         }
     });
     let parser = (0, $5Tgzj$react.useMemo)(()=>new (0, $5Tgzj$internationalizednumber.NumberParser)(locale, {
@@ -220,12 +220,12 @@ function $5c015c6316d1904d$export$1315d136e6f7581(segment, state, ref) {
                                 if (numberValue > 12) segmentValue = parser.parse(key);
                                 break;
                         }
-                        if (segment.value >= 12 && numberValue > 1) numberValue += 12;
-                    } else if (numberValue > segment.maxValue) segmentValue = parser.parse(key);
+                        if (segment.value !== undefined && segment.value >= 12 && numberValue > 1) numberValue += 12;
+                    } else if (segment.maxValue !== undefined && numberValue > segment.maxValue) segmentValue = parser.parse(key);
                     if (isNaN(numberValue)) return;
                     let shouldSetValue = segmentValue !== 0 || allowsZero;
                     if (shouldSetValue) state.setSegment(segment.type, segmentValue);
-                    if (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length) {
+                    if (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {
                         enteredKeys.current = '';
                         if (shouldSetValue) focusManager.focusNext();
                     } else enteredKeys.current = newValue;
@@ -235,24 +235,25 @@ function $5c015c6316d1904d$export$1315d136e6f7581(segment, state, ref) {
     };
     let onFocus = ()=>{
         enteredKeys.current = '';
-        (0, $5Tgzj$reactariautils.scrollIntoViewport)(ref.current, {
+        if (ref.current) (0, $5Tgzj$reactariautils.scrollIntoViewport)(ref.current, {
             containingElement: (0, $5Tgzj$reactariautils.getScrollParent)(ref.current)
         });
         // Collapse selection to start or Chrome won't fire input events.
         let selection = window.getSelection();
-        selection.collapse(ref.current);
+        selection === null || selection === void 0 ? void 0 : selection.collapse(ref.current);
     };
     let documentRef = (0, $5Tgzj$react.useRef)(typeof document !== 'undefined' ? document : null);
     (0, $5Tgzj$reactariautils.useEvent)(documentRef, 'selectionchange', ()=>{
+        var _ref_current;
         // Enforce that the selection is collapsed when inside a date segment.
         // Otherwise, when tapping on a segment in Android Chrome and then entering text,
         // composition events will be fired that break the DOM structure and crash the page.
         let selection = window.getSelection();
-        if (ref.current && ref.current.contains(selection.anchorNode)) selection.collapse(ref.current);
+        if ((selection === null || selection === void 0 ? void 0 : selection.anchorNode) && ((_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.contains(selection === null || selection === void 0 ? void 0 : selection.anchorNode))) selection.collapse(ref.current);
     });
     let compositionRef = (0, $5Tgzj$react.useRef)('');
-    // @ts-ignore - TODO: possibly old TS version? doesn't fail in my editor...
     (0, $5Tgzj$reactariautils.useEvent)(ref, 'beforeinput', (e)=>{
+        if (!ref.current) return;
         e.preventDefault();
         switch(e.inputType){
             case 'deleteContentBackward':
@@ -277,10 +278,10 @@ function $5c015c6316d1904d$export$1315d136e6f7581(segment, state, ref) {
         switch(inputType){
             case 'insertCompositionText':
                 // Reset the DOM to how it was in the beforeinput event.
-                ref.current.textContent = compositionRef.current;
+                if (ref.current) ref.current.textContent = compositionRef.current;
                 // Android sometimes fires key presses of letters as composition events. Need to handle am/pm keys here too.
                 // Can also happen e.g. with Pinyin keyboard on iOS.
-                if (startsWith(am, data) || startsWith(pm, data)) onInput(data);
+                if (data != null && (startsWith(am, data) || startsWith(pm, data))) onInput(data);
                 break;
         }
     });