react-aria-components 1.8.0 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/dist/Autocomplete.main.js.map +1 -1
  2. package/dist/Autocomplete.module.js.map +1 -1
  3. package/dist/Checkbox.main.js +4 -1
  4. package/dist/Checkbox.main.js.map +1 -1
  5. package/dist/Checkbox.mjs +5 -2
  6. package/dist/Checkbox.module.js +5 -2
  7. package/dist/Checkbox.module.js.map +1 -1
  8. package/dist/Collection.main.js +31 -7
  9. package/dist/Collection.main.js.map +1 -1
  10. package/dist/Collection.mjs +32 -9
  11. package/dist/Collection.module.js +32 -9
  12. package/dist/Collection.module.js.map +1 -1
  13. package/dist/ColorPicker.main.js.map +1 -1
  14. package/dist/ColorPicker.module.js.map +1 -1
  15. package/dist/ComboBox.main.js +10 -1
  16. package/dist/ComboBox.main.js.map +1 -1
  17. package/dist/ComboBox.mjs +10 -1
  18. package/dist/ComboBox.module.js +10 -1
  19. package/dist/ComboBox.module.js.map +1 -1
  20. package/dist/DatePicker.main.js +11 -2
  21. package/dist/DatePicker.main.js.map +1 -1
  22. package/dist/DatePicker.mjs +11 -2
  23. package/dist/DatePicker.module.js +11 -2
  24. package/dist/DatePicker.module.js.map +1 -1
  25. package/dist/Dialog.main.js +15 -1
  26. package/dist/Dialog.main.js.map +1 -1
  27. package/dist/Dialog.mjs +17 -3
  28. package/dist/Dialog.module.js +17 -3
  29. package/dist/Dialog.module.js.map +1 -1
  30. package/dist/DragAndDrop.main.js.map +1 -1
  31. package/dist/DragAndDrop.module.js.map +1 -1
  32. package/dist/GridList.main.js +59 -4
  33. package/dist/GridList.main.js.map +1 -1
  34. package/dist/GridList.mjs +60 -6
  35. package/dist/GridList.module.js +60 -6
  36. package/dist/GridList.module.js.map +1 -1
  37. package/dist/ListBox.main.js +61 -3
  38. package/dist/ListBox.main.js.map +1 -1
  39. package/dist/ListBox.mjs +62 -5
  40. package/dist/ListBox.module.js +62 -5
  41. package/dist/ListBox.module.js.map +1 -1
  42. package/dist/Menu.main.js.map +1 -1
  43. package/dist/Menu.module.js.map +1 -1
  44. package/dist/Popover.main.js +12 -2
  45. package/dist/Popover.main.js.map +1 -1
  46. package/dist/Popover.mjs +13 -3
  47. package/dist/Popover.module.js +13 -3
  48. package/dist/Popover.module.js.map +1 -1
  49. package/dist/RadioGroup.main.js +4 -1
  50. package/dist/RadioGroup.main.js.map +1 -1
  51. package/dist/RadioGroup.mjs +5 -2
  52. package/dist/RadioGroup.module.js +5 -2
  53. package/dist/RadioGroup.module.js.map +1 -1
  54. package/dist/Select.main.js +10 -2
  55. package/dist/Select.main.js.map +1 -1
  56. package/dist/Select.mjs +10 -2
  57. package/dist/Select.module.js +10 -2
  58. package/dist/Select.module.js.map +1 -1
  59. package/dist/Table.main.js +42 -10
  60. package/dist/Table.main.js.map +1 -1
  61. package/dist/Table.mjs +43 -11
  62. package/dist/Table.module.js +43 -11
  63. package/dist/Table.module.js.map +1 -1
  64. package/dist/TagGroup.main.js +1 -1
  65. package/dist/TagGroup.main.js.map +1 -1
  66. package/dist/TagGroup.mjs +1 -1
  67. package/dist/TagGroup.module.js +1 -1
  68. package/dist/TagGroup.module.js.map +1 -1
  69. package/dist/Tooltip.main.js.map +1 -1
  70. package/dist/Tooltip.module.js.map +1 -1
  71. package/dist/Tree.main.js +296 -18
  72. package/dist/Tree.main.js.map +1 -1
  73. package/dist/Tree.mjs +299 -21
  74. package/dist/Tree.module.js +299 -21
  75. package/dist/Tree.module.js.map +1 -1
  76. package/dist/TreeDropTargetDelegate.main.js +213 -0
  77. package/dist/TreeDropTargetDelegate.main.js.map +1 -0
  78. package/dist/TreeDropTargetDelegate.mjs +208 -0
  79. package/dist/TreeDropTargetDelegate.module.js +208 -0
  80. package/dist/TreeDropTargetDelegate.module.js.map +1 -0
  81. package/dist/Virtualizer.main.js +8 -10
  82. package/dist/Virtualizer.main.js.map +1 -1
  83. package/dist/Virtualizer.mjs +9 -11
  84. package/dist/Virtualizer.module.js +9 -11
  85. package/dist/Virtualizer.module.js.map +1 -1
  86. package/dist/import.mjs +5 -5
  87. package/dist/main.js +4 -1
  88. package/dist/main.js.map +1 -1
  89. package/dist/module.js +5 -5
  90. package/dist/module.js.map +1 -1
  91. package/dist/types.d.ts +115 -50
  92. package/dist/types.d.ts.map +1 -1
  93. package/dist/useDragAndDrop.main.js +2 -2
  94. package/dist/useDragAndDrop.main.js.map +1 -1
  95. package/dist/useDragAndDrop.mjs +2 -2
  96. package/dist/useDragAndDrop.module.js +2 -2
  97. package/dist/useDragAndDrop.module.js.map +1 -1
  98. package/package.json +32 -28
  99. package/src/Autocomplete.tsx +2 -2
  100. package/src/Checkbox.tsx +2 -2
  101. package/src/Collection.tsx +39 -5
  102. package/src/ColorPicker.tsx +2 -2
  103. package/src/ComboBox.tsx +5 -1
  104. package/src/DatePicker.tsx +7 -2
  105. package/src/Dialog.tsx +18 -4
  106. package/src/DragAndDrop.tsx +1 -1
  107. package/src/GridList.tsx +69 -7
  108. package/src/ListBox.tsx +70 -6
  109. package/src/Menu.tsx +2 -1
  110. package/src/Popover.tsx +21 -5
  111. package/src/RadioGroup.tsx +2 -2
  112. package/src/Select.tsx +13 -3
  113. package/src/Table.tsx +44 -16
  114. package/src/TagGroup.tsx +1 -1
  115. package/src/Tooltip.tsx +2 -2
  116. package/src/Tree.tsx +364 -38
  117. package/src/TreeDropTargetDelegate.ts +304 -0
  118. package/src/Virtualizer.tsx +9 -14
  119. package/src/index.ts +8 -7
  120. package/src/useDragAndDrop.tsx +2 -1
