feat: add placeholde for empty line

Author: litingyes

src/PromptEditor.vue

@@ -6,6 +6,7 @@ import markdown from 'shiki/langs/markdown.mjs'
 import catppuccinLatte from 'shiki/themes/catppuccin-latte.mjs'
 import catppuccinMocha from 'shiki/themes/catppuccin-mocha.mjs'
 import { onBeforeUnmount, ref, watch } from 'vue'
+import { transformPlaceholder } from './shikiTransforms'
 
 defineOptions({
   name: 'PromptEditor',
@@ -50,7 +51,10 @@ watch(model, (str) => {
       dark: themesResolved[themesResolved.length > 1 ? 1 : 0].name!,
     },
     lang: 'markdown',
-    transformers: [transformerColorizedBrackets()],
+    transformers: [
+      transformerColorizedBrackets(),
+      transformPlaceholder(),
+    ],
   })
 }, {
   immediate: true,

src/shikiTransforms.ts

@@ -0,0 +1,12 @@
+import type { ShikiTransformer } from 'shiki'
+
+export function transformPlaceholder() {
+  return ({
+    name: 'placeholder',
+    preprocess(code) {
+      return code.split('\n').map((str) => {
+        return str || '\u00A0'
+      }).join('\n')
+    },
+  }) as ShikiTransformer
+}