@yandex/ui
Version:
Yandex UI components
24 lines (23 loc) • 2.01 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ComplexPopup = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var bundle_1 = require("@yandex-lego/components/Button/desktop/bundle");
var bundle_2 = require("@yandex-lego/components/Popup/desktop/bundle");
var ComplexPopup = function () {
var _a = tslib_1.__read(react_1.useState(false), 2), visible1 = _a[0], setVisible1 = _a[1];
var _b = tslib_1.__read(react_1.useState(false), 2), visible2 = _b[0], setVisible2 = _b[1];
var buttonRef1 = react_1.useRef(null);
var buttonRef2 = react_1.useRef(null);
var rootRef = react_1.useRef(null);
return (react_1.default.createElement("div", { ref: rootRef, style: { position: 'relative', height: '200px' } },
react_1.default.createElement(bundle_1.Button, { innerRef: buttonRef1, view: "default", size: "m", onClick: function () { return setVisible1(!visible1); } }, "\u041E\u0442\u043A\u0440\u044B\u0442\u044C"),
react_1.default.createElement(bundle_2.Popup, { visible: visible1, scope: rootRef, anchor: buttonRef1, onClose: function () { return setVisible1(false); }, target: "anchor", view: "default", hasTail: true },
react_1.default.createElement("div", { style: { padding: 16, fontFamily: 'var(--control-font-family)' } },
"content-1",
react_1.default.createElement(bundle_1.Button, { innerRef: buttonRef2, view: "default", size: "m", onClick: function () { return setVisible2(!visible2); } }, "\u041E\u0442\u043A\u0440\u044B\u0442\u044C")),
react_1.default.createElement(bundle_2.Popup, { visible: visible2, scope: rootRef, anchor: buttonRef2, onClose: function () { return setVisible2(false); }, target: "anchor", view: "default", hasTail: true },
react_1.default.createElement("div", { style: { padding: 16, fontFamily: 'var(--control-font-family)' } }, "content-2")))));
};
exports.ComplexPopup = ComplexPopup;