@@ -87,6 +87,14 @@ const $1d716ce69f118fad$export$72b9695b8216309a = /*#__PURE__*/ (0, $9obPC$react
87
87
  comboBoxRef: ref
88
88
  }));
89
89
  });
90
+ // Contexts to clear inside the popover.
91
+ const $1d716ce69f118fad$var$CLEAR_CONTEXTS = [
92
+ (0, $84ae0bf5bd8e2a5f$exports.LabelContext),
93
+ (0, $b856e6788a7ea5bf$exports.ButtonContext),
94
+ (0, $1bcfcef5af644e13$exports.InputContext),
95
+ (0, $dcae72abc18c0045$exports.GroupContext),
96
+ (0, $a8a589c28affdc40$exports.TextContext)
97
+ ];
90
98
  function $1d716ce69f118fad$var$ComboBoxInner({ props: props, collection: collection, comboBoxRef: ref }) {
91
99
  let { name: name, formValue: formValue = 'key', allowsCustomValue: allowsCustomValue } = props;
92
100
  if (allowsCustomValue) formValue = 'text';
@@ -203,7 +211,8 @@ function $1d716ce69f118fad$var$ComboBoxInner({ props: props, collection: collect
203
211
  trigger: 'ComboBox',
204
212
  style: {
205
213
  '--trigger-width': menuWidth
206
- }
214
+ },
215
+ clearContexts: $1d716ce69f118fad$var$CLEAR_CONTEXTS
207
216
  }
208
217
  ],
209
218
  [
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaComboBoxProps, useComboBox, useFilter} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, ComboBoxState, Node, useComboBoxState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the combobox is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the combobox is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the combobox is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface ComboBoxProps<T extends object> extends Omit<AriaComboBoxProps<T>, 'children' | 'placeholder' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<ComboBoxRenderProps>, SlotProps {\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: (textValue: string, inputValue: string) => boolean,\n /**\n * Whether the text or key of the selected item is submitted as part of an HTML form.\n * When `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\n * @default 'key'\n */\n formValue?: 'text' | 'key',\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean\n}\n\nexport const ComboBoxContext = createContext<ContextValue<ComboBoxProps<any>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n <ListBoxContext.Provider value={{items: props.items ?? props.defaultItems}}>\n {typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n defaultChildren: null\n })\n : children}\n </ListBoxContext.Provider>\n ), [children, isDisabled, isInvalid, isRequired, props.items, props.defaultItems]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <ComboBoxInner props={props} collection={collection} comboBoxRef={ref} />}\n </CollectionBuilder>\n );\n});\n\ninterface ComboBoxInnerProps<T extends object> {\n props: ComboBoxProps<T>,\n collection: Collection<Node<T>>,\n comboBoxRef: RefObject<HTMLDivElement | null>\n}\n\nfunction ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {\n name,\n formValue = 'key',\n allowsCustomValue\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState({\n defaultFilter: props.defaultFilter || contains,\n ...props,\n // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)\n items: props.items,\n children: undefined,\n collection,\n validationBehavior\n });\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let inputRef = useRef<HTMLInputElement>(null);\n let listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useComboBox({\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n }, state);\n\n // Make menu width match input + button\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.current) {\n let buttonRect = buttonRef.current?.getBoundingClientRect();\n let inputRect = inputRef.current.getBoundingClientRect();\n let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;\n let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;\n setMenuWidth((maxX - minX) + 'px');\n }\n }, [buttonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: inputRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-ComboBox'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [ComboBoxStateContext, state],\n [LabelContext, {...labelProps, ref: labelRef}],\n [ButtonContext, {...buttonProps, ref: buttonRef, isPressed: state.isOpen}],\n [InputContext, {...inputProps, ref: inputRef}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n ref: popoverRef,\n triggerRef: inputRef,\n scrollRef: listBoxRef,\n placement: 'bottom start',\n isNonModal: true,\n trigger: 'ComboBox',\n style: {'--trigger-width': menuWidth} as React.CSSProperties\n }],\n [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaComboBoxProps, useComboBox, useFilter} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, ComboBoxState, Node, useComboBoxState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the combobox is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the combobox is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the combobox is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface ComboBoxProps<T extends object> extends Omit<AriaComboBoxProps<T>, 'children' | 'placeholder' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<ComboBoxRenderProps>, SlotProps {\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: (textValue: string, inputValue: string) => boolean,\n /**\n * Whether the text or key of the selected item is submitted as part of an HTML form.\n * When `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\n * @default 'key'\n */\n formValue?: 'text' | 'key',\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean\n}\n\nexport const ComboBoxContext = createContext<ContextValue<ComboBoxProps<any>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n <ListBoxContext.Provider value={{items: props.items ?? props.defaultItems}}>\n {typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n defaultChildren: null\n })\n : children}\n </ListBoxContext.Provider>\n ), [children, isDisabled, isInvalid, isRequired, props.items, props.defaultItems]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <ComboBoxInner props={props} collection={collection} comboBoxRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, InputContext, GroupContext, TextContext];\n\ninterface ComboBoxInnerProps<T extends object> {\n props: ComboBoxProps<T>,\n collection: Collection<Node<T>>,\n comboBoxRef: RefObject<HTMLDivElement | null>\n}\n\nfunction ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {\n name,\n formValue = 'key',\n allowsCustomValue\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState({\n defaultFilter: props.defaultFilter || contains,\n ...props,\n // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)\n items: props.items,\n children: undefined,\n collection,\n validationBehavior\n });\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let inputRef = useRef<HTMLInputElement>(null);\n let listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useComboBox({\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n }, state);\n\n // Make menu width match input + button\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.current) {\n let buttonRect = buttonRef.current?.getBoundingClientRect();\n let inputRect = inputRef.current.getBoundingClientRect();\n let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;\n let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;\n setMenuWidth((maxX - minX) + 'px');\n }\n }, [buttonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: inputRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-ComboBox'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [ComboBoxStateContext, state],\n [LabelContext, {...labelProps, ref: labelRef}],\n [ButtonContext, {...buttonProps, ref: buttonRef, isPressed: state.isOpen}],\n [InputContext, {...inputProps, ref: inputRef}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n ref: popoverRef,\n triggerRef: inputRef,\n scrollRef: listBoxRef,\n placement: 'bottom start',\n isNonModal: true,\n trigger: 'ComboBox',\n style: {'--trigger-width': menuWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }],\n [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.main.js.map"}
package/dist/ComboBox.mjs CHANGED
@@ -75,6 +75,14 @@ const $d01f2c01039c0eec$export$72b9695b8216309a = /*#__PURE__*/ (0, $cP7hC$forwa
75
75
  comboBoxRef: ref
76
76
  }));
77
77
  });
