You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

120 lines
4.1 KiB

4 months ago
import type { RuntimeContext } from '../../runtime/types';
import type { Element } from '../../types';
import type { IElementEvent } from '../../types/event';
import type { BasePluginOptions } from '../base-plugin';
import { BasePlugin } from '../base-plugin';
import type { Item } from './util';
/**
* <zh/>
*
* <en/> Contextmenu options
*/
export interface ContextmenuOptions extends BasePluginOptions {
/**
* <zh/> DOM
*
* <en/> The class name appended to the menu DOM for custom styles
* @defaultValue 'g6-contextmenu'
*/
className?: string;
/**
* <zh/>
* - `'click'` :
* - `'contextmenu'` :
*
* <en/> How to trigger the context menu
* - `'click'` : Click trigger
* - `'contextmenu'` : Right-click trigger
* @defaultValue 'contextmenu'
*/
trigger?: 'click' | 'contextmenu';
/**
* <zh/> XY
*
* <en/> The offset X, y direction of the menu
* @defaultValue [4, 4]
*/
offset?: [number, number];
/**
* <zh/>
*
* <en/> The callback method triggered when the menu is clicked
*/
onClick?: (value: string, target: HTMLElement, current: Element) => void;
/**
* <zh/> `Promise` `getContent`
*
* <en/> Return the list of menu items, support the `Promise` type return value. It is a shortcut configuration of `getContent`
*/
getItems?: (event: IElementEvent) => Item[] | Promise<Item[]>;
/**
* <zh/> `Promise` 使 `getItems`
*
* <en/> Return the content of menu, support the `Promise` type return value, you can also use `getItems` for shortcut configuration
*/
getContent?: (event: IElementEvent) => HTMLElement | string | Promise<HTMLElement | string>;
/**
* <zh/> `getContent` `Promise` 使
*
* <en/> The menu content when loading is used when getContent returns a Promise
*/
loadingContent?: HTMLElement | string;
/**
* <zh/>
*
* <en/> Whether the plugin is available, determine whether the right-click menu is supported through parameters, The default is all available
* @defaultValue true
*/
enable?: boolean | ((event: IElementEvent) => boolean);
}
/**
* <zh/>
*
* <en/> Contextmenu
* @remarks
* <zh/>
*
* <en/> Contextmenu, also known as the right-click menu , is a menu that appears when a user clicks on a specific area. Supports triggering custom events before and after clicking.
*/
export declare class Contextmenu extends BasePlugin<ContextmenuOptions> {
static defaultOptions: Partial<ContextmenuOptions>;
private $element;
private targetElement;
constructor(context: RuntimeContext, options: ContextmenuOptions);
private initElement;
/**
* <zh/>
*
* <en/> Show the contextmenu
* @param event - <zh/> | <en/> Element pointer event
* @internal
*/
show(event: IElementEvent): Promise<void>;
/**
* <zh/>
*
* <en/> Hide the contextmenu
*/
hide(): void;
/**
* <zh/>
*
* <en/> Update the contextmenu options
* @param options - <zh/> | <en/> Options
* @internal
*/
update(options: Partial<ContextmenuOptions>): void;
/**
* <zh/>
*
* <en/> Destroy the contextmenu
* @internal
*/
destroy(): void;
private getDOMContent;
private bindEvents;
private unbindEvents;
private onTriggerEvent;
private onMenuItemClick;
}