@react-spectrum/s2 0.10.1 → 0.11.0

package/dist/DatePicker.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DatePicker as AriaDatePicker,\n  DatePickerProps as AriaDatePickerProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  DateValue,\n  Dialog,\n  FormContext,\n  OverlayTriggerStateContext,\n  Provider,\n  TimeValue\n} from 'react-aria-components';\nimport {baseColor, focusRing, fontRelative, space, style} from '../style' with {type: 'macro'};\nimport {Calendar, CalendarProps, IconContext, TimeField} from '../';\nimport CalendarIcon from '../s2wf-icons/S2_Icon_Calendar_20_N.svg';\nimport {controlBorderRadius, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, PropsWithChildren, ReactElement, Ref, useContext, useRef, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DatePickerProps<T extends DateValue> extends\n  Omit<AriaDatePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<CalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DatePickerContext = createContext<ContextValue<Partial<DatePickerProps<any>>, HTMLDivElement>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n  ...focusRing(),\n  ...controlBorderRadius('sm'),\n  position: 'relative',\n  font: {\n    size: {\n      S: 'ui-sm',\n      M: 'ui',\n      L: 'ui-lg',\n      XL: 'ui-xl'\n    }\n  },\n  cursor: 'default',\n  display: 'flex',\n  textAlign: 'center',\n  borderStyle: 'none',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: 'text-to-control',\n  aspectRatio: 'square',\n  flexShrink: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isOpen: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isDisabled: 'disabled',\n    forcedColors: 'ButtonFace'\n  }\n});\n\nexport const timeField = style({\n  flexShrink: 1,\n  flexGrow: 0,\n  minWidth: 0,\n  width: 'unset'\n});\n\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(\n  props: DatePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DatePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    firstDayOfWeek,\n    createCalendar,\n    pageBehavior,\n    isDateUnavailable,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDatePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue ?? undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: {\n                  size: {\n                    S: 2,\n                    M: 4,\n                    L: space(6),\n                    XL: space(6)\n                  }\n                }\n              })({size})}>\n              <DateInputContainer>\n                <DateInput />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n            </FieldGroup>\n            <CalendarPopover>\n              <Calendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar}\n                firstDayOfWeek={firstDayOfWeek}\n                isDateUnavailable={isDateUnavailable}\n                pageBehavior={pageBehavior} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size'})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.time')}\n                    value={state.timeValue}\n                    // TODO: why do i need the cast?\n                    onChange={v => state.setTimeValue(v as TimeValue)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDatePicker>\n  );\n});\n\nexport function CalendarPopover(props: PropsWithChildren): ReactElement {\n  return (\n    <PopoverBase\n      hideArrow\n      styles={style({\n        paddingX: 16,\n        paddingY: 32,\n        overflow: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 16\n      })}>\n      <Dialog>\n        <Provider\n          values={[\n            [OverlayTriggerStateContext, null]\n          ]}>\n          {props.children}\n        </Provider>\n      </Dialog>\n    </PopoverBase>\n  );\n}\n\n\nexport function CalendarButton(props: {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL', setButtonHasFocus: (hasFocus: boolean) => void}): ReactElement {\n  let buttonRef = useRef<HTMLButtonElement>(null);\n  let {isOpen, size, setButtonHasFocus} = props;\n  return (\n    <Button\n      ref={buttonRef}\n      // Prevent press scale from sticking while DatePicker is open.\n      // @ts-ignore\n      isPressed={false}\n      onFocusChange={setButtonHasFocus}\n      style={pressScale(buttonRef)}\n      className={renderProps => inputButton({\n        ...renderProps,\n        size,\n        isOpen\n      })}>\n      <Provider\n        values={[\n          [IconContext, {\n            styles: style({\n              '--iconPrimary': {\n                type: 'fill',\n                value: 'currentColor'\n              },\n              size: fontRelative(14)\n            })\n          }]\n        ]}>\n        <CalendarIcon />\n      </Provider>\n    </Button>\n  );\n}\n"],"names":[],"version":3,"file":"DatePicker.cjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DatePicker as AriaDatePicker,\n  DatePickerProps as AriaDatePickerProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  DateValue,\n  Dialog,\n  FormContext,\n  OverlayTriggerStateContext,\n  Provider,\n  TimeValue\n} from 'react-aria-components';\nimport {baseColor, focusRing, fontRelative, space, style} from '../style' with {type: 'macro'};\nimport {Calendar, CalendarProps, IconContext, TimeField} from '../';\nimport CalendarIcon from '../s2wf-icons/S2_Icon_Calendar_20_N.svg';\nimport {controlBorderRadius, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, PropsWithChildren, ReactElement, Ref, useContext, useRef, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DatePickerProps<T extends DateValue> extends\n  Omit<AriaDatePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<CalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DatePickerContext = createContext<ContextValue<Partial<DatePickerProps<any>>, HTMLDivElement>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n  ...focusRing(),\n  ...controlBorderRadius('sm'),\n  position: 'relative',\n  font: {\n    size: {\n      S: 'ui-sm',\n      M: 'ui',\n      L: 'ui-lg',\n      XL: 'ui-xl'\n    }\n  },\n  cursor: 'default',\n  display: 'flex',\n  textAlign: 'center',\n  borderStyle: 'none',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: 'text-to-control',\n  aspectRatio: 'square',\n  flexShrink: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isOpen: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isDisabled: 'disabled',\n    forcedColors: 'ButtonFace'\n  }\n});\n\nexport const timeField = style({\n  flexShrink: 1,\n  flexGrow: 0,\n  minWidth: 0,\n  width: 'unset'\n});\n\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(\n  props: DatePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DatePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    createCalendar,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDatePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue ?? undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: {\n                  size: {\n                    S: 2,\n                    M: 4,\n                    L: space(6),\n                    XL: space(6)\n                  }\n                }\n              })({size})}>\n              <DateInputContainer>\n                <DateInput />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n            </FieldGroup>\n            <CalendarPopover>\n              <Calendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size'})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.time')}\n                    value={state.timeValue}\n                    // TODO: why do i need the cast?\n                    onChange={v => state.setTimeValue(v as TimeValue)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDatePicker>\n  );\n});\n\nexport function CalendarPopover(props: PropsWithChildren): ReactElement {\n  return (\n    <PopoverBase\n      hideArrow\n      styles={style({\n        paddingX: 16,\n        paddingY: 32,\n        overflow: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 16\n      })}>\n      <Dialog>\n        <Provider\n          values={[\n            [OverlayTriggerStateContext, null]\n          ]}>\n          {props.children}\n        </Provider>\n      </Dialog>\n    </PopoverBase>\n  );\n}\n\n\nexport function CalendarButton(props: {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL', setButtonHasFocus: (hasFocus: boolean) => void}): ReactElement {\n  let buttonRef = useRef<HTMLButtonElement>(null);\n  let {isOpen, size, setButtonHasFocus} = props;\n  return (\n    <Button\n      ref={buttonRef}\n      // Prevent press scale from sticking while DatePicker is open.\n      // @ts-ignore\n      isPressed={false}\n      onFocusChange={setButtonHasFocus}\n      style={pressScale(buttonRef)}\n      className={renderProps => inputButton({\n        ...renderProps,\n        size,\n        isOpen\n      })}>\n      <Provider\n        values={[\n          [IconContext, {\n            styles: style({\n              '--iconPrimary': {\n                type: 'fill',\n                value: 'currentColor'\n              },\n              size: fontRelative(14)\n            })\n          }]\n        ]}>\n        <CalendarIcon />\n      </Provider>\n    </Button>\n  );\n}\n"],"names":[],"version":3,"file":"DatePicker.cjs.map"}

