import CheckboxTree from 'react-checkbox-tree';

const nodes = [{
    value: 'node-1',
    title: 'Parent Node 1',
    children: [{
        value: 'node-1-1',
        title: 'Leaf Node 1-1',
    }, {
        value: 'node-1-2',
        title: 'Leaf Node 1-2'
    }],
}];

class Widget extends React.Component {
    constructor() {
        super();

        this.state = {
            checked: [],
            expanded: [],
        };
    }

    render() {
        const { checked, expanded } = this.state;

        return (
            <Tree
                name="tree_nodes"
                nodes={nodes}
                checked={checked}
                expanded={expanded}
                onCheck={checked => this.setState({ checked }}
                onExpand={expanded => this.setState({ expanded }}
            />
        );
    }
}