ant-design/components/menu/MenuItem.tsx
zombieJ d366886dcb add title support in menu item (#12952)
* add title support in menu item

* hide title when inlineCollapsed

* fix typo
2018-11-20 23:26:40 +08:00

50 lines
1.2 KiB
TypeScript

import * as React from 'react';
import { Item } from 'rc-menu';
import * as PropTypes from 'prop-types';
import Tooltip from '../tooltip';
interface MenuItemProps {
rootPrefixCls?: string;
disabled?: boolean;
level?: number;
title?: React.ReactNode;
children?: React.ReactNode;
}
class MenuItem extends React.Component<MenuItemProps, any> {
static contextTypes = {
inlineCollapsed: PropTypes.bool,
};
static isMenuItem = 1;
context: any;
private menuItem: any;
onKeyDown = (e: React.MouseEvent<HTMLElement>) => {
this.menuItem.onKeyDown(e);
}
saveMenuItem = (menuItem: any) => {
this.menuItem = menuItem;
}
render() {
const { inlineCollapsed } = this.context;
const { level, children, rootPrefixCls } = this.props;
const { title, ...rest } = this.props;
let titleNode;
if (inlineCollapsed) {
titleNode = title || (level === 1 ? children : '');
}
return (
<Tooltip
title={titleNode}
placement="right"
overlayClassName={`${rootPrefixCls}-inline-collapsed-tooltip`}
>
<Item {...rest} title={inlineCollapsed ? null : title} ref={this.saveMenuItem} />
</Tooltip>
);
}
}
export default MenuItem;