@react-aria/combobox 3.10.5 → 3.11.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/README.md +1 -1
  2. package/dist/ar-AE.main.js.map +1 -1
  3. package/dist/ar-AE.module.js.map +1 -1
  4. package/dist/bg-BG.main.js.map +1 -1
  5. package/dist/bg-BG.module.js.map +1 -1
  6. package/dist/cs-CZ.main.js.map +1 -1
  7. package/dist/cs-CZ.module.js.map +1 -1
  8. package/dist/da-DK.main.js.map +1 -1
  9. package/dist/da-DK.module.js.map +1 -1
  10. package/dist/de-DE.main.js.map +1 -1
  11. package/dist/de-DE.module.js.map +1 -1
  12. package/dist/el-GR.main.js.map +1 -1
  13. package/dist/el-GR.module.js.map +1 -1
  14. package/dist/en-US.main.js.map +1 -1
  15. package/dist/en-US.module.js.map +1 -1
  16. package/dist/es-ES.main.js.map +1 -1
  17. package/dist/es-ES.module.js.map +1 -1
  18. package/dist/et-EE.main.js.map +1 -1
  19. package/dist/et-EE.module.js.map +1 -1
  20. package/dist/fi-FI.main.js.map +1 -1
  21. package/dist/fi-FI.module.js.map +1 -1
  22. package/dist/fr-FR.main.js.map +1 -1
  23. package/dist/fr-FR.module.js.map +1 -1
  24. package/dist/he-IL.main.js.map +1 -1
  25. package/dist/he-IL.module.js.map +1 -1
  26. package/dist/hr-HR.main.js.map +1 -1
  27. package/dist/hr-HR.module.js.map +1 -1
  28. package/dist/hu-HU.main.js.map +1 -1
  29. package/dist/hu-HU.module.js.map +1 -1
  30. package/dist/it-IT.main.js.map +1 -1
  31. package/dist/it-IT.module.js.map +1 -1
  32. package/dist/ja-JP.main.js.map +1 -1
  33. package/dist/ja-JP.module.js.map +1 -1
  34. package/dist/ko-KR.main.js.map +1 -1
  35. package/dist/ko-KR.module.js.map +1 -1
  36. package/dist/lt-LT.main.js.map +1 -1
  37. package/dist/lt-LT.module.js.map +1 -1
  38. package/dist/lv-LV.main.js.map +1 -1
  39. package/dist/lv-LV.module.js.map +1 -1
  40. package/dist/nb-NO.main.js.map +1 -1
  41. package/dist/nb-NO.module.js.map +1 -1
  42. package/dist/nl-NL.main.js.map +1 -1
  43. package/dist/nl-NL.module.js.map +1 -1
  44. package/dist/pl-PL.main.js.map +1 -1
  45. package/dist/pl-PL.module.js.map +1 -1
  46. package/dist/pt-BR.main.js.map +1 -1
  47. package/dist/pt-BR.module.js.map +1 -1
  48. package/dist/pt-PT.main.js.map +1 -1
  49. package/dist/pt-PT.module.js.map +1 -1
  50. package/dist/ro-RO.main.js.map +1 -1
  51. package/dist/ro-RO.module.js.map +1 -1
  52. package/dist/ru-RU.main.js.map +1 -1
  53. package/dist/ru-RU.module.js.map +1 -1
  54. package/dist/sk-SK.main.js.map +1 -1
  55. package/dist/sk-SK.module.js.map +1 -1
  56. package/dist/sl-SI.main.js.map +1 -1
  57. package/dist/sl-SI.module.js.map +1 -1
  58. package/dist/sr-SP.main.js.map +1 -1
  59. package/dist/sr-SP.module.js.map +1 -1
  60. package/dist/sv-SE.main.js.map +1 -1
  61. package/dist/sv-SE.module.js.map +1 -1
  62. package/dist/tr-TR.main.js.map +1 -1
  63. package/dist/tr-TR.module.js.map +1 -1
  64. package/dist/types.d.ts.map +1 -1
  65. package/dist/uk-UA.main.js.map +1 -1
  66. package/dist/uk-UA.module.js.map +1 -1
  67. package/dist/useComboBox.main.js +20 -15
  68. package/dist/useComboBox.main.js.map +1 -1
  69. package/dist/useComboBox.mjs +21 -16
  70. package/dist/useComboBox.module.js +21 -16
  71. package/dist/useComboBox.module.js.map +1 -1
  72. package/dist/zh-CN.main.js.map +1 -1
  73. package/dist/zh-CN.module.js.map +1 -1
  74. package/dist/zh-TW.main.js.map +1 -1
  75. package/dist/zh-TW.module.js.map +1 -1
  76. package/package.json +18 -18
  77. package/src/useComboBox.ts +14 -12
@@ -3,7 +3,7 @@ import {announce as $dShfP$announce} from "@react-aria/live-announcer";
3
3
  import {ariaHideOutside as $dShfP$ariaHideOutside} from "@react-aria/overlays";
4
4
  import {listData as $dShfP$listData, getItemId as $dShfP$getItemId} from "@react-aria/listbox";
5
5
  import {useRouter as $dShfP$useRouter, chain as $dShfP$chain, useLabels as $dShfP$useLabels, isAppleDevice as $dShfP$isAppleDevice, mergeProps as $dShfP$mergeProps} from "@react-aria/utils";
6
- import {useMemo as $dShfP$useMemo, useRef as $dShfP$useRef, useEffect as $dShfP$useEffect} from "react";
6
+ import {useRef as $dShfP$useRef, useMemo as $dShfP$useMemo, useEffect as $dShfP$useEffect} from "react";
7
7
  import {getChildNodes as $dShfP$getChildNodes, getItemCount as $dShfP$getItemCount} from "@react-stately/collections";
8
8
  import {ListKeyboardDelegate as $dShfP$ListKeyboardDelegate, useSelectableCollection as $dShfP$useSelectableCollection} from "@react-aria/selection";
9
9
  import {privateValidationStateProp as $dShfP$privateValidationStateProp} from "@react-stately/form";
