@tomino/dynamic-form-semantic-ui/dist/cjs/editor/modal_preview_code.js

Semantic UI form renderer based on dynamic form generation

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const semantic_ui_react_1 = require("semantic-ui-react");
const editor_styles_1 = require("./editor_styles");
const properties_common_1 = require("../properties/properties_common");
const editor_context_1 = require("./editor_context");
const helpers_1 = require("../helpers");
function copyStringToClipboard(str) {
    var el = document.createElement('textarea');
    el.value = str || '';
    el.setAttribute('readonly', '');
    el.style.position = 'absolute';
    el.style.left = '-9999px';
    document.body.appendChild(el);
    el.select();
    document.execCommand('copy');
    document.body.removeChild(el);
}
function download(data, filename, type = 'text/plain') {
    var file = new Blob([data], { type: type });
    if (window.navigator.msSaveOrOpenBlob)
        window.navigator.msSaveOrOpenBlob(file, filename);
    else {
        var a = document.createElement('a'), url = URL.createObjectURL(file);
        a.href = url;
        a.download = filename;
        document.body.appendChild(a);
        a.click();
        setTimeout(function () {
            document.body.removeChild(a);
            window.URL.revokeObjectURL(url);
        }, 0);
    }
}
exports.ModalCode = () => {
    const [open, changeOpen] = react_1.default.useState(false);
    const editorState = react_1.default.useContext(editor_context_1.EditorContext);
    const schema = editorState.schema ? helpers_1.schemaDatasetToJS(editorState.schema) : null;
    const form = editorState.form ? helpers_1.formDatasetToJS(editorState.form) : null;
    const text = JSON.stringify({
        form,
        schema
    }, null, 2);
    function buttons(text = '') {
        return (react_1.default.createElement("div", { className: editor_styles_1.modalActions },
            text && react_1.default.createElement("div", { className: properties_common_1.tableRowFull }, text),
            react_1.default.createElement(semantic_ui_react_1.Button, { onClick: () => changeOpen(false) }, "Close"),
            react_1.default.createElement(semantic_ui_react_1.Button, { primary: true, onClick: () => {
                    download(text, 'form.ts');
                    changeOpen(false);
                }, icon: "download", color: "green", content: "Download" }),
            react_1.default.createElement(semantic_ui_react_1.Button, { onClick: () => {
                    copyStringToClipboard(text);
                    changeOpen(false);
                }, icon: "copy", color: "green", content: "Copy to Clipboard" })));
    }
    return (react_1.default.createElement(semantic_ui_react_1.Modal, { trigger: react_1.default.createElement(semantic_ui_react_1.Menu.Item, { icon: "code", title: "Source code of the form", onClick: () => {
                changeOpen(true);
            } }), open: open },
        react_1.default.createElement(semantic_ui_react_1.Modal.Header, null, buttons('Form Source')),
        react_1.default.createElement(semantic_ui_react_1.Modal.Content, null,
            react_1.default.createElement(semantic_ui_react_1.Modal.Description, null,
                react_1.default.createElement("pre", null, text),
                buttons()))));
};
//# sourceMappingURL=modal_preview_code.js.map