@fluentui/react-combobox 9.5.16 → 9.5.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/CHANGELOG.json +178 -1
  2. package/CHANGELOG.md +51 -2
  3. package/lib/components/Combobox/useCombobox.js +9 -13
  4. package/lib/components/Combobox/useCombobox.js.map +1 -1
  5. package/lib/components/Dropdown/useDropdown.js +1 -2
  6. package/lib/components/Dropdown/useDropdown.js.map +1 -1
  7. package/lib/components/Listbox/useListbox.js +1 -2
  8. package/lib/components/Listbox/useListbox.js.map +1 -1
  9. package/lib/components/Option/useOption.js +3 -4
  10. package/lib/components/Option/useOption.js.map +1 -1
  11. package/lib/utils/useComboboxBaseState.js +1 -2
  12. package/lib/utils/useComboboxBaseState.js.map +1 -1
  13. package/lib/utils/useComboboxPopup.js +2 -3
  14. package/lib/utils/useComboboxPopup.js.map +1 -1
  15. package/lib/utils/useOptionCollection.js +1 -2
  16. package/lib/utils/useOptionCollection.js.map +1 -1
  17. package/lib/utils/useSelection.js +2 -4
  18. package/lib/utils/useSelection.js.map +1 -1
  19. package/lib/utils/useTriggerListboxSlots.js +7 -9
  20. package/lib/utils/useTriggerListboxSlots.js.map +1 -1
  21. package/lib-commonjs/components/Combobox/useCombobox.js +9 -12
  22. package/lib-commonjs/components/Combobox/useCombobox.js.map +1 -1
  23. package/lib-commonjs/components/Dropdown/useDropdown.js +1 -2
  24. package/lib-commonjs/components/Dropdown/useDropdown.js.map +1 -1
  25. package/lib-commonjs/components/Listbox/useListbox.js +1 -2
  26. package/lib-commonjs/components/Listbox/useListbox.js.map +1 -1
  27. package/lib-commonjs/components/Option/useOption.js +3 -4
  28. package/lib-commonjs/components/Option/useOption.js.map +1 -1
  29. package/lib-commonjs/utils/useComboboxBaseState.js +1 -2
  30. package/lib-commonjs/utils/useComboboxBaseState.js.map +1 -1
  31. package/lib-commonjs/utils/useComboboxPopup.js +2 -3
  32. package/lib-commonjs/utils/useComboboxPopup.js.map +1 -1
  33. package/lib-commonjs/utils/useOptionCollection.js +1 -2
  34. package/lib-commonjs/utils/useOptionCollection.js.map +1 -1
  35. package/lib-commonjs/utils/useSelection.js +2 -4
  36. package/lib-commonjs/utils/useSelection.js.map +1 -1
  37. package/lib-commonjs/utils/useTriggerListboxSlots.js +7 -9
  38. package/lib-commonjs/utils/useTriggerListboxSlots.js.map +1 -1
  39. package/package.json +11 -11
package/CHANGELOG.json CHANGED
@@ -2,7 +2,184 @@
2
2
  "name": "@fluentui/react-combobox",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 20 Sep 2023 17:40:43 GMT",
