import { ISequence } from '../algorithm/sequence'; import { Message } from '../core/messaging'; import { ISignal } from '../core/signaling'; import { Title } from './title'; import { VNode } from './vdom'; import { Widget } from './widget'; /** * A widget which displays titles as a single row or column of tabs. * * #### Notes * If CSS transforms are used to rotate nodes for vertically oriented * text, then tab dragging will not work correctly. The `tabsMovable` * property should be set to `false` when rotating nodes from CSS. */ export declare class TabBar extends Widget { /** * Construct a new tab bar. * * @param options - The options for initializing the tab bar. */ constructor(options?: TabBar.IOptions); /** * Dispose of the resources held by the widget. */ dispose(): void; /** * A signal emitted when the current tab is changed. * * #### Notes * This signal is emitted when the currently selected tab is changed * either through user or programmatic interaction. * * Notably, this signal is not emitted when the index of the current * tab changes due to tabs being inserted, removed, or moved. It is * only emitted when the actual current tab node is changed. */ currentChanged: ISignal; /** * A signal emitted when a tab is moved by the user. * * #### Notes * This signal is emitted when a tab is moved by user interaction. * * This signal is not emitted when a tab is moved programmatically. */ tabMoved: ISignal; /** * A signal emitted when a tab is clicked by the user. * * #### Notes * If the clicked tab is not the current tab, the clicked tab will be * made current and the `currentChanged` signal will be emitted first. * * This signal is emitted even if the clicked tab is the current tab. */ tabActivateRequested: ISignal; /** * A signal emitted when a tab close icon is clicked. * * #### Notes * This signal is not emitted unless the tab title is `closable`. */ tabCloseRequested: ISignal; /** * A signal emitted when a tab is dragged beyond the detach threshold. * * #### Notes * This signal is emitted when the user drags a tab with the mouse, * and mouse is dragged beyond the detach threshold. * * The consumer of the signal should call `releaseMouse` and remove * the tab in order to complete the detach. * * This signal is only emitted once per drag cycle. */ tabDetachRequested: ISignal; /** * Get the tab bar content node. * * #### Notes * This is the node which holds the tab nodes. * * Modifying this node directly can lead to undefined behavior. * * This is a read-only property. */ readonly contentNode: HTMLUListElement; /** * A read-only sequence of the titles in the tab bar. * * #### Notes * This is a read-only property. */ readonly titles: ISequence; /** * Get the currently selected title. * * #### Notes * This will be `null` if no tab is selected. */ /** * Set the currently selected title. * * #### Notes * If the title does not exist, the title will be set to `null`. */ currentTitle: Title; /** * Get the index of the currently selected tab. * * #### Notes * This will be `-1` if no tab is selected. */ /** * Set the index of the currently selected tab. * * #### Notes * If the value is out of range, the index will be set to `-1`. */ currentIndex: number; /** * Get the orientation of the tab bar. * * #### Notes * This controls whether the tabs are arranged in a row or column. */ /** * Set the orientation of the tab bar. * * #### Notes * This controls whether the tabs are arranged in a row or column. */ orientation: TabBar.Orientation; /** * Get whether the tabs are movable by the user. * * #### Notes * Tabs can always be moved programmatically. */ /** * Set whether the tabs are movable by the user. * * #### Notes * Tabs can always be moved programmatically. */ tabsMovable: boolean; /** * Get whether a tab can be deselected by the user. * * #### Notes * Tabs can be always be deselected programmatically. */ /** * Set whether a tab can be deselected by the user. * * #### Notes * Tabs can be always be deselected programmatically. */ allowDeselect: boolean; /** * Get the selection behavior when inserting a tab. */ /** * Set the selection behavior when inserting a tab. */ insertBehavior: TabBar.InsertBehavior; /** * Get the selection behavior when removing a tab. */ /** * Set the selection behavior when removing a tab. */ removeBehavior: TabBar.RemoveBehavior; /** * The renderer used by the tab bar. * * #### Notes * This is a read-only property. */ readonly renderer: TabBar.IRenderer; /** * Add a tab to the end of the tab bar. * * @param value - The title which holds the data for the tab, * or an options object to convert to a title. * * @returns The title object added to the tab bar. * * #### Notes * If the title is already added to the tab bar, it will be moved. */ addTab(value: Title | Title.IOptions): Title; /** * Insert a tab into the tab bar at the specified index. * * @param index - The index at which to insert the tab. * * @param value - The title which holds the data for the tab, * or an options object to convert to a title. * * @returns The title object added to the tab bar. * * #### Notes * The index will be clamped to the bounds of the tabs. * * If the title is already added to the tab bar, it will be moved. */ insertTab(index: number, value: Title | Title.IOptions): Title; /** * Remove a tab from the tab bar. * * @param title - The title for the tab to remove. * * @returns The index occupied by the tab, or `-1` if the tab * was not contained in the tab bar. */ removeTab(title: Title): number; /** * Remove the tab at a given index from the tab bar. * * @param index - The index of the tab to remove. * * @returns The title occupying the index, or `null` if the index * is out of range. */ removeTabAt(index: number): Title; /** * Remove all tabs from the tab bar. */ clearTabs(): void; /** * Release the mouse and restore the non-dragged tab positions. * * #### Notes * This will cause the tab bar to stop handling mouse events and to * restore the tabs to their non-dragged positions. */ releaseMouse(): void; /** * Handle the DOM events for the tab bar. * * @param event - The DOM event sent to the tab bar. * * #### Notes * This method implements the DOM `EventListener` interface and is * called in response to events on the tab bar's DOM node. * * This should not be called directly by user code. */ handleEvent(event: Event): void; /** * A message handler invoked on an `'after-attach'` message. */ protected onAfterAttach(msg: Message): void; /** * A message handler invoked on a `'before-detach'` message. */ protected onBeforeDetach(msg: Message): void; /** * A message handler invoked on an `'update-request'` message. */ protected onUpdateRequest(msg: Message): void; /** * Handle the `'keydown'` event for the tab bar. */ private _evtKeyDown(event); /** * Handle the `'click'` event for the tab bar. */ private _evtClick(event); /** * Handle the `'mousedown'` event for the tab bar. */ private _evtMouseDown(event); /** * Handle the `'mousemove'` event for the tab bar. */ private _evtMouseMove(event); /** * Handle the `'mouseup'` event for the tab bar. */ private _evtMouseUp(event); /** * Release the mouse and restore the non-dragged tab positions. */ private _releaseMouse(); /** * Adjust the current index for a tab insert operation. * * This method accounts for the tab bar's insertion behavior when * adjusting the current index and emitting the changed signal. */ private _adjustCurrentForInsert(i, title); /** * Adjust the current index for a tab move operation. * * This method will not cause the actual current tab to change. * It silently adjusts the index to account for the given move. */ private _adjustCurrentForMove(i, j); /** * Adjust the current index for a tab remove operation. * * This method accounts for the tab bar's remove behavior when * adjusting the current index and emitting the changed signal. */ private _adjustCurrentForRemove(i, title); /** * Handle the `changed` signal of a title object. */ private _onTitleChanged(sender); private _currentIndex; private _tabsMovable; private _allowDeselect; private _renderer; private _previousTitle; private _titles; private _orientation; private _dragData; private _insertBehavior; private _removeBehavior; } /** * The namespace for the `TabBar` class statics. */ export declare namespace TabBar { /** * A type alias for a tab bar orientation. */ type Orientation = ('horizontal' | 'vertical'); /** * A type alias for the selection behavior on tab insert. */ type InsertBehavior = ('none' | 'select-tab' | 'select-tab-if-needed'); /** * A type alias for the selection behavior on tab remove. */ type RemoveBehavior = ('none' | 'select-tab-after' | 'select-tab-before' | 'select-previous-tab'); /** * An options object for creating a tab bar. */ interface IOptions { /** * The layout orientation of the tab bar. * * The default is `horizontal`. */ orientation?: TabBar.Orientation; /** * Whether the tabs are movable by the user. * * The default is `false`. */ tabsMovable?: boolean; /** * Whether a tab can be deselected by the user. * * The default is `false`. */ allowDeselect?: boolean; /** * The selection behavior when inserting a tab. * * The default is `'select-tab-if-needed'`. */ insertBehavior?: TabBar.InsertBehavior; /** * The selection behavior when removing a tab. * * The default is `'select-tab-after'`. */ removeBehavior?: TabBar.RemoveBehavior; /** * A renderer to use with the tab bar. * * The default is a shared renderer instance. */ renderer?: IRenderer; } /** * The arguments object for the `currentChanged` signal. */ interface ICurrentChangedArgs { /** * The previously selected index. */ previousIndex: number; /** * The previously selected title. */ previousTitle: Title; /** * The currently selected index. */ currentIndex: number; /** * The currently selected title. */ currentTitle: Title; } /** * The arguments object for the `tabMoved` signal. */ interface ITabMovedArgs { /** * The previous index of the tab. */ fromIndex: number; /** * The current index of the tab. */ toIndex: number; /** * The title for the tab. */ title: Title; } /** * The arguments object for the `tabActivateRequested` signal. */ interface ITabActivateRequestedArgs { /** * The index of the tab to activate. */ index: number; /** * The title for the tab. */ title: Title; } /** * The arguments object for the `tabCloseRequested` signal. */ interface ITabCloseRequestedArgs { /** * The index of the tab to close. */ index: number; /** * The title for the tab. */ title: Title; } /** * The arguments object for the `tabDetachRequested` signal. */ interface ITabDetachRequestedArgs { /** * The index of the tab to detach. */ index: number; /** * The title for the tab. */ title: Title; /** * The node representing the tab. */ tab: HTMLElement; /** * The current client X position of the mouse. */ clientX: number; /** * The current client Y position of the mouse. */ clientY: number; } /** * An object which holds the data to render a tab. */ interface IRenderData { /** * The title associated with the tab. */ title: Title; /** * Whether the tab is the current tab. */ current: boolean; /** * The z-index for the tab. */ zIndex: number; } /** * A renderer for use with a tab bar. */ interface IRenderer { /** * A selector which matches the close icon node in a tab. * * #### Notes * This should be a read-only property. */ closeIconSelector: string; /** * Render the node for the a tab. * * @param data - The data to use for rendering the tab. * * @returns A virtual DOM node representing the tab. */ renderTab(data: IRenderData): VNode; } /** * The default implementation of `IRenderer`. */ class Renderer implements IRenderer { /** * Construct a new renderer. * * @param options - The options for initializing the renderer. */ constructor(options?: Renderer.IOptions); /** * A selector which matches the close icon node in a tab. * * #### Notes * This is a read-only property. */ readonly closeIconSelector: string; /** * Render the node for the a tab. * * @param data - The data to use for rendering the tab. * * @returns A virtual DOM node representing the tab. */ renderTab(data: IRenderData): VNode; /** * Create a unique render key for the tab. * * @param data - The data to use for the tab. * * @returns The unique render key for the tab. * * #### Notes * This method caches the key against the tab title the first time * the key is generated. This enables efficient rendering of moved * tabs and avoids subtle hover style artifacts. */ createTabKey(data: IRenderData): string; /** * Create the inline style object for a tab. * * @param data - The data to use for the tab. * * @returns The inline style data for the tab. */ createTabStyle(data: IRenderData): any; /** * Create the class name for the tab. * * @param data - The data to use for the tab. * * @returns The full class name for the tab. */ createTabClass(data: IRenderData): string; /** * Create the class name for the tab icon. * * @param data - The data to use for the tab. * * @returns The full class name for the tab icon. */ createIconClass(data: IRenderData): string; private _tabID; private _extraTabClass; private _tabKeys; } /** * The namespace for the `Renderer` class statics. */ namespace Renderer { /** * An options object for creating a renderer. */ interface IOptions { /** * The extra CSS class name to add to each tab. */ extraTabClass?: string; } } /** * The default `Renderer` instance. */ const defaultRenderer: Renderer; }