@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
52 lines (51 loc) • 1.93 kB
TypeScript
import React from "react";
import { ValidIconName } from "../Icon/canonicalIconNames";
import { TestableComponent } from "../interfaces";
import { ContextOverlayProps } from "./ContextOverlay";
export interface ContextMenuProps extends TestableComponent {
/**
* Addional CSS class names.
*/
className?: string;
/**
* The elements of the context menu.
* They will be wrapped in a `Menu` element automatically.
*/
children?: JSX.Element | JSX.Element[];
/**
* Toggler that need to be used to display menu.
* If a valid icon name is used then the icon element is displayed.
* In this case `togglerText`, `togglerLarge` and `tooltipAsTitle` are used, too.
*/
togglerElement?: ValidIconName | JSX.Element;
/**
* Text displayed as title or tooltip on toggler element.
*/
togglerText?: string;
/**
* Toggler element is displayed larger than normal.
*/
togglerLarge?: boolean;
/**
* Tooltip on toggler element is display as HTML title, not as extra tooltip element.
*/
tooltipAsTitle?: boolean;
/**
* Props to spread to `ContextOverlay` that is used to display the dropdown.
*/
contextOverlayProps?: Partial<Omit<ContextOverlayProps, "content" | "children" | "className">>;
/**
* Disables the button to open the menu.
*/
disabled?: boolean;
/**
* We use the target as placeholder before the real `<ContextMenu /` is rendered on first hover or focus event.
* In case of problems set this property to `true`.
*/
preventPlaceholder?: boolean;
}
/**
* Element displays menu items after toggler is clicked.
*/
export declare const ContextMenu: ({ children, className, togglerElement, togglerText, contextOverlayProps, disabled, togglerLarge, tooltipAsTitle, preventPlaceholder, ...restProps }: ContextMenuProps) => React.JSX.Element;
export default ContextMenu;