@react-stately/combobox 3.12.2 → 3.13.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.
- package/dist/types.d.ts +33 -7
- package/dist/types.d.ts.map +1 -1
- package/dist/useComboBoxState.main.js +109 -37
- package/dist/useComboBoxState.main.js.map +1 -1
- package/dist/useComboBoxState.mjs +110 -38
- package/dist/useComboBoxState.module.js +110 -38
- package/dist/useComboBoxState.module.js.map +1 -1
- package/package.json +8 -8
- package/src/useComboBoxState.ts +138 -48
package/dist/types.d.ts
CHANGED
|
@@ -1,11 +1,37 @@
|
|
|
1
|
-
import { CollectionStateBase, FocusStrategy, Key } from "@react-types/shared";
|
|
2
|
-
import { ComboBoxProps, MenuTriggerAction } from "@react-types/combobox";
|
|
1
|
+
import { CollectionStateBase, FocusStrategy, Key, Node } from "@react-types/shared";
|
|
2
|
+
import { ComboBoxProps, MenuTriggerAction, SelectionMode, ValueType } from "@react-types/combobox";
|
|
3
3
|
import { FormValidationState } from "@react-stately/form";
|
|
4
|
-
import {
|
|
4
|
+
import { ListState } from "@react-stately/list";
|
|
5
5
|
import { OverlayTriggerState } from "@react-stately/overlays";
|
|
6
|
-
export interface ComboBoxState<T> extends
|
|
7
|
-
/**
|
|
6
|
+
export interface ComboBoxState<T, M extends SelectionMode = 'single'> extends ListState<T>, OverlayTriggerState, FormValidationState {
|
|
7
|
+
/**
|
|
8
|
+
* The key for the first selected item.
|
|
9
|
+
* @deprecated
|
|
10
|
+
*/
|
|
11
|
+
readonly selectedKey: Key | null;
|
|
12
|
+
/**
|
|
13
|
+
* The default selected key.
|
|
14
|
+
* @deprecated
|
|
15
|
+
*/
|
|
8
16
|
readonly defaultSelectedKey: Key | null;
|
|
17
|
+
/**
|
|
18
|
+
* Sets the selected key.
|
|
19
|
+
* @deprecated
|
|
20
|
+
*/
|
|
21
|
+
setSelectedKey(key: Key | null): void;
|
|
22
|
+
/** The current combobox value. */
|
|
23
|
+
readonly value: ValueType<M>;
|
|
24
|
+
/** The default combobox value. */
|
|
25
|
+
readonly defaultValue: ValueType<M>;
|
|
26
|
+
/** Sets the combobox value. */
|
|
27
|
+
setValue(value: Key | readonly Key[] | null): void;
|
|
28
|
+
/**
|
|
29
|
+
* The value of the first selected item.
|
|
30
|
+
* @deprecated
|
|
31
|
+
*/
|
|
32
|
+
readonly selectedItem: Node<T> | null;
|
|
33
|
+
/** The value of the selected items. */
|
|
34
|
+
readonly selectedItems: Node<T>[];
|
|
9
35
|
/** The current value of the combo box input. */
|
|
10
36
|
inputValue: string;
|
|
11
37
|
/** The default value of the combo box input. */
|
|
@@ -28,7 +54,7 @@ export interface ComboBoxState<T> extends SingleSelectListState<T>, OverlayTrigg
|
|
|
28
54
|
revert(): void;
|
|
29
55
|
}
|
|
30
56
|
type FilterFn = (textValue: string, inputValue: string) => boolean;
|
|
31
|
-
export interface ComboBoxStateOptions<T> extends Omit<ComboBoxProps<T>, 'children'>, CollectionStateBase<T> {
|
|
57
|
+
export interface ComboBoxStateOptions<T, M extends SelectionMode = 'single'> extends Omit<ComboBoxProps<T, M>, 'children'>, CollectionStateBase<T> {
|
|
32
58
|
/** The filter function used to determine if a option should be included in the combo box list. */
|
|
33
59
|
defaultFilter?: FilterFn;
|
|
34
60
|
/** Whether the combo box allows the menu to be open when the collection is empty. */
|
|
@@ -41,6 +67,6 @@ export interface ComboBoxStateOptions<T> extends Omit<ComboBoxProps<T>, 'childre
|
|
|
41
67
|
* of items from props and manages the option selection state of the combo box. In addition, it tracks the input value,
|
|
42
68
|
* focus state, and other properties of the combo box.
|
|
43
69
|
*/
|
|
44
|
-
export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T>): ComboBoxState<T>;
|
|
70
|
+
export function useComboBoxState<T extends object, M extends SelectionMode = 'single'>(props: ComboBoxStateOptions<T, M>): ComboBoxState<T>;
|
|
45
71
|
|
|
46
72
|
//# sourceMappingURL=types.d.ts.map
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;AAqBA,+BAA+B,CAAC,CAAE,SAAQ,
|
|
1
|
+
{"mappings":";;;;;AAqBA,+BAA+B,CAAC,EAAE,CAAC,SAAS,aAAa,GAAG,QAAQ,CAAE,SAAQ,UAAU,CAAC,CAAC,EAAE,mBAAmB,EAAE,mBAAmB;IAClI;;;OAGG;IACH,QAAQ,CAAC,WAAW,EAAE,GAAG,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,QAAQ,CAAC,kBAAkB,EAAE,GAAG,GAAG,IAAI,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;IACtC,kCAAkC;IAClC,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC;IAC7B,kCAAkC;IAClC,QAAQ,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC;IACpC,+BAA+B;IAC/B,QAAQ,CAAC,KAAK,EAAE,GAAG,GAAG,SAAS,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,CAAC;IACnD;;;OAGG;IACH,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC;IACtC,uCAAuC;IACvC,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC;IAClC,gDAAgD;IAChD,UAAU,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,iBAAiB,EAAE,MAAM,CAAC;IAC1B,6CAA6C;IAC7C,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,sEAAsE;IACtE,MAAM,IAAI,IAAI,CAAC;IACf,oEAAoE;IACpE,QAAQ,CAAC,aAAa,EAAE,aAAa,GAAG,IAAI,CAAC;IAC7C,+CAA+C;IAC/C,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,0CAA0C;IAC1C,UAAU,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,CAAC;IACrC,sBAAsB;IACtB,IAAI,CAAC,aAAa,CAAC,EAAE,aAAa,GAAG,IAAI,EAAE,OAAO,CAAC,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC9E,wBAAwB;IACxB,MAAM,CAAC,aAAa,CAAC,EAAE,aAAa,GAAG,IAAI,EAAE,OAAO,CAAC,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAChF,iGAAiG;IACjG,MAAM,IAAI,IAAI,CAAA;CACf;AAED,gBAAgB,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;AAEnE,sCAAsC,CAAC,EAAE,CAAC,SAAS,aAAa,GAAG,QAAQ,CAAE,SAAQ,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,CAAC,CAAC;IAChJ,kGAAkG;IAClG,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB,qFAAqF;IACrF,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,uDAAuD;IACvD,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAID;;;;GAIG;AACH,iCAAiC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,aAAa,GAAG,QAAQ,EAAE,KAAK,EAAE,qBAAqB,CAAC,EAAE,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CA6X1I","sources":["packages/@react-stately/combobox/src/packages/@react-stately/combobox/src/useComboBoxState.ts","packages/@react-stately/combobox/src/packages/@react-stately/combobox/src/index.ts","packages/@react-stately/combobox/src/index.ts"],"sourcesContent":[null,null,"/*\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\nexport {useComboBoxState} from './useComboBoxState';\n\nexport type {ComboBoxStateOptions, ComboBoxState} from './useComboBoxState';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
|
@@ -27,30 +27,88 @@ $parcel$export(module.exports, "useComboBoxState", () => $e563f9c9469ad14c$expor
|
|
|
27
27
|
|
|
28
28
|
|
|
29
29
|
|
|
30
|
+
const $e563f9c9469ad14c$var$EMPTY_VALUE = [];
|
|
30
31
|
function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
31
32
|
var _collection_getItem;
|
|
32
|
-
let { defaultFilter: defaultFilter, menuTrigger: menuTrigger = 'input', allowsEmptyCollection: allowsEmptyCollection = false, allowsCustomValue: allowsCustomValue, shouldCloseOnBlur: shouldCloseOnBlur = true } = props;
|
|
33
|
+
let { defaultFilter: defaultFilter, menuTrigger: menuTrigger = 'input', allowsEmptyCollection: allowsEmptyCollection = false, allowsCustomValue: allowsCustomValue, shouldCloseOnBlur: shouldCloseOnBlur = true, selectionMode: selectionMode = 'single' } = props;
|
|
33
34
|
let [showAllItems, setShowAllItems] = (0, $2KOLe$react.useState)(false);
|
|
34
35
|
let [isFocused, setFocusedState] = (0, $2KOLe$react.useState)(false);
|
|
35
36
|
let [focusStrategy, setFocusStrategy] = (0, $2KOLe$react.useState)(null);
|
|
36
|
-
let
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
37
|
+
let defaultValue = (0, $2KOLe$react.useMemo)(()=>{
|
|
38
|
+
var _props_defaultSelectedKey;
|
|
39
|
+
return props.defaultValue !== undefined ? props.defaultValue : selectionMode === 'single' ? (_props_defaultSelectedKey = props.defaultSelectedKey) !== null && _props_defaultSelectedKey !== void 0 ? _props_defaultSelectedKey : null : [];
|
|
40
|
+
}, [
|
|
41
|
+
props.defaultValue,
|
|
42
|
+
props.defaultSelectedKey,
|
|
43
|
+
selectionMode
|
|
44
|
+
]);
|
|
45
|
+
let value = (0, $2KOLe$react.useMemo)(()=>{
|
|
46
|
+
return props.value !== undefined ? props.value : selectionMode === 'single' ? props.selectedKey : undefined;
|
|
47
|
+
}, [
|
|
48
|
+
props.value,
|
|
49
|
+
props.selectedKey,
|
|
50
|
+
selectionMode
|
|
51
|
+
]);
|
|
52
|
+
let [controlledValue, setControlledValue] = (0, $2KOLe$reactstatelyutils.useControlledState)(value, defaultValue, props.onChange);
|
|
53
|
+
// Only display the first selected item if in single selection mode but the value is an array.
|
|
54
|
+
let displayValue = selectionMode === 'single' && Array.isArray(controlledValue) ? controlledValue[0] : controlledValue;
|
|
55
|
+
let setValue = (value)=>{
|
|
56
|
+
if (selectionMode === 'single') {
|
|
57
|
+
var _props_onSelectionChange;
|
|
58
|
+
var _value_;
|
|
59
|
+
let key = Array.isArray(value) ? (_value_ = value[0]) !== null && _value_ !== void 0 ? _value_ : null : value;
|
|
60
|
+
setControlledValue(key);
|
|
61
|
+
if (key !== displayValue) (_props_onSelectionChange = props.onSelectionChange) === null || _props_onSelectionChange === void 0 ? void 0 : _props_onSelectionChange.call(props, key);
|
|
62
|
+
} else {
|
|
63
|
+
let keys = [];
|
|
64
|
+
if (Array.isArray(value)) keys = value;
|
|
65
|
+
else if (value != null) keys = [
|
|
66
|
+
value
|
|
67
|
+
];
|
|
68
|
+
setControlledValue(keys);
|
|
43
69
|
}
|
|
44
70
|
};
|
|
45
71
|
var _props_items;
|
|
46
|
-
let { collection: collection, selectionManager: selectionManager,
|
|
72
|
+
let { collection: collection, selectionManager: selectionManager, disabledKeys: disabledKeys } = (0, $2KOLe$reactstatelylist.useListState)({
|
|
47
73
|
...props,
|
|
48
|
-
|
|
49
|
-
|
|
74
|
+
items: (_props_items = props.items) !== null && _props_items !== void 0 ? _props_items : props.defaultItems,
|
|
75
|
+
selectionMode: selectionMode,
|
|
76
|
+
disallowEmptySelection: selectionMode === 'single',
|
|
77
|
+
allowDuplicateSelectionEvents: true,
|
|
78
|
+
selectedKeys: (0, $2KOLe$react.useMemo)(()=>$e563f9c9469ad14c$var$convertValue(displayValue), [
|
|
79
|
+
displayValue
|
|
80
|
+
]),
|
|
81
|
+
onSelectionChange: (keys)=>{
|
|
82
|
+
// impossible, but TS doesn't know that
|
|
83
|
+
if (keys === 'all') return;
|
|
84
|
+
if (selectionMode === 'single') {
|
|
85
|
+
var _keys_values_next_value;
|
|
86
|
+
let key = (_keys_values_next_value = keys.values().next().value) !== null && _keys_values_next_value !== void 0 ? _keys_values_next_value : null;
|
|
87
|
+
if (key === displayValue) {
|
|
88
|
+
var _props_onSelectionChange;
|
|
89
|
+
(_props_onSelectionChange = props.onSelectionChange) === null || _props_onSelectionChange === void 0 ? void 0 : _props_onSelectionChange.call(props, key);
|
|
90
|
+
// If key is the same, reset the inputValue and close the menu
|
|
91
|
+
// (scenario: user clicks on already selected option)
|
|
92
|
+
resetInputValue();
|
|
93
|
+
closeMenu();
|
|
94
|
+
} else setValue(key);
|
|
95
|
+
} else setValue([
|
|
96
|
+
...keys
|
|
97
|
+
]);
|
|
98
|
+
}
|
|
50
99
|
});
|
|
100
|
+
let selectedKey = selectionMode === 'single' ? selectionManager.firstSelectedKey : null;
|
|
101
|
+
let selectedItems = (0, $2KOLe$react.useMemo)(()=>{
|
|
102
|
+
return [
|
|
103
|
+
...selectionManager.selectedKeys
|
|
104
|
+
].map((key)=>collection.getItem(key)).filter((item)=>item != null);
|
|
105
|
+
}, [
|
|
106
|
+
selectionManager.selectedKeys,
|
|
107
|
+
collection
|
|
108
|
+
]);
|
|
51
109
|
let [inputValue, setInputValue] = (0, $2KOLe$reactstatelyutils.useControlledState)(props.inputValue, $e563f9c9469ad14c$var$getDefaultInputValue(props.defaultInputValue, selectedKey, collection) || '', props.onInputChange);
|
|
52
|
-
let [
|
|
53
|
-
let [
|
|
110
|
+
let [initialValue] = (0, $2KOLe$react.useState)(displayValue);
|
|
111
|
+
let [initialInputValue] = (0, $2KOLe$react.useState)(inputValue);
|
|
54
112
|
// Preserve original collection so we can show all items on demand
|
|
55
113
|
let originalCollection = collection;
|
|
56
114
|
let filteredCollection = (0, $2KOLe$react.useMemo)(()=>// No default filter if items are controlled.
|
|
@@ -131,8 +189,7 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
131
189
|
setLastValue(itemText);
|
|
132
190
|
setInputValue(itemText);
|
|
133
191
|
};
|
|
134
|
-
|
|
135
|
-
let lastSelectedKey = (0, $2KOLe$react.useRef)((_ref = (_props_selectedKey = props.selectedKey) !== null && _props_selectedKey !== void 0 ? _props_selectedKey : props.defaultSelectedKey) !== null && _ref !== void 0 ? _ref : null);
|
|
192
|
+
let lastValueRef = (0, $2KOLe$react.useRef)(displayValue);
|
|
136
193
|
var _collection_getItem_textValue;
|
|
137
194
|
let lastSelectedKeyText = (0, $2KOLe$react.useRef)(selectedKey != null ? (_collection_getItem_textValue = (_collection_getItem = collection.getItem(selectedKey)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.textValue) !== null && _collection_getItem_textValue !== void 0 ? _collection_getItem_textValue : '' : '');
|
|
138
195
|
// intentional omit dependency array, want this to happen on every render
|
|
@@ -146,19 +203,19 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
146
203
|
// but we are currently showing all items via button press
|
|
147
204
|
if (!showAllItems && !allowsEmptyCollection && triggerState.isOpen && filteredCollection.size === 0) closeMenu();
|
|
148
205
|
// Close when an item is selected.
|
|
149
|
-
if (
|
|
206
|
+
if (displayValue != null && displayValue !== lastValueRef.current && selectionMode === 'single') closeMenu();
|
|
150
207
|
// Clear focused key when input value changes and display filtered collection again.
|
|
151
208
|
if (inputValue !== lastValue) {
|
|
152
209
|
selectionManager.setFocusedKey(null);
|
|
153
210
|
setShowAllItems(false);
|
|
154
|
-
// Set
|
|
211
|
+
// Set value to null when the user clears the input.
|
|
155
212
|
// If controlled, this is the application developer's responsibility.
|
|
156
|
-
if (inputValue === '' && (props.inputValue === undefined ||
|
|
213
|
+
if (selectionMode === 'single' && inputValue === '' && (props.inputValue === undefined || value === undefined)) setValue(null);
|
|
157
214
|
}
|
|
158
|
-
// If the
|
|
159
|
-
// Do nothing if both inputValue and
|
|
215
|
+
// If the value changed, update the input value.
|
|
216
|
+
// Do nothing if both inputValue and value are controlled.
|
|
160
217
|
// In this case, it's the user's responsibility to update inputValue in onSelectionChange.
|
|
161
|
-
if (
|
|
218
|
+
if (displayValue !== lastValueRef.current && (props.inputValue === undefined || value === undefined)) resetInputValue();
|
|
162
219
|
else if (lastValue !== inputValue) setLastValue(inputValue);
|
|
163
220
|
var _collection_getItem_textValue;
|
|
164
221
|
// Update the inputValue if the selected item's text changes from its last tracked value.
|
|
@@ -166,23 +223,25 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
166
223
|
// Only reset if the user isn't currently within the field so we don't erroneously modify user input.
|
|
167
224
|
// If inputValue is controlled, it is the user's responsibility to update the inputValue when items change.
|
|
168
225
|
let selectedItemText = selectedKey != null ? (_collection_getItem_textValue = (_collection_getItem = collection.getItem(selectedKey)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.textValue) !== null && _collection_getItem_textValue !== void 0 ? _collection_getItem_textValue : '' : '';
|
|
169
|
-
if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey ===
|
|
226
|
+
if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey === lastValueRef.current) {
|
|
170
227
|
if (lastSelectedKeyText.current !== selectedItemText) {
|
|
171
228
|
setLastValue(selectedItemText);
|
|
172
229
|
setInputValue(selectedItemText);
|
|
173
230
|
}
|
|
174
231
|
}
|
|
175
|
-
|
|
232
|
+
lastValueRef.current = displayValue;
|
|
176
233
|
lastSelectedKeyText.current = selectedItemText;
|
|
177
234
|
});
|
|
178
235
|
let validation = (0, $2KOLe$reactstatelyform.useFormValidationState)({
|
|
179
236
|
...props,
|
|
180
|
-
value: (0, $2KOLe$react.useMemo)(()=>({
|
|
237
|
+
value: (0, $2KOLe$react.useMemo)(()=>Array.isArray(displayValue) && displayValue.length === 0 ? null : {
|
|
181
238
|
inputValue: inputValue,
|
|
239
|
+
value: displayValue,
|
|
182
240
|
selectedKey: selectedKey
|
|
183
|
-
}
|
|
241
|
+
}, [
|
|
184
242
|
inputValue,
|
|
185
|
-
selectedKey
|
|
243
|
+
selectedKey,
|
|
244
|
+
displayValue
|
|
186
245
|
])
|
|
187
246
|
});
|
|
188
247
|
// Revert input value and close menu
|
|
@@ -191,15 +250,17 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
191
250
|
else commitSelection();
|
|
192
251
|
};
|
|
193
252
|
let commitCustomValue = ()=>{
|
|
194
|
-
|
|
195
|
-
|
|
253
|
+
let value = selectionMode === 'multiple' ? $e563f9c9469ad14c$var$EMPTY_VALUE : null;
|
|
254
|
+
lastValueRef.current = value;
|
|
255
|
+
setValue(value);
|
|
196
256
|
closeMenu();
|
|
197
257
|
};
|
|
198
258
|
let commitSelection = ()=>{
|
|
199
259
|
// If multiple things are controlled, call onSelectionChange
|
|
200
|
-
if (
|
|
201
|
-
var _props_onSelectionChange, _collection_getItem;
|
|
260
|
+
if (value !== undefined && props.inputValue !== undefined) {
|
|
261
|
+
var _props_onSelectionChange, _props_onChange, _collection_getItem;
|
|
202
262
|
(_props_onSelectionChange = props.onSelectionChange) === null || _props_onSelectionChange === void 0 ? void 0 : _props_onSelectionChange.call(props, selectedKey);
|
|
263
|
+
(_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, displayValue);
|
|
203
264
|
var _collection_getItem_textValue;
|
|
204
265
|
// Stop menu from reopening from useEffect
|
|
205
266
|
let itemText = selectedKey != null ? (_collection_getItem_textValue = (_collection_getItem = collection.getItem(selectedKey)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.textValue) !== null && _collection_getItem_textValue !== void 0 ? _collection_getItem_textValue : '' : '';
|
|
@@ -224,8 +285,8 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
224
285
|
if (triggerState.isOpen && selectionManager.focusedKey != null) {
|
|
225
286
|
// Reset inputValue and close menu here if the selected key is already the focused key. Otherwise
|
|
226
287
|
// fire onSelectionChange to allow the application to control the closing.
|
|
227
|
-
if (
|
|
228
|
-
else
|
|
288
|
+
if (selectionManager.isSelected(selectionManager.focusedKey) && selectionMode === 'single') commitSelection();
|
|
289
|
+
else selectionManager.select(selectionManager.focusedKey);
|
|
229
290
|
} else commitValue();
|
|
230
291
|
};
|
|
231
292
|
let valueOnFocus = (0, $2KOLe$react.useRef)(inputValue);
|
|
@@ -252,8 +313,8 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
252
313
|
lastCollection
|
|
253
314
|
]);
|
|
254
315
|
var _props_defaultSelectedKey;
|
|
255
|
-
let defaultSelectedKey = (_props_defaultSelectedKey = props.defaultSelectedKey) !== null && _props_defaultSelectedKey !== void 0 ? _props_defaultSelectedKey :
|
|
256
|
-
var _getDefaultInputValue;
|
|
316
|
+
let defaultSelectedKey = (_props_defaultSelectedKey = props.defaultSelectedKey) !== null && _props_defaultSelectedKey !== void 0 ? _props_defaultSelectedKey : selectionMode === 'single' ? initialValue : null;
|
|
317
|
+
var _selectedItems_, _getDefaultInputValue;
|
|
257
318
|
return {
|
|
258
319
|
...validation,
|
|
259
320
|
...triggerState,
|
|
@@ -262,16 +323,20 @@ function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
|
|
|
262
323
|
open: open,
|
|
263
324
|
close: commitValue,
|
|
264
325
|
selectionManager: selectionManager,
|
|
326
|
+
value: displayValue,
|
|
327
|
+
defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : initialValue,
|
|
328
|
+
setValue: setValue,
|
|
265
329
|
selectedKey: selectedKey,
|
|
330
|
+
selectedItems: selectedItems,
|
|
266
331
|
defaultSelectedKey: defaultSelectedKey,
|
|
267
|
-
setSelectedKey:
|
|
332
|
+
setSelectedKey: setValue,
|
|
268
333
|
disabledKeys: disabledKeys,
|
|
269
334
|
isFocused: isFocused,
|
|
270
335
|
setFocused: setFocused,
|
|
271
|
-
selectedItem:
|
|
336
|
+
selectedItem: (_selectedItems_ = selectedItems[0]) !== null && _selectedItems_ !== void 0 ? _selectedItems_ : null,
|
|
272
337
|
collection: displayedCollection,
|
|
273
338
|
inputValue: inputValue,
|
|
274
|
-
defaultInputValue: (_getDefaultInputValue = $e563f9c9469ad14c$var$getDefaultInputValue(props.defaultInputValue, defaultSelectedKey, collection)) !== null && _getDefaultInputValue !== void 0 ? _getDefaultInputValue :
|
|
339
|
+
defaultInputValue: (_getDefaultInputValue = $e563f9c9469ad14c$var$getDefaultInputValue(props.defaultInputValue, defaultSelectedKey, collection)) !== null && _getDefaultInputValue !== void 0 ? _getDefaultInputValue : initialInputValue,
|
|
275
340
|
setInputValue: setInputValue,
|
|
276
341
|
commit: commit,
|
|
277
342
|
revert: revert
|
|
@@ -308,6 +373,13 @@ function $e563f9c9469ad14c$var$getDefaultInputValue(defaultInputValue, selectedK
|
|
|
308
373
|
}
|
|
309
374
|
return defaultInputValue;
|
|
310
375
|
}
|
|
376
|
+
function $e563f9c9469ad14c$var$convertValue(value) {
|
|
377
|
+
if (value === undefined) return undefined;
|
|
378
|
+
if (value === null) return [];
|
|
379
|
+
return Array.isArray(value) ? value : [
|
|
380
|
+
value
|
|
381
|
+
];
|
|
382
|
+
}
|
|
311
383
|
|
|
312
384
|
|
|
313
385
|
//# sourceMappingURL=useComboBoxState.main.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-stately/combobox/src/useComboBoxState.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 {Collection, CollectionStateBase, FocusStrategy, Key, Node} from '@react-types/shared';\nimport {ComboBoxProps, MenuTriggerAction} from '@react-types/combobox';\nimport {FormValidationState, useFormValidationState} from '@react-stately/form';\nimport {getChildNodes} from '@react-stately/collections';\nimport {ListCollection, SingleSelectListState, useSingleSelectListState} from '@react-stately/list';\nimport {OverlayTriggerState, useOverlayTriggerState} from '@react-stately/overlays';\nimport {useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport {useControlledState} from '@react-stately/utils';\n\nexport interface ComboBoxState<T> extends SingleSelectListState<T>, OverlayTriggerState, FormValidationState {\n /** The default selected key. */\n readonly defaultSelectedKey: Key | null,\n /** The current value of the combo box input. */\n inputValue: string,\n /** The default value of the combo box input. */\n defaultInputValue: string,\n /** Sets the value of the combo box input. */\n setInputValue(value: string): void,\n /** Selects the currently focused item and updates the input value. */\n commit(): void,\n /** Controls which item will be auto focused when the menu opens. */\n readonly focusStrategy: FocusStrategy | null,\n /** Whether the select is currently focused. */\n readonly isFocused: boolean,\n /** Sets whether the select is focused. */\n setFocused(isFocused: boolean): void,\n /** Opens the menu. */\n open(focusStrategy?: FocusStrategy | null, trigger?: MenuTriggerAction): void,\n /** Toggles the menu. */\n toggle(focusStrategy?: FocusStrategy | null, trigger?: MenuTriggerAction): void,\n /** Resets the input value to the previously selected item's text if any and closes the menu. */\n revert(): void\n}\n\ntype FilterFn = (textValue: string, inputValue: string) => boolean;\n\nexport interface ComboBoxStateOptions<T> extends Omit<ComboBoxProps<T>, 'children'>, CollectionStateBase<T> {\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: FilterFn,\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean,\n /** Whether the combo box menu should close on blur. */\n shouldCloseOnBlur?: boolean\n}\n\n/**\n * Provides state management for a combo box component. Handles building a collection\n * of items from props and manages the option selection state of the combo box. In addition, it tracks the input value,\n * focus state, and other properties of the combo box.\n */\nexport function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T>): ComboBoxState<T> {\n let {\n defaultFilter,\n menuTrigger = 'input',\n allowsEmptyCollection = false,\n allowsCustomValue,\n shouldCloseOnBlur = true\n } = props;\n\n let [showAllItems, setShowAllItems] = useState(false);\n let [isFocused, setFocusedState] = useState(false);\n let [focusStrategy, setFocusStrategy] = useState<FocusStrategy | null>(null);\n\n let onSelectionChange = (key) => {\n if (props.onSelectionChange) {\n props.onSelectionChange(key);\n }\n\n // If key is the same, reset the inputValue and close the menu\n // (scenario: user clicks on already selected option)\n if (key === selectedKey) {\n resetInputValue();\n closeMenu();\n }\n };\n\n let {collection,\n selectionManager,\n selectedKey,\n setSelectedKey,\n selectedItem,\n disabledKeys\n } = useSingleSelectListState({\n ...props,\n onSelectionChange,\n items: props.items ?? props.defaultItems\n });\n\n let [inputValue, setInputValue] = useControlledState(\n props.inputValue,\n getDefaultInputValue(props.defaultInputValue, selectedKey, collection) || '',\n props.onInputChange\n );\n let [initialSelectedKey] = useState(selectedKey);\n let [initialValue] = useState(inputValue);\n\n // Preserve original collection so we can show all items on demand\n let originalCollection = collection;\n let filteredCollection = useMemo(() => (\n // No default filter if items are controlled.\n props.items != null || !defaultFilter\n ? collection\n : filterCollection(collection, inputValue, defaultFilter)\n ), [collection, inputValue, defaultFilter, props.items]);\n let [lastCollection, setLastCollection] = useState(filteredCollection);\n\n // Track what action is attempting to open the menu\n let menuOpenTrigger = useRef<MenuTriggerAction | undefined>('focus');\n let onOpenChange = (open: boolean) => {\n if (props.onOpenChange) {\n props.onOpenChange(open, open ? menuOpenTrigger.current : undefined);\n }\n\n selectionManager.setFocused(open);\n if (!open) {\n selectionManager.setFocusedKey(null);\n }\n };\n\n let triggerState = useOverlayTriggerState({...props, onOpenChange, isOpen: undefined, defaultOpen: undefined});\n let open = (focusStrategy: FocusStrategy | null = null, trigger?: MenuTriggerAction) => {\n let displayAllItems = (trigger === 'manual' || (trigger === 'focus' && menuTrigger === 'focus'));\n // Prevent open operations from triggering if there is nothing to display\n // Also prevent open operations from triggering if items are uncontrolled but defaultItems is empty, even if displayAllItems is true.\n // This is to prevent comboboxes with empty defaultItems from opening but allow controlled items comboboxes to open even if the inital list is empty (assumption is user will provide swap the empty list with a base list via onOpenChange returning `menuTrigger` manual)\n if (allowsEmptyCollection || filteredCollection.size > 0 || (displayAllItems && originalCollection.size > 0) || props.items) {\n if (displayAllItems && !triggerState.isOpen && props.items === undefined) {\n // Show all items if menu is manually opened. Only care about this if items are undefined\n setShowAllItems(true);\n }\n\n menuOpenTrigger.current = trigger;\n setFocusStrategy(focusStrategy);\n triggerState.open();\n }\n };\n\n let toggle = (focusStrategy: FocusStrategy | null = null, trigger?: MenuTriggerAction) => {\n let displayAllItems = (trigger === 'manual' || (trigger === 'focus' && menuTrigger === 'focus'));\n // If the menu is closed and there is nothing to display, early return so toggle isn't called to prevent extraneous onOpenChange\n if (!(allowsEmptyCollection || filteredCollection.size > 0 || (displayAllItems && originalCollection.size > 0) || props.items) && !triggerState.isOpen) {\n return;\n }\n\n if (displayAllItems && !triggerState.isOpen && props.items === undefined) {\n // Show all items if menu is toggled open. Only care about this if items are undefined\n setShowAllItems(true);\n }\n\n // Only update the menuOpenTrigger if menu is currently closed\n if (!triggerState.isOpen) {\n menuOpenTrigger.current = trigger;\n }\n\n toggleMenu(focusStrategy);\n };\n\n let updateLastCollection = useCallback(() => {\n setLastCollection(showAllItems ? originalCollection : filteredCollection);\n }, [showAllItems, originalCollection, filteredCollection]);\n\n // If menu is going to close, save the current collection so we can freeze the displayed collection when the\n // user clicks outside the popover to close the menu. Prevents the menu contents from updating as the menu closes.\n let toggleMenu = useCallback((focusStrategy: FocusStrategy | null = null) => {\n if (triggerState.isOpen) {\n updateLastCollection();\n }\n\n setFocusStrategy(focusStrategy);\n triggerState.toggle();\n }, [triggerState, updateLastCollection]);\n\n let closeMenu = useCallback(() => {\n if (triggerState.isOpen) {\n updateLastCollection();\n triggerState.close();\n }\n }, [triggerState, updateLastCollection]);\n\n let [lastValue, setLastValue] = useState(inputValue);\n let resetInputValue = () => {\n let itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n setLastValue(itemText);\n setInputValue(itemText);\n };\n\n let lastSelectedKey = useRef(props.selectedKey ?? props.defaultSelectedKey ?? null);\n let lastSelectedKeyText = useRef(\n selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : ''\n );\n // intentional omit dependency array, want this to happen on every render\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(() => {\n // Open and close menu automatically when the input value changes if the input is focused,\n // and there are items in the collection or allowEmptyCollection is true.\n if (\n isFocused &&\n (filteredCollection.size > 0 || allowsEmptyCollection) &&\n !triggerState.isOpen &&\n inputValue !== lastValue &&\n menuTrigger !== 'manual'\n ) {\n open(null, 'input');\n }\n\n // Close the menu if the collection is empty. Don't close menu if filtered collection size is 0\n // but we are currently showing all items via button press\n if (\n !showAllItems &&\n !allowsEmptyCollection &&\n triggerState.isOpen &&\n filteredCollection.size === 0\n ) {\n closeMenu();\n }\n\n // Close when an item is selected.\n if (\n selectedKey != null &&\n selectedKey !== lastSelectedKey.current\n ) {\n closeMenu();\n }\n\n // Clear focused key when input value changes and display filtered collection again.\n if (inputValue !== lastValue) {\n selectionManager.setFocusedKey(null);\n setShowAllItems(false);\n\n // Set selectedKey to null when the user clears the input.\n // If controlled, this is the application developer's responsibility.\n if (inputValue === '' && (props.inputValue === undefined || props.selectedKey === undefined)) {\n setSelectedKey(null);\n }\n }\n\n // If the selectedKey changed, update the input value.\n // Do nothing if both inputValue and selectedKey are controlled.\n // In this case, it's the user's responsibility to update inputValue in onSelectionChange.\n if (\n selectedKey !== lastSelectedKey.current &&\n (props.inputValue === undefined || props.selectedKey === undefined)\n ) {\n resetInputValue();\n } else if (lastValue !== inputValue) {\n setLastValue(inputValue);\n }\n\n // Update the inputValue if the selected item's text changes from its last tracked value.\n // This is to handle cases where a selectedKey is specified but the items aren't available (async loading) or the selected item's text value updates.\n // Only reset if the user isn't currently within the field so we don't erroneously modify user input.\n // If inputValue is controlled, it is the user's responsibility to update the inputValue when items change.\n let selectedItemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey === lastSelectedKey.current) {\n if (lastSelectedKeyText.current !== selectedItemText) {\n setLastValue(selectedItemText);\n setInputValue(selectedItemText);\n }\n }\n\n lastSelectedKey.current = selectedKey;\n lastSelectedKeyText.current = selectedItemText;\n });\n\n let validation = useFormValidationState({\n ...props,\n value: useMemo(() => ({inputValue, selectedKey}), [inputValue, selectedKey])\n });\n\n // Revert input value and close menu\n let revert = () => {\n if (allowsCustomValue && selectedKey == null) {\n commitCustomValue();\n } else {\n commitSelection();\n }\n };\n\n let commitCustomValue = () => {\n lastSelectedKey.current = null;\n setSelectedKey(null);\n closeMenu();\n };\n\n let commitSelection = () => {\n // If multiple things are controlled, call onSelectionChange\n if (props.selectedKey !== undefined && props.inputValue !== undefined) {\n props.onSelectionChange?.(selectedKey);\n\n // Stop menu from reopening from useEffect\n let itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n setLastValue(itemText);\n closeMenu();\n } else {\n // If only a single aspect of combobox is controlled, reset input value and close menu for the user\n resetInputValue();\n closeMenu();\n }\n };\n\n const commitValue = () => {\n if (allowsCustomValue) {\n const itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n (inputValue === itemText) ? commitSelection() : commitCustomValue();\n } else {\n // Reset inputValue and close menu\n commitSelection();\n }\n };\n\n let commit = () => {\n if (triggerState.isOpen && selectionManager.focusedKey != null) {\n // Reset inputValue and close menu here if the selected key is already the focused key. Otherwise\n // fire onSelectionChange to allow the application to control the closing.\n if (selectedKey === selectionManager.focusedKey) {\n commitSelection();\n } else {\n setSelectedKey(selectionManager.focusedKey);\n }\n } else {\n commitValue();\n }\n };\n\n let valueOnFocus = useRef(inputValue);\n let setFocused = (isFocused: boolean) => {\n if (isFocused) {\n valueOnFocus.current = inputValue;\n if (menuTrigger === 'focus' && !props.isReadOnly) {\n open(null, 'focus');\n }\n } else {\n if (shouldCloseOnBlur) {\n commitValue();\n }\n\n if (inputValue !== valueOnFocus.current) {\n validation.commitValidation();\n }\n }\n\n setFocusedState(isFocused);\n };\n\n let displayedCollection = useMemo(() => {\n if (triggerState.isOpen) {\n if (showAllItems) {\n return originalCollection;\n } else {\n return filteredCollection;\n }\n } else {\n return lastCollection;\n }\n }, [triggerState.isOpen, originalCollection, filteredCollection, showAllItems, lastCollection]);\n\n let defaultSelectedKey = props.defaultSelectedKey ?? initialSelectedKey;\n\n return {\n ...validation,\n ...triggerState,\n focusStrategy,\n toggle,\n open,\n close: commitValue,\n selectionManager,\n selectedKey,\n defaultSelectedKey,\n setSelectedKey,\n disabledKeys,\n isFocused,\n setFocused,\n selectedItem,\n collection: displayedCollection,\n inputValue,\n defaultInputValue: getDefaultInputValue(props.defaultInputValue, defaultSelectedKey, collection) ?? initialValue,\n setInputValue,\n commit,\n revert\n };\n}\n\nfunction filterCollection<T extends object>(collection: Collection<Node<T>>, inputValue: string, filter: FilterFn): Collection<Node<T>> {\n return new ListCollection(filterNodes(collection, collection, inputValue, filter));\n}\n\nfunction filterNodes<T>(collection: Collection<Node<T>>, nodes: Iterable<Node<T>>, inputValue: string, filter: FilterFn): Iterable<Node<T>> {\n let filteredNode: Node<T>[] = [];\n for (let node of nodes) {\n if (node.type === 'section' && node.hasChildNodes) {\n let filtered = filterNodes(collection, getChildNodes(node, collection), inputValue, filter);\n if ([...filtered].some(node => node.type === 'item')) {\n filteredNode.push({...node, childNodes: filtered});\n }\n } else if (node.type === 'item' && filter(node.textValue, inputValue)) {\n filteredNode.push({...node});\n } else if (node.type !== 'item') {\n filteredNode.push({...node});\n }\n }\n return filteredNode;\n}\n\n\nfunction getDefaultInputValue(defaultInputValue: string | null | undefined, selectedKey: Key | null, collection: Collection<Node<unknown>>) {\n if (defaultInputValue == null) {\n if (selectedKey != null) {\n return collection.getItem(selectedKey)?.textValue ?? '';\n }\n }\n\n return defaultInputValue;\n}\n"],"names":[],"version":3,"file":"useComboBoxState.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/combobox/src/useComboBoxState.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 {Collection, CollectionStateBase, FocusStrategy, Key, Node, Selection} from '@react-types/shared';\nimport {ComboBoxProps, MenuTriggerAction, SelectionMode, ValueType} from '@react-types/combobox';\nimport {FormValidationState, useFormValidationState} from '@react-stately/form';\nimport {getChildNodes} from '@react-stately/collections';\nimport {ListCollection, ListState, useListState} from '@react-stately/list';\nimport {OverlayTriggerState, useOverlayTriggerState} from '@react-stately/overlays';\nimport {useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport {useControlledState} from '@react-stately/utils';\n\nexport interface ComboBoxState<T, M extends SelectionMode = 'single'> extends ListState<T>, OverlayTriggerState, FormValidationState {\n /**\n * The key for the first selected item.\n * @deprecated\n */\n readonly selectedKey: Key | null,\n\n /**\n * The default selected key.\n * @deprecated\n */\n readonly defaultSelectedKey: Key | null,\n /**\n * Sets the selected key.\n * @deprecated\n */\n setSelectedKey(key: Key | null): void,\n /** The current combobox value. */\n readonly value: ValueType<M>,\n /** The default combobox value. */\n readonly defaultValue: ValueType<M>,\n /** Sets the combobox value. */\n setValue(value: Key | readonly Key[] | null): void,\n /**\n * The value of the first selected item.\n * @deprecated\n */\n readonly selectedItem: Node<T> | null,\n /** The value of the selected items. */\n readonly selectedItems: Node<T>[],\n /** The current value of the combo box input. */\n inputValue: string,\n /** The default value of the combo box input. */\n defaultInputValue: string,\n /** Sets the value of the combo box input. */\n setInputValue(value: string): void,\n /** Selects the currently focused item and updates the input value. */\n commit(): void,\n /** Controls which item will be auto focused when the menu opens. */\n readonly focusStrategy: FocusStrategy | null,\n /** Whether the select is currently focused. */\n readonly isFocused: boolean,\n /** Sets whether the select is focused. */\n setFocused(isFocused: boolean): void,\n /** Opens the menu. */\n open(focusStrategy?: FocusStrategy | null, trigger?: MenuTriggerAction): void,\n /** Toggles the menu. */\n toggle(focusStrategy?: FocusStrategy | null, trigger?: MenuTriggerAction): void,\n /** Resets the input value to the previously selected item's text if any and closes the menu. */\n revert(): void\n}\n\ntype FilterFn = (textValue: string, inputValue: string) => boolean;\n\nexport interface ComboBoxStateOptions<T, M extends SelectionMode = 'single'> extends Omit<ComboBoxProps<T, M>, 'children'>, CollectionStateBase<T> {\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: FilterFn,\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean,\n /** Whether the combo box menu should close on blur. */\n shouldCloseOnBlur?: boolean\n}\n\nconst EMPTY_VALUE: Key[] = [];\n\n/**\n * Provides state management for a combo box component. Handles building a collection\n * of items from props and manages the option selection state of the combo box. In addition, it tracks the input value,\n * focus state, and other properties of the combo box.\n */\nexport function useComboBoxState<T extends object, M extends SelectionMode = 'single'>(props: ComboBoxStateOptions<T, M>): ComboBoxState<T> {\n let {\n defaultFilter,\n menuTrigger = 'input',\n allowsEmptyCollection = false,\n allowsCustomValue,\n shouldCloseOnBlur = true,\n selectionMode = 'single' as SelectionMode\n } = props;\n\n let [showAllItems, setShowAllItems] = useState(false);\n let [isFocused, setFocusedState] = useState(false);\n let [focusStrategy, setFocusStrategy] = useState<FocusStrategy | null>(null);\n\n let defaultValue = useMemo(() => {\n return props.defaultValue !== undefined ? props.defaultValue : (selectionMode === 'single' ? props.defaultSelectedKey ?? null : []) as ValueType<M>;\n }, [props.defaultValue, props.defaultSelectedKey, selectionMode]);\n let value = useMemo(() => {\n return props.value !== undefined ? props.value : (selectionMode === 'single' ? props.selectedKey : undefined) as ValueType<M>;\n }, [props.value, props.selectedKey, selectionMode]);\n let [controlledValue, setControlledValue] = useControlledState<Key | readonly Key[] | null>(value, defaultValue, props.onChange as any);\n // Only display the first selected item if in single selection mode but the value is an array.\n let displayValue: ValueType<M> = selectionMode === 'single' && Array.isArray(controlledValue) ? controlledValue[0] : controlledValue;\n\n let setValue = (value: Key | Key[] | null) => {\n if (selectionMode === 'single') {\n let key = Array.isArray(value) ? value[0] ?? null : value;\n setControlledValue(key);\n if (key !== displayValue) {\n props.onSelectionChange?.(key);\n }\n } else {\n let keys: Key[] = [];\n if (Array.isArray(value)) {\n keys = value;\n } else if (value != null) {\n keys = [value];\n }\n\n setControlledValue(keys);\n }\n };\n\n let {\n collection,\n selectionManager,\n disabledKeys\n } = useListState({\n ...props,\n items: props.items ?? props.defaultItems,\n selectionMode,\n disallowEmptySelection: selectionMode === 'single',\n allowDuplicateSelectionEvents: true,\n selectedKeys: useMemo(() => convertValue(displayValue), [displayValue]),\n onSelectionChange: (keys: Selection) => {\n // impossible, but TS doesn't know that\n if (keys === 'all') {\n return;\n }\n\n if (selectionMode === 'single') {\n let key = keys.values().next().value ?? null;\n if (key === displayValue) {\n props.onSelectionChange?.(key);\n // If key is the same, reset the inputValue and close the menu\n // (scenario: user clicks on already selected option)\n resetInputValue();\n closeMenu();\n } else {\n setValue(key);\n }\n } else {\n setValue([...keys]);\n }\n }\n });\n\n let selectedKey = selectionMode === 'single' ? selectionManager.firstSelectedKey : null;\n let selectedItems = useMemo(() => {\n return [...selectionManager.selectedKeys].map(key => collection.getItem(key)).filter(item => item != null);\n }, [selectionManager.selectedKeys, collection]);\n\n let [inputValue, setInputValue] = useControlledState(\n props.inputValue,\n getDefaultInputValue(props.defaultInputValue, selectedKey, collection) || '',\n props.onInputChange\n );\n let [initialValue] = useState(displayValue);\n let [initialInputValue] = useState(inputValue);\n\n // Preserve original collection so we can show all items on demand\n let originalCollection = collection;\n let filteredCollection = useMemo(() => (\n // No default filter if items are controlled.\n props.items != null || !defaultFilter\n ? collection\n : filterCollection(collection, inputValue, defaultFilter)\n ), [collection, inputValue, defaultFilter, props.items]);\n let [lastCollection, setLastCollection] = useState(filteredCollection);\n\n // Track what action is attempting to open the menu\n let menuOpenTrigger = useRef<MenuTriggerAction | undefined>('focus');\n let onOpenChange = (open: boolean) => {\n if (props.onOpenChange) {\n props.onOpenChange(open, open ? menuOpenTrigger.current : undefined);\n }\n\n selectionManager.setFocused(open);\n if (!open) {\n selectionManager.setFocusedKey(null);\n }\n };\n\n let triggerState = useOverlayTriggerState({...props, onOpenChange, isOpen: undefined, defaultOpen: undefined});\n let open = (focusStrategy: FocusStrategy | null = null, trigger?: MenuTriggerAction) => {\n let displayAllItems = (trigger === 'manual' || (trigger === 'focus' && menuTrigger === 'focus'));\n // Prevent open operations from triggering if there is nothing to display\n // Also prevent open operations from triggering if items are uncontrolled but defaultItems is empty, even if displayAllItems is true.\n // This is to prevent comboboxes with empty defaultItems from opening but allow controlled items comboboxes to open even if the inital list is empty (assumption is user will provide swap the empty list with a base list via onOpenChange returning `menuTrigger` manual)\n if (allowsEmptyCollection || filteredCollection.size > 0 || (displayAllItems && originalCollection.size > 0) || props.items) {\n if (displayAllItems && !triggerState.isOpen && props.items === undefined) {\n // Show all items if menu is manually opened. Only care about this if items are undefined\n setShowAllItems(true);\n }\n\n menuOpenTrigger.current = trigger;\n setFocusStrategy(focusStrategy);\n triggerState.open();\n }\n };\n\n let toggle = (focusStrategy: FocusStrategy | null = null, trigger?: MenuTriggerAction) => {\n let displayAllItems = (trigger === 'manual' || (trigger === 'focus' && menuTrigger === 'focus'));\n // If the menu is closed and there is nothing to display, early return so toggle isn't called to prevent extraneous onOpenChange\n if (!(allowsEmptyCollection || filteredCollection.size > 0 || (displayAllItems && originalCollection.size > 0) || props.items) && !triggerState.isOpen) {\n return;\n }\n\n if (displayAllItems && !triggerState.isOpen && props.items === undefined) {\n // Show all items if menu is toggled open. Only care about this if items are undefined\n setShowAllItems(true);\n }\n\n // Only update the menuOpenTrigger if menu is currently closed\n if (!triggerState.isOpen) {\n menuOpenTrigger.current = trigger;\n }\n\n toggleMenu(focusStrategy);\n };\n\n let updateLastCollection = useCallback(() => {\n setLastCollection(showAllItems ? originalCollection : filteredCollection);\n }, [showAllItems, originalCollection, filteredCollection]);\n\n // If menu is going to close, save the current collection so we can freeze the displayed collection when the\n // user clicks outside the popover to close the menu. Prevents the menu contents from updating as the menu closes.\n let toggleMenu = useCallback((focusStrategy: FocusStrategy | null = null) => {\n if (triggerState.isOpen) {\n updateLastCollection();\n }\n\n setFocusStrategy(focusStrategy);\n triggerState.toggle();\n }, [triggerState, updateLastCollection]);\n\n let closeMenu = useCallback(() => {\n if (triggerState.isOpen) {\n updateLastCollection();\n triggerState.close();\n }\n }, [triggerState, updateLastCollection]);\n\n let [lastValue, setLastValue] = useState(inputValue);\n let resetInputValue = () => {\n let itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n setLastValue(itemText);\n setInputValue(itemText);\n };\n\n let lastValueRef = useRef(displayValue);\n let lastSelectedKeyText = useRef(\n selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : ''\n );\n // intentional omit dependency array, want this to happen on every render\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(() => {\n // Open and close menu automatically when the input value changes if the input is focused,\n // and there are items in the collection or allowEmptyCollection is true.\n if (\n isFocused &&\n (filteredCollection.size > 0 || allowsEmptyCollection) &&\n !triggerState.isOpen &&\n inputValue !== lastValue &&\n menuTrigger !== 'manual'\n ) {\n open(null, 'input');\n }\n\n // Close the menu if the collection is empty. Don't close menu if filtered collection size is 0\n // but we are currently showing all items via button press\n if (\n !showAllItems &&\n !allowsEmptyCollection &&\n triggerState.isOpen &&\n filteredCollection.size === 0\n ) {\n closeMenu();\n }\n\n // Close when an item is selected.\n if (\n displayValue != null &&\n displayValue !== lastValueRef.current &&\n selectionMode === 'single'\n ) {\n closeMenu();\n }\n\n // Clear focused key when input value changes and display filtered collection again.\n if (inputValue !== lastValue) {\n selectionManager.setFocusedKey(null);\n setShowAllItems(false);\n\n // Set value to null when the user clears the input.\n // If controlled, this is the application developer's responsibility.\n if (selectionMode === 'single' && inputValue === '' && (props.inputValue === undefined || value === undefined)) {\n setValue(null);\n }\n }\n\n // If the value changed, update the input value.\n // Do nothing if both inputValue and value are controlled.\n // In this case, it's the user's responsibility to update inputValue in onSelectionChange.\n if (\n displayValue !== lastValueRef.current &&\n (props.inputValue === undefined || value === undefined)\n ) {\n resetInputValue();\n } else if (lastValue !== inputValue) {\n setLastValue(inputValue);\n }\n\n // Update the inputValue if the selected item's text changes from its last tracked value.\n // This is to handle cases where a selectedKey is specified but the items aren't available (async loading) or the selected item's text value updates.\n // Only reset if the user isn't currently within the field so we don't erroneously modify user input.\n // If inputValue is controlled, it is the user's responsibility to update the inputValue when items change.\n let selectedItemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey === lastValueRef.current) {\n if (lastSelectedKeyText.current !== selectedItemText) {\n setLastValue(selectedItemText);\n setInputValue(selectedItemText);\n }\n }\n\n lastValueRef.current = displayValue;\n lastSelectedKeyText.current = selectedItemText;\n });\n\n let validation = useFormValidationState({\n ...props,\n value: useMemo(() => Array.isArray(displayValue) && displayValue.length === 0 ? null : ({inputValue, value: displayValue as any, selectedKey}), [inputValue, selectedKey, displayValue])\n });\n\n // Revert input value and close menu\n let revert = () => {\n if (allowsCustomValue && selectedKey == null) {\n commitCustomValue();\n } else {\n commitSelection();\n }\n };\n\n let commitCustomValue = () => {\n let value = selectionMode === 'multiple' ? EMPTY_VALUE : null;\n lastValueRef.current = value as any;\n setValue(value);\n closeMenu();\n };\n\n let commitSelection = () => {\n // If multiple things are controlled, call onSelectionChange\n if (value !== undefined && props.inputValue !== undefined) {\n props.onSelectionChange?.(selectedKey);\n props.onChange?.(displayValue);\n\n // Stop menu from reopening from useEffect\n let itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n setLastValue(itemText);\n closeMenu();\n } else {\n // If only a single aspect of combobox is controlled, reset input value and close menu for the user\n resetInputValue();\n closeMenu();\n }\n };\n\n const commitValue = () => {\n if (allowsCustomValue) {\n const itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';\n (inputValue === itemText) ? commitSelection() : commitCustomValue();\n } else {\n // Reset inputValue and close menu\n commitSelection();\n }\n };\n\n let commit = () => {\n if (triggerState.isOpen && selectionManager.focusedKey != null) {\n // Reset inputValue and close menu here if the selected key is already the focused key. Otherwise\n // fire onSelectionChange to allow the application to control the closing.\n if (selectionManager.isSelected(selectionManager.focusedKey) && selectionMode === 'single') {\n commitSelection();\n } else {\n selectionManager.select(selectionManager.focusedKey);\n }\n } else {\n commitValue();\n }\n };\n\n let valueOnFocus = useRef(inputValue);\n let setFocused = (isFocused: boolean) => {\n if (isFocused) {\n valueOnFocus.current = inputValue;\n if (menuTrigger === 'focus' && !props.isReadOnly) {\n open(null, 'focus');\n }\n } else {\n if (shouldCloseOnBlur) {\n commitValue();\n }\n\n if (inputValue !== valueOnFocus.current) {\n validation.commitValidation();\n }\n }\n\n setFocusedState(isFocused);\n };\n\n let displayedCollection = useMemo(() => {\n if (triggerState.isOpen) {\n if (showAllItems) {\n return originalCollection;\n } else {\n return filteredCollection;\n }\n } else {\n return lastCollection;\n }\n }, [triggerState.isOpen, originalCollection, filteredCollection, showAllItems, lastCollection]);\n\n let defaultSelectedKey = props.defaultSelectedKey ?? (selectionMode === 'single' ? initialValue as Key : null);\n\n return {\n ...validation,\n ...triggerState,\n focusStrategy,\n toggle,\n open,\n close: commitValue,\n selectionManager,\n value: displayValue as any,\n defaultValue: defaultValue ?? initialValue as any,\n setValue,\n selectedKey,\n selectedItems,\n defaultSelectedKey,\n setSelectedKey: setValue,\n disabledKeys,\n isFocused,\n setFocused,\n selectedItem: selectedItems[0] ?? null,\n collection: displayedCollection,\n inputValue,\n defaultInputValue: getDefaultInputValue(props.defaultInputValue, defaultSelectedKey, collection) ?? initialInputValue,\n setInputValue,\n commit,\n revert\n };\n}\n\nfunction filterCollection<T extends object>(collection: Collection<Node<T>>, inputValue: string, filter: FilterFn): Collection<Node<T>> {\n return new ListCollection(filterNodes(collection, collection, inputValue, filter));\n}\n\nfunction filterNodes<T>(collection: Collection<Node<T>>, nodes: Iterable<Node<T>>, inputValue: string, filter: FilterFn): Iterable<Node<T>> {\n let filteredNode: Node<T>[] = [];\n for (let node of nodes) {\n if (node.type === 'section' && node.hasChildNodes) {\n let filtered = filterNodes(collection, getChildNodes(node, collection), inputValue, filter);\n if ([...filtered].some(node => node.type === 'item')) {\n filteredNode.push({...node, childNodes: filtered});\n }\n } else if (node.type === 'item' && filter(node.textValue, inputValue)) {\n filteredNode.push({...node});\n } else if (node.type !== 'item') {\n filteredNode.push({...node});\n }\n }\n return filteredNode;\n}\n\n\nfunction getDefaultInputValue(defaultInputValue: string | null | undefined, selectedKey: Key | null, collection: Collection<Node<unknown>>) {\n if (defaultInputValue == null) {\n if (selectedKey != null) {\n return collection.getItem(selectedKey)?.textValue ?? '';\n }\n }\n\n return defaultInputValue;\n}\n\nfunction convertValue(value: Key | Key[] | null | undefined) {\n if (value === undefined) {\n return undefined;\n }\n if (value === null) {\n return [];\n }\n return Array.isArray(value) ? value : [value];\n}\n"],"names":[],"version":3,"file":"useComboBoxState.main.js.map"}
|