@wonderflow/react-components
Version:
UI components from Wonderflow's Wanda design system
66 lines • 2.28 kB
TypeScript
import { ReactNode } from 'react';
import { Polymorphic, SymbolProps, TooltipProps } from '../../..';
export declare type MenuItemProps = {
/**
* Content to display in the menu item.
*/
children: ReactNode;
/**
* Whether the menu item should have an icon
*/
icon?: SymbolProps['source'];
/**
* Set the position of the icon. Used only when icon is defined.
*/
iconPosition?: 'left' | 'right';
/**
* Whether the menu item should have a supporting text
*/
subtext?: string;
/**
* Set the size of the menu item.
* Font size and icon style will be adjusted to match the size.
*/
dimension?: 'small' | 'regular';
/**
* Callback function to be called when the menu item is pressed.
*/
onClick?: (event: Event, value: string) => void;
/**
* Add an extra description to the menu item.
* This uses the `<Tooltip>` component internally.
*/
description?: ReactNode;
/**
* Set disabled state. The item is not interactive and grayed out.
*/
disabled?: boolean;
/**
* Add or remove the padding from the menu item.
* This space is used to keep the content aligned across items with or without icons.
* We suggest to not remove the padding if you have items with icons in the same menu to
* keep a good readability.
*/
padding?: boolean;
/**
* Set item to gain focus automatically when the menu is opened.
* This property is commonly used on the first item in the menu.
*/
autoFocus?: boolean;
/**
* Add an element to decorate the menu item. This is useful for adding extra elements
* and informations to the menu item.
*
* @note Don't use interactive elements (link, buttons, etc..) as decoration
* if `Menu.Item` is rendered as ´<button>´ (default).
*/
decoration?: ReactNode;
/**
* Assign a string value to the menu option. This is returned when the menu item is clicked.
*/
value: string;
} & Pick<TooltipProps, 'placement'>;
declare type PolymorphicMenuItem = Polymorphic.ForwardRefComponent<'button', MenuItemProps>;
export declare const MenuItem: PolymorphicMenuItem;
export {};
//# sourceMappingURL=menu-item.d.ts.map