78
+ // Contexts to clear inside the popover.
79
+ const $d01f2c01039c0eec$var$CLEAR_CONTEXTS = [
80
+ (0, $01b77f81d0f07f68$export$75b6ee27786ba447),
81
+ (0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
82
+ (0, $3985021b0ad6602f$export$37fb8590cf2c088c),
83
+ (0, $a049562f99e7db0e$export$f9c6924e160136d1),
84
+ (0, $514c0188e459b4c0$export$9afb8bc826b033ea)
85
+ ];
78
86
  function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collection, comboBoxRef: ref }) {
79
87
  let { name: name, formValue: formValue = 'key', allowsCustomValue: allowsCustomValue } = props;
80
88
  if (allowsCustomValue) formValue = 'text';
@@ -191,7 +199,8 @@ function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collect
191
199
  trigger: 'ComboBox',
192
200
  style: {
193
201
  '--trigger-width': menuWidth
194
- }
202
+ },
203
+ clearContexts: $d01f2c01039c0eec$var$CLEAR_CONTEXTS
195
204
  }
196
205
  ],
197
206
  [
@@ -75,6 +75,14 @@ const $d01f2c01039c0eec$export$72b9695b8216309a = /*#__PURE__*/ (0, $cP7hC$forwa
75
75
  comboBoxRef: ref
76
76
  }));
77
77
  });
78
+ // Contexts to clear inside the popover.
79
+ const $d01f2c01039c0eec$var$CLEAR_CONTEXTS = [
80
+ (0, $01b77f81d0f07f68$export$75b6ee27786ba447),
81
+ (0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
82
+ (0, $3985021b0ad6602f$export$37fb8590cf2c088c),
83
+ (0, $a049562f99e7db0e$export$f9c6924e160136d1),
84
+ (0, $514c0188e459b4c0$export$9afb8bc826b033ea)
85
+ ];
78
86
  function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collection, comboBoxRef: ref }) {
79
87
  let { name: name, formValue: formValue = 'key', allowsCustomValue: allowsCustomValue } = props;
80
88
  if (allowsCustomValue) formValue = 'text';
@@ -191,7 +199,8 @@ function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collect
191
199
  trigger: 'ComboBox',
192
200
  style: {
193
201
  '--trigger-width': menuWidth
194
- }
202
+ },
203
+ clearContexts: $d01f2c01039c0eec$var$CLEAR_CONTEXTS
195
204
  }
196
205
  ],
