aichat-core
Version:
AI 流式聊天业务核心TS模型封装及业务实现模块
29 lines (28 loc) • 1.36 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect, useState } from 'react';
import { Controlled as CodeMirror } from 'react-codemirror2';
import 'codemirror/lib/codemirror.css';
import 'codemirror/mode/htmlmixed/htmlmixed';
import 'codemirror/mode/javascript/javascript';
import "../../styles/code-editor-preview.scss";
var CodeEditorPreview = function (_a) {
var code = _a.code, onChange = _a.onChange;
var _b = useState(null), mode = _b[0], setMode = _b[1];
useEffect(function () {
if (window.requestIdleCallback) {
window.requestIdleCallback(function () {
setMode("htmlmixed");
}, {
timeout: 200
});
}
}, []);
return (_jsxs("div", { className: "code-editor-preview", children: [_jsx("div", { className: "editor-container", children: _jsx(CodeMirror, { value: code, options: {
mode: mode,
theme: 'monokai',
lineNumbers: false
}, onBeforeChange: function (value) {
onChange(value);
} }) }), _jsx("div", { className: "preview-container", children: _jsx("iframe", { srcDoc: code, style: { width: '100%', height: '100vh', border: 'none' } }) })] }));
};
export default CodeEditorPreview;