@difizen/mana-core
Version:
113 lines (94 loc) • 2.72 kB
text/typescript
import type { Event, Disposable } from '@difizen/mana-common';
import type { CommandHandler } from '../command';
/**
* Instance of toolbar
* Use this token to get the toolbar instance when customizing elements on the toolbar.
*/
export const ToolbarInstance = Symbol('ToolbarInstance');
/**
* Factory for instantiating toolbars.
*/
export const ToolbarItemFactory = Symbol('ToolbarItemFactory');
export interface ToolbarItemFactory {
(item: ToolbarNode): ToolbarItem;
}
export const ToolbarNode = Symbol('ToolbarItemDefinition');
type Partial<T> = {
[P in keyof T]?: T[P] | undefined;
};
export type ToolbarNode = BaseToolbarNode & Partial<CommandHandler>;
export interface BaseToolbarNode {
/**
* The unique ID of the toolbar item.
*/
readonly id: string;
/**
* The command to execute.
*/
readonly command: string;
/**
* Priority among the items. Can be negative. The smaller the number the left-most the item will be placed in the toolbar. It is `0` by default.
*/
// readonly priority?: number;
/**
* show in the `...` dropdown
*/
readonly extra?: boolean | undefined;
/**
* The order to display toolbar item inline or in the `...` dropdown.
*/
readonly order?: string | undefined;
/**
* When extra, group means that the item will be located in a submenu(s) of the `...` dropdown.
* The submenu's title is named by the name in group, e.g. ['menu', 'submenu'].
*/
readonly group?: string | string[] | undefined;
/**
* Optional label for the item.
*/
readonly label?: React.ReactNode | React.FC;
/**
* Optional tooltip for the item.
*/
readonly tooltip?: React.ReactNode | React.FC;
/**
* Optional icon for the item.
*/
readonly icon?: React.ReactNode | React.FC;
/**
* Show toolbar item label inline.
*/
readonly showLabelInline?: boolean | undefined;
/**
* Custom meta data for the item.
*/
meta?: Record<string, any> | undefined;
}
export interface ToolbarItem extends ToolbarNode, Disposable {
source: ToolbarNode;
onDisposed: Event<void>;
}
export namespace ToolbarItem {
export function isDefinition(
arg: Record<string, any> | undefined,
): arg is ToolbarNode {
return (
!!arg &&
'id' in arg &&
'command' in arg &&
typeof (arg as any).command === 'string'
);
}
export function is(arg: Record<string, any> | undefined): arg is ToolbarItem {
return isDefinition(arg) && 'onDisposed' in arg;
}
export function getGroupKey(record: ToolbarItem): string {
if (!record.group) {
return '';
}
if (typeof record.group === 'string') {
return record.group;
}
return record.group.join('.');
}
}