import { Component } from 'vidom';
import { Modal, Button } from 'vidom-components';
// import Button from '../../../Button';
// import Select from '../../Select';

// <Select
//     size="m"
//     mode="radio"
//     options={ [1, 2, 3, 4].map(i => ({ value : i, content : 'item-' + i })) }
//     value={ 2 }
// />

export default class SimpleExample extends Component {
    onInit() {
        this.setState({ visible : false });
    }

    onRender() {
        const { visible } = this.state;

        return (
            <fragment>
                <Button
                    theme="islands"
                    size="m"
                    onClick={ () => { this.setState({ visible : !this.state.visible }); } }
                    text={ (visible? 'Close' : 'Open') + ' modal' }
                />
                <Modal
                    theme="islands"
                    visible={ visible }
                    autoclosable
                    onHide={ () => { this.setState({ visible : false }) } }
                >
                    <div style={ { padding : '50px' } }>
                        <Button theme="islands" size="m" text="test1"/>
                        <Button theme="islands" size="m" text="test2"/>
                        <Button theme="islands" size="m" text="test3"/>
                    </div>
                </Modal>
            </fragment>
        );
    }
}

@@ -81,241 +81,8 @@
 ts';
-%0A// import Button from '../../../Button';%0A// import Select from '../../Select';%0A%0A// %3CSelect%0A//     size=%22m%22%0A//     mode=%22radio%22%0A//     options=%7B %5B1, 2, 3, 4%5D.map(i =%3E (%7B value : i, content : 'item-' + i %7D)) %7D%0A//     value=%7B 2 %7D%0A// /%3E
 %0A%0Aex
@@ -455,26 +455,11 @@
 e : 
-!this.state.visibl
+tru
 e %7D)
@@ -863,196 +863,516 @@
    %3C
-Button theme=%22islands%22 size=%22m%22 text=%22test1%22/%3E%0A                        %3CButton theme=%22islands%22 size=%22m%22 text=%22test2%22/%3E%0A                        %3CButton theme=%22islands%22 size=%22m%22 text=%22test3%22
+div style=%7B %7B width : '200px', marginBottom : '10px' %7D %7D%3E%0A                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.%0A                        %3C/div%3E%0A                        %3CButton%0A                            theme=%22islands%22%0A                            size=%22m%22%0A                            onClick=%7B () =%3E %7B this.setState(%7B visible : false %7D); %7D %7D%0A                            text=%22Close me%22%0A                        
 /%3E%0A 

Fix modal example