197
206
  [
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaComboBoxProps, useComboBox, useFilter} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, ComboBoxState, Node, useComboBoxState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the combobox is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the combobox is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the combobox is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface ComboBoxProps<T extends object> extends Omit<AriaComboBoxProps<T>, 'children' | 'placeholder' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<ComboBoxRenderProps>, SlotProps {\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: (textValue: string, inputValue: string) => boolean,\n /**\n * Whether the text or key of the selected item is submitted as part of an HTML form.\n * When `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\n * @default 'key'\n */\n formValue?: 'text' | 'key',\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean\n}\n\nexport const ComboBoxContext = createContext<ContextValue<ComboBoxProps<any>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n <ListBoxContext.Provider value={{items: props.items ?? props.defaultItems}}>\n {typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n defaultChildren: null\n })\n : children}\n </ListBoxContext.Provider>\n ), [children, isDisabled, isInvalid, isRequired, props.items, props.defaultItems]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <ComboBoxInner props={props} collection={collection} comboBoxRef={ref} />}\n </CollectionBuilder>\n );\n});\n\ninterface ComboBoxInnerProps<T extends object> {\n props: ComboBoxProps<T>,\n collection: Collection<Node<T>>,\n comboBoxRef: RefObject<HTMLDivElement | null>\n}\n\nfunction ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {\n name,\n formValue = 'key',\n allowsCustomValue\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState({\n defaultFilter: props.defaultFilter || contains,\n ...props,\n // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)\n items: props.items,\n children: undefined,\n collection,\n validationBehavior\n });\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let inputRef = useRef<HTMLInputElement>(null);\n let listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useComboBox({\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n }, state);\n\n // Make menu width match input + button\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.current) {\n let buttonRect = buttonRef.current?.getBoundingClientRect();\n let inputRect = inputRef.current.getBoundingClientRect();\n let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;\n let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;\n setMenuWidth((maxX - minX) + 'px');\n }\n }, [buttonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: inputRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-ComboBox'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [ComboBoxStateContext, state],\n [LabelContext, {...labelProps, ref: labelRef}],\n [ButtonContext, {...buttonProps, ref: buttonRef, isPressed: state.isOpen}],\n [InputContext, {...inputProps, ref: inputRef}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n ref: popoverRef,\n triggerRef: inputRef,\n scrollRef: listBoxRef,\n placement: 'bottom start',\n isNonModal: true,\n trigger: 'ComboBox',\n style: {'--trigger-width': menuWidth} as React.CSSProperties\n }],\n [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaComboBoxProps, useComboBox, useFilter} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, ComboBoxState, Node, useComboBoxState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the combobox is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the combobox is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the combobox is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface ComboBoxProps<T extends object> extends Omit<AriaComboBoxProps<T>, 'children' | 'placeholder' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<ComboBoxRenderProps>, SlotProps {\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: (textValue: string, inputValue: string) => boolean,\n /**\n * Whether the text or key of the selected item is submitted as part of an HTML form.\n * When `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\n * @default 'key'\n */\n formValue?: 'text' | 'key',\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean\n}\n\nexport const ComboBoxContext = createContext<ContextValue<ComboBoxProps<any>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n <ListBoxContext.Provider value={{items: props.items ?? props.defaultItems}}>\n {typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n defaultChildren: null\n })\n : children}\n </ListBoxContext.Provider>\n ), [children, isDisabled, isInvalid, isRequired, props.items, props.defaultItems]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <ComboBoxInner props={props} collection={collection} comboBoxRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, InputContext, GroupContext, TextContext];\n\ninterface ComboBoxInnerProps<T extends object> {\n props: ComboBoxProps<T>,\n collection: Collection<Node<T>>,\n comboBoxRef: RefObject<HTMLDivElement | null>\n}\n\nfunction ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {\n name,\n formValue = 'key',\n allowsCustomValue\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState({\n defaultFilter: props.defaultFilter || contains,\n ...props,\n // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)\n items: props.items,\n children: undefined,\n collection,\n validationBehavior\n });\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let inputRef = useRef<HTMLInputElement>(null);\n let listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useComboBox({\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n }, state);\n\n // Make menu width match input + button\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.current) {\n let buttonRect = buttonRef.current?.getBoundingClientRect();\n let inputRect = inputRef.current.getBoundingClientRect();\n let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;\n let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;\n setMenuWidth((maxX - minX) + 'px');\n }\n }, [buttonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: inputRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-ComboBox'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [ComboBoxStateContext, state],\n [LabelContext, {...labelProps, ref: labelRef}],\n [ButtonContext, {...buttonProps, ref: buttonRef, isPressed: state.isOpen}],\n [InputContext, {...inputProps, ref: inputRef}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n ref: popoverRef,\n triggerRef: inputRef,\n scrollRef: listBoxRef,\n placement: 'bottom start',\n isNonModal: true,\n trigger: 'ComboBox',\n style: {'--trigger-width': menuWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }],\n [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.module.js.map"}
@@ -58,6 +58,13 @@ const $adfe8d3f75d5162e$export$cf316c7f3b44c11e = /*#__PURE__*/ (0, $bhT4V$react
58
58
  const $adfe8d3f75d5162e$export$8282edba42ee28a = /*#__PURE__*/ (0, $bhT4V$react.createContext)(null);
59
59
  const $adfe8d3f75d5162e$export$50a10c048fdcdee9 = /*#__PURE__*/ (0, $bhT4V$react.createContext)(null);
60
60
  const $adfe8d3f75d5162e$export$80d7ae1f804790be = /*#__PURE__*/ (0, $bhT4V$react.createContext)(null);
61
+ // Contexts to clear inside the popover.
62
+ const $adfe8d3f75d5162e$var$CLEAR_CONTEXTS = [
63
+ (0, $dcae72abc18c0045$exports.GroupContext),
64
+ (0, $b856e6788a7ea5bf$exports.ButtonContext),
65
+ (0, $84ae0bf5bd8e2a5f$exports.LabelContext),
66
+ (0, $a8a589c28affdc40$exports.TextContext)
67
+ ];
61
68
  const $adfe8d3f75d5162e$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $bhT4V$react.forwardRef)(function DatePicker(props, ref) {
62
69
  [props, ref] = (0, $c5ccf687772c0422$exports.useContextProps)(props, ref, $adfe8d3f75d5162e$export$cf316c7f3b44c11e);
63
70
  let { validationBehavior: formValidationBehavior } = (0, $c5ccf687772c0422$exports.useSlottedContext)((0, $35157657e549736b$exports.FormContext)) || {};
@@ -149,7 +156,8 @@ const $adfe8d3f75d5162e$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $bhT4V$react
149
156
  placement: 'bottom start',
150
157
  style: {
151
158
  '--trigger-width': groupWidth
152
- }
159
+ },
160
+ clearContexts: $adfe8d3f75d5162e$var$CLEAR_CONTEXTS
153
161
  }
154
162
  ],
155
163
  [
@@ -270,7 +278,8 @@ const $adfe8d3f75d5162e$export$17334619f3ac2224 = /*#__PURE__*/ (0, $bhT4V$react
270
278
  placement: 'bottom start',
271
279
  style: {
272
280
  '--trigger-width': groupWidth
273
- }
281
+ },
282
+ clearContexts: $adfe8d3f75d5162e$var$CLEAR_CONTEXTS
274
283
  }
275
284
  ],
276
285
  [
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue, useDatePicker, useDateRangePicker, useFocusRing} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {CalendarContext, RangeCalendarContext} from './Calendar';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {DateFieldContext} from './DateField';\nimport {DatePickerState, DatePickerStateOptions, DateRangePickerState, DateRangePickerStateOptions, useDatePickerState, useDateRangePickerState} from 'react-stately';\nimport {DialogContext, OverlayTriggerStateContext} from './Dialog';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {LabelContext} from './Label';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DatePickerRenderProps {\n /**\n * Whether an element within the date picker is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date picker is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date picker is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date picker is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date picker's popover is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * State of the date picker.\n */\n state: DatePickerState\n}\nexport interface DateRangePickerRenderProps extends Omit<DatePickerRenderProps, 'state'> {\n /**\n * State of the date range picker.\n */\n state: DateRangePickerState\n}\n\nexport interface DatePickerProps<T extends DateValue> extends Omit<AriaDatePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DatePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DatePickerRenderProps>, SlotProps {}\nexport interface DateRangePickerProps<T extends DateValue> extends Omit<AriaDateRangePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DateRangePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DateRangePickerRenderProps>, SlotProps {}\n\nexport const DatePickerContext = createContext<ContextValue<DatePickerProps<any>, HTMLDivElement>>(null);\nexport const DateRangePickerContext = createContext<ContextValue<DateRangePickerProps<any>, HTMLDivElement>>(null);\nexport const DatePickerStateContext = createContext<DatePickerState | null>(null);\nexport const DateRangePickerStateContext = createContext<DateRangePickerState | null>(null);\n\n/**\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(props: DatePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DatePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDatePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n fieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDatePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DatePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DatePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [DateFieldContext, fieldProps],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [CalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DatePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties\n }],\n [DialogContext, dialogProps],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n\n/**\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(props: DateRangePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateRangePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDateRangePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n startFieldProps,\n endFieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDateRangePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DateRangePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateRangePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [RangeCalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DateRangePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties\n }],\n [DialogContext, dialogProps],\n [DateFieldContext, {\n slots: {\n start: startFieldProps,\n end: endFieldProps\n }\n }],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"DatePicker.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue, useDatePicker, useDateRangePicker, useFocusRing} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {CalendarContext, RangeCalendarContext} from './Calendar';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {DateFieldContext} from './DateField';\nimport {DatePickerState, DatePickerStateOptions, DateRangePickerState, DateRangePickerStateOptions, useDatePickerState, useDateRangePickerState} from 'react-stately';\nimport {DialogContext, OverlayTriggerStateContext} from './Dialog';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {LabelContext} from './Label';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DatePickerRenderProps {\n /**\n * Whether an element within the date picker is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date picker is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date picker is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date picker is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date picker's popover is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * State of the date picker.\n */\n state: DatePickerState\n}\nexport interface DateRangePickerRenderProps extends Omit<DatePickerRenderProps, 'state'> {\n /**\n * State of the date range picker.\n */\n state: DateRangePickerState\n}\n\nexport interface DatePickerProps<T extends DateValue> extends Omit<AriaDatePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DatePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DatePickerRenderProps>, SlotProps {}\nexport interface DateRangePickerProps<T extends DateValue> extends Omit<AriaDateRangePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DateRangePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DateRangePickerRenderProps>, SlotProps {}\n\nexport const DatePickerContext = createContext<ContextValue<DatePickerProps<any>, HTMLDivElement>>(null);\nexport const DateRangePickerContext = createContext<ContextValue<DateRangePickerProps<any>, HTMLDivElement>>(null);\nexport const DatePickerStateContext = createContext<DatePickerState | null>(null);\nexport const DateRangePickerStateContext = createContext<DateRangePickerState | null>(null);\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [GroupContext, ButtonContext, LabelContext, TextContext];\n\n/**\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(props: DatePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DatePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDatePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n fieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDatePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DatePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DatePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [DateFieldContext, fieldProps],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [CalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DatePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }],\n [DialogContext, dialogProps],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n\n/**\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(props: DateRangePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateRangePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDateRangePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n startFieldProps,\n endFieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDateRangePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DateRangePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateRangePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [RangeCalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DateRangePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }],\n [DialogContext, dialogProps],\n [DateFieldContext, {\n slots: {\n start: startFieldProps,\n end: endFieldProps\n }\n }],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"DatePicker.main.js.map"}
@@ -43,6 +43,13 @@ const $06d5b8ec9ee5d538$export$cf316c7f3b44c11e = /*#__PURE__*/ (0, $8nhma$creat
43
43
  const $06d5b8ec9ee5d538$export$8282edba42ee28a = /*#__PURE__*/ (0, $8nhma$createContext)(null);
44
44
  const $06d5b8ec9ee5d538$export$50a10c048fdcdee9 = /*#__PURE__*/ (0, $8nhma$createContext)(null);
45
45
  const $06d5b8ec9ee5d538$export$80d7ae1f804790be = /*#__PURE__*/ (0, $8nhma$createContext)(null);
46
+ // Contexts to clear inside the popover.
47
+ const $06d5b8ec9ee5d538$var$CLEAR_CONTEXTS = [
48
+ (0, $a049562f99e7db0e$export$f9c6924e160136d1),
49
+ (0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
50
+ (0, $01b77f81d0f07f68$export$75b6ee27786ba447),
51
+ (0, $514c0188e459b4c0$export$9afb8bc826b033ea)
52
+ ];
46
53
  const $06d5b8ec9ee5d538$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $8nhma$forwardRef)(function DatePicker(props, ref) {
47
54
  [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $06d5b8ec9ee5d538$export$cf316c7f3b44c11e);
48
55
  let { validationBehavior: formValidationBehavior } = (0, $64fa3d84918910a7$export$fabf2dc03a41866e)((0, $d3e0e05bdfcf66bd$export$c24727297075ec6a)) || {};
@@ -134,7 +141,8 @@ const $06d5b8ec9ee5d538$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $8nhma$forwa
134
141
  placement: 'bottom start',
135
142
  style: {
136
143
  '--trigger-width': groupWidth
137
- }
144
+ },
145
+ clearContexts: $06d5b8ec9ee5d538$var$CLEAR_CONTEXTS
138
146
  }
139
147
  ],
