import './demo6.css';
import Checkbox from '../../checkbox';
import Menu from '..';
import Radio from '../../radio';
import React from 'react';
import ReactDOM from 'react-dom';
const { SubMenu, Item } = Menu;
class Demo extends React.Component {
    constructor(props) {
        super(props);
        this.handleIconDirectionChange = () => {
            this.setState({
                isSelectIconRight: !this.state.isSelectIconRight,
            });
        };
        this.onSelectModeChange = selectMode => {
            console.log(selectMode, '=======');
            this.setState({
                selectMode,
            });
        };
        this.handleSelect = (selectedKeys, ...others) => {
            this.setState({
                selectedKeys,
            });
            console.log(selectedKeys, ...others);
        };
        this.state = {
            selectMode: undefined,
            multiple: false,
            isSelectIconRight: false,
            selectedKeys: ['1'],
        };
    }
    render() {
        const { selectMode, selectedKeys, isSelectIconRight } = this.state;
        return (React.createElement("div", null,
            React.createElement(Radio.Group, { value: selectMode, onChange: this.onSelectModeChange },
                React.createElement(Radio, { value: "single" }, "\u5355\u9009\u5E26\u7B26\u53F7"),
                React.createElement(Radio, { value: undefined }, "\u5355\u9009\u4E0D\u5E26\u7B26\u53F7(\u9ED8\u8BA4)"),
                React.createElement(Radio, { value: "multiple" }, "\u591A\u9009")),
            React.createElement("br", null),
            selectMode ? (React.createElement(Checkbox, { checked: isSelectIconRight, onChange: this.handleIconDirectionChange }, "\u5207\u6362\u6807\u8BB0\u4F4D\u7F6E (\u9ED8\u8BA4\u5728\u5DE6)")) : null,
            React.createElement("br", null),
            React.createElement(Menu, { isSelectIconRight: isSelectIconRight, className: "my-select-menu", defaultOpenKeys: ['sub'], selectMode: selectMode, selectedKeys: selectedKeys, onSelect: this.handleSelect },
                React.createElement(Item, { key: "1" }, "Option 1"),
                React.createElement(Item, { disabled: true, key: "2" }, "Disabled option 2"),
                React.createElement(SubMenu, { key: "sub", label: "Sub menu" },
                    React.createElement(Item, { key: "sub-1" }, "Sub option 1"),
                    React.createElement(Item, { key: "sub-2" }, "Sub option 2")),
                React.createElement(Item, { key: "3" }, "Option 3"))));
    }
}
ReactDOM.render(React.createElement(Demo, null), document.getElementById('menu-demo-6'));
