@react-stately/combobox 3.8.3-nightly.4555 → 3.8.3-nightly.4558

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/import.mjs CHANGED
@@ -1,9 +1,4 @@
1
- import {useFormValidationState as $k6Ppu$useFormValidationState} from "@react-stately/form";
2
- import {getChildNodes as $k6Ppu$getChildNodes} from "@react-stately/collections";
3
- import {useSingleSelectListState as $k6Ppu$useSingleSelectListState, ListCollection as $k6Ppu$ListCollection} from "@react-stately/list";
4
- import {useState as $k6Ppu$useState, useMemo as $k6Ppu$useMemo, useRef as $k6Ppu$useRef, useCallback as $k6Ppu$useCallback, useEffect as $k6Ppu$useEffect} from "react";
5
- import {useControlledState as $k6Ppu$useControlledState} from "@react-stately/utils";
6
- import {useOverlayTriggerState as $k6Ppu$useOverlayTriggerState} from "@react-stately/overlays";
1
+ import {useComboBoxState as $a9e7382a7d111cb5$export$b453a3bfd4a5fa9e} from "./useComboBoxState.mjs";
7
2
 
8
3
  /*
9
4
  * Copyright 2020 Adobe. All rights reserved.
@@ -15,292 +10,8 @@ import {useOverlayTriggerState as $k6Ppu$useOverlayTriggerState} from "@react-st
15
10
  * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
16
11
  * OF ANY KIND, either express or implied. See the License for the specific language
17
12
  * governing permissions and limitations under the License.
18
- */ /*
19
- * Copyright 2020 Adobe. All rights reserved.
20
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
21
- * you may not use this file except in compliance with the License. You may obtain a copy
22
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
23
- *
24
- * Unless required by applicable law or agreed to in writing, software distributed under
25
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
26
- * OF ANY KIND, either express or implied. See the License for the specific language
27
- * governing permissions and limitations under the License.
28
13
  */
29
14
 
30
15
 
