create newlineAndIndentContinueMarkdownList function

packages/editor/src/components/CodeMirrorEditor/CodeMirrorEditor.tsx

@@ -10,6 +10,7 @@ import { GlobalCodeMirrorEditorKey, AcceptedUploadFileType } from '../../consts'
 import { useFileDropzone, FileDropzoneOverlay } from '../../services';
 import {
   getStrFromBol, adjustPasteData,
+  newlineAndIndentContinueMarkdownList,
 } from '../../services/list-util/markdown-list-util';
 import { useCodeMirrorEditorIsolated } from '../../stores';
 
@@ -52,24 +53,24 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
   }, [onChange]);
   const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(editorKey, containerRef.current, cmProps);
 
-  // useEffect(() => {
-  //   const handleEnterKey = (event: KeyboardEvent) => {
-  //     if (event.key === 'Enter') {
-  //       event.preventDefault();
-  //       const editor = codeMirrorEditor?.view;
-  //       if (editor == null) {
-  //         return;
-  //       }
-  //       newlineAndIndentContinueMarkdownList(editor);
-  //     }
-  //   };
-
-  //   codeMirrorEditor?.view?.dom.addEventListener('keydown', handleEnterKey);
-
-  //   return () => {
-  //     codeMirrorEditor?.view?.dom.removeEventListener('keydown', handleEnterKey);
-  //   };
-  // }, [codeMirrorEditor]);
+  useEffect(() => {
+    const handleEnterKey = (event: KeyboardEvent) => {
+      if (event.key === 'Enter') {
+        event.preventDefault();
+        const editor = codeMirrorEditor?.view;
+        if (editor == null) {
+          return;
+        }
+        newlineAndIndentContinueMarkdownList(editor);
+      }
+    };
+
+    codeMirrorEditor?.view?.dom.addEventListener('keydown', handleEnterKey);
+
+    return () => {
+      codeMirrorEditor?.view?.dom.removeEventListener('keydown', handleEnterKey);
+    };
+  }, [codeMirrorEditor]);
 
   useEffect(() => {
     if (indentSize == null) {

packages/editor/src/services/codemirror-editor/use-codemirror-editor/use-codemirror-editor.ts

@@ -2,14 +2,14 @@ import { useMemo } from 'react';
 
 import { indentWithTab, defaultKeymap } from '@codemirror/commands';
 import {
-  markdown, markdownLanguage, insertNewlineContinueMarkup, deleteMarkupBackward,
+  markdown, markdownLanguage,
 } from '@codemirror/lang-markdown';
 import { syntaxHighlighting, HighlightStyle, defaultHighlightStyle } from '@codemirror/language';
 import { languages } from '@codemirror/language-data';
 import {
-  EditorState, Prec, StateCommand, type Extension,
+  EditorState, Prec, type Extension,
 } from '@codemirror/state';
-import { keymap, EditorView, KeyBinding } from '@codemirror/view';
+import { keymap, EditorView } from '@codemirror/view';
 import { tags } from '@lezer/highlight';
 import { useCodeMirror, type UseCodeMirror } from '@uiw/react-codemirror';
 import deepmerge from 'ts-deepmerge';
@@ -37,19 +37,6 @@ const markdownHighlighting = HighlightStyle.define([
   { tag: tags.heading6, class: 'cm-header-6 cm-header' },
 ]);
 
-const onPressEnter: StateCommand = ({ state, dispatch }) => {
-  const insertBool = insertNewlineContinueMarkup({ state, dispatch });
-  // ここにrenumber的な処理を書く
-  console.log('renumber');
-
-  return insertBool;
-};
-
-const markdownKeymap: KeyBinding[] = [
-  { key: 'Enter', run: onPressEnter },
-  { key: 'Backspace', run: deleteMarkupBackward },
-];
-
 type UseCodeMirrorEditorUtils = {
   initDoc: InitDoc,
   appendExtensions: AppendExtensions,
@@ -70,8 +57,8 @@ export type UseCodeMirrorEditor = {
 
 const defaultExtensions: Extension[] = [
   EditorView.lineWrapping,
-  keymap.of(markdownKeymap),
-  markdown({ base: markdownLanguage, codeLanguages: languages, addKeymap: false }),
+  // keymap.of(markdownKeymap),
+  markdown({ base: markdownLanguage, codeLanguages: languages }),
   keymap.of([indentWithTab]),
   Prec.lowest(keymap.of(defaultKeymap)),
   syntaxHighlighting(markdownHighlighting),

packages/editor/src/services/list-util/markdown-list-util.ts

@@ -1,4 +1,4 @@
-import type { EditorView } from '@codemirror/view';
+import { EditorView } from '@codemirror/view';
 
 // https://regex101.com/r/7BN2fR/5
 const indentAndMarkRE = /^(\s*)(>[> ]*|[*+-] \[[x ]\]\s|[*+-]\s|(\d+)([.)]))(\s*)/;
@@ -14,6 +14,30 @@ export const getStrFromBol = (editor: EditorView): string => {
   return editor.state.sliceDoc(getBol(editor), curPos);
 };
 
+const insertText = (editor: EditorView, text: string) => {
+  const curPos = editor.state.selection.main.head;
+  const line = editor.state.doc.lineAt(curPos).from;
+  editor.dispatch({
+    changes: {
+      from: line,
+      to: curPos,
+      insert: text,
+    },
+  });
+};
+
+export const newlineAndIndentContinueMarkdownList = (editor: EditorView): void => {
+  const strFromBol = getStrFromBol(editor);
+
+  const matchResult = strFromBol.match(indentAndMarkRE);
+
+  if (matchResult != null) {
+    // continue list
+    const indentAndMark = matchResult[0];
+    insertText(editor, indentAndMark);
+  }
+};
+
 export const adjustPasteData = (indentAndMark: string, text: string): string => {
 
   let adjusted;