import Radio from '../../radio';
import React from 'react';
import ReactDOM from 'react-dom';
import Select from '..';
class DemoWithFillProps extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            value: '',
            fillProps: 'value',
            placeholder: 'Fill with value',
        };
        this.handleCtrlChange = fillProps => {
            this.setState({
                fillProps,
                value: '',
                placeholder: `Fill with ${fillProps}`,
            });
        };
        this.handleChange = value => {
            this.setState({ value });
        };
    }
    render() {
        const dataSource = [
            { value: 'Hang Meimei', label: '韩梅梅' },
            { value: 'Gao Hui', label: '高辉' },
            { value: 'Zhang San', label: '张三' },
            { value: 'Li Si', label: '李四' },
            { value: 'Wang Wu', label: '王五' },
            { value: 'Sun Yang', label: '孙杨' },
        ];
        return (React.createElement("div", { style: { marginBottom: 20 } },
            React.createElement(Radio.Group, { style: { marginRight: 10 }, shape: "button", value: this.state.fillProps, onChange: this.handleCtrlChange },
                React.createElement(Radio, { value: "value" }, "value"),
                React.createElement(Radio, { value: "label" }, "label")),
            React.createElement(Select, { placeholder: this.state.placeholder, value: this.state.value, fillProps: this.state.fillProps, style: { width: 300 }, onChange: this.handleChange, dataSource: dataSource })));
    }
}
const DemoWithValueRender = () => {
    const dataSource = [
        { value: 'Lilith', age: 22, gender: 'F' },
        { value: 'Tom Cat', age: 28, gender: 'M' },
        { value: 'Jim Green', age: 18, gender: 'M' },
        { value: 'Monkey King', age: 999, gender: 'M' },
    ];
    const valueRender = v => {
        return `${v.value} / ${v.gender} / ${v.age}`;
    };
    return (React.createElement(Select, { mode: "multiple", placeholder: "Custom with valueRender", valueRender: valueRender, dataSource: dataSource }));
};
ReactDOM.render(React.createElement("div", null,
    React.createElement(DemoWithFillProps, null),
    React.createElement(DemoWithValueRender, null)), document.getElementById('select-demo-7'));
