chowa
Version:
UI component library based on React
81 lines (80 loc) • 3.12 kB
JavaScript
/**
* @license chowa v1.1.3
*
* Copyright (c) Chowa Techonlogies Co.,Ltd.(http://www.chowa.cn).
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
;
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const PropTypes = require("prop-types");
const classnames_1 = require("classnames");
const utils_1 = require("../utils");
const icon_1 = require("../icon");
const transition_1 = require("../transition");
const dropdown_menu_1 = require("./dropdown-menu");
class DropdownMenuSubmenu extends React.PureComponent {
constructor(props) {
super(props);
this.timer = null;
this.state = {
visible: false
};
[
'onMouseEnterHandler',
'onMouseLeaveHandler'
].forEach((fn) => {
this[fn] = this[fn].bind(this);
});
}
onMouseEnterHandler() {
if (this.timer !== null) {
clearTimeout(this.timer);
this.timer = null;
}
this.setState({
visible: true
});
}
onMouseLeaveHandler() {
this.timer = window.setTimeout(() => {
this.setState({
visible: false
});
this.timer = null;
}, 100);
}
render() {
const { children, title, className, style, disabled } = this.props;
const { visible } = this.state;
const componentClass = classnames_1.default({
[utils_1.preClass('dropdown-submenu')]: true,
[utils_1.preClass('dropdown-menu-disabled')]: disabled,
[className]: utils_1.isExist(className)
});
const contentClass = classnames_1.default({
[utils_1.preClass('dropdown-submenu-content')]: true,
[utils_1.preClass('dropdown-content')]: true
});
return (React.createElement("li", { style: style, className: componentClass },
React.createElement("div", { onMouseEnter: disabled ? null : this.onMouseEnterHandler, onMouseLeave: disabled ? null : this.onMouseLeaveHandler, className: utils_1.preClass('dropdown-menu-title') },
React.createElement("span", null, title),
React.createElement(icon_1.default, { type: 'arrow-right' })),
!disabled &&
React.createElement(transition_1.default, { visible: visible, enter: utils_1.preClass('zoom-right-enter'), appear: utils_1.preClass('zoom-appear'), leave: utils_1.preClass('zoom-right-leave') },
React.createElement("div", { className: contentClass, onMouseEnter: this.onMouseEnterHandler, onMouseLeave: this.onMouseLeaveHandler },
React.createElement(dropdown_menu_1.default, null, children)))));
}
}
DropdownMenuSubmenu.propTypes = {
className: PropTypes.string,
style: PropTypes.object,
disabled: PropTypes.bool,
title: PropTypes.node.isRequired
};
DropdownMenuSubmenu.defaultProps = {
disabled: false
};
exports.default = DropdownMenuSubmenu;