라이브 블록 상단 이탈과 인용 해제 보정

components/content/ContentMarkdownCalloutEditor.vue

@@ -37,7 +37,7 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['commit', 'delete-line', 'insert-below', 'merge-with-previous', 'leave-block'])
+const emit = defineEmits(['commit', 'delete-line', 'insert-above', 'insert-below', 'merge-with-previous', 'leave-block'])
 
 const bodyLines = computed(() => {
   const lines = String(props.modelValue ?? '').replace(/\r/g, '').split('\n')
@@ -117,6 +117,7 @@ const onBodyInput = (payload) => {
         @input="onBodyInput"
         @commit="onBodyCommit"
         @delete-line="emit('delete-line', $event)"
+        @insert-above="emit('insert-above', $event)"
         @insert-below="emit('insert-below', $event)"
         @merge-with-previous="emit('merge-with-previous', bodySourceLine, $event)"
         @leave-block="emit('leave-block', $event)"

components/content/ContentMarkdownCodeBlockEditor.vue

@@ -26,7 +26,7 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['commit', 'insert-below', 'delete-line'])
+const emit = defineEmits(['commit', 'insert-above', 'insert-below', 'delete-line'])
 
 const languageDraft = ref(props.language)
 const lineNumbersEnabled = ref(props.showLineNumbers)
@@ -163,6 +163,7 @@ const toggleLineNumbers = () => {
       :model-value="modelValue"
       @input="onBodyInput"
       @commit="onBodyCommit"
+      @insert-above="emit('insert-above', $event)"
       @insert-below="onExitBelow"
       @delete-line="emit('delete-line', $event)"
     />

components/content/ContentMarkdownEditableInline.vue

@@ -96,6 +96,7 @@ const emit = defineEmits([
   'commit',
   'input',
   'split',
+  'insert-above',
   'insert-below',
   'delete-line',
   'merge-with-previous',
@@ -174,16 +175,6 @@ watch(() => [props.modelValue, props.rawLine], () => {
 
     return
   }
-
-  const current = readEditorValue()
-
-  if (current !== props.modelValue) {
-    if (props.plainText) {
-      rootRef.value.innerHTML = plainTextToEditorHtml(props.modelValue)
-    } else {
-      rootRef.value.innerHTML = toEditorHtml()
-    }
-  }
 })
 
 onMounted(() => {
@@ -542,10 +533,13 @@ const navigateToAdjacentBlock = (direction, column, caretMode = 'column') => {
   const target = elements[currentIndex + direction]
 
   if (!target) {
-    if (
-      direction === 1
-      && props.arrowExitCreatesLine
-    ) {
+    if (!props.arrowExitCreatesLine) {
+      return
+    }
+
+    if (direction === -1) {
+      emit('insert-above', buildInsertBelowPayload())
+    } else {
       emit('insert-below', buildInsertBelowPayload())
     }
 

components/content/ContentMarkdownRenderer.vue

@@ -1320,6 +1320,23 @@ const onCodeBlockInsertBelow = (block, payload) => {
   onInsertBelowBlock(block, { lines: [''] })
 }
 
+/**
+ * 블록 위에 기본 문단을 삽입한다.
+ * @param {Object} block - 기준 블록
+ * @returns {void}
+ */
+const onInsertAboveBlock = (block) => {
+  const startLine = block.meta.startLine
+
+  pendingFocusLine.value = startLine
+  pendingFocusPosition.value = 'start'
+  emit('insert-after-line', {
+    afterLine: startLine - 1,
+    lines: [''],
+    focusLine: startLine
+  })
+}
+
 /**
  * 콜아웃 편집 반영
  * @param {Object} block - 콜아웃 블록
@@ -1953,6 +1970,22 @@ const onQuoteBlockInsertBelow = (block, payload) => {
   onInsertBelowBlock(block, { lines: [''] })
 }
 
+/**
+ * 인용 블록을 일반 문단 줄로 되돌린다.
+ * @param {Object} block - 인용 블록
+ * @param {string|Object} payload - 편집 페이로드
+ * @returns {void}
+ */
+const onQuoteBlockConvertToParagraph = (block, payload) => {
+  const { value } = normalizeCommitPayload(payload)
+  const lines = String(value ?? '').replace(/\r/g, '').split('\n')
+  const replacementLines = lines.length ? lines : ['']
+
+  pendingFocusLine.value = block.meta.startLine
+  pendingFocusPosition.value = 'start'
+  commitInlineBlockLines(block, replacementLines)
+}
+
 /**
  * 목록 항목 인라인 편집 반영
  * @param {Object} block - 블록
@@ -2655,8 +2688,10 @@ onBeforeUnmount(() => {
           :source-line-count="getQuoteLineEntries(block).length"
           @input="onQuoteBlockCommit(block, $event)"
           @commit="onQuoteBlockCommit(block, $event)"
+          @insert-above="onInsertAboveBlock(block)"
           @insert-below="onQuoteBlockInsertBelow(block, $event)"
           @delete-line="onDeleteLine"
+          @merge-with-previous="onQuoteBlockConvertToParagraph(block, $event)"
         />
       </ProseBlockquote>
       <ProseBlockquote
@@ -2795,6 +2830,7 @@ onBeforeUnmount(() => {
         :model-value="block.text"
         @commit="onCalloutBlockCommit(block, $event)"
         @delete-line="onDeleteLine"
+        @insert-above="onInsertAboveBlock(block)"
         @insert-below="onCalloutBlockInsertBelow(block, $event)"
         @merge-with-previous="onMergeWithPreviousLine"
         @focus-line="onEditorFocusLine"
@@ -2822,6 +2858,7 @@ onBeforeUnmount(() => {
         :body-source-line="block.meta.startLine + 1"
         :model-value="block.text"
         @commit="onToggleBlockCommit(block, $event)"
+        @insert-above="onInsertAboveBlock(block)"
         @insert-below="onToggleBlockInsertBelow(block, $event)"
         @delete-line="onDeleteLine"
       />
@@ -3015,6 +3052,7 @@ onBeforeUnmount(() => {
         :body-source-line="block.meta.startLine + 1"
         :model-value="block.text"
         @commit="onCodeBlockCommit(block, $event)"
+        @insert-above="onInsertAboveBlock(block)"
         @insert-below="onCodeBlockInsertBelow(block, $event)"
         @delete-line="onDeleteLine"
       />

components/content/ContentMarkdownToggleEditor.vue

@@ -31,7 +31,7 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['commit', 'insert-below', 'delete-line'])
+const emit = defineEmits(['commit', 'insert-above', 'insert-below', 'delete-line'])
 
 const titleEditorRef = ref(null)
 const bodyEditorRef = ref(null)
@@ -142,6 +142,7 @@ const onExitBelow = (payload) => {
       :source-line-count="String(modelValue ?? '').split('\n').length"
       :model-value="modelValue"
       @commit="onBodyCommit"
+      @insert-above="emit('insert-above', $event)"
       @insert-below="onExitBelow"
       @delete-line="emit('delete-line', $event)"
     />