UNPKG

burdy

Version:

Open Source Headless Platform

37 lines (36 loc) 1.7 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); const react_ace_1 = __importDefault(require("react-ace")); const react_1 = __importDefault(require("react")); const react_hook_form_1 = require("react-hook-form"); const react_2 = require("@fluentui/react"); const useStyles = (0, react_2.makeStyles)((theme) => ({ editorWrapper: { overflowX: 'auto' }, editor: { width: '100%', borderTop: `1px solid ${theme.palette.neutralLight}`, borderBottom: `1px solid ${theme.palette.neutralLight}` } })); const DynamicTextEditor = ({ field, name, control, disabled }) => { const styles = useStyles(); return (react_1.default.createElement("div", { className: styles.editorWrapper }, react_1.default.createElement(react_2.Label, null, field.label || field.name, " (", field.mode, ")"), react_1.default.createElement(react_hook_form_1.Controller, { name: name, control: control, render: ({ field: controllerField }) => { return react_1.default.createElement(react_ace_1.default, { readOnly: disabled, mode: field.mode, className: styles.editor, style: { width: '100%' }, defaultValue: controllerField.value, theme: 'github', onChange: controllerField.onChange, name: name, height: '350px', editorProps: { $blockScrolling: true }, setOptions: { useWorker: false } }); } }))); }; exports.default = DynamicTextEditor;