140
148
  [
@@ -255,7 +263,8 @@ const $06d5b8ec9ee5d538$export$17334619f3ac2224 = /*#__PURE__*/ (0, $8nhma$forwa
255
263
  placement: 'bottom start',
256
264
  style: {
257
265
  '--trigger-width': groupWidth
258
- }
266
+ },
267
+ clearContexts: $06d5b8ec9ee5d538$var$CLEAR_CONTEXTS
259
268
  }
260
269
  ],
261
270
  [
@@ -43,6 +43,13 @@ const $06d5b8ec9ee5d538$export$cf316c7f3b44c11e = /*#__PURE__*/ (0, $8nhma$creat
43
43
  const $06d5b8ec9ee5d538$export$8282edba42ee28a = /*#__PURE__*/ (0, $8nhma$createContext)(null);
44
44
  const $06d5b8ec9ee5d538$export$50a10c048fdcdee9 = /*#__PURE__*/ (0, $8nhma$createContext)(null);
45
45
  const $06d5b8ec9ee5d538$export$80d7ae1f804790be = /*#__PURE__*/ (0, $8nhma$createContext)(null);
46
+ // Contexts to clear inside the popover.
47
+ const $06d5b8ec9ee5d538$var$CLEAR_CONTEXTS = [
48
+ (0, $a049562f99e7db0e$export$f9c6924e160136d1),
49
+ (0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
50
+ (0, $01b77f81d0f07f68$export$75b6ee27786ba447),
51
+ (0, $514c0188e459b4c0$export$9afb8bc826b033ea)
52
+ ];
46
53
  const $06d5b8ec9ee5d538$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $8nhma$forwardRef)(function DatePicker(props, ref) {
47
54
  [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $06d5b8ec9ee5d538$export$cf316c7f3b44c11e);
48
55
  let { validationBehavior: formValidationBehavior } = (0, $64fa3d84918910a7$export$fabf2dc03a41866e)((0, $d3e0e05bdfcf66bd$export$c24727297075ec6a)) || {};
@@ -134,7 +141,8 @@ const $06d5b8ec9ee5d538$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $8nhma$forwa
134
141
  placement: 'bottom start',
135
142
  style: {
136
143
  '--trigger-width': groupWidth
137
- }
144
+ },
145
+ clearContexts: $06d5b8ec9ee5d538$var$CLEAR_CONTEXTS
138
146
  }
139
147
  ],
140
148
  [
@@ -255,7 +263,8 @@ const $06d5b8ec9ee5d538$export$17334619f3ac2224 = /*#__PURE__*/ (0, $8nhma$forwa
255
263
  placement: 'bottom start',
256
264
  style: {
257
265
  '--trigger-width': groupWidth
258
- }
266
+ },
267
+ clearContexts: $06d5b8ec9ee5d538$var$CLEAR_CONTEXTS
259
268
  }
260
269
  ],