package/dist/DatePicker.css.map

@@ -1 +1 @@
-{"mappings":"AC8DoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAoDK;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA0CmB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA8BtB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA2BU;;;;EAkClB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwCM;;;;EAAA;;;;EAAA;;;;;AAjOA;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AA4HE;EAAA;IAAA","sources":["d4ca8e646fea5360","packages/@react-spectrum/s2/src/DatePicker.tsx"],"sourcesContent":["@import \"54172f634399832c\";\n@import \"fa2321f9143b745c\";\n@import \"8b549979924a612a\";\n@import \"b86e209972e15459\";\n@import \"8b256a2bed52f067\";\n@import \"5e26ccdc056a4ced\";\n@import \"fb93b5d68257fecd\";\n","/*\n * Copyright 2024 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 {\n  DatePicker as AriaDatePicker,\n  DatePickerProps as AriaDatePickerProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  DateValue,\n  Dialog,\n  FormContext,\n  OverlayTriggerStateContext,\n  Provider,\n  TimeValue\n} from 'react-aria-components';\nimport {baseColor, focusRing, fontRelative, space, style} from '../style' with {type: 'macro'};\nimport {Calendar, CalendarProps, IconContext, TimeField} from '../';\nimport CalendarIcon from '../s2wf-icons/S2_Icon_Calendar_20_N.svg';\nimport {controlBorderRadius, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, PropsWithChildren, ReactElement, Ref, useContext, useRef, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DatePickerProps<T extends DateValue> extends\n  Omit<AriaDatePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<CalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DatePickerContext = createContext<ContextValue<Partial<DatePickerProps<any>>, HTMLDivElement>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n  ...focusRing(),\n  ...controlBorderRadius('sm'),\n  position: 'relative',\n  font: {\n    size: {\n      S: 'ui-sm',\n      M: 'ui',\n      L: 'ui-lg',\n      XL: 'ui-xl'\n    }\n  },\n  cursor: 'default',\n  display: 'flex',\n  textAlign: 'center',\n  borderStyle: 'none',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: 'text-to-control',\n  aspectRatio: 'square',\n  flexShrink: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isOpen: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isDisabled: 'disabled',\n    forcedColors: 'ButtonFace'\n  }\n});\n\nexport const timeField = style({\n  flexShrink: 1,\n  flexGrow: 0,\n  minWidth: 0,\n  width: 'unset'\n});\n\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(\n  props: DatePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DatePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    firstDayOfWeek,\n    createCalendar,\n    pageBehavior,\n    isDateUnavailable,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDatePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue ?? undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: {\n                  size: {\n                    S: 2,\n                    M: 4,\n                    L: space(6),\n                    XL: space(6)\n                  }\n                }\n              })({size})}>\n              <DateInputContainer>\n                <DateInput />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n            </FieldGroup>\n            <CalendarPopover>\n              <Calendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar}\n                firstDayOfWeek={firstDayOfWeek}\n                isDateUnavailable={isDateUnavailable}\n                pageBehavior={pageBehavior} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size'})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.time')}\n                    value={state.timeValue}\n                    // TODO: why do i need the cast?\n                    onChange={v => state.setTimeValue(v as TimeValue)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDatePicker>\n  );\n});\n\nexport function CalendarPopover(props: PropsWithChildren): ReactElement {\n  return (\n    <PopoverBase\n      hideArrow\n      styles={style({\n        paddingX: 16,\n        paddingY: 32,\n        overflow: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 16\n      })}>\n      <Dialog>\n        <Provider\n          values={[\n            [OverlayTriggerStateContext, null]\n          ]}>\n          {props.children}\n        </Provider>\n      </Dialog>\n    </PopoverBase>\n  );\n}\n\n\nexport function CalendarButton(props: {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL', setButtonHasFocus: (hasFocus: boolean) => void}): ReactElement {\n  let buttonRef = useRef<HTMLButtonElement>(null);\n  let {isOpen, size, setButtonHasFocus} = props;\n  return (\n    <Button\n      ref={buttonRef}\n      // Prevent press scale from sticking while DatePicker is open.\n      // @ts-ignore\n      isPressed={false}\n      onFocusChange={setButtonHasFocus}\n      style={pressScale(buttonRef)}\n      className={renderProps => inputButton({\n        ...renderProps,\n        size,\n        isOpen\n      })}>\n      <Provider\n        values={[\n          [IconContext, {\n            styles: style({\n              '--iconPrimary': {\n                type: 'fill',\n                value: 'currentColor'\n              },\n              size: fontRelative(14)\n            })\n          }]\n        ]}>\n        <CalendarIcon />\n      </Provider>\n    </Button>\n  );\n}\n"],"names":[],"version":3,"file":"DatePicker.css.map"}
+{"mappings":"AC8DoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAoDK;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAuCmB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA8BtB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBU;;;;EAkClB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwCM;;;;EAAA;;;;EAAA;;;;;AA3NA;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAyHE;EAAA;IAAA","sources":["d4ca8e646fea5360","packages/@react-spectrum/s2/src/DatePicker.tsx"],"sourcesContent":["@import \"54172f634399832c\";\n@import \"fa2321f9143b745c\";\n@import \"8b549979924a612a\";\n@import \"b86e209972e15459\";\n@import \"8b256a2bed52f067\";\n@import \"5e26ccdc056a4ced\";\n@import \"fb93b5d68257fecd\";\n","/*\n * Copyright 2024 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 {\n  DatePicker as AriaDatePicker,\n  DatePickerProps as AriaDatePickerProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  DateValue,\n  Dialog,\n  FormContext,\n  OverlayTriggerStateContext,\n  Provider,\n  TimeValue\n} from 'react-aria-components';\nimport {baseColor, focusRing, fontRelative, space, style} from '../style' with {type: 'macro'};\nimport {Calendar, CalendarProps, IconContext, TimeField} from '../';\nimport CalendarIcon from '../s2wf-icons/S2_Icon_Calendar_20_N.svg';\nimport {controlBorderRadius, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, PropsWithChildren, ReactElement, Ref, useContext, useRef, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DatePickerProps<T extends DateValue> extends\n  Omit<AriaDatePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<CalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DatePickerContext = createContext<ContextValue<Partial<DatePickerProps<any>>, HTMLDivElement>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n  ...focusRing(),\n  ...controlBorderRadius('sm'),\n  position: 'relative',\n  font: {\n    size: {\n      S: 'ui-sm',\n      M: 'ui',\n      L: 'ui-lg',\n      XL: 'ui-xl'\n    }\n  },\n  cursor: 'default',\n  display: 'flex',\n  textAlign: 'center',\n  borderStyle: 'none',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: 'text-to-control',\n  aspectRatio: 'square',\n  flexShrink: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isOpen: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isDisabled: 'disabled',\n    forcedColors: 'ButtonFace'\n  }\n});\n\nexport const timeField = style({\n  flexShrink: 1,\n  flexGrow: 0,\n  minWidth: 0,\n  width: 'unset'\n});\n\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(\n  props: DatePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DatePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    createCalendar,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDatePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue ?? undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: {\n                  size: {\n                    S: 2,\n                    M: 4,\n                    L: space(6),\n                    XL: space(6)\n                  }\n                }\n              })({size})}>\n              <DateInputContainer>\n                <DateInput />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n            </FieldGroup>\n            <CalendarPopover>\n              <Calendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size'})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.time')}\n                    value={state.timeValue}\n                    // TODO: why do i need the cast?\n                    onChange={v => state.setTimeValue(v as TimeValue)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDatePicker>\n  );\n});\n\nexport function CalendarPopover(props: PropsWithChildren): ReactElement {\n  return (\n    <PopoverBase\n      hideArrow\n      styles={style({\n        paddingX: 16,\n        paddingY: 32,\n        overflow: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 16\n      })}>\n      <Dialog>\n        <Provider\n          values={[\n            [OverlayTriggerStateContext, null]\n          ]}>\n          {props.children}\n        </Provider>\n      </Dialog>\n    </PopoverBase>\n  );\n}\n\n\nexport function CalendarButton(props: {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL', setButtonHasFocus: (hasFocus: boolean) => void}): ReactElement {\n  let buttonRef = useRef<HTMLButtonElement>(null);\n  let {isOpen, size, setButtonHasFocus} = props;\n  return (\n    <Button\n      ref={buttonRef}\n      // Prevent press scale from sticking while DatePicker is open.\n      // @ts-ignore\n      isPressed={false}\n      onFocusChange={setButtonHasFocus}\n      style={pressScale(buttonRef)}\n      className={renderProps => inputButton({\n        ...renderProps,\n        size,\n        isOpen\n      })}>\n      <Provider\n        values={[\n          [IconContext, {\n            styles: style({\n              '--iconPrimary': {\n                type: 'fill',\n                value: 'currentColor'\n              },\n              size: fontRelative(14)\n            })\n          }]\n        ]}>\n        <CalendarIcon />\n      </Provider>\n    </Button>\n  );\n}\n"],"names":[],"version":3,"file":"DatePicker.css.map"}

