@bazza-ui/react 0.0.0-snapshot-20260205122957
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/command-score-BuKQkUmS.d.cts +36 -0
- package/dist/command-score-C6nHV08C.d.ts +36 -0
- package/dist/data-surface-Dki7544r.d.ts +2136 -0
- package/dist/data-surface-Dyb-d-72.d.cts +2136 -0
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +3296 -0
- package/dist/index.d.ts +3296 -0
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -0
- package/dist/internal/listbox/index.cjs +2 -0
- package/dist/internal/listbox/index.cjs.map +1 -0
- package/dist/internal/listbox/index.d.cts +253 -0
- package/dist/internal/listbox/index.d.ts +253 -0
- package/dist/internal/listbox/index.js +2 -0
- package/dist/internal/listbox/index.js.map +1 -0
- package/dist/internal/popup-menu/index.cjs +2 -0
- package/dist/internal/popup-menu/index.cjs.map +1 -0
- package/dist/internal/popup-menu/index.d.cts +925 -0
- package/dist/internal/popup-menu/index.d.ts +925 -0
- package/dist/internal/popup-menu/index.js +2 -0
- package/dist/internal/popup-menu/index.js.map +1 -0
- package/dist/use-listbox-item-bi01_uzf.d.cts +659 -0
- package/dist/use-listbox-item-bi01_uzf.d.ts +659 -0
- package/package.json +62 -0
|
@@ -0,0 +1,2136 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { J as CheckedChangeEventDetails, K as RadioValueChangeEventDetails, r as ListboxStore, P as PopupMenuOpenChangeReason, V as VirtualItem, H as HighlightChangeEventDetails, U as UseListboxItemParams, y as UseListboxItemReturn, F as FilterFn } from './use-listbox-item-bi01_uzf.cjs';
|
|
3
|
+
import { PopoverArrowProps, Popover, PopoverBackdropProps, PopoverPopupProps, PopoverPortalProps, PopoverPositionerProps, PopoverRootProps } from '@base-ui/react/popover';
|
|
4
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Render function that receives props and state, returns a React element.
|
|
8
|
+
*/
|
|
9
|
+
type ComponentRenderFn<Props, State> = (props: Props, state: State) => React.ReactElement<unknown>;
|
|
10
|
+
/**
|
|
11
|
+
* HTML props with ref support.
|
|
12
|
+
*/
|
|
13
|
+
type HTMLProps<T = any> = React.HTMLAttributes<T> & {
|
|
14
|
+
ref?: React.Ref<T> | undefined;
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* Props shared by all Bazza UI components.
|
|
18
|
+
* Includes className (string or state-based function), render prop, and style (object or state-based function).
|
|
19
|
+
*/
|
|
20
|
+
type ComponentProps<ElementType extends React.ElementType, State, RenderFunctionProps = HTMLProps> = Omit<React.ComponentPropsWithRef<ElementType>, 'className' | 'color' | 'defaultValue' | 'defaultChecked'> & {
|
|
21
|
+
/**
|
|
22
|
+
* CSS class applied to the element, or a function that
|
|
23
|
+
* returns a class based on the component's state.
|
|
24
|
+
*/
|
|
25
|
+
className?: string | ((state: State) => string | undefined);
|
|
26
|
+
/**
|
|
27
|
+
* Allows you to replace the component's HTML element
|
|
28
|
+
* with a different tag, or compose it with another component.
|
|
29
|
+
*
|
|
30
|
+
* Accepts a `ReactElement` or a function that returns the element to render.
|
|
31
|
+
*/
|
|
32
|
+
render?: ComponentRenderFn<RenderFunctionProps, State> | React.ReactElement;
|
|
33
|
+
/**
|
|
34
|
+
* Style applied to the element, or a function that
|
|
35
|
+
* returns a style object based on the component's state.
|
|
36
|
+
*/
|
|
37
|
+
style?: React.CSSProperties | ((state: State) => React.CSSProperties | undefined);
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
interface PopupMenuCheckboxItemState extends Record<string, unknown> {
|
|
41
|
+
/**
|
|
42
|
+
* Whether the item is highlighted (via keyboard or pointer).
|
|
43
|
+
*/
|
|
44
|
+
highlighted: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* Whether the item is disabled.
|
|
47
|
+
*/
|
|
48
|
+
disabled: boolean;
|
|
49
|
+
/**
|
|
50
|
+
* Whether the item is currently checked.
|
|
51
|
+
*/
|
|
52
|
+
checked: boolean;
|
|
53
|
+
}
|
|
54
|
+
interface PopupMenuCheckboxItemProps extends ComponentProps<'div', PopupMenuCheckboxItem.State> {
|
|
55
|
+
/**
|
|
56
|
+
* The controlled checked state.
|
|
57
|
+
*/
|
|
58
|
+
checked?: boolean;
|
|
59
|
+
/**
|
|
60
|
+
* The default checked state for uncontrolled mode.
|
|
61
|
+
* @default false
|
|
62
|
+
*/
|
|
63
|
+
defaultChecked?: boolean;
|
|
64
|
+
/**
|
|
65
|
+
* Callback fired when the checked state changes.
|
|
66
|
+
* The second parameter contains event details including the reason for the change.
|
|
67
|
+
*/
|
|
68
|
+
onCheckedChange?: (checked: boolean, eventDetails: CheckedChangeEventDetails) => void;
|
|
69
|
+
/**
|
|
70
|
+
* Additional keywords to match against when filtering.
|
|
71
|
+
* Useful for aliases or synonyms.
|
|
72
|
+
*/
|
|
73
|
+
keywords?: string[];
|
|
74
|
+
/**
|
|
75
|
+
* Whether this item is disabled.
|
|
76
|
+
* Disabled items are not selectable and are skipped during keyboard navigation.
|
|
77
|
+
* @default false
|
|
78
|
+
*/
|
|
79
|
+
disabled?: boolean;
|
|
80
|
+
/**
|
|
81
|
+
* Callback when this item is selected (via click or Enter key).
|
|
82
|
+
*/
|
|
83
|
+
onSelect?: () => void;
|
|
84
|
+
/**
|
|
85
|
+
* Whether to force render this item regardless of filter results.
|
|
86
|
+
* @default false
|
|
87
|
+
*/
|
|
88
|
+
forceMount?: boolean;
|
|
89
|
+
/**
|
|
90
|
+
* Whether clicking this item should close the menu.
|
|
91
|
+
* @default false
|
|
92
|
+
*/
|
|
93
|
+
closeOnClick?: boolean;
|
|
94
|
+
/**
|
|
95
|
+
* Keyboard shortcut to trigger this item.
|
|
96
|
+
* When the menu is focused and the user presses this key, the item will be selected.
|
|
97
|
+
* Should be a single character (e.g., "1", "a", etc.).
|
|
98
|
+
*/
|
|
99
|
+
shortcut?: string;
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* A selectable checkbox item within a popup menu.
|
|
103
|
+
* Manages its own checked state independently.
|
|
104
|
+
* Renders a `<div>` element with role="menuitemcheckbox".
|
|
105
|
+
*/
|
|
106
|
+
declare const PopupMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<PopupMenuCheckboxItem.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
107
|
+
declare namespace PopupMenuCheckboxItem {
|
|
108
|
+
type State = PopupMenuCheckboxItemState;
|
|
109
|
+
interface Props extends PopupMenuCheckboxItemProps {
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
interface PopupMenuItemState extends Record<string, unknown> {
|
|
114
|
+
/**
|
|
115
|
+
* Whether the item is highlighted (via keyboard or pointer).
|
|
116
|
+
*/
|
|
117
|
+
highlighted: boolean;
|
|
118
|
+
/**
|
|
119
|
+
* Whether the item is disabled.
|
|
120
|
+
*/
|
|
121
|
+
disabled: boolean;
|
|
122
|
+
}
|
|
123
|
+
interface PopupMenuItemProps extends ComponentProps<'div', PopupMenuItem.State> {
|
|
124
|
+
/**
|
|
125
|
+
* Unique value for this item used for filtering.
|
|
126
|
+
* If not provided, will be inferred from textContent.
|
|
127
|
+
*/
|
|
128
|
+
value?: string;
|
|
129
|
+
/**
|
|
130
|
+
* Additional keywords to match against when filtering.
|
|
131
|
+
* Useful for aliases or synonyms.
|
|
132
|
+
*/
|
|
133
|
+
keywords?: string[];
|
|
134
|
+
/**
|
|
135
|
+
* Whether this item is disabled.
|
|
136
|
+
* Disabled items are not selectable and are skipped during keyboard navigation.
|
|
137
|
+
*/
|
|
138
|
+
disabled?: boolean;
|
|
139
|
+
/**
|
|
140
|
+
* Callback when this item is selected (via click or Enter key).
|
|
141
|
+
*/
|
|
142
|
+
onSelect?: () => void;
|
|
143
|
+
/**
|
|
144
|
+
* Whether to force render this item regardless of filter results.
|
|
145
|
+
* @default false
|
|
146
|
+
*/
|
|
147
|
+
forceMount?: boolean;
|
|
148
|
+
/**
|
|
149
|
+
* Whether clicking this item should close the menu.
|
|
150
|
+
* @default true
|
|
151
|
+
*/
|
|
152
|
+
closeOnClick?: boolean;
|
|
153
|
+
/**
|
|
154
|
+
* Keyboard shortcut to trigger this item.
|
|
155
|
+
* When the menu is focused and the user presses this key, the item will be selected.
|
|
156
|
+
* Should be a single character (e.g., "1", "a", etc.).
|
|
157
|
+
*/
|
|
158
|
+
shortcut?: string;
|
|
159
|
+
}
|
|
160
|
+
/**
|
|
161
|
+
* A selectable item in the popup menu.
|
|
162
|
+
* Renders a `<div>` element with role="option".
|
|
163
|
+
*/
|
|
164
|
+
declare const PopupMenuItem: React.ForwardRefExoticComponent<Omit<PopupMenuItem.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
165
|
+
declare namespace PopupMenuItem {
|
|
166
|
+
type State = PopupMenuItemState;
|
|
167
|
+
interface Props extends PopupMenuItemProps {
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
interface PopupMenuRadioGroupState extends Record<string, unknown> {
|
|
172
|
+
/**
|
|
173
|
+
* Whether the radio group is disabled.
|
|
174
|
+
*/
|
|
175
|
+
disabled: boolean;
|
|
176
|
+
}
|
|
177
|
+
interface PopupMenuRadioGroupProps extends ComponentProps<'div', PopupMenuRadioGroup.State> {
|
|
178
|
+
/**
|
|
179
|
+
* The controlled selected value.
|
|
180
|
+
*/
|
|
181
|
+
value?: string;
|
|
182
|
+
/**
|
|
183
|
+
* The default value for uncontrolled mode.
|
|
184
|
+
*/
|
|
185
|
+
defaultValue?: string;
|
|
186
|
+
/**
|
|
187
|
+
* Callback fired when the selected value changes.
|
|
188
|
+
* The second parameter contains event details including the reason for the change.
|
|
189
|
+
*/
|
|
190
|
+
onValueChange?: (value: string, eventDetails: RadioValueChangeEventDetails) => void;
|
|
191
|
+
/**
|
|
192
|
+
* Whether all items in this group are disabled.
|
|
193
|
+
* @default false
|
|
194
|
+
*/
|
|
195
|
+
disabled?: boolean;
|
|
196
|
+
/**
|
|
197
|
+
* Whether to force render this group regardless of filter results.
|
|
198
|
+
* @default false
|
|
199
|
+
*/
|
|
200
|
+
forceMount?: boolean;
|
|
201
|
+
children: React.ReactNode;
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* Groups radio items together and manages the selected value.
|
|
205
|
+
* Only one item can be selected at a time within a radio group.
|
|
206
|
+
* Renders a `<div>` element with role="group".
|
|
207
|
+
*/
|
|
208
|
+
declare const PopupMenuRadioGroup: React.ForwardRefExoticComponent<Omit<PopupMenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
209
|
+
declare namespace PopupMenuRadioGroup {
|
|
210
|
+
type State = PopupMenuRadioGroupState;
|
|
211
|
+
interface Props extends PopupMenuRadioGroupProps {
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
interface PopupMenuRadioItemState extends Record<string, unknown> {
|
|
216
|
+
/**
|
|
217
|
+
* Whether the item is highlighted (via keyboard or pointer).
|
|
218
|
+
*/
|
|
219
|
+
highlighted: boolean;
|
|
220
|
+
/**
|
|
221
|
+
* Whether the item is disabled.
|
|
222
|
+
*/
|
|
223
|
+
disabled: boolean;
|
|
224
|
+
/**
|
|
225
|
+
* Whether the item is currently selected/checked.
|
|
226
|
+
*/
|
|
227
|
+
checked: boolean;
|
|
228
|
+
}
|
|
229
|
+
interface PopupMenuRadioItemProps extends ComponentProps<'div', PopupMenuRadioItem.State> {
|
|
230
|
+
/**
|
|
231
|
+
* The value to set when this item is selected.
|
|
232
|
+
* This is required and must be unique within the RadioGroup.
|
|
233
|
+
*/
|
|
234
|
+
value: string;
|
|
235
|
+
/**
|
|
236
|
+
* Additional keywords to match against when filtering.
|
|
237
|
+
* Useful for aliases or synonyms.
|
|
238
|
+
*/
|
|
239
|
+
keywords?: string[];
|
|
240
|
+
/**
|
|
241
|
+
* Whether this item is disabled.
|
|
242
|
+
* Disabled items are not selectable and are skipped during keyboard navigation.
|
|
243
|
+
* @default false
|
|
244
|
+
*/
|
|
245
|
+
disabled?: boolean;
|
|
246
|
+
/**
|
|
247
|
+
* Callback when this item is selected.
|
|
248
|
+
*/
|
|
249
|
+
onSelect?: () => void;
|
|
250
|
+
/**
|
|
251
|
+
* Whether to force render this item regardless of filter results.
|
|
252
|
+
* @default false
|
|
253
|
+
*/
|
|
254
|
+
forceMount?: boolean;
|
|
255
|
+
/**
|
|
256
|
+
* Whether clicking this item should close the menu.
|
|
257
|
+
* @default false
|
|
258
|
+
*/
|
|
259
|
+
closeOnClick?: boolean;
|
|
260
|
+
/**
|
|
261
|
+
* Keyboard shortcut to trigger this item.
|
|
262
|
+
* When the menu is focused and the user presses this key, the item will be selected.
|
|
263
|
+
* Should be a single character (e.g., "1", "a", etc.).
|
|
264
|
+
*/
|
|
265
|
+
shortcut?: string;
|
|
266
|
+
}
|
|
267
|
+
/**
|
|
268
|
+
* A selectable radio item within a RadioGroup.
|
|
269
|
+
* Only one RadioItem can be selected at a time within a RadioGroup.
|
|
270
|
+
* Renders a `<div>` element with role="menuitemradio".
|
|
271
|
+
*/
|
|
272
|
+
declare const PopupMenuRadioItem: React.ForwardRefExoticComponent<Omit<PopupMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
273
|
+
declare namespace PopupMenuRadioItem {
|
|
274
|
+
type State = PopupMenuRadioItemState;
|
|
275
|
+
interface Props extends PopupMenuRadioItemProps {
|
|
276
|
+
}
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
interface PopupMenuSubmenuTriggerState extends Record<string, unknown> {
|
|
280
|
+
/**
|
|
281
|
+
* Whether this is a submenu trigger (always true).
|
|
282
|
+
*/
|
|
283
|
+
submenuTrigger: boolean;
|
|
284
|
+
/**
|
|
285
|
+
* Whether the submenu popup is open.
|
|
286
|
+
*/
|
|
287
|
+
popupOpen: boolean;
|
|
288
|
+
/**
|
|
289
|
+
* Whether the submenu owns keyboard focus.
|
|
290
|
+
*/
|
|
291
|
+
popupFocused: boolean;
|
|
292
|
+
/**
|
|
293
|
+
* Whether the item is highlighted.
|
|
294
|
+
*/
|
|
295
|
+
highlighted: boolean;
|
|
296
|
+
/**
|
|
297
|
+
* Whether the item is disabled.
|
|
298
|
+
*/
|
|
299
|
+
disabled: boolean;
|
|
300
|
+
}
|
|
301
|
+
interface PopupMenuSubmenuTriggerProps extends ComponentProps<'div', PopupMenuSubmenuTrigger.State> {
|
|
302
|
+
/**
|
|
303
|
+
* Explicit unique identifier for this item in the store.
|
|
304
|
+
* When provided (e.g., from data-first API's computed composite ID),
|
|
305
|
+
* this takes priority over `value` for store registration.
|
|
306
|
+
*/
|
|
307
|
+
id?: string;
|
|
308
|
+
/**
|
|
309
|
+
* Unique value for this item used for filtering.
|
|
310
|
+
* If not provided, will be inferred from textContent.
|
|
311
|
+
*/
|
|
312
|
+
value?: string;
|
|
313
|
+
/**
|
|
314
|
+
* Additional keywords to match against when filtering.
|
|
315
|
+
* Useful for aliases or synonyms.
|
|
316
|
+
*/
|
|
317
|
+
keywords?: string[];
|
|
318
|
+
/**
|
|
319
|
+
* Whether this item is disabled.
|
|
320
|
+
* Disabled items are not selectable and are skipped during keyboard navigation.
|
|
321
|
+
*/
|
|
322
|
+
disabled?: boolean;
|
|
323
|
+
/**
|
|
324
|
+
* Whether to force render this item regardless of filter results.
|
|
325
|
+
* @default false
|
|
326
|
+
*/
|
|
327
|
+
forceMount?: boolean;
|
|
328
|
+
/**
|
|
329
|
+
* Whether the submenu opens when this trigger is highlighted.
|
|
330
|
+
* @default true
|
|
331
|
+
*/
|
|
332
|
+
openOnHighlight?: boolean;
|
|
333
|
+
/**
|
|
334
|
+
* Delay before opening the submenu (in milliseconds).
|
|
335
|
+
* Can be a number (applies to both pointer and keyboard) or an object
|
|
336
|
+
* with separate `pointer` and `keyboard` values.
|
|
337
|
+
* @default { pointer: 0, keyboard: 150 }
|
|
338
|
+
*/
|
|
339
|
+
delay?: number | {
|
|
340
|
+
pointer?: number;
|
|
341
|
+
keyboard?: number;
|
|
342
|
+
};
|
|
343
|
+
/**
|
|
344
|
+
* Delay before closing the submenu when pointer leaves (in milliseconds).
|
|
345
|
+
* @default 0
|
|
346
|
+
*/
|
|
347
|
+
closeDelay?: number;
|
|
348
|
+
}
|
|
349
|
+
/**
|
|
350
|
+
* A menu item that opens a submenu when hovered.
|
|
351
|
+
* Must be used within PopupMenu.Submenu.
|
|
352
|
+
* Renders a `<div>` element with role="menuitem" wrapped in Popover.Trigger.
|
|
353
|
+
*/
|
|
354
|
+
declare const PopupMenuSubmenuTrigger: React.ForwardRefExoticComponent<Omit<PopupMenuSubmenuTrigger.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
355
|
+
declare namespace PopupMenuSubmenuTrigger {
|
|
356
|
+
type State = PopupMenuSubmenuTriggerState;
|
|
357
|
+
interface Props extends PopupMenuSubmenuTriggerProps {
|
|
358
|
+
}
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
/**
|
|
362
|
+
* Library-agnostic result from an async loader.
|
|
363
|
+
* Compatible with TanStack Query, SWR, and custom loaders.
|
|
364
|
+
*/
|
|
365
|
+
interface AsyncLoaderResult<T> {
|
|
366
|
+
/** The loaded data, undefined while loading or on error */
|
|
367
|
+
data: T | undefined;
|
|
368
|
+
/** Error if the load failed, null otherwise */
|
|
369
|
+
error: Error | null;
|
|
370
|
+
/** Whether the loader is currently loading */
|
|
371
|
+
isLoading: boolean;
|
|
372
|
+
/** Whether the loader encountered an error */
|
|
373
|
+
isError: boolean;
|
|
374
|
+
/** Optional function to refetch the data */
|
|
375
|
+
refetch?: () => void;
|
|
376
|
+
}
|
|
377
|
+
/**
|
|
378
|
+
* Props passed to loader components.
|
|
379
|
+
* The component should call hooks internally and pass the result to children.
|
|
380
|
+
*/
|
|
381
|
+
interface LoaderComponentProps {
|
|
382
|
+
/** Search query (for query-dependent loaders) */
|
|
383
|
+
query: string;
|
|
384
|
+
/** Render function receiving loader state */
|
|
385
|
+
children: (state: AsyncLoaderResult<NodeDef[]>) => React.ReactNode;
|
|
386
|
+
}
|
|
387
|
+
/**
|
|
388
|
+
* Static loader configuration.
|
|
389
|
+
* Loads data once, then filters client-side.
|
|
390
|
+
*/
|
|
391
|
+
interface StaticLoaderConfig {
|
|
392
|
+
type: 'static';
|
|
393
|
+
/**
|
|
394
|
+
* Component that calls hooks and provides loader state.
|
|
395
|
+
* This component pattern allows hooks to be called legally within React's rules.
|
|
396
|
+
*/
|
|
397
|
+
Loader: React.ComponentType<LoaderComponentProps>;
|
|
398
|
+
/**
|
|
399
|
+
* When to trigger the loader:
|
|
400
|
+
* - 'eager': Load when menu opens (good for deep search)
|
|
401
|
+
* - 'lazy': Load when submenu opens (default)
|
|
402
|
+
* @default 'lazy'
|
|
403
|
+
*/
|
|
404
|
+
loadStrategy?: 'eager' | 'lazy';
|
|
405
|
+
}
|
|
406
|
+
/**
|
|
407
|
+
* Query-dependent loader configuration.
|
|
408
|
+
* Refetches based on search query - server does the filtering.
|
|
409
|
+
*/
|
|
410
|
+
interface QueryDependentLoaderConfig {
|
|
411
|
+
type: 'query';
|
|
412
|
+
/**
|
|
413
|
+
* Component that calls hooks and provides loader state.
|
|
414
|
+
* Receives the current search query as a prop.
|
|
415
|
+
*/
|
|
416
|
+
Loader: React.ComponentType<LoaderComponentProps>;
|
|
417
|
+
/**
|
|
418
|
+
* Minimum query length before fetching.
|
|
419
|
+
* @default 1
|
|
420
|
+
*/
|
|
421
|
+
minQueryLength?: number;
|
|
422
|
+
/**
|
|
423
|
+
* Initial query to use when the loader becomes active.
|
|
424
|
+
* Set to '' to fetch all items immediately when the submenu opens.
|
|
425
|
+
* If undefined, waits for user to type before fetching.
|
|
426
|
+
*/
|
|
427
|
+
initialQuery?: string;
|
|
428
|
+
/**
|
|
429
|
+
* When to trigger the loader:
|
|
430
|
+
* - 'eager': Load when root menu opens (good for deep search)
|
|
431
|
+
* - 'lazy': Load when submenu opens (default)
|
|
432
|
+
* @default 'lazy'
|
|
433
|
+
*/
|
|
434
|
+
loadStrategy?: 'eager' | 'lazy';
|
|
435
|
+
/**
|
|
436
|
+
* What to show when query is below minQueryLength.
|
|
437
|
+
* - 'empty': Show nothing
|
|
438
|
+
* - 'placeholder': Show placeholderNodes
|
|
439
|
+
* @default 'empty'
|
|
440
|
+
*/
|
|
441
|
+
belowMinBehavior?: 'empty' | 'placeholder';
|
|
442
|
+
/**
|
|
443
|
+
* Placeholder nodes shown when query is below minQueryLength.
|
|
444
|
+
*/
|
|
445
|
+
placeholderNodes?: NodeDef[];
|
|
446
|
+
}
|
|
447
|
+
/**
|
|
448
|
+
* Union of all async loader configurations.
|
|
449
|
+
*/
|
|
450
|
+
type AsyncLoaderConfig = StaticLoaderConfig | QueryDependentLoaderConfig;
|
|
451
|
+
/**
|
|
452
|
+
* Base options for async nodes that apply to both loader types.
|
|
453
|
+
*/
|
|
454
|
+
interface AsyncNodesBaseOptions {
|
|
455
|
+
/**
|
|
456
|
+
* Include this menu's async content in parent's deep search.
|
|
457
|
+
* - Static loaders: default true (data loaded, filter client-side)
|
|
458
|
+
* - Query loaders: default true (pass query to server)
|
|
459
|
+
*/
|
|
460
|
+
includeInDeepSearch?: boolean;
|
|
461
|
+
}
|
|
462
|
+
/**
|
|
463
|
+
* Static async nodes configuration for submenus.
|
|
464
|
+
*/
|
|
465
|
+
type StaticAsyncNodesConfig = StaticLoaderConfig & AsyncNodesBaseOptions;
|
|
466
|
+
/**
|
|
467
|
+
* Query-dependent async nodes configuration for submenus.
|
|
468
|
+
*/
|
|
469
|
+
type QueryAsyncNodesConfig = QueryDependentLoaderConfig & AsyncNodesBaseOptions;
|
|
470
|
+
/**
|
|
471
|
+
* Async nodes configuration for submenus.
|
|
472
|
+
* Union of static and query-dependent loader configs with deep search options.
|
|
473
|
+
*/
|
|
474
|
+
type AsyncNodesConfig = StaticAsyncNodesConfig | QueryAsyncNodesConfig;
|
|
475
|
+
/**
|
|
476
|
+
* Async state exposed to submenu render functions.
|
|
477
|
+
*/
|
|
478
|
+
interface AsyncRenderState {
|
|
479
|
+
/** Whether the loader is currently loading */
|
|
480
|
+
isLoading: boolean;
|
|
481
|
+
/** Whether the loader encountered an error */
|
|
482
|
+
isError: boolean;
|
|
483
|
+
/** The error if any */
|
|
484
|
+
error: Error | null;
|
|
485
|
+
/** For query loaders: whether query is below minQueryLength */
|
|
486
|
+
isBelowMinLength?: boolean;
|
|
487
|
+
}
|
|
488
|
+
/**
|
|
489
|
+
* Aggregate async state exposed to DataList children.
|
|
490
|
+
*/
|
|
491
|
+
interface AsyncState {
|
|
492
|
+
/** Any loader is currently loading */
|
|
493
|
+
isLoading: boolean;
|
|
494
|
+
/** Static loaders specifically are loading */
|
|
495
|
+
isStaticLoading: boolean;
|
|
496
|
+
/** Query loaders specifically are loading */
|
|
497
|
+
isQueryLoading: boolean;
|
|
498
|
+
/** Menus that failed (skipped from results) */
|
|
499
|
+
skippedMenus: Array<{
|
|
500
|
+
id: string;
|
|
501
|
+
reason: 'error';
|
|
502
|
+
}>;
|
|
503
|
+
}
|
|
504
|
+
/**
|
|
505
|
+
* Submenu node info passed in breadcrumbs context.
|
|
506
|
+
* Contains the full submenu definition for maximum flexibility.
|
|
507
|
+
*/
|
|
508
|
+
interface BreadcrumbNode {
|
|
509
|
+
/** The submenu node definition */
|
|
510
|
+
node: SubmenuDef;
|
|
511
|
+
/** The submenu's value */
|
|
512
|
+
value: string;
|
|
513
|
+
/** The submenu's explicit id (if provided) */
|
|
514
|
+
id?: string;
|
|
515
|
+
}
|
|
516
|
+
/**
|
|
517
|
+
* Context passed to the getQualifiedRowId function.
|
|
518
|
+
* Provides all information needed to generate a unique ID for a row.
|
|
519
|
+
*/
|
|
520
|
+
interface GetQualifiedRowIdContext {
|
|
521
|
+
/** The node definition */
|
|
522
|
+
node: ItemDef | RadioItemDef | CheckboxItemDef | SubmenuDef;
|
|
523
|
+
/** The node's value (node.value) - used for search/filtering and as fallback identifier */
|
|
524
|
+
value: string;
|
|
525
|
+
/** The node's explicit id (node.id) - if provided, treated as globally unique */
|
|
526
|
+
id: string | undefined;
|
|
527
|
+
/** Position in the flattened display list (0-based) */
|
|
528
|
+
index: number;
|
|
529
|
+
/**
|
|
530
|
+
* Breadcrumb nodes from root to parent.
|
|
531
|
+
* Contains full submenu node definitions for maximum flexibility.
|
|
532
|
+
*/
|
|
533
|
+
breadcrumbs: BreadcrumbNode[];
|
|
534
|
+
/** Whether deep search is currently active (search query meets minLength threshold) */
|
|
535
|
+
isDeepSearching: boolean;
|
|
536
|
+
/** Search context, null if browsing */
|
|
537
|
+
search: {
|
|
538
|
+
query: string;
|
|
539
|
+
score: number;
|
|
540
|
+
} | null;
|
|
541
|
+
/** Whether surfaced via deep search (rendered outside its home menu) */
|
|
542
|
+
isDeepSearchResult: boolean;
|
|
543
|
+
/** Group context, if any */
|
|
544
|
+
group: {
|
|
545
|
+
id: string;
|
|
546
|
+
label?: string;
|
|
547
|
+
} | null;
|
|
548
|
+
/** Radio group context, if any */
|
|
549
|
+
radioGroup: {
|
|
550
|
+
id: string;
|
|
551
|
+
label?: string;
|
|
552
|
+
} | null;
|
|
553
|
+
}
|
|
554
|
+
/**
|
|
555
|
+
* Function that generates a unique qualified ID for a row.
|
|
556
|
+
* Used for React keys, store registration, and DOM id attributes.
|
|
557
|
+
*
|
|
558
|
+
* Default behavior:
|
|
559
|
+
* - If node.id is provided, use it as-is (treat as globally unique)
|
|
560
|
+
* - Otherwise, compute from breadcrumbs + value when deep searching
|
|
561
|
+
*
|
|
562
|
+
* @example
|
|
563
|
+
* ```ts
|
|
564
|
+
* // Custom implementation
|
|
565
|
+
* const getQualifiedRowId: GetQualifiedRowIdFn = (ctx) => {
|
|
566
|
+
* // Use explicit id if provided
|
|
567
|
+
* if (ctx.id) return ctx.id
|
|
568
|
+
*
|
|
569
|
+
* // Otherwise, build from breadcrumbs + value
|
|
570
|
+
* const path = ctx.breadcrumbs.map(b => b.id ?? slugify(b.value))
|
|
571
|
+
* return [...path, slugify(ctx.value)].join('.')
|
|
572
|
+
* }
|
|
573
|
+
* ```
|
|
574
|
+
*/
|
|
575
|
+
type GetQualifiedRowIdFn = (context: GetQualifiedRowIdContext) => string;
|
|
576
|
+
/**
|
|
577
|
+
* Context passed to item and submenu render functions.
|
|
578
|
+
* Provides information about the current rendering context (search, breadcrumbs, state).
|
|
579
|
+
*/
|
|
580
|
+
interface RowRenderContext {
|
|
581
|
+
/**
|
|
582
|
+
* Search context - the query in the menu where this row is being rendered.
|
|
583
|
+
* `null` if no active search (browsing mode).
|
|
584
|
+
*/
|
|
585
|
+
search: {
|
|
586
|
+
/** Current search query */
|
|
587
|
+
query: string;
|
|
588
|
+
/** Match score for this row (0-1, higher = better match) */
|
|
589
|
+
score: number;
|
|
590
|
+
} | null;
|
|
591
|
+
/**
|
|
592
|
+
* Full path of submenu nodes from root to this row's parent.
|
|
593
|
+
* Contains the full submenu node definitions for maximum flexibility.
|
|
594
|
+
* Empty array [] for items directly in root menu.
|
|
595
|
+
*/
|
|
596
|
+
breadcrumbs: BreadcrumbNode[];
|
|
597
|
+
/**
|
|
598
|
+
* True if this row is being rendered outside its "home" menu
|
|
599
|
+
* (surfaced via deep search from an ancestor menu).
|
|
600
|
+
*/
|
|
601
|
+
isDeepSearchResult: boolean;
|
|
602
|
+
/** Whether this row is currently highlighted/focused */
|
|
603
|
+
highlighted: boolean;
|
|
604
|
+
/** Whether this row is disabled */
|
|
605
|
+
disabled: boolean;
|
|
606
|
+
/**
|
|
607
|
+
* The group this item belongs to, if any.
|
|
608
|
+
* `null` if the item is not inside a group.
|
|
609
|
+
*/
|
|
610
|
+
group: {
|
|
611
|
+
id: string;
|
|
612
|
+
label?: string;
|
|
613
|
+
} | null;
|
|
614
|
+
}
|
|
615
|
+
/**
|
|
616
|
+
* Props to spread onto the Item component.
|
|
617
|
+
* Derived from PopupMenuItemProps.
|
|
618
|
+
*/
|
|
619
|
+
type ItemRenderProps = {
|
|
620
|
+
/**
|
|
621
|
+
* Qualified unique ID for the item.
|
|
622
|
+
* Must be passed to the rendered component for navigation to work.
|
|
623
|
+
* This is the computed qualified ID (includes breadcrumb path for deep search results).
|
|
624
|
+
*/
|
|
625
|
+
id: string;
|
|
626
|
+
/**
|
|
627
|
+
* The original value from the node definition.
|
|
628
|
+
* Use this for display, search matching, or any logic that needs the raw value.
|
|
629
|
+
*/
|
|
630
|
+
value: string;
|
|
631
|
+
} & Required<Pick<PopupMenuItemProps, 'disabled'>> & Pick<PopupMenuItemProps, 'closeOnClick' | 'onSelect' | 'shortcut'>;
|
|
632
|
+
/**
|
|
633
|
+
* Parameters passed to item render functions.
|
|
634
|
+
*/
|
|
635
|
+
interface ItemRenderParams {
|
|
636
|
+
/** Props to spread onto the Item component */
|
|
637
|
+
props: ItemRenderProps;
|
|
638
|
+
/** Context for conditional rendering (includes props values for convenience) */
|
|
639
|
+
context: RowRenderContext & {
|
|
640
|
+
/** The node's value (ItemDef.value) */
|
|
641
|
+
value: string;
|
|
642
|
+
disabled: boolean;
|
|
643
|
+
};
|
|
644
|
+
}
|
|
645
|
+
/**
|
|
646
|
+
* Props to spread onto the RadioItem component.
|
|
647
|
+
* Derived from PopupMenuRadioItemProps.
|
|
648
|
+
*/
|
|
649
|
+
type RadioItemRenderProps = {
|
|
650
|
+
/**
|
|
651
|
+
* Qualified unique ID for the radio item.
|
|
652
|
+
* Must be passed to the rendered component for navigation to work.
|
|
653
|
+
*/
|
|
654
|
+
id: string;
|
|
655
|
+
} & Required<Pick<PopupMenuRadioItemProps, 'value' | 'disabled'>> & Pick<PopupMenuRadioItemProps, 'closeOnClick' | 'onSelect' | 'shortcut'>;
|
|
656
|
+
/**
|
|
657
|
+
* Parameters passed to radio item render functions.
|
|
658
|
+
*/
|
|
659
|
+
interface RadioItemRenderParams {
|
|
660
|
+
/** Props to spread onto the RadioItem component */
|
|
661
|
+
props: RadioItemRenderProps;
|
|
662
|
+
/** Context for conditional rendering (includes props values for convenience) */
|
|
663
|
+
context: RowRenderContext & {
|
|
664
|
+
/** The node's value (RadioItemDef.value) */
|
|
665
|
+
value: string;
|
|
666
|
+
disabled: boolean;
|
|
667
|
+
};
|
|
668
|
+
}
|
|
669
|
+
/**
|
|
670
|
+
* Props to spread onto the SubmenuTrigger component.
|
|
671
|
+
* Derived from PopupMenuSubmenuTriggerProps.
|
|
672
|
+
*/
|
|
673
|
+
type SubmenuRenderProps = {
|
|
674
|
+
/**
|
|
675
|
+
* Qualified unique ID for the submenu trigger.
|
|
676
|
+
* Must be passed to the rendered component for navigation to work.
|
|
677
|
+
*/
|
|
678
|
+
id: string;
|
|
679
|
+
/**
|
|
680
|
+
* The original value from the node definition.
|
|
681
|
+
*/
|
|
682
|
+
value: string;
|
|
683
|
+
} & Required<Pick<PopupMenuSubmenuTriggerProps, 'disabled'>>;
|
|
684
|
+
/**
|
|
685
|
+
* Parameters passed to submenu render functions.
|
|
686
|
+
* Includes context plus the submenu's child nodes and render function.
|
|
687
|
+
*/
|
|
688
|
+
interface SubmenuRenderParams {
|
|
689
|
+
/** Props to spread onto the SubmenuTrigger */
|
|
690
|
+
props: SubmenuRenderProps;
|
|
691
|
+
/** Context for conditional rendering (includes props values for convenience) */
|
|
692
|
+
context: RowRenderContext & {
|
|
693
|
+
/** The node's value (SubmenuDef.value) */
|
|
694
|
+
value: string;
|
|
695
|
+
disabled: boolean;
|
|
696
|
+
/** Async loading state (if asyncNodes configured) */
|
|
697
|
+
async?: AsyncRenderState;
|
|
698
|
+
};
|
|
699
|
+
/**
|
|
700
|
+
* The submenu's static child node definitions.
|
|
701
|
+
* Does NOT include async results - use `asyncContent` for that.
|
|
702
|
+
*/
|
|
703
|
+
nodes: NodeDef[];
|
|
704
|
+
/**
|
|
705
|
+
* Async content configuration for this submenu.
|
|
706
|
+
* Pass this to the submenu's DataSurface to enable async loading
|
|
707
|
+
* with the submenu's own search query (independent of parent search).
|
|
708
|
+
*/
|
|
709
|
+
asyncContent?: AsyncNodesConfig;
|
|
710
|
+
/**
|
|
711
|
+
* Function to render a child node.
|
|
712
|
+
* Call this for each node in the submenu's list.
|
|
713
|
+
*/
|
|
714
|
+
renderNode: (node: NodeDef) => React.ReactNode;
|
|
715
|
+
}
|
|
716
|
+
/**
|
|
717
|
+
* Context passed to group render functions.
|
|
718
|
+
* Contains information about the group's state during search.
|
|
719
|
+
*/
|
|
720
|
+
interface GroupRenderContext {
|
|
721
|
+
/**
|
|
722
|
+
* Search context with the best match score among items in this group.
|
|
723
|
+
* `null` if no active search (browsing mode).
|
|
724
|
+
*/
|
|
725
|
+
search: {
|
|
726
|
+
/** Current search query */
|
|
727
|
+
query: string;
|
|
728
|
+
/** Best match score among items in this group (0-1) */
|
|
729
|
+
bestScore: number;
|
|
730
|
+
} | null;
|
|
731
|
+
/** Number of matching items in this group */
|
|
732
|
+
matchCount: number;
|
|
733
|
+
/**
|
|
734
|
+
* Breadcrumb nodes if this group is from a surfaced submenu.
|
|
735
|
+
* Empty array [] for groups in the root menu.
|
|
736
|
+
*/
|
|
737
|
+
breadcrumbs: BreadcrumbNode[];
|
|
738
|
+
/** Whether this group is from deep search (surfaced from a submenu) */
|
|
739
|
+
isDeepSearchResult: boolean;
|
|
740
|
+
}
|
|
741
|
+
/**
|
|
742
|
+
* Parameters passed to group render functions.
|
|
743
|
+
*/
|
|
744
|
+
interface GroupRenderParams {
|
|
745
|
+
/** Props (empty for groups, but consistent structure) */
|
|
746
|
+
props: Record<string, never>;
|
|
747
|
+
/** Context for conditional rendering (includes label for convenience) */
|
|
748
|
+
context: GroupRenderContext & {
|
|
749
|
+
/** The group's label */
|
|
750
|
+
label?: string;
|
|
751
|
+
};
|
|
752
|
+
/** Pre-rendered matching children */
|
|
753
|
+
children: React.ReactNode;
|
|
754
|
+
}
|
|
755
|
+
/**
|
|
756
|
+
* Props to spread onto the CheckboxItem component.
|
|
757
|
+
* Derived from PopupMenuCheckboxItemProps.
|
|
758
|
+
*/
|
|
759
|
+
type CheckboxItemRenderProps = {
|
|
760
|
+
/**
|
|
761
|
+
* Qualified unique ID for the checkbox item.
|
|
762
|
+
* Must be passed to the rendered component for navigation to work.
|
|
763
|
+
*/
|
|
764
|
+
id: string;
|
|
765
|
+
/**
|
|
766
|
+
* The original value from the node definition.
|
|
767
|
+
*/
|
|
768
|
+
value: string;
|
|
769
|
+
} & Required<Pick<PopupMenuCheckboxItemProps, 'disabled'>> & Pick<PopupMenuCheckboxItemProps, 'checked' | 'onCheckedChange' | 'closeOnClick'>;
|
|
770
|
+
/**
|
|
771
|
+
* Parameters passed to checkbox item render functions.
|
|
772
|
+
*/
|
|
773
|
+
interface CheckboxItemRenderParams {
|
|
774
|
+
/** Props to spread onto the CheckboxItem component */
|
|
775
|
+
props: CheckboxItemRenderProps;
|
|
776
|
+
/** Context for conditional rendering (includes props values for convenience) */
|
|
777
|
+
context: RowRenderContext & {
|
|
778
|
+
/** The node's value (CheckboxItemDef.value) */
|
|
779
|
+
value: string;
|
|
780
|
+
checked?: boolean;
|
|
781
|
+
disabled: boolean;
|
|
782
|
+
};
|
|
783
|
+
}
|
|
784
|
+
/**
|
|
785
|
+
* Props to spread onto the RadioGroup component.
|
|
786
|
+
* Derived from PopupMenuRadioGroupProps.
|
|
787
|
+
*/
|
|
788
|
+
type RadioGroupRenderProps = Required<Pick<PopupMenuRadioGroupProps, 'disabled'>> & Pick<PopupMenuRadioGroupProps, 'value' | 'onValueChange'>;
|
|
789
|
+
/**
|
|
790
|
+
* Parameters passed to radio group render functions.
|
|
791
|
+
*/
|
|
792
|
+
interface RadioGroupRenderParams {
|
|
793
|
+
/** Props to spread onto the RadioGroup component */
|
|
794
|
+
props: RadioGroupRenderProps;
|
|
795
|
+
/** Context for conditional rendering */
|
|
796
|
+
context: GroupRenderContext & {
|
|
797
|
+
/** The radio group's label */
|
|
798
|
+
label?: string;
|
|
799
|
+
/** Current selected value */
|
|
800
|
+
value?: string;
|
|
801
|
+
/** Whether the radio group is disabled */
|
|
802
|
+
disabled: boolean;
|
|
803
|
+
};
|
|
804
|
+
/** Pre-rendered radio items */
|
|
805
|
+
children: React.ReactNode;
|
|
806
|
+
}
|
|
807
|
+
/**
|
|
808
|
+
* Base properties shared by all node types.
|
|
809
|
+
*/
|
|
810
|
+
interface BaseNodeDef {
|
|
811
|
+
/**
|
|
812
|
+
* Unique identifier for this node.
|
|
813
|
+
* If not provided, a composite ID is generated from the `value` and breadcrumbs
|
|
814
|
+
* using the `getItemId` function.
|
|
815
|
+
*/
|
|
816
|
+
id?: string;
|
|
817
|
+
/** Whether this node is hidden */
|
|
818
|
+
hidden?: boolean;
|
|
819
|
+
}
|
|
820
|
+
/**
|
|
821
|
+
* Item node definition.
|
|
822
|
+
* Represents a selectable menu item.
|
|
823
|
+
* Props derived from PopupMenuItemProps.
|
|
824
|
+
*/
|
|
825
|
+
interface ItemDef extends BaseNodeDef, Required<Pick<PopupMenuItemProps, 'value'>>, Pick<PopupMenuItemProps, 'keywords' | 'disabled' | 'onSelect' | 'closeOnClick' | 'shortcut'> {
|
|
826
|
+
kind: 'item';
|
|
827
|
+
/**
|
|
828
|
+
* Render function for this item row.
|
|
829
|
+
* Returns the JSX for the item.
|
|
830
|
+
*/
|
|
831
|
+
render: (params: ItemRenderParams) => React.ReactNode;
|
|
832
|
+
}
|
|
833
|
+
/**
|
|
834
|
+
* Radio item node definition.
|
|
835
|
+
* Represents a selectable radio menu item for use within RadioGroupDef.
|
|
836
|
+
* Props derived from PopupMenuRadioItemProps.
|
|
837
|
+
*/
|
|
838
|
+
interface RadioItemDef extends BaseNodeDef, Required<Pick<PopupMenuRadioItemProps, 'value'>>, Pick<PopupMenuRadioItemProps, 'keywords' | 'disabled' | 'onSelect' | 'closeOnClick' | 'shortcut'> {
|
|
839
|
+
kind: 'radio-item';
|
|
840
|
+
/**
|
|
841
|
+
* Render function for this radio item row.
|
|
842
|
+
* Returns the JSX for the radio item.
|
|
843
|
+
*/
|
|
844
|
+
render: (params: RadioItemRenderParams) => React.ReactNode;
|
|
845
|
+
}
|
|
846
|
+
/**
|
|
847
|
+
* Checkbox item node definition.
|
|
848
|
+
* Represents a toggleable checkbox menu item.
|
|
849
|
+
* Props derived from PopupMenuCheckboxItemProps.
|
|
850
|
+
*/
|
|
851
|
+
interface CheckboxItemDef extends BaseNodeDef, Pick<PopupMenuCheckboxItemProps, 'keywords' | 'disabled' | 'checked' | 'onCheckedChange' | 'closeOnClick'> {
|
|
852
|
+
kind: 'checkbox-item';
|
|
853
|
+
/**
|
|
854
|
+
* Primary identifier and search text for this checkbox item.
|
|
855
|
+
* Used for search matching and as the default identifier.
|
|
856
|
+
*/
|
|
857
|
+
value: string;
|
|
858
|
+
/**
|
|
859
|
+
* Render function for this checkbox item row.
|
|
860
|
+
* Returns the JSX for the checkbox item.
|
|
861
|
+
*/
|
|
862
|
+
render: (params: CheckboxItemRenderParams) => React.ReactNode;
|
|
863
|
+
}
|
|
864
|
+
/**
|
|
865
|
+
* Submenu node definition.
|
|
866
|
+
* Represents a submenu trigger that opens a nested menu.
|
|
867
|
+
* Props derived from PopupMenuSubmenuTriggerProps.
|
|
868
|
+
*/
|
|
869
|
+
interface SubmenuDef extends BaseNodeDef, Required<Pick<PopupMenuSubmenuTriggerProps, 'value'>>, Pick<PopupMenuSubmenuTriggerProps, 'keywords' | 'disabled'> {
|
|
870
|
+
kind: 'submenu';
|
|
871
|
+
/** Static child nodes */
|
|
872
|
+
nodes?: NodeDef[];
|
|
873
|
+
/**
|
|
874
|
+
* Async child nodes configuration.
|
|
875
|
+
* When provided, the Loader component will be rendered to fetch async data.
|
|
876
|
+
* Async nodes are merged with static nodes.
|
|
877
|
+
*/
|
|
878
|
+
asyncNodes?: AsyncNodesConfig;
|
|
879
|
+
/**
|
|
880
|
+
* Whether to include this submenu's children in deep search.
|
|
881
|
+
* @default true
|
|
882
|
+
*/
|
|
883
|
+
deepSearch?: boolean;
|
|
884
|
+
/**
|
|
885
|
+
* Render function for the entire submenu structure.
|
|
886
|
+
* Should return the complete submenu: trigger, portal, positioner, popup, surface, list.
|
|
887
|
+
*/
|
|
888
|
+
render: (params: SubmenuRenderParams) => React.ReactNode;
|
|
889
|
+
}
|
|
890
|
+
/**
|
|
891
|
+
* Render params for separator nodes.
|
|
892
|
+
*/
|
|
893
|
+
interface SeparatorRenderParams {
|
|
894
|
+
/** Props to spread on the separator element */
|
|
895
|
+
props: {
|
|
896
|
+
/** Unique identifier */
|
|
897
|
+
id?: string;
|
|
898
|
+
};
|
|
899
|
+
}
|
|
900
|
+
/**
|
|
901
|
+
* Separator node definition.
|
|
902
|
+
* Represents a visual separator between items.
|
|
903
|
+
*/
|
|
904
|
+
interface SeparatorDef {
|
|
905
|
+
kind: 'separator';
|
|
906
|
+
/** Optional identifier */
|
|
907
|
+
id?: string;
|
|
908
|
+
/** Optional render function for custom separator rendering */
|
|
909
|
+
render?: (params: SeparatorRenderParams) => React.ReactNode;
|
|
910
|
+
}
|
|
911
|
+
/**
|
|
912
|
+
* Group node definition.
|
|
913
|
+
* Represents a group of items with an optional label.
|
|
914
|
+
*/
|
|
915
|
+
interface GroupDef {
|
|
916
|
+
kind: 'group';
|
|
917
|
+
/** Unique identifier for this group */
|
|
918
|
+
id: string;
|
|
919
|
+
/** Optional group heading/label */
|
|
920
|
+
label?: string;
|
|
921
|
+
/** Child nodes in this group */
|
|
922
|
+
nodes: NodeDef[];
|
|
923
|
+
/** Optional render function for the group container */
|
|
924
|
+
render?: (params: GroupRenderParams) => React.ReactNode;
|
|
925
|
+
}
|
|
926
|
+
/**
|
|
927
|
+
* Radio group node definition.
|
|
928
|
+
* Represents a group of radio items where only one can be selected.
|
|
929
|
+
* Props derived from PopupMenuRadioGroupProps.
|
|
930
|
+
*/
|
|
931
|
+
interface RadioGroupDef extends Pick<PopupMenuRadioGroupProps, 'value' | 'onValueChange' | 'disabled'> {
|
|
932
|
+
kind: 'radio-group';
|
|
933
|
+
/** Unique identifier for this radio group */
|
|
934
|
+
id: string;
|
|
935
|
+
/** Optional group heading/label */
|
|
936
|
+
label?: string;
|
|
937
|
+
/** Whether the radio group is hidden */
|
|
938
|
+
hidden?: boolean;
|
|
939
|
+
/** Child nodes in this radio group - must be RadioItemDef nodes */
|
|
940
|
+
nodes: RadioItemDef[];
|
|
941
|
+
/** Optional render function for the radio group container */
|
|
942
|
+
render?: (params: RadioGroupRenderParams) => React.ReactNode;
|
|
943
|
+
}
|
|
944
|
+
/**
|
|
945
|
+
* Helper function to create a radio group definition with proper typing.
|
|
946
|
+
*/
|
|
947
|
+
declare function defineRadioGroup(def: RadioGroupDef): RadioGroupDef;
|
|
948
|
+
/**
|
|
949
|
+
* Union of all node definition types.
|
|
950
|
+
*/
|
|
951
|
+
type NodeDef = ItemDef | RadioItemDef | CheckboxItemDef | SubmenuDef | SeparatorDef | GroupDef | RadioGroupDef;
|
|
952
|
+
/**
|
|
953
|
+
* A node with its search score and breadcrumb path.
|
|
954
|
+
* Used internally during filtering and scoring.
|
|
955
|
+
*/
|
|
956
|
+
interface ScoredNode {
|
|
957
|
+
/** The original node definition */
|
|
958
|
+
node: ItemDef | RadioItemDef | CheckboxItemDef | SubmenuDef;
|
|
959
|
+
/** Search match score (0-1) */
|
|
960
|
+
score: number;
|
|
961
|
+
/**
|
|
962
|
+
* Breadcrumb nodes leading to this node.
|
|
963
|
+
* Contains the full submenu definitions for maximum flexibility.
|
|
964
|
+
*/
|
|
965
|
+
breadcrumbs: BreadcrumbNode[];
|
|
966
|
+
/** The group this node belongs to, if any */
|
|
967
|
+
group: {
|
|
968
|
+
id: string;
|
|
969
|
+
label?: string;
|
|
970
|
+
groupDef: GroupDef;
|
|
971
|
+
} | null;
|
|
972
|
+
/** The radio group this node belongs to, if any */
|
|
973
|
+
radioGroup: {
|
|
974
|
+
id: string;
|
|
975
|
+
label?: string;
|
|
976
|
+
radioGroupDef: RadioGroupDef;
|
|
977
|
+
} | null;
|
|
978
|
+
}
|
|
979
|
+
/**
|
|
980
|
+
* A row node ready for display with its render context.
|
|
981
|
+
* Used for items, radio items, checkbox items, and submenu triggers.
|
|
982
|
+
*/
|
|
983
|
+
interface DisplayRowNode {
|
|
984
|
+
/** The original node definition */
|
|
985
|
+
node: ItemDef | RadioItemDef | CheckboxItemDef | SubmenuDef;
|
|
986
|
+
/** Pre-computed render context for this node */
|
|
987
|
+
context: RowRenderContext;
|
|
988
|
+
/** Radio group this node belongs to, if rendering inside one */
|
|
989
|
+
radioGroup?: {
|
|
990
|
+
id: string;
|
|
991
|
+
label?: string;
|
|
992
|
+
};
|
|
993
|
+
/**
|
|
994
|
+
* Computed composite ID for this node.
|
|
995
|
+
* Includes breadcrumb path for deep search results (e.g., "status.in-progress").
|
|
996
|
+
* Set after filtering via `computeItemIds`.
|
|
997
|
+
*/
|
|
998
|
+
compositeId?: string;
|
|
999
|
+
}
|
|
1000
|
+
/**
|
|
1001
|
+
* A group node ready for display with its render context.
|
|
1002
|
+
* Contains the group definition and its matching items.
|
|
1003
|
+
*/
|
|
1004
|
+
interface DisplayGroupNode {
|
|
1005
|
+
kind: 'group';
|
|
1006
|
+
/** The group definition */
|
|
1007
|
+
group: GroupDef;
|
|
1008
|
+
/** Pre-computed render context for this group */
|
|
1009
|
+
context: GroupRenderContext;
|
|
1010
|
+
/** Display nodes for items within this group */
|
|
1011
|
+
items: DisplayRowNode[];
|
|
1012
|
+
/** Best match score among items in this group */
|
|
1013
|
+
bestScore: number;
|
|
1014
|
+
}
|
|
1015
|
+
/**
|
|
1016
|
+
* A radio group node ready for display with its render context.
|
|
1017
|
+
* Contains the radio group definition and its items.
|
|
1018
|
+
*/
|
|
1019
|
+
interface DisplayRadioGroupNode {
|
|
1020
|
+
kind: 'radio-group';
|
|
1021
|
+
/** The radio group definition */
|
|
1022
|
+
radioGroup: RadioGroupDef;
|
|
1023
|
+
/** Pre-computed render context for this radio group */
|
|
1024
|
+
context: GroupRenderContext;
|
|
1025
|
+
/** Display nodes for items within this radio group */
|
|
1026
|
+
items: DisplayRowNode[];
|
|
1027
|
+
/** Best match score among items in this radio group */
|
|
1028
|
+
bestScore: number;
|
|
1029
|
+
}
|
|
1030
|
+
/**
|
|
1031
|
+
* A separator node ready for display.
|
|
1032
|
+
*/
|
|
1033
|
+
interface DisplaySeparatorNode {
|
|
1034
|
+
kind: 'separator';
|
|
1035
|
+
/** The separator definition */
|
|
1036
|
+
separator: SeparatorDef;
|
|
1037
|
+
}
|
|
1038
|
+
/**
|
|
1039
|
+
* Union of all display node types.
|
|
1040
|
+
* Can be a row node (item/submenu), group node, radio group node, or separator.
|
|
1041
|
+
*/
|
|
1042
|
+
type DisplayNode = DisplayRowNode | DisplayGroupNode | DisplayRadioGroupNode | DisplaySeparatorNode;
|
|
1043
|
+
/**
|
|
1044
|
+
* Type guard for DisplayGroupNode.
|
|
1045
|
+
*/
|
|
1046
|
+
declare function isDisplayGroupNode(node: DisplayNode): node is DisplayGroupNode;
|
|
1047
|
+
/**
|
|
1048
|
+
* Type guard for DisplayRadioGroupNode.
|
|
1049
|
+
*/
|
|
1050
|
+
declare function isDisplayRadioGroupNode(node: DisplayNode): node is DisplayRadioGroupNode;
|
|
1051
|
+
/**
|
|
1052
|
+
* Type guard for DisplaySeparatorNode.
|
|
1053
|
+
*/
|
|
1054
|
+
declare function isDisplaySeparatorNode(node: DisplayNode): node is DisplaySeparatorNode;
|
|
1055
|
+
/**
|
|
1056
|
+
* Type guard for DisplayRowNode (items, checkbox items, submenus).
|
|
1057
|
+
*/
|
|
1058
|
+
declare function isDisplayRowNode(node: DisplayNode): node is DisplayRowNode;
|
|
1059
|
+
/**
|
|
1060
|
+
* Defines how groups behave during deep search.
|
|
1061
|
+
* - 'flatten': Groups become invisible, items shown in flat list by score.
|
|
1062
|
+
* - 'preserve': Groups are shown as containers with their matching items.
|
|
1063
|
+
* Note: Radio groups are ALWAYS preserved regardless of this setting.
|
|
1064
|
+
*/
|
|
1065
|
+
type GroupBehavior = 'flatten' | 'preserve';
|
|
1066
|
+
/**
|
|
1067
|
+
* Defines how radio groups behave during deep search.
|
|
1068
|
+
* - 'flatten': Radio group items are shown individually in the flat list (not recommended).
|
|
1069
|
+
* - 'preserve': Radio group is shown with only matching items visible.
|
|
1070
|
+
* - 'preserve-show-all': Radio group is shown with ALL items visible when any item matches.
|
|
1071
|
+
* This is useful when you want users to see all options in a radio group.
|
|
1072
|
+
*/
|
|
1073
|
+
type RadioGroupBehavior = 'flatten' | 'preserve' | 'preserve-show-all';
|
|
1074
|
+
/**
|
|
1075
|
+
* Configuration for deep search behavior.
|
|
1076
|
+
*/
|
|
1077
|
+
interface DeepSearchConfig {
|
|
1078
|
+
/** Whether deep search is enabled */
|
|
1079
|
+
enabled?: boolean;
|
|
1080
|
+
/** Minimum query length before deep search activates */
|
|
1081
|
+
minLength?: number;
|
|
1082
|
+
/**
|
|
1083
|
+
* How groups behave during search results.
|
|
1084
|
+
* Only affects search mode - groups are always shown in browse mode.
|
|
1085
|
+
* Note: Radio groups have their own behavior controlled by radioGroupSearchBehavior.
|
|
1086
|
+
* @default 'preserve'
|
|
1087
|
+
*/
|
|
1088
|
+
groupSearchBehavior?: GroupBehavior;
|
|
1089
|
+
/**
|
|
1090
|
+
* How radio groups behave during search results.
|
|
1091
|
+
* - 'flatten': Radio items shown individually (not recommended).
|
|
1092
|
+
* - 'preserve': Only matching radio items are shown (default).
|
|
1093
|
+
* - 'preserve-show-all': All radio items are shown when any item matches.
|
|
1094
|
+
* @default 'preserve'
|
|
1095
|
+
*/
|
|
1096
|
+
radioGroupSearchBehavior?: RadioGroupBehavior;
|
|
1097
|
+
/**
|
|
1098
|
+
* Whether to sort groups by their best-matching item's score.
|
|
1099
|
+
* Only applies when groupSearchBehavior: 'preserve'.
|
|
1100
|
+
* @default true
|
|
1101
|
+
*/
|
|
1102
|
+
sortGroups?: boolean;
|
|
1103
|
+
}
|
|
1104
|
+
/**
|
|
1105
|
+
* Props for the DataSurface component.
|
|
1106
|
+
*/
|
|
1107
|
+
interface DataSurfaceProps {
|
|
1108
|
+
/** The menu content (node definitions with render functions) */
|
|
1109
|
+
content?: NodeDef[];
|
|
1110
|
+
/**
|
|
1111
|
+
* Async content configuration for root-level async loading.
|
|
1112
|
+
* When provided, the Loader component will be rendered to fetch async data.
|
|
1113
|
+
* Async content is merged with static content.
|
|
1114
|
+
*/
|
|
1115
|
+
asyncContent?: AsyncLoaderConfig;
|
|
1116
|
+
/** Deep search configuration */
|
|
1117
|
+
deepSearch?: DeepSearchConfig | boolean;
|
|
1118
|
+
/** Filter function or false to disable filtering */
|
|
1119
|
+
filter?: ((value: string, search: string, keywords?: string[]) => number) | false;
|
|
1120
|
+
/** Controlled search value */
|
|
1121
|
+
search?: string;
|
|
1122
|
+
/** Callback when search value changes */
|
|
1123
|
+
onSearchChange?: (search: string) => void;
|
|
1124
|
+
/** Default search value for uncontrolled usage */
|
|
1125
|
+
defaultSearch?: string;
|
|
1126
|
+
/** Whether navigation should loop */
|
|
1127
|
+
loop?: boolean;
|
|
1128
|
+
/** Auto-highlight behavior when menu opens */
|
|
1129
|
+
autoHighlightFirst?: boolean | string;
|
|
1130
|
+
/**
|
|
1131
|
+
* Whether to clear search on close.
|
|
1132
|
+
* - `true`: clear immediately when menu closes (default)
|
|
1133
|
+
* - `false`: preserve search when menu closes
|
|
1134
|
+
* - `'after-exit'`: clear after exit animation completes
|
|
1135
|
+
*/
|
|
1136
|
+
clearSearchOnClose?: boolean | 'after-exit';
|
|
1137
|
+
/**
|
|
1138
|
+
* Function to generate qualified IDs for row items.
|
|
1139
|
+
* Called for each item when rendering to produce IDs for:
|
|
1140
|
+
* - React keys
|
|
1141
|
+
* - Store registration
|
|
1142
|
+
* - DOM id attributes
|
|
1143
|
+
*
|
|
1144
|
+
* @default Uses node.id if provided, otherwise qualifies with breadcrumbs + slugified value
|
|
1145
|
+
*/
|
|
1146
|
+
getQualifiedRowId?: GetQualifiedRowIdFn;
|
|
1147
|
+
/** Children (Input, List, etc.) */
|
|
1148
|
+
children: React.ReactNode;
|
|
1149
|
+
}
|
|
1150
|
+
/**
|
|
1151
|
+
* State passed to the DataList render function.
|
|
1152
|
+
*/
|
|
1153
|
+
interface DataListChildrenState {
|
|
1154
|
+
/** Current search query (empty string if browsing) */
|
|
1155
|
+
search: string;
|
|
1156
|
+
/**
|
|
1157
|
+
* Display nodes (filtered and scored if searching).
|
|
1158
|
+
* Can include groups (DisplayGroupNode) or radio groups (DisplayRadioGroupNode)
|
|
1159
|
+
* when groupSearchBehavior: 'preserve'.
|
|
1160
|
+
*/
|
|
1161
|
+
nodes: DisplayNode[];
|
|
1162
|
+
/**
|
|
1163
|
+
* Function to render a node.
|
|
1164
|
+
* Handles items, submenus, groups, and radio groups, calling their render functions with context.
|
|
1165
|
+
*/
|
|
1166
|
+
renderNode: (displayNode: DisplayNode) => React.ReactNode;
|
|
1167
|
+
/** Number of visible items (counting items inside groups) */
|
|
1168
|
+
count: number;
|
|
1169
|
+
/** Whether deep search is active (query length >= minLength) */
|
|
1170
|
+
isDeepSearching: boolean;
|
|
1171
|
+
/** Aggregate async loading state across all menus */
|
|
1172
|
+
async: AsyncState;
|
|
1173
|
+
}
|
|
1174
|
+
/**
|
|
1175
|
+
* Props for the DataList component.
|
|
1176
|
+
*/
|
|
1177
|
+
interface DataListProps {
|
|
1178
|
+
/**
|
|
1179
|
+
* Render function for the list content.
|
|
1180
|
+
* Receives the current state and returns JSX.
|
|
1181
|
+
*/
|
|
1182
|
+
children: (state: DataListChildrenState) => React.ReactNode;
|
|
1183
|
+
/** Accessible label for the listbox */
|
|
1184
|
+
label?: string;
|
|
1185
|
+
/** Additional class name */
|
|
1186
|
+
className?: string;
|
|
1187
|
+
/** Additional styles */
|
|
1188
|
+
style?: React.CSSProperties;
|
|
1189
|
+
/**
|
|
1190
|
+
* When true, measures row widths and applies `--row-width` CSS variable.
|
|
1191
|
+
* Keeps the list at the maximum width seen while scrolling.
|
|
1192
|
+
* Useful for virtualized lists where content width varies.
|
|
1193
|
+
* @default true
|
|
1194
|
+
*/
|
|
1195
|
+
measureRowWidth?: boolean;
|
|
1196
|
+
/**
|
|
1197
|
+
* Maximum width cap for row measurement (in pixels).
|
|
1198
|
+
* Only used when `measureRowWidth` is true.
|
|
1199
|
+
*/
|
|
1200
|
+
maxRowWidth?: number;
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
/**
|
|
1204
|
+
* Virtual anchor for positioning the menu at a specific point.
|
|
1205
|
+
* Used by ContextMenu to position at cursor location.
|
|
1206
|
+
*/
|
|
1207
|
+
interface VirtualAnchor {
|
|
1208
|
+
getBoundingClientRect(): DOMRect;
|
|
1209
|
+
}
|
|
1210
|
+
/**
|
|
1211
|
+
* Virtualization configuration passed from Root/Submenu to Surface.
|
|
1212
|
+
*/
|
|
1213
|
+
interface VirtualizationConfig {
|
|
1214
|
+
/** Whether virtualization mode is enabled */
|
|
1215
|
+
virtualized: boolean;
|
|
1216
|
+
/** Pre-registered items for virtualization */
|
|
1217
|
+
items: VirtualItem[];
|
|
1218
|
+
/**
|
|
1219
|
+
* Callback when highlighted item changes (for scroll sync).
|
|
1220
|
+
* The third parameter contains event details including the reason for the change.
|
|
1221
|
+
*/
|
|
1222
|
+
onHighlightChange?: (id: string | null, index: number, eventDetails: HighlightChangeEventDetails) => void;
|
|
1223
|
+
}
|
|
1224
|
+
/**
|
|
1225
|
+
* Shared context value for popup menus.
|
|
1226
|
+
* Both DropdownMenu.Root and ContextMenu.Root provide this context.
|
|
1227
|
+
*/
|
|
1228
|
+
interface PopupMenuContextValue {
|
|
1229
|
+
/** The Listbox store instance */
|
|
1230
|
+
store: ListboxStore;
|
|
1231
|
+
/** Nesting depth: 0 = root menu, 1+ = submenu */
|
|
1232
|
+
depth: number;
|
|
1233
|
+
/** Close the entire menu tree (deepest submenu to root, sequentially) */
|
|
1234
|
+
closeAll: (reason?: PopupMenuOpenChangeReason, event?: Event) => void;
|
|
1235
|
+
/** Register a surface (submenu) for closeAll tracking. Returns unregister function. */
|
|
1236
|
+
registerSurface: (depth: number, setOpen: (open: boolean) => void) => () => void;
|
|
1237
|
+
/** Virtualization configuration (if enabled) */
|
|
1238
|
+
virtualization?: VirtualizationConfig;
|
|
1239
|
+
/**
|
|
1240
|
+
* Virtual anchor for positioning.
|
|
1241
|
+
* Used by ContextMenu to position at cursor location.
|
|
1242
|
+
* DropdownMenu uses the Popover's anchor (trigger button) instead.
|
|
1243
|
+
*/
|
|
1244
|
+
virtualAnchor?: VirtualAnchor;
|
|
1245
|
+
/**
|
|
1246
|
+
* Type of menu for positioning logic.
|
|
1247
|
+
* - 'dropdown': positions relative to trigger button
|
|
1248
|
+
* - 'context': positions at cursor with fixed positioning
|
|
1249
|
+
*/
|
|
1250
|
+
menuType: 'dropdown' | 'context';
|
|
1251
|
+
/**
|
|
1252
|
+
* When to close the menu on outside interactions.
|
|
1253
|
+
* - 'pointerdown': Close immediately when pointer is pressed outside (default)
|
|
1254
|
+
* - 'click': Close when a full click (pointerdown + pointerup) occurs outside
|
|
1255
|
+
* @default 'pointerdown'
|
|
1256
|
+
*/
|
|
1257
|
+
closeOnOutsidePress: 'click' | 'pointerdown';
|
|
1258
|
+
/**
|
|
1259
|
+
* Function to generate qualified unique IDs for rows.
|
|
1260
|
+
* Defined once at the root level and applied to all surfaces (root and submenus).
|
|
1261
|
+
* If not provided, uses the default implementation.
|
|
1262
|
+
*/
|
|
1263
|
+
getQualifiedRowId?: GetQualifiedRowIdFn;
|
|
1264
|
+
}
|
|
1265
|
+
declare const PopupMenuContext: React.Context<PopupMenuContextValue | null>;
|
|
1266
|
+
/**
|
|
1267
|
+
* Hook to access the popup menu context.
|
|
1268
|
+
* Throws if used outside a popup menu.
|
|
1269
|
+
*/
|
|
1270
|
+
declare function usePopupMenuContext(): PopupMenuContextValue;
|
|
1271
|
+
/**
|
|
1272
|
+
* Hook to optionally access the popup menu context.
|
|
1273
|
+
* Returns null if used outside a popup menu.
|
|
1274
|
+
*/
|
|
1275
|
+
declare function useMaybePopupMenuContext(): PopupMenuContextValue | null;
|
|
1276
|
+
|
|
1277
|
+
interface SubmenuContextValue {
|
|
1278
|
+
/** Whether the submenu is open */
|
|
1279
|
+
open: boolean;
|
|
1280
|
+
/** Set the submenu open state */
|
|
1281
|
+
setOpen: (open: boolean) => void;
|
|
1282
|
+
/** Reference to the trigger element */
|
|
1283
|
+
triggerRef: React.RefObject<HTMLElement | null>;
|
|
1284
|
+
/** Reference to the submenu content element (for aim guard rect calculations) */
|
|
1285
|
+
contentRef: React.RefObject<HTMLElement | null>;
|
|
1286
|
+
/** Surface ID of the parent menu (for keyboard navigation back) */
|
|
1287
|
+
parentSurfaceId: string;
|
|
1288
|
+
/** Surface ID of this submenu (for keyboard navigation into) */
|
|
1289
|
+
childSurfaceId: string;
|
|
1290
|
+
/**
|
|
1291
|
+
* Whether pressing Escape in this submenu closes the entire menu from the root.
|
|
1292
|
+
* When true, Escape closes the entire menu tree.
|
|
1293
|
+
* When false, Escape only closes this submenu and moves focus to the parent.
|
|
1294
|
+
* @default true
|
|
1295
|
+
*/
|
|
1296
|
+
closeRootOnEsc: boolean;
|
|
1297
|
+
}
|
|
1298
|
+
declare const SubmenuContext: React.Context<SubmenuContextValue | null>;
|
|
1299
|
+
declare function useSubmenuContext(): SubmenuContextValue;
|
|
1300
|
+
declare function useMaybeSubmenuContext(): SubmenuContextValue | null;
|
|
1301
|
+
|
|
1302
|
+
interface PopupMenuArrowProps extends PopoverArrowProps {
|
|
1303
|
+
}
|
|
1304
|
+
/**
|
|
1305
|
+
* An optional arrow element to render alongside the popup menu.
|
|
1306
|
+
* This can be used to help visually link the trigger with the popup.
|
|
1307
|
+
* Must be rendered inside `Popup`.
|
|
1308
|
+
* Renders a `<div>` element.
|
|
1309
|
+
*/
|
|
1310
|
+
declare const PopupMenuArrow: React.ForwardRefExoticComponent<PopupMenuArrowProps & React.RefAttributes<HTMLDivElement>>;
|
|
1311
|
+
declare namespace PopupMenuArrow {
|
|
1312
|
+
type Props = PopupMenuArrowProps;
|
|
1313
|
+
type State = Popover.Arrow.State;
|
|
1314
|
+
}
|
|
1315
|
+
|
|
1316
|
+
interface PopupMenuBackdropProps extends PopoverBackdropProps {
|
|
1317
|
+
/**
|
|
1318
|
+
* Controls when the backdrop becomes visible for submenus.
|
|
1319
|
+
* - `"focus"`: Show when the submenu becomes the focus owner (prevents flicker on hover).
|
|
1320
|
+
* If a deeper submenu is open, the backdrop remains visible.
|
|
1321
|
+
* - `"open"`: Show as soon as the submenu opens, regardless of focus.
|
|
1322
|
+
*
|
|
1323
|
+
* @default "focus" for submenus, "open" for root menu
|
|
1324
|
+
*/
|
|
1325
|
+
showOn?: 'focus' | 'open';
|
|
1326
|
+
}
|
|
1327
|
+
/**
|
|
1328
|
+
* An overlay displayed beneath the popup menu.
|
|
1329
|
+
*
|
|
1330
|
+
* For submenus with `showOn="focus"` (default), the backdrop visibility follows these rules:
|
|
1331
|
+
* - If this submenu is at the end of the open chain (deepest), it must be
|
|
1332
|
+
* the focus owner to show the backdrop (prevents flicker on hover)
|
|
1333
|
+
* - If this submenu is in the chain but not at the end (has a deeper submenu open),
|
|
1334
|
+
* the backdrop remains visible
|
|
1335
|
+
*
|
|
1336
|
+
* With `showOn="open"`, the backdrop shows as soon as the submenu opens.
|
|
1337
|
+
*
|
|
1338
|
+
* Renders a `<div>` element with `pointer-events: none`.
|
|
1339
|
+
*/
|
|
1340
|
+
declare const PopupMenuBackdrop: React.ForwardRefExoticComponent<PopupMenuBackdropProps & React.RefAttributes<HTMLDivElement>>;
|
|
1341
|
+
declare namespace PopupMenuBackdrop {
|
|
1342
|
+
type Props = PopupMenuBackdropProps;
|
|
1343
|
+
type State = Popover.Backdrop.State;
|
|
1344
|
+
}
|
|
1345
|
+
|
|
1346
|
+
interface PopupMenuPopupState extends Popover.Popup.State {
|
|
1347
|
+
/**
|
|
1348
|
+
* Whether this popup is a submenu (not the root menu).
|
|
1349
|
+
*/
|
|
1350
|
+
isSubmenu: boolean;
|
|
1351
|
+
}
|
|
1352
|
+
interface PopupMenuPopupProps extends Omit<PopoverPopupProps, 'className'> {
|
|
1353
|
+
/**
|
|
1354
|
+
* CSS class applied to the element, or a function that
|
|
1355
|
+
* returns a class based on the component's state.
|
|
1356
|
+
*/
|
|
1357
|
+
className?: string | ((state: PopupMenuPopupState) => string);
|
|
1358
|
+
}
|
|
1359
|
+
/**
|
|
1360
|
+
* A container for the popup menu contents.
|
|
1361
|
+
* Wraps Popover.Popup with:
|
|
1362
|
+
* - Aim guard clearing when pointer enters submenu
|
|
1363
|
+
* - Focus ownership transfer when pointer enters submenu
|
|
1364
|
+
* - Auto-focus disabled for submenus (focus managed by FocusOwner system)
|
|
1365
|
+
*
|
|
1366
|
+
* Renders a `<div>` element.
|
|
1367
|
+
*/
|
|
1368
|
+
declare const PopupMenuPopup: React.ForwardRefExoticComponent<PopupMenuPopupProps & React.RefAttributes<HTMLDivElement>>;
|
|
1369
|
+
declare namespace PopupMenuPopup {
|
|
1370
|
+
type Props = PopupMenuPopupProps;
|
|
1371
|
+
type State = PopupMenuPopupState;
|
|
1372
|
+
}
|
|
1373
|
+
|
|
1374
|
+
interface PopupMenuPortalProps extends PopoverPortalProps {
|
|
1375
|
+
}
|
|
1376
|
+
/**
|
|
1377
|
+
* A portal element that moves the popup to a different part of the DOM.
|
|
1378
|
+
* By default, the portal element is appended to `<body>`.
|
|
1379
|
+
*/
|
|
1380
|
+
declare const PopupMenuPortal: React.ForwardRefExoticComponent<PopoverPortalProps & React.RefAttributes<HTMLDivElement>>;
|
|
1381
|
+
declare namespace PopupMenuPortal {
|
|
1382
|
+
type Props = PopoverPortalProps;
|
|
1383
|
+
type State = Popover.Portal.State;
|
|
1384
|
+
}
|
|
1385
|
+
|
|
1386
|
+
declare enum PopupMenuPositionerCssVars {
|
|
1387
|
+
/**
|
|
1388
|
+
* The available width between the trigger and the edge of the viewport.
|
|
1389
|
+
* @type {number}
|
|
1390
|
+
*/
|
|
1391
|
+
availableWidth = "--available-width",
|
|
1392
|
+
/**
|
|
1393
|
+
* The available height between the trigger and the edge of the viewport.
|
|
1394
|
+
* @type {number}
|
|
1395
|
+
*/
|
|
1396
|
+
availableHeight = "--available-height",
|
|
1397
|
+
/**
|
|
1398
|
+
* The anchor's width.
|
|
1399
|
+
* @type {number}
|
|
1400
|
+
*/
|
|
1401
|
+
anchorWidth = "--anchor-width",
|
|
1402
|
+
/**
|
|
1403
|
+
* The anchor's height.
|
|
1404
|
+
* @type {number}
|
|
1405
|
+
*/
|
|
1406
|
+
anchorHeight = "--anchor-height",
|
|
1407
|
+
/**
|
|
1408
|
+
* The coordinates that this element is anchored to. Used for animations and transitions.
|
|
1409
|
+
* @type {string}
|
|
1410
|
+
*/
|
|
1411
|
+
transformOrigin = "--transform-origin",
|
|
1412
|
+
/**
|
|
1413
|
+
* The width of the positioner element.
|
|
1414
|
+
* @type {number}
|
|
1415
|
+
*/
|
|
1416
|
+
positionerWidth = "--positioner-width",
|
|
1417
|
+
/**
|
|
1418
|
+
* The height of the positioner element.
|
|
1419
|
+
* @type {number}
|
|
1420
|
+
*/
|
|
1421
|
+
positionerHeight = "--positioner-height"
|
|
1422
|
+
}
|
|
1423
|
+
|
|
1424
|
+
/**
|
|
1425
|
+
* Extended align options for popup menus.
|
|
1426
|
+
* - 'start' | 'center' | 'end': Standard Base UI alignment
|
|
1427
|
+
* - 'list-start': Align trigger top with the top of the List component (horizontal sides only)
|
|
1428
|
+
*/
|
|
1429
|
+
type PopupMenuPositionerAlign = PopoverPositionerProps['align'] | 'list-start';
|
|
1430
|
+
interface PopupMenuPositionerProps extends Omit<PopoverPositionerProps, 'align' | 'style'> {
|
|
1431
|
+
/**
|
|
1432
|
+
* Override the virtual anchor from context.
|
|
1433
|
+
* Useful for nested menus that need different positioning.
|
|
1434
|
+
*/
|
|
1435
|
+
virtualAnchor?: {
|
|
1436
|
+
getBoundingClientRect(): DOMRect;
|
|
1437
|
+
};
|
|
1438
|
+
/**
|
|
1439
|
+
* How to align the popup relative to the specified side.
|
|
1440
|
+
* - 'start': align to start of anchor
|
|
1441
|
+
* - 'center': align to center of anchor
|
|
1442
|
+
* - 'end': align to end of anchor
|
|
1443
|
+
* - 'list-start': align the List component's top with the anchor top (horizontal sides only)
|
|
1444
|
+
* @default 'start' for submenus, 'center' for root dropdowns
|
|
1445
|
+
*/
|
|
1446
|
+
align?: PopupMenuPositionerAlign;
|
|
1447
|
+
/**
|
|
1448
|
+
* Custom styles for the positioner.
|
|
1449
|
+
* Note: During list-start alignment measurement, `transition: 'none'` is
|
|
1450
|
+
* temporarily applied to prevent visual flash.
|
|
1451
|
+
*/
|
|
1452
|
+
style?: React.CSSProperties;
|
|
1453
|
+
}
|
|
1454
|
+
/**
|
|
1455
|
+
* Positions the popup menu against its anchor.
|
|
1456
|
+
* Wraps Popover.Positioner with:
|
|
1457
|
+
* - Automatic virtualAnchor from PopupMenuContext (for context menus)
|
|
1458
|
+
* - Smart default positioning based on depth and menu type
|
|
1459
|
+
* - Smart collision avoidance: shift for horizontal menus, flip for vertical
|
|
1460
|
+
* - 'list-start' alignment for horizontal submenus
|
|
1461
|
+
*
|
|
1462
|
+
* Renders a `<div>` element.
|
|
1463
|
+
*/
|
|
1464
|
+
declare const PopupMenuPositioner: React.ForwardRefExoticComponent<PopupMenuPositionerProps & React.RefAttributes<HTMLDivElement>>;
|
|
1465
|
+
declare namespace PopupMenuPositioner {
|
|
1466
|
+
type Props = PopupMenuPositionerProps;
|
|
1467
|
+
type State = Popover.Positioner.State;
|
|
1468
|
+
}
|
|
1469
|
+
|
|
1470
|
+
interface UsePopupMenuItemParams extends Omit<UseListboxItemParams, 'aimGuard' | 'onAfterSelect'> {
|
|
1471
|
+
/**
|
|
1472
|
+
* Whether clicking this item should close the menu.
|
|
1473
|
+
* @default true
|
|
1474
|
+
*/
|
|
1475
|
+
closeOnClick?: boolean;
|
|
1476
|
+
}
|
|
1477
|
+
type UsePopupMenuItemReturn = UseListboxItemReturn;
|
|
1478
|
+
/**
|
|
1479
|
+
* Hook that provides all shared logic for navigatable/highlightable popup menu items.
|
|
1480
|
+
* This is a thin wrapper around useListboxItem that automatically adds aim-guard
|
|
1481
|
+
* support and handles close-on-click behavior.
|
|
1482
|
+
*
|
|
1483
|
+
* @see useListboxItem for full documentation
|
|
1484
|
+
*/
|
|
1485
|
+
declare function usePopupMenuItem(params: UsePopupMenuItemParams): UsePopupMenuItemReturn;
|
|
1486
|
+
|
|
1487
|
+
interface PopupMenuIconState extends Record<string, unknown> {
|
|
1488
|
+
/**
|
|
1489
|
+
* Whether the popup is currently open.
|
|
1490
|
+
*/
|
|
1491
|
+
open: boolean;
|
|
1492
|
+
}
|
|
1493
|
+
interface PopupMenuIconProps extends ComponentProps<'span', PopupMenuIcon.State> {
|
|
1494
|
+
}
|
|
1495
|
+
/**
|
|
1496
|
+
* An icon that indicates the trigger opens a popup.
|
|
1497
|
+
* Typically used inside the trigger to show a chevron or dropdown arrow.
|
|
1498
|
+
* Renders a `<span>` element.
|
|
1499
|
+
*/
|
|
1500
|
+
declare const PopupMenuIcon: React.ForwardRefExoticComponent<Omit<PopupMenuIcon.Props, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
1501
|
+
declare namespace PopupMenuIcon {
|
|
1502
|
+
type State = PopupMenuIconState;
|
|
1503
|
+
interface Props extends PopupMenuIconProps {
|
|
1504
|
+
}
|
|
1505
|
+
}
|
|
1506
|
+
|
|
1507
|
+
interface PopupMenuEmptyState extends Record<string, unknown> {
|
|
1508
|
+
}
|
|
1509
|
+
interface PopupMenuEmptyProps extends ComponentProps<'div', PopupMenuEmpty.State> {
|
|
1510
|
+
children: React.ReactNode;
|
|
1511
|
+
}
|
|
1512
|
+
/**
|
|
1513
|
+
* Renders when no items match the current search query.
|
|
1514
|
+
* Only visible when there's an active search with zero results.
|
|
1515
|
+
* Renders a `<div>` element.
|
|
1516
|
+
*/
|
|
1517
|
+
declare const PopupMenuEmpty: React.ForwardRefExoticComponent<Omit<PopupMenuEmpty.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1518
|
+
declare namespace PopupMenuEmpty {
|
|
1519
|
+
type State = PopupMenuEmptyState;
|
|
1520
|
+
interface Props extends PopupMenuEmptyProps {
|
|
1521
|
+
}
|
|
1522
|
+
}
|
|
1523
|
+
|
|
1524
|
+
interface PopupMenuInputState extends Record<string, unknown> {
|
|
1525
|
+
/**
|
|
1526
|
+
* Whether the input is active (visible).
|
|
1527
|
+
* Only relevant when `hideUntilActive` is true.
|
|
1528
|
+
*/
|
|
1529
|
+
active: boolean;
|
|
1530
|
+
}
|
|
1531
|
+
interface PopupMenuInputProps extends Omit<ComponentProps<'input', PopupMenuInput.State>, 'value' | 'onChange' | 'type'> {
|
|
1532
|
+
/**
|
|
1533
|
+
* Controlled value for the search input.
|
|
1534
|
+
* If provided, this takes precedence over the Surface's search state.
|
|
1535
|
+
*/
|
|
1536
|
+
value?: string;
|
|
1537
|
+
/**
|
|
1538
|
+
* Callback when the input value changes.
|
|
1539
|
+
*/
|
|
1540
|
+
onValueChange?: (value: string) => void;
|
|
1541
|
+
/**
|
|
1542
|
+
* When true, the input is not rendered until the user starts typing.
|
|
1543
|
+
* The List receives focus initially, and typing a character activates the input.
|
|
1544
|
+
* Once activated, the input stays visible until the menu closes.
|
|
1545
|
+
* @default false
|
|
1546
|
+
*/
|
|
1547
|
+
hideUntilActive?: boolean;
|
|
1548
|
+
}
|
|
1549
|
+
/**
|
|
1550
|
+
* Search input for filtering popup menu items.
|
|
1551
|
+
* Handles keyboard navigation (Arrow keys, Ctrl+N/P, Enter).
|
|
1552
|
+
* Renders an `<input>` element.
|
|
1553
|
+
*/
|
|
1554
|
+
declare const PopupMenuInput: React.ForwardRefExoticComponent<Omit<PopupMenuInput.Props, "ref"> & React.RefAttributes<HTMLInputElement>>;
|
|
1555
|
+
declare namespace PopupMenuInput {
|
|
1556
|
+
type State = PopupMenuInputState;
|
|
1557
|
+
interface Props extends PopupMenuInputProps {
|
|
1558
|
+
}
|
|
1559
|
+
}
|
|
1560
|
+
|
|
1561
|
+
/**
|
|
1562
|
+
* CSS custom properties applied to the List component.
|
|
1563
|
+
*/
|
|
1564
|
+
declare enum PopupMenuListCssVars {
|
|
1565
|
+
/**
|
|
1566
|
+
* The maximum measured row width.
|
|
1567
|
+
* Applied when `measureRowWidth` is true.
|
|
1568
|
+
* Useful for keeping virtualized lists at a consistent width.
|
|
1569
|
+
* @type {number}
|
|
1570
|
+
*/
|
|
1571
|
+
rowWidth = "--row-width"
|
|
1572
|
+
}
|
|
1573
|
+
|
|
1574
|
+
/**
|
|
1575
|
+
* State passed to children render function.
|
|
1576
|
+
*/
|
|
1577
|
+
interface PopupMenuListChildrenState {
|
|
1578
|
+
/** Current search query */
|
|
1579
|
+
search: string;
|
|
1580
|
+
/** Number of items matching the current filter */
|
|
1581
|
+
filteredCount: number;
|
|
1582
|
+
}
|
|
1583
|
+
interface PopupMenuListState extends Record<string, unknown> {
|
|
1584
|
+
}
|
|
1585
|
+
interface PopupMenuListProps extends Omit<ComponentProps<'div', PopupMenuList.State>, 'children'> {
|
|
1586
|
+
/**
|
|
1587
|
+
* Content to render inside the list.
|
|
1588
|
+
* Can be a render function that receives the current search state.
|
|
1589
|
+
*/
|
|
1590
|
+
children: React.ReactNode | ((state: PopupMenuListChildrenState) => React.ReactNode);
|
|
1591
|
+
/**
|
|
1592
|
+
* Accessible label for the listbox.
|
|
1593
|
+
* @default 'Suggestions'
|
|
1594
|
+
*/
|
|
1595
|
+
label?: string;
|
|
1596
|
+
/**
|
|
1597
|
+
* When true, measures row widths and applies `--row-width` CSS variable.
|
|
1598
|
+
* Keeps the list at the maximum width seen while scrolling.
|
|
1599
|
+
* Useful for virtualized lists where content width varies.
|
|
1600
|
+
* @default true
|
|
1601
|
+
*/
|
|
1602
|
+
measureRowWidth?: boolean;
|
|
1603
|
+
/**
|
|
1604
|
+
* Maximum width cap for row measurement (in pixels).
|
|
1605
|
+
* Only used when `measureRowWidth` is true.
|
|
1606
|
+
*/
|
|
1607
|
+
maxRowWidth?: number;
|
|
1608
|
+
}
|
|
1609
|
+
/**
|
|
1610
|
+
* Container for popup menu items.
|
|
1611
|
+
* Supports render props for accessing search state.
|
|
1612
|
+
* Renders a `<div>` element with role="listbox".
|
|
1613
|
+
*/
|
|
1614
|
+
declare const PopupMenuList: React.ForwardRefExoticComponent<Omit<PopupMenuList.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1615
|
+
declare namespace PopupMenuList {
|
|
1616
|
+
type State = PopupMenuListState;
|
|
1617
|
+
type ChildrenState = PopupMenuListChildrenState;
|
|
1618
|
+
interface Props extends PopupMenuListProps {
|
|
1619
|
+
}
|
|
1620
|
+
}
|
|
1621
|
+
|
|
1622
|
+
type Direction = 'up' | 'down';
|
|
1623
|
+
interface PopupMenuScrollArrowState extends Record<string, unknown> {
|
|
1624
|
+
/**
|
|
1625
|
+
* The scroll direction this arrow controls.
|
|
1626
|
+
*/
|
|
1627
|
+
direction: Direction;
|
|
1628
|
+
/**
|
|
1629
|
+
* Whether there is content to scroll in this direction.
|
|
1630
|
+
*/
|
|
1631
|
+
visible: boolean;
|
|
1632
|
+
}
|
|
1633
|
+
interface PopupMenuScrollArrowProps extends ComponentProps<'div', PopupMenuScrollArrow.State> {
|
|
1634
|
+
/**
|
|
1635
|
+
* The direction to scroll when hovering over this arrow.
|
|
1636
|
+
*/
|
|
1637
|
+
direction: Direction;
|
|
1638
|
+
/**
|
|
1639
|
+
* Whether to keep the element mounted when there's nothing to scroll.
|
|
1640
|
+
* When false (default), the element is not rendered.
|
|
1641
|
+
* When true, the element is rendered but can be styled via `data-visible="false"`.
|
|
1642
|
+
* @default false
|
|
1643
|
+
*/
|
|
1644
|
+
keepMounted?: boolean;
|
|
1645
|
+
/**
|
|
1646
|
+
* Scroll speed in pixels per frame.
|
|
1647
|
+
* @default 10
|
|
1648
|
+
*/
|
|
1649
|
+
scrollSpeed?: number;
|
|
1650
|
+
}
|
|
1651
|
+
/**
|
|
1652
|
+
* Base scroll arrow component used by ScrollUpArrow and ScrollDownArrow.
|
|
1653
|
+
* Shows when there is content to scroll in the specified direction.
|
|
1654
|
+
* Scrolls the list continuously while pointer is over it.
|
|
1655
|
+
* Renders a `<div>` element.
|
|
1656
|
+
*/
|
|
1657
|
+
declare const PopupMenuScrollArrow: React.ForwardRefExoticComponent<Omit<PopupMenuScrollArrow.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1658
|
+
declare namespace PopupMenuScrollArrow {
|
|
1659
|
+
type State = PopupMenuScrollArrowState;
|
|
1660
|
+
interface Props extends PopupMenuScrollArrowProps {
|
|
1661
|
+
}
|
|
1662
|
+
}
|
|
1663
|
+
interface PopupMenuScrollUpArrowProps extends Omit<PopupMenuScrollArrowProps, 'direction'> {
|
|
1664
|
+
}
|
|
1665
|
+
/**
|
|
1666
|
+
* A scroll indicator that appears when there's content above.
|
|
1667
|
+
* Scrolls the list up continuously while pointer is over it.
|
|
1668
|
+
* Renders a `<div>` element.
|
|
1669
|
+
*/
|
|
1670
|
+
declare const PopupMenuScrollUpArrow: React.ForwardRefExoticComponent<Omit<PopupMenuScrollUpArrow.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1671
|
+
declare namespace PopupMenuScrollUpArrow {
|
|
1672
|
+
type State = PopupMenuScrollArrowState;
|
|
1673
|
+
interface Props extends PopupMenuScrollUpArrowProps {
|
|
1674
|
+
}
|
|
1675
|
+
}
|
|
1676
|
+
interface PopupMenuScrollDownArrowProps extends Omit<PopupMenuScrollArrowProps, 'direction'> {
|
|
1677
|
+
}
|
|
1678
|
+
/**
|
|
1679
|
+
* A scroll indicator that appears when there's content below.
|
|
1680
|
+
* Scrolls the list down continuously while pointer is over it.
|
|
1681
|
+
* Renders a `<div>` element.
|
|
1682
|
+
*/
|
|
1683
|
+
declare const PopupMenuScrollDownArrow: React.ForwardRefExoticComponent<Omit<PopupMenuScrollDownArrow.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1684
|
+
declare namespace PopupMenuScrollDownArrow {
|
|
1685
|
+
type State = PopupMenuScrollArrowState;
|
|
1686
|
+
interface Props extends PopupMenuScrollDownArrowProps {
|
|
1687
|
+
}
|
|
1688
|
+
}
|
|
1689
|
+
|
|
1690
|
+
interface PopupMenuSurfaceState extends Record<string, unknown> {
|
|
1691
|
+
}
|
|
1692
|
+
interface PopupMenuSurfaceProps extends ComponentProps<'div', PopupMenuSurface.State> {
|
|
1693
|
+
/**
|
|
1694
|
+
* Filter function for matching items against search query.
|
|
1695
|
+
* Returns a score between 0 and 1 (0 = no match, > 0 = match).
|
|
1696
|
+
* Pass `false` to disable filtering entirely.
|
|
1697
|
+
* @default commandScore (fuzzy matching)
|
|
1698
|
+
*/
|
|
1699
|
+
filter?: FilterFn | false;
|
|
1700
|
+
/**
|
|
1701
|
+
* Controlled search value.
|
|
1702
|
+
*/
|
|
1703
|
+
search?: string;
|
|
1704
|
+
/**
|
|
1705
|
+
* Callback when search value changes.
|
|
1706
|
+
*/
|
|
1707
|
+
onSearchChange?: (search: string) => void;
|
|
1708
|
+
/**
|
|
1709
|
+
* Default search value for uncontrolled usage.
|
|
1710
|
+
* @default ''
|
|
1711
|
+
*/
|
|
1712
|
+
defaultSearch?: string;
|
|
1713
|
+
/**
|
|
1714
|
+
* Whether navigation should loop from last to first item and vice versa.
|
|
1715
|
+
* @default true
|
|
1716
|
+
*/
|
|
1717
|
+
loop?: boolean;
|
|
1718
|
+
/**
|
|
1719
|
+
* Controls auto-highlighting behavior when the menu opens.
|
|
1720
|
+
* - `true`: highlight the first item (default)
|
|
1721
|
+
* - `false`: don't auto-highlight any item
|
|
1722
|
+
* - `string`: highlight the item with this specific value
|
|
1723
|
+
* @default true
|
|
1724
|
+
*/
|
|
1725
|
+
autoHighlightFirst?: boolean | string;
|
|
1726
|
+
/**
|
|
1727
|
+
* Whether to clear the search query when the menu closes.
|
|
1728
|
+
* - `true`: clear immediately when menu closes (default)
|
|
1729
|
+
* - `false`: preserve search when menu closes
|
|
1730
|
+
* - `'after-exit'`: clear after exit animation completes
|
|
1731
|
+
* @default true
|
|
1732
|
+
*/
|
|
1733
|
+
clearSearchOnClose?: boolean | 'after-exit';
|
|
1734
|
+
/**
|
|
1735
|
+
* Whether to skip auto-focusing the input/list when this surface becomes the focus owner.
|
|
1736
|
+
* Useful for Combobox where the input is outside the popup and should retain focus.
|
|
1737
|
+
* @default false
|
|
1738
|
+
*/
|
|
1739
|
+
skipAutoFocus?: boolean;
|
|
1740
|
+
/**
|
|
1741
|
+
* Ordered list of item values when using `filter={false}`.
|
|
1742
|
+
* This tells the store the intended display order for navigation/highlighting.
|
|
1743
|
+
* Required when `filter={false}` - must always be provided with the current visible items.
|
|
1744
|
+
*/
|
|
1745
|
+
orderedItems?: string[];
|
|
1746
|
+
children: React.ReactNode;
|
|
1747
|
+
}
|
|
1748
|
+
/**
|
|
1749
|
+
* Provides search context and manages item registration for popup menu.
|
|
1750
|
+
* Place inside PopupMenu.Popup to enable search functionality.
|
|
1751
|
+
* Renders a `<div>` element.
|
|
1752
|
+
*/
|
|
1753
|
+
declare const PopupMenuSurface: React.ForwardRefExoticComponent<Omit<PopupMenuSurface.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1754
|
+
declare namespace PopupMenuSurface {
|
|
1755
|
+
type State = PopupMenuSurfaceState;
|
|
1756
|
+
interface Props extends PopupMenuSurfaceProps {
|
|
1757
|
+
}
|
|
1758
|
+
}
|
|
1759
|
+
|
|
1760
|
+
interface PopupMenuCheckboxItemIndicatorState extends Record<string, unknown> {
|
|
1761
|
+
/**
|
|
1762
|
+
* Whether the parent checkbox item is currently checked.
|
|
1763
|
+
*/
|
|
1764
|
+
checked: boolean;
|
|
1765
|
+
/**
|
|
1766
|
+
* Whether the parent checkbox item is currently highlighted.
|
|
1767
|
+
*/
|
|
1768
|
+
highlighted: boolean;
|
|
1769
|
+
/**
|
|
1770
|
+
* Whether the parent checkbox item is disabled.
|
|
1771
|
+
*/
|
|
1772
|
+
disabled: boolean;
|
|
1773
|
+
/**
|
|
1774
|
+
* Toggle the checked state without triggering closeOnClick.
|
|
1775
|
+
* Useful when you want clicking directly on the indicator to toggle
|
|
1776
|
+
* without closing the menu.
|
|
1777
|
+
*/
|
|
1778
|
+
toggle: () => void;
|
|
1779
|
+
}
|
|
1780
|
+
interface PopupMenuCheckboxItemIndicatorProps extends ComponentProps<'span', PopupMenuCheckboxItemIndicator.State> {
|
|
1781
|
+
/**
|
|
1782
|
+
* Whether to keep the indicator mounted in the DOM when unchecked.
|
|
1783
|
+
* Useful for animations.
|
|
1784
|
+
* @default false
|
|
1785
|
+
*/
|
|
1786
|
+
keepMounted?: boolean;
|
|
1787
|
+
}
|
|
1788
|
+
/**
|
|
1789
|
+
* A visual indicator that shows when a CheckboxItem is checked.
|
|
1790
|
+
* Must be used within a CheckboxItem component.
|
|
1791
|
+
* Renders a `<span>` element with aria-hidden="true".
|
|
1792
|
+
*/
|
|
1793
|
+
declare const PopupMenuCheckboxItemIndicator: React.ForwardRefExoticComponent<Omit<PopupMenuCheckboxItemIndicator.Props, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
1794
|
+
declare namespace PopupMenuCheckboxItemIndicator {
|
|
1795
|
+
type State = PopupMenuCheckboxItemIndicatorState;
|
|
1796
|
+
interface Props extends PopupMenuCheckboxItemIndicatorProps {
|
|
1797
|
+
}
|
|
1798
|
+
}
|
|
1799
|
+
|
|
1800
|
+
interface PopupMenuRadioGroupValueProps {
|
|
1801
|
+
/**
|
|
1802
|
+
* The controlled selected value.
|
|
1803
|
+
*/
|
|
1804
|
+
value: string | undefined;
|
|
1805
|
+
/**
|
|
1806
|
+
* Callback fired when the selected value changes.
|
|
1807
|
+
* The second parameter contains event details including the reason for the change.
|
|
1808
|
+
*/
|
|
1809
|
+
onValueChange?: (value: string, eventDetails: RadioValueChangeEventDetails) => void;
|
|
1810
|
+
/**
|
|
1811
|
+
* Whether all items in this group are disabled.
|
|
1812
|
+
* @default false
|
|
1813
|
+
*/
|
|
1814
|
+
disabled?: boolean;
|
|
1815
|
+
/**
|
|
1816
|
+
* Children to render within the radio group context.
|
|
1817
|
+
*/
|
|
1818
|
+
children: React.ReactNode;
|
|
1819
|
+
}
|
|
1820
|
+
/**
|
|
1821
|
+
* Headless provider for radio group state.
|
|
1822
|
+
* Use this to wrap DataSurface when using RadioItems in deep search.
|
|
1823
|
+
* Does not render any DOM element - only provides context.
|
|
1824
|
+
*
|
|
1825
|
+
* @example
|
|
1826
|
+
* ```tsx
|
|
1827
|
+
* const [theme, setTheme] = useState('light')
|
|
1828
|
+
*
|
|
1829
|
+
* <DropdownMenu.RadioGroupValue value={theme} onValueChange={setTheme}>
|
|
1830
|
+
* <DropdownMenu.DataSurface content={content}>
|
|
1831
|
+
* ...
|
|
1832
|
+
* </DropdownMenu.DataSurface>
|
|
1833
|
+
* </DropdownMenu.RadioGroupValue>
|
|
1834
|
+
* ```
|
|
1835
|
+
*/
|
|
1836
|
+
declare function PopupMenuRadioGroupValue(props: PopupMenuRadioGroupValueProps): react_jsx_runtime.JSX.Element;
|
|
1837
|
+
declare namespace PopupMenuRadioGroupValue {
|
|
1838
|
+
interface Props extends PopupMenuRadioGroupValueProps {
|
|
1839
|
+
}
|
|
1840
|
+
}
|
|
1841
|
+
|
|
1842
|
+
interface PopupMenuRadioItemIndicatorState extends Record<string, unknown> {
|
|
1843
|
+
/**
|
|
1844
|
+
* Whether the parent radio item is currently selected/checked.
|
|
1845
|
+
*/
|
|
1846
|
+
checked: boolean;
|
|
1847
|
+
/**
|
|
1848
|
+
* Whether the parent radio item is currently highlighted.
|
|
1849
|
+
*/
|
|
1850
|
+
highlighted: boolean;
|
|
1851
|
+
/**
|
|
1852
|
+
* Whether the parent radio item is disabled.
|
|
1853
|
+
*/
|
|
1854
|
+
disabled: boolean;
|
|
1855
|
+
}
|
|
1856
|
+
interface PopupMenuRadioItemIndicatorProps extends ComponentProps<'span', PopupMenuRadioItemIndicator.State> {
|
|
1857
|
+
/**
|
|
1858
|
+
* Whether to keep the indicator mounted in the DOM when unchecked.
|
|
1859
|
+
* Useful for animations.
|
|
1860
|
+
* @default false
|
|
1861
|
+
*/
|
|
1862
|
+
keepMounted?: boolean;
|
|
1863
|
+
}
|
|
1864
|
+
/**
|
|
1865
|
+
* A visual indicator that shows when a RadioItem is selected.
|
|
1866
|
+
* Must be used within a RadioItem component.
|
|
1867
|
+
* Renders a `<span>` element with aria-hidden="true".
|
|
1868
|
+
*/
|
|
1869
|
+
declare const PopupMenuRadioItemIndicator: React.ForwardRefExoticComponent<Omit<PopupMenuRadioItemIndicator.Props, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
1870
|
+
declare namespace PopupMenuRadioItemIndicator {
|
|
1871
|
+
type State = PopupMenuRadioItemIndicatorState;
|
|
1872
|
+
interface Props extends PopupMenuRadioItemIndicatorProps {
|
|
1873
|
+
}
|
|
1874
|
+
}
|
|
1875
|
+
|
|
1876
|
+
interface PopupMenuGroupState extends Record<string, unknown> {
|
|
1877
|
+
/**
|
|
1878
|
+
* Whether the group is hidden due to no matching items.
|
|
1879
|
+
*/
|
|
1880
|
+
hidden: boolean;
|
|
1881
|
+
}
|
|
1882
|
+
interface PopupMenuGroupProps extends ComponentProps<'div', PopupMenuGroup.State> {
|
|
1883
|
+
/**
|
|
1884
|
+
* Whether to force render this group regardless of filter results.
|
|
1885
|
+
* @default false
|
|
1886
|
+
*/
|
|
1887
|
+
forceMount?: boolean;
|
|
1888
|
+
children: React.ReactNode;
|
|
1889
|
+
}
|
|
1890
|
+
/**
|
|
1891
|
+
* Groups related popup menu items together.
|
|
1892
|
+
* Hidden when no child items match the current filter.
|
|
1893
|
+
* Renders a `<div>` element with role="group".
|
|
1894
|
+
*/
|
|
1895
|
+
declare const PopupMenuGroup: React.ForwardRefExoticComponent<Omit<PopupMenuGroup.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1896
|
+
declare namespace PopupMenuGroup {
|
|
1897
|
+
type State = PopupMenuGroupState;
|
|
1898
|
+
interface Props extends PopupMenuGroupProps {
|
|
1899
|
+
}
|
|
1900
|
+
}
|
|
1901
|
+
|
|
1902
|
+
interface PopupMenuGroupLabelState extends Record<string, unknown> {
|
|
1903
|
+
}
|
|
1904
|
+
interface PopupMenuGroupLabelProps extends ComponentProps<'div', PopupMenuGroupLabel.State> {
|
|
1905
|
+
children: React.ReactNode;
|
|
1906
|
+
}
|
|
1907
|
+
/**
|
|
1908
|
+
* A label/heading for a group of popup menu items.
|
|
1909
|
+
* Renders a `<div>` element with role="presentation".
|
|
1910
|
+
*/
|
|
1911
|
+
declare const PopupMenuGroupLabel: React.ForwardRefExoticComponent<Omit<PopupMenuGroupLabel.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1912
|
+
declare namespace PopupMenuGroupLabel {
|
|
1913
|
+
type State = PopupMenuGroupLabelState;
|
|
1914
|
+
interface Props extends PopupMenuGroupLabelProps {
|
|
1915
|
+
}
|
|
1916
|
+
}
|
|
1917
|
+
|
|
1918
|
+
interface PopupMenuSeparatorState extends Record<string, unknown> {
|
|
1919
|
+
}
|
|
1920
|
+
interface PopupMenuSeparatorProps extends ComponentProps<'div', PopupMenuSeparator.State> {
|
|
1921
|
+
/**
|
|
1922
|
+
* Whether to always render the separator, even during search.
|
|
1923
|
+
* By default, separators are hidden when there's an active search query.
|
|
1924
|
+
* @default false
|
|
1925
|
+
*/
|
|
1926
|
+
alwaysRender?: boolean;
|
|
1927
|
+
}
|
|
1928
|
+
/**
|
|
1929
|
+
* A visual separator between popup menu items.
|
|
1930
|
+
* Hidden during active search unless `alwaysRender` is true.
|
|
1931
|
+
* Renders a `<div>` element with role="separator".
|
|
1932
|
+
*/
|
|
1933
|
+
declare const PopupMenuSeparator: React.ForwardRefExoticComponent<Omit<PopupMenuSeparator.Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
1934
|
+
declare namespace PopupMenuSeparator {
|
|
1935
|
+
type State = PopupMenuSeparatorState;
|
|
1936
|
+
interface Props extends PopupMenuSeparatorProps {
|
|
1937
|
+
}
|
|
1938
|
+
}
|
|
1939
|
+
|
|
1940
|
+
/**
|
|
1941
|
+
* State for the Shortcut component, passed to children render function.
|
|
1942
|
+
*/
|
|
1943
|
+
interface PopupMenuShortcutState extends Record<string, unknown> {
|
|
1944
|
+
/**
|
|
1945
|
+
* The keyboard shortcut value from the parent Item.
|
|
1946
|
+
*/
|
|
1947
|
+
shortcut: string | undefined;
|
|
1948
|
+
/**
|
|
1949
|
+
* Whether the parent item is highlighted.
|
|
1950
|
+
*/
|
|
1951
|
+
highlighted: boolean;
|
|
1952
|
+
}
|
|
1953
|
+
interface PopupMenuShortcutProps extends Omit<ComponentProps<'kbd', PopupMenuShortcut.State>, 'children'> {
|
|
1954
|
+
/**
|
|
1955
|
+
* Content to render inside the shortcut.
|
|
1956
|
+
* Can be a render function that receives the shortcut value.
|
|
1957
|
+
* If not provided, renders the shortcut value from the parent Item.
|
|
1958
|
+
*/
|
|
1959
|
+
children?: React.ReactNode | ((state: PopupMenuShortcutState) => React.ReactNode);
|
|
1960
|
+
}
|
|
1961
|
+
/**
|
|
1962
|
+
* Displays the keyboard shortcut for a menu item.
|
|
1963
|
+
* Must be used within a PopupMenu.Item component.
|
|
1964
|
+
* Renders a `<kbd>` element by default.
|
|
1965
|
+
*
|
|
1966
|
+
* @example
|
|
1967
|
+
* ```tsx
|
|
1968
|
+
* // Auto-renders the shortcut value
|
|
1969
|
+
* <PopupMenu.Item shortcut="1">
|
|
1970
|
+
* Icebox
|
|
1971
|
+
* <PopupMenu.Shortcut />
|
|
1972
|
+
* </PopupMenu.Item>
|
|
1973
|
+
*
|
|
1974
|
+
* // Custom rendering with children as function
|
|
1975
|
+
* <PopupMenu.Item shortcut="1">
|
|
1976
|
+
* Icebox
|
|
1977
|
+
* <PopupMenu.Shortcut>
|
|
1978
|
+
* {({ shortcut }) => <span className="key">{shortcut}</span>}
|
|
1979
|
+
* </PopupMenu.Shortcut>
|
|
1980
|
+
* </PopupMenu.Item>
|
|
1981
|
+
* ```
|
|
1982
|
+
*/
|
|
1983
|
+
declare const PopupMenuShortcut: React.ForwardRefExoticComponent<Omit<PopupMenuShortcut.Props, "ref"> & React.RefAttributes<HTMLElement>>;
|
|
1984
|
+
declare namespace PopupMenuShortcut {
|
|
1985
|
+
type State = PopupMenuShortcutState;
|
|
1986
|
+
interface Props extends PopupMenuShortcutProps {
|
|
1987
|
+
}
|
|
1988
|
+
}
|
|
1989
|
+
|
|
1990
|
+
interface PopupMenuSubmenuRootProps extends Omit<PopoverRootProps, 'open' | 'onOpenChange' | 'defaultOpen'> {
|
|
1991
|
+
/**
|
|
1992
|
+
* Whether the submenu is open.
|
|
1993
|
+
* Use for controlled mode.
|
|
1994
|
+
*/
|
|
1995
|
+
open?: boolean;
|
|
1996
|
+
/**
|
|
1997
|
+
* Callback when the open state changes.
|
|
1998
|
+
* The second parameter contains event details including the reason for the change.
|
|
1999
|
+
*/
|
|
2000
|
+
onOpenChange?: (open: boolean, eventDetails: Popover.Root.ChangeEventDetails) => void;
|
|
2001
|
+
/**
|
|
2002
|
+
* Whether the submenu is initially open.
|
|
2003
|
+
* Use for uncontrolled mode.
|
|
2004
|
+
* @default false
|
|
2005
|
+
*/
|
|
2006
|
+
defaultOpen?: boolean;
|
|
2007
|
+
/**
|
|
2008
|
+
* Whether pressing Escape in this submenu closes the entire menu from the root.
|
|
2009
|
+
* When true (default), Escape closes the entire menu tree.
|
|
2010
|
+
* When false, Escape only closes this submenu and moves focus to the parent.
|
|
2011
|
+
* @default true
|
|
2012
|
+
*/
|
|
2013
|
+
closeRootOnEsc?: boolean;
|
|
2014
|
+
/**
|
|
2015
|
+
* Whether virtualization mode is enabled for this submenu.
|
|
2016
|
+
* When true, items should provide an explicit `index` prop and
|
|
2017
|
+
* the `items` prop should be provided for navigation to work correctly.
|
|
2018
|
+
* @default false
|
|
2019
|
+
*/
|
|
2020
|
+
virtualized?: boolean;
|
|
2021
|
+
/**
|
|
2022
|
+
* Pre-registered items for virtualization.
|
|
2023
|
+
* When provided with `virtualized={true}`, this allows navigation to work
|
|
2024
|
+
* for items that aren't currently mounted in the DOM.
|
|
2025
|
+
*/
|
|
2026
|
+
items?: VirtualItem[];
|
|
2027
|
+
/**
|
|
2028
|
+
* Callback when the highlighted item changes.
|
|
2029
|
+
* Useful for synchronizing with a virtualizer (e.g., scrollToIndex).
|
|
2030
|
+
* Only called when `virtualized={true}`.
|
|
2031
|
+
*/
|
|
2032
|
+
onHighlightChange?: (id: string | null, index: number) => void;
|
|
2033
|
+
/**
|
|
2034
|
+
* Event handler called after any open/close animations have completed.
|
|
2035
|
+
* When `clearSearchOnClose="after-exit"` is set on Surface, the search
|
|
2036
|
+
* will be cleared before this callback is invoked.
|
|
2037
|
+
*/
|
|
2038
|
+
onOpenChangeComplete?: (open: boolean) => void;
|
|
2039
|
+
children: React.ReactNode;
|
|
2040
|
+
}
|
|
2041
|
+
/**
|
|
2042
|
+
* Groups all parts of a submenu.
|
|
2043
|
+
* Manages open state and provides context to children.
|
|
2044
|
+
* Creates its own ListboxStore independent from the parent menu.
|
|
2045
|
+
* Doesn't render its own HTML element.
|
|
2046
|
+
*/
|
|
2047
|
+
declare function PopupMenuSubmenuRoot(props: PopupMenuSubmenuRootProps): react_jsx_runtime.JSX.Element;
|
|
2048
|
+
declare namespace PopupMenuSubmenuRoot {
|
|
2049
|
+
interface Props extends PopupMenuSubmenuRootProps {
|
|
2050
|
+
}
|
|
2051
|
+
type ChangeEventDetails = Popover.Root.ChangeEventDetails;
|
|
2052
|
+
type Actions = Popover.Root.Actions;
|
|
2053
|
+
}
|
|
2054
|
+
|
|
2055
|
+
interface PopupMenuSubmenuTriggerIndicatorState extends Record<string, unknown> {
|
|
2056
|
+
/**
|
|
2057
|
+
* Whether the submenu popup is open.
|
|
2058
|
+
*/
|
|
2059
|
+
popupOpen: boolean;
|
|
2060
|
+
/**
|
|
2061
|
+
* Whether the submenu owns keyboard focus.
|
|
2062
|
+
*/
|
|
2063
|
+
popupFocused: boolean;
|
|
2064
|
+
}
|
|
2065
|
+
interface PopupMenuSubmenuTriggerIndicatorProps extends ComponentProps<'span', PopupMenuSubmenuTriggerIndicator.State> {
|
|
2066
|
+
}
|
|
2067
|
+
/**
|
|
2068
|
+
* An indicator element for submenu triggers that reflects the submenu's open and focus state.
|
|
2069
|
+
* Typically used to render a chevron or arrow icon.
|
|
2070
|
+
* Must be used within PopupMenu.SubmenuTrigger.
|
|
2071
|
+
* Renders a `<span>` element.
|
|
2072
|
+
*/
|
|
2073
|
+
declare const PopupMenuSubmenuTriggerIndicator: React.ForwardRefExoticComponent<Omit<PopupMenuSubmenuTriggerIndicator.Props, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
2074
|
+
declare namespace PopupMenuSubmenuTriggerIndicator {
|
|
2075
|
+
type State = PopupMenuSubmenuTriggerIndicatorState;
|
|
2076
|
+
interface Props extends PopupMenuSubmenuTriggerIndicatorProps {
|
|
2077
|
+
}
|
|
2078
|
+
}
|
|
2079
|
+
|
|
2080
|
+
interface DataSurfaceContextValue {
|
|
2081
|
+
/** The original node definitions */
|
|
2082
|
+
content: NodeDef[];
|
|
2083
|
+
/** Async content configuration for root-level async loading */
|
|
2084
|
+
asyncContent?: AsyncLoaderConfig;
|
|
2085
|
+
/** Deep search configuration */
|
|
2086
|
+
deepSearchConfig: DeepSearchConfig;
|
|
2087
|
+
/** List element ID for aria-activedescendant */
|
|
2088
|
+
listId: string;
|
|
2089
|
+
/** Function to generate qualified IDs for row items */
|
|
2090
|
+
getQualifiedRowId: GetQualifiedRowIdFn;
|
|
2091
|
+
}
|
|
2092
|
+
declare const DataSurfaceContext: React.Context<DataSurfaceContextValue | null>;
|
|
2093
|
+
declare function useDataSurfaceContext(): DataSurfaceContextValue;
|
|
2094
|
+
declare function useMaybeDataSurfaceContext(): DataSurfaceContextValue | null;
|
|
2095
|
+
type RenderNodeFn = (displayNode: DisplayNode) => React.ReactNode;
|
|
2096
|
+
|
|
2097
|
+
interface PopupMenuDataListProps extends DataListProps {
|
|
2098
|
+
/** Render function for custom element */
|
|
2099
|
+
render?: React.ReactElement;
|
|
2100
|
+
}
|
|
2101
|
+
/**
|
|
2102
|
+
* DataList renders the menu items using a render prop pattern.
|
|
2103
|
+
* It reads from the store for search and computes filtered nodes.
|
|
2104
|
+
*
|
|
2105
|
+
* Place inside PopupMenuDataSurface.
|
|
2106
|
+
* Wraps PopupMenuList for keyboard navigation and accessibility.
|
|
2107
|
+
*/
|
|
2108
|
+
declare const PopupMenuDataList: React.ForwardRefExoticComponent<PopupMenuDataList.Props & React.RefAttributes<HTMLDivElement>>;
|
|
2109
|
+
declare namespace PopupMenuDataList {
|
|
2110
|
+
interface Props extends PopupMenuDataListProps {
|
|
2111
|
+
}
|
|
2112
|
+
type ChildrenState = DataListChildrenState;
|
|
2113
|
+
}
|
|
2114
|
+
|
|
2115
|
+
interface PopupMenuDataSurfaceProps extends DataSurfaceProps {
|
|
2116
|
+
/** Custom class name */
|
|
2117
|
+
className?: string;
|
|
2118
|
+
/** Custom styles */
|
|
2119
|
+
style?: React.CSSProperties;
|
|
2120
|
+
/** Render function for custom element */
|
|
2121
|
+
render?: React.ReactElement;
|
|
2122
|
+
}
|
|
2123
|
+
/**
|
|
2124
|
+
* DataSurface provides deep search functionality for popup menus.
|
|
2125
|
+
* It wraps the standard Surface and adds data-first search capabilities.
|
|
2126
|
+
*
|
|
2127
|
+
* Place inside PopupMenu.Popup to enable deep search functionality.
|
|
2128
|
+
* Renders a `<div>` element.
|
|
2129
|
+
*/
|
|
2130
|
+
declare const PopupMenuDataSurface: React.ForwardRefExoticComponent<PopupMenuDataSurface.Props & React.RefAttributes<HTMLDivElement>>;
|
|
2131
|
+
declare namespace PopupMenuDataSurface {
|
|
2132
|
+
interface Props extends PopupMenuDataSurfaceProps {
|
|
2133
|
+
}
|
|
2134
|
+
}
|
|
2135
|
+
|
|
2136
|
+
export { type PopupMenuScrollArrowState as $, type AsyncLoaderResult as A, PopupMenuSubmenuTrigger as B, type ComponentProps as C, PopupMenuSubmenuTriggerIndicator as D, type PopupMenuPopupState as E, type PopupMenuArrowProps as F, type GetQualifiedRowIdFn as G, type PopupMenuBackdropProps as H, type PopupMenuEmptyProps as I, type PopupMenuEmptyState as J, type PopupMenuGroupLabelProps as K, type LoaderComponentProps as L, type PopupMenuGroupLabelState as M, type NodeDef as N, type PopupMenuGroupProps as O, PopupMenuSurface as P, type QueryDependentLoaderConfig as Q, type PopupMenuGroupState as R, type StaticLoaderConfig as S, type PopupMenuIconProps as T, type PopupMenuIconState as U, type PopupMenuListChildrenState as V, type PopupMenuListProps as W, type PopupMenuListState as X, type PopupMenuPopupProps as Y, type PopupMenuPortalProps as Z, type PopupMenuScrollArrowProps as _, type PopupMenuSurfaceProps as a, type RadioGroupRenderProps as a$, type PopupMenuScrollDownArrowProps as a0, type PopupMenuScrollUpArrowProps as a1, type PopupMenuSeparatorProps as a2, type PopupMenuSeparatorState as a3, type PopupMenuSurfaceState as a4, PopupMenuListCssVars as a5, PopupMenuPositionerCssVars as a6, type PopupMenuCheckboxItemIndicatorProps as a7, type PopupMenuCheckboxItemIndicatorState as a8, type PopupMenuCheckboxItemProps as a9, type UsePopupMenuItemParams as aA, type UsePopupMenuItemReturn as aB, usePopupMenuItem as aC, type CheckboxItemDef as aD, type CheckboxItemRenderParams as aE, type CheckboxItemRenderProps as aF, type DataListChildrenState as aG, type DataListProps as aH, type DataSurfaceContextValue as aI, type DataSurfaceProps as aJ, type DeepSearchConfig as aK, type DisplayGroupNode as aL, type DisplayNode as aM, type DisplayRadioGroupNode as aN, type DisplayRowNode as aO, type GroupBehavior as aP, type GroupDef as aQ, type GroupRenderContext as aR, type GroupRenderParams as aS, type ItemDef as aT, type ItemRenderParams as aU, type ItemRenderProps as aV, type PopupMenuDataListProps as aW, type PopupMenuDataSurfaceProps as aX, type PopupMenuRadioGroupValueProps as aY, type RadioGroupDef as aZ, type RadioGroupRenderParams as a_, type PopupMenuCheckboxItemState as aa, type PopupMenuInputProps as ab, type PopupMenuInputState as ac, type PopupMenuItemProps as ad, type PopupMenuItemState as ae, type PopupMenuPositionerAlign as af, type PopupMenuPositionerProps as ag, type PopupMenuRadioGroupProps as ah, type PopupMenuRadioGroupState as ai, type PopupMenuRadioItemIndicatorProps as aj, type PopupMenuRadioItemIndicatorState as ak, type PopupMenuRadioItemProps as al, type PopupMenuRadioItemState as am, type PopupMenuShortcutProps as an, type PopupMenuShortcutState as ao, type PopupMenuSubmenuRootProps as ap, type PopupMenuSubmenuTriggerIndicatorProps as aq, type PopupMenuSubmenuTriggerIndicatorState as ar, type PopupMenuSubmenuTriggerProps as as, type PopupMenuSubmenuTriggerState as at, type PopupMenuContextValue as au, type SubmenuContextValue as av, useMaybePopupMenuContext as aw, useMaybeSubmenuContext as ax, usePopupMenuContext as ay, useSubmenuContext as az, PopupMenuArrow as b, type RenderNodeFn as b0, type RowRenderContext as b1, type ScoredNode as b2, type SeparatorDef as b3, type SubmenuDef as b4, type SubmenuRenderParams as b5, type SubmenuRenderProps as b6, DataSurfaceContext as b7, defineRadioGroup as b8, isDisplayGroupNode as b9, isDisplayRadioGroupNode as ba, isDisplayRowNode as bb, useDataSurfaceContext as bc, useMaybeDataSurfaceContext as bd, type AsyncLoaderConfig as be, type AsyncNodesConfig as bf, type AsyncRenderState as bg, type AsyncState as bh, type BreadcrumbNode as bi, type DisplaySeparatorNode as bj, type QueryAsyncNodesConfig as bk, type RadioGroupBehavior as bl, type RadioItemDef as bm, type RadioItemRenderParams as bn, type RadioItemRenderProps as bo, type SeparatorRenderParams as bp, type StaticAsyncNodesConfig as bq, isDisplaySeparatorNode as br, type VirtualizationConfig as bs, type VirtualAnchor as bt, type GetQualifiedRowIdContext as bu, PopupMenuContext as bv, SubmenuContext as bw, PopupMenuScrollArrow as bx, PopupMenuBackdrop as c, PopupMenuEmpty as d, PopupMenuGroup as e, PopupMenuGroupLabel as f, PopupMenuIcon as g, PopupMenuList as h, PopupMenuPopup as i, PopupMenuPortal as j, PopupMenuScrollDownArrow as k, PopupMenuScrollUpArrow as l, PopupMenuSeparator as m, PopupMenuCheckboxItem as n, PopupMenuCheckboxItemIndicator as o, PopupMenuInput as p, PopupMenuDataList as q, PopupMenuDataSurface as r, PopupMenuItem as s, PopupMenuPositioner as t, PopupMenuRadioGroup as u, PopupMenuRadioGroupValue as v, PopupMenuRadioItem as w, PopupMenuRadioItemIndicator as x, PopupMenuShortcut as y, PopupMenuSubmenuRoot as z };
|