MCPcopy
hub / github.com/adobe/react-spectrum / useComboBox

Function useComboBox

packages/react-aria/src/combobox/useComboBox.ts:117–506  ·  view source on GitHub ↗
(
  props: AriaComboBoxOptions<T, M>,
  state: ComboBoxState<T, M>
)

Source from the content-addressed store, hash-verified

115 * @param state - State for the select, as returned by `useComboBoxState`.
116 */
117export function useComboBox<T, M extends SelectionMode = 'single'>(
118 props: AriaComboBoxOptions<T, M>,
119 state: ComboBoxState<T, M>
120): ComboBoxAria<T> {
121 let {
122 buttonRef,
123 popoverRef,
124 inputRef,
125 listBoxRef,
126 keyboardDelegate,
127 layoutDelegate,
128 // completionMode = 'suggest',
129 shouldFocusWrap,
130 isReadOnly,
131 isDisabled
132 } = props;
133 let backupBtnRef = useRef(null);
134 buttonRef = buttonRef ?? backupBtnRef;
135
136 let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/combobox');
137 let {menuTriggerProps, menuProps} = useMenuTrigger<T>(
138 {
139 type: 'listbox',
140 isDisabled: isDisabled || isReadOnly
141 },
142 state,
143 buttonRef
144 );
145
146 // Set listbox id so it can be used when calling getItemId later
147 listData.set(state, {id: menuProps.id});
148
149 // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).
150 // When virtualized, the layout object will be passed in as a prop and override this.
151 let {collection} = state;
152 let {disabledKeys} = state.selectionManager;
153 let delegate = useMemo(
154 () =>
155 keyboardDelegate ||
156 new ListKeyboardDelegate({
157 collection,
158 disabledKeys,
159 ref: listBoxRef,
160 layoutDelegate
161 }),
162 [keyboardDelegate, layoutDelegate, collection, disabledKeys, listBoxRef]
163 );
164
165 // Use useSelectableCollection to get the keyboard handlers to apply to the textfield
166 let {collectionProps} = useSelectableCollection({
167 selectionManager: state.selectionManager,
168 keyboardDelegate: delegate,
169 disallowTypeAhead: true,
170 disallowEmptySelection: true,
171 shouldFocusWrap,
172 ref: inputRef,
173 // Prevent item scroll behavior from being applied here, should be handled in the user's Popover + ListBox component
174 isVirtualized: true

Callers 6

useSearchAutocompleteFunction · 0.90
ComboBoxFunction · 0.90
ComboBoxInnerFunction · 0.90
ComboBoxTrayFunction · 0.90
ComboBox.tsxFile · 0.90

Calls 15

useMenuTriggerFunction · 0.90
useSelectableCollectionFunction · 0.90
useRouterFunction · 0.90
useTextFieldFunction · 0.90
chainFunction · 0.90
useFormResetFunction · 0.90
useLabelsFunction · 0.90
getChildNodesFunction · 0.90
announceFunction · 0.90
getItemCountFunction · 0.90
ariaHideOutsideFunction · 0.90

Tested by

no test coverage detected