package/dist/DatePicker.mjs

@@ -193,7 +193,7 @@ const $1196aa313ab37be1$export$5320dd0e349ed44d = " _vb11 _ua11 Na11 Ze4mUs11";
 const $1196aa313ab37be1$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $djrek$forwardRef)(function DatePicker(props1, ref) {
     [props1, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props1, ref, $1196aa313ab37be1$export$cf316c7f3b44c11e);
     let stringFormatter = (0, $djrek$useLocalizedStringFormatter)((0, ($parcel$interopDefault($djrek$intlStringsmjs))), '@react-spectrum/s2');
-    let { label: label, contextualHelp: contextualHelp, description: descriptionMessage, errorMessage: errorMessage, isRequired: isRequired, size: size = 'M', labelPosition: labelPosition = 'top', necessityIndicator: necessityIndicator, labelAlign: labelAlign = 'start', UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, firstDayOfWeek: firstDayOfWeek, createCalendar: createCalendar, pageBehavior: pageBehavior, isDateUnavailable: isDateUnavailable, ...dateFieldProps } = props1;
+    let { label: label, contextualHelp: contextualHelp, description: descriptionMessage, errorMessage: errorMessage, isRequired: isRequired, size: size = 'M', labelPosition: labelPosition = 'top', necessityIndicator: necessityIndicator, labelAlign: labelAlign = 'start', UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, createCalendar: createCalendar, ...dateFieldProps } = props1;
     let formContext = (0, $djrek$useContext)((0, $djrek$FormContext));
     let [buttonHasFocus, setButtonHasFocus] = (0, $djrek$useState)(false);
     return /*#__PURE__*/ (0, $djrek$jsx)((0, $djrek$DatePicker), {
@@ -337,10 +337,7 @@ const $1196aa313ab37be1$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $djrek$forwa
                         children: [
                             /*#__PURE__*/ (0, $djrek$jsx)((0, $f06f4d5597ad704c$export$e1aef45b828286de), {
                                 visibleMonths: maxVisibleMonths,
-                                createCalendar: createCalendar,
-                                firstDayOfWeek: firstDayOfWeek,
-                                isDateUnavailable: isDateUnavailable,
-                                pageBehavior: pageBehavior
+                                createCalendar: createCalendar
                             }),
                             showTimeField && /*#__PURE__*/ (0, $djrek$jsx)("div", {
                                 className: " sd11 Ul11 ql11 _qb11",

package/dist/DatePicker.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DatePicker as AriaDatePicker,\n  DatePickerProps as AriaDatePickerProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  DateValue,\n  Dialog,\n  FormContext,\n  OverlayTriggerStateContext,\n  Provider,\n  TimeValue\n} from 'react-aria-components';\nimport {baseColor, focusRing, fontRelative, space, style} from '../style' with {type: 'macro'};\nimport {Calendar, CalendarProps, IconContext, TimeField} from '../';\nimport CalendarIcon from '../s2wf-icons/S2_Icon_Calendar_20_N.svg';\nimport {controlBorderRadius, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, PropsWithChildren, ReactElement, Ref, useContext, useRef, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DatePickerProps<T extends DateValue> extends\n  Omit<AriaDatePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<CalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DatePickerContext = createContext<ContextValue<Partial<DatePickerProps<any>>, HTMLDivElement>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n  ...focusRing(),\n  ...controlBorderRadius('sm'),\n  position: 'relative',\n  font: {\n    size: {\n      S: 'ui-sm',\n      M: 'ui',\n      L: 'ui-lg',\n      XL: 'ui-xl'\n    }\n  },\n  cursor: 'default',\n  display: 'flex',\n  textAlign: 'center',\n  borderStyle: 'none',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: 'text-to-control',\n  aspectRatio: 'square',\n  flexShrink: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isOpen: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isDisabled: 'disabled',\n    forcedColors: 'ButtonFace'\n  }\n});\n\nexport const timeField = style({\n  flexShrink: 1,\n  flexGrow: 0,\n  minWidth: 0,\n  width: 'unset'\n});\n\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(\n  props: DatePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DatePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    firstDayOfWeek,\n    createCalendar,\n    pageBehavior,\n    isDateUnavailable,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDatePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue ?? undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: {\n                  size: {\n                    S: 2,\n                    M: 4,\n                    L: space(6),\n                    XL: space(6)\n                  }\n                }\n              })({size})}>\n              <DateInputContainer>\n                <DateInput />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n            </FieldGroup>\n            <CalendarPopover>\n              <Calendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar}\n                firstDayOfWeek={firstDayOfWeek}\n                isDateUnavailable={isDateUnavailable}\n                pageBehavior={pageBehavior} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size'})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.time')}\n                    value={state.timeValue}\n                    // TODO: why do i need the cast?\n                    onChange={v => state.setTimeValue(v as TimeValue)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDatePicker>\n  );\n});\n\nexport function CalendarPopover(props: PropsWithChildren): ReactElement {\n  return (\n    <PopoverBase\n      hideArrow\n      styles={style({\n        paddingX: 16,\n        paddingY: 32,\n        overflow: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 16\n      })}>\n      <Dialog>\n        <Provider\n          values={[\n            [OverlayTriggerStateContext, null]\n          ]}>\n          {props.children}\n        </Provider>\n      </Dialog>\n    </PopoverBase>\n  );\n}\n\n\nexport function CalendarButton(props: {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL', setButtonHasFocus: (hasFocus: boolean) => void}): ReactElement {\n  let buttonRef = useRef<HTMLButtonElement>(null);\n  let {isOpen, size, setButtonHasFocus} = props;\n  return (\n    <Button\n      ref={buttonRef}\n      // Prevent press scale from sticking while DatePicker is open.\n      // @ts-ignore\n      isPressed={false}\n      onFocusChange={setButtonHasFocus}\n      style={pressScale(buttonRef)}\n      className={renderProps => inputButton({\n        ...renderProps,\n        size,\n        isOpen\n      })}>\n      <Provider\n        values={[\n          [IconContext, {\n            styles: style({\n              '--iconPrimary': {\n                type: 'fill',\n                value: 'currentColor'\n              },\n              size: fontRelative(14)\n            })\n          }]\n        ]}>\n        <CalendarIcon />\n      </Provider>\n    </Button>\n  );\n}\n"],"names":[],"version":3,"file":"DatePicker.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DatePicker as AriaDatePicker,\n  DatePickerProps as AriaDatePickerProps,\n  Button,\n  ButtonRenderProps,\n  ContextValue,\n  DateValue,\n  Dialog,\n  FormContext,\n  OverlayTriggerStateContext,\n  Provider,\n  TimeValue\n} from 'react-aria-components';\nimport {baseColor, focusRing, fontRelative, space, style} from '../style' with {type: 'macro'};\nimport {Calendar, CalendarProps, IconContext, TimeField} from '../';\nimport CalendarIcon from '../s2wf-icons/S2_Icon_Calendar_20_N.svg';\nimport {controlBorderRadius, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, PropsWithChildren, ReactElement, Ref, useContext, useRef, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DatePickerProps<T extends DateValue> extends\n  Omit<AriaDatePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<CalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DatePickerContext = createContext<ContextValue<Partial<DatePickerProps<any>>, HTMLDivElement>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n  ...focusRing(),\n  ...controlBorderRadius('sm'),\n  position: 'relative',\n  font: {\n    size: {\n      S: 'ui-sm',\n      M: 'ui',\n      L: 'ui-lg',\n      XL: 'ui-xl'\n    }\n  },\n  cursor: 'default',\n  display: 'flex',\n  textAlign: 'center',\n  borderStyle: 'none',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32\n    }\n  },\n  height: 'auto',\n  marginStart: 'text-to-control',\n  aspectRatio: 'square',\n  flexShrink: 0,\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  backgroundColor: {\n    default: baseColor('gray-100'),\n    isOpen: 'gray-200',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isHovered: 'Highlight',\n      isOpen: 'Highlight',\n      isDisabled: 'GrayText'\n    }\n  },\n  color: {\n    default: baseColor('neutral'),\n    isDisabled: 'disabled',\n    forcedColors: 'ButtonFace'\n  }\n});\n\nexport const timeField = style({\n  flexShrink: 1,\n  flexGrow: 0,\n  minWidth: 0,\n  width: 'unset'\n});\n\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(\n  props: DatePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DatePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    createCalendar,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDatePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue ?? undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour' || state.granularity === 'minute' || state.granularity === 'second' ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: {\n                  size: {\n                    S: 2,\n                    M: 4,\n                    L: space(6),\n                    XL: space(6)\n                  }\n                }\n              })({size})}>\n              <DateInputContainer>\n                <DateInput />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n            </FieldGroup>\n            <CalendarPopover>\n              <Calendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size'})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.time')}\n                    value={state.timeValue}\n                    // TODO: why do i need the cast?\n                    onChange={v => state.setTimeValue(v as TimeValue)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDatePicker>\n  );\n});\n\nexport function CalendarPopover(props: PropsWithChildren): ReactElement {\n  return (\n    <PopoverBase\n      hideArrow\n      styles={style({\n        paddingX: 16,\n        paddingY: 32,\n        overflow: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 16\n      })}>\n      <Dialog>\n        <Provider\n          values={[\n            [OverlayTriggerStateContext, null]\n          ]}>\n          {props.children}\n        </Provider>\n      </Dialog>\n    </PopoverBase>\n  );\n}\n\n\nexport function CalendarButton(props: {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL', setButtonHasFocus: (hasFocus: boolean) => void}): ReactElement {\n  let buttonRef = useRef<HTMLButtonElement>(null);\n  let {isOpen, size, setButtonHasFocus} = props;\n  return (\n    <Button\n      ref={buttonRef}\n      // Prevent press scale from sticking while DatePicker is open.\n      // @ts-ignore\n      isPressed={false}\n      onFocusChange={setButtonHasFocus}\n      style={pressScale(buttonRef)}\n      className={renderProps => inputButton({\n        ...renderProps,\n        size,\n        isOpen\n      })}>\n      <Provider\n        values={[\n          [IconContext, {\n            styles: style({\n              '--iconPrimary': {\n                type: 'fill',\n                value: 'currentColor'\n              },\n              size: fontRelative(14)\n            })\n          }]\n        ]}>\n        <CalendarIcon />\n      </Provider>\n    </Button>\n  );\n}\n"],"names":[],"version":3,"file":"DatePicker.mjs.map"}

