UNPKG

14.5 kBTypeScriptView Raw
1import { ITranslator } from '@jupyterlab/translation';
2import { CommandRegistry } from '@lumino/commands';
3import { ReadonlyJSONObject } from '@lumino/coreutils';
4import { Message } from '@lumino/messaging';
5import { Layout, Widget } from '@lumino/widgets';
6import { LabIcon } from '../icon';
7import { ReactWidget } from './vdom';
8/**
9 * A class which provides a toolbar widget.
10 */
11export declare class Toolbar<T extends Widget = Widget> extends Widget {
12 /**
13 * Construct a new toolbar widget.
14 */
15 constructor(options?: Toolbar.IOptions);
16 /**
17 * Get an iterator over the ordered toolbar item names.
18 *
19 * @returns An iterator over the toolbar item names.
20 */
21 names(): IterableIterator<string>;
22 /**
23 * Add an item to the end of the toolbar.
24 *
25 * @param name - The name of the widget to add to the toolbar.
26 *
27 * @param widget - The widget to add to the toolbar.
28 *
29 * @param index - The optional name of the item to insert after.
30 *
31 * @returns Whether the item was added to toolbar. Returns false if
32 * an item of the same name is already in the toolbar.
33 *
34 * #### Notes
35 * The item can be removed from the toolbar by setting its parent to `null`.
36 */
37 addItem(name: string, widget: T): boolean;
38 /**
39 * Insert an item into the toolbar at the specified index.
40 *
41 * @param index - The index at which to insert the item.
42 *
43 * @param name - The name of the item.
44 *
45 * @param widget - The widget to add.
46 *
47 * @returns Whether the item was added to the toolbar. Returns false if
48 * an item of the same name is already in the toolbar.
49 *
50 * #### Notes
51 * The index will be clamped to the bounds of the items.
52 * The item can be removed from the toolbar by setting its parent to `null`.
53 */
54 insertItem(index: number, name: string, widget: T): boolean;
55 /**
56 * Insert an item into the toolbar at the after a target item.
57 *
58 * @param at - The target item to insert after.
59 *
60 * @param name - The name of the item.
61 *
62 * @param widget - The widget to add.
63 *
64 * @returns Whether the item was added to the toolbar. Returns false if
65 * an item of the same name is already in the toolbar.
66 *
67 * #### Notes
68 * The index will be clamped to the bounds of the items.
69 * The item can be removed from the toolbar by setting its parent to `null`.
70 */
71 insertAfter(at: string, name: string, widget: T): boolean;
72 /**
73 * Insert an item into the toolbar at the before a target item.
74 *
75 * @param at - The target item to insert before.
76 *
77 * @param name - The name of the item.
78 *
79 * @param widget - The widget to add.
80 *
81 * @returns Whether the item was added to the toolbar. Returns false if
82 * an item of the same name is already in the toolbar.
83 *
84 * #### Notes
85 * The index will be clamped to the bounds of the items.
86 * The item can be removed from the toolbar by setting its parent to `null`.
87 */
88 insertBefore(at: string, name: string, widget: T): boolean;
89 /**
90 * Insert an item relatively to an other item.
91 */
92 protected insertRelative(at: string, offset: number, name: string, widget: T): boolean;
93 /**
94 * Handle the DOM events for the widget.
95 *
96 * @param event - The DOM event sent to the widget.
97 *
98 * #### Notes
99 * This method implements the DOM `EventListener` interface and is
100 * called in response to events on the dock panel's node. It should
101 * not be called directly by user code.
102 */
103 handleEvent(event: Event): void;
104 /**
105 * Handle a DOM click event.
106 */
107 protected handleClick(event: Event): void;
108 /**
109 * Handle `after-attach` messages for the widget.
110 */
111 protected onAfterAttach(msg: Message): void;
112 /**
113 * Handle `before-detach` messages for the widget.
114 */
115 protected onBeforeDetach(msg: Message): void;
116}
117/**
118 * A class which provides a toolbar widget.
119 */
120export declare class ReactiveToolbar extends Toolbar<Widget> {
121 /**
122 * Construct a new toolbar widget.
123 */
124 constructor();
125 /**
126 * Dispose of the widget and its descendant widgets.
127 */
128 dispose(): void;
129 /**
130 * Insert an item into the toolbar at the after a target item.
131 *
132 * @param at - The target item to insert after.
133 *
134 * @param name - The name of the item.
135 *
136 * @param widget - The widget to add.
137 *
138 * @returns Whether the item was added to the toolbar. Returns false if
139 * an item of the same name is already in the toolbar or if the target
140 * is the toolbar pop-up opener.
141 *
142 * #### Notes
143 * The index will be clamped to the bounds of the items.
144 * The item can be removed from the toolbar by setting its parent to `null`.
145 */
146 insertAfter(at: string, name: string, widget: Widget): boolean;
147 /**
148 * Insert an item relatively to an other item.
149 */
150 protected insertRelative(at: string, offset: number, name: string, widget: Widget): boolean;
151 /**
152 * Insert an item into the toolbar at the specified index.
153 *
154 * @param index - The index at which to insert the item.
155 *
156 * @param name - The name of the item.
157 *
158 * @param widget - The widget to add.
159 *
160 * @returns Whether the item was added to the toolbar. Returns false if
161 * an item of the same name is already in the toolbar.
162 *
163 * #### Notes
164 * The index will be clamped to the bounds of the items.
165 * The item can be removed from the toolbar by setting its parent to `null`.
166 */
167 insertItem(index: number, name: string, widget: Widget): boolean;
168 /**
169 * A message handler invoked on an `'after-show'` message.
170 *
171 * Invokes resizing to ensure correct display of items.
172 */
173 onAfterShow(msg: Message): void;
174 /**
175 * A message handler invoked on a `'before-hide'` message.
176 *
177 * It will hide the pop-up panel
178 */
179 onBeforeHide(msg: Message): void;
180 protected onResize(msg: Widget.ResizeMessage): void;
181 /**
182 * Move the toolbar items between the reactive toolbar and the popup toolbar,
183 * depending on the width of the toolbar and the width of each item.
184 *
185 * @param callTwice - whether to call the function twice.
186 *
187 * **NOTES**
188 * The `callTwice` parameter is useful when the toolbar is displayed the first time,
189 * because the size of the items is unknown before their first rendering. The first
190 * call will usually add all the items in the main toolbar, and the second call will
191 * reorganize the items between the main toolbar and the popup toolbar.
192 */
193 private _onResize;
194 private _getWidgetsToRemove;
195 private _saveWidgetWidth;
196 private _getWidgetWidth;
197 protected readonly popupOpener: ToolbarPopupOpener;
198 private readonly _resizer;
199 private readonly _widgetWidths;
200 private _widgetPositions;
201 private _zoom;
202 private _zoomChanged;
203}
204/**
205 * The namespace for Toolbar class statics.
206 */
207export declare namespace Toolbar {
208 /**
209 * The options used to create a toolbar.
210 */
211 interface IOptions {
212 /**
213 * Toolbar widget layout.
214 */
215 layout?: Layout;
216 }
217 /**
218 * Widget with associated toolbar
219 */
220 interface IWidgetToolbar extends Widget {
221 /**
222 * Toolbar of actions on the widget
223 */
224 toolbar?: Toolbar;
225 }
226 /**
227 * Create a toolbar spacer item.
228 *
229 * #### Notes
230 * It is a flex spacer that separates the left toolbar items
231 * from the right toolbar items.
232 */
233 function createSpacerItem(): Widget;
234}
235/**
236 * Namespace for ToolbarButtonComponent.
237 */
238export declare namespace ToolbarButtonComponent {
239 /**
240 * Interface for ToolbarButtonComponent props.
241 */
242 interface IProps {
243 className?: string;
244 /**
245 * Data set of the button
246 */
247 dataset?: DOMStringMap;
248 label?: string;
249 icon?: LabIcon.IMaybeResolvable;
250 iconClass?: string;
251 iconLabel?: string;
252 tooltip?: string;
253 onClick?: () => void;
254 enabled?: boolean;
255 pressed?: boolean;
256 pressedIcon?: LabIcon.IMaybeResolvable;
257 pressedTooltip?: string;
258 disabledTooltip?: string;
259 /**
260 * Trigger the button on the actual onClick event rather than onMouseDown.
261 *
262 * See note in ToolbarButtonComponent below as to why the default is to
263 * trigger on onMouseDown.
264 */
265 actualOnClick?: boolean;
266 /**
267 * The application language translator.
268 */
269 translator?: ITranslator;
270 }
271}
272/**
273 * React component for a toolbar button.
274 *
275 * @param props - The props for ToolbarButtonComponent.
276 */
277export declare function ToolbarButtonComponent(props: ToolbarButtonComponent.IProps): JSX.Element;
278/**
279 * Adds the toolbar button class to the toolbar widget.
280 * @param w Toolbar button widget.
281 */
282export declare function addToolbarButtonClass<T extends Widget = Widget>(w: T): T;
283/**
284 * Lumino Widget version of static ToolbarButtonComponent.
285 */
286export declare class ToolbarButton extends ReactWidget {
287 private props;
288 /**
289 * Creates a toolbar button
290 * @param props props for underlying `ToolbarButton` component
291 */
292 constructor(props?: ToolbarButtonComponent.IProps);
293 /**
294 * Sets the pressed state for the button
295 * @param value true if button is pressed, false otherwise
296 */
297 set pressed(value: boolean);
298 /**
299 * Returns true if button is pressed, false otherwise
300 */
301 get pressed(): boolean;
302 /**
303 * Sets the enabled state for the button
304 * @param value true to enable the button, false otherwise
305 */
306 set enabled(value: boolean);
307 /**
308 * Returns true if button is enabled, false otherwise
309 */
310 get enabled(): boolean;
311 /**
312 * Sets the click handler for the button
313 * @param value click handler
314 */
315 set onClick(value: () => void);
316 /**
317 * Returns the click handler for the button
318 */
319 get onClick(): () => void;
320 render(): JSX.Element;
321 private _pressed;
322 private _enabled;
323 private _onClick;
324}
325/**
326 * Namespace for CommandToolbarButtonComponent.
327 */
328export declare namespace CommandToolbarButtonComponent {
329 /**
330 * Interface for CommandToolbarButtonComponent props.
331 */
332 interface IProps {
333 /**
334 * Application commands registry
335 */
336 commands: CommandRegistry;
337 /**
338 * Command unique id
339 */
340 id: string;
341 /**
342 * Command arguments
343 */
344 args?: ReadonlyJSONObject;
345 /**
346 * Overrides command icon
347 */
348 icon?: LabIcon;
349 /**
350 * Overrides command label
351 */
352 label?: string | CommandRegistry.CommandFunc<string>;
353 /**
354 * Overrides command caption
355 */
356 caption?: string;
357 }
358}
359/**
360 * React component for a toolbar button that wraps a command.
361 *
362 * This wraps the ToolbarButtonComponent and watches the command registry
363 * for changes to the command.
364 */
365export declare function CommandToolbarButtonComponent(props: CommandToolbarButtonComponent.IProps): JSX.Element;
366export declare function addCommandToolbarButtonClass(w: Widget): Widget;
367/**
368 * Phosphor Widget version of CommandToolbarButtonComponent.
369 */
370export declare class CommandToolbarButton extends ReactWidget {
371 private props;
372 /**
373 * Creates a command toolbar button
374 * @param props props for underlying `CommandToolbarButtonComponent` component
375 */
376 constructor(props: CommandToolbarButtonComponent.IProps);
377 protected setCommandAttributes(commands: CommandRegistry, id: string, args: ReadonlyJSONObject | undefined): void;
378 render(): JSX.Element;
379}
380/**
381 * A class which provides a toolbar popup
382 * used to store widgets that don't fit
383 * in the toolbar when it is resized
384 */
385declare class ToolbarPopup extends Widget {
386 width: number;
387 /**
388 * Construct a new ToolbarPopup
389 */
390 constructor();
391 /**
392 * Updates the width of the popup, this
393 * should match with the toolbar width
394 *
395 * @param width - The width to resize to
396 * @protected
397 */
398 updateWidth(width: number): void;
399 /**
400 * Aligns the popup to left bottom of widget
401 *
402 * @param widget the widget to align to
403 * @private
404 */
405 alignTo(widget: Widget): void;
406 /**
407 * Inserts the widget at specified index
408 * @param index the index
409 * @param widget widget to add
410 */
411 insertWidget(index: number, widget: Widget): void;
412 /**
413 * Total number of widgets in the popup
414 */
415 widgetCount(): number;
416 /**
417 * Returns the widget at index
418 * @param index the index
419 */
420 widgetAt(index: number): Widget;
421}
422/**
423 * A class that provides a ToolbarPopupOpener,
424 * which is a button added to toolbar when
425 * the toolbar items overflow toolbar width
426 */
427declare class ToolbarPopupOpener extends ToolbarButton {
428 /**
429 * Create a new popup opener
430 */
431 constructor(props?: ToolbarButtonComponent.IProps);
432 /**
433 * Add widget to the popup, prepends widgets
434 * @param widget the widget to add
435 */
436 addWidget(widget: Widget): void;
437 /**
438 * Insert widget to the popup.
439 * @param widget the widget to add
440 */
441 insertWidget(index: number, widget: Widget): void;
442 /**
443 * Dispose of the widget and its descendant widgets.
444 *
445 * #### Notes
446 * It is unsafe to use the widget after it has been disposed.
447 *
448 * All calls made to this method after the first are a no-op.
449 */
450 dispose(): void;
451 /**
452 * Hides the opener and the popup
453 */
454 hide(): void;
455 /**
456 * Hides the popup
457 */
458 hidePopup(): void;
459 /**
460 * Updates width and position of the popup
461 * to align with the toolbar
462 */
463 updatePopup(): void;
464 /**
465 * Returns widget at index in the popup
466 * @param index
467 */
468 widgetAt(index: number): Widget;
469 /**
470 * Returns total number of widgets in the popup
471 *
472 * @returns Number of widgets
473 */
474 widgetCount(): number;
475 protected handleClick(): void;
476 protected popup: ToolbarPopup;
477}
478export {};