|
@@ -8,6 +8,7 @@ import type { ReactCodeMirrorProps } from '@uiw/react-codemirror';
|
|
|
|
|
|
|
|
import { GlobalCodeMirrorEditorKey, AcceptedUploadFileType } from '../../consts';
|
|
import { GlobalCodeMirrorEditorKey, AcceptedUploadFileType } from '../../consts';
|
|
|
import { useFileDropzone, FileDropzoneOverlay } from '../../services';
|
|
import { useFileDropzone, FileDropzoneOverlay } from '../../services';
|
|
|
|
|
+import { newlineAndIndentContinueMarkdownList } from '../../services/list-util/markdown-list-util';
|
|
|
import { useCodeMirrorEditorIsolated } from '../../stores';
|
|
import { useCodeMirrorEditorIsolated } from '../../stores';
|
|
|
|
|
|
|
|
import { Toolbar } from './Toolbar';
|
|
import { Toolbar } from './Toolbar';
|
|
@@ -46,50 +47,6 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
|
|
|
}, [onChange]);
|
|
}, [onChange]);
|
|
|
const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(editorKey, containerRef.current, cmProps);
|
|
const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(editorKey, containerRef.current, cmProps);
|
|
|
|
|
|
|
|
- /**
|
|
|
|
|
- * return the postion of the BOL(beginning of line)
|
|
|
|
|
- */
|
|
|
|
|
- const getBol = (editor: EditorView) => {
|
|
|
|
|
- const curPos = editor.state.selection.main.head;
|
|
|
|
|
- return editor.state.doc.lineAt(curPos).from;
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
- const getStrFromBol = (editor: EditorView) => {
|
|
|
|
|
- const curPos = editor.state.selection.main.head;
|
|
|
|
|
- return editor.state.sliceDoc(getBol(editor), curPos);
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
- const selectLowerPos = (editor: EditorView, pos1: number, pos2: number) => {
|
|
|
|
|
- // if both is in same line
|
|
|
|
|
- if (editor.state.doc.lineAt(pos1).number === editor.state.doc.lineAt(pos2).number) {
|
|
|
|
|
- return (editor.state.doc.lineAt(pos1).from < editor.state.doc.lineAt(pos1).to) ? pos2 : pos1;
|
|
|
|
|
- }
|
|
|
|
|
- return (editor.state.doc.lineAt(pos1) < editor.state.doc.lineAt(pos2)) ? pos2 : pos1;
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
- const replaceBolToCurrentPos = (editor: EditorView, text: string) => {
|
|
|
|
|
- const curPos = editor.state.selection.main.head;
|
|
|
|
|
- const pos = selectLowerPos(editor, editor.state.doc.lineAt(curPos).from, editor.state.doc.lineAt(curPos).to);
|
|
|
|
|
- editor.dispatch({
|
|
|
|
|
- changes: {
|
|
|
|
|
- from: getBol(editor),
|
|
|
|
|
- to: pos,
|
|
|
|
|
- insert: text,
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
- const indentAndMarkOnlyRE = /^(\d+)[.)](\s*)$/;
|
|
|
|
|
-
|
|
|
|
|
- // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
|
|
|
- const newlineAndIndentContinueMarkdownList = (editor: EditorView) => {
|
|
|
|
|
- const strFromBol = getStrFromBol(editor);
|
|
|
|
|
-
|
|
|
|
|
- if (indentAndMarkOnlyRE.test(strFromBol)) {
|
|
|
|
|
- replaceBolToCurrentPos(editor, '1. ');
|
|
|
|
|
- }
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
const handleEnterKey = (event: KeyboardEvent) => {
|
|
const handleEnterKey = (event: KeyboardEvent) => {
|
|
|
if (event.key === 'Enter') {
|
|
if (event.key === 'Enter') {
|
|
@@ -104,7 +61,7 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
|
|
|
return () => {
|
|
return () => {
|
|
|
codeMirrorEditor?.view?.dom.removeEventListener('keydown', handleEnterKey);
|
|
codeMirrorEditor?.view?.dom.removeEventListener('keydown', handleEnterKey);
|
|
|
};
|
|
};
|
|
|
- }, [codeMirrorEditor, newlineAndIndentContinueMarkdownList]);
|
|
|
|
|
|
|
+ }, [codeMirrorEditor]);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
if (indentSize == null) {
|
|
if (indentSize == null) {
|