261
270
  [
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue, useDatePicker, useDateRangePicker, useFocusRing} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {CalendarContext, RangeCalendarContext} from './Calendar';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {DateFieldContext} from './DateField';\nimport {DatePickerState, DatePickerStateOptions, DateRangePickerState, DateRangePickerStateOptions, useDatePickerState, useDateRangePickerState} from 'react-stately';\nimport {DialogContext, OverlayTriggerStateContext} from './Dialog';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {LabelContext} from './Label';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DatePickerRenderProps {\n /**\n * Whether an element within the date picker is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date picker is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date picker is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date picker is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date picker's popover is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * State of the date picker.\n */\n state: DatePickerState\n}\nexport interface DateRangePickerRenderProps extends Omit<DatePickerRenderProps, 'state'> {\n /**\n * State of the date range picker.\n */\n state: DateRangePickerState\n}\n\nexport interface DatePickerProps<T extends DateValue> extends Omit<AriaDatePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DatePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DatePickerRenderProps>, SlotProps {}\nexport interface DateRangePickerProps<T extends DateValue> extends Omit<AriaDateRangePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DateRangePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DateRangePickerRenderProps>, SlotProps {}\n\nexport const DatePickerContext = createContext<ContextValue<DatePickerProps<any>, HTMLDivElement>>(null);\nexport const DateRangePickerContext = createContext<ContextValue<DateRangePickerProps<any>, HTMLDivElement>>(null);\nexport const DatePickerStateContext = createContext<DatePickerState | null>(null);\nexport const DateRangePickerStateContext = createContext<DateRangePickerState | null>(null);\n\n/**\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(props: DatePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DatePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDatePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n fieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDatePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DatePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DatePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [DateFieldContext, fieldProps],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [CalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DatePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties\n }],\n [DialogContext, dialogProps],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n\n/**\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(props: DateRangePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateRangePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDateRangePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n startFieldProps,\n endFieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDateRangePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DateRangePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateRangePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [RangeCalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DateRangePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties\n }],\n [DialogContext, dialogProps],\n [DateFieldContext, {\n slots: {\n start: startFieldProps,\n end: endFieldProps\n }\n }],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"DatePicker.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaDatePickerProps, AriaDateRangePickerProps, DateValue, useDatePicker, useDateRangePicker, useFocusRing} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {CalendarContext, RangeCalendarContext} from './Calendar';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {DateFieldContext} from './DateField';\nimport {DatePickerState, DatePickerStateOptions, DateRangePickerState, DateRangePickerStateOptions, useDatePickerState, useDateRangePickerState} from 'react-stately';\nimport {DialogContext, OverlayTriggerStateContext} from './Dialog';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {LabelContext} from './Label';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, useCallback, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DatePickerRenderProps {\n /**\n * Whether an element within the date picker is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date picker is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date picker is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date picker is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date picker's popover is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * State of the date picker.\n */\n state: DatePickerState\n}\nexport interface DateRangePickerRenderProps extends Omit<DatePickerRenderProps, 'state'> {\n /**\n * State of the date range picker.\n */\n state: DateRangePickerState\n}\n\nexport interface DatePickerProps<T extends DateValue> extends Omit<AriaDatePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DatePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DatePickerRenderProps>, SlotProps {}\nexport interface DateRangePickerProps<T extends DateValue> extends Omit<AriaDateRangePickerProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, Pick<DateRangePickerStateOptions<T>, 'shouldCloseOnSelect'>, RACValidation, RenderProps<DateRangePickerRenderProps>, SlotProps {}\n\nexport const DatePickerContext = createContext<ContextValue<DatePickerProps<any>, HTMLDivElement>>(null);\nexport const DateRangePickerContext = createContext<ContextValue<DateRangePickerProps<any>, HTMLDivElement>>(null);\nexport const DatePickerStateContext = createContext<DatePickerState | null>(null);\nexport const DateRangePickerStateContext = createContext<DateRangePickerState | null>(null);\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [GroupContext, ButtonContext, LabelContext, TextContext];\n\n/**\n * A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.\n */\nexport const DatePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DatePicker<T extends DateValue>(props: DatePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DatePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDatePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n fieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDatePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DatePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DatePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [DateFieldContext, fieldProps],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [CalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DatePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }],\n [DialogContext, dialogProps],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n\n/**\n * A date range picker combines two DateFields and a RangeCalendar popover to allow\n * users to enter or select a date and time range.\n */\nexport const DateRangePicker = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateRangePicker<T extends DateValue>(props: DateRangePickerProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateRangePickerContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useDateRangePickerState({\n ...props,\n validationBehavior\n });\n\n let groupRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n groupProps,\n labelProps,\n startFieldProps,\n endFieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useDateRangePicker({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, groupRef);\n\n // Allows calendar width to match input group\n let [groupWidth, setGroupWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (groupRef.current) {\n setGroupWidth(groupRef.current.offsetWidth + 'px');\n }\n }, []);\n\n useResizeObserver({\n ref: groupRef,\n onResize: onResize\n });\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isFocusWithin: isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: state.isInvalid,\n isOpen: state.isOpen\n },\n defaultClassName: 'react-aria-DateRangePicker'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateRangePickerStateContext, state],\n [GroupContext, {...groupProps, ref: groupRef, isInvalid: state.isInvalid}],\n [ButtonContext, {...buttonProps, isPressed: state.isOpen}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [RangeCalendarContext, calendarProps],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'DateRangePicker',\n triggerRef: groupRef,\n placement: 'bottom start',\n style: {'--trigger-width': groupWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }],\n [DialogContext, dialogProps],\n [DateFieldContext, {\n slots: {\n start: startFieldProps,\n end: endFieldProps\n }\n }],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...focusProps}\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focus-within={isFocused || undefined}\n data-invalid={state.isInvalid || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n data-open={state.isOpen || undefined} />\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"DatePicker.module.js.map"}
@@ -52,6 +52,17 @@ function $2979ab89b336194b$export$2e1e1122cf0cba88(props) {
52
52
  let { triggerProps: triggerProps, overlayProps: overlayProps } = (0, $03da9$reactaria.useOverlayTrigger)({
53
53
  type: 'dialog'
54
54
  }, state, buttonRef);
55
+ // Allows popover width to match trigger element
56
+ let [buttonWidth, setButtonWidth] = (0, $03da9$react.useState)(null);
57
+ let onResize = (0, $03da9$react.useCallback)(()=>{
58
+ if (buttonRef.current) setButtonWidth(buttonRef.current.offsetWidth + 'px');
59
+ }, [
60
+ buttonRef
61
+ ]);
62
+ (0, $03da9$reactariautils.useResizeObserver)({
63
+ ref: buttonRef,
64
+ onResize: onResize
65
+ });
55
66
  // Label dialog by the trigger as a fallback if there is no title slot.
56
67
  // This is done in RAC instead of hooks because otherwise we cannot distinguish
57
68
  // between context and props. Normally aria-labelledby overrides the title
@@ -77,7 +88,10 @@ function $2979ab89b336194b$export$2e1e1122cf0cba88(props) {
77
88
  {
78
89
  trigger: 'DialogTrigger',
79
90
  triggerRef: buttonRef,
80
- 'aria-labelledby': overlayProps['aria-labelledby']
91
+ 'aria-labelledby': overlayProps['aria-labelledby'],
92
+ style: {
93
+ '--trigger-width': buttonWidth
94
+ }
81
95
  }
82
96
  ]
83
97
  ]
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Dialog.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaDialogProps, useDialog, useId, useOverlayTrigger} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {ContextValue, DEFAULT_SLOT, Provider, SlotProps, StyleProps, useContextProps, useRenderProps} from './utils';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {forwardRefType} from '@react-types/shared';\nimport {HeadingContext} from './RSPContexts';\nimport {OverlayTriggerProps, OverlayTriggerState, useMenuTriggerState} from 'react-stately';\nimport {PopoverContext} from './Popover';\nimport {PressResponder} from '@react-aria/interactions';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useRef} from 'react';\nimport {RootMenuTriggerStateContext} from './Menu';\n\nexport interface DialogTriggerProps extends OverlayTriggerProps {\n children: ReactNode\n}\n\nexport interface DialogRenderProps {\n close: () => void\n}\n\nexport interface DialogProps extends AriaDialogProps, StyleProps, SlotProps {\n /** Children of the dialog. A function may be provided to access a function to close the dialog. */\n children?: ReactNode | ((opts: DialogRenderProps) => ReactNode)\n}\n\nexport const DialogContext = createContext<ContextValue<DialogProps, HTMLElement>>(null);\nexport const OverlayTriggerStateContext = createContext<OverlayTriggerState | null>(null);\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n */\nexport function DialogTrigger(props: DialogTriggerProps): ReactNode {\n // Use useMenuTriggerState instead of useOverlayTriggerState in case a menu is embedded in the dialog.\n // This is needed to handle submenus.\n let state = useMenuTriggerState(props);\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let {triggerProps, overlayProps} = useOverlayTrigger({type: 'dialog'}, state, buttonRef);\n\n // Label dialog by the trigger as a fallback if there is no title slot.\n // This is done in RAC instead of hooks because otherwise we cannot distinguish\n // between context and props. Normally aria-labelledby overrides the title\n // but when sent by context we want the title to win.\n triggerProps.id = useId();\n overlayProps['aria-labelledby'] = triggerProps.id;\n\n return (\n <Provider\n values={[\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [DialogContext, overlayProps],\n [PopoverContext, {\n trigger: 'DialogTrigger',\n triggerRef: buttonRef,\n 'aria-labelledby': overlayProps['aria-labelledby']\n }]\n ]}>\n <PressResponder {...triggerProps} ref={buttonRef} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport const Dialog = /*#__PURE__*/ (forwardRef as forwardRefType)(function Dialog(props: DialogProps, ref: ForwardedRef<HTMLElement>) {\n let originalAriaLabelledby = props['aria-labelledby'];\n [props, ref] = useContextProps(props, ref, DialogContext);\n let {dialogProps, titleProps} = useDialog({\n ...props,\n // Only pass aria-labelledby from props, not context.\n // Context is used as a fallback below.\n 'aria-labelledby': originalAriaLabelledby\n }, ref);\n let state = useContext(OverlayTriggerStateContext);\n\n if (!dialogProps['aria-label'] && !dialogProps['aria-labelledby']) {\n // If aria-labelledby exists on props, we know it came from context.\n // Use that as a fallback in case there is no title slot.\n if (props['aria-labelledby']) {\n dialogProps['aria-labelledby'] = props['aria-labelledby'];\n } else if (process.env.NODE_ENV !== 'production') {\n console.warn('If a Dialog does not contain a <Heading slot=\"title\">, it must have an aria-label or aria-labelledby attribute for accessibility.');\n }\n }\n\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Dialog',\n className: props.className,\n style: props.style,\n children: props.children,\n values: {\n close: state?.close || (() => {})\n }\n });\n\n return (\n <section\n {...filterDOMProps(props)}\n {...dialogProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}>\n <Provider\n values={[\n [HeadingContext, {\n slots: {\n [DEFAULT_SLOT]: {},\n title: {...titleProps, level: 2}\n }\n }],\n [ButtonContext, {\n slots: {\n [DEFAULT_SLOT]: {},\n close: {\n onPress: () => state?.close()\n }\n }\n }]\n ]}>\n {renderProps.children}\n </Provider>\n </section>\n );\n});\n"],"names":[],"version":3,"file":"Dialog.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Dialog.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {AriaDialogProps, useDialog, useId, useOverlayTrigger} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {ContextValue, DEFAULT_SLOT, Provider, SlotProps, StyleProps, useContextProps, useRenderProps} from './utils';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {forwardRefType} from '@react-types/shared';\nimport {HeadingContext} from './RSPContexts';\nimport {OverlayTriggerProps, OverlayTriggerState, useMenuTriggerState} from 'react-stately';\nimport {PopoverContext} from './Popover';\nimport {PressResponder} from '@react-aria/interactions';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useCallback, useContext, useRef, useState} from 'react';\nimport {RootMenuTriggerStateContext} from './Menu';\n\nexport interface DialogTriggerProps extends OverlayTriggerProps {\n children: ReactNode\n}\n\nexport interface DialogRenderProps {\n close: () => void\n}\n\nexport interface DialogProps extends AriaDialogProps, StyleProps, SlotProps {\n /** Children of the dialog. A function may be provided to access a function to close the dialog. */\n children?: ReactNode | ((opts: DialogRenderProps) => ReactNode)\n}\n\nexport const DialogContext = createContext<ContextValue<DialogProps, HTMLElement>>(null);\nexport const OverlayTriggerStateContext = createContext<OverlayTriggerState | null>(null);\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n */\nexport function DialogTrigger(props: DialogTriggerProps): JSX.Element {\n // Use useMenuTriggerState instead of useOverlayTriggerState in case a menu is embedded in the dialog.\n // This is needed to handle submenus.\n let state = useMenuTriggerState(props);\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let {triggerProps, overlayProps} = useOverlayTrigger({type: 'dialog'}, state, buttonRef);\n\n // Allows popover width to match trigger element\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (buttonRef.current) {\n setButtonWidth(buttonRef.current.offsetWidth + 'px');\n }\n }, [buttonRef]);\n\n useResizeObserver({\n ref: buttonRef,\n onResize: onResize\n });\n\n // Label dialog by the trigger as a fallback if there is no title slot.\n // This is done in RAC instead of hooks because otherwise we cannot distinguish\n // between context and props. Normally aria-labelledby overrides the title\n // but when sent by context we want the title to win.\n triggerProps.id = useId();\n overlayProps['aria-labelledby'] = triggerProps.id;\n\n return (\n <Provider\n values={[\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [DialogContext, overlayProps],\n [PopoverContext, {\n trigger: 'DialogTrigger',\n triggerRef: buttonRef,\n 'aria-labelledby': overlayProps['aria-labelledby'],\n style: {'--trigger-width': buttonWidth} as React.CSSProperties\n }]\n ]}>\n <PressResponder {...triggerProps} ref={buttonRef} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport const Dialog = /*#__PURE__*/ (forwardRef as forwardRefType)(function Dialog(props: DialogProps, ref: ForwardedRef<HTMLElement>) {\n let originalAriaLabelledby = props['aria-labelledby'];\n [props, ref] = useContextProps(props, ref, DialogContext);\n let {dialogProps, titleProps} = useDialog({\n ...props,\n // Only pass aria-labelledby from props, not context.\n // Context is used as a fallback below.\n 'aria-labelledby': originalAriaLabelledby\n }, ref);\n let state = useContext(OverlayTriggerStateContext);\n\n if (!dialogProps['aria-label'] && !dialogProps['aria-labelledby']) {\n // If aria-labelledby exists on props, we know it came from context.\n // Use that as a fallback in case there is no title slot.\n if (props['aria-labelledby']) {\n dialogProps['aria-labelledby'] = props['aria-labelledby'];\n } else if (process.env.NODE_ENV !== 'production') {\n console.warn('If a Dialog does not contain a <Heading slot=\"title\">, it must have an aria-label or aria-labelledby attribute for accessibility.');\n }\n }\n\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Dialog',\n className: props.className,\n style: props.style,\n children: props.children,\n values: {\n close: state?.close || (() => {})\n }\n });\n\n return (\n <section\n {...filterDOMProps(props)}\n {...dialogProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}>\n <Provider\n values={[\n [HeadingContext, {\n slots: {\n [DEFAULT_SLOT]: {},\n title: {...titleProps, level: 2}\n }\n }],\n [ButtonContext, {\n slots: {\n [DEFAULT_SLOT]: {},\n close: {\n onPress: () => state?.close()\n }\n }\n }]\n ]}>\n {renderProps.children}\n </Provider>\n </section>\n );\n});\n"],"names":[],"version":3,"file":"Dialog.main.js.map"}
package/dist/Dialog.mjs CHANGED
@@ -4,10 +4,10 @@ import {HeadingContext as $4e85f108e88277b8$export$d688439359537581} from "./RSP
4
4
  import {PopoverContext as $07b14b47974efb58$export$9b9a0cd73afb7ca4} from "./Popover.mjs";
5
5
  import {RootMenuTriggerStateContext as $3674c52c6b3c5bce$export$795aec4671cbae19} from "./Menu.mjs";
6
6
  import {useOverlayTrigger as $6IYYA$useOverlayTrigger, useId as $6IYYA$useId, useDialog as $6IYYA$useDialog} from "react-aria";
7
- import {filterDOMProps as $6IYYA$filterDOMProps} from "@react-aria/utils";
7
+ import {useResizeObserver as $6IYYA$useResizeObserver, filterDOMProps as $6IYYA$filterDOMProps} from "@react-aria/utils";
8
8
  import {useMenuTriggerState as $6IYYA$useMenuTriggerState} from "react-stately";
9
9
  import {PressResponder as $6IYYA$PressResponder} from "@react-aria/interactions";
10
- import $6IYYA$react, {createContext as $6IYYA$createContext, useRef as $6IYYA$useRef, forwardRef as $6IYYA$forwardRef, useContext as $6IYYA$useContext} from "react";
10
+ import $6IYYA$react, {createContext as $6IYYA$createContext, useRef as $6IYYA$useRef, useState as $6IYYA$useState, useCallback as $6IYYA$useCallback, forwardRef as $6IYYA$forwardRef, useContext as $6IYYA$useContext} from "react";
11
11
 
12
12
  /*
13
13
  * Copyright 2022 Adobe. All rights reserved.
@@ -39,6 +39,17 @@ function $de32f1b87079253c$export$2e1e1122cf0cba88(props) {
39
39
  let { triggerProps: triggerProps, overlayProps: overlayProps } = (0, $6IYYA$useOverlayTrigger)({
40
40
  type: 'dialog'
41
41
  }, state, buttonRef);
42
+ // Allows popover width to match trigger element
43
+ let [buttonWidth, setButtonWidth] = (0, $6IYYA$useState)(null);
44
+ let onResize = (0, $6IYYA$useCallback)(()=>{
45
+ if (buttonRef.current) setButtonWidth(buttonRef.current.offsetWidth + 'px');
46
+ }, [
47
+ buttonRef
48
+ ]);
49
+ (0, $6IYYA$useResizeObserver)({
50
+ ref: buttonRef,
51
+ onResize: onResize
52
+ });
42
53
  // Label dialog by the trigger as a fallback if there is no title slot.
43
54
  // This is done in RAC instead of hooks because otherwise we cannot distinguish
44
55
  // between context and props. Normally aria-labelledby overrides the title
@@ -64,7 +75,10 @@ function $de32f1b87079253c$export$2e1e1122cf0cba88(props) {
64
75
  {
65
76
  trigger: 'DialogTrigger',
66
77
  triggerRef: buttonRef,
67
- 'aria-labelledby': overlayProps['aria-labelledby']
78
+ 'aria-labelledby': overlayProps['aria-labelledby'],
79
+ style: {
80
+ '--trigger-width': buttonWidth
81
+ }
68
82
  }
69
83
  ]
70
84
  ]