@yandex/ui
Version:
Yandex UI components
20 lines (19 loc) • 1.7 kB
JavaScript
import { __read } from "tslib";
import React, { useState, useRef } from 'react';
import { Button } from '@yandex-lego/components/Button/desktop/bundle';
import { Popup } from '@yandex-lego/components/Popup/desktop/bundle';
export var ComplexPopup = function () {
var _a = __read(useState(false), 2), visible1 = _a[0], setVisible1 = _a[1];
var _b = __read(useState(false), 2), visible2 = _b[0], setVisible2 = _b[1];
var buttonRef1 = useRef(null);
var buttonRef2 = useRef(null);
var rootRef = useRef(null);
return (React.createElement("div", { ref: rootRef, style: { position: 'relative', height: '200px' } },
React.createElement(Button, { innerRef: buttonRef1, view: "default", size: "m", onClick: function () { return setVisible1(!visible1); } }, "\u041E\u0442\u043A\u0440\u044B\u0442\u044C"),
React.createElement(Popup, { visible: visible1, scope: rootRef, anchor: buttonRef1, onClose: function () { return setVisible1(false); }, target: "anchor", view: "default", hasTail: true },
React.createElement("div", { style: { padding: 16, fontFamily: 'var(--control-font-family)' } },
"content-1",
React.createElement(Button, { innerRef: buttonRef2, view: "default", size: "m", onClick: function () { return setVisible2(!visible2); } }, "\u041E\u0442\u043A\u0440\u044B\u0442\u044C")),
React.createElement(Popup, { visible: visible2, scope: rootRef, anchor: buttonRef2, onClose: function () { return setVisible2(false); }, target: "anchor", view: "default", hasTail: true },
React.createElement("div", { style: { padding: 16, fontFamily: 'var(--control-font-family)' } }, "content-2")))));
};