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

Semantic UI form renderer based on dynamic form generation

import React from 'react';
import { Modal, Menu, Button } from 'semantic-ui-react';
import { modalActions } from './editor_styles';
import { tableRowFull } from '../properties/properties_common';
import { EditorContext } from './editor_context';
import { formDatasetToJS, schemaDatasetToJS } from '../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);
    }
}
export const ModalCode = () => {
    const [open, changeOpen] = React.useState(false);
    const editorState = React.useContext(EditorContext);
    const schema = editorState.schema ? schemaDatasetToJS(editorState.schema) : null;
    const form = editorState.form ? formDatasetToJS(editorState.form) : null;
    const text = JSON.stringify({
        form,
        schema
    }, null, 2);
    function buttons(text = '') {
        return (React.createElement("div", { className: modalActions },
            text && React.createElement("div", { className: tableRowFull }, text),
            React.createElement(Button, { onClick: () => changeOpen(false) }, "Close"),
            React.createElement(Button, { primary: true, onClick: () => {
                    download(text, 'form.ts');
                    changeOpen(false);
                }, icon: "download", color: "green", content: "Download" }),
            React.createElement(Button, { onClick: () => {
                    copyStringToClipboard(text);
                    changeOpen(false);
                }, icon: "copy", color: "green", content: "Copy to Clipboard" })));
    }
    return (React.createElement(Modal, { trigger: React.createElement(Menu.Item, { icon: "code", title: "Source code of the form", onClick: () => {
                changeOpen(true);
            } }), open: open },
        React.createElement(Modal.Header, null, buttons('Form Source')),
        React.createElement(Modal.Content, null,
            React.createElement(Modal.Description, null,
                React.createElement("pre", null, text),
                buttons()))));
};
//# sourceMappingURL=modal_preview_code.js.map