5
+ "date": "Mon, 02 Oct 2023 08:53:05 GMT",
6
+ "tag": "@fluentui/react-combobox_v9.5.19",
7
+ "version": "9.5.19",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "beachball",
12
+ "package": "@fluentui/react-combobox",
13
+ "comment": "Bump @fluentui/react-field to v9.1.32",
14
+ "commit": "18ddec93bdb85a009bc1392058c52b2ea336340e"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-combobox",
19
+ "comment": "Bump @fluentui/react-portal to v9.3.19",
20
+ "commit": "18ddec93bdb85a009bc1392058c52b2ea336340e"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-combobox",
25
+ "comment": "Bump @fluentui/react-positioning to v9.9.16",
26
+ "commit": "18ddec93bdb85a009bc1392058c52b2ea336340e"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-combobox",
31
+ "comment": "Bump @fluentui/react-shared-contexts to v9.9.2",
32
+ "commit": "18ddec93bdb85a009bc1392058c52b2ea336340e"
33
+ }
34
+ ]
35
+ }
36
+ },
37
+ {
38
+ "date": "Tue, 26 Sep 2023 17:49:03 GMT",
39
+ "tag": "@fluentui/react-combobox_v9.5.18",
40
+ "version": "9.5.18",
41
+ "comments": {
42
+ "patch": [
43
+ {
44
+ "author": "yuanboxue@microsoft.com",
45
+ "package": "@fluentui/react-combobox",
46
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d",
47
+ "comment": "chore: trigger manual version bump after broken release"
48
+ },
49
+ {
50
+ "author": "beachball",
51
+ "package": "@fluentui/react-combobox",
52
+ "comment": "Bump @fluentui/keyboard-keys to v9.0.6",
53
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
54
+ },
55
+ {
56
+ "author": "beachball",
57
+ "package": "@fluentui/react-combobox",
58
+ "comment": "Bump @fluentui/react-context-selector to v9.1.36",
59
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
60
+ },
61
+ {
62
+ "author": "beachball",
63
+ "package": "@fluentui/react-combobox",
64
+ "comment": "Bump @fluentui/react-field to v9.1.31",
65
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
66
+ },
67
+ {
68
+ "author": "beachball",
69
+ "package": "@fluentui/react-combobox",
70
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.12",
71
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
72
+ },
73
+ {
74
+ "author": "beachball",
75
+ "package": "@fluentui/react-combobox",
76
+ "comment": "Bump @fluentui/react-portal to v9.3.18",
77
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
78
+ },
79
+ {
80
+ "author": "beachball",
81
+ "package": "@fluentui/react-combobox",
82
+ "comment": "Bump @fluentui/react-positioning to v9.9.15",
83
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
84
+ },
85
+ {
86
+ "author": "beachball",
87
+ "package": "@fluentui/react-combobox",
88
+ "comment": "Bump @fluentui/react-shared-contexts to v9.9.1",
89
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
90
+ },
91
+ {
92
+ "author": "beachball",
93
+ "package": "@fluentui/react-combobox",
94
+ "comment": "Bump @fluentui/react-theme to v9.1.14",
95
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
96
+ },
97
+ {
98
+ "author": "beachball",
99
+ "package": "@fluentui/react-combobox",
100
+ "comment": "Bump @fluentui/react-utilities to v9.13.5",
101
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
102
+ }
103
+ ]
104
+ }
105
+ },
106
+ {
107
+ "date": "Tue, 26 Sep 2023 15:32:04 GMT",
108
+ "tag": "@fluentui/react-combobox_v9.5.17",
109
+ "version": "9.5.17",
110
+ "comments": {
111
+ "patch": [
112
+ {
113
+ "author": "martinhochel@microsoft.com",
114
+ "package": "@fluentui/react-combobox",
115
+ "commit": "e61473fa10195f6ebf2308205c1e72e91b711831",
116
+ "comment": "fix: bump swc core to mitigate transpilation memory leaks"
117
+ },
118
+ {
119
+ "author": "ololubek@microsoft.com",
120
+ "package": "@fluentui/react-combobox",
121
+ "commit": "a31e7394d9f169bc5aa55430a22cdc65425a1b49",
122
+ "comment": "chore: Update react-icons version to pick up IconDirectionContextProvider updated export"
123
+ },
124
+ {
125
+ "author": "beachball",
126
+ "package": "@fluentui/react-combobox",
127
+ "comment": "Bump @fluentui/keyboard-keys to v9.0.5",
128
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
129
+ },
130
+ {
131
+ "author": "beachball",
132
+ "package": "@fluentui/react-combobox",
133
+ "comment": "Bump @fluentui/react-context-selector to v9.1.35",
134
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
135
+ },
136
+ {
137
+ "author": "beachball",
138
+ "package": "@fluentui/react-combobox",
139
+ "comment": "Bump @fluentui/react-field to v9.1.30",
140
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
141
+ },
142
+ {
143
+ "author": "beachball",
144
+ "package": "@fluentui/react-combobox",
145
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.11",
146
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
147
+ },
148
+ {
149
+ "author": "beachball",
150
+ "package": "@fluentui/react-combobox",
151
+ "comment": "Bump @fluentui/react-portal to v9.3.17",
152
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
153
+ },
154
+ {
155
+ "author": "beachball",
156
+ "package": "@fluentui/react-combobox",
157
+ "comment": "Bump @fluentui/react-positioning to v9.9.14",
158
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
159
+ },
160
+ {
161
+ "author": "beachball",
162
+ "package": "@fluentui/react-combobox",
163
+ "comment": "Bump @fluentui/react-shared-contexts to v9.9.0",
164
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
165
+ },
166
+ {
167
+ "author": "beachball",
168
+ "package": "@fluentui/react-combobox",
169
+ "comment": "Bump @fluentui/react-theme to v9.1.13",
170
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
171
+ },
172
+ {
173
+ "author": "beachball",
174
+ "package": "@fluentui/react-combobox",
175
+ "comment": "Bump @fluentui/react-utilities to v9.13.4",
176
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
177
+ }
178
+ ]
179
+ }
180
+ },
181
+ {
182
+ "date": "Wed, 20 Sep 2023 17:47:36 GMT",
6
183
  "tag": "@fluentui/react-combobox_v9.5.16",
7
184
  "version": "9.5.16",
8
185
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,61 @@
1
1
  # Change Log - @fluentui/react-combobox
2
2
 
3
- This log was last generated on Wed, 20 Sep 2023 17:40:43 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 02 Oct 2023 08:53:05 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.5.19](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.19)
8
+
9
+ Mon, 02 Oct 2023 08:53:05 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.18..@fluentui/react-combobox_v9.5.19)
11
+
12
+ ### Patches
13
+
14
+ - Bump @fluentui/react-field to v9.1.32 ([PR #29351](https://github.com/microsoft/fluentui/pull/29351) by beachball)
15
+ - Bump @fluentui/react-portal to v9.3.19 ([PR #29351](https://github.com/microsoft/fluentui/pull/29351) by beachball)
16
+ - Bump @fluentui/react-positioning to v9.9.16 ([PR #29351](https://github.com/microsoft/fluentui/pull/29351) by beachball)
17
+ - Bump @fluentui/react-shared-contexts to v9.9.2 ([PR #29351](https://github.com/microsoft/fluentui/pull/29351) by beachball)
18
+
19
+ ## [9.5.18](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.18)
20
+
21
+ Tue, 26 Sep 2023 17:49:03 GMT
22
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.17..@fluentui/react-combobox_v9.5.18)
23
+
24
+ ### Patches
25
+
26
+ - chore: trigger manual version bump after broken release ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by yuanboxue@microsoft.com)
27
+ - Bump @fluentui/keyboard-keys to v9.0.6 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
28
+ - Bump @fluentui/react-context-selector to v9.1.36 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
29
+ - Bump @fluentui/react-field to v9.1.31 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
30
+ - Bump @fluentui/react-jsx-runtime to v9.0.12 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
31
+ - Bump @fluentui/react-portal to v9.3.18 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
32
+ - Bump @fluentui/react-positioning to v9.9.15 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
33
+ - Bump @fluentui/react-shared-contexts to v9.9.1 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
34
+ - Bump @fluentui/react-theme to v9.1.14 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
35
+ - Bump @fluentui/react-utilities to v9.13.5 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
36
+
37
+ ## [9.5.17](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.17)
38
+
39
+ Tue, 26 Sep 2023 15:32:04 GMT
40
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.16..@fluentui/react-combobox_v9.5.17)
41
+
42
+ ### Patches
43
+
44
+ - fix: bump swc core to mitigate transpilation memory leaks ([PR #29253](https://github.com/microsoft/fluentui/pull/29253) by martinhochel@microsoft.com)
45
+ - chore: Update react-icons version to pick up IconDirectionContextProvider updated export ([PR #29151](https://github.com/microsoft/fluentui/pull/29151) by ololubek@microsoft.com)
46
+ - Bump @fluentui/keyboard-keys to v9.0.5 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
47
+ - Bump @fluentui/react-context-selector to v9.1.35 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
48
+ - Bump @fluentui/react-field to v9.1.30 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
49
+ - Bump @fluentui/react-jsx-runtime to v9.0.11 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
50
+ - Bump @fluentui/react-portal to v9.3.17 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
51
+ - Bump @fluentui/react-positioning to v9.9.14 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
52
+ - Bump @fluentui/react-shared-contexts to v9.9.0 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
53
+ - Bump @fluentui/react-theme to v9.1.13 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
54
+ - Bump @fluentui/react-utilities to v9.13.4 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
55
+
7
56
  ## [9.5.16](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.16)
8
57
 
9
- Wed, 20 Sep 2023 17:40:43 GMT
58
+ Wed, 20 Sep 2023 17:47:36 GMT
10
59
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.15..@fluentui/react-combobox_v9.5.16)
11
60
 
12
61
  ### Patches
@@ -17,7 +17,7 @@ import { Listbox } from '../Listbox/Listbox';
17
17
  * @param props - props from this instance of Combobox
18
18
  * @param ref - reference to root HTMLElement of Combobox
19
19
  */ export const useCombobox_unstable = (props, ref)=>{
20
- var _props_input, _listboxSlot;
20
+ var _props_input;
21
21
  // Merge props from surrounding <Field>, if any
22
22
  props = useFieldControlProps_unstable(props, {
23
23
  supportsLabelFor: true,
@@ -53,9 +53,9 @@ import { Listbox } from '../Listbox/Listbox';
53
53
  React.useEffect(()=>{
54
54
  // only recalculate width when opening
55
55
  if (open) {
56
- var _rootRef_current, _popupDimensions;
56
+ var _rootRef_current;
57
57
  const width = `${(_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.clientWidth}px`;
58
- if (width !== ((_popupDimensions = popupDimensions) === null || _popupDimensions === void 0 ? void 0 : _popupDimensions.width)) {
58
+ if (width !== (popupDimensions === null || popupDimensions === void 0 ? void 0 : popupDimensions.width)) {
59
59
  setPopupDimensions({
60
60
  width
61
61
  });
@@ -67,8 +67,7 @@ import { Listbox } from '../Listbox/Listbox';
67
67
  ]);
68
68
  // set active option and selection based on typing
69
69
  const getOptionFromInput = (inputValue)=>{
70
- var _inputValue;
71
- const searchString = (_inputValue = inputValue) === null || _inputValue === void 0 ? void 0 : _inputValue.trim().toLowerCase();
70
+ const searchString = inputValue === null || inputValue === void 0 ? void 0 : inputValue.trim().toLowerCase();
72
71
  if (!searchString || searchString.length === 0) {
73
72
  return;
74
73
  }
@@ -91,9 +90,8 @@ import { Listbox } from '../Listbox/Listbox';
91
90
  const onTriggerBlur = (ev)=>{
92
91
  // handle selection and updating value if freeform is false
93
92
  if (!baseState.open && !freeform) {
94
- var _activeOption;
95
93
  // select matching option, if the value fully matches
96
- if (value && activeOption && value.trim().toLowerCase() === ((_activeOption = activeOption) === null || _activeOption === void 0 ? void 0 : _activeOption.text.toLowerCase())) {
94
+ if (value && activeOption && value.trim().toLowerCase() === (activeOption === null || activeOption === void 0 ? void 0 : activeOption.text.toLowerCase())) {
97
95
  baseState.selectOption(ev, activeOption);
98
96
  }
99
97
  // reset typed value when the input loses focus while collapsed, unless freeform is true
@@ -160,7 +158,7 @@ import { Listbox } from '../Listbox/Listbox';
160
158
  },
161
159
  root: slot.always(props.root, {
162
160
  defaultProps: {
163
- 'aria-owns': !inlinePopup ? (_listboxSlot = listboxSlot) === null || _listboxSlot === void 0 ? void 0 : _listboxSlot.id : undefined,
161
+ 'aria-owns': !inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,
164
162
  ...rootNativeProps
165
163
  },
166
164
  elementType: 'div'
@@ -181,8 +179,6 @@ import { Listbox } from '../Listbox/Listbox';
181
179
  state.root.ref = useMergedRefs(state.root.ref, rootRef);
182
180
  /* Set input.onKeyDown here, so we can override the default behavior for spacebar */ const defaultOnTriggerKeyDown = state.input.onKeyDown;
183
181
  state.input.onKeyDown = useEventCallback((ev)=>{
184
- var // if we're not allowing space to type, continue with default behavior
185
- _defaultOnTriggerKeyDown;
186
182
  if (!open && getDropdownActionFromKey(ev) === 'Type') {
187
183
  baseState.setOpen(ev, true);
188
184
  }
@@ -204,11 +200,11 @@ import { Listbox } from '../Listbox/Listbox';
204
200
  }
205
201
  // allow space to insert a character if freeform & the last action was typing, or if the popup is closed
206
202
  if (freeform && (isTyping.current || !open) && ev.key === ' ') {
207
- var _resolvedPropsOnKeyDown;
208
- (_resolvedPropsOnKeyDown = resolvedPropsOnKeyDown) === null || _resolvedPropsOnKeyDown === void 0 ? void 0 : _resolvedPropsOnKeyDown(ev);
203
+ resolvedPropsOnKeyDown === null || resolvedPropsOnKeyDown === void 0 ? void 0 : resolvedPropsOnKeyDown(ev);
209
204
  return;
210
205
  }
211
- (_defaultOnTriggerKeyDown = defaultOnTriggerKeyDown) === null || _defaultOnTriggerKeyDown === void 0 ? void 0 : _defaultOnTriggerKeyDown(ev);
206
+ // if we're not allowing space to type, continue with default behavior
207
+ defaultOnTriggerKeyDown === null || defaultOnTriggerKeyDown === void 0 ? void 0 : defaultOnTriggerKeyDown(ev);
212
208
  });
213
209
  /* handle open/close + focus change when clicking expandIcon */ const { onMouseDown: onIconMouseDown, onClick: onIconClick } = state.expandIcon || {};
214
210
  const onExpandIconMouseDown = useEventCallback(mergeCallbacks(onIconMouseDown, ()=>{
@@ -1 +1 @@
1
- {"version":3,"sources":["useCombobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ArrowLeft, ArrowRight } from '@fluentui/keyboard-keys';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useEventCallback,\n useId,\n useMergedRefs,\n slot,\n} from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPopup } from '../../utils/useComboboxPopup';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { Slot } from '@fluentui/react-utilities';\nimport type { SelectionEvents } from '../../utils/Selection.types';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport type { ComboboxProps, ComboboxState } from './Combobox.types';\n\n/**\n * Create the state required to render Combobox.\n *\n * The returned state can be modified with hooks such as useComboboxStyles_unstable,\n * before being passed to renderCombobox_unstable.\n *\n * @param props - props from this instance of Combobox\n * @param ref - reference to root HTMLElement of Combobox\n */\nexport const useCombobox_unstable = (props: ComboboxProps, ref: React.Ref<HTMLInputElement>): ComboboxState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true, supportsSize: true });\n\n const baseState = useComboboxBaseState({ ...props, editable: true });\n const {\n activeOption,\n clearSelection,\n getIndexOfId,\n getOptionsMatchingText,\n hasFocus,\n open,\n selectOption,\n selectedOptions,\n setActiveOption,\n setFocusVisible,\n setOpen,\n setValue,\n value,\n } = baseState;\n const { disabled, freeform, inlinePopup, multiselect } = props;\n const comboId = useId('combobox-');\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['children', 'size'],\n });\n\n const rootRef = React.useRef<HTMLDivElement>(null);\n const triggerRef = React.useRef<HTMLInputElement>(null);\n\n // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n\n // save the typing vs. navigating options state, as the space key should behave differently in each case\n // we do not want to update the combobox when this changes, just save the value between renders\n const isTyping = React.useRef(false);\n\n // calculate listbox width style based on trigger width\n const [popupDimensions, setPopupDimensions] = React.useState<{ width: string }>();\n React.useEffect(() => {\n // only recalculate width when opening\n if (open) {\n const width = `${rootRef.current?.clientWidth}px`;\n if (width !== popupDimensions?.width) {\n setPopupDimensions({ width });\n }\n }\n }, [open, popupDimensions]);\n\n // set active option and selection based on typing\n const getOptionFromInput = (inputValue: string): OptionValue | undefined => {\n const searchString = inputValue?.trim().toLowerCase();\n\n if (!searchString || searchString.length === 0) {\n return;\n }\n\n const matcher = (optionText: string) => optionText.toLowerCase().indexOf(searchString) === 0;\n const matches = getOptionsMatchingText(matcher);\n\n // return first matching option after the current active option, looping back to the top\n if (matches.length > 1 && activeOption) {\n const startIndex = getIndexOfId(activeOption.id);\n const nextMatch = matches.find(option => getIndexOfId(option.id) >= startIndex);\n return nextMatch ?? matches[0];\n }\n\n return matches[0] ?? undefined;\n };\n\n /* Handle typed input */\n\n // reset any typed value when an option is selected\n baseState.selectOption = (ev: SelectionEvents, option: OptionValue) => {\n setValue(undefined);\n selectOption(ev, option);\n };\n\n const onTriggerBlur = (ev: React.FocusEvent<HTMLInputElement>) => {\n // handle selection and updating value if freeform is false\n if (!baseState.open && !freeform) {\n // select matching option, if the value fully matches\n if (value && activeOption && value.trim().toLowerCase() === activeOption?.text.toLowerCase()) {\n baseState.selectOption(ev, activeOption);\n }\n\n // reset typed value when the input loses focus while collapsed, unless freeform is true\n setValue(undefined);\n }\n };\n\n baseState.setOpen = (ev, newState: boolean) => {\n if (disabled) {\n return;\n }\n\n if (!newState && !freeform) {\n setValue(undefined);\n }\n\n setOpen(ev, newState);\n };\n\n // update value and active option based on input\n const onTriggerChange = (ev: React.ChangeEvent<HTMLInputElement>) => {\n const inputValue = ev.target.value;\n // update uncontrolled value\n baseState.setValue(inputValue);\n\n // handle updating active option based on input\n const matchingOption = getOptionFromInput(inputValue);\n setActiveOption(matchingOption);\n\n setFocusVisible(true);\n\n // clear selection for single-select if the input value no longer matches the selection\n if (!multiselect && selectedOptions.length === 1 && (inputValue.length < 1 || !matchingOption)) {\n clearSelection(ev);\n }\n };\n\n // resolve input and listbox slot props\n let triggerSlot: Slot<'input'>;\n let listboxSlot: Slot<typeof Listbox> | undefined;\n\n triggerSlot = slot.always(props.input, {\n defaultProps: {\n ref: useMergedRefs(props.input?.ref, triggerRef),\n type: 'text',\n value: value ?? '',\n ...triggerNativeProps,\n },\n elementType: 'input',\n });\n const resolvedPropsOnKeyDown = triggerSlot.onKeyDown;\n triggerSlot.onChange = mergeCallbacks(triggerSlot.onChange, onTriggerChange);\n triggerSlot.onBlur = mergeCallbacks(triggerSlot.onBlur, onTriggerBlur); // only resolve listbox slot if needed\n listboxSlot =\n open || hasFocus\n ? slot.optional(props.listbox, {\n renderByDefault: true,\n defaultProps: { children: props.children, style: popupDimensions },\n elementType: Listbox,\n })\n : undefined;\n [triggerSlot, listboxSlot] = useComboboxPopup(props, triggerSlot, listboxSlot);\n [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n if (hideActiveDescendant) {\n triggerSlot['aria-activedescendant'] = undefined;\n }\n const state: ComboboxState = {\n components: { root: 'div', input: 'input', expandIcon: 'span', listbox: Listbox },\n root: slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !inlinePopup ? listboxSlot?.id : undefined,\n ...rootNativeProps,\n },\n elementType: 'div',\n }),\n input: triggerSlot,\n listbox: listboxSlot,\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n 'aria-expanded': open,\n children: <ChevronDownIcon />,\n role: 'button',\n },\n elementType: 'span',\n }),\n ...baseState,\n };\n\n state.root.ref = useMergedRefs(state.root.ref, rootRef);\n\n /* Set input.onKeyDown here, so we can override the default behavior for spacebar */\n const defaultOnTriggerKeyDown = state.input.onKeyDown;\n state.input.onKeyDown = useEventCallback((ev: React.KeyboardEvent<HTMLInputElement>) => {\n if (!open && getDropdownActionFromKey(ev) === 'Type') {\n baseState.setOpen(ev, true);\n }\n\n // clear activedescendant when moving the text insertion cursor\n if (ev.key === ArrowLeft || ev.key === ArrowRight) {\n setHideActiveDescendant(true);\n } else {\n setHideActiveDescendant(false);\n }\n\n // update typing state to true if the user is typing\n const action = getDropdownActionFromKey(ev, { open, multiselect });\n if (action === 'Type') {\n isTyping.current = true;\n }\n // otherwise, update the typing state to false if opening or navigating dropdown options\n // other actions, like closing the dropdown, should not impact typing state.\n else if (\n (action === 'Open' && ev.key !== ' ') ||\n action === 'Next' ||\n action === 'Previous' ||\n action === 'First' ||\n action === 'Last' ||\n action === 'PageUp' ||\n action === 'PageDown'\n ) {\n isTyping.current = false;\n }\n\n // allow space to insert a character if freeform & the last action was typing, or if the popup is closed\n if (freeform && (isTyping.current || !open) && ev.key === ' ') {\n resolvedPropsOnKeyDown?.(ev);\n return;\n }\n\n // if we're not allowing space to type, continue with default behavior\n defaultOnTriggerKeyDown?.(ev);\n });\n\n /* handle open/close + focus change when clicking expandIcon */\n const { onMouseDown: onIconMouseDown, onClick: onIconClick } = state.expandIcon || {};\n const onExpandIconMouseDown = useEventCallback(\n mergeCallbacks(onIconMouseDown, () => {\n // do not dismiss on blur when closing via clicking the icon\n if (open) {\n baseState.ignoreNextBlur.current = true;\n }\n }),\n );\n\n const onExpandIconClick = useEventCallback(\n mergeCallbacks(onIconClick, (event: React.MouseEvent<HTMLSpanElement>) => {\n // open and set focus\n state.setOpen(event, !state.open);\n triggerRef.current?.focus();\n\n // set focus visible=false, since this can only be done with the mouse/pointer\n setFocusVisible(false);\n }),\n );\n\n if (state.expandIcon) {\n state.expandIcon.onMouseDown = onExpandIconMouseDown;\n state.expandIcon.onClick = onExpandIconClick;\n\n // If there is no explicit aria-label, calculate default accName attribute for expandIcon button,\n // using the following steps:\n // 1. If there is an aria-label, it is \"Open [aria-label]\"\n // 2. If there is an aria-labelledby, it is \"Open [aria-labelledby target]\" (using aria-labelledby + ids)\n // 3. If there is no aria-label/ledby attr, it falls back to \"Open\"\n // We can't fall back to a label/htmlFor name because of https://github.com/w3c/accname/issues/179\n const hasExpandLabel = state.expandIcon['aria-label'] || state.expandIcon['aria-labelledby'];\n const defaultOpenString = 'Open'; // this is english-only since it is the fallback\n if (!hasExpandLabel) {\n if (props['aria-labelledby']) {\n const chevronId = state.expandIcon.id ?? `${comboId}-chevron`;\n const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\n\n state.expandIcon['aria-label'] = defaultOpenString;\n state.expandIcon.id = chevronId;\n state.expandIcon['aria-labelledby'] = chevronLabelledBy;\n } else if (props['aria-label']) {\n state.expandIcon['aria-label'] = `${defaultOpenString} ${props['aria-label']}`;\n } else {\n state.expandIcon['aria-label'] = defaultOpenString;\n }\n }\n }\n\n return state;\n};\n"],"names":["React","useFieldControlProps_unstable","ArrowLeft","ArrowRight","ChevronDownRegular","ChevronDownIcon","getPartitionedNativeProps","mergeCallbacks","useEventCallback","useId","useMergedRefs","slot","getDropdownActionFromKey","useComboboxBaseState","useComboboxPopup","useTriggerListboxSlots","Listbox","useCombobox_unstable","props","ref","listboxSlot","supportsLabelFor","supportsRequired","supportsSize","baseState","editable","activeOption","clearSelection","getIndexOfId","getOptionsMatchingText","hasFocus","open","selectOption","selectedOptions","setActiveOption","setFocusVisible","setOpen","setValue","value","disabled","freeform","inlinePopup","multiselect","comboId","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","rootRef","useRef","triggerRef","hideActiveDescendant","setHideActiveDescendant","useState","isTyping","popupDimensions","setPopupDimensions","useEffect","width","current","clientWidth","getOptionFromInput","inputValue","searchString","trim","toLowerCase","length","matcher","optionText","indexOf","matches","startIndex","id","nextMatch","find","option","undefined","ev","onTriggerBlur","text","newState","onTriggerChange","target","matchingOption","triggerSlot","always","input","defaultProps","type","elementType","resolvedPropsOnKeyDown","onKeyDown","onChange","onBlur","optional","listbox","renderByDefault","children","style","state","components","expandIcon","role","defaultOnTriggerKeyDown","key","action","onMouseDown","onIconMouseDown","onClick","onIconClick","onExpandIconMouseDown","ignoreNextBlur","onExpandIconClick","event","focus","hasExpandLabel","defaultOpenString","chevronId","chevronLabelledBy"],"mappings":"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"}
1
+ {"version":3,"sources":["useCombobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ArrowLeft, ArrowRight } from '@fluentui/keyboard-keys';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useEventCallback,\n useId,\n useMergedRefs,\n slot,\n} from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPopup } from '../../utils/useComboboxPopup';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { Slot } from '@fluentui/react-utilities';\nimport type { SelectionEvents } from '../../utils/Selection.types';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport type { ComboboxProps, ComboboxState } from './Combobox.types';\n\n/**\n * Create the state required to render Combobox.\n *\n * The returned state can be modified with hooks such as useComboboxStyles_unstable,\n * before being passed to renderCombobox_unstable.\n *\n * @param props - props from this instance of Combobox\n * @param ref - reference to root HTMLElement of Combobox\n */\nexport const useCombobox_unstable = (props: ComboboxProps, ref: React.Ref<HTMLInputElement>): ComboboxState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true, supportsSize: true });\n\n const baseState = useComboboxBaseState({ ...props, editable: true });\n const {\n activeOption,\n clearSelection,\n getIndexOfId,\n getOptionsMatchingText,\n hasFocus,\n open,\n selectOption,\n selectedOptions,\n setActiveOption,\n setFocusVisible,\n setOpen,\n setValue,\n value,\n } = baseState;\n const { disabled, freeform, inlinePopup, multiselect } = props;\n const comboId = useId('combobox-');\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['children', 'size'],\n });\n\n const rootRef = React.useRef<HTMLDivElement>(null);\n const triggerRef = React.useRef<HTMLInputElement>(null);\n\n // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n\n // save the typing vs. navigating options state, as the space key should behave differently in each case\n // we do not want to update the combobox when this changes, just save the value between renders\n const isTyping = React.useRef(false);\n\n // calculate listbox width style based on trigger width\n const [popupDimensions, setPopupDimensions] = React.useState<{ width: string }>();\n React.useEffect(() => {\n // only recalculate width when opening\n if (open) {\n const width = `${rootRef.current?.clientWidth}px`;\n if (width !== popupDimensions?.width) {\n setPopupDimensions({ width });\n }\n }\n }, [open, popupDimensions]);\n\n // set active option and selection based on typing\n const getOptionFromInput = (inputValue: string): OptionValue | undefined => {\n const searchString = inputValue?.trim().toLowerCase();\n\n if (!searchString || searchString.length === 0) {\n return;\n }\n\n const matcher = (optionText: string) => optionText.toLowerCase().indexOf(searchString) === 0;\n const matches = getOptionsMatchingText(matcher);\n\n // return first matching option after the current active option, looping back to the top\n if (matches.length > 1 && activeOption) {\n const startIndex = getIndexOfId(activeOption.id);\n const nextMatch = matches.find(option => getIndexOfId(option.id) >= startIndex);\n return nextMatch ?? matches[0];\n }\n\n return matches[0] ?? undefined;\n };\n\n /* Handle typed input */\n\n // reset any typed value when an option is selected\n baseState.selectOption = (ev: SelectionEvents, option: OptionValue) => {\n setValue(undefined);\n selectOption(ev, option);\n };\n\n const onTriggerBlur = (ev: React.FocusEvent<HTMLInputElement>) => {\n // handle selection and updating value if freeform is false\n if (!baseState.open && !freeform) {\n // select matching option, if the value fully matches\n if (value && activeOption && value.trim().toLowerCase() === activeOption?.text.toLowerCase()) {\n baseState.selectOption(ev, activeOption);\n }\n\n // reset typed value when the input loses focus while collapsed, unless freeform is true\n setValue(undefined);\n }\n };\n\n baseState.setOpen = (ev, newState: boolean) => {\n if (disabled) {\n return;\n }\n\n if (!newState && !freeform) {\n setValue(undefined);\n }\n\n setOpen(ev, newState);\n };\n\n // update value and active option based on input\n const onTriggerChange = (ev: React.ChangeEvent<HTMLInputElement>) => {\n const inputValue = ev.target.value;\n // update uncontrolled value\n baseState.setValue(inputValue);\n\n // handle updating active option based on input\n const matchingOption = getOptionFromInput(inputValue);\n setActiveOption(matchingOption);\n\n setFocusVisible(true);\n\n // clear selection for single-select if the input value no longer matches the selection\n if (!multiselect && selectedOptions.length === 1 && (inputValue.length < 1 || !matchingOption)) {\n clearSelection(ev);\n }\n };\n\n // resolve input and listbox slot props\n let triggerSlot: Slot<'input'>;\n let listboxSlot: Slot<typeof Listbox> | undefined;\n\n triggerSlot = slot.always(props.input, {\n defaultProps: {\n ref: useMergedRefs(props.input?.ref, triggerRef),\n type: 'text',\n value: value ?? '',\n ...triggerNativeProps,\n },\n elementType: 'input',\n });\n const resolvedPropsOnKeyDown = triggerSlot.onKeyDown;\n triggerSlot.onChange = mergeCallbacks(triggerSlot.onChange, onTriggerChange);\n triggerSlot.onBlur = mergeCallbacks(triggerSlot.onBlur, onTriggerBlur); // only resolve listbox slot if needed\n listboxSlot =\n open || hasFocus\n ? slot.optional(props.listbox, {\n renderByDefault: true,\n defaultProps: { children: props.children, style: popupDimensions },\n elementType: Listbox,\n })\n : undefined;\n [triggerSlot, listboxSlot] = useComboboxPopup(props, triggerSlot, listboxSlot);\n [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n if (hideActiveDescendant) {\n triggerSlot['aria-activedescendant'] = undefined;\n }\n const state: ComboboxState = {\n components: { root: 'div', input: 'input', expandIcon: 'span', listbox: Listbox },\n root: slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !inlinePopup ? listboxSlot?.id : undefined,\n ...rootNativeProps,\n },\n elementType: 'div',\n }),\n input: triggerSlot,\n listbox: listboxSlot,\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n 'aria-expanded': open,\n children: <ChevronDownIcon />,\n role: 'button',\n },\n elementType: 'span',\n }),\n ...baseState,\n };\n\n state.root.ref = useMergedRefs(state.root.ref, rootRef);\n\n /* Set input.onKeyDown here, so we can override the default behavior for spacebar */\n const defaultOnTriggerKeyDown = state.input.onKeyDown;\n state.input.onKeyDown = useEventCallback((ev: React.KeyboardEvent<HTMLInputElement>) => {\n if (!open && getDropdownActionFromKey(ev) === 'Type') {\n baseState.setOpen(ev, true);\n }\n\n // clear activedescendant when moving the text insertion cursor\n if (ev.key === ArrowLeft || ev.key === ArrowRight) {\n setHideActiveDescendant(true);\n } else {\n setHideActiveDescendant(false);\n }\n\n // update typing state to true if the user is typing\n const action = getDropdownActionFromKey(ev, { open, multiselect });\n if (action === 'Type') {\n isTyping.current = true;\n }\n // otherwise, update the typing state to false if opening or navigating dropdown options\n // other actions, like closing the dropdown, should not impact typing state.\n else if (\n (action === 'Open' && ev.key !== ' ') ||\n action === 'Next' ||\n action === 'Previous' ||\n action === 'First' ||\n action === 'Last' ||\n action === 'PageUp' ||\n action === 'PageDown'\n ) {\n isTyping.current = false;\n }\n\n // allow space to insert a character if freeform & the last action was typing, or if the popup is closed\n if (freeform && (isTyping.current || !open) && ev.key === ' ') {\n resolvedPropsOnKeyDown?.(ev);\n return;\n }\n\n // if we're not allowing space to type, continue with default behavior\n defaultOnTriggerKeyDown?.(ev);\n });\n\n /* handle open/close + focus change when clicking expandIcon */\n const { onMouseDown: onIconMouseDown, onClick: onIconClick } = state.expandIcon || {};\n const onExpandIconMouseDown = useEventCallback(\n mergeCallbacks(onIconMouseDown, () => {\n // do not dismiss on blur when closing via clicking the icon\n if (open) {\n baseState.ignoreNextBlur.current = true;\n }\n }),\n );\n\n const onExpandIconClick = useEventCallback(\n mergeCallbacks(onIconClick, (event: React.MouseEvent<HTMLSpanElement>) => {\n // open and set focus\n state.setOpen(event, !state.open);\n triggerRef.current?.focus();\n\n // set focus visible=false, since this can only be done with the mouse/pointer\n setFocusVisible(false);\n }),\n );\n\n if (state.expandIcon) {\n state.expandIcon.onMouseDown = onExpandIconMouseDown;\n state.expandIcon.onClick = onExpandIconClick;\n\n // If there is no explicit aria-label, calculate default accName attribute for expandIcon button,\n // using the following steps:\n // 1. If there is an aria-label, it is \"Open [aria-label]\"\n // 2. If there is an aria-labelledby, it is \"Open [aria-labelledby target]\" (using aria-labelledby + ids)\n // 3. If there is no aria-label/ledby attr, it falls back to \"Open\"\n // We can't fall back to a label/htmlFor name because of https://github.com/w3c/accname/issues/179\n const hasExpandLabel = state.expandIcon['aria-label'] || state.expandIcon['aria-labelledby'];\n const defaultOpenString = 'Open'; // this is english-only since it is the fallback\n if (!hasExpandLabel) {\n if (props['aria-labelledby']) {\n const chevronId = state.expandIcon.id ?? `${comboId}-chevron`;\n const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\n\n state.expandIcon['aria-label'] = defaultOpenString;\n state.expandIcon.id = chevronId;\n state.expandIcon['aria-labelledby'] = chevronLabelledBy;\n } else if (props['aria-label']) {\n state.expandIcon['aria-label'] = `${defaultOpenString} ${props['aria-label']}`;\n } else {\n state.expandIcon['aria-label'] = defaultOpenString;\n }\n }\n }\n\n return state;\n};\n"],"names":["React","useFieldControlProps_unstable","ArrowLeft","ArrowRight","ChevronDownRegular","ChevronDownIcon","getPartitionedNativeProps","mergeCallbacks","useEventCallback","useId","useMergedRefs","slot","getDropdownActionFromKey","useComboboxBaseState","useComboboxPopup","useTriggerListboxSlots","Listbox","useCombobox_unstable","props","ref","supportsLabelFor","supportsRequired","supportsSize","baseState","editable","activeOption","clearSelection","getIndexOfId","getOptionsMatchingText","hasFocus","open","selectOption","selectedOptions","setActiveOption","setFocusVisible","setOpen","setValue","value","disabled","freeform","inlinePopup","multiselect","comboId","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","rootRef","useRef","triggerRef","hideActiveDescendant","setHideActiveDescendant","useState","isTyping","popupDimensions","setPopupDimensions","useEffect","width","current","clientWidth","getOptionFromInput","inputValue","searchString","trim","toLowerCase","length","matcher","optionText","indexOf","matches","startIndex","id","nextMatch","find","option","undefined","ev","onTriggerBlur","text","newState","onTriggerChange","target","matchingOption","triggerSlot","listboxSlot","always","input","defaultProps","type","elementType","resolvedPropsOnKeyDown","onKeyDown","onChange","onBlur","optional","listbox","renderByDefault","children","style","state","components","expandIcon","role","defaultOnTriggerKeyDown","key","action","onMouseDown","onIconMouseDown","onClick","onIconClick","onExpandIconMouseDown","ignoreNextBlur","onExpandIconClick","event","focus","hasExpandLabel","defaultOpenString","chevronId","chevronLabelledBy"],"mappings":"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"}
@@ -16,7 +16,6 @@ import { Listbox } from '../Listbox/Listbox';
16
16
  * @param props - props from this instance of Dropdown
17
17
  * @param ref - reference to root HTMLElement of Dropdown
18
18
  */ export const useDropdown_unstable = (props, ref)=>{
19
- var _listboxSlot;
20
19
  // Merge props from surrounding <Field>, if any
21
20
  props = useFieldControlProps_unstable(props, {
22
21
  supportsLabelFor: true,
@@ -125,7 +124,7 @@ import { Listbox } from '../Listbox/Listbox';
125
124
  },
126
125
  root: slot.always(props.root, {
127
126
  defaultProps: {
128
- 'aria-owns': !props.inlinePopup ? (_listboxSlot = listboxSlot) === null || _listboxSlot === void 0 ? void 0 : _listboxSlot.id : undefined,
127
+ 'aria-owns': !props.inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,
129
128
  children: props.children,
130
129
  ...rootNativeProps
131
130
  },
@@ -1 +1 @@
1
- {"version":3,"sources":["useDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useMergedRefs, useTimeout, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPopup } from '../../utils/useComboboxPopup';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { Slot } from '@fluentui/react-utilities';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport type { DropdownProps, DropdownState } from './Dropdown.types';\n\n/**\n * Create the state required to render Dropdown.\n *\n * The returned state can be modified with hooks such as useDropdownStyles_unstable,\n * before being passed to renderDropdown_unstable.\n *\n * @param props - props from this instance of Dropdown\n * @param ref - reference to root HTMLElement of Dropdown\n */\nexport const useDropdown_unstable = (props: DropdownProps, ref: React.Ref<HTMLButtonElement>): DropdownState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsSize: true });\n\n const baseState = useComboboxBaseState(props);\n const { activeOption, getIndexOfId, getOptionsMatchingText, open, setActiveOption, setFocusVisible, setOpen } =\n baseState;\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'button',\n excludedPropNames: ['children'],\n });\n\n // set listbox popup width based off the root/trigger width\n const rootRef = React.useRef<HTMLDivElement>(null);\n const [popupWidth, setPopupWidth] = React.useState<string>();\n React.useEffect(() => {\n const width = open ? `${rootRef.current?.clientWidth}px` : undefined;\n setPopupWidth(width);\n }, [open]);\n\n // jump to matching option based on typing\n const searchString = React.useRef('');\n const [setKeyTimeout, clearKeyTimeout] = useTimeout();\n\n const getNextMatchingOption = (): OptionValue | undefined => {\n // first check for matches for the full searchString\n let matcher = (optionText: string) => optionText.toLowerCase().indexOf(searchString.current) === 0;\n let matches = getOptionsMatchingText(matcher);\n let startIndex = activeOption ? getIndexOfId(activeOption.id) : 0;\n\n // if the dropdown is already open and the searchstring is a single character,\n // then look after the current activeOption for letters\n // this is so slowly typing the same letter will cycle through matches\n if (open && searchString.current.length === 1) {\n startIndex++;\n }\n\n // if there are no direct matches, check if the search is all the same letter, e.g. \"aaa\"\n if (!matches.length) {\n const letters = searchString.current.split('');\n const allSameLetter = letters.length && letters.every(letter => letter === letters[0]);\n\n // if the search is all the same letter, cycle through options starting with that letter\n if (allSameLetter) {\n startIndex++;\n matcher = (optionText: string) => optionText.toLowerCase().indexOf(letters[0]) === 0;\n matches = getOptionsMatchingText(matcher);\n }\n }\n\n // if there is an active option and multiple matches,\n // return first matching option after the current active option, looping back to the top\n if (matches.length > 1 && activeOption) {\n const nextMatch = matches.find(option => getIndexOfId(option.id) >= startIndex);\n return nextMatch ?? matches[0];\n }\n\n return matches[0] ?? undefined;\n };\n\n const onTriggerKeyDown = (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n // clear timeout, if it exists\n clearKeyTimeout();\n\n // if the key was a char key, update search string\n if (getDropdownActionFromKey(ev) === 'Type') {\n // update search string\n searchString.current += ev.key.toLowerCase();\n setKeyTimeout(() => {\n searchString.current = '';\n }, 500);\n\n // update state\n !open && setOpen(ev, true);\n\n const nextOption = getNextMatchingOption();\n setActiveOption(nextOption);\n setFocusVisible(true);\n }\n };\n\n // resolve button and listbox slot props\n let triggerSlot: Slot<'button'>;\n let listboxSlot: Slot<typeof Listbox> | undefined;\n\n triggerSlot = slot.always(props.button, {\n defaultProps: {\n type: 'button',\n children: baseState.value || props.placeholder,\n ...triggerNativeProps,\n },\n elementType: 'button',\n });\n triggerSlot.onKeyDown = mergeCallbacks(onTriggerKeyDown, triggerSlot.onKeyDown);\n listboxSlot =\n baseState.open || baseState.hasFocus\n ? slot.optional(props.listbox, {\n renderByDefault: true,\n defaultProps: { children: props.children, style: { width: popupWidth } },\n elementType: Listbox,\n })\n : undefined;\n [triggerSlot, listboxSlot] = useComboboxPopup(props, triggerSlot, listboxSlot);\n [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n const state: DropdownState = {\n components: { root: 'div', button: 'button', expandIcon: 'span', listbox: Listbox },\n root: slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !props.inlinePopup ? listboxSlot?.id : undefined,\n children: props.children,\n ...rootNativeProps,\n },\n elementType: 'div',\n }),\n button: triggerSlot,\n listbox: listboxSlot,\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n children: <ChevronDownIcon />,\n },\n elementType: 'span',\n }),\n placeholderVisible: !baseState.value && !!props.placeholder,\n ...baseState,\n };\n\n state.root.ref = useMergedRefs(state.root.ref, rootRef);\n\n return state;\n};\n"],"names":["React","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","useTimeout","slot","getDropdownActionFromKey","useComboboxBaseState","useComboboxPopup","useTriggerListboxSlots","Listbox","useDropdown_unstable","props","ref","listboxSlot","supportsLabelFor","supportsSize","baseState","activeOption","getIndexOfId","getOptionsMatchingText","open","setActiveOption","setFocusVisible","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","rootRef","useRef","popupWidth","setPopupWidth","useState","useEffect","width","current","clientWidth","undefined","searchString","setKeyTimeout","clearKeyTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","onTriggerKeyDown","ev","key","nextOption","triggerSlot","always","button","defaultProps","type","children","value","placeholder","elementType","onKeyDown","hasFocus","optional","listbox","renderByDefault","style","state","components","expandIcon","inlinePopup","placeholderVisible"],"mappings":"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"}
1
+ {"version":3,"sources":["useDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useMergedRefs, useTimeout, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPopup } from '../../utils/useComboboxPopup';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { Slot } from '@fluentui/react-utilities';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport type { DropdownProps, DropdownState } from './Dropdown.types';\n\n/**\n * Create the state required to render Dropdown.\n *\n * The returned state can be modified with hooks such as useDropdownStyles_unstable,\n * before being passed to renderDropdown_unstable.\n *\n * @param props - props from this instance of Dropdown\n * @param ref - reference to root HTMLElement of Dropdown\n */\nexport const useDropdown_unstable = (props: DropdownProps, ref: React.Ref<HTMLButtonElement>): DropdownState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsSize: true });\n\n const baseState = useComboboxBaseState(props);\n const { activeOption, getIndexOfId, getOptionsMatchingText, open, setActiveOption, setFocusVisible, setOpen } =\n baseState;\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'button',\n excludedPropNames: ['children'],\n });\n\n // set listbox popup width based off the root/trigger width\n const rootRef = React.useRef<HTMLDivElement>(null);\n const [popupWidth, setPopupWidth] = React.useState<string>();\n React.useEffect(() => {\n const width = open ? `${rootRef.current?.clientWidth}px` : undefined;\n setPopupWidth(width);\n }, [open]);\n\n // jump to matching option based on typing\n const searchString = React.useRef('');\n const [setKeyTimeout, clearKeyTimeout] = useTimeout();\n\n const getNextMatchingOption = (): OptionValue | undefined => {\n // first check for matches for the full searchString\n let matcher = (optionText: string) => optionText.toLowerCase().indexOf(searchString.current) === 0;\n let matches = getOptionsMatchingText(matcher);\n let startIndex = activeOption ? getIndexOfId(activeOption.id) : 0;\n\n // if the dropdown is already open and the searchstring is a single character,\n // then look after the current activeOption for letters\n // this is so slowly typing the same letter will cycle through matches\n if (open && searchString.current.length === 1) {\n startIndex++;\n }\n\n // if there are no direct matches, check if the search is all the same letter, e.g. \"aaa\"\n if (!matches.length) {\n const letters = searchString.current.split('');\n const allSameLetter = letters.length && letters.every(letter => letter === letters[0]);\n\n // if the search is all the same letter, cycle through options starting with that letter\n if (allSameLetter) {\n startIndex++;\n matcher = (optionText: string) => optionText.toLowerCase().indexOf(letters[0]) === 0;\n matches = getOptionsMatchingText(matcher);\n }\n }\n\n // if there is an active option and multiple matches,\n // return first matching option after the current active option, looping back to the top\n if (matches.length > 1 && activeOption) {\n const nextMatch = matches.find(option => getIndexOfId(option.id) >= startIndex);\n return nextMatch ?? matches[0];\n }\n\n return matches[0] ?? undefined;\n };\n\n const onTriggerKeyDown = (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n // clear timeout, if it exists\n clearKeyTimeout();\n\n // if the key was a char key, update search string\n if (getDropdownActionFromKey(ev) === 'Type') {\n // update search string\n searchString.current += ev.key.toLowerCase();\n setKeyTimeout(() => {\n searchString.current = '';\n }, 500);\n\n // update state\n !open && setOpen(ev, true);\n\n const nextOption = getNextMatchingOption();\n setActiveOption(nextOption);\n setFocusVisible(true);\n }\n };\n\n // resolve button and listbox slot props\n let triggerSlot: Slot<'button'>;\n let listboxSlot: Slot<typeof Listbox> | undefined;\n\n triggerSlot = slot.always(props.button, {\n defaultProps: {\n type: 'button',\n children: baseState.value || props.placeholder,\n ...triggerNativeProps,\n },\n elementType: 'button',\n });\n triggerSlot.onKeyDown = mergeCallbacks(onTriggerKeyDown, triggerSlot.onKeyDown);\n listboxSlot =\n baseState.open || baseState.hasFocus\n ? slot.optional(props.listbox, {\n renderByDefault: true,\n defaultProps: { children: props.children, style: { width: popupWidth } },\n elementType: Listbox,\n })\n : undefined;\n [triggerSlot, listboxSlot] = useComboboxPopup(props, triggerSlot, listboxSlot);\n [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n const state: DropdownState = {\n components: { root: 'div', button: 'button', expandIcon: 'span', listbox: Listbox },\n root: slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !props.inlinePopup ? listboxSlot?.id : undefined,\n children: props.children,\n ...rootNativeProps,\n },\n elementType: 'div',\n }),\n button: triggerSlot,\n listbox: listboxSlot,\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n children: <ChevronDownIcon />,\n },\n elementType: 'span',\n }),\n placeholderVisible: !baseState.value && !!props.placeholder,\n ...baseState,\n };\n\n state.root.ref = useMergedRefs(state.root.ref, rootRef);\n\n return state;\n};\n"],"names":["React","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","useTimeout","slot","getDropdownActionFromKey","useComboboxBaseState","useComboboxPopup","useTriggerListboxSlots","Listbox","useDropdown_unstable","props","ref","supportsLabelFor","supportsSize","baseState","activeOption","getIndexOfId","getOptionsMatchingText","open","setActiveOption","setFocusVisible","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","rootRef","useRef","popupWidth","setPopupWidth","useState","useEffect","width","current","clientWidth","undefined","searchString","setKeyTimeout","clearKeyTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","onTriggerKeyDown","ev","key","nextOption","triggerSlot","listboxSlot","always","button","defaultProps","type","children","value","placeholder","elementType","onKeyDown","hasFocus","optional","listbox","renderByDefault","style","state","components","expandIcon","inlinePopup","placeholderVisible"],"mappings":"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"}
@@ -15,7 +15,6 @@ import { ComboboxContext } from '../../contexts/ComboboxContext';
15
15
  * @param props - props from this instance of Listbox
16
16
  * @param ref - reference to root HTMLElement of Listbox
17
17
  */ export const useListbox_unstable = (props, ref)=>{
18
- var _activeOption;
19
18
  const { multiselect } = props;
20
19
  const optionCollection = useOptionCollection();
21
20
  const { getCount, getOptionAtIndex, getIndexOfId } = optionCollection;
@@ -77,7 +76,7 @@ import { ComboboxContext } from '../../contexts/ComboboxContext';
77
76
  root: slot.always(getNativeElementProps('div', {
78
77
  ref,
79
78
  role: multiselect ? 'menu' : 'listbox',
80
- 'aria-activedescendant': hasComboboxContext ? undefined : (_activeOption = activeOption) === null || _activeOption === void 0 ? void 0 : _activeOption.id,
79
+ 'aria-activedescendant': hasComboboxContext ? undefined : activeOption === null || activeOption === void 0 ? void 0 : activeOption.id,
81
80
  'aria-multiselectable': multiselect,
82
81
  tabIndex: 0,
83
82
  ...props
@@ -1 +1 @@
1
- {"version":3,"sources":["useListbox.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n getNativeElementProps,\n mergeCallbacks,\n useEventCallback,\n useMergedRefs,\n slot,\n} from '@fluentui/react-utilities';\nimport { useContextSelector, useHasParentContext } from '@fluentui/react-context-selector';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../../utils/dropdownKeyActions';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport { useOptionCollection } from '../../utils/useOptionCollection';\nimport { useScrollOptionsIntoView } from '../../utils/useScrollOptionsIntoView';\nimport { useSelection } from '../../utils/useSelection';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\nimport type { ListboxProps, ListboxState } from './Listbox.types';\n\n/**\n * Create the state required to render Listbox.\n *\n * The returned state can be modified with hooks such as useListboxStyles_unstable,\n * before being passed to renderListbox_unstable.\n *\n * @param props - props from this instance of Listbox\n * @param ref - reference to root HTMLElement of Listbox\n */\nexport const useListbox_unstable = (props: ListboxProps, ref: React.Ref<HTMLElement>): ListboxState => {\n const { multiselect } = props;\n const optionCollection = useOptionCollection();\n const { getCount, getOptionAtIndex, getIndexOfId } = optionCollection;\n\n const { clearSelection, selectedOptions, selectOption } = useSelection(props);\n\n const [activeOption, setActiveOption] = React.useState<OptionValue | undefined>();\n\n // track whether keyboard focus outline should be shown\n // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move\n const [focusVisible, setFocusVisible] = React.useState(false);\n\n const onKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n const action = getDropdownActionFromKey(event, { open: true });\n const maxIndex = getCount() - 1;\n const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n let newIndex = activeIndex;\n\n switch (action) {\n case 'Select':\n case 'CloseSelect':\n activeOption && selectOption(event, activeOption);\n break;\n default:\n newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n }\n\n if (newIndex !== activeIndex) {\n // prevent default page scroll/keyboard action if the index changed\n event.preventDefault();\n setActiveOption(getOptionAtIndex(newIndex));\n setFocusVisible(true);\n }\n };\n\n const onMouseOver = (event: React.MouseEvent<HTMLElement>) => {\n setFocusVisible(false);\n };\n\n // get state from parent combobox, if it exists\n const hasComboboxContext = useHasParentContext(ComboboxContext);\n const comboboxActiveOption = useContextSelector(ComboboxContext, ctx => ctx.activeOption);\n const comboboxFocusVisible = useContextSelector(ComboboxContext, ctx => ctx.focusVisible);\n const comboboxSelectedOptions = useContextSelector(ComboboxContext, ctx => ctx.selectedOptions);\n const comboboxSelectOption = useContextSelector(ComboboxContext, ctx => ctx.selectOption);\n const comboboxSetActiveOption = useContextSelector(ComboboxContext, ctx => ctx.setActiveOption);\n\n // without a parent combobox context, provide values directly from Listbox\n const optionContextValues = hasComboboxContext\n ? {\n activeOption: comboboxActiveOption,\n focusVisible: comboboxFocusVisible,\n selectedOptions: comboboxSelectedOptions,\n selectOption: comboboxSelectOption,\n setActiveOption: comboboxSetActiveOption,\n }\n : {\n activeOption,\n focusVisible,\n selectedOptions,\n selectOption,\n setActiveOption,\n };\n\n const state: ListboxState = {\n components: {\n root: 'div',\n },\n root: slot.always(\n getNativeElementProps('div', {\n ref,\n role: multiselect ? 'menu' : 'listbox',\n 'aria-activedescendant': hasComboboxContext ? undefined : activeOption?.id,\n 'aria-multiselectable': multiselect,\n tabIndex: 0,\n ...props,\n }),\n { elementType: 'div' },\n ),\n multiselect,\n clearSelection,\n ...optionCollection,\n ...optionContextValues,\n };\n\n const scrollContainerRef = useScrollOptionsIntoView(state);\n state.root.ref = useMergedRefs(state.root.ref, scrollContainerRef);\n\n state.root.onKeyDown = useEventCallback(mergeCallbacks(state.root.onKeyDown, onKeyDown));\n state.root.onMouseOver = useEventCallback(mergeCallbacks(state.root.onMouseOver, onMouseOver));\n\n return state;\n};\n"],"names":["React","getNativeElementProps","mergeCallbacks","useEventCallback","useMergedRefs","slot","useContextSelector","useHasParentContext","getDropdownActionFromKey","getIndexFromAction","useOptionCollection","useScrollOptionsIntoView","useSelection","ComboboxContext","useListbox_unstable","props","ref","activeOption","multiselect","optionCollection","getCount","getOptionAtIndex","getIndexOfId","clearSelection","selectedOptions","selectOption","setActiveOption","useState","focusVisible","setFocusVisible","onKeyDown","event","action","open","maxIndex","activeIndex","id","newIndex","preventDefault","onMouseOver","hasComboboxContext","comboboxActiveOption","ctx","comboboxFocusVisible","comboboxSelectedOptions","comboboxSelectOption","comboboxSetActiveOption","optionContextValues","state","components","root","always","role","undefined","tabIndex","elementType","scrollContainerRef"],"mappings":"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"}
1
+ {"version":3,"sources":["useListbox.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n getNativeElementProps,\n mergeCallbacks,\n useEventCallback,\n useMergedRefs,\n slot,\n} from '@fluentui/react-utilities';\nimport { useContextSelector, useHasParentContext } from '@fluentui/react-context-selector';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../../utils/dropdownKeyActions';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport { useOptionCollection } from '../../utils/useOptionCollection';\nimport { useScrollOptionsIntoView } from '../../utils/useScrollOptionsIntoView';\nimport { useSelection } from '../../utils/useSelection';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\nimport type { ListboxProps, ListboxState } from './Listbox.types';\n\n/**\n * Create the state required to render Listbox.\n *\n * The returned state can be modified with hooks such as useListboxStyles_unstable,\n * before being passed to renderListbox_unstable.\n *\n * @param props - props from this instance of Listbox\n * @param ref - reference to root HTMLElement of Listbox\n */\nexport const useListbox_unstable = (props: ListboxProps, ref: React.Ref<HTMLElement>): ListboxState => {\n const { multiselect } = props;\n const optionCollection = useOptionCollection();\n const { getCount, getOptionAtIndex, getIndexOfId } = optionCollection;\n\n const { clearSelection, selectedOptions, selectOption } = useSelection(props);\n\n const [activeOption, setActiveOption] = React.useState<OptionValue | undefined>();\n\n // track whether keyboard focus outline should be shown\n // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move\n const [focusVisible, setFocusVisible] = React.useState(false);\n\n const onKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n const action = getDropdownActionFromKey(event, { open: true });\n const maxIndex = getCount() - 1;\n const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n let newIndex = activeIndex;\n\n switch (action) {\n case 'Select':\n case 'CloseSelect':\n activeOption && selectOption(event, activeOption);\n break;\n default:\n newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n }\n\n if (newIndex !== activeIndex) {\n // prevent default page scroll/keyboard action if the index changed\n event.preventDefault();\n setActiveOption(getOptionAtIndex(newIndex));\n setFocusVisible(true);\n }\n };\n\n const onMouseOver = (event: React.MouseEvent<HTMLElement>) => {\n setFocusVisible(false);\n };\n\n // get state from parent combobox, if it exists\n const hasComboboxContext = useHasParentContext(ComboboxContext);\n const comboboxActiveOption = useContextSelector(ComboboxContext, ctx => ctx.activeOption);\n const comboboxFocusVisible = useContextSelector(ComboboxContext, ctx => ctx.focusVisible);\n const comboboxSelectedOptions = useContextSelector(ComboboxContext, ctx => ctx.selectedOptions);\n const comboboxSelectOption = useContextSelector(ComboboxContext, ctx => ctx.selectOption);\n const comboboxSetActiveOption = useContextSelector(ComboboxContext, ctx => ctx.setActiveOption);\n\n // without a parent combobox context, provide values directly from Listbox\n const optionContextValues = hasComboboxContext\n ? {\n activeOption: comboboxActiveOption,\n focusVisible: comboboxFocusVisible,\n selectedOptions: comboboxSelectedOptions,\n selectOption: comboboxSelectOption,\n setActiveOption: comboboxSetActiveOption,\n }\n : {\n activeOption,\n focusVisible,\n selectedOptions,\n selectOption,\n setActiveOption,\n };\n\n const state: ListboxState = {\n components: {\n root: 'div',\n },\n root: slot.always(\n getNativeElementProps('div', {\n ref,\n role: multiselect ? 'menu' : 'listbox',\n 'aria-activedescendant': hasComboboxContext ? undefined : activeOption?.id,\n 'aria-multiselectable': multiselect,\n tabIndex: 0,\n ...props,\n }),\n { elementType: 'div' },\n ),\n multiselect,\n clearSelection,\n ...optionCollection,\n ...optionContextValues,\n };\n\n const scrollContainerRef = useScrollOptionsIntoView(state);\n state.root.ref = useMergedRefs(state.root.ref, scrollContainerRef);\n\n state.root.onKeyDown = useEventCallback(mergeCallbacks(state.root.onKeyDown, onKeyDown));\n state.root.onMouseOver = useEventCallback(mergeCallbacks(state.root.onMouseOver, onMouseOver));\n\n return state;\n};\n"],"names":["React","getNativeElementProps","mergeCallbacks","useEventCallback","useMergedRefs","slot","useContextSelector","useHasParentContext","getDropdownActionFromKey","getIndexFromAction","useOptionCollection","useScrollOptionsIntoView","useSelection","ComboboxContext","useListbox_unstable","props","ref","multiselect","optionCollection","getCount","getOptionAtIndex","getIndexOfId","clearSelection","selectedOptions","selectOption","activeOption","setActiveOption","useState","focusVisible","setFocusVisible","onKeyDown","event","action","open","maxIndex","activeIndex","id","newIndex","preventDefault","onMouseOver","hasComboboxContext","comboboxActiveOption","ctx","comboboxFocusVisible","comboboxSelectedOptions","comboboxSelectOption","comboboxSetActiveOption","optionContextValues","state","components","root","always","role","undefined","tabIndex","elementType","scrollContainerRef"],"mappings":"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"}
@@ -73,7 +73,7 @@ function getTextString(text, children) {
73
73
  CheckIcon = selected ? /*#__PURE__*/ React.createElement(Checkmark12Filled, null) : '';
74
74
  }
75
75
  const onClick = (event)=>{
76
- var _props_onClick, _props;
76
+ var _props_onClick;
77
77
  if (disabled) {
78
78
  event.preventDefault();
79
79
  return;
@@ -82,12 +82,11 @@ function getTextString(text, children) {
82
82
  setActiveOption(optionData);
83
83
  // close on option click for single-select options in a combobox
84
84
  if (!multiselect) {
85
- var _setOpen;
86
- (_setOpen = setOpen) === null || _setOpen === void 0 ? void 0 : _setOpen(event, false);
85
+ setOpen === null || setOpen === void 0 ? void 0 : setOpen(event, false);
87
86
  }
88
87
  // handle selection change
89
88
  selectOption(event, optionData);
90
- (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, event);
89
+ (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);
91
90
  };
92
91
  // register option data with context
93
92
  React.useEffect(()=>{