blob: 531a57c9b9518b1de1390d85d457be5bbd349f09 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
import { observer } from 'mobx-react-lite';
import React, { useRef } from 'react';
import { useRootStore } from '../RootStore';
export const EditorArea = observer(() => {
const { editorStore } = useRootStore();
const { CodeMirror } = editorStore.chunk || {};
const fallbackTextarea = useRef<HTMLTextAreaElement>(null);
if (!CodeMirror) {
return (
<textarea
value={editorStore.value}
onChange={(e) => editorStore.updateValue(e.target.value)}
ref={fallbackTextarea}
className={`problem-fallback-editor cm-s-${editorStore.codeMirrorTheme}`}
/>
);
}
const textarea = fallbackTextarea.current;
if (textarea) {
editorStore.setInitialSelection(
textarea.selectionStart,
textarea.selectionEnd,
document.activeElement === textarea,
);
}
return (
<CodeMirror
value={editorStore.value}
options={editorStore.codeMirrorOptions}
editorDidMount={(editor) => editorStore.editorDidMount(editor)}
editorWillUnmount={() => editorStore.editorWillUnmount()}
onBeforeChange={(_editor, _data, value) => editorStore.updateValue(value)}
onChange={() => editorStore.reportChanged()}
/>
);
});
|