UNPKG

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