@enonic/ui 1.6.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -6
- package/dist/enonic-ui.cjs +1 -1
- package/dist/enonic-ui.es.js +135 -134
- package/dist/style.cjs +1 -1
- package/dist/style.es.js +1 -1
- package/dist/styles/style.css +2 -2
- package/dist/types/components/avatar/avatar.d.ts +18 -13
- package/dist/types/components/button/button.d.ts +6 -3
- package/dist/types/components/checkbox/checkbox.d.ts +25 -3
- package/dist/types/components/combobox/combobox.d.ts +20 -12
- package/dist/types/components/context-menu/context-menu.d.ts +78 -37
- package/dist/types/components/date-picker/date-picker.d.ts +36 -23
- package/dist/types/components/dialog/dialog-actions.d.ts +1 -1
- package/dist/types/components/dialog/dialog.d.ts +81 -44
- package/dist/types/components/grid-list/grid-list.d.ts +102 -12
- package/dist/types/components/icon-button/icon-button.d.ts +2 -4
- package/dist/types/components/input/input.d.ts +28 -6
- package/dist/types/components/link/link.d.ts +7 -3
- package/dist/types/components/listbox/listbox.d.ts +5 -3
- package/dist/types/components/menu/menu.d.ts +52 -25
- package/dist/types/components/menubar/menubar.d.ts +94 -33
- package/dist/types/components/radio-group/radio-group.d.ts +30 -12
- package/dist/types/components/search-field/search-field.d.ts +1 -3
- package/dist/types/components/selectable-list-item/selectable-list-item.d.ts +1 -1
- package/dist/types/components/selector/selector.d.ts +72 -36
- package/dist/types/components/stepper/stepper.d.ts +54 -18
- package/dist/types/components/tab/tab.d.ts +93 -21
- package/dist/types/components/tag/tag.d.ts +27 -18
- package/dist/types/components/textarea/textarea.d.ts +34 -3
- package/dist/types/components/time-picker/time-picker.d.ts +26 -19
- package/dist/types/components/toast/toast.d.ts +28 -25
- package/dist/types/components/toggle/toggle.d.ts +5 -3
- package/dist/types/components/toggle-group/toggle-group.d.ts +6 -9
- package/dist/types/components/toolbar/toolbar-toggle-group.d.ts +10 -12
- package/dist/types/components/toolbar/toolbar.d.ts +29 -21
- package/dist/types/components/tooltip/tooltip.d.ts +13 -1
- package/dist/types/components/tree-list/tree-list.d.ts +253 -60
- package/dist/types/components/virtualized-tree-list/virtualized-tree-list.d.ts +87 -41
- package/dist/types/hooks/use-active-item-focus.d.ts +1 -1
- package/dist/types/hooks/use-active-on-open.d.ts +1 -1
- package/dist/types/hooks/use-click-outside.d.ts +2 -2
- package/dist/types/hooks/use-floating-position.d.ts +2 -2
- package/dist/types/hooks/use-pointer-position.d.ts +1 -1
- package/dist/types/hooks/use-radio-navigation.d.ts +1 -1
- package/dist/types/hooks/use-scroll-active-into-view.d.ts +1 -1
- package/dist/types/hooks/use-step-navigation.d.ts +1 -1
- package/dist/types/hooks/use-submenu-safe-area.d.ts +1 -1
- package/dist/types/hooks/use-sync-value.d.ts +1 -1
- package/dist/types/primitives/menu-primitive/menu-primitive.d.ts +41 -20
- package/dist/types/providers/combobox-provider.d.ts +5 -5
- package/dist/types/providers/context-menu-provider.d.ts +4 -5
- package/dist/types/providers/context-menu-sub-provider.d.ts +3 -3
- package/dist/types/providers/date-picker-provider.d.ts +2 -2
- package/dist/types/providers/focus-container-provider.d.ts +1 -1
- package/dist/types/providers/menu-provider.d.ts +2 -2
- package/dist/types/providers/menubar-menu-provider.d.ts +4 -4
- package/dist/types/providers/menubar-provider.d.ts +1 -1
- package/dist/types/providers/search-field-provider.d.ts +1 -1
- package/dist/types/providers/selector-provider.d.ts +1 -1
- package/dist/types/providers/time-picker-provider.d.ts +3 -3
- package/dist/types/providers/toolbar-provider.d.ts +1 -1
- package/dist/types/types/lucide.d.ts +9 -5
- package/dist/types/utils/dom.d.ts +15 -1
- package/dist/types/utils/unwrap.d.ts +1 -1
- package/package.json +27 -32
|
@@ -98,23 +98,26 @@ export type TreeListRowLeftProps = {
|
|
|
98
98
|
children?: ReactNode;
|
|
99
99
|
className?: string;
|
|
100
100
|
} & ComponentPropsWithoutRef<'div'>;
|
|
101
|
-
export declare const TreeListRowLeft: import('
|
|
102
|
-
|
|
103
|
-
|
|
101
|
+
export declare const TreeListRowLeft: import('react').ForwardRefExoticComponent<{
|
|
102
|
+
children?: ReactNode;
|
|
103
|
+
className?: string;
|
|
104
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
104
105
|
export type TreeListRowRightProps = {
|
|
105
106
|
children?: ReactNode;
|
|
106
107
|
className?: string;
|
|
107
108
|
} & ComponentPropsWithoutRef<'div'>;
|
|
108
|
-
export declare const TreeListRowRight: import('
|
|
109
|
-
|
|
110
|
-
|
|
109
|
+
export declare const TreeListRowRight: import('react').ForwardRefExoticComponent<{
|
|
110
|
+
children?: ReactNode;
|
|
111
|
+
className?: string;
|
|
112
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
111
113
|
export type TreeListRowContentProps = {
|
|
112
114
|
children?: ReactNode;
|
|
113
115
|
className?: string;
|
|
114
116
|
} & ComponentPropsWithoutRef<'div'>;
|
|
115
|
-
export declare const TreeListRowContent: import('
|
|
116
|
-
|
|
117
|
-
|
|
117
|
+
export declare const TreeListRowContent: import('react').ForwardRefExoticComponent<{
|
|
118
|
+
children?: ReactNode;
|
|
119
|
+
className?: string;
|
|
120
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
118
121
|
export type TreeListActionProps = {
|
|
119
122
|
/** Interactive element to exclude from normal tab order (use F2 action mode) */
|
|
120
123
|
children: ReactElement;
|
|
@@ -134,9 +137,12 @@ export type TreeListRowLevelSpacerProps = {
|
|
|
134
137
|
levelIndent?: number;
|
|
135
138
|
className?: string;
|
|
136
139
|
} & ComponentPropsWithoutRef<'div'>;
|
|
137
|
-
export declare const TreeListRowLevelSpacer: import('
|
|
138
|
-
|
|
139
|
-
|
|
140
|
+
export declare const TreeListRowLevelSpacer: import('react').ForwardRefExoticComponent<{
|
|
141
|
+
level?: number;
|
|
142
|
+
/** Indent per level in pixels. Default: 20 */
|
|
143
|
+
levelIndent?: number;
|
|
144
|
+
className?: string;
|
|
145
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
140
146
|
export type TreeListRowExpandControlProps = {
|
|
141
147
|
/** Row ID - if provided, clicking will also set this row as active */
|
|
142
148
|
rowId?: string;
|
|
@@ -148,9 +154,17 @@ export type TreeListRowExpandControlProps = {
|
|
|
148
154
|
'aria-label'?: string;
|
|
149
155
|
className?: string;
|
|
150
156
|
} & Omit<IconButtonProps, 'icon' | 'onClick' | 'aria-label'>;
|
|
151
|
-
export declare const TreeListRowExpandControl: import('
|
|
152
|
-
|
|
153
|
-
|
|
157
|
+
export declare const TreeListRowExpandControl: import('react').ForwardRefExoticComponent<{
|
|
158
|
+
/** Row ID - if provided, clicking will also set this row as active */
|
|
159
|
+
rowId?: string;
|
|
160
|
+
expanded?: boolean;
|
|
161
|
+
hasChildren?: boolean;
|
|
162
|
+
onToggle?: () => void;
|
|
163
|
+
icon?: LucideIcon;
|
|
164
|
+
selected?: boolean;
|
|
165
|
+
'aria-label'?: string;
|
|
166
|
+
className?: string;
|
|
167
|
+
} & Omit<IconButtonProps, "aria-label" | "onClick" | "icon"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
154
168
|
export type TreeListRowSelectionControlProps = {
|
|
155
169
|
/** Row ID - required for toggle selection to work */
|
|
156
170
|
rowId: string;
|
|
@@ -161,9 +175,16 @@ export type TreeListRowSelectionControlProps = {
|
|
|
161
175
|
variant?: 'checkbox' | 'radio';
|
|
162
176
|
className?: string;
|
|
163
177
|
} & Omit<ComponentPropsWithoutRef<'div'>, 'onClick'>;
|
|
164
|
-
export declare const TreeListRowSelectionControl: import('
|
|
165
|
-
|
|
166
|
-
|
|
178
|
+
export declare const TreeListRowSelectionControl: import('react').ForwardRefExoticComponent<{
|
|
179
|
+
/** Row ID - required for toggle selection to work */
|
|
180
|
+
rowId: string;
|
|
181
|
+
/** Override selection state. If not provided, reads from TreeList selection context. */
|
|
182
|
+
selected?: boolean;
|
|
183
|
+
selectable?: boolean;
|
|
184
|
+
/** Override indicator style. Default: checkbox for multiple, none for single */
|
|
185
|
+
variant?: "checkbox" | "radio";
|
|
186
|
+
className?: string;
|
|
187
|
+
} & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "onClick"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
167
188
|
export type TreeListRowLoadingProps = {
|
|
168
189
|
level?: number;
|
|
169
190
|
/** Indent per level in pixels. Default: 20 */
|
|
@@ -171,9 +192,13 @@ export type TreeListRowLoadingProps = {
|
|
|
171
192
|
className?: string;
|
|
172
193
|
children?: ReactNode;
|
|
173
194
|
} & ComponentPropsWithoutRef<'div'>;
|
|
174
|
-
export declare const TreeListRowLoading: import('
|
|
175
|
-
|
|
176
|
-
|
|
195
|
+
export declare const TreeListRowLoading: import('react').ForwardRefExoticComponent<{
|
|
196
|
+
level?: number;
|
|
197
|
+
/** Indent per level in pixels. Default: 20 */
|
|
198
|
+
levelIndent?: number;
|
|
199
|
+
className?: string;
|
|
200
|
+
children?: ReactNode;
|
|
201
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
177
202
|
export type TreeListRowPlaceholderProps = {
|
|
178
203
|
level?: number;
|
|
179
204
|
/** Indent per level in pixels. Default: 20 */
|
|
@@ -181,45 +206,213 @@ export type TreeListRowPlaceholderProps = {
|
|
|
181
206
|
className?: string;
|
|
182
207
|
children?: ReactNode;
|
|
183
208
|
} & ComponentPropsWithoutRef<'div'>;
|
|
184
|
-
export declare const TreeListRowPlaceholder: import('
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
209
|
+
export declare const TreeListRowPlaceholder: import('react').ForwardRefExoticComponent<{
|
|
210
|
+
level?: number;
|
|
211
|
+
/** Indent per level in pixels. Default: 20 */
|
|
212
|
+
levelIndent?: number;
|
|
213
|
+
className?: string;
|
|
214
|
+
children?: ReactNode;
|
|
215
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
216
|
+
export declare const TreeList: import('react').ForwardRefExoticComponent<{
|
|
217
|
+
selection?: ReadonlySet<string>;
|
|
218
|
+
defaultSelection?: ReadonlySet<string>;
|
|
219
|
+
onSelectionChange?: (selection: ReadonlySet<string>) => void;
|
|
220
|
+
selectionMode?: SelectionMode;
|
|
221
|
+
active?: string;
|
|
222
|
+
defaultActive?: string;
|
|
223
|
+
onActiveChange?: (active: string | undefined) => void;
|
|
224
|
+
loop?: boolean;
|
|
225
|
+
className?: string;
|
|
226
|
+
children?: ReactNode;
|
|
227
|
+
onActivate?: (id: string) => void;
|
|
228
|
+
getParentId?: (id: string) => string | undefined;
|
|
229
|
+
getFirstChildId?: (id: string) => string | undefined;
|
|
230
|
+
expanded?: ReadonlySet<string>;
|
|
231
|
+
onExpandedChange?: (expanded: ReadonlySet<string>) => void;
|
|
232
|
+
/**
|
|
233
|
+
* Controls how users can interact with each item.
|
|
234
|
+
*
|
|
235
|
+
* Returns:
|
|
236
|
+
* - `'full'`: Item can be navigated to and selected (default)
|
|
237
|
+
* - `'navigate-only'`: Item can receive focus but cannot be selected
|
|
238
|
+
* - `'none'`: Item is completely non-interactive (skipped in navigation, cannot be selected)
|
|
239
|
+
*
|
|
240
|
+
* Default behavior when not provided:
|
|
241
|
+
* - Uses the `disabled` prop from TreeListRow (disabled = 'none', enabled = 'full')
|
|
242
|
+
*/
|
|
243
|
+
getItemInteraction?: (id: string) => ItemInteraction;
|
|
244
|
+
/**
|
|
245
|
+
* When true, single-clicking the active item while selection is empty
|
|
246
|
+
* will clear the active state. Double-clicks are not affected.
|
|
247
|
+
* Default: false.
|
|
248
|
+
*
|
|
249
|
+
* This enables "toggle active" behavior where users can deactivate
|
|
250
|
+
* an item by clicking it again when nothing is selected.
|
|
251
|
+
*/
|
|
252
|
+
clearActiveOnReclick?: boolean;
|
|
253
|
+
/**
|
|
254
|
+
* Controls how selection behaves on a plain row click (no modifier keys).
|
|
255
|
+
* Shift+Click (range) and Ctrl/Cmd+Click (toggle) are unaffected.
|
|
256
|
+
*
|
|
257
|
+
* - `'select'` (default): Selects only the clicked item, clearing others.
|
|
258
|
+
* In single mode, clicking the already-selected item deselects it.
|
|
259
|
+
* - `'toggle'`: Toggles the clicked item without affecting other selections.
|
|
260
|
+
* Suitable for combobox dropdowns where row click = checkbox click.
|
|
261
|
+
* - `'clear'`: Clears all selection on click. Row click only manages
|
|
262
|
+
* the active item. Modifier clicks still work for selection.
|
|
263
|
+
*
|
|
264
|
+
* @default 'select'
|
|
265
|
+
*/
|
|
266
|
+
rowClickSelection?: RowClickSelection;
|
|
267
|
+
/**
|
|
268
|
+
* When true (default), pressing Escape clears the selection.
|
|
269
|
+
* Set to false when using inside a Combobox where Escape should
|
|
270
|
+
* only close the dropdown without clearing selection.
|
|
271
|
+
*
|
|
272
|
+
* @default true
|
|
273
|
+
*/
|
|
274
|
+
clearSelectionOnEscape?: boolean;
|
|
275
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>> & {
|
|
276
|
+
Root: import('react').ForwardRefExoticComponent<{
|
|
277
|
+
selection?: ReadonlySet<string>;
|
|
278
|
+
defaultSelection?: ReadonlySet<string>;
|
|
279
|
+
onSelectionChange?: (selection: ReadonlySet<string>) => void;
|
|
280
|
+
selectionMode?: SelectionMode;
|
|
281
|
+
active?: string;
|
|
282
|
+
defaultActive?: string;
|
|
283
|
+
onActiveChange?: (active: string | undefined) => void;
|
|
284
|
+
loop?: boolean;
|
|
285
|
+
className?: string;
|
|
286
|
+
children?: ReactNode;
|
|
287
|
+
onActivate?: (id: string) => void;
|
|
288
|
+
getParentId?: (id: string) => string | undefined;
|
|
289
|
+
getFirstChildId?: (id: string) => string | undefined;
|
|
290
|
+
expanded?: ReadonlySet<string>;
|
|
291
|
+
onExpandedChange?: (expanded: ReadonlySet<string>) => void;
|
|
292
|
+
/**
|
|
293
|
+
* Controls how users can interact with each item.
|
|
294
|
+
*
|
|
295
|
+
* Returns:
|
|
296
|
+
* - `'full'`: Item can be navigated to and selected (default)
|
|
297
|
+
* - `'navigate-only'`: Item can receive focus but cannot be selected
|
|
298
|
+
* - `'none'`: Item is completely non-interactive (skipped in navigation, cannot be selected)
|
|
299
|
+
*
|
|
300
|
+
* Default behavior when not provided:
|
|
301
|
+
* - Uses the `disabled` prop from TreeListRow (disabled = 'none', enabled = 'full')
|
|
302
|
+
*/
|
|
303
|
+
getItemInteraction?: (id: string) => ItemInteraction;
|
|
304
|
+
/**
|
|
305
|
+
* When true, single-clicking the active item while selection is empty
|
|
306
|
+
* will clear the active state. Double-clicks are not affected.
|
|
307
|
+
* Default: false.
|
|
308
|
+
*
|
|
309
|
+
* This enables "toggle active" behavior where users can deactivate
|
|
310
|
+
* an item by clicking it again when nothing is selected.
|
|
311
|
+
*/
|
|
312
|
+
clearActiveOnReclick?: boolean;
|
|
313
|
+
/**
|
|
314
|
+
* Controls how selection behaves on a plain row click (no modifier keys).
|
|
315
|
+
* Shift+Click (range) and Ctrl/Cmd+Click (toggle) are unaffected.
|
|
316
|
+
*
|
|
317
|
+
* - `'select'` (default): Selects only the clicked item, clearing others.
|
|
318
|
+
* In single mode, clicking the already-selected item deselects it.
|
|
319
|
+
* - `'toggle'`: Toggles the clicked item without affecting other selections.
|
|
320
|
+
* Suitable for combobox dropdowns where row click = checkbox click.
|
|
321
|
+
* - `'clear'`: Clears all selection on click. Row click only manages
|
|
322
|
+
* the active item. Modifier clicks still work for selection.
|
|
323
|
+
*
|
|
324
|
+
* @default 'select'
|
|
325
|
+
*/
|
|
326
|
+
rowClickSelection?: RowClickSelection;
|
|
327
|
+
/**
|
|
328
|
+
* When true (default), pressing Escape clears the selection.
|
|
329
|
+
* Set to false when using inside a Combobox where Escape should
|
|
330
|
+
* only close the dropdown without clearing selection.
|
|
331
|
+
*
|
|
332
|
+
* @default true
|
|
333
|
+
*/
|
|
334
|
+
clearSelectionOnEscape?: boolean;
|
|
335
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
336
|
+
Container: import('react').ForwardRefExoticComponent<{
|
|
337
|
+
children?: ReactNode;
|
|
338
|
+
className?: string;
|
|
339
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
340
|
+
Row: import('react').ForwardRefExoticComponent<{
|
|
341
|
+
id: string;
|
|
342
|
+
disabled?: boolean;
|
|
343
|
+
selectable?: boolean;
|
|
344
|
+
/** ARIA level for tree hierarchy (1-based, optional for accessibility) */
|
|
345
|
+
level?: number;
|
|
346
|
+
/** Whether this node has children (affects aria-expanded) */
|
|
347
|
+
hasChildren?: boolean;
|
|
348
|
+
/** Whether this node is expanded (required if hasChildren=true) */
|
|
349
|
+
expanded?: boolean;
|
|
350
|
+
/**
|
|
351
|
+
* Position of this item within its siblings (1-indexed).
|
|
352
|
+
* Used for `aria-posinset`. Optional - only set if you have this data.
|
|
353
|
+
*/
|
|
354
|
+
posinset?: number;
|
|
355
|
+
/**
|
|
356
|
+
* Total number of siblings at this level.
|
|
357
|
+
* Used for `aria-setsize`. Optional - only set if you have this data.
|
|
358
|
+
*/
|
|
359
|
+
setsize?: number;
|
|
360
|
+
className?: string;
|
|
361
|
+
children?: ReactNode;
|
|
362
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
363
|
+
RowLeft: import('react').ForwardRefExoticComponent<{
|
|
364
|
+
children?: ReactNode;
|
|
365
|
+
className?: string;
|
|
366
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
367
|
+
RowRight: import('react').ForwardRefExoticComponent<{
|
|
368
|
+
children?: ReactNode;
|
|
369
|
+
className?: string;
|
|
370
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
371
|
+
RowContent: import('react').ForwardRefExoticComponent<{
|
|
372
|
+
children?: ReactNode;
|
|
373
|
+
className?: string;
|
|
374
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
375
|
+
RowLevelSpacer: import('react').ForwardRefExoticComponent<{
|
|
376
|
+
level?: number;
|
|
377
|
+
/** Indent per level in pixels. Default: 20 */
|
|
378
|
+
levelIndent?: number;
|
|
379
|
+
className?: string;
|
|
380
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
381
|
+
RowExpandControl: import('react').ForwardRefExoticComponent<{
|
|
382
|
+
/** Row ID - if provided, clicking will also set this row as active */
|
|
383
|
+
rowId?: string;
|
|
384
|
+
expanded?: boolean;
|
|
385
|
+
hasChildren?: boolean;
|
|
386
|
+
onToggle?: () => void;
|
|
387
|
+
icon?: LucideIcon;
|
|
388
|
+
selected?: boolean;
|
|
389
|
+
'aria-label'?: string;
|
|
390
|
+
className?: string;
|
|
391
|
+
} & Omit<IconButtonProps, "aria-label" | "onClick" | "icon"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
392
|
+
RowSelectionControl: import('react').ForwardRefExoticComponent<{
|
|
393
|
+
/** Row ID - required for toggle selection to work */
|
|
394
|
+
rowId: string;
|
|
395
|
+
/** Override selection state. If not provided, reads from TreeList selection context. */
|
|
396
|
+
selected?: boolean;
|
|
397
|
+
selectable?: boolean;
|
|
398
|
+
/** Override indicator style. Default: checkbox for multiple, none for single */
|
|
399
|
+
variant?: "checkbox" | "radio";
|
|
400
|
+
className?: string;
|
|
401
|
+
} & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "onClick"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
402
|
+
RowLoading: import('react').ForwardRefExoticComponent<{
|
|
403
|
+
level?: number;
|
|
404
|
+
/** Indent per level in pixels. Default: 20 */
|
|
405
|
+
levelIndent?: number;
|
|
406
|
+
className?: string;
|
|
407
|
+
children?: ReactNode;
|
|
408
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
409
|
+
RowPlaceholder: import('react').ForwardRefExoticComponent<{
|
|
410
|
+
level?: number;
|
|
411
|
+
/** Indent per level in pixels. Default: 20 */
|
|
412
|
+
levelIndent?: number;
|
|
413
|
+
className?: string;
|
|
414
|
+
children?: ReactNode;
|
|
415
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
223
416
|
Action: {
|
|
224
417
|
({ children }: TreeListActionProps): ReactElement;
|
|
225
418
|
displayName: string;
|
|
@@ -34,12 +34,6 @@ export type VirtualizedTreeListItemProps = {
|
|
|
34
34
|
'aria-expanded': boolean | undefined;
|
|
35
35
|
'aria-level': number;
|
|
36
36
|
onClick: (e: React.MouseEvent<HTMLElement>) => void;
|
|
37
|
-
/**
|
|
38
|
-
* Double-click handler (Preact). Preact uses `onDblClick`, React uses `onDoubleClick`.
|
|
39
|
-
* Both are provided for cross-framework compatibility. See architecture.md.
|
|
40
|
-
*/
|
|
41
|
-
onDblClick: () => void;
|
|
42
|
-
/** Double-click handler (React). See `onDblClick` comment above. */
|
|
43
37
|
onDoubleClick: () => void;
|
|
44
38
|
active: boolean;
|
|
45
39
|
selected: boolean;
|
|
@@ -65,8 +59,8 @@ export type VirtualizedTreeListRenderProps<TData> = {
|
|
|
65
59
|
tabIndex: 0;
|
|
66
60
|
className: string;
|
|
67
61
|
onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
|
|
68
|
-
onFocus: () => void;
|
|
69
|
-
onBlur: () => void;
|
|
62
|
+
onFocus: (e?: React.FocusEvent<HTMLElement>) => void;
|
|
63
|
+
onBlur: (e?: React.FocusEvent<HTMLElement>) => void;
|
|
70
64
|
};
|
|
71
65
|
};
|
|
72
66
|
/**
|
|
@@ -237,9 +231,17 @@ export type VirtualizedTreeListRowExpandControlProps = {
|
|
|
237
231
|
'aria-label'?: string;
|
|
238
232
|
className?: string;
|
|
239
233
|
} & Omit<IconButtonProps, 'icon' | 'onClick' | 'aria-label'>;
|
|
240
|
-
export declare const VirtualizedTreeListRowExpandControl: import('
|
|
241
|
-
|
|
242
|
-
|
|
234
|
+
export declare const VirtualizedTreeListRowExpandControl: import('react').ForwardRefExoticComponent<{
|
|
235
|
+
/** Row ID - if provided, clicking will also set this row as active */
|
|
236
|
+
rowId?: string;
|
|
237
|
+
expanded?: boolean;
|
|
238
|
+
hasChildren?: boolean;
|
|
239
|
+
onToggle?: () => void;
|
|
240
|
+
icon?: LucideIcon;
|
|
241
|
+
selected?: boolean;
|
|
242
|
+
'aria-label'?: string;
|
|
243
|
+
className?: string;
|
|
244
|
+
} & Omit<IconButtonProps, "aria-label" | "onClick" | "icon"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
243
245
|
export type VirtualizedTreeListRowSelectionControlProps = {
|
|
244
246
|
/** Row ID - required for toggle selection to work */
|
|
245
247
|
rowId: string;
|
|
@@ -250,39 +252,83 @@ export type VirtualizedTreeListRowSelectionControlProps = {
|
|
|
250
252
|
variant?: 'checkbox' | 'radio';
|
|
251
253
|
className?: string;
|
|
252
254
|
} & Omit<ComponentPropsWithoutRef<'div'>, 'onClick'>;
|
|
253
|
-
export declare const VirtualizedTreeListRowSelectionControl: import('
|
|
254
|
-
|
|
255
|
-
|
|
255
|
+
export declare const VirtualizedTreeListRowSelectionControl: import('react').ForwardRefExoticComponent<{
|
|
256
|
+
/** Row ID - required for toggle selection to work */
|
|
257
|
+
rowId: string;
|
|
258
|
+
/** Override selection state. If not provided, reads from VirtualizedTreeList selection context. */
|
|
259
|
+
selected?: boolean;
|
|
260
|
+
selectable?: boolean;
|
|
261
|
+
/** Override indicator style. Default: checkbox for multiple, none for single */
|
|
262
|
+
variant?: "checkbox" | "radio";
|
|
263
|
+
className?: string;
|
|
264
|
+
} & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "onClick"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
256
265
|
export declare const VirtualizedTreeList: (<TData = unknown>(props: VirtualizedTreeListRootProps<TData> & {
|
|
257
266
|
ref?: React.ForwardedRef<HTMLDivElement>;
|
|
258
267
|
}) => ReactElement) & {
|
|
259
|
-
Row: import('
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
}
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
268
|
+
Row: import('react').ForwardRefExoticComponent<{
|
|
269
|
+
/** Whether this row is the active (focused) row */
|
|
270
|
+
active?: boolean;
|
|
271
|
+
/** Whether this row is selected */
|
|
272
|
+
selected?: boolean;
|
|
273
|
+
/** Whether this row is disabled */
|
|
274
|
+
disabled?: boolean;
|
|
275
|
+
/** @deprecated Has no effect. Selection is governed by `getItemInteraction` and `RowSelectionControl`'s `selectable`. */
|
|
276
|
+
selectable?: boolean;
|
|
277
|
+
/** Additional class names */
|
|
278
|
+
className?: string;
|
|
279
|
+
/** Row content */
|
|
280
|
+
children?: ReactNode;
|
|
281
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
282
|
+
RowLeft: import('react').ForwardRefExoticComponent<{
|
|
283
|
+
children?: ReactNode;
|
|
284
|
+
className?: string;
|
|
285
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
286
|
+
RowRight: import('react').ForwardRefExoticComponent<{
|
|
287
|
+
children?: ReactNode;
|
|
288
|
+
className?: string;
|
|
289
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
290
|
+
RowContent: import('react').ForwardRefExoticComponent<{
|
|
291
|
+
children?: ReactNode;
|
|
292
|
+
className?: string;
|
|
293
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
294
|
+
RowLevelSpacer: import('react').ForwardRefExoticComponent<{
|
|
295
|
+
level?: number;
|
|
296
|
+
levelIndent?: number;
|
|
297
|
+
className?: string;
|
|
298
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
299
|
+
RowExpandControl: import('react').ForwardRefExoticComponent<{
|
|
300
|
+
/** Row ID - if provided, clicking will also set this row as active */
|
|
301
|
+
rowId?: string;
|
|
302
|
+
expanded?: boolean;
|
|
303
|
+
hasChildren?: boolean;
|
|
304
|
+
onToggle?: () => void;
|
|
305
|
+
icon?: LucideIcon;
|
|
306
|
+
selected?: boolean;
|
|
307
|
+
'aria-label'?: string;
|
|
308
|
+
className?: string;
|
|
309
|
+
} & Omit<IconButtonProps, "aria-label" | "onClick" | "icon"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
310
|
+
RowSelectionControl: import('react').ForwardRefExoticComponent<{
|
|
311
|
+
/** Row ID - required for toggle selection to work */
|
|
312
|
+
rowId: string;
|
|
313
|
+
/** Override selection state. If not provided, reads from VirtualizedTreeList selection context. */
|
|
314
|
+
selected?: boolean;
|
|
315
|
+
selectable?: boolean;
|
|
316
|
+
/** Override indicator style. Default: checkbox for multiple, none for single */
|
|
317
|
+
variant?: "checkbox" | "radio";
|
|
318
|
+
className?: string;
|
|
319
|
+
} & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "onClick"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
320
|
+
RowLoading: import('react').ForwardRefExoticComponent<{
|
|
321
|
+
level?: number;
|
|
322
|
+
levelIndent?: number;
|
|
323
|
+
className?: string;
|
|
324
|
+
children?: ReactNode;
|
|
325
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
326
|
+
RowPlaceholder: import('react').ForwardRefExoticComponent<{
|
|
327
|
+
level?: number;
|
|
328
|
+
levelIndent?: number;
|
|
329
|
+
className?: string;
|
|
330
|
+
children?: ReactNode;
|
|
331
|
+
} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
286
332
|
Action: {
|
|
287
333
|
({ children }: VirtualizedTreeListActionProps): ReactElement;
|
|
288
334
|
displayName: string;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { RefObject } from 'react';
|
|
2
2
|
export type UseActiveItemFocusConfig = {
|
|
3
3
|
/** Reference to the item element to focus */
|
|
4
|
-
ref: RefObject<HTMLElement> | null;
|
|
4
|
+
ref: RefObject<HTMLElement | null> | null;
|
|
5
5
|
/** Whether this item is currently active */
|
|
6
6
|
isActive: boolean;
|
|
7
7
|
/** Whether this item is disabled */
|
|
@@ -23,7 +23,7 @@ export type UseActiveOnOpenConfig = {
|
|
|
23
23
|
* updated (useful for tests or virtualized consumers handling scroll
|
|
24
24
|
* through their own adapter).
|
|
25
25
|
*/
|
|
26
|
-
containerRef?: RefObject<HTMLElement> | null;
|
|
26
|
+
containerRef?: RefObject<HTMLElement | null> | null;
|
|
27
27
|
/**
|
|
28
28
|
* Build the option element's DOM id from a registry id. Defaults to
|
|
29
29
|
* identity. Match the consumer's `buildElementId` used elsewhere.
|
|
@@ -3,12 +3,12 @@ export type UseClickOutsideConfig = {
|
|
|
3
3
|
/** Whether the click outside listener is active */
|
|
4
4
|
enabled: boolean;
|
|
5
5
|
/** Reference to the content element (clicks inside are ignored) */
|
|
6
|
-
contentRef: RefObject<HTMLElement>;
|
|
6
|
+
contentRef: RefObject<HTMLElement | null>;
|
|
7
7
|
/**
|
|
8
8
|
* Optional references to elements that should be excluded from "outside" detection.
|
|
9
9
|
* Typically used for trigger buttons that toggle the content visibility.
|
|
10
10
|
*/
|
|
11
|
-
excludeRefs?: (RefObject<HTMLElement> | undefined)[];
|
|
11
|
+
excludeRefs?: (RefObject<HTMLElement | null> | undefined)[];
|
|
12
12
|
/** Callback when pointer down occurs outside */
|
|
13
13
|
onPointerDownOutside?: (event: PointerEvent) => void;
|
|
14
14
|
/** Callback when any interaction occurs outside */
|
|
@@ -30,9 +30,9 @@ export type UseFloatingPositionConfig = {
|
|
|
30
30
|
/** Whether the floating element is open/visible */
|
|
31
31
|
enabled: boolean;
|
|
32
32
|
/** Reference to the anchor element to position relative to */
|
|
33
|
-
anchorRef: RefObject<HTMLElement> | null;
|
|
33
|
+
anchorRef: RefObject<HTMLElement | null> | null;
|
|
34
34
|
/** Reference to the floating content element */
|
|
35
|
-
contentRef: RefObject<HTMLElement> | null;
|
|
35
|
+
contentRef: RefObject<HTMLElement | null> | null;
|
|
36
36
|
/**
|
|
37
37
|
* Preferred side relative to the anchor.
|
|
38
38
|
* @default 'bottom'
|
|
@@ -12,7 +12,7 @@ export type UsePointerPositionConfig = {
|
|
|
12
12
|
y: number;
|
|
13
13
|
} | null;
|
|
14
14
|
/** Reference to the floating content element */
|
|
15
|
-
contentRef: RefObject<HTMLElement> | null;
|
|
15
|
+
contentRef: RefObject<HTMLElement | null> | null;
|
|
16
16
|
};
|
|
17
17
|
/**
|
|
18
18
|
* Calculates optimal position for floating content relative to pointer coordinates,
|
|
@@ -3,7 +3,7 @@ export type RadioNavigationConfig = {
|
|
|
3
3
|
baseId: string;
|
|
4
4
|
getItems: () => string[];
|
|
5
5
|
getItemId?: (baseId: string, itemId: string) => string;
|
|
6
|
-
rootRef?: RefObject<HTMLElement>;
|
|
6
|
+
rootRef?: RefObject<HTMLElement | null>;
|
|
7
7
|
value: string | undefined;
|
|
8
8
|
onValueChange: (value: string) => void;
|
|
9
9
|
isItemDisabled: (id: string) => boolean;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { RefObject } from 'react';
|
|
2
2
|
export type UseScrollActiveIntoViewConfig = {
|
|
3
3
|
/** Reference to the container element */
|
|
4
|
-
containerRef: RefObject<HTMLElement> | null;
|
|
4
|
+
containerRef: RefObject<HTMLElement | null> | null;
|
|
5
5
|
/** ID of the currently active item (undefined if no active item) */
|
|
6
6
|
activeId: string | undefined;
|
|
7
7
|
/**
|
|
@@ -3,7 +3,7 @@ export type StepNavigationConfig = {
|
|
|
3
3
|
baseId: string;
|
|
4
4
|
getItems: () => string[];
|
|
5
5
|
getNextFocusable?: (baseId: string, itemId: string) => string;
|
|
6
|
-
rootRef?: RefObject<HTMLElement>;
|
|
6
|
+
rootRef?: RefObject<HTMLElement | null>;
|
|
7
7
|
value: string | undefined;
|
|
8
8
|
onValueChange: (value: string) => void;
|
|
9
9
|
isItemDisabled: (id: string) => boolean;
|
|
@@ -4,7 +4,7 @@ export type UseSubmenuSafeAreaConfig = {
|
|
|
4
4
|
/** Whether the submenu is open (tracking is active) */
|
|
5
5
|
enabled: boolean;
|
|
6
6
|
/** Reference to the submenu content element — used to compute its near edge */
|
|
7
|
-
submenuRef: RefObject<HTMLElement>;
|
|
7
|
+
submenuRef: RefObject<HTMLElement | null>;
|
|
8
8
|
/**
|
|
9
9
|
* Which side the submenu sits on relative to its trigger.
|
|
10
10
|
* - 'right': near edge is the submenu's LEFT edge; pointer travels right toward it
|