import './demo5.css';
import Overlay from '..';
import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from '../..';
const { Popup } = Overlay;
class Demo extends React.Component {
    constructor() {
        super(...arguments);
        this.state = {
            visible: false,
            groupVisible: false,
        };
        this.onVisibleChange = visible => {
            this.setState({
                visible,
            });
        };
        this.onGroupVisibleChange = groupVisible => {
            this.setState({
                groupVisible,
            });
        };
    }
    render() {
        return (React.createElement("div", null,
            React.createElement("div", null,
                React.createElement(Popup, { trigger: React.createElement(Button, null, "Open"), triggerType: "click", visible: this.state.visible, onVisibleChange: this.onVisibleChange },
                    React.createElement("span", { className: "overlay-demo" }, "Hello World From Popup!"))),
            React.createElement("br", null),
            React.createElement("div", null,
                React.createElement(Popup, { trigger: React.createElement(Button, { style: { marginRight: '50px' }, ref: ref => { this.btn1 = ref; } }, "Paired Popup 1"), triggerType: "click", visible: this.state.groupVisible, safeNode: [() => this.btn2, () => this.overlay2], onVisibleChange: this.onGroupVisibleChange },
                    React.createElement("span", { className: "overlay-demo", ref: ref => { this.overlay1 = ref; } }, "Hello World From Popup!")),
                React.createElement(Popup, { trigger: React.createElement(Button, { ref: ref => { this.btn2 = ref; } }, "Paired Popup 2"), triggerType: "click", visible: this.state.groupVisible, safeNode: [() => this.btn1, () => this.overlay1], onVisibleChange: this.onGroupVisibleChange },
                    React.createElement("span", { className: "overlay-demo", ref: ref => { this.overlay2 = ref; } }, "Hello World From Popup!")))));
    }
}
ReactDOM.render(React.createElement(Demo, null), document.getElementById('overlay-demo-5'));