@@ -40,6 +40,8 @@ function $parcel$interopDefault(a) {
40
40
  function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
41
41
  let { buttonRef: buttonRef, popoverRef: popoverRef, inputRef: inputRef, listBoxRef: listBoxRef, keyboardDelegate: keyboardDelegate, layoutDelegate: layoutDelegate, shouldFocusWrap: // completionMode = 'suggest',
42
42
  shouldFocusWrap, isReadOnly: isReadOnly, isDisabled: isDisabled } = props;
43
+ let backupBtnRef = (0, $dShfP$useRef)(null);
44
+ buttonRef = buttonRef !== null && buttonRef !== void 0 ? buttonRef : backupBtnRef;
43
45
  let stringFormatter = (0, $dShfP$useLocalizedStringFormatter)((0, ($parcel$interopDefault($dShfP$intlStringsmodulejs))), '@react-aria/combobox');
44
46
  let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = (0, $dShfP$useMenuTrigger)({
45
47
  type: 'listbox',
@@ -86,13 +88,11 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
86
88
  // Prevent form submission if menu is open since we may be selecting a option
87
89
  if (state.isOpen && e.key === 'Enter') e.preventDefault();
88
90
  // If the focused item is a link, trigger opening it. Items that are links are not selectable.
89
- if (state.isOpen && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {
90
- if (e.key === 'Enter') {
91
- let item = listBoxRef.current.querySelector(`[data-key="${CSS.escape(state.selectionManager.focusedKey.toString())}"]`);
92
- if (item instanceof HTMLAnchorElement) {
93
- let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);
94
- router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions);
95
- }
91
+ if (state.isOpen && listBoxRef.current && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {
92
+ let item = listBoxRef.current.querySelector(`[data-key="${CSS.escape(state.selectionManager.focusedKey.toString())}"]`);
93
+ if (e.key === 'Enter' && item instanceof HTMLAnchorElement) {
94
+ let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);
95
+ if (collectionItem) router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions);
96
96
  }
97
97
  state.close();
98
98
  } else state.commit();
@@ -142,14 +142,16 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
142
142
  // Press handlers for the ComboBox button
143
143
  let onPress = (e)=>{
144
144
  if (e.pointerType === 'touch') {
145
- // Focus the input field in case it isn't focused yet
146
- inputRef.current.focus();
145
+ var // Focus the input field in case it isn't focused yet
146
+ _inputRef_current;
147
+ (_inputRef_current = inputRef.current) === null || _inputRef_current === void 0 ? void 0 : _inputRef_current.focus();
147
148
  state.toggle(null, 'manual');
148
149
  }
149
150
  };
150
151
  let onPressStart = (e)=>{
151
152
  if (e.pointerType !== 'touch') {
152
- inputRef.current.focus();
153
+ var _inputRef_current;
154
+ (_inputRef_current = inputRef.current) === null || _inputRef_current === void 0 ? void 0 : _inputRef_current.focus();
153
155
  state.toggle(e.pointerType === 'keyboard' || e.pointerType === 'virtual' ? 'first' : null, 'manual');
154
156
  }
155
157
  };
@@ -169,8 +171,9 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
169
171
  if (isDisabled || isReadOnly) return;
170
172
  // Sometimes VoiceOver on iOS fires two touchend events in quick succession. Ignore the second one.
171
173
  if (e.timeStamp - lastEventTime.current < 500) {
174
+ var _inputRef_current;
172
175
  e.preventDefault();
173
- inputRef.current.focus();
176
+ (_inputRef_current = inputRef.current) === null || _inputRef_current === void 0 ? void 0 : _inputRef_current.focus();
174
177
  return;
175
178
  }
176
179
  let rect = e.target.getBoundingClientRect();
@@ -178,8 +181,9 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
178
181
  let centerX = Math.ceil(rect.left + .5 * rect.width);
179
182
  let centerY = Math.ceil(rect.top + .5 * rect.height);
180
183
  if (touch.clientX === centerX && touch.clientY === centerY) {
184
+ var _inputRef_current1;
181
185
  e.preventDefault();
182
- inputRef.current.focus();
186
+ (_inputRef_current1 = inputRef.current) === null || _inputRef_current1 === void 0 ? void 0 : _inputRef_current1.focus();
183
187
  state.toggle(null, 'manual');
184
188
  lastEventTime.current = e.timeStamp;
185
189
  }
@@ -195,12 +199,13 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
195
199
  let lastSection = (0, $dShfP$useRef)(sectionKey);
196
200
  let lastItem = (0, $dShfP$useRef)(itemKey);
197
201
  (0, $dShfP$useEffect)(()=>{
198
- if ((0, $dShfP$isAppleDevice)() && focusedItem != null && itemKey !== lastItem.current) {
202
+ if ((0, $dShfP$isAppleDevice)() && focusedItem != null && itemKey != null && itemKey !== lastItem.current) {
199
203
  let isSelected = state.selectionManager.isSelected(itemKey);
200
204
  let section = sectionKey != null ? state.collection.getItem(sectionKey) : null;
201
205
  let sectionTitle = (section === null || section === void 0 ? void 0 : section['aria-label']) || (typeof (section === null || section === void 0 ? void 0 : section.rendered) === 'string' ? section.rendered : '') || '';
206
+ var _ref;
202
207
  let announcement = stringFormatter.format('focusAnnouncement', {
203
- isGroupChange: section && sectionKey !== lastSection.current,
208
+ isGroupChange: (_ref = section && sectionKey !== lastSection.current) !== null && _ref !== void 0 ? _ref : false,
204
209
  groupTitle: sectionTitle,
205
210
  groupCount: section ? [
206
211
  ...(0, $dShfP$getChildNodes)(section, state.collection)
@@ -247,7 +252,7 @@ function $c350ade66beef0af$export$8c18d1b4f7232bbf(props, state) {
247
252
  if (state.isOpen) return (0, $dShfP$ariaHideOutside)([
248
253
  inputRef.current,
249
254
  popoverRef.current
250
- ]);
255
+ ].filter((element)=>element != null));
251
256
  }, [
252
257
  state.isOpen,
253
258
  inputRef,
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/combobox/src/useComboBox.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {announce} from '@react-aria/live-announcer';\nimport {AriaButtonProps} from '@react-types/button';\nimport {AriaComboBoxProps} from '@react-types/combobox';\nimport {ariaHideOutside} from '@react-aria/overlays';\nimport {AriaListBoxOptions, getItemId, listData} from '@react-aria/listbox';\nimport {BaseEvent, DOMAttributes, KeyboardDelegate, LayoutDelegate, PressEvent, RefObject, RouterOptions, ValidationResult} from '@react-types/shared';\nimport {chain, isAppleDevice, mergeProps, useLabels, useRouter} from '@react-aria/utils';\nimport {ComboBoxState} from '@react-stately/combobox';\nimport {FocusEvent, InputHTMLAttributes, KeyboardEvent, TouchEvent, useEffect, useMemo, useRef} from 'react';\nimport {getChildNodes, getItemCount} from '@react-stately/collections';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate, useSelectableCollection} from '@react-aria/selection';\nimport {privateValidationStateProp} from '@react-stately/form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMenuTrigger} from '@react-aria/menu';\nimport {useTextField} from '@react-aria/textfield';\n\nexport interface AriaComboBoxOptions<T> extends Omit<AriaComboBoxProps<T>, 'children'> {\n /** The ref for the input element. */\n inputRef: RefObject<HTMLInputElement | null>,\n /** The ref for the list box popover. */\n popoverRef: RefObject<Element | null>,\n /** The ref for the list box. */\n listBoxRef: RefObject<HTMLElement | null>,\n /** The ref for the optional list box popup trigger button. */\n buttonRef?: RefObject<Element | null>,\n /** An optional keyboard delegate implementation, to override the default. */\n keyboardDelegate?: KeyboardDelegate,\n /**\n * A delegate object that provides layout information for items in the collection.\n * By default this uses the DOM, but this can be overridden to implement things like\n * virtualized scrolling.\n */\n layoutDelegate?: LayoutDelegate\n}\n\nexport interface ComboBoxAria<T> extends ValidationResult {\n /** Props for the label element. */\n labelProps: DOMAttributes,\n /** Props for the combo box input element. */\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the list box, to be passed to [useListBox](useListBox.html). */\n listBoxProps: AriaListBoxOptions<T>,\n /** Props for the optional trigger button, to be passed to [useButton](useButton.html). */\n buttonProps: AriaButtonProps,\n /** Props for the combo box description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the combo box error message element, if any. */\n errorMessageProps: DOMAttributes\n}\n\n/**\n * Provides the behavior and accessibility implementation for a combo box component.\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 * @param props - Props for the combo box.\n * @param state - State for the select, as returned by `useComboBoxState`.\n */\nexport function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxState<T>): ComboBoxAria<T> {\n let {\n buttonRef,\n popoverRef,\n inputRef,\n listBoxRef,\n keyboardDelegate,\n layoutDelegate,\n // completionMode = 'suggest',\n shouldFocusWrap,\n isReadOnly,\n isDisabled\n } = props;\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/combobox');\n let {menuTriggerProps, menuProps} = useMenuTrigger<T>(\n {\n type: 'listbox',\n isDisabled: isDisabled || isReadOnly\n },\n state,\n buttonRef\n );\n\n // Set listbox id so it can be used when calling getItemId later\n listData.set(state, {id: menuProps.id});\n\n // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).\n // When virtualized, the layout object will be passed in as a prop and override this.\n let {collection} = state;\n let {disabledKeys} = state.selectionManager;\n let delegate = useMemo(() => (\n keyboardDelegate || new ListKeyboardDelegate({\n collection,\n disabledKeys,\n ref: listBoxRef,\n layoutDelegate\n })\n ), [keyboardDelegate, layoutDelegate, collection, disabledKeys, listBoxRef]);\n\n // Use useSelectableCollection to get the keyboard handlers to apply to the textfield\n let {collectionProps} = useSelectableCollection({\n selectionManager: state.selectionManager,\n keyboardDelegate: delegate,\n disallowTypeAhead: true,\n disallowEmptySelection: true,\n shouldFocusWrap,\n ref: inputRef,\n // Prevent item scroll behavior from being applied here, should be handled in the user's Popover + ListBox component\n isVirtualized: true\n });\n\n let router = useRouter();\n\n // For textfield specific keydown operations\n let onKeyDown = (e: BaseEvent<KeyboardEvent<any>>) => {\n if (e.nativeEvent.isComposing) {\n return;\n }\n switch (e.key) {\n case 'Enter':\n case 'Tab':\n // Prevent form submission if menu is open since we may be selecting a option\n if (state.isOpen && e.key === 'Enter') {\n e.preventDefault();\n }\n\n // If the focused item is a link, trigger opening it. Items that are links are not selectable.\n if (state.isOpen && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {\n if (e.key === 'Enter') {\n let item = listBoxRef.current.querySelector(`[data-key=\"${CSS.escape(state.selectionManager.focusedKey.toString())}\"]`);\n if (item instanceof HTMLAnchorElement) {\n let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);\n router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions as RouterOptions);\n }\n }\n\n state.close();\n } else {\n state.commit();\n }\n break;\n case 'Escape':\n if (\n state.selectedKey !== null ||\n state.inputValue === '' ||\n props.allowsCustomValue\n ) {\n e.continuePropagation();\n }\n state.revert();\n break;\n case 'ArrowDown':\n state.open('first', 'manual');\n break;\n case 'ArrowUp':\n state.open('last', 'manual');\n break;\n case 'ArrowLeft':\n case 'ArrowRight':\n state.selectionManager.setFocusedKey(null);\n break;\n }\n };\n\n let onBlur = (e: FocusEvent<HTMLInputElement>) => {\n let blurFromButton = buttonRef?.current && buttonRef.current === e.relatedTarget;\n let blurIntoPopover = popoverRef.current?.contains(e.relatedTarget);\n // Ignore blur if focused moved to the button(if exists) or into the popover.\n if (blurFromButton || blurIntoPopover) {\n return;\n }\n\n if (props.onBlur) {\n props.onBlur(e);\n }\n\n state.setFocused(false);\n };\n\n let onFocus = (e: FocusEvent<HTMLInputElement>) => {\n if (state.isFocused) {\n return;\n }\n\n if (props.onFocus) {\n props.onFocus(e);\n }\n\n state.setFocused(true);\n };\n\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, inputProps, descriptionProps, errorMessageProps} = useTextField({\n ...props,\n onChange: state.setInputValue,\n onKeyDown: !isReadOnly ? chain(state.isOpen && collectionProps.onKeyDown, onKeyDown, props.onKeyDown) : props.onKeyDown,\n onBlur,\n value: state.inputValue,\n onFocus,\n autoComplete: 'off',\n validate: undefined,\n [privateValidationStateProp]: state\n }, inputRef);\n\n // Press handlers for the ComboBox button\n let onPress = (e: PressEvent) => {\n if (e.pointerType === 'touch') {\n // Focus the input field in case it isn't focused yet\n inputRef.current.focus();\n state.toggle(null, 'manual');\n }\n };\n\n let onPressStart = (e: PressEvent) => {\n if (e.pointerType !== 'touch') {\n inputRef.current.focus();\n state.toggle((e.pointerType === 'keyboard' || e.pointerType === 'virtual') ? 'first' : null, 'manual');\n }\n };\n\n let triggerLabelProps = useLabels({\n id: menuTriggerProps.id,\n 'aria-label': stringFormatter.format('buttonLabel'),\n 'aria-labelledby': props['aria-labelledby'] || labelProps.id\n });\n\n let listBoxProps = useLabels({\n id: menuProps.id,\n 'aria-label': stringFormatter.format('listboxLabel'),\n 'aria-labelledby': props['aria-labelledby'] || labelProps.id\n });\n\n // If a touch happens on direct center of ComboBox input, might be virtual click from iPad so open ComboBox menu\n let lastEventTime = useRef(0);\n let onTouchEnd = (e: TouchEvent) => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n // Sometimes VoiceOver on iOS fires two touchend events in quick succession. Ignore the second one.\n if (e.timeStamp - lastEventTime.current < 500) {\n e.preventDefault();\n inputRef.current.focus();\n return;\n }\n\n let rect = (e.target as Element).getBoundingClientRect();\n let touch = e.changedTouches[0];\n\n let centerX = Math.ceil(rect.left + .5 * rect.width);\n let centerY = Math.ceil(rect.top + .5 * rect.height);\n\n if (touch.clientX === centerX && touch.clientY === centerY) {\n e.preventDefault();\n inputRef.current.focus();\n state.toggle(null, 'manual');\n\n lastEventTime.current = e.timeStamp;\n }\n };\n\n // VoiceOver has issues with announcing aria-activedescendant properly on change\n // (especially on iOS). We use a live region announcer to announce focus changes\n // manually. In addition, section titles are announced when navigating into a new section.\n let focusedItem = state.selectionManager.focusedKey != null && state.isOpen\n ? state.collection.getItem(state.selectionManager.focusedKey)\n : undefined;\n let sectionKey = focusedItem?.parentKey ?? null;\n let itemKey = state.selectionManager.focusedKey ?? null;\n let lastSection = useRef(sectionKey);\n let lastItem = useRef(itemKey);\n useEffect(() => {\n if (isAppleDevice() && focusedItem != null && itemKey !== lastItem.current) {\n let isSelected = state.selectionManager.isSelected(itemKey);\n let section = sectionKey != null ? state.collection.getItem(sectionKey) : null;\n let sectionTitle = section?.['aria-label'] || (typeof section?.rendered === 'string' ? section.rendered : '') || '';\n\n let announcement = stringFormatter.format('focusAnnouncement', {\n isGroupChange: section && sectionKey !== lastSection.current,\n groupTitle: sectionTitle,\n groupCount: section ? [...getChildNodes(section, state.collection)].length : 0,\n optionText: focusedItem['aria-label'] || focusedItem.textValue || '',\n isSelected\n });\n\n announce(announcement);\n }\n\n lastSection.current = sectionKey;\n lastItem.current = itemKey;\n });\n\n // Announce the number of available suggestions when it changes\n let optionCount = getItemCount(state.collection);\n let lastSize = useRef(optionCount);\n let lastOpen = useRef(state.isOpen);\n useEffect(() => {\n // Only announce the number of options available when the menu opens if there is no\n // focused item, otherwise screen readers will typically read e.g. \"1 of 6\".\n // The exception is VoiceOver since this isn't included in the message above.\n let didOpenWithoutFocusedItem =\n state.isOpen !== lastOpen.current &&\n (state.selectionManager.focusedKey == null || isAppleDevice());\n\n if (state.isOpen && (didOpenWithoutFocusedItem || optionCount !== lastSize.current)) {\n let announcement = stringFormatter.format('countAnnouncement', {optionCount});\n announce(announcement);\n }\n\n lastSize.current = optionCount;\n lastOpen.current = state.isOpen;\n });\n\n // Announce when a selection occurs for VoiceOver. Other screen readers typically do this automatically.\n let lastSelectedKey = useRef(state.selectedKey);\n useEffect(() => {\n if (isAppleDevice() && state.isFocused && state.selectedItem && state.selectedKey !== lastSelectedKey.current) {\n let optionText = state.selectedItem['aria-label'] || state.selectedItem.textValue || '';\n let announcement = stringFormatter.format('selectedAnnouncement', {optionText});\n announce(announcement);\n }\n\n lastSelectedKey.current = state.selectedKey;\n });\n\n useEffect(() => {\n if (state.isOpen) {\n return ariaHideOutside([inputRef.current, popoverRef.current]);\n }\n }, [state.isOpen, inputRef, popoverRef]);\n\n return {\n labelProps,\n buttonProps: {\n ...menuTriggerProps,\n ...triggerLabelProps,\n excludeFromTabOrder: true,\n preventFocusOnPress: true,\n onPress,\n onPressStart,\n isDisabled: isDisabled || isReadOnly\n },\n inputProps: mergeProps(inputProps, {\n role: 'combobox',\n 'aria-expanded': menuTriggerProps['aria-expanded'],\n 'aria-controls': state.isOpen ? menuProps.id : undefined,\n // TODO: readd proper logic for completionMode = complete (aria-autocomplete: both)\n 'aria-autocomplete': 'list',\n 'aria-activedescendant': focusedItem ? getItemId(state, focusedItem.key) : undefined,\n onTouchEnd,\n // This disable's iOS's autocorrect suggestions, since the combo box provides its own suggestions.\n autoCorrect: 'off',\n // This disable's the macOS Safari spell check auto corrections.\n spellCheck: 'false'\n }),\n listBoxProps: mergeProps(menuProps, listBoxProps, {\n autoFocus: state.focusStrategy,\n shouldUseVirtualFocus: true,\n shouldSelectOnPressUp: true,\n shouldFocusOnHover: true,\n linkBehavior: 'selection' as const\n }),\n descriptionProps,\n errorMessageProps,\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useComboBox.module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/combobox/src/useComboBox.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {announce} from '@react-aria/live-announcer';\nimport {AriaButtonProps} from '@react-types/button';\nimport {AriaComboBoxProps} from '@react-types/combobox';\nimport {ariaHideOutside} from '@react-aria/overlays';\nimport {AriaListBoxOptions, getItemId, listData} from '@react-aria/listbox';\nimport {BaseEvent, DOMAttributes, KeyboardDelegate, LayoutDelegate, PressEvent, RefObject, RouterOptions, ValidationResult} from '@react-types/shared';\nimport {chain, isAppleDevice, mergeProps, useLabels, useRouter} from '@react-aria/utils';\nimport {ComboBoxState} from '@react-stately/combobox';\nimport {FocusEvent, InputHTMLAttributes, KeyboardEvent, TouchEvent, useEffect, useMemo, useRef} from 'react';\nimport {getChildNodes, getItemCount} from '@react-stately/collections';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate, useSelectableCollection} from '@react-aria/selection';\nimport {privateValidationStateProp} from '@react-stately/form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMenuTrigger} from '@react-aria/menu';\nimport {useTextField} from '@react-aria/textfield';\n\nexport interface AriaComboBoxOptions<T> extends Omit<AriaComboBoxProps<T>, 'children'> {\n /** The ref for the input element. */\n inputRef: RefObject<HTMLInputElement | null>,\n /** The ref for the list box popover. */\n popoverRef: RefObject<Element | null>,\n /** The ref for the list box. */\n listBoxRef: RefObject<HTMLElement | null>,\n /** The ref for the optional list box popup trigger button. */\n buttonRef?: RefObject<Element | null>,\n /** An optional keyboard delegate implementation, to override the default. */\n keyboardDelegate?: KeyboardDelegate,\n /**\n * A delegate object that provides layout information for items in the collection.\n * By default this uses the DOM, but this can be overridden to implement things like\n * virtualized scrolling.\n */\n layoutDelegate?: LayoutDelegate\n}\n\nexport interface ComboBoxAria<T> extends ValidationResult {\n /** Props for the label element. */\n labelProps: DOMAttributes,\n /** Props for the combo box input element. */\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the list box, to be passed to [useListBox](useListBox.html). */\n listBoxProps: AriaListBoxOptions<T>,\n /** Props for the optional trigger button, to be passed to [useButton](useButton.html). */\n buttonProps: AriaButtonProps,\n /** Props for the combo box description element, if any. */\n descriptionProps: DOMAttributes,\n /** Props for the combo box error message element, if any. */\n errorMessageProps: DOMAttributes\n}\n\n/**\n * Provides the behavior and accessibility implementation for a combo box component.\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 * @param props - Props for the combo box.\n * @param state - State for the select, as returned by `useComboBoxState`.\n */\nexport function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxState<T>): ComboBoxAria<T> {\n let {\n buttonRef,\n popoverRef,\n inputRef,\n listBoxRef,\n keyboardDelegate,\n layoutDelegate,\n // completionMode = 'suggest',\n shouldFocusWrap,\n isReadOnly,\n isDisabled\n } = props;\n let backupBtnRef = useRef(null);\n buttonRef = buttonRef ?? backupBtnRef;\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/combobox');\n let {menuTriggerProps, menuProps} = useMenuTrigger<T>(\n {\n type: 'listbox',\n isDisabled: isDisabled || isReadOnly\n },\n state,\n buttonRef\n );\n\n // Set listbox id so it can be used when calling getItemId later\n listData.set(state, {id: menuProps.id});\n\n // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).\n // When virtualized, the layout object will be passed in as a prop and override this.\n let {collection} = state;\n let {disabledKeys} = state.selectionManager;\n let delegate = useMemo(() => (\n keyboardDelegate || new ListKeyboardDelegate({\n collection,\n disabledKeys,\n ref: listBoxRef,\n layoutDelegate\n })\n ), [keyboardDelegate, layoutDelegate, collection, disabledKeys, listBoxRef]);\n\n // Use useSelectableCollection to get the keyboard handlers to apply to the textfield\n let {collectionProps} = useSelectableCollection({\n selectionManager: state.selectionManager,\n keyboardDelegate: delegate,\n disallowTypeAhead: true,\n disallowEmptySelection: true,\n shouldFocusWrap,\n ref: inputRef,\n // Prevent item scroll behavior from being applied here, should be handled in the user's Popover + ListBox component\n isVirtualized: true\n });\n\n let router = useRouter();\n\n // For textfield specific keydown operations\n let onKeyDown = (e: BaseEvent<KeyboardEvent<any>>) => {\n if (e.nativeEvent.isComposing) {\n return;\n }\n switch (e.key) {\n case 'Enter':\n case 'Tab':\n // Prevent form submission if menu is open since we may be selecting a option\n if (state.isOpen && e.key === 'Enter') {\n e.preventDefault();\n }\n\n // If the focused item is a link, trigger opening it. Items that are links are not selectable.\n if (state.isOpen && listBoxRef.current && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {\n let item = listBoxRef.current.querySelector(`[data-key=\"${CSS.escape(state.selectionManager.focusedKey.toString())}\"]`);\n if (e.key === 'Enter' && item instanceof HTMLAnchorElement) {\n let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);\n if (collectionItem) {\n router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions as RouterOptions);\n }\n }\n\n state.close();\n } else {\n state.commit();\n }\n break;\n case 'Escape':\n if (\n state.selectedKey !== null ||\n state.inputValue === '' ||\n props.allowsCustomValue\n ) {\n e.continuePropagation();\n }\n state.revert();\n break;\n case 'ArrowDown':\n state.open('first', 'manual');\n break;\n case 'ArrowUp':\n state.open('last', 'manual');\n break;\n case 'ArrowLeft':\n case 'ArrowRight':\n state.selectionManager.setFocusedKey(null);\n break;\n }\n };\n\n let onBlur = (e: FocusEvent<HTMLInputElement>) => {\n let blurFromButton = buttonRef?.current && buttonRef.current === e.relatedTarget;\n let blurIntoPopover = popoverRef.current?.contains(e.relatedTarget);\n // Ignore blur if focused moved to the button(if exists) or into the popover.\n if (blurFromButton || blurIntoPopover) {\n return;\n }\n\n if (props.onBlur) {\n props.onBlur(e);\n }\n\n state.setFocused(false);\n };\n\n let onFocus = (e: FocusEvent<HTMLInputElement>) => {\n if (state.isFocused) {\n return;\n }\n\n if (props.onFocus) {\n props.onFocus(e);\n }\n\n state.setFocused(true);\n };\n\n let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n let {labelProps, inputProps, descriptionProps, errorMessageProps} = useTextField({\n ...props,\n onChange: state.setInputValue,\n onKeyDown: !isReadOnly ? chain(state.isOpen && collectionProps.onKeyDown, onKeyDown, props.onKeyDown) : props.onKeyDown,\n onBlur,\n value: state.inputValue,\n onFocus,\n autoComplete: 'off',\n validate: undefined,\n [privateValidationStateProp]: state\n }, inputRef);\n\n // Press handlers for the ComboBox button\n let onPress = (e: PressEvent) => {\n if (e.pointerType === 'touch') {\n // Focus the input field in case it isn't focused yet\n inputRef.current?.focus();\n state.toggle(null, 'manual');\n }\n };\n\n let onPressStart = (e: PressEvent) => {\n if (e.pointerType !== 'touch') {\n inputRef.current?.focus();\n state.toggle((e.pointerType === 'keyboard' || e.pointerType === 'virtual') ? 'first' : null, 'manual');\n }\n };\n\n let triggerLabelProps = useLabels({\n id: menuTriggerProps.id,\n 'aria-label': stringFormatter.format('buttonLabel'),\n 'aria-labelledby': props['aria-labelledby'] || labelProps.id\n });\n\n let listBoxProps = useLabels({\n id: menuProps.id,\n 'aria-label': stringFormatter.format('listboxLabel'),\n 'aria-labelledby': props['aria-labelledby'] || labelProps.id\n });\n\n // If a touch happens on direct center of ComboBox input, might be virtual click from iPad so open ComboBox menu\n let lastEventTime = useRef(0);\n let onTouchEnd = (e: TouchEvent) => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n // Sometimes VoiceOver on iOS fires two touchend events in quick succession. Ignore the second one.\n if (e.timeStamp - lastEventTime.current < 500) {\n e.preventDefault();\n inputRef.current?.focus();\n return;\n }\n\n let rect = (e.target as Element).getBoundingClientRect();\n let touch = e.changedTouches[0];\n\n let centerX = Math.ceil(rect.left + .5 * rect.width);\n let centerY = Math.ceil(rect.top + .5 * rect.height);\n\n if (touch.clientX === centerX && touch.clientY === centerY) {\n e.preventDefault();\n inputRef.current?.focus();\n state.toggle(null, 'manual');\n\n lastEventTime.current = e.timeStamp;\n }\n };\n\n // VoiceOver has issues with announcing aria-activedescendant properly on change\n // (especially on iOS). We use a live region announcer to announce focus changes\n // manually. In addition, section titles are announced when navigating into a new section.\n let focusedItem = state.selectionManager.focusedKey != null && state.isOpen\n ? state.collection.getItem(state.selectionManager.focusedKey)\n : undefined;\n let sectionKey = focusedItem?.parentKey ?? null;\n let itemKey = state.selectionManager.focusedKey ?? null;\n let lastSection = useRef(sectionKey);\n let lastItem = useRef(itemKey);\n useEffect(() => {\n if (isAppleDevice() && focusedItem != null && itemKey != null && itemKey !== lastItem.current) {\n let isSelected = state.selectionManager.isSelected(itemKey);\n let section = sectionKey != null ? state.collection.getItem(sectionKey) : null;\n let sectionTitle = section?.['aria-label'] || (typeof section?.rendered === 'string' ? section.rendered : '') || '';\n\n let announcement = stringFormatter.format('focusAnnouncement', {\n isGroupChange: (section && sectionKey !== lastSection.current) ?? false,\n groupTitle: sectionTitle,\n groupCount: section ? [...getChildNodes(section, state.collection)].length : 0,\n optionText: focusedItem['aria-label'] || focusedItem.textValue || '',\n isSelected\n });\n\n announce(announcement);\n }\n\n lastSection.current = sectionKey;\n lastItem.current = itemKey;\n });\n\n // Announce the number of available suggestions when it changes\n let optionCount = getItemCount(state.collection);\n let lastSize = useRef(optionCount);\n let lastOpen = useRef(state.isOpen);\n useEffect(() => {\n // Only announce the number of options available when the menu opens if there is no\n // focused item, otherwise screen readers will typically read e.g. \"1 of 6\".\n // The exception is VoiceOver since this isn't included in the message above.\n let didOpenWithoutFocusedItem =\n state.isOpen !== lastOpen.current &&\n (state.selectionManager.focusedKey == null || isAppleDevice());\n\n if (state.isOpen && (didOpenWithoutFocusedItem || optionCount !== lastSize.current)) {\n let announcement = stringFormatter.format('countAnnouncement', {optionCount});\n announce(announcement);\n }\n\n lastSize.current = optionCount;\n lastOpen.current = state.isOpen;\n });\n\n // Announce when a selection occurs for VoiceOver. Other screen readers typically do this automatically.\n let lastSelectedKey = useRef(state.selectedKey);\n useEffect(() => {\n if (isAppleDevice() && state.isFocused && state.selectedItem && state.selectedKey !== lastSelectedKey.current) {\n let optionText = state.selectedItem['aria-label'] || state.selectedItem.textValue || '';\n let announcement = stringFormatter.format('selectedAnnouncement', {optionText});\n announce(announcement);\n }\n\n lastSelectedKey.current = state.selectedKey;\n });\n\n useEffect(() => {\n if (state.isOpen) {\n return ariaHideOutside([inputRef.current, popoverRef.current].filter(element => element != null));\n }\n }, [state.isOpen, inputRef, popoverRef]);\n\n return {\n labelProps,\n buttonProps: {\n ...menuTriggerProps,\n ...triggerLabelProps,\n excludeFromTabOrder: true,\n preventFocusOnPress: true,\n onPress,\n onPressStart,\n isDisabled: isDisabled || isReadOnly\n },\n inputProps: mergeProps(inputProps, {\n role: 'combobox',\n 'aria-expanded': menuTriggerProps['aria-expanded'],\n 'aria-controls': state.isOpen ? menuProps.id : undefined,\n // TODO: readd proper logic for completionMode = complete (aria-autocomplete: both)\n 'aria-autocomplete': 'list',\n 'aria-activedescendant': focusedItem ? getItemId(state, focusedItem.key) : undefined,\n onTouchEnd,\n // This disable's iOS's autocorrect suggestions, since the combo box provides its own suggestions.\n autoCorrect: 'off',\n // This disable's the macOS Safari spell check auto corrections.\n spellCheck: 'false'\n }),\n listBoxProps: mergeProps(menuProps, listBoxProps, {\n autoFocus: state.focusStrategy,\n shouldUseVirtualFocus: true,\n shouldSelectOnPressUp: true,\n shouldFocusOnHover: true,\n linkBehavior: 'selection' as const\n }),\n descriptionProps,\n errorMessageProps,\n isInvalid,\n validationErrors,\n validationDetails\n };\n}\n"],"names":[],"version":3,"file":"useComboBox.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,CAAC,SAAE,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;YAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;QAAA,GAAG,wBAAG,CAAC;IAC1M,qBAAqB,CAAC,MAAM,YAAc,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yBAAI,EAAE,KAAK,UAAU,CAAC,0CAAO,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;oBAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,aAAa,EAAE,EAAE,KAAK,UAAU,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,UAAU,EAAE,CAAC;IACvX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-CN.json"],"sourcesContent":["{\n \"buttonLabel\": \"显示建议\",\n \"countAnnouncement\": \"有 {optionCount, plural, one {# 个选项} other {# 个选项}}可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {进入了 {groupTitle} 组,其中有 {groupCount, plural, one {# 个选项} other {# 个选项}}. } other {}}{optionText}{isSelected, select, true {, 已选择} other {}}\",\n \"listboxLabel\": \"建议\",\n \"selectedAnnouncement\": \"{optionText}, 已选择\"\n}\n"],"names":[],"version":3,"file":"zh-CN.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,CAAC,SAAE,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;YAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;QAAA,GAAG,wBAAG,CAAC;IAC1M,qBAAqB,CAAC,MAAM,YAAc,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yBAAI,EAAE,KAAK,UAAU,CAAC,0CAAO,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;oBAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,aAAa,IAAI,KAAK,UAAU,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,UAAU,GAAG;IACvX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,GAAG,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-CN.json"],"sourcesContent":["{\n \"buttonLabel\": \"显示建议\",\n \"countAnnouncement\": \"有 {optionCount, plural, one {# 个选项} other {# 个选项}}可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {进入了 {groupTitle} 组,其中有 {groupCount, plural, one {# 个选项} other {# 个选项}}. } other {}}{optionText}{isSelected, select, true {, 已选择} other {}}\",\n \"listboxLabel\": \"建议\",\n \"selectedAnnouncement\": \"{optionText}, 已选择\"\n}\n"],"names":[],"version":3,"file":"zh-CN.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,CAAC,SAAE,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;YAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;QAAA,GAAG,wBAAG,CAAC;IAC1M,qBAAqB,CAAC,MAAM,YAAc,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yBAAI,EAAE,KAAK,UAAU,CAAC,0CAAO,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;oBAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,aAAa,EAAE,EAAE,KAAK,UAAU,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,UAAU,EAAE,CAAC;IACvX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-CN.json"],"sourcesContent":["{\n \"buttonLabel\": \"显示建议\",\n \"countAnnouncement\": \"有 {optionCount, plural, one {# 个选项} other {# 个选项}}可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {进入了 {groupTitle} 组,其中有 {groupCount, plural, one {# 个选项} other {# 个选项}}. } other {}}{optionText}{isSelected, select, true {, 已选择} other {}}\",\n \"listboxLabel\": \"建议\",\n \"selectedAnnouncement\": \"{optionText}, 已选择\"\n}\n"],"names":[],"version":3,"file":"zh-CN.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,CAAC,SAAE,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;YAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,yBAAI,CAAC;QAAA,GAAG,wBAAG,CAAC;IAC1M,qBAAqB,CAAC,MAAM,YAAc,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yBAAI,EAAE,KAAK,UAAU,CAAC,0CAAO,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;oBAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,yBAAI,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,aAAa,IAAI,KAAK,UAAU,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,UAAU,GAAG;IACvX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,GAAG,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-CN.json"],"sourcesContent":["{\n \"buttonLabel\": \"显示建议\",\n \"countAnnouncement\": \"有 {optionCount, plural, one {# 个选项} other {# 个选项}}可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {进入了 {groupTitle} 组,其中有 {groupCount, plural, one {# 个选项} other {# 个选项}}. } other {}}{optionText}{isSelected, select, true {, 已选择} other {}}\",\n \"listboxLabel\": \"建议\",\n \"selectedAnnouncement\": \"{optionText}, 已选择\"\n}\n"],"names":[],"version":3,"file":"zh-CN.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;YAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;QAAA,GAAG,yBAAI,CAAC;IACvM,qBAAqB,CAAC,MAAM,YAAc,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yCAAM,EAAE,KAAK,UAAU,CAAC,WAAI,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;oBAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,aAAa,EAAE,EAAE,KAAK,UAAU,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,UAAU,EAAE,CAAC;IACpX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-TW.json"],"sourcesContent":["{\n \"buttonLabel\": \"顯示建議\",\n \"countAnnouncement\": \"{optionCount, plural, one {# 選項} other {# 選項}} 可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {輸入的群組 {groupTitle}, 有 {groupCount, plural, one {# 選項} other {# 選項}}. } other {}}{optionText}{isSelected, select, true {, 已選取} other {}}\",\n \"listboxLabel\": \"建議\",\n \"selectedAnnouncement\": \"{optionText}, 已選取\"\n}\n"],"names":[],"version":3,"file":"zh-TW.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;YAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;QAAA,GAAG,yBAAI,CAAC;IACvM,qBAAqB,CAAC,MAAM,YAAc,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yCAAM,EAAE,KAAK,UAAU,CAAC,WAAI,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;oBAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,aAAa,IAAI,KAAK,UAAU,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,UAAU,GAAG;IACpX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,GAAG,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-TW.json"],"sourcesContent":["{\n \"buttonLabel\": \"顯示建議\",\n \"countAnnouncement\": \"{optionCount, plural, one {# 選項} other {# 選項}} 可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {輸入的群組 {groupTitle}, 有 {groupCount, plural, one {# 選項} other {# 選項}}. } other {}}{optionText}{isSelected, select, true {, 已選取} other {}}\",\n \"listboxLabel\": \"建議\",\n \"selectedAnnouncement\": \"{optionText}, 已選取\"\n}\n"],"names":[],"version":3,"file":"zh-TW.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;YAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;QAAA,GAAG,yBAAI,CAAC;IACvM,qBAAqB,CAAC,MAAM,YAAc,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yCAAM,EAAE,KAAK,UAAU,CAAC,WAAI,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;oBAAE,OAAO,IAAM,CAAC,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,aAAa,EAAE,EAAE,KAAK,UAAU,CAAC,EAAE,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,CAAC,CAAC;QAAA,GAAG,KAAK,UAAU,EAAE,CAAC;IACpX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-TW.json"],"sourcesContent":["{\n \"buttonLabel\": \"顯示建議\",\n \"countAnnouncement\": \"{optionCount, plural, one {# 選項} other {# 選項}} 可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {輸入的群組 {groupTitle}, 有 {groupCount, plural, one {# 選項} other {# 選項}}. } other {}}{optionText}{isSelected, select, true {, 已選取} other {}}\",\n \"listboxLabel\": \"建議\",\n \"selectedAnnouncement\": \"{optionText}, 已選取\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,eAAe,CAAC,gCAAI,CAAC;IACvC,qBAAqB,CAAC,MAAM,YAAc,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE;YAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;YAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,WAAW,EAAE,iBAAG,CAAC;QAAA,GAAG,yBAAI,CAAC;IACvM,qBAAqB,CAAC,MAAM,YAAc,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,IAAM,CAAC,yCAAM,EAAE,KAAK,UAAU,CAAC,WAAI,EAAE,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE;oBAAC,KAAK,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;oBAAE,OAAO,IAAM,GAAG,UAAU,MAAM,CAAC,KAAK,UAAU,EAAE,iBAAG,CAAC;gBAAA,GAAG,EAAE,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,aAAa,IAAI,KAAK,UAAU,GAAG,UAAU,MAAM,CAAC;YAAC,MAAM,CAAC,0BAAK,CAAC;YAAE,OAAO,EAAE;QAAA,GAAG,KAAK,UAAU,GAAG;IACpX,gBAAgB,CAAC,gBAAE,CAAC;IACpB,wBAAwB,CAAC,OAAS,GAAG,KAAK,UAAU,CAAC,0BAAK,CAAC;AAC7D","sources":["packages/@react-aria/combobox/intl/zh-TW.json"],"sourcesContent":["{\n \"buttonLabel\": \"顯示建議\",\n \"countAnnouncement\": \"{optionCount, plural, one {# 選項} other {# 選項}} 可用。\",\n \"focusAnnouncement\": \"{isGroupChange, select, true {輸入的群組 {groupTitle}, 有 {groupCount, plural, one {# 選項} other {# 選項}}. } other {}}{optionText}{isSelected, select, true {, 已選取} other {}}\",\n \"listboxLabel\": \"建議\",\n \"selectedAnnouncement\": \"{optionText}, 已選取\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-aria/combobox",
3
- "version": "3.10.5",
3
+ "version": "3.11.1",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -22,28 +22,28 @@
22
22
  "url": "https://github.com/adobe/react-spectrum"
23
23
  },
24
24
  "dependencies": {
25
- "@react-aria/i18n": "^3.12.3",
26
- "@react-aria/listbox": "^3.13.5",
27
- "@react-aria/live-announcer": "^3.4.0",
28
- "@react-aria/menu": "^3.15.5",
29
- "@react-aria/overlays": "^3.23.4",
30
- "@react-aria/selection": "^3.20.1",
31
- "@react-aria/textfield": "^3.14.10",
32
- "@react-aria/utils": "^3.25.3",
33
- "@react-stately/collections": "^3.11.0",
34
- "@react-stately/combobox": "^3.10.0",
35
- "@react-stately/form": "^3.0.6",
36
- "@react-types/button": "^3.10.0",
37
- "@react-types/combobox": "^3.13.0",
38
- "@react-types/shared": "^3.25.0",
25
+ "@react-aria/i18n": "^3.12.5",
26
+ "@react-aria/listbox": "^3.14.0",
27
+ "@react-aria/live-announcer": "^3.4.1",
28
+ "@react-aria/menu": "^3.17.0",
29
+ "@react-aria/overlays": "^3.25.0",
30
+ "@react-aria/selection": "^3.22.0",
31
+ "@react-aria/textfield": "^3.16.0",
32
+ "@react-aria/utils": "^3.27.0",
33
+ "@react-stately/collections": "^3.12.1",
34
+ "@react-stately/combobox": "^3.10.2",
35
+ "@react-stately/form": "^3.1.1",
36
+ "@react-types/button": "^3.10.2",
37
+ "@react-types/combobox": "^3.13.2",
38
+ "@react-types/shared": "^3.27.0",
39
39
  "@swc/helpers": "^0.5.0"
40
40
  },
41
41
  "peerDependencies": {
42
- "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
43
- "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
42
+ "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1",
43
+ "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1"
44
44
  },
45
45
  "publishConfig": {
46
46
  "access": "public"
47
47
  },
48
- "gitHead": "8e0a28d188cdbdbd2b32296fa034b1b02ddde229"
48
+ "gitHead": "09e7f44bebdc9d89122926b2b439a0a38a2814ea"
49
49
  }
@@ -81,6 +81,8 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
81
81
  isReadOnly,
82
82
  isDisabled
83
83
  } = props;
84
+ let backupBtnRef = useRef(null);
85
+ buttonRef = buttonRef ?? backupBtnRef;
84
86
 
85
87
  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/combobox');
86
88
  let {menuTriggerProps, menuProps} = useMenuTrigger<T>(
@@ -136,11 +138,11 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
136
138
  }
137
139
 
138
140
  // If the focused item is a link, trigger opening it. Items that are links are not selectable.
139
- if (state.isOpen && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {
140
- if (e.key === 'Enter') {
141
- let item = listBoxRef.current.querySelector(`[data-key="${CSS.escape(state.selectionManager.focusedKey.toString())}"]`);
142
- if (item instanceof HTMLAnchorElement) {
143
- let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);
141
+ if (state.isOpen && listBoxRef.current && state.selectionManager.focusedKey != null && state.selectionManager.isLink(state.selectionManager.focusedKey)) {
142
+ let item = listBoxRef.current.querySelector(`[data-key="${CSS.escape(state.selectionManager.focusedKey.toString())}"]`);
143
+ if (e.key === 'Enter' && item instanceof HTMLAnchorElement) {
144
+ let collectionItem = state.collection.getItem(state.selectionManager.focusedKey);
145
+ if (collectionItem) {
144
146
  router.open(item, e, collectionItem.props.href, collectionItem.props.routerOptions as RouterOptions);
145
147
  }
146
148
  }
@@ -217,14 +219,14 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
217
219
  let onPress = (e: PressEvent) => {
218
220
  if (e.pointerType === 'touch') {
219
221
  // Focus the input field in case it isn't focused yet
220
- inputRef.current.focus();
222
+ inputRef.current?.focus();
221
223
  state.toggle(null, 'manual');
222
224
  }
223
225
  };
224
226
 
225
227
  let onPressStart = (e: PressEvent) => {
226
228
  if (e.pointerType !== 'touch') {
227
- inputRef.current.focus();
229
+ inputRef.current?.focus();
228
230
  state.toggle((e.pointerType === 'keyboard' || e.pointerType === 'virtual') ? 'first' : null, 'manual');
229
231
  }
230
232
  };
@@ -251,7 +253,7 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
251
253
  // Sometimes VoiceOver on iOS fires two touchend events in quick succession. Ignore the second one.
252
254
  if (e.timeStamp - lastEventTime.current < 500) {
253
255
  e.preventDefault();
254
- inputRef.current.focus();
256
+ inputRef.current?.focus();
255
257
  return;
256
258
  }
257
259
 
@@ -263,7 +265,7 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
263
265
 
264
266
  if (touch.clientX === centerX && touch.clientY === centerY) {
265
267
  e.preventDefault();
266
- inputRef.current.focus();
268
+ inputRef.current?.focus();
267
269
  state.toggle(null, 'manual');
268
270
 
269
271
  lastEventTime.current = e.timeStamp;
@@ -281,13 +283,13 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
281
283
  let lastSection = useRef(sectionKey);
282
284
  let lastItem = useRef(itemKey);
283
285
  useEffect(() => {
284
- if (isAppleDevice() && focusedItem != null && itemKey !== lastItem.current) {
286
+ if (isAppleDevice() && focusedItem != null && itemKey != null && itemKey !== lastItem.current) {
285
287
  let isSelected = state.selectionManager.isSelected(itemKey);
286
288
  let section = sectionKey != null ? state.collection.getItem(sectionKey) : null;
287
289
  let sectionTitle = section?.['aria-label'] || (typeof section?.rendered === 'string' ? section.rendered : '') || '';
288
290
 
289
291
  let announcement = stringFormatter.format('focusAnnouncement', {
290
- isGroupChange: section && sectionKey !== lastSection.current,
292
+ isGroupChange: (section && sectionKey !== lastSection.current) ?? false,
291
293
  groupTitle: sectionTitle,
292
294
  groupCount: section ? [...getChildNodes(section, state.collection)].length : 0,
293
295
  optionText: focusedItem['aria-label'] || focusedItem.textValue || '',
@@ -336,7 +338,7 @@ export function useComboBox<T>(props: AriaComboBoxOptions<T>, state: ComboBoxSta
336
338
 
337
339
  useEffect(() => {
338
340
  if (state.isOpen) {
339
- return ariaHideOutside([inputRef.current, popoverRef.current]);
341
+ return ariaHideOutside([inputRef.current, popoverRef.current].filter(element => element != null));
340
342
  }
341
343
  }, [state.isOpen, inputRef, popoverRef]);
342
344