feat: colorized brackets

litingyes · litingyes · commit c377bcd00106 · 2025-04-30T21:29:16.000+08:00
diff --git a/package.json b/package.json
@@ -38,6 +38,7 @@
     "vue": "^3"
   },
   "dependencies": {
+    "@shikijs/colorized-brackets": "^3.3.0",
     "shiki": "^3.3.0"
   },
   "devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/PromptEditor.vue b/src/PromptEditor.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { MaybeArray, ThemeRegistrationAny } from 'shiki'
+import { transformerColorizedBrackets } from '@shikijs/colorized-brackets'
 import { createHighlighterCoreSync, createJavaScriptRegexEngine } from 'shiki'
 import markdown from 'shiki/langs/markdown.mjs'
 import catppuccinLatte from 'shiki/themes/catppuccin-latte.mjs'
@@ -36,6 +37,7 @@ watch(model, (str) => {
       dark: themesResolved[themesResolved.length > 1 ? 1 : 0].name!,
     },
     lang: 'markdown',
+    transformers: [transformerColorizedBrackets()],
   })
 }, {
   immediate: true,
