UNPKG

4.52 kBTypeScriptView Raw
1import * as React from "react";
2import { AbstractPureComponent2 } from "../../common";
3import { ActionProps, IElementRefProps, LinkProps } from "../../common/props";
4import { IPopoverProps } from "../popover/popover";
5import { MenuProps } from "./menu";
6/** @deprecated use MenuItemProps */
7export declare type IMenuItemProps = MenuItemProps;
8export interface MenuItemProps extends ActionProps, LinkProps, IElementRefProps<HTMLLIElement> {
9 /** Item text, required for usability. */
10 text: React.ReactNode;
11 /**
12 * Whether this item should render with an active appearance. Used to indicate keyboard focus.
13 */
14 active?: boolean;
15 /**
16 * Children of this component will be rendered in a __submenu__ that appears when hovering or
17 * clicking on this menu item.
18 *
19 * Use `text` prop for the content of the menu item itself.
20 */
21 children?: React.ReactNode;
22 /**
23 * Whether this menu item is non-interactive. Enabling this prop will ignore `href`, `tabIndex`,
24 * and mouse event handlers (in particular click, down, enter, leave).
25 */
26 disabled?: boolean;
27 /**
28 * Right-aligned label text content, useful for displaying hotkeys.
29 *
30 * This prop actually supports JSX elements, but TypeScript will throw an error because
31 * `HTMLAttributes` only allows strings. Use `labelElement` to supply a JSX element in TypeScript.
32 */
33 label?: string;
34 /**
35 * A space-delimited list of class names to pass along to the right-aligned label wrapper element.
36 */
37 labelClassName?: string;
38 /**
39 * Right-aligned label content, useful for displaying hotkeys.
40 */
41 labelElement?: React.ReactNode;
42 /**
43 * Changes the ARIA `role` property structure of this MenuItem to accomodate for various
44 * different `role`s of the parent Menu `ul` element.
45 *
46 * If `menuitem`, role structure becomes:
47 *
48 * `<li role="none"`
49 * `<a role="menuitem"`
50 *
51 * which is proper role structure for a `<ul role="menu"` parent (this is the default `role` of a `Menu`).
52 *
53 * If `listoption`, role structure becomes:
54 *
55 * `<li role="option"`
56 * `<a role=undefined`
57 *
58 * which is proper role structure for a `<ul role="listbox"` parent, or a `<select>` parent.
59 *
60 * If `listitem`, role structure becomes:
61 *
62 * `<li role=undefined`
63 * `<a role=undefined`
64 *
65 * which can be used if this item is within a basic `<ul/>` (or `role="list"`) parent.
66 *
67 * If `none`, role structure becomes:
68 *
69 * `<li role="none"`
70 * `<a role=undefined`
71 *
72 * which can be used if wrapping this item in a custom `<li>` parent.
73 *
74 * @default "menuitem"
75 */
76 roleStructure?: "menuitem" | "listoption" | "listitem" | "none";
77 /**
78 * Whether the text should be allowed to wrap to multiple lines.
79 * If `false`, text will be truncated with an ellipsis when it reaches `max-width`.
80 *
81 * @default false
82 */
83 multiline?: boolean;
84 /**
85 * Props to spread to `Popover`. Note that `content` and `minimal` cannot be
86 * changed and `usePortal` defaults to `false` so all submenus will live in
87 * the same container.
88 */
89 popoverProps?: Partial<IPopoverProps>;
90 /**
91 * Whether this item is selected. This will set the `aria-selected` attribute.
92 */
93 selected?: boolean;
94 /**
95 * Whether an enabled item without a submenu should automatically close its parent popover when clicked.
96 *
97 * @default true
98 */
99 shouldDismissPopover?: boolean;
100 /**
101 * Props to spread to the child `Menu` component if this item has a submenu.
102 */
103 submenuProps?: Partial<MenuProps>;
104 /**
105 * Name of the HTML tag that wraps the MenuItem.
106 *
107 * @default "a"
108 */
109 tagName?: keyof JSX.IntrinsicElements;
110 /**
111 * A space-delimited list of class names to pass along to the text wrapper element.
112 */
113 textClassName?: string;
114 /**
115 * HTML title to be passed to the <Text> component
116 */
117 htmlTitle?: string;
118}
119/**
120 * Menu item component.
121 *
122 * @see https://blueprintjs.com/docs/#core/components/menu.menu-item
123 */
124export declare class MenuItem extends AbstractPureComponent2<MenuItemProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> {
125 static defaultProps: MenuItemProps;
126 static displayName: string;
127 render(): JSX.Element;
128 private maybeRenderLabel;
129 private maybeRenderPopover;
130}