@yandex/ui/MessageBox/__examples__/complex.js

Yandex UI components

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Complex = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importDefault(require("react"));
var bundle_1 = require("@yandex-lego/components/Button/desktop/bundle");
var bundle_2 = require("@yandex-lego/components/MessageBox/desktop/bundle");
var bundle_3 = require("@yandex-lego/components/Spin/bundle");
var Progress_1 = require("@yandex-lego/components/Progress");
var Theme_1 = require("@yandex-lego/components/Theme");
var brand_1 = require("@yandex-lego/components/Theme/presets/brand");
var Complex = function () { return (react_1.default.createElement(react_1.default.Fragment, null,
    react_1.default.createElement("div", { style: { padding: '16px' } },
        react_1.default.createElement(bundle_2.MessageBox, { size: "l", view: "default", onClose: function () { }, background: react_1.default.createElement("img", { style: { filter: 'opacity(.5)', width: '100%' }, src: "//jing.yandex-team.ru/files/axaxaman/catalogue-banner-x3.jpeg" }) },
            react_1.default.createElement(bundle_2.Wrapper, null,
                react_1.default.createElement("p", null, "\u041D\u0430\u0432\u044B\u043A \u0434\u043D\u044F"),
                react_1.default.createElement("h1", null, "\u0420\u0430\u0437\u0432\u0438\u0432\u0430\u0439\u0442\u0435 \u0440\u0435\u0447\u044C \u0440\u0435\u0431\u0435\u043D\u043A\u0430"),
                react_1.default.createElement("p", null, "\u0422\u0440\u0435\u043D\u0430\u0436\u0435\u0440 \u0434\u043B\u044F \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044F \u0440\u0435\u0447\u0438")))),
    react_1.default.createElement("div", { style: { padding: '16px' } },
        react_1.default.createElement(bundle_2.MessageBox, { view: "default", background: react_1.default.createElement(Progress_1.Progress, { style: { height: '100%', backgroundColor: '#2196f3' }, value: 0.65 }) },
            react_1.default.createElement(bundle_2.Wrapper, { leading: react_1.default.createElement("span", { className: Theme_1.cnTheme(brand_1.theme) },
                    react_1.default.createElement(bundle_3.Spin, { view: "default", size: "xs", progress: true })), trailing: react_1.default.createElement(bundle_1.Button, { view: "clear", size: "s" }, "\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C") },
                react_1.default.createElement("b", null, "\u0417\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043E 35 \u0438\u0437 54 \u0444\u0430\u0439\u043B\u043E\u0432"),
                react_1.default.createElement("br", null),
                "\u041E\u0441\u0442\u0430\u043B\u043E\u0441\u044C 1 \u0447\u0430\u0441 30 \u043C\u0438\u043D\u0443\u0442"))))); };
exports.Complex = Complex;