@tomino/dynamic-form-semantic-ui/dist/cjs/properties/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 = tslib_1.__importStar(require("react"));
const mobx_react_1 = require("mobx-react");
const react_simple_code_editor_1 = tslib_1.__importDefault(require("react-simple-code-editor"));
const prism_core_1 = require("prismjs/components/prism-core");
require("prismjs/components/prism-clike");
require("prismjs/components/prism-javascript");
require("prismjs/components/prism-css");
require("prismjs/components/prism-graphql");
require("prismjs/components/prism-markup");
require("prismjs/themes/prism-dark.css");
const helpers_1 = require("../helpers");
const editor_context_1 = require("../editor/editor_context");
const properties_common_1 = require("./properties_common");
exports.CodeEditor = mobx_react_1.observer((props) => {
    const context = React.useContext(editor_context_1.EditorContext);
    const onChange = React.useMemo(() => (code) => helpers_1.setValue(props, context, code), [
        context,
        props
    ]);
    const { formElement } = props;
    const { value } = properties_common_1.parseProps(props, context, true);
    return (React.createElement(react_simple_code_editor_1.default, { value: value || '', onValueChange: onChange, highlight: code => prism_core_1.highlight(code || '', prism_core_1.languages[formElement.props.language]), padding: 10, style: {
            fontFamily: '"Fira code", "Fira Mono", monospace',
            fontSize: 12,
            flex: 1,
            marginTop: '3px',
            marginLeft: '3px'
        } }));
});
//# sourceMappingURL=code.js.map