31
-
32
-
33
-
34
- function $a9e7382a7d111cb5$export$b453a3bfd4a5fa9e(props) {
35
- var _collection_getItem, _collection_getItem1;
36
- let { defaultFilter: defaultFilter, menuTrigger: menuTrigger = "input", allowsEmptyCollection: allowsEmptyCollection = false, allowsCustomValue: allowsCustomValue, shouldCloseOnBlur: shouldCloseOnBlur = true } = props;
37
- let [showAllItems, setShowAllItems] = (0, $k6Ppu$useState)(false);
38
- let [isFocused, setFocusedState] = (0, $k6Ppu$useState)(false);
39
- let [focusStrategy, setFocusStrategy] = (0, $k6Ppu$useState)(null);
40
- let onSelectionChange = (key)=>{
41
- if (props.onSelectionChange) props.onSelectionChange(key);
42
- // If key is the same, reset the inputValue and close the menu
43
- // (scenario: user clicks on already selected option)
44
- if (key === selectedKey) {
45
- resetInputValue();
46
- closeMenu();
47
- }
48
- };
49
- var _props_items;
50
- let { collection: collection, selectionManager: selectionManager, selectedKey: selectedKey, setSelectedKey: setSelectedKey, selectedItem: selectedItem, disabledKeys: disabledKeys } = (0, $k6Ppu$useSingleSelectListState)({
51
- ...props,
52
- onSelectionChange: onSelectionChange,
53
- items: (_props_items = props.items) !== null && _props_items !== void 0 ? _props_items : props.defaultItems
54
- });
55
- var _props_defaultInputValue, _ref;
56
- let [inputValue, setInputValue] = (0, $k6Ppu$useControlledState)(props.inputValue, (_ref = (_props_defaultInputValue = props.defaultInputValue) !== null && _props_defaultInputValue !== void 0 ? _props_defaultInputValue : (_collection_getItem = collection.getItem(selectedKey)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.textValue) !== null && _ref !== void 0 ? _ref : "", props.onInputChange);
57
- // Preserve original collection so we can show all items on demand
58
- let originalCollection = collection;
59
- let filteredCollection = (0, $k6Ppu$useMemo)(()=>// No default filter if items are controlled.
60
- props.items != null || !defaultFilter ? collection : $a9e7382a7d111cb5$var$filterCollection(collection, inputValue, defaultFilter), [
61
- collection,
62
- inputValue,
63
- defaultFilter,
64
- props.items
65
- ]);
66
- let [lastCollection, setLastCollection] = (0, $k6Ppu$useState)(filteredCollection);
67
- // Track what action is attempting to open the menu
68
- let menuOpenTrigger = (0, $k6Ppu$useRef)("focus");
69
- let onOpenChange = (open)=>{
70
- if (props.onOpenChange) props.onOpenChange(open, open ? menuOpenTrigger.current : undefined);
71
- selectionManager.setFocused(open);
72
- if (!open) selectionManager.setFocusedKey(null);
73
- };
74
- let triggerState = (0, $k6Ppu$useOverlayTriggerState)({
75
- ...props,
76
- onOpenChange: onOpenChange,
77
- isOpen: undefined,
78
- defaultOpen: undefined
79
- });
80
- let open = (focusStrategy = null, trigger)=>{
81
- let displayAllItems = trigger === "manual" || trigger === "focus" && menuTrigger === "focus";
82
- // Prevent open operations from triggering if there is nothing to display
83
- // Also prevent open operations from triggering if items are uncontrolled but defaultItems is empty, even if displayAllItems is true.
84
- // 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)
85
- if (allowsEmptyCollection || filteredCollection.size > 0 || displayAllItems && originalCollection.size > 0 || props.items) {
86
- if (displayAllItems && !triggerState.isOpen && props.items === undefined) // Show all items if menu is manually opened. Only care about this if items are undefined
87
- setShowAllItems(true);
88
- menuOpenTrigger.current = trigger;
89
- setFocusStrategy(focusStrategy);
90
- triggerState.open();
91
- }
92
- };
93
- let toggle = (focusStrategy = null, trigger)=>{
94
- let displayAllItems = trigger === "manual" || trigger === "focus" && menuTrigger === "focus";
95
- // If the menu is closed and there is nothing to display, early return so toggle isn't called to prevent extraneous onOpenChange
96
- if (!(allowsEmptyCollection || filteredCollection.size > 0 || displayAllItems && originalCollection.size > 0 || props.items) && !triggerState.isOpen) return;
97
- if (displayAllItems && !triggerState.isOpen && props.items === undefined) // Show all items if menu is toggled open. Only care about this if items are undefined
98
- setShowAllItems(true);
99
- // Only update the menuOpenTrigger if menu is currently closed
100
- if (!triggerState.isOpen) menuOpenTrigger.current = trigger;
101
- toggleMenu(focusStrategy);
102
- };
103
- let updateLastCollection = (0, $k6Ppu$useCallback)(()=>{
104
- setLastCollection(showAllItems ? originalCollection : filteredCollection);
105
- }, [
106
- showAllItems,
107
- originalCollection,
108
- filteredCollection
109
- ]);
110
- // If menu is going to close, save the current collection so we can freeze the displayed collection when the
111
- // user clicks outside the popover to close the menu. Prevents the menu contents from updating as the menu closes.
112
- let toggleMenu = (0, $k6Ppu$useCallback)((focusStrategy = null)=>{
113
- if (triggerState.isOpen) updateLastCollection();
114
- setFocusStrategy(focusStrategy);
115
- triggerState.toggle();
116
- }, [
117
- triggerState,
118
- updateLastCollection
119
- ]);
120
- let closeMenu = (0, $k6Ppu$useCallback)(()=>{
121
- if (triggerState.isOpen) {
122
- updateLastCollection();
123
- triggerState.close();
124
- }
125
- }, [
126
- triggerState,
127
- updateLastCollection
128
- ]);
129
- let [lastValue, setLastValue] = (0, $k6Ppu$useState)(inputValue);
130
- let resetInputValue = ()=>{
131
- var _collection_getItem;
132
- var _collection_getItem_textValue;
133
- let itemText = (_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 : "";
134
- setLastValue(itemText);
135
- setInputValue(itemText);
136
- };
137
- var _props_selectedKey, _ref1;
138
- let lastSelectedKey = (0, $k6Ppu$useRef)((_ref1 = (_props_selectedKey = props.selectedKey) !== null && _props_selectedKey !== void 0 ? _props_selectedKey : props.defaultSelectedKey) !== null && _ref1 !== void 0 ? _ref1 : null);
139
- var _collection_getItem_textValue;
140
- let lastSelectedKeyText = (0, $k6Ppu$useRef)((_collection_getItem_textValue = (_collection_getItem1 = collection.getItem(selectedKey)) === null || _collection_getItem1 === void 0 ? void 0 : _collection_getItem1.textValue) !== null && _collection_getItem_textValue !== void 0 ? _collection_getItem_textValue : "");
141
- // intentional omit dependency array, want this to happen on every render
142
- // eslint-disable-next-line react-hooks/exhaustive-deps
143
- (0, $k6Ppu$useEffect)(()=>{
144
- var _collection_getItem;
145
- // Open and close menu automatically when the input value changes if the input is focused,
146
- // and there are items in the collection or allowEmptyCollection is true.
147
- if (isFocused && (filteredCollection.size > 0 || allowsEmptyCollection) && !triggerState.isOpen && inputValue !== lastValue && menuTrigger !== "manual") open(null, "input");
148
- // Close the menu if the collection is empty. Don't close menu if filtered collection size is 0
149
- // but we are currently showing all items via button press
150
- if (!showAllItems && !allowsEmptyCollection && triggerState.isOpen && filteredCollection.size === 0) closeMenu();
151
- // Close when an item is selected.
152
- if (selectedKey != null && selectedKey !== lastSelectedKey.current) closeMenu();
153
- // Clear focused key when input value changes and display filtered collection again.
154
- if (inputValue !== lastValue) {
155
- selectionManager.setFocusedKey(null);
156
- setShowAllItems(false);
157
- // Set selectedKey to null when the user clears the input.
158
- // If controlled, this is the application developer's responsibility.
159
- if (inputValue === "" && (props.inputValue === undefined || props.selectedKey === undefined)) setSelectedKey(null);
160
- }
161
- // If the selectedKey changed, update the input value.
162
- // Do nothing if both inputValue and selectedKey are controlled.
163
- // In this case, it's the user's responsibility to update inputValue in onSelectionChange.
164
- if (selectedKey !== lastSelectedKey.current && (props.inputValue === undefined || props.selectedKey === undefined)) resetInputValue();
165
- else if (lastValue !== inputValue) setLastValue(inputValue);
166
- var _collection_getItem_textValue;
167
- // Update the inputValue if the selected item's text changes from its last tracked value.
168
- // 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.
169
- // Only reset if the user isn't currently within the field so we don't erroneously modify user input.
170
- // If inputValue is controlled, it is the user's responsibility to update the inputValue when items change.
171
- let selectedItemText = (_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 : "";
172
- if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey === lastSelectedKey.current) {
173
- if (lastSelectedKeyText.current !== selectedItemText) {
174
- setLastValue(selectedItemText);
175
- setInputValue(selectedItemText);
176
- }
177
- }
178
- lastSelectedKey.current = selectedKey;
179
- lastSelectedKeyText.current = selectedItemText;
180
- });
181
- let validation = (0, $k6Ppu$useFormValidationState)({
182
- ...props,
183
- value: (0, $k6Ppu$useMemo)(()=>({
184
- inputValue: inputValue,
185
- selectedKey: selectedKey
186
- }), [
187
- inputValue,
188
- selectedKey
189
- ])
190
- });
191
- // Revert input value and close menu
192
- let revert = ()=>{
193
- if (allowsCustomValue && selectedKey == null) commitCustomValue();
194
- else commitSelection();
195
- };
196
- let commitCustomValue = ()=>{
197
- lastSelectedKey.current = null;
198
- setSelectedKey(null);
199
- closeMenu();
200
- };
201
- let commitSelection = ()=>{
202
- // If multiple things are controlled, call onSelectionChange
203
- if (props.selectedKey !== undefined && props.inputValue !== undefined) {
204
- var _collection_getItem;
205
- props.onSelectionChange(selectedKey);
206
- var _collection_getItem_textValue;
207
- // Stop menu from reopening from useEffect
208
- let itemText = (_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 : "";
209
- setLastValue(itemText);
210
- closeMenu();
211
- } else {
212
- // If only a single aspect of combobox is controlled, reset input value and close menu for the user
213
- resetInputValue();
214
- closeMenu();
215
- }
216
- };
217
- const commitValue = ()=>{
218
- if (allowsCustomValue) {
219
- var _collection_getItem;
220
- var _collection_getItem_textValue;
221
- const itemText = (_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 : "";
222
- inputValue === itemText ? commitSelection() : commitCustomValue();
223
- } else // Reset inputValue and close menu
224
- commitSelection();
225
- };
226
- let commit = ()=>{
227
- if (triggerState.isOpen && selectionManager.focusedKey != null) {
228
- // Reset inputValue and close menu here if the selected key is already the focused key. Otherwise
229
- // fire onSelectionChange to allow the application to control the closing.
230
- if (selectedKey === selectionManager.focusedKey) commitSelection();
231
- else setSelectedKey(selectionManager.focusedKey);
232
- } else commitValue();
233
- };
234
- let valueOnFocus = (0, $k6Ppu$useRef)(inputValue);
235
- let setFocused = (isFocused)=>{
236
- if (isFocused) {
237
- valueOnFocus.current = inputValue;
238
- if (menuTrigger === "focus") open(null, "focus");
239
- } else {
240
- if (shouldCloseOnBlur) commitValue();
241
- if (inputValue !== valueOnFocus.current) validation.commitValidation();
242
- }
243
- setFocusedState(isFocused);
244
- };
245
- let displayedCollection = (0, $k6Ppu$useMemo)(()=>{
246
- if (triggerState.isOpen) {
247
- if (showAllItems) return originalCollection;
248
- else return filteredCollection;
249
- } else return lastCollection;
250
- }, [
251
- triggerState.isOpen,
252
- originalCollection,
253
- filteredCollection,
254
- showAllItems,
255
- lastCollection
256
- ]);
257
- return {
258
- ...validation,
259
- ...triggerState,
260
- focusStrategy: focusStrategy,
261
- toggle: toggle,
262
- open: open,
263
- close: commitValue,
264
- selectionManager: selectionManager,
265
- selectedKey: selectedKey,
266
- setSelectedKey: setSelectedKey,
267
- disabledKeys: disabledKeys,
268
- isFocused: isFocused,
269
- setFocused: setFocused,
270
- selectedItem: selectedItem,
271
- collection: displayedCollection,
272
- inputValue: inputValue,
273
- setInputValue: setInputValue,
274
- commit: commit,
275
- revert: revert
276
- };
277
- }
278
- function $a9e7382a7d111cb5$var$filterCollection(collection, inputValue, filter) {
279
- return new (0, $k6Ppu$ListCollection)($a9e7382a7d111cb5$var$filterNodes(collection, collection, inputValue, filter));
280
- }
281
- function $a9e7382a7d111cb5$var$filterNodes(collection, nodes, inputValue, filter) {
282
- let filteredNode = [];
283
- for (let node of nodes){
284
- if (node.type === "section" && node.hasChildNodes) {
285
- let filtered = $a9e7382a7d111cb5$var$filterNodes(collection, (0, $k6Ppu$getChildNodes)(node, collection), inputValue, filter);
286
- if ([
287
- ...filtered
288
- ].some((node)=>node.type === "item")) filteredNode.push({
289
- ...node,
290
- childNodes: filtered
291
- });
292
- } else if (node.type === "item" && filter(node.textValue, inputValue)) filteredNode.push({
293
- ...node
294
- });
295
- else if (node.type !== "item") filteredNode.push({
296
- ...node
297
- });
298
- }
299
- return filteredNode;
300
- }
301
-
302
-
303
-
304
-
305
16
  export {$a9e7382a7d111cb5$export$b453a3bfd4a5fa9e as useComboBoxState};
306
17
  //# sourceMappingURL=module.js.map
package/dist/main.js CHANGED
@@ -1,16 +1,11 @@
1
- var $5XAuq$reactstatelyform = require("@react-stately/form");
2
- var $5XAuq$reactstatelycollections = require("@react-stately/collections");
3
- var $5XAuq$reactstatelylist = require("@react-stately/list");
4
- var $5XAuq$react = require("react");
5
- var $5XAuq$reactstatelyutils = require("@react-stately/utils");
6
- var $5XAuq$reactstatelyoverlays = require("@react-stately/overlays");
1
+ var $e563f9c9469ad14c$exports = require("./useComboBoxState.main.js");
7
2
 
8
3
 
9
4
  function $parcel$export(e, n, v, s) {
10
5
  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
11
6
  }
12
7
 
13
- $parcel$export(module.exports, "useComboBoxState", () => $e563f9c9469ad14c$export$b453a3bfd4a5fa9e);
8
+ $parcel$export(module.exports, "useComboBoxState", () => $e563f9c9469ad14c$exports.useComboBoxState);
14
9
  /*
15
10
  * Copyright 2020 Adobe. All rights reserved.
16
11
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -21,291 +16,7 @@ $parcel$export(module.exports, "useComboBoxState", () => $e563f9c9469ad14c$expor
21
16
  * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
22
17
  * OF ANY KIND, either express or implied. See the License for the specific language
23
18
  * governing permissions and limitations under the License.
24
- */ /*
25
- * Copyright 2020 Adobe. All rights reserved.
26
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
27
- * you may not use this file except in compliance with the License. You may obtain a copy
28
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
29
- *
30
- * Unless required by applicable law or agreed to in writing, software distributed under
31
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
32
- * OF ANY KIND, either express or implied. See the License for the specific language
33
- * governing permissions and limitations under the License.
34
19
  */
35
20
 
36
21
 
37
-
38
-
39
-
40
- function $e563f9c9469ad14c$export$b453a3bfd4a5fa9e(props) {
41
- var _collection_getItem, _collection_getItem1;
42
- let { defaultFilter: defaultFilter, menuTrigger: menuTrigger = "input", allowsEmptyCollection: allowsEmptyCollection = false, allowsCustomValue: allowsCustomValue, shouldCloseOnBlur: shouldCloseOnBlur = true } = props;
43
- let [showAllItems, setShowAllItems] = (0, $5XAuq$react.useState)(false);
44
- let [isFocused, setFocusedState] = (0, $5XAuq$react.useState)(false);
45
- let [focusStrategy, setFocusStrategy] = (0, $5XAuq$react.useState)(null);
46
- let onSelectionChange = (key)=>{
47
- if (props.onSelectionChange) props.onSelectionChange(key);
48
- // If key is the same, reset the inputValue and close the menu
49
- // (scenario: user clicks on already selected option)
50
- if (key === selectedKey) {
51
- resetInputValue();
52
- closeMenu();
53
- }
54
- };
55
- var _props_items;
56
- let { collection: collection, selectionManager: selectionManager, selectedKey: selectedKey, setSelectedKey: setSelectedKey, selectedItem: selectedItem, disabledKeys: disabledKeys } = (0, $5XAuq$reactstatelylist.useSingleSelectListState)({
57
- ...props,
58
- onSelectionChange: onSelectionChange,
59
- items: (_props_items = props.items) !== null && _props_items !== void 0 ? _props_items : props.defaultItems
60
- });
61
- var _props_defaultInputValue, _ref;
62
- let [inputValue, setInputValue] = (0, $5XAuq$reactstatelyutils.useControlledState)(props.inputValue, (_ref = (_props_defaultInputValue = props.defaultInputValue) !== null && _props_defaultInputValue !== void 0 ? _props_defaultInputValue : (_collection_getItem = collection.getItem(selectedKey)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.textValue) !== null && _ref !== void 0 ? _ref : "", props.onInputChange);
63
- // Preserve original collection so we can show all items on demand
64
- let originalCollection = collection;
65
- let filteredCollection = (0, $5XAuq$react.useMemo)(()=>// No default filter if items are controlled.
66
- props.items != null || !defaultFilter ? collection : $e563f9c9469ad14c$var$filterCollection(collection, inputValue, defaultFilter), [
67
- collection,
68
- inputValue,
69
- defaultFilter,
70
- props.items
71
- ]);
72
- let [lastCollection, setLastCollection] = (0, $5XAuq$react.useState)(filteredCollection);
73
- // Track what action is attempting to open the menu
74
- let menuOpenTrigger = (0, $5XAuq$react.useRef)("focus");
75
- let onOpenChange = (open)=>{
76
- if (props.onOpenChange) props.onOpenChange(open, open ? menuOpenTrigger.current : undefined);
77
- selectionManager.setFocused(open);
78
- if (!open) selectionManager.setFocusedKey(null);
79
- };
80
- let triggerState = (0, $5XAuq$reactstatelyoverlays.useOverlayTriggerState)({
81
- ...props,
82
- onOpenChange: onOpenChange,
83
- isOpen: undefined,
84
- defaultOpen: undefined
85
- });
86
- let open = (focusStrategy = null, trigger)=>{
87
- let displayAllItems = trigger === "manual" || trigger === "focus" && menuTrigger === "focus";
88
- // Prevent open operations from triggering if there is nothing to display
89
- // Also prevent open operations from triggering if items are uncontrolled but defaultItems is empty, even if displayAllItems is true.
90
- // 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)
91
- if (allowsEmptyCollection || filteredCollection.size > 0 || displayAllItems && originalCollection.size > 0 || props.items) {
92
- if (displayAllItems && !triggerState.isOpen && props.items === undefined) // Show all items if menu is manually opened. Only care about this if items are undefined
93
- setShowAllItems(true);
94
- menuOpenTrigger.current = trigger;
95
- setFocusStrategy(focusStrategy);
96
- triggerState.open();
97
- }
98
- };
99
- let toggle = (focusStrategy = null, trigger)=>{
100
- let displayAllItems = trigger === "manual" || trigger === "focus" && menuTrigger === "focus";
101
- // If the menu is closed and there is nothing to display, early return so toggle isn't called to prevent extraneous onOpenChange
102
- if (!(allowsEmptyCollection || filteredCollection.size > 0 || displayAllItems && originalCollection.size > 0 || props.items) && !triggerState.isOpen) return;
103
- if (displayAllItems && !triggerState.isOpen && props.items === undefined) // Show all items if menu is toggled open. Only care about this if items are undefined
104
- setShowAllItems(true);
105
- // Only update the menuOpenTrigger if menu is currently closed
106
- if (!triggerState.isOpen) menuOpenTrigger.current = trigger;
107
- toggleMenu(focusStrategy);
108
- };
109
- let updateLastCollection = (0, $5XAuq$react.useCallback)(()=>{
110
- setLastCollection(showAllItems ? originalCollection : filteredCollection);
111
- }, [
112
- showAllItems,
113
- originalCollection,
114
- filteredCollection
115
- ]);
116
- // If menu is going to close, save the current collection so we can freeze the displayed collection when the
117
- // user clicks outside the popover to close the menu. Prevents the menu contents from updating as the menu closes.
118
- let toggleMenu = (0, $5XAuq$react.useCallback)((focusStrategy = null)=>{
119
- if (triggerState.isOpen) updateLastCollection();
120
- setFocusStrategy(focusStrategy);
121
- triggerState.toggle();
122
- }, [
123
- triggerState,
124
- updateLastCollection
125
- ]);
126
- let closeMenu = (0, $5XAuq$react.useCallback)(()=>{
127
- if (triggerState.isOpen) {
128
- updateLastCollection();
129
- triggerState.close();
130
- }
131
- }, [
132
- triggerState,
133
- updateLastCollection
134
- ]);
135
- let [lastValue, setLastValue] = (0, $5XAuq$react.useState)(inputValue);
136
- let resetInputValue = ()=>{
137
- var _collection_getItem;
138
- var _collection_getItem_textValue;
139
- let itemText = (_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 : "";
140
- setLastValue(itemText);
141
- setInputValue(itemText);
142
- };
143
- var _props_selectedKey, _ref1;
144
- let lastSelectedKey = (0, $5XAuq$react.useRef)((_ref1 = (_props_selectedKey = props.selectedKey) !== null && _props_selectedKey !== void 0 ? _props_selectedKey : props.defaultSelectedKey) !== null && _ref1 !== void 0 ? _ref1 : null);
145
- var _collection_getItem_textValue;
146
- let lastSelectedKeyText = (0, $5XAuq$react.useRef)((_collection_getItem_textValue = (_collection_getItem1 = collection.getItem(selectedKey)) === null || _collection_getItem1 === void 0 ? void 0 : _collection_getItem1.textValue) !== null && _collection_getItem_textValue !== void 0 ? _collection_getItem_textValue : "");
147
- // intentional omit dependency array, want this to happen on every render
148
- // eslint-disable-next-line react-hooks/exhaustive-deps
149
- (0, $5XAuq$react.useEffect)(()=>{
150
- var _collection_getItem;
151
- // Open and close menu automatically when the input value changes if the input is focused,
152
- // and there are items in the collection or allowEmptyCollection is true.
153
- if (isFocused && (filteredCollection.size > 0 || allowsEmptyCollection) && !triggerState.isOpen && inputValue !== lastValue && menuTrigger !== "manual") open(null, "input");
154
- // Close the menu if the collection is empty. Don't close menu if filtered collection size is 0
155
- // but we are currently showing all items via button press
156
- if (!showAllItems && !allowsEmptyCollection && triggerState.isOpen && filteredCollection.size === 0) closeMenu();
157
- // Close when an item is selected.
158
- if (selectedKey != null && selectedKey !== lastSelectedKey.current) closeMenu();
159
- // Clear focused key when input value changes and display filtered collection again.
160
- if (inputValue !== lastValue) {
161
- selectionManager.setFocusedKey(null);
162
- setShowAllItems(false);
163
- // Set selectedKey to null when the user clears the input.
164
- // If controlled, this is the application developer's responsibility.
165
- if (inputValue === "" && (props.inputValue === undefined || props.selectedKey === undefined)) setSelectedKey(null);
166
- }
167
- // If the selectedKey changed, update the input value.
168
- // Do nothing if both inputValue and selectedKey are controlled.
169
- // In this case, it's the user's responsibility to update inputValue in onSelectionChange.
170
- if (selectedKey !== lastSelectedKey.current && (props.inputValue === undefined || props.selectedKey === undefined)) resetInputValue();
171
- else if (lastValue !== inputValue) setLastValue(inputValue);
172
- var _collection_getItem_textValue;
173
- // Update the inputValue if the selected item's text changes from its last tracked value.
174
- // 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.
175
- // Only reset if the user isn't currently within the field so we don't erroneously modify user input.
176
- // If inputValue is controlled, it is the user's responsibility to update the inputValue when items change.
177
- let selectedItemText = (_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 : "";
178
- if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey === lastSelectedKey.current) {
179
- if (lastSelectedKeyText.current !== selectedItemText) {
180
- setLastValue(selectedItemText);
181
- setInputValue(selectedItemText);
182
- }
183
- }
184
- lastSelectedKey.current = selectedKey;
185
- lastSelectedKeyText.current = selectedItemText;
186
- });
187
- let validation = (0, $5XAuq$reactstatelyform.useFormValidationState)({
188
- ...props,
189
- value: (0, $5XAuq$react.useMemo)(()=>({
190
- inputValue: inputValue,
191
- selectedKey: selectedKey
192
- }), [
193
- inputValue,
194
- selectedKey
195
- ])
196
- });
197
- // Revert input value and close menu
198
- let revert = ()=>{
199
- if (allowsCustomValue && selectedKey == null) commitCustomValue();
200
- else commitSelection();
201
- };
202
- let commitCustomValue = ()=>{
203
- lastSelectedKey.current = null;
204
- setSelectedKey(null);
205
- closeMenu();
206
- };
207
- let commitSelection = ()=>{
208
- // If multiple things are controlled, call onSelectionChange
209
- if (props.selectedKey !== undefined && props.inputValue !== undefined) {
210
- var _collection_getItem;
211
- props.onSelectionChange(selectedKey);
212
- var _collection_getItem_textValue;
213
- // Stop menu from reopening from useEffect
214
- let itemText = (_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 : "";
215
- setLastValue(itemText);
216
- closeMenu();
217
- } else {
218
- // If only a single aspect of combobox is controlled, reset input value and close menu for the user
219
- resetInputValue();
220
- closeMenu();
221
- }
222
- };
223
- const commitValue = ()=>{
224
- if (allowsCustomValue) {
225
- var _collection_getItem;
226
- var _collection_getItem_textValue;
227
- const itemText = (_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 : "";
228
- inputValue === itemText ? commitSelection() : commitCustomValue();
229
- } else // Reset inputValue and close menu
230
- commitSelection();
231
- };
232
- let commit = ()=>{
233
- if (triggerState.isOpen && selectionManager.focusedKey != null) {
234
- // Reset inputValue and close menu here if the selected key is already the focused key. Otherwise
235
- // fire onSelectionChange to allow the application to control the closing.
236
- if (selectedKey === selectionManager.focusedKey) commitSelection();
237
- else setSelectedKey(selectionManager.focusedKey);
238
- } else commitValue();
239
- };
240
- let valueOnFocus = (0, $5XAuq$react.useRef)(inputValue);
241
- let setFocused = (isFocused)=>{
242
- if (isFocused) {
243
- valueOnFocus.current = inputValue;
244
- if (menuTrigger === "focus") open(null, "focus");
245
- } else {
246
- if (shouldCloseOnBlur) commitValue();
247
- if (inputValue !== valueOnFocus.current) validation.commitValidation();
248
- }
249
- setFocusedState(isFocused);
250
- };
251
- let displayedCollection = (0, $5XAuq$react.useMemo)(()=>{
252
- if (triggerState.isOpen) {
253
- if (showAllItems) return originalCollection;
254
- else return filteredCollection;
255
- } else return lastCollection;
256
- }, [
257
- triggerState.isOpen,
258
- originalCollection,
259
- filteredCollection,
260
- showAllItems,
261
- lastCollection
262
- ]);
263
- return {
264
- ...validation,
265
- ...triggerState,
266
- focusStrategy: focusStrategy,
267
- toggle: toggle,
268
- open: open,
269
- close: commitValue,
270
- selectionManager: selectionManager,
271
- selectedKey: selectedKey,
272
- setSelectedKey: setSelectedKey,
273
- disabledKeys: disabledKeys,
274
- isFocused: isFocused,
275
- setFocused: setFocused,
276
- selectedItem: selectedItem,
277
- collection: displayedCollection,
278
- inputValue: inputValue,
279
- setInputValue: setInputValue,
280
- commit: commit,
281
- revert: revert
282
- };
283
- }
284
- function $e563f9c9469ad14c$var$filterCollection(collection, inputValue, filter) {
285
- return new (0, $5XAuq$reactstatelylist.ListCollection)($e563f9c9469ad14c$var$filterNodes(collection, collection, inputValue, filter));
286
- }
287
- function $e563f9c9469ad14c$var$filterNodes(collection, nodes, inputValue, filter) {
288
- let filteredNode = [];
289
- for (let node of nodes){
290
- if (node.type === "section" && node.hasChildNodes) {
291
- let filtered = $e563f9c9469ad14c$var$filterNodes(collection, (0, $5XAuq$reactstatelycollections.getChildNodes)(node, collection), inputValue, filter);
292
- if ([
293
- ...filtered
294
- ].some((node)=>node.type === "item")) filteredNode.push({
295
- ...node,
296
- childNodes: filtered
297
- });
298
- } else if (node.type === "item" && filter(node.textValue, inputValue)) filteredNode.push({
299
- ...node
300
- });
301
- else if (node.type !== "item") filteredNode.push({
302
- ...node
303
- });
304
- }
305
- return filteredNode;
306
- }
307
-
308
-
309
-
310
-
311
22
  //# sourceMappingURL=main.js.map