@vuu-ui/vuu-ui-controls 0.8.22-debug → 0.8.23-debug

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/cjs/index.js +2818 -1629
  2. package/cjs/index.js.map +4 -4
  3. package/esm/index.js +2592 -1374
  4. package/esm/index.js.map +4 -4
  5. package/index.css +220 -0
  6. package/index.css.map +3 -3
  7. package/package.json +7 -7
  8. package/types/calendar/internal/utils.d.ts +1 -2
  9. package/types/combo-box/ComboBox.d.ts +3 -1
  10. package/types/combo-box/useCombobox.d.ts +5 -5
  11. package/types/drag-drop/dragDropTypes.d.ts +12 -7
  12. package/types/drag-drop/drop-target-utils.d.ts +20 -28
  13. package/types/drag-drop/useDragDisplacers.d.ts +4 -2
  14. package/types/drag-drop/useDragDropCopy.d.ts +5 -1
  15. package/types/drag-drop/useDragDropIndicator.d.ts +1 -1
  16. package/types/drag-drop/useDragDropNaturalMovement.d.ts +1 -1
  17. package/types/dropdown/useDropdown.d.ts +1 -1
  18. package/types/editable/editable-utils.d.ts +1 -3
  19. package/types/editable/useEditableText.d.ts +1 -2
  20. package/types/index.d.ts +5 -0
  21. package/types/list/common-hooks/useCollapsibleGroups.d.ts +2 -2
  22. package/types/list/common-hooks/useKeyboardNavigation.d.ts +1 -1
  23. package/types/list/index.d.ts +0 -1
  24. package/types/list/listTypes.d.ts +3 -3
  25. package/types/list/useList.d.ts +1 -1
  26. package/types/list/useListHeight.d.ts +1 -3
  27. package/types/measured-container/MeasuredContainer.d.ts +15 -0
  28. package/types/measured-container/index.d.ts +2 -0
  29. package/types/measured-container/useMeasuredContainer.d.ts +22 -0
  30. package/types/measured-container/useResizeObserver.d.ts +15 -0
  31. package/types/overflow-container/OverflowContainer.d.ts +17 -0
  32. package/types/overflow-container/index.d.ts +2 -0
  33. package/types/overflow-container/overflow-utils.d.ts +49 -0
  34. package/types/overflow-container/useOverflowContainer.d.ts +20 -0
  35. package/types/split-button/SplitButton.d.ts +11 -0
  36. package/types/split-button/index.d.ts +1 -0
  37. package/types/split-button/useSplitButton.d.ts +289 -0
  38. package/types/tabstrip/useTabstrip.d.ts +1 -1
  39. package/types/toolbar/Toolbar.d.ts +21 -0
  40. package/types/toolbar/index.d.ts +1 -0
  41. package/types/toolbar/toolbar-dom-utils.d.ts +3 -0
  42. package/types/toolbar/useKeyboardNavigation.d.ts +32 -0
  43. package/types/toolbar/useSelection.d.ts +22 -0
  44. package/types/toolbar/useToolbar.d.ts +28 -0
  45. package/types/tree/Tree.d.ts +1 -1
  46. package/types/list/VirtualizedList.d.ts +0 -7
  47. package/types/list/useVirtualization.d.ts +0 -15