package/dist/DateRangePicker.cjs

@@ -46,7 +46,7 @@ const $932c2841127a87c7$export$8282edba42ee28a = /*#__PURE__*/ (0, $bwmQw$react.
 const $932c2841127a87c7$export$17334619f3ac2224 = /*#__PURE__*/ (0, $bwmQw$react.forwardRef)(function DateRangePicker(props, ref) {
     [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $932c2841127a87c7$export$8282edba42ee28a);
     let stringFormatter = (0, $bwmQw$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
-    let { label: label, contextualHelp: contextualHelp, description: descriptionMessage, errorMessage: errorMessage, isRequired: isRequired, size: size = 'M', labelPosition: labelPosition = 'top', necessityIndicator: necessityIndicator, labelAlign: labelAlign = 'start', UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, firstDayOfWeek: firstDayOfWeek, createCalendar: createCalendar, pageBehavior: pageBehavior, isDateUnavailable: isDateUnavailable, ...dateFieldProps } = props;
+    let { label: label, contextualHelp: contextualHelp, description: descriptionMessage, errorMessage: errorMessage, isRequired: isRequired, size: size = 'M', labelPosition: labelPosition = 'top', necessityIndicator: necessityIndicator, labelAlign: labelAlign = 'start', UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, createCalendar: createCalendar, ...dateFieldProps } = props;
     let formContext = (0, $bwmQw$react.useContext)((0, $bwmQw$reactariacomponents.FormContext));
     let [buttonHasFocus, setButtonHasFocus] = (0, $bwmQw$react.useState)(false);
     return /*#__PURE__*/ (0, $bwmQw$reactjsxruntime.jsx)((0, $bwmQw$reactariacomponents.DateRangePicker), {
@@ -202,10 +202,7 @@ const $932c2841127a87c7$export$17334619f3ac2224 = /*#__PURE__*/ (0, $bwmQw$react
                         children: [
                             /*#__PURE__*/ (0, $bwmQw$reactjsxruntime.jsx)((0, $ad2936801c627ac5$exports.RangeCalendar), {
                                 visibleMonths: maxVisibleMonths,
-                                createCalendar: createCalendar,
-                                firstDayOfWeek: firstDayOfWeek,
-                                isDateUnavailable: isDateUnavailable,
-                                pageBehavior: pageBehavior
+                                createCalendar: createCalendar
                             }),
                             showTimeField && /*#__PURE__*/ (0, $bwmQw$reactjsxruntime.jsxs)("div", {
                                 className: " sd11 Ul11 ql11 _qb11 JA11",

package/dist/DateRangePicker.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DateRangePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DateRangePicker as AriaDateRangePicker,\n  DateRangePickerProps as AriaDateRangePickerProps,\n  ContextValue,\n  DateValue,\n  FormContext\n} from 'react-aria-components';\nimport {CalendarButton, CalendarPopover, timeField} from './DatePicker';\nimport {createContext, forwardRef, ReactElement, Ref, useContext, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {RangeCalendar, RangeCalendarProps, TimeField} from '../';\nimport {style} from '../style' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DateRangePickerProps<T extends DateValue> extends\n  Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<RangeCalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DateRangePickerContext = createContext<ContextValue<Partial<DateRangePickerProps<any>>, HTMLDivElement>>(null);\n\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(\n  props: DateRangePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DateRangePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    firstDayOfWeek,\n    createCalendar,\n    pageBehavior,\n    isDateUnavailable,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDateRangePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue || undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour'\n          || state.granularity === 'minute'\n          || state.granularity === 'second'\n            ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: 4\n              })({size})}>\n              <DateInputContainer>\n                <DateInput slot=\"start\" />\n                <span aria-hidden=\"true\" className={style({flexShrink: 0, flexGrow: 0, paddingX: 2})}>–</span>\n                <DateInput slot=\"end\" />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <div\n                className={style({\n                  flexShrink: 0,\n                  flexGrow: 1,\n                  display: 'flex',\n                  justifyContent: 'end'\n                })}>\n                <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n              </div>\n            </FieldGroup>\n            <CalendarPopover>\n              <RangeCalendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar}\n                firstDayOfWeek={firstDayOfWeek}\n                isDateUnavailable={isDateUnavailable}\n                pageBehavior={pageBehavior} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size', marginTop: 24})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.startTime')}\n                    value={state.timeRange?.start || null}\n                    onChange={v => state.setTime('start', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.endTime')}\n                    value={state.timeRange?.end || null}\n                    onChange={v => state.setTime('end', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDateRangePicker>\n  );\n});\n"],"names":[],"version":3,"file":"DateRangePicker.cjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DateRangePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DateRangePicker as AriaDateRangePicker,\n  DateRangePickerProps as AriaDateRangePickerProps,\n  ContextValue,\n  DateValue,\n  FormContext\n} from 'react-aria-components';\nimport {CalendarButton, CalendarPopover, timeField} from './DatePicker';\nimport {createContext, forwardRef, ReactElement, Ref, useContext, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {RangeCalendar, RangeCalendarProps, TimeField} from '../';\nimport {style} from '../style' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DateRangePickerProps<T extends DateValue> extends\n  Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<RangeCalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DateRangePickerContext = createContext<ContextValue<Partial<DateRangePickerProps<any>>, HTMLDivElement>>(null);\n\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(\n  props: DateRangePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DateRangePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    createCalendar,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDateRangePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue || undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour'\n          || state.granularity === 'minute'\n          || state.granularity === 'second'\n            ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: 4\n              })({size})}>\n              <DateInputContainer>\n                <DateInput slot=\"start\" />\n                <span aria-hidden=\"true\" className={style({flexShrink: 0, flexGrow: 0, paddingX: 2})}>–</span>\n                <DateInput slot=\"end\" />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <div\n                className={style({\n                  flexShrink: 0,\n                  flexGrow: 1,\n                  display: 'flex',\n                  justifyContent: 'end'\n                })}>\n                <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n              </div>\n            </FieldGroup>\n            <CalendarPopover>\n              <RangeCalendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size', marginTop: 24})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.startTime')}\n                    value={state.timeRange?.start || null}\n                    onChange={v => state.setTime('start', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.endTime')}\n                    value={state.timeRange?.end || null}\n                    onChange={v => state.setTime('end', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDateRangePicker>\n  );\n});\n"],"names":[],"version":3,"file":"DateRangePicker.cjs.map"}

package/dist/DateRangePicker.css.map

@@ -1 +1 @@
-{"mappings":"ACyF4C;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAiCtB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQ8B;;;;EAAA;;;;EAAA;;;;EAKzB;;;;EAAA;;;;EAAA;;;;EAiBK;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA/DY;EAAA;;;;;AAAA;EAAA;;;;;AAiCtB;EAAA;IAAA","sources":["d7a279a73f170432","packages/@react-spectrum/s2/src/DateRangePicker.tsx"],"sourcesContent":["@import \"270ce443556f6832\";\n@import \"e665ec5e30b00bf9\";\n@import \"187f6499c2fa9b0d\";\n@import \"1dda7790205ac36a\";\n@import \"b7a8eac09818aeb5\";\n","/*\n * Copyright 2024 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 {\n  DateRangePicker as AriaDateRangePicker,\n  DateRangePickerProps as AriaDateRangePickerProps,\n  ContextValue,\n  DateValue,\n  FormContext\n} from 'react-aria-components';\nimport {CalendarButton, CalendarPopover, timeField} from './DatePicker';\nimport {createContext, forwardRef, ReactElement, Ref, useContext, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {RangeCalendar, RangeCalendarProps, TimeField} from '../';\nimport {style} from '../style' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DateRangePickerProps<T extends DateValue> extends\n  Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<RangeCalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DateRangePickerContext = createContext<ContextValue<Partial<DateRangePickerProps<any>>, HTMLDivElement>>(null);\n\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(\n  props: DateRangePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DateRangePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    firstDayOfWeek,\n    createCalendar,\n    pageBehavior,\n    isDateUnavailable,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDateRangePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue || undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour'\n          || state.granularity === 'minute'\n          || state.granularity === 'second'\n            ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: 4\n              })({size})}>\n              <DateInputContainer>\n                <DateInput slot=\"start\" />\n                <span aria-hidden=\"true\" className={style({flexShrink: 0, flexGrow: 0, paddingX: 2})}>–</span>\n                <DateInput slot=\"end\" />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <div\n                className={style({\n                  flexShrink: 0,\n                  flexGrow: 1,\n                  display: 'flex',\n                  justifyContent: 'end'\n                })}>\n                <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n              </div>\n            </FieldGroup>\n            <CalendarPopover>\n              <RangeCalendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar}\n                firstDayOfWeek={firstDayOfWeek}\n                isDateUnavailable={isDateUnavailable}\n                pageBehavior={pageBehavior} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size', marginTop: 24})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.startTime')}\n                    value={state.timeRange?.start || null}\n                    onChange={v => state.setTime('start', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.endTime')}\n                    value={state.timeRange?.end || null}\n                    onChange={v => state.setTime('end', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDateRangePicker>\n  );\n});\n"],"names":[],"version":3,"file":"DateRangePicker.css.map"}
+{"mappings":"ACsF4C;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAiCtB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQ8B;;;;EAAA;;;;EAAA;;;;EAKzB;;;;EAAA;;;;EAAA;;;;EAcK;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA5DY;EAAA;;;;;AAAA;EAAA;;;;;AAiCtB;EAAA;IAAA","sources":["d7a279a73f170432","packages/@react-spectrum/s2/src/DateRangePicker.tsx"],"sourcesContent":["@import \"270ce443556f6832\";\n@import \"e665ec5e30b00bf9\";\n@import \"187f6499c2fa9b0d\";\n@import \"1dda7790205ac36a\";\n@import \"b7a8eac09818aeb5\";\n","/*\n * Copyright 2024 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 {\n  DateRangePicker as AriaDateRangePicker,\n  DateRangePickerProps as AriaDateRangePickerProps,\n  ContextValue,\n  DateValue,\n  FormContext\n} from 'react-aria-components';\nimport {CalendarButton, CalendarPopover, timeField} from './DatePicker';\nimport {createContext, forwardRef, ReactElement, Ref, useContext, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {RangeCalendar, RangeCalendarProps, TimeField} from '../';\nimport {style} from '../style' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DateRangePickerProps<T extends DateValue> extends\n  Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<RangeCalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DateRangePickerContext = createContext<ContextValue<Partial<DateRangePickerProps<any>>, HTMLDivElement>>(null);\n\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(\n  props: DateRangePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DateRangePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    createCalendar,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDateRangePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue || undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour'\n          || state.granularity === 'minute'\n          || state.granularity === 'second'\n            ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: 4\n              })({size})}>\n              <DateInputContainer>\n                <DateInput slot=\"start\" />\n                <span aria-hidden=\"true\" className={style({flexShrink: 0, flexGrow: 0, paddingX: 2})}>–</span>\n                <DateInput slot=\"end\" />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <div\n                className={style({\n                  flexShrink: 0,\n                  flexGrow: 1,\n                  display: 'flex',\n                  justifyContent: 'end'\n                })}>\n                <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n              </div>\n            </FieldGroup>\n            <CalendarPopover>\n              <RangeCalendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size', marginTop: 24})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.startTime')}\n                    value={state.timeRange?.start || null}\n                    onChange={v => state.setTime('start', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.endTime')}\n                    value={state.timeRange?.end || null}\n                    onChange={v => state.setTime('end', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDateRangePicker>\n  );\n});\n"],"names":[],"version":3,"file":"DateRangePicker.css.map"}

package/dist/DateRangePicker.mjs

@@ -39,7 +39,7 @@ const $c9bb0cbce1dac403$export$8282edba42ee28a = /*#__PURE__*/ (0, $dMar9$create
 const $c9bb0cbce1dac403$export$17334619f3ac2224 = /*#__PURE__*/ (0, $dMar9$forwardRef)(function DateRangePicker(props, ref) {
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $c9bb0cbce1dac403$export$8282edba42ee28a);
     let stringFormatter = (0, $dMar9$useLocalizedStringFormatter)((0, ($parcel$interopDefault($dMar9$intlStringsmjs))), '@react-spectrum/s2');
-    let { label: label, contextualHelp: contextualHelp, description: descriptionMessage, errorMessage: errorMessage, isRequired: isRequired, size: size = 'M', labelPosition: labelPosition = 'top', necessityIndicator: necessityIndicator, labelAlign: labelAlign = 'start', UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, firstDayOfWeek: firstDayOfWeek, createCalendar: createCalendar, pageBehavior: pageBehavior, isDateUnavailable: isDateUnavailable, ...dateFieldProps } = props;
+    let { label: label, contextualHelp: contextualHelp, description: descriptionMessage, errorMessage: errorMessage, isRequired: isRequired, size: size = 'M', labelPosition: labelPosition = 'top', necessityIndicator: necessityIndicator, labelAlign: labelAlign = 'start', UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, placeholderValue: placeholderValue, maxVisibleMonths: maxVisibleMonths = 1, createCalendar: createCalendar, ...dateFieldProps } = props;
     let formContext = (0, $dMar9$useContext)((0, $dMar9$FormContext));
     let [buttonHasFocus, setButtonHasFocus] = (0, $dMar9$useState)(false);
     return /*#__PURE__*/ (0, $dMar9$jsx)((0, $dMar9$DateRangePicker), {
@@ -195,10 +195,7 @@ const $c9bb0cbce1dac403$export$17334619f3ac2224 = /*#__PURE__*/ (0, $dMar9$forwa
                         children: [
                             /*#__PURE__*/ (0, $dMar9$jsx)((0, $ecdee84c2f0ddfb5$export$a4f5c8b89d277a8d), {
                                 visibleMonths: maxVisibleMonths,
-                                createCalendar: createCalendar,
-                                firstDayOfWeek: firstDayOfWeek,
-                                isDateUnavailable: isDateUnavailable,
-                                pageBehavior: pageBehavior
+                                createCalendar: createCalendar
                             }),
                             showTimeField && /*#__PURE__*/ (0, $dMar9$jsxs)("div", {
                                 className: " sd11 Ul11 ql11 _qb11 JA11",

package/dist/DateRangePicker.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DateRangePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DateRangePicker as AriaDateRangePicker,\n  DateRangePickerProps as AriaDateRangePickerProps,\n  ContextValue,\n  DateValue,\n  FormContext\n} from 'react-aria-components';\nimport {CalendarButton, CalendarPopover, timeField} from './DatePicker';\nimport {createContext, forwardRef, ReactElement, Ref, useContext, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {RangeCalendar, RangeCalendarProps, TimeField} from '../';\nimport {style} from '../style' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DateRangePickerProps<T extends DateValue> extends\n  Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<RangeCalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DateRangePickerContext = createContext<ContextValue<Partial<DateRangePickerProps<any>>, HTMLDivElement>>(null);\n\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(\n  props: DateRangePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DateRangePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    firstDayOfWeek,\n    createCalendar,\n    pageBehavior,\n    isDateUnavailable,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDateRangePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue || undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour'\n          || state.granularity === 'minute'\n          || state.granularity === 'second'\n            ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: 4\n              })({size})}>\n              <DateInputContainer>\n                <DateInput slot=\"start\" />\n                <span aria-hidden=\"true\" className={style({flexShrink: 0, flexGrow: 0, paddingX: 2})}>–</span>\n                <DateInput slot=\"end\" />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <div\n                className={style({\n                  flexShrink: 0,\n                  flexGrow: 1,\n                  display: 'flex',\n                  justifyContent: 'end'\n                })}>\n                <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n              </div>\n            </FieldGroup>\n            <CalendarPopover>\n              <RangeCalendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar}\n                firstDayOfWeek={firstDayOfWeek}\n                isDateUnavailable={isDateUnavailable}\n                pageBehavior={pageBehavior} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size', marginTop: 24})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.startTime')}\n                    value={state.timeRange?.start || null}\n                    onChange={v => state.setTime('start', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.endTime')}\n                    value={state.timeRange?.end || null}\n                    onChange={v => state.setTime('end', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDateRangePicker>\n  );\n});\n"],"names":[],"version":3,"file":"DateRangePicker.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/DateRangePicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  DateRangePicker as AriaDateRangePicker,\n  DateRangePickerProps as AriaDateRangePickerProps,\n  ContextValue,\n  DateValue,\n  FormContext\n} from 'react-aria-components';\nimport {CalendarButton, CalendarPopover, timeField} from './DatePicker';\nimport {createContext, forwardRef, ReactElement, Ref, useContext, useState} from 'react';\nimport {DateInput, DateInputContainer, InvalidIndicator} from './DateField';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldGroup, FieldLabel, HelpText} from './Field';\nimport {forwardRefType, GlobalDOMAttributes, HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {RangeCalendar, RangeCalendarProps, TimeField} from '../';\nimport {style} from '../style' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface DateRangePickerProps<T extends DateValue> extends\n  Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'style' | keyof GlobalDOMAttributes>,\n  Pick<RangeCalendarProps<T>, 'createCalendar' | 'pageBehavior' | 'isDateUnavailable'>,\n  StyleProps,\n  SpectrumLabelableProps,\n  HelpTextProps {\n    /**\n     * The size of the DateField.\n     *\n     * @default 'M'\n     */\n    size?: 'S' | 'M' | 'L' | 'XL',\n    /**\n     * The maximum number of months to display at once in the calendar popover, if screen space permits.\n     * @default 1\n     */\n    maxVisibleMonths?: number\n}\n\nexport const DateRangePickerContext = createContext<ContextValue<Partial<DateRangePickerProps<any>>, HTMLDivElement>>(null);\n\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(\n  props: DateRangePickerProps<T>, ref: Ref<HTMLDivElement>\n): ReactElement {\n  [props, ref] = useSpectrumContextProps(props, ref, DateRangePickerContext);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  let {\n    label,\n    contextualHelp,\n    description: descriptionMessage,\n    errorMessage,\n    isRequired,\n    size = 'M',\n    labelPosition = 'top',\n    necessityIndicator,\n    labelAlign = 'start',\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    placeholderValue,\n    maxVisibleMonths = 1,\n    createCalendar,\n    ...dateFieldProps\n  } = props;\n  let formContext = useContext(FormContext);\n  let [buttonHasFocus, setButtonHasFocus] = useState(false);\n\n  return (\n    <AriaDateRangePicker\n      ref={ref}\n      isRequired={isRequired}\n      {...dateFieldProps}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + style(field(), getAllowedOverrides())({\n        isInForm: !!formContext,\n        labelPosition,\n        size\n      }, styles)}>\n      {({isDisabled, isInvalid, isOpen, state}) => {\n        let placeholder: DateValue | undefined = placeholderValue || undefined;\n        let timePlaceholder = placeholder && 'hour' in placeholder ? placeholder : undefined;\n        let timeMinValue = props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n        let timeMaxValue = props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n        let timeGranularity = state.granularity === 'hour'\n          || state.granularity === 'minute'\n          || state.granularity === 'second'\n            ? state.granularity : undefined;\n        let showTimeField = !!timeGranularity;\n        return (\n          <>\n            <FieldLabel\n              isDisabled={isDisabled}\n              isRequired={isRequired}\n              size={size}\n              labelPosition={labelPosition}\n              labelAlign={labelAlign}\n              necessityIndicator={necessityIndicator}\n              contextualHelp={contextualHelp}>\n              {label}\n            </FieldLabel>\n            <FieldGroup\n              role=\"presentation\"\n              shouldTurnOffFocusRing={buttonHasFocus}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              size={size}\n              styles={style({\n                ...fieldInput(),\n                textWrap: 'nowrap',\n                paddingStart: 'edge-to-text',\n                paddingEnd: 4\n              })({size})}>\n              <DateInputContainer>\n                <DateInput slot=\"start\" />\n                <span aria-hidden=\"true\" className={style({flexShrink: 0, flexGrow: 0, paddingX: 2})}>–</span>\n                <DateInput slot=\"end\" />\n              </DateInputContainer>\n              <InvalidIndicator isInvalid={isInvalid} isDisabled={isDisabled} />\n              <div\n                className={style({\n                  flexShrink: 0,\n                  flexGrow: 1,\n                  display: 'flex',\n                  justifyContent: 'end'\n                })}>\n                <CalendarButton isOpen={isOpen} size={size} setButtonHasFocus={setButtonHasFocus} />\n              </div>\n            </FieldGroup>\n            <CalendarPopover>\n              <RangeCalendar\n                visibleMonths={maxVisibleMonths}\n                createCalendar={createCalendar} />\n              {showTimeField && (\n                <div className={style({display: 'flex', gap: 16, contain: 'inline-size', marginTop: 24})}>\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.startTime')}\n                    value={state.timeRange?.start || null}\n                    onChange={v => state.setTime('start', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                  <TimeField\n                    styles={timeField}\n                    label={stringFormatter.format('datepicker.endTime')}\n                    value={state.timeRange?.end || null}\n                    onChange={v => state.setTime('end', v)}\n                    placeholderValue={timePlaceholder}\n                    granularity={timeGranularity}\n                    minValue={timeMinValue}\n                    maxValue={timeMaxValue}\n                    hourCycle={props.hourCycle}\n                    hideTimeZone={props.hideTimeZone} />\n                </div>\n              )}\n            </CalendarPopover>\n            <HelpText\n              size={size}\n              isDisabled={isDisabled}\n              isInvalid={isInvalid}\n              description={descriptionMessage}>\n              {errorMessage}\n            </HelpText>\n          </>\n        );\n      }}\n    </AriaDateRangePicker>\n  );\n});\n"],"names":[],"version":3,"file":"DateRangePicker.mjs.map"}