@@ -0,0 +1,289 @@
1
+ import { PopupMenuProps } from "@vuu-ui/vuu-popups";
2
+ import { FocusEventHandler, KeyboardEventHandler } from "react";
3
+ import { SplitButtonProps } from "./SplitButton";
4
+ export interface SplitButtonHookProps extends Pick<SplitButtonProps, "PopupMenuProps" | "ButtonProps" | "onClick" | "segmented"> {
5
+ classBase: string;
6
+ }
7
+ export declare const useSplitButton: ({ ButtonProps: ButtonPropsProp, PopupMenuProps, classBase, onClick, segmented, }: SplitButtonHookProps) => {
8
+ ButtonProps: {
9
+ onClick: ((evt: any) => void) | undefined;
10
+ onKeyDown: KeyboardEventHandler<HTMLButtonElement>;
11
+ disabled?: boolean | undefined;
12
+ focusableWhenDisabled?: boolean | undefined;
13
+ variant?: "primary" | "secondary" | "cta" | undefined;
14
+ type?: "button" | "reset" | "submit" | undefined;
15
+ className?: string | undefined;
16
+ hidden?: boolean | undefined;
17
+ name?: string | undefined;
18
+ value?: string | number | readonly string[] | undefined;
19
+ color?: string | undefined;
20
+ content?: string | undefined;
21
+ style?: import("react").CSSProperties | undefined;
22
+ key?: import("react").Key | null | undefined;
23
+ defaultChecked?: boolean | undefined;
24
+ defaultValue?: string | number | readonly string[] | undefined;
25
+ suppressContentEditableWarning?: boolean | undefined;
26
+ suppressHydrationWarning?: boolean | undefined;
27
+ accessKey?: string | undefined;
28
+ autoFocus?: boolean | undefined;
29
+ contentEditable?: "inherit" | (boolean | "false" | "true") | undefined;
30
+ contextMenu?: string | undefined;
31
+ dir?: string | undefined;
32
+ draggable?: (boolean | "false" | "true") | undefined;
33
+ id?: string | undefined;
34
+ lang?: string | undefined;
35
+ nonce?: string | undefined;
36
+ placeholder?: string | undefined;
37
+ slot?: string | undefined;
38
+ spellCheck?: (boolean | "false" | "true") | undefined;
39
+ tabIndex?: number | undefined;
40
+ title?: string | undefined;
41
+ translate?: "yes" | "no" | undefined;
42
+ radioGroup?: string | undefined;
43
+ role?: import("react").AriaRole | undefined;
44
+ about?: string | undefined;
45
+ datatype?: string | undefined;
46
+ inlist?: any;
47
+ prefix?: string | undefined;
48
+ property?: string | undefined;
49
+ rel?: string | undefined;
50
+ resource?: string | undefined;
51
+ rev?: string | undefined;
52
+ typeof?: string | undefined;
53
+ vocab?: string | undefined;
54
+ autoCapitalize?: string | undefined;
55
+ autoCorrect?: string | undefined;
56
+ autoSave?: string | undefined;
57
+ itemProp?: string | undefined;
58
+ itemScope?: boolean | undefined;
59
+ itemType?: string | undefined;
60
+ itemID?: string | undefined;
61
+ itemRef?: string | undefined;
62
+ results?: number | undefined;
63
+ security?: string | undefined;
64
+ unselectable?: "on" | "off" | undefined;
65
+ inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
66
+ is?: string | undefined;
67
+ 'aria-activedescendant'?: string | undefined;
68
+ 'aria-atomic'?: (boolean | "false" | "true") | undefined;
69
+ 'aria-autocomplete'?: "both" | "none" | "inline" | "list" | undefined;
70
+ 'aria-busy'?: (boolean | "false" | "true") | undefined;
71
+ 'aria-checked'?: boolean | "mixed" | "false" | "true" | undefined;
72
+ 'aria-colcount'?: number | undefined;
73
+ 'aria-colindex'?: number | undefined;
74
+ 'aria-colspan'?: number | undefined;
75
+ 'aria-controls'?: string | undefined;
76
+ 'aria-current'?: boolean | "page" | "false" | "true" | "step" | "location" | "date" | "time" | undefined;
77
+ 'aria-describedby'?: string | undefined;
78
+ 'aria-details'?: string | undefined;
79
+ 'aria-disabled'?: (boolean | "false" | "true") | undefined;
80
+ 'aria-dropeffect'?: "none" | "copy" | "move" | "link" | "execute" | "popup" | undefined;
81
+ 'aria-errormessage'?: string | undefined;
82
+ 'aria-expanded'?: (boolean | "false" | "true") | undefined;
83
+ 'aria-flowto'?: string | undefined;
84
+ 'aria-grabbed'?: (boolean | "false" | "true") | undefined;
85
+ 'aria-haspopup'?: boolean | "listbox" | "grid" | "menu" | "false" | "true" | "dialog" | "tree" | undefined;
86
+ 'aria-hidden'?: (boolean | "false" | "true") | undefined;
87
+ 'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
88
+ 'aria-keyshortcuts'?: string | undefined;
89
+ 'aria-label'?: string | undefined;
90
+ 'aria-labelledby'?: string | undefined;
91
+ 'aria-level'?: number | undefined;
92
+ 'aria-live'?: "off" | "assertive" | "polite" | undefined;
93
+ 'aria-modal'?: (boolean | "false" | "true") | undefined;
94
+ 'aria-multiline'?: (boolean | "false" | "true") | undefined;
95
+ 'aria-multiselectable'?: (boolean | "false" | "true") | undefined;
96
+ 'aria-orientation'?: "horizontal" | "vertical" | undefined;
97
+ 'aria-owns'?: string | undefined;
98
+ 'aria-placeholder'?: string | undefined;
99
+ 'aria-posinset'?: number | undefined;
100
+ 'aria-pressed'?: boolean | "mixed" | "false" | "true" | undefined;
101
+ 'aria-readonly'?: (boolean | "false" | "true") | undefined;
102
+ 'aria-relevant'?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
103
+ 'aria-required'?: (boolean | "false" | "true") | undefined;
104
+ 'aria-roledescription'?: string | undefined;
105
+ 'aria-rowcount'?: number | undefined;
106
+ 'aria-rowindex'?: number | undefined;
107
+ 'aria-rowspan'?: number | undefined;
108
+ 'aria-selected'?: (boolean | "false" | "true") | undefined;
109
+ 'aria-setsize'?: number | undefined;
110
+ 'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
111
+ 'aria-valuemax'?: number | undefined;
112
+ 'aria-valuemin'?: number | undefined;
113
+ 'aria-valuenow'?: number | undefined;
114
+ 'aria-valuetext'?: string | undefined;
115
+ children?: import("react").ReactNode;
116
+ dangerouslySetInnerHTML?: {
117
+ __html: string | TrustedHTML;
118
+ } | undefined;
119
+ onCopy?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
120
+ onCopyCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
121
+ onCut?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
122
+ onCutCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
123
+ onPaste?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
124
+ onPasteCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
125
+ onCompositionEnd?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
126
+ onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
127
+ onCompositionStart?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
128
+ onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
129
+ onCompositionUpdate?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
130
+ onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
131
+ onFocus?: FocusEventHandler<HTMLButtonElement> | undefined;
132
+ onFocusCapture?: FocusEventHandler<HTMLButtonElement> | undefined;
133
+ onBlur?: FocusEventHandler<HTMLButtonElement> | undefined;
134
+ onBlurCapture?: FocusEventHandler<HTMLButtonElement> | undefined;
135
+ onChange?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
136
+ onChangeCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
137
+ onBeforeInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
138
+ onBeforeInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
139
+ onInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
140
+ onInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
141
+ onReset?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
142
+ onResetCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
143
+ onSubmit?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
144
+ onSubmitCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
145
+ onInvalid?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
146
+ onInvalidCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
147
+ onLoad?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
148
+ onLoadCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
149
+ onError?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
150
+ onErrorCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
151
+ onKeyDownCapture?: KeyboardEventHandler<HTMLButtonElement> | undefined;
152
+ onKeyPress?: KeyboardEventHandler<HTMLButtonElement> | undefined;
153
+ onKeyPressCapture?: KeyboardEventHandler<HTMLButtonElement> | undefined;
154
+ onKeyUp?: KeyboardEventHandler<HTMLButtonElement> | undefined;
155
+ onKeyUpCapture?: KeyboardEventHandler<HTMLButtonElement> | undefined;
156
+ onAbort?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
157
+ onAbortCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
158
+ onCanPlay?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
159
+ onCanPlayCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
160
+ onCanPlayThrough?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
161
+ onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
162
+ onDurationChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
163
+ onDurationChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
164
+ onEmptied?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
165
+ onEmptiedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
166
+ onEncrypted?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
167
+ onEncryptedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
168
+ onEnded?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
169
+ onEndedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
170
+ onLoadedData?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
171
+ onLoadedDataCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
172
+ onLoadedMetadata?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
173
+ onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
174
+ onLoadStart?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
175
+ onLoadStartCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
176
+ onPause?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
177
+ onPauseCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
178
+ onPlay?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
179
+ onPlayCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
180
+ onPlaying?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
181
+ onPlayingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
182
+ onProgress?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
183
+ onProgressCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
184
+ onRateChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
185
+ onRateChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
186
+ onSeeked?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
187
+ onSeekedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
188
+ onSeeking?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
189
+ onSeekingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
190
+ onStalled?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
191
+ onStalledCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
192
+ onSuspend?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
193
+ onSuspendCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
194
+ onTimeUpdate?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
195
+ onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
196
+ onVolumeChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
197
+ onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
198
+ onWaiting?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
199
+ onWaitingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
200
+ onAuxClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
201
+ onAuxClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
202
+ onClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
203
+ onContextMenu?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
204
+ onContextMenuCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
205
+ onDoubleClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
206
+ onDoubleClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
207
+ onDrag?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
208
+ onDragCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
209
+ onDragEnd?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
210
+ onDragEndCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
211
+ onDragEnter?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
212
+ onDragEnterCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
213
+ onDragExit?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
214
+ onDragExitCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
215
+ onDragLeave?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
216
+ onDragLeaveCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
217
+ onDragOver?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
218
+ onDragOverCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
219
+ onDragStart?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
220
+ onDragStartCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
221
+ onDrop?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
222
+ onDropCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
223
+ onMouseDown?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
224
+ onMouseDownCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
225
+ onMouseEnter?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
226
+ onMouseLeave?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
227
+ onMouseMove?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
228
+ onMouseMoveCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
229
+ onMouseOut?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
230
+ onMouseOutCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
231
+ onMouseOver?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
232
+ onMouseOverCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
233
+ onMouseUp?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
234
+ onMouseUpCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
235
+ onSelect?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
236
+ onSelectCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
237
+ onTouchCancel?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
238
+ onTouchCancelCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
239
+ onTouchEnd?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
240
+ onTouchEndCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
241
+ onTouchMove?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
242
+ onTouchMoveCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
243
+ onTouchStart?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
244
+ onTouchStartCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
245
+ onPointerDown?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
246
+ onPointerDownCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
247
+ onPointerMove?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
248
+ onPointerMoveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
249
+ onPointerUp?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
250
+ onPointerUpCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
251
+ onPointerCancel?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
252
+ onPointerCancelCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
253
+ onPointerEnter?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
254
+ onPointerEnterCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
255
+ onPointerLeave?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
256
+ onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
257
+ onPointerOver?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
258
+ onPointerOverCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
259
+ onPointerOut?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
260
+ onPointerOutCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
261
+ onGotPointerCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
262
+ onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
263
+ onLostPointerCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
264
+ onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
265
+ onScroll?: import("react").UIEventHandler<HTMLButtonElement> | undefined;
266
+ onScrollCapture?: import("react").UIEventHandler<HTMLButtonElement> | undefined;
267
+ onWheel?: import("react").WheelEventHandler<HTMLButtonElement> | undefined;
268
+ onWheelCapture?: import("react").WheelEventHandler<HTMLButtonElement> | undefined;
269
+ onAnimationStart?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
270
+ onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
271
+ onAnimationEnd?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
272
+ onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
273
+ onAnimationIteration?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
274
+ onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
275
+ onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
276
+ onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
277
+ form?: string | undefined;
278
+ formAction?: string | undefined;
279
+ formEncType?: string | undefined;
280
+ formMethod?: string | undefined;
281
+ formNoValidate?: boolean | undefined;
282
+ formTarget?: string | undefined;
283
+ };
284
+ PopupMenuProps: PopupMenuProps;
285
+ buttonRef: import("react").RefObject<HTMLButtonElement>;
286
+ rootRef: import("react").RefObject<HTMLDivElement>;
287
+ onClick: ((evt: any) => void) | undefined;
288
+ onFocus: FocusEventHandler<Element>;
289
+ };
@@ -1,5 +1,5 @@
1
1
  import type { MenuActionHandler } from "@vuu-ui/vuu-data-types";
2
- import type { OverflowItem } from "@vuu-ui/vuu-layout";
2
+ import type { OverflowItem } from "@vuu-ui/vuu-ui-controls";
3
3
  import { orientationType } from "@vuu-ui/vuu-utils";
4
4
  import { KeyboardEvent, MouseEvent as ReactMouseEvent, RefObject } from "react";
5
5
  export type ExitEditModeHandler = (originalValue: string, editedValue: string, allowDeactivation: boolean, tabIndex: number) => void;
@@ -0,0 +1,21 @@
1
+ /// <reference types="react" />
2
+ import { SelectionStrategy, SpecialKeyMultipleSelection } from "@vuu-ui/vuu-ui-controls";
3
+ import { OverflowContainerProps } from "../overflow-container";
4
+ import "./Toolbar.css";
5
+ export type ActiveItemChangeHandler = (itemIndex: number[]) => void;
6
+ export type NavigationOutOfBoundsHandler = (direction: "start" | "end") => void;
7
+ export interface ToolbarProps extends OverflowContainerProps {
8
+ activeItemIndex?: number[];
9
+ alignItems?: "start" | "center" | "end";
10
+ defaultActiveItemIndex?: number[];
11
+ onActiveChange?: ActiveItemChangeHandler;
12
+ /**
13
+ * Indicates that user has used Arrow key navigation to move beyond the
14
+ * last or before the first item. A higher level component may want to
15
+ * use this to implement a seamless navigation across components.
16
+ */
17
+ onNavigateOutOfBounds?: NavigationOutOfBoundsHandler;
18
+ selectionStrategy?: SelectionStrategy | SpecialKeyMultipleSelection;
19
+ showSeparators?: boolean;
20
+ }
21
+ export declare const Toolbar: ({ activeItemIndex: activeItemIndexProp, alignItems, defaultActiveItemIndex, children, className, id: idProp, onActiveChange, onNavigateOutOfBounds, orientation, selectionStrategy, showSeparators, ...props }: ToolbarProps) => JSX.Element;
@@ -0,0 +1 @@
1
+ export * from "./Toolbar";
@@ -0,0 +1,3 @@
1
+ export declare const getIndexOfItem: (container: HTMLElement | null, query: string) => number;
2
+ export declare const getIndexOfSelectedTab: (container: HTMLElement | null) => number;
3
+ export declare const getIndexOfEditedItem: (container: HTMLElement | null) => number;
@@ -0,0 +1,32 @@
1
+ import { orientationType } from "@vuu-ui/vuu-utils";
2
+ import { FocusEvent, FocusEventHandler, KeyboardEvent, MouseEvent as ReactMouseEvent, MouseEventHandler, RefObject } from "react";
3
+ import { NavigationOutOfBoundsHandler } from "./Toolbar";
4
+ import { PopupCloseCallback } from "@vuu-ui/vuu-popups";
5
+ export interface ContainerNavigationProps {
6
+ onBlur: FocusEventHandler;
7
+ onFocus: FocusEventHandler;
8
+ onMouseDownCapture: MouseEventHandler;
9
+ onMouseLeave: MouseEventHandler;
10
+ }
11
+ interface ToolbarNavigationHookProps {
12
+ containerRef: RefObject<HTMLElement>;
13
+ defaultHighlightedIdx?: number;
14
+ highlightedIdx?: number;
15
+ onNavigateOutOfBounds?: NavigationOutOfBoundsHandler;
16
+ orientation: orientationType;
17
+ }
18
+ interface ToolbarNavigationHookResult {
19
+ containerProps: ContainerNavigationProps;
20
+ focusableIdx: number;
21
+ highlightedIdx: number;
22
+ focusItem: (itemIndex: number, immediateFocus?: boolean, withKeyboard?: boolean, delay?: number) => void;
23
+ focusVisible: number;
24
+ focusIsWithinComponent: boolean;
25
+ onClick: (evt: ReactMouseEvent, tabIndex: number) => void;
26
+ onFocus: (evt: FocusEvent<HTMLElement>) => void;
27
+ onKeyDown: (evt: KeyboardEvent) => void;
28
+ onOverflowMenuClose?: PopupCloseCallback;
29
+ setHighlightedIdx: (highlightedIndex: number) => void;
30
+ }
31
+ export declare const useKeyboardNavigation: ({ containerRef, defaultHighlightedIdx, highlightedIdx: highlightedIdxProp, onNavigateOutOfBounds, orientation, }: ToolbarNavigationHookProps) => ToolbarNavigationHookResult;
32
+ export {};
@@ -0,0 +1,22 @@
1
+ import { SelectionStrategy, SpecialKeyMultipleSelection } from "@vuu-ui/vuu-ui-controls";
2
+ import { MouseEvent, RefObject } from "react";
3
+ export interface SelectionHookProps {
4
+ containerRef: RefObject<HTMLElement>;
5
+ defaultSelected?: number[];
6
+ highlightedIdx: number;
7
+ itemQuery: string;
8
+ onSelectionChange?: (selectedIndices: number[]) => void;
9
+ selected?: number[];
10
+ selectionStrategy: SelectionStrategy | SpecialKeyMultipleSelection;
11
+ }
12
+ export interface ItemHandlers {
13
+ onClick?: (e: MouseEvent, itemIndex: number) => void;
14
+ onKeyDown?: (event: React.KeyboardEvent) => void;
15
+ }
16
+ export interface SelectionHookResult {
17
+ activateItem: (tabIndex: number) => void;
18
+ itemHandlers: ItemHandlers;
19
+ isControlled: boolean;
20
+ selected: number[];
21
+ }
22
+ export declare const useSelection: ({ defaultSelected, highlightedIdx, onSelectionChange, selected: selectedProp, selectionStrategy, }: SelectionHookProps) => SelectionHookResult;
@@ -0,0 +1,28 @@
1
+ import { KeyboardEvent, MouseEvent as ReactMouseEvent, RefObject } from "react";
2
+ import { OverflowItem } from "../overflow-container";
3
+ import { ToolbarProps } from "./Toolbar";
4
+ export interface ToolbarHookProps extends Pick<ToolbarProps, "activeItemIndex" | "defaultActiveItemIndex" | "onActiveChange" | "onNavigateOutOfBounds">, Required<Pick<ToolbarProps, "orientation" | "selectionStrategy">> {
5
+ containerRef: RefObject<HTMLElement>;
6
+ itemQuery?: string;
7
+ }
8
+ export declare const useToolbar: ({ activeItemIndex: activeItemIndexProp, defaultActiveItemIndex, containerRef, itemQuery, onActiveChange, onNavigateOutOfBounds, orientation, selectionStrategy, }: ToolbarHookProps) => {
9
+ activeItemIndex: number[];
10
+ focusableIdx: number;
11
+ focusVisible: number;
12
+ containerProps: {
13
+ onSwitchWrappedItemIntoView: (item: OverflowItem) => void;
14
+ onBlur: import("react").FocusEventHandler<Element>;
15
+ onFocus: import("react").FocusEventHandler<Element>;
16
+ onMouseDownCapture: import("react").MouseEventHandler<Element>;
17
+ onMouseLeave: import("react").MouseEventHandler<Element>;
18
+ PopupMenuProps: {
19
+ onKeyDown: (evt: KeyboardEvent) => void;
20
+ onMenuClose: import("packages/vuu-popups/src").PopupCloseCallback | undefined;
21
+ };
22
+ };
23
+ itemProps: {
24
+ onClick: (evt: ReactMouseEvent<HTMLElement>) => void;
25
+ onFocus: (evt: import("react").FocusEvent<HTMLElement, Element>) => void;
26
+ onKeyDown: (evt: KeyboardEvent) => void;
27
+ };
28
+ };
@@ -28,7 +28,7 @@ export interface TreeProps extends HTMLAttributes<HTMLUListElement> {
28
28
  defaultSelected?: any;
29
29
  groupSelection?: GroupSelection;
30
30
  onHighlight?: (index: number) => void;
31
- onSelectionChange: (selected: TreeSourceNode[]) => void;
31
+ onSelectionChange?: (selected: TreeSourceNode[]) => void;
32
32
  revealSelected?: boolean;
33
33
  selected?: string[];
34
34
  selection?: TreeSelection;
@@ -1,7 +0,0 @@
1
- import { ForwardedRef, ReactElement } from "react";
2
- import { SelectionStrategy } from "../common-hooks";
3
- import { ListProps } from "./listTypes";
4
- import "./List.css";
5
- export declare const VirtualizedList: <Item = string, Selection_1 extends SelectionStrategy = "default">(props: ListProps<Item, Selection_1> & {
6
- ref?: ForwardedRef<HTMLDivElement> | undefined;
7
- }) => ReactElement<ListProps<Item, Selection_1>, string | import("react").JSXElementConstructor<any>>;
@@ -1,15 +0,0 @@
1
- import { CollectionItem } from "../common-hooks";
2
- import { ViewportRange } from "./useScrollPosition";
3
- /**
4
- * [ item key, total height before the item, next row index, CollectionItem<Item>]
5
- * e.g. first item: [0, 0, 1, data[0]]
6
- */
7
- export type Row<Item> = [number, number, number, CollectionItem<Item>];
8
- interface VirtualizationHookProps<Item> {
9
- data: CollectionItem<Item>[];
10
- listItemGapSize?: number;
11
- listItemHeight: number;
12
- viewportRange: ViewportRange;
13
- }
14
- export declare const useVirtualization: <Item>({ data, listItemGapSize, listItemHeight, viewportRange, }: VirtualizationHookProps<Item>) => Row<Item>[];
15
- export {};