@incremark/vue 0.2.6 → 0.3.0

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/composables/useIncremark.ts
-import { ref as ref3, shallowRef as shallowRef2, computed as computed2, markRaw } from "vue";
+import { ref as ref3, shallowRef as shallowRef2, computed as computed2, markRaw, watch as watch2, toValue as toValue2 } from "vue";
 import {
   createIncremarkParser
 } from "@incremark/core";
@@ -51,7 +51,7 @@ function useProvideDefinations() {
 }
 
 // src/composables/useTypewriter.ts
-import { ref as ref2, shallowRef, computed, watch, onUnmounted } from "vue";
+import { ref as ref2, shallowRef, computed, watch, toValue, onUnmounted } from "vue";
 import {
   createBlockTransformer,
   defaultPlugins
@@ -86,23 +86,23 @@ function addCursorToNode(node, cursor) {
 
 // src/composables/useTypewriter.ts
 function useTypewriter(options) {
-  const { typewriter: typewriterConfig, completedBlocks, pendingBlocks } = options;
-  const typewriterEnabled = ref2(typewriterConfig?.enabled ?? !!typewriterConfig);
+  const { typewriter: typewriterInput, completedBlocks, pendingBlocks } = options;
+  const initialConfig = toValue(typewriterInput);
+  const typewriterEnabled = ref2(initialConfig?.enabled ?? !!initialConfig);
   const displayBlocksRef = shallowRef([]);
   const isTypewriterProcessing = ref2(false);
   const isTypewriterPaused = ref2(false);
-  const typewriterEffect = ref2(typewriterConfig?.effect ?? "none");
-  const typewriterCursor = ref2(typewriterConfig?.cursor ?? "|");
+  const typewriterEffect = ref2(initialConfig?.effect ?? "none");
+  const typewriterCursor = ref2(initialConfig?.cursor ?? "|");
   const isAnimationComplete = ref2(true);
   let transformer = null;
-  if (typewriterConfig) {
-    const twOptions = typewriterConfig;
+  if (initialConfig) {
     transformer = createBlockTransformer({
-      charsPerTick: twOptions.charsPerTick ?? [1, 3],
-      tickInterval: twOptions.tickInterval ?? 30,
-      effect: twOptions.effect ?? "none",
-      pauseOnHidden: twOptions.pauseOnHidden ?? true,
-      plugins: twOptions.plugins ?? defaultPlugins,
+      charsPerTick: initialConfig.charsPerTick ?? [1, 3],
+      tickInterval: initialConfig.tickInterval ?? 30,
+      effect: initialConfig.effect ?? "none",
+      pauseOnHidden: initialConfig.pauseOnHidden ?? true,
+      plugins: initialConfig.plugins ?? defaultPlugins,
       onChange: (blocks2) => {
         displayBlocksRef.value = blocks2;
         isTypewriterProcessing.value = transformer?.isProcessing() ?? false;
@@ -116,6 +116,28 @@ function useTypewriter(options) {
       }
     });
   }
+  watch(
+    () => toValue(typewriterInput),
+    (newConfig) => {
+      if (!newConfig) return;
+      if (newConfig.enabled !== void 0) {
+        typewriterEnabled.value = newConfig.enabled;
+      }
+      if (newConfig.effect !== void 0) {
+        typewriterEffect.value = newConfig.effect;
+      }
+      if (newConfig.cursor !== void 0) {
+        typewriterCursor.value = newConfig.cursor;
+      }
+      transformer?.setOptions({
+        charsPerTick: newConfig.charsPerTick,
+        tickInterval: newConfig.tickInterval,
+        effect: newConfig.effect,
+        pauseOnHidden: newConfig.pauseOnHidden
+      });
+    },
+    { deep: true }
+  );
   const sourceBlocks = computed(() => {
     return completedBlocks.value.map((block) => ({
       id: block.id,
@@ -140,17 +162,7 @@ function useTypewriter(options) {
     );
   }
   const rawBlocks = computed(() => {
-    const result = [];
-    for (const block of completedBlocks.value) {
-      result.push({ ...block, stableId: block.id });
-    }
-    for (let i = 0; i < pendingBlocks.value.length; i++) {
-      result.push({
-        ...pendingBlocks.value[i],
-        stableId: `pending-${i}`
-      });
-    }
-    return result;
+    return [...completedBlocks.value, ...pendingBlocks.value];
   });
   const blocks = computed(() => {
     if (!typewriterEnabled.value || !transformer) {
@@ -165,7 +177,6 @@ function useTypewriter(options) {
       }
       return {
         id: db.id,
-        stableId: db.id,
         status: db.isDisplayComplete ? "completed" : "pending",
         isLastPending,
         node,
@@ -224,16 +235,19 @@ function useTypewriter(options) {
 }
 
 // src/composables/useIncremark.ts
-function useIncremark(options = {}) {
+function useIncremark(optionsInput = {}) {
   const { setDefinations, setFootnoteDefinitions, setFootnoteReferenceOrder } = useProvideDefinations();
-  const parser = createIncremarkParser({
-    ...options,
-    onChange: (state) => {
-      setDefinations(state.definitions);
-      setFootnoteDefinitions(state.footnoteDefinitions);
-      options.onChange?.(state);
-    }
-  });
+  function createParser(options) {
+    return createIncremarkParser({
+      ...options,
+      onChange: (state) => {
+        setDefinations(state.definitions);
+        setFootnoteDefinitions(state.footnoteDefinitions);
+        options.onChange?.(state);
+      }
+    });
+  }
+  let parser = createParser(toValue2(optionsInput));
   const completedBlocks = shallowRef2([]);
   const pendingBlocks = shallowRef2([]);
   const isLoading = ref3(false);
@@ -241,12 +255,12 @@ function useIncremark(options = {}) {
   const isFinalized = ref3(false);
   const footnoteReferenceOrder = ref3([]);
   const { blocks, typewriter, transformer, isAnimationComplete } = useTypewriter({
-    typewriter: options.typewriter,
+    typewriter: () => toValue2(optionsInput).typewriter,
     completedBlocks,
     pendingBlocks
   });
   const isDisplayComplete = computed2(() => {
-    if (!options.typewriter || !typewriter.enabled.value) {
+    if (!toValue2(optionsInput).typewriter || !typewriter.enabled.value) {
       return isFinalized.value;
     }
     return isFinalized.value && isAnimationComplete.value;
@@ -299,7 +313,18 @@ function useIncremark(options = {}) {
     footnoteReferenceOrder.value = [];
     transformer?.reset();
   }
-  function render18(content) {
+  watch2(
+    () => {
+      const { typewriter: _, ...parserOptions } = toValue2(optionsInput);
+      return JSON.stringify(parserOptions);
+    },
+    () => {
+      const { typewriter: _, ...parserOptions } = toValue2(optionsInput);
+      parser = createParser(parserOptions);
+      reset();
+    }
+  );
+  function render23(content) {
     const update = parser.render(content);
     markdown.value = parser.getBuffer();
     completedBlocks.value = parser.getCompletedBlocks().map((b) => markRaw(b));
@@ -343,7 +368,7 @@ function useIncremark(options = {}) {
     /** 重置解析器和打字机 */
     reset,
     /** 一次性渲染（reset + append + finalize） */
-    render: render18,
+    render: render23,
     /** 解析器实例 */
     parser,
     /** 打字机控制 */
@@ -355,23 +380,13 @@ function useIncremark(options = {}) {
 import { computed as computed3 } from "vue";
 function useStreamRenderer(options) {
   const { completedBlocks, pendingBlocks } = options;
-  const stableCompletedBlocks = computed3(
-    () => completedBlocks.value.map((block) => ({
-      ...block,
-      stableId: block.id
-    }))
-  );
-  const stablePendingBlocks = computed3(
-    () => pendingBlocks.value.map((block, index) => ({
-      ...block,
-      stableId: `pending-${index}`
-    }))
-  );
-  const allStableBlocks = computed3(() => [...stableCompletedBlocks.value, ...stablePendingBlocks.value]);
+  const completedBlocksComputed = computed3(() => completedBlocks.value);
+  const pendingBlocksComputed = computed3(() => pendingBlocks.value);
+  const allBlocks = computed3(() => [...completedBlocksComputed.value, ...pendingBlocksComputed.value]);
   return {
-    stableCompletedBlocks,
-    stablePendingBlocks,
-    allStableBlocks
+    completedBlocks: completedBlocksComputed,
+    pendingBlocks: pendingBlocksComputed,
+    allBlocks
   };
 }
 
@@ -382,8 +397,8 @@ function useDevTools(incremark, options = {}) {
   const devtools = createDevTools(options);
   incremark.parser.setOnChange((state) => {
     const blocks = [
-      ...state.completedBlocks.map((b) => ({ ...b, stableId: b.id })),
-      ...state.pendingBlocks.map((b, i) => ({ ...b, stableId: `pending-${i}` }))
+      ...state.completedBlocks,
+      ...state.pendingBlocks
     ];
     devtools.update({
       blocks,
@@ -405,15 +420,15 @@ function useDevTools(incremark, options = {}) {
 }
 
 // src/composables/useBlockTransformer.ts
-import { ref as ref5, watch as watch2, computed as computed4, onUnmounted as onUnmounted3 } from "vue";
+import { ref as ref4, watch as watch3, computed as computed4, onUnmounted as onUnmounted3 } from "vue";
 import {
   createBlockTransformer as createBlockTransformer2
 } from "@incremark/core";
 function useBlockTransformer(sourceBlocks, options = {}) {
-  const displayBlocksRef = ref5([]);
-  const isProcessingRef = ref5(false);
-  const isPausedRef = ref5(false);
-  const effectRef = ref5(options.effect ?? "none");
+  const displayBlocksRef = ref4([]);
+  const isProcessingRef = ref4(false);
+  const isPausedRef = ref4(false);
+  const effectRef = ref4(options.effect ?? "none");
   const transformer = createBlockTransformer2({
     ...options,
     onChange: (blocks) => {
@@ -422,7 +437,7 @@ function useBlockTransformer(sourceBlocks, options = {}) {
       isPausedRef.value = transformer.isPausedState();
     }
   });
-  watch2(
+  watch3(
     sourceBlocks,
     (blocks) => {
       transformer.push(blocks);
@@ -464,10 +479,38 @@ function useBlockTransformer(sourceBlocks, options = {}) {
   };
 }
 
+// src/composables/useLocale.ts
+import { inject, computed as computed5 } from "vue";
+var LOCALE_KEY = /* @__PURE__ */ Symbol("incremark-locale");
+function useLocale() {
+  const locale = inject(LOCALE_KEY);
+  if (!locale) {
+    const defaultLocale = enShared;
+    const t2 = computed5(() => (key) => {
+      const keys = key.split(".");
+      let value = defaultLocale;
+      for (const k of keys) {
+        value = value?.[k];
+      }
+      return value || key;
+    });
+    return { t: t2 };
+  }
+  const t = computed5(() => (key) => {
+    const keys = key.split(".");
+    let value = locale.value;
+    for (const k of keys) {
+      value = value?.[k];
+    }
+    return value || key;
+  });
+  return { t };
+}
+
 // src/composables/useDefinationsContext.ts
-import { inject } from "vue";
+import { inject as inject2 } from "vue";
 function useDefinationsContext() {
-  const definationContext = inject(definationsInjectionKey);
+  const definationContext = inject2(definationsInjectionKey);
   if (!definationContext) {
     throw new Error("definationContext not found");
   }
@@ -475,16 +518,16 @@ function useDefinationsContext() {
 }
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/Incremark.vue?type=script
-import { defineComponent as _defineComponent15 } from "vue";
-import { computed as computed11 } from "vue";
+import { defineComponent as _defineComponent18 } from "vue";
+import { computed as computed14 } from "vue";
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkRenderer.vue?type=script
-import { defineComponent as _defineComponent13 } from "vue";
-import { computed as computed9 } from "vue";
+import { defineComponent as _defineComponent16 } from "vue";
+import { computed as computed12 } from "vue";
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkHeading.vue?type=script
 import { defineComponent as _defineComponent4 } from "vue";
-import { computed as computed6 } from "vue";
+import { computed as computed7 } from "vue";
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkInline.vue?type=script
 import { defineComponent as _defineComponent3 } from "vue";
@@ -496,7 +539,7 @@ import {
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkMath.vue?type=script
 import { defineComponent as _defineComponent } from "vue";
-import { computed as computed5, ref as ref6, watch as watch3, shallowRef as shallowRef3, onUnmounted as onUnmounted4 } from "vue";
+import { computed as computed6, ref as ref5, watch as watch4, shallowRef as shallowRef3, onUnmounted as onUnmounted4 } from "vue";
 var IncremarkMath_default = /* @__PURE__ */ _defineComponent({
   __name: "IncremarkMath",
   props: {
@@ -506,13 +549,13 @@ var IncremarkMath_default = /* @__PURE__ */ _defineComponent({
   setup(__props, { expose: __expose }) {
     __expose();
     const props = __props;
-    const renderedHtml = ref6("");
-    const renderError = ref6("");
-    const isLoading = ref6(false);
+    const renderedHtml = ref5("");
+    const renderError = ref5("");
+    const isLoading = ref5(false);
     const katexRef = shallowRef3(null);
     let renderTimer = null;
-    const isInline = computed5(() => props.node.type === "inlineMath");
-    const formula = computed5(() => props.node.value);
+    const isInline = computed6(() => props.node.type === "inlineMath");
+    const formula = computed6(() => props.node.value);
     function scheduleRender() {
       if (!formula.value) {
         renderedHtml.value = "";
@@ -552,7 +595,7 @@ var IncremarkMath_default = /* @__PURE__ */ _defineComponent({
         clearTimeout(renderTimer);
       }
     });
-    watch3(formula, scheduleRender, { immediate: true });
+    watch4(formula, scheduleRender, { immediate: true });
     const __returned__ = { props, renderedHtml, renderError, isLoading, katexRef, get renderTimer() {
       return renderTimer;
     }, set renderTimer(v) {
@@ -979,7 +1022,7 @@ function render3(_ctx, _cache, $props, $setup, $data, $options) {
             [
               _createCommentVNode3(" HTML \u8282\u70B9\uFF08\u539F\u59CB HTML\uFF0C\u5982\u672A\u542F\u7528 htmlTree \u9009\u9879\uFF09 "),
               _createElementVNode3("span", {
-                style: { "display": "contents" },
+                class: "incremark-inline-html",
                 innerHTML: node.value
               }, null, 8, _hoisted_13)
             ],
@@ -1192,7 +1235,7 @@ var IncremarkHeading_default = /* @__PURE__ */ _defineComponent4({
   setup(__props, { expose: __expose }) {
     __expose();
     const props = __props;
-    const tag = computed6(() => `h${props.node.depth}`);
+    const tag = computed7(() => `h${props.node.depth}`);
     const __returned__ = { props, tag, IncremarkInline: IncremarkInline_default };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
@@ -1252,57 +1295,70 @@ IncremarkParagraph_default.__file = "src/components/IncremarkParagraph.vue";
 var IncremarkParagraph_default2 = IncremarkParagraph_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCode.vue?type=script
+import { defineComponent as _defineComponent9 } from "vue";
+import { computed as computed10 } from "vue";
+
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCodeMermaid.vue?type=script
+import { defineComponent as _defineComponent7 } from "vue";
+import { computed as computed8, ref as ref6, onUnmounted as onUnmounted5, shallowRef as shallowRef4, watch as watch5 } from "vue";
+import { GravityMermaid, LucideCode, LucideEye, LucideCopy, LucideCopyCheck } from "@incremark/icons";
+import { isClipboardAvailable } from "@incremark/shared";
+
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/SvgIcon.vue?type=script
 import { defineComponent as _defineComponent6 } from "vue";
-import { computed as computed7, ref as ref7, watch as watch4, shallowRef as shallowRef4, onUnmounted as onUnmounted5 } from "vue";
-var IncremarkCode_default = /* @__PURE__ */ _defineComponent6({
-  __name: "IncremarkCode",
+var SvgIcon_default = /* @__PURE__ */ _defineComponent6({
+  __name: "SvgIcon",
+  props: {
+    svg: { type: String, required: true },
+    sizeClass: { type: String, required: false }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const __returned__ = {};
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/SvgIcon.vue?type=template
+import { normalizeClass as _normalizeClass2, openBlock as _openBlock6, createElementBlock as _createElementBlock5 } from "vue";
+var _hoisted_15 = ["innerHTML"];
+function render6(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock6(), _createElementBlock5("span", {
+    class: _normalizeClass2(["incremark-icon", $props.sizeClass]),
+    innerHTML: $props.svg,
+    "aria-hidden": "true"
+  }, null, 10, _hoisted_15);
+}
+
+// src/components/SvgIcon.vue
+SvgIcon_default.render = render6;
+SvgIcon_default.__file = "src/components/SvgIcon.vue";
+var SvgIcon_default2 = SvgIcon_default;
+
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCodeMermaid.vue?type=script
+var IncremarkCodeMermaid_default = /* @__PURE__ */ _defineComponent7({
+  __name: "IncremarkCodeMermaid",
   props: {
     node: { type: null, required: true },
-    theme: { type: String, required: false, default: "github-dark" },
-    fallbackTheme: { type: String, required: false, default: "github-dark" },
-    disableHighlight: { type: Boolean, required: false, default: false },
-    mermaidDelay: { type: Number, required: false, default: 500 },
-    customCodeBlocks: { type: Object, required: false, default: () => ({}) },
-    codeBlockConfigs: { type: Object, required: false, default: () => ({}) },
-    blockStatus: { type: String, required: false, default: "completed" }
+    mermaidDelay: { type: Number, required: false, default: 500 }
   },
   setup(__props, { expose: __expose }) {
     __expose();
     const props = __props;
-    const copied = ref7(false);
-    const highlightedHtml = ref7("");
-    const isHighlighting = ref7(false);
-    const highlightError = ref7(false);
-    const mermaidSvg = ref7("");
-    const mermaidError = ref7("");
-    const mermaidLoading = ref7(false);
+    const { t } = useLocale();
+    const mermaidSvg = ref6("");
+    const mermaidError = ref6("");
+    const mermaidLoading = ref6(false);
     const mermaidRef = shallowRef4(null);
     let mermaidTimer = null;
-    const mermaidViewMode = ref7("preview");
+    const mermaidViewMode = ref6("preview");
     function toggleMermaidView() {
       mermaidViewMode.value = mermaidViewMode.value === "preview" ? "source" : "preview";
     }
-    const language = computed7(() => props.node.lang || "text");
-    const code = computed7(() => props.node.value);
-    const isMermaid = computed7(() => language.value === "mermaid");
-    const CustomCodeBlock = computed7(() => {
-      const component = props.customCodeBlocks?.[language.value];
-      if (!component) return null;
-      const config = props.codeBlockConfigs?.[language.value];
-      if (config?.takeOver) {
-        return component;
-      }
-      if (props.blockStatus !== "completed") {
-        return null;
-      }
-      return component;
-    });
-    const useCustomComponent = computed7(() => !!CustomCodeBlock.value);
-    const highlighterRef = shallowRef4(null);
-    const loadedLanguages = /* @__PURE__ */ new Set();
-    const loadedThemes = /* @__PURE__ */ new Set();
+    const code = computed8(() => props.node.value);
     function scheduleRenderMermaid() {
-      if (!isMermaid.value || !code.value) return;
+      if (!code.value) return;
       if (mermaidTimer) {
         clearTimeout(mermaidTimer);
       }
@@ -1321,7 +1377,8 @@ var IncremarkCode_default = /* @__PURE__ */ _defineComponent6({
           mermaidRef.value.initialize({
             startOnLoad: false,
             theme: "dark",
-            securityLevel: "loose"
+            securityLevel: "loose",
+            suppressErrorRendering: true
           });
         }
         const mermaid = mermaidRef.value;
@@ -1335,279 +1392,539 @@ var IncremarkCode_default = /* @__PURE__ */ _defineComponent6({
         mermaidLoading.value = false;
       }
     }
+    watch5(code, scheduleRenderMermaid, { immediate: true });
     onUnmounted5(() => {
       if (mermaidTimer) {
         clearTimeout(mermaidTimer);
       }
+      if (copyTimeoutId) {
+        clearTimeout(copyTimeoutId);
+      }
     });
-    async function highlight() {
-      if (isMermaid.value) {
-        scheduleRenderMermaid();
-        return;
+    const copied = ref6(false);
+    let copyTimeoutId = null;
+    async function copyCode() {
+      if (!isClipboardAvailable()) return;
+      try {
+        await navigator.clipboard.writeText(code.value);
+        copied.value = true;
+        if (copyTimeoutId) {
+          clearTimeout(copyTimeoutId);
+        }
+        copyTimeoutId = setTimeout(() => {
+          copied.value = false;
+        }, 2e3);
+      } catch {
+      }
+    }
+    const __returned__ = { props, t, mermaidSvg, mermaidError, mermaidLoading, mermaidRef, get mermaidTimer() {
+      return mermaidTimer;
+    }, set mermaidTimer(v) {
+      mermaidTimer = v;
+    }, mermaidViewMode, toggleMermaidView, code, scheduleRenderMermaid, doRenderMermaid, copied, get copyTimeoutId() {
+      return copyTimeoutId;
+    }, set copyTimeoutId(v) {
+      copyTimeoutId = v;
+    }, copyCode, get GravityMermaid() {
+      return GravityMermaid;
+    }, get LucideCode() {
+      return LucideCode;
+    }, get LucideEye() {
+      return LucideEye;
+    }, get LucideCopy() {
+      return LucideCopy;
+    }, get LucideCopyCheck() {
+      return LucideCopyCheck;
+    }, SvgIcon: SvgIcon_default2 };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCodeMermaid.vue?type=template
+import { createVNode as _createVNode5, createTextVNode as _createTextVNode3, createElementVNode as _createElementVNode4, createCommentVNode as _createCommentVNode4, toDisplayString as _toDisplayString4, openBlock as _openBlock7, createElementBlock as _createElementBlock6, Fragment as _Fragment4 } from "vue";
+var _hoisted_16 = { class: "incremark-mermaid" };
+var _hoisted_23 = { class: "mermaid-header" };
+var _hoisted_33 = { class: "language" };
+var _hoisted_43 = { class: "mermaid-actions" };
+var _hoisted_53 = ["disabled", "aria-label", "title"];
+var _hoisted_63 = ["aria-label", "title"];
+var _hoisted_72 = { class: "mermaid-content" };
+var _hoisted_82 = {
+  key: 0,
+  class: "mermaid-loading"
+};
+var _hoisted_92 = { class: "mermaid-source-code" };
+var _hoisted_102 = { class: "mermaid-source-code" };
+var _hoisted_11 = ["innerHTML"];
+var _hoisted_122 = { class: "mermaid-source-code" };
+function render7(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock7(), _createElementBlock6("div", _hoisted_16, [
+    _createElementVNode4("div", _hoisted_23, [
+      _createElementVNode4("span", _hoisted_33, [
+        _createVNode5($setup["SvgIcon"], {
+          svg: $setup.GravityMermaid,
+          class: "language-icon"
+        }, null, 8, ["svg"]),
+        _cache[0] || (_cache[0] = _createTextVNode3(
+          " MERMAID ",
+          -1
+          /* CACHED */
+        ))
+      ]),
+      _createElementVNode4("div", _hoisted_43, [
+        _createElementVNode4("button", {
+          class: "code-btn",
+          onClick: $setup.toggleMermaidView,
+          type: "button",
+          disabled: !$setup.mermaidSvg,
+          "aria-label": $setup.mermaidViewMode === "preview" ? $setup.t("mermaid.viewSource") : $setup.t("mermaid.preview"),
+          title: $setup.mermaidViewMode === "preview" ? "View Source" : "Preview"
+        }, [
+          _createVNode5($setup["SvgIcon"], {
+            svg: $setup.mermaidViewMode === "preview" ? $setup.LucideCode : $setup.LucideEye
+          }, null, 8, ["svg"])
+        ], 8, _hoisted_53),
+        _createElementVNode4("button", {
+          class: "code-btn",
+          onClick: $setup.copyCode,
+          type: "button",
+          "aria-label": $setup.copied ? $setup.t("mermaid.copied") : $setup.t("mermaid.copy"),
+          title: $setup.copied ? "Copied!" : "Copy"
+        }, [
+          _createVNode5($setup["SvgIcon"], {
+            svg: $setup.copied ? $setup.LucideCopyCheck : $setup.LucideCopy
+          }, null, 8, ["svg"])
+        ], 8, _hoisted_63)
+      ])
+    ]),
+    _createElementVNode4("div", _hoisted_72, [
+      _createCommentVNode4(" \u52A0\u8F7D\u4E2D "),
+      $setup.mermaidLoading && !$setup.mermaidSvg ? (_openBlock7(), _createElementBlock6("div", _hoisted_82, [
+        _createElementVNode4(
+          "pre",
+          _hoisted_92,
+          _toDisplayString4($setup.code),
+          1
+          /* TEXT */
+        )
+      ])) : $setup.mermaidViewMode === "source" ? (_openBlock7(), _createElementBlock6(
+        _Fragment4,
+        { key: 1 },
+        [
+          _createCommentVNode4(" \u6E90\u7801\u6A21\u5F0F "),
+          _createElementVNode4(
+            "pre",
+            _hoisted_102,
+            _toDisplayString4($setup.code),
+            1
+            /* TEXT */
+          )
+        ],
+        2112
+        /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+      )) : $setup.mermaidSvg ? (_openBlock7(), _createElementBlock6(
+        _Fragment4,
+        { key: 2 },
+        [
+          _createCommentVNode4(" \u9884\u89C8\u6A21\u5F0F "),
+          _createElementVNode4("div", {
+            innerHTML: $setup.mermaidSvg,
+            class: "mermaid-svg"
+          }, null, 8, _hoisted_11)
+        ],
+        2112
+        /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+      )) : (_openBlock7(), _createElementBlock6(
+        _Fragment4,
+        { key: 3 },
+        [
+          _createCommentVNode4(" \u65E0\u6CD5\u6E32\u67D3\u65F6\u663E\u793A\u6E90\u7801 "),
+          _createElementVNode4(
+            "pre",
+            _hoisted_122,
+            _toDisplayString4($setup.code),
+            1
+            /* TEXT */
+          )
+        ],
+        2112
+        /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+      ))
+    ])
+  ]);
+}
+
+// src/components/IncremarkCodeMermaid.vue
+IncremarkCodeMermaid_default.render = render7;
+IncremarkCodeMermaid_default.__file = "src/components/IncremarkCodeMermaid.vue";
+var IncremarkCodeMermaid_default2 = IncremarkCodeMermaid_default;
+
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCodeDefault.vue?type=script
+import { defineComponent as _defineComponent8 } from "vue";
+import { computed as computed9, onUnmounted as onUnmounted6, ref as ref7, watch as watch6 } from "vue";
+import { LucideCopy as LucideCopy2, LucideCopyCheck as LucideCopyCheck2 } from "@incremark/icons";
+import { isClipboardAvailable as isClipboardAvailable2 } from "@incremark/shared";
+
+// src/composables/useShiki.ts
+import { shallowRef as shallowRef5 } from "vue";
+var ShikiManager = class _ShikiManager {
+  static instance = null;
+  /** 存储 highlighter 实例，key 为主题名称 */
+  highlighters = /* @__PURE__ */ new Map();
+  constructor() {
+  }
+  static getInstance() {
+    if (!_ShikiManager.instance) {
+      _ShikiManager.instance = new _ShikiManager();
+    }
+    return _ShikiManager.instance;
+  }
+  /**
+   * 获取或创建 highlighter
+   * @param theme 主题名称
+   * @returns highlighter 实例
+   */
+  async getHighlighter(theme) {
+    if (this.highlighters.has(theme)) {
+      return this.highlighters.get(theme);
+    }
+    const { createHighlighter } = await import("shiki");
+    const highlighter = await createHighlighter({
+      themes: [theme],
+      langs: []
+    });
+    const info = {
+      highlighter,
+      loadedLanguages: /* @__PURE__ */ new Set(),
+      loadedThemes: /* @__PURE__ */ new Set([theme])
+    };
+    this.highlighters.set(theme, info);
+    return info;
+  }
+  /**
+   * 加载语言（按需）
+   * @param theme 主题名称
+   * @param lang 语言名称
+   */
+  async loadLanguage(theme, lang) {
+    const info = this.highlighters.get(theme);
+    if (!info || info.loadedLanguages.has(lang)) return;
+    try {
+      await info.highlighter.loadLanguage(lang);
+      info.loadedLanguages.add(lang);
+    } catch {
+    }
+  }
+  /**
+   * 加载主题（按需）
+   * @param theme 主题名称
+   */
+  async loadTheme(theme) {
+    const info = this.highlighters.get(theme);
+    if (!info || info.loadedThemes.has(theme)) return;
+    try {
+      await info.highlighter.loadTheme(theme);
+      info.loadedThemes.add(theme);
+    } catch {
+    }
+  }
+  /**
+   * 高亮代码
+   * @param theme 主题名称
+   * @param code 代码内容
+   * @param lang 语言名称
+   * @param fallbackTheme 回退主题
+   * @returns 高亮后的 HTML
+   */
+  async codeToHtml(theme, code, lang, fallbackTheme) {
+    const info = this.highlighters.get(theme);
+    if (!info) throw new Error("Highlighter not found");
+    const actualLang = info.loadedLanguages.has(lang) ? lang : "text";
+    const actualTheme = info.loadedThemes.has(theme) ? theme : fallbackTheme;
+    return info.highlighter.codeToHtml(code, {
+      lang: actualLang,
+      theme: actualTheme
+    });
+  }
+  /**
+   * 清理所有 highlighter（应用退出或需要重置时调用）
+   */
+  disposeAll() {
+    for (const [, info] of this.highlighters) {
+      if (info.highlighter?.dispose) {
+        info.highlighter.dispose();
+      }
+    }
+    this.highlighters.clear();
+  }
+};
+var shikiManagerInstance = null;
+function getShikiManager() {
+  if (!shikiManagerInstance) {
+    shikiManagerInstance = ShikiManager.getInstance();
+  }
+  return shikiManagerInstance;
+}
+function useShiki(theme) {
+  const highlighterInfo = shallowRef5(null);
+  const isHighlighting = shallowRef5(false);
+  async function getHighlighter() {
+    if (!highlighterInfo.value) {
+      highlighterInfo.value = await getShikiManager().getHighlighter(theme);
+    }
+    return highlighterInfo.value;
+  }
+  async function highlight(code, lang, fallbackTheme) {
+    isHighlighting.value = true;
+    try {
+      const info = await getHighlighter();
+      const manager = getShikiManager();
+      if (!info.loadedLanguages.has(lang) && lang !== "text") {
+        await manager.loadLanguage(theme, lang);
+      }
+      if (!info.loadedThemes.has(theme)) {
+        await manager.loadTheme(theme);
       }
+      return await manager.codeToHtml(theme, code, lang, fallbackTheme);
+    } catch (e) {
+      throw e;
+    } finally {
+      isHighlighting.value = false;
+    }
+  }
+  return {
+    highlighterInfo,
+    isHighlighting,
+    highlight
+  };
+}
+
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCodeDefault.vue?type=script
+var IncremarkCodeDefault_default = /* @__PURE__ */ _defineComponent8({
+  __name: "IncremarkCodeDefault",
+  props: {
+    node: { type: null, required: true },
+    theme: { type: String, required: false, default: "github-dark" },
+    fallbackTheme: { type: String, required: false, default: "github-dark" },
+    disableHighlight: { type: Boolean, required: false, default: false }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const copied = ref7(false);
+    const highlightedHtml = ref7("");
+    const language = computed9(() => props.node.lang || "text");
+    const code = computed9(() => props.node.value);
+    const { t } = useLocale();
+    const { isHighlighting, highlight } = useShiki(props.theme);
+    async function doHighlight() {
       if (!code.value || props.disableHighlight) {
         highlightedHtml.value = "";
         return;
       }
-      isHighlighting.value = true;
-      highlightError.value = false;
       try {
-        if (!highlighterRef.value) {
-          const { createHighlighter } = await import("shiki");
-          highlighterRef.value = await createHighlighter({
-            themes: [props.theme],
-            langs: []
-          });
-          loadedThemes.add(props.theme);
-        }
-        const highlighter = highlighterRef.value;
-        const lang = language.value;
-        if (!loadedLanguages.has(lang) && lang !== "text") {
-          try {
-            await highlighter.loadLanguage(lang);
-            loadedLanguages.add(lang);
-          } catch {
-          }
-        }
-        if (!loadedThemes.has(props.theme)) {
-          try {
-            await highlighter.loadTheme(props.theme);
-            loadedThemes.add(props.theme);
-          } catch {
-          }
-        }
-        const html = highlighter.codeToHtml(code.value, {
-          lang: loadedLanguages.has(lang) ? lang : "text",
-          theme: loadedThemes.has(props.theme) ? props.theme : props.fallbackTheme
-        });
+        const html = await highlight(code.value, language.value, props.fallbackTheme);
         highlightedHtml.value = html;
       } catch (e) {
-        highlightError.value = true;
         highlightedHtml.value = "";
-      } finally {
-        isHighlighting.value = false;
       }
     }
-    watch4([code, () => props.theme, isMermaid], highlight, { immediate: true });
+    watch6([code, () => props.theme], doHighlight, { immediate: true });
+    let copyTimeoutId = null;
     async function copyCode() {
+      if (!isClipboardAvailable2()) return;
       try {
         await navigator.clipboard.writeText(code.value);
         copied.value = true;
-        setTimeout(() => {
+        if (copyTimeoutId) {
+          clearTimeout(copyTimeoutId);
+        }
+        copyTimeoutId = setTimeout(() => {
           copied.value = false;
         }, 2e3);
       } catch {
       }
     }
-    const __returned__ = { props, copied, highlightedHtml, isHighlighting, highlightError, mermaidSvg, mermaidError, mermaidLoading, mermaidRef, get mermaidTimer() {
-      return mermaidTimer;
-    }, set mermaidTimer(v) {
-      mermaidTimer = v;
-    }, mermaidViewMode, toggleMermaidView, language, code, isMermaid, CustomCodeBlock, useCustomComponent, highlighterRef, loadedLanguages, loadedThemes, scheduleRenderMermaid, doRenderMermaid, highlight, copyCode };
+    onUnmounted6(() => {
+      if (copyTimeoutId) {
+        clearTimeout(copyTimeoutId);
+      }
+    });
+    const __returned__ = { props, copied, highlightedHtml, language, code, t, isHighlighting, highlight, doHighlight, get copyTimeoutId() {
+      return copyTimeoutId;
+    }, set copyTimeoutId(v) {
+      copyTimeoutId = v;
+    }, copyCode, get LucideCopy() {
+      return LucideCopy2;
+    }, get LucideCopyCheck() {
+      return LucideCopyCheck2;
+    }, SvgIcon: SvgIcon_default2 };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
   }
 });
 
-// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCode.vue?type=template
-import { createCommentVNode as _createCommentVNode4, resolveDynamicComponent as _resolveDynamicComponent3, openBlock as _openBlock6, createBlock as _createBlock3, createElementVNode as _createElementVNode4, toDisplayString as _toDisplayString4, createElementBlock as _createElementBlock5, Fragment as _Fragment4 } from "vue";
-var _hoisted_15 = { class: "incremark-mermaid" };
-var _hoisted_23 = { class: "mermaid-header" };
-var _hoisted_33 = { class: "mermaid-actions" };
-var _hoisted_43 = ["disabled"];
-var _hoisted_53 = { class: "mermaid-content" };
-var _hoisted_63 = {
-  key: 0,
-  class: "mermaid-loading"
-};
-var _hoisted_72 = { class: "mermaid-source-code" };
-var _hoisted_82 = { class: "mermaid-source-code" };
-var _hoisted_92 = ["innerHTML"];
-var _hoisted_102 = { class: "mermaid-source-code" };
-var _hoisted_11 = { class: "incremark-code" };
-var _hoisted_122 = { class: "code-header" };
-var _hoisted_132 = { class: "language" };
-var _hoisted_142 = { class: "code-content" };
-var _hoisted_152 = {
+// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCodeDefault.vue?type=template
+import { toDisplayString as _toDisplayString5, createElementVNode as _createElementVNode5, createVNode as _createVNode6, createCommentVNode as _createCommentVNode5, openBlock as _openBlock8, createElementBlock as _createElementBlock7, Fragment as _Fragment5 } from "vue";
+var _hoisted_17 = { class: "incremark-code" };
+var _hoisted_24 = { class: "code-header" };
+var _hoisted_34 = { class: "language" };
+var _hoisted_44 = ["aria-label", "title"];
+var _hoisted_54 = { class: "code-content" };
+var _hoisted_64 = {
   key: 0,
   class: "code-loading"
 };
-var _hoisted_16 = ["innerHTML"];
-var _hoisted_17 = { class: "code-fallback" };
-function render6(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock6(), _createElementBlock5(
-    _Fragment4,
+var _hoisted_73 = ["innerHTML"];
+var _hoisted_83 = { class: "code-fallback" };
+function render8(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock8(), _createElementBlock7("div", _hoisted_17, [
+    _createElementVNode5("div", _hoisted_24, [
+      _createElementVNode5(
+        "span",
+        _hoisted_34,
+        _toDisplayString5($setup.language),
+        1
+        /* TEXT */
+      ),
+      _createElementVNode5("button", {
+        class: "code-btn",
+        onClick: $setup.copyCode,
+        type: "button",
+        "aria-label": $setup.copied ? $setup.t("code.copied") : $setup.t("code.copy"),
+        title: $setup.copied ? "Copied!" : "Copy"
+      }, [
+        _createVNode6($setup["SvgIcon"], {
+          svg: $setup.copied ? $setup.LucideCopyCheck : $setup.LucideCopy
+        }, null, 8, ["svg"])
+      ], 8, _hoisted_44)
+    ]),
+    _createElementVNode5("div", _hoisted_54, [
+      _createCommentVNode5(" \u6B63\u5728\u52A0\u8F7D\u9AD8\u4EAE "),
+      $setup.isHighlighting && !$setup.highlightedHtml ? (_openBlock8(), _createElementBlock7("div", _hoisted_64, [
+        _createElementVNode5("pre", null, [
+          _createElementVNode5(
+            "code",
+            null,
+            _toDisplayString5($setup.code),
+            1
+            /* TEXT */
+          )
+        ])
+      ])) : $setup.highlightedHtml ? (_openBlock8(), _createElementBlock7(
+        _Fragment5,
+        { key: 1 },
+        [
+          _createCommentVNode5(" \u9AD8\u4EAE\u540E\u7684\u4EE3\u7801 "),
+          _createElementVNode5("div", {
+            innerHTML: $setup.highlightedHtml,
+            class: "shiki-wrapper"
+          }, null, 8, _hoisted_73)
+        ],
+        2112
+        /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+      )) : (_openBlock8(), _createElementBlock7(
+        _Fragment5,
+        { key: 2 },
+        [
+          _createCommentVNode5(" \u56DE\u9000\uFF1A\u65E0\u9AD8\u4EAE "),
+          _createElementVNode5("pre", _hoisted_83, [
+            _createElementVNode5(
+              "code",
+              null,
+              _toDisplayString5($setup.code),
+              1
+              /* TEXT */
+            )
+          ])
+        ],
+        2112
+        /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+      ))
+    ])
+  ]);
+}
+
+// src/components/IncremarkCodeDefault.vue
+IncremarkCodeDefault_default.render = render8;
+IncremarkCodeDefault_default.__file = "src/components/IncremarkCodeDefault.vue";
+var IncremarkCodeDefault_default2 = IncremarkCodeDefault_default;
+
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCode.vue?type=script
+var IncremarkCode_default = /* @__PURE__ */ _defineComponent9({
+  __name: "IncremarkCode",
+  props: {
+    node: { type: null, required: true },
+    theme: { type: String, required: false, default: "github-dark" },
+    fallbackTheme: { type: String, required: false, default: "github-dark" },
+    disableHighlight: { type: Boolean, required: false, default: false },
+    mermaidDelay: { type: Number, required: false, default: 500 },
+    customCodeBlocks: { type: Object, required: false, default: () => ({}) },
+    codeBlockConfigs: { type: Object, required: false, default: () => ({}) },
+    blockStatus: { type: String, required: false, default: "completed" },
+    defaultCodeComponent: { type: null, required: false, default: () => IncremarkCodeDefault_default2 }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const language = computed10(() => props.node.lang || "text");
+    const CustomCodeBlock = computed10(() => {
+      const component = props.customCodeBlocks?.[language.value];
+      if (!component) return null;
+      const config = props.codeBlockConfigs?.[language.value];
+      if (config?.takeOver) {
+        return component;
+      }
+      if (props.blockStatus !== "completed") {
+        return null;
+      }
+      return component;
+    });
+    const isMermaid = computed10(() => language.value === "mermaid");
+    const __returned__ = { props, language, CustomCodeBlock, isMermaid, IncremarkCodeMermaid: IncremarkCodeMermaid_default2 };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkCode.vue?type=template
+import { createCommentVNode as _createCommentVNode6, resolveDynamicComponent as _resolveDynamicComponent3, openBlock as _openBlock9, createBlock as _createBlock3, createVNode as _createVNode7, Fragment as _Fragment6, createElementBlock as _createElementBlock8 } from "vue";
+function render9(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock9(), _createElementBlock8(
+    _Fragment6,
     null,
     [
-      _createCommentVNode4(" \u81EA\u5B9A\u4E49\u4EE3\u7801\u5757\u7EC4\u4EF6 "),
-      $setup.CustomCodeBlock ? (_openBlock6(), _createBlock3(_resolveDynamicComponent3($setup.CustomCodeBlock), {
+      _createCommentVNode6(" \u81EA\u5B9A\u4E49\u4EE3\u7801\u5757\u7EC4\u4EF6 "),
+      $setup.CustomCodeBlock ? (_openBlock9(), _createBlock3(_resolveDynamicComponent3($setup.CustomCodeBlock), {
         key: 0,
-        "code-str": $setup.code,
+        "code-str": $props.node.value,
         lang: $setup.language,
         completed: $props.blockStatus === "completed",
         takeOver: $props.codeBlockConfigs?.[$setup.language]?.takeOver
-      }, null, 8, ["code-str", "lang", "completed", "takeOver"])) : $setup.isMermaid ? (_openBlock6(), _createElementBlock5(
-        _Fragment4,
+      }, null, 8, ["code-str", "lang", "completed", "takeOver"])) : $setup.isMermaid ? (_openBlock9(), _createElementBlock8(
+        _Fragment6,
         { key: 1 },
         [
-          _createCommentVNode4(" Mermaid \u56FE\u8868\uFF08\u5982\u679C\u6CA1\u6709\u81EA\u5B9A\u4E49\u7EC4\u4EF6\uFF09 "),
-          _createElementVNode4("div", _hoisted_15, [
-            _createElementVNode4("div", _hoisted_23, [
-              _cache[0] || (_cache[0] = _createElementVNode4(
-                "span",
-                { class: "language" },
-                "MERMAID",
-                -1
-                /* CACHED */
-              )),
-              _createElementVNode4("div", _hoisted_33, [
-                _createElementVNode4("button", {
-                  class: "code-btn",
-                  onClick: $setup.toggleMermaidView,
-                  type: "button",
-                  disabled: !$setup.mermaidSvg
-                }, _toDisplayString4($setup.mermaidViewMode === "preview" ? "\u6E90\u7801" : "\u9884\u89C8"), 9, _hoisted_43),
-                _createElementVNode4(
-                  "button",
-                  {
-                    class: "code-btn",
-                    onClick: $setup.copyCode,
-                    type: "button"
-                  },
-                  _toDisplayString4($setup.copied ? "\u2713 \u5DF2\u590D\u5236" : "\u590D\u5236"),
-                  1
-                  /* TEXT */
-                )
-              ])
-            ]),
-            _createElementVNode4("div", _hoisted_53, [
-              _createCommentVNode4(" \u52A0\u8F7D\u4E2D "),
-              $setup.mermaidLoading && !$setup.mermaidSvg ? (_openBlock6(), _createElementBlock5("div", _hoisted_63, [
-                _createElementVNode4(
-                  "pre",
-                  _hoisted_72,
-                  _toDisplayString4($setup.code),
-                  1
-                  /* TEXT */
-                )
-              ])) : $setup.mermaidViewMode === "source" ? (_openBlock6(), _createElementBlock5(
-                _Fragment4,
-                { key: 1 },
-                [
-                  _createCommentVNode4(" \u6E90\u7801\u6A21\u5F0F "),
-                  _createElementVNode4(
-                    "pre",
-                    _hoisted_82,
-                    _toDisplayString4($setup.code),
-                    1
-                    /* TEXT */
-                  )
-                ],
-                2112
-                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-              )) : $setup.mermaidSvg ? (_openBlock6(), _createElementBlock5(
-                _Fragment4,
-                { key: 2 },
-                [
-                  _createCommentVNode4(" \u9884\u89C8\u6A21\u5F0F "),
-                  _createElementVNode4("div", {
-                    innerHTML: $setup.mermaidSvg,
-                    class: "mermaid-svg"
-                  }, null, 8, _hoisted_92)
-                ],
-                2112
-                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-              )) : (_openBlock6(), _createElementBlock5(
-                _Fragment4,
-                { key: 3 },
-                [
-                  _createCommentVNode4(" \u65E0\u6CD5\u6E32\u67D3\u65F6\u663E\u793A\u6E90\u7801 "),
-                  _createElementVNode4(
-                    "pre",
-                    _hoisted_102,
-                    _toDisplayString4($setup.code),
-                    1
-                    /* TEXT */
-                  )
-                ],
-                2112
-                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-              ))
-            ])
-          ])
+          _createCommentVNode6(" Mermaid \u56FE\u8868 "),
+          _createVNode7($setup["IncremarkCodeMermaid"], {
+            node: $props.node,
+            "mermaid-delay": $props.mermaidDelay
+          }, null, 8, ["node", "mermaid-delay"])
         ],
         2112
         /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-      )) : (_openBlock6(), _createElementBlock5(
-        _Fragment4,
+      )) : (_openBlock9(), _createElementBlock8(
+        _Fragment6,
         { key: 2 },
         [
-          _createCommentVNode4(" \u666E\u901A\u4EE3\u7801\u5757 "),
-          _createElementVNode4("div", _hoisted_11, [
-            _createElementVNode4("div", _hoisted_122, [
-              _createElementVNode4(
-                "span",
-                _hoisted_132,
-                _toDisplayString4($setup.language),
-                1
-                /* TEXT */
-              ),
-              _createElementVNode4(
-                "button",
-                {
-                  class: "code-btn",
-                  onClick: $setup.copyCode,
-                  type: "button"
-                },
-                _toDisplayString4($setup.copied ? "\u2713 \u5DF2\u590D\u5236" : "\u590D\u5236"),
-                1
-                /* TEXT */
-              )
-            ]),
-            _createElementVNode4("div", _hoisted_142, [
-              _createCommentVNode4(" \u6B63\u5728\u52A0\u8F7D\u9AD8\u4EAE "),
-              $setup.isHighlighting && !$setup.highlightedHtml ? (_openBlock6(), _createElementBlock5("div", _hoisted_152, [
-                _createElementVNode4("pre", null, [
-                  _createElementVNode4(
-                    "code",
-                    null,
-                    _toDisplayString4($setup.code),
-                    1
-                    /* TEXT */
-                  )
-                ])
-              ])) : $setup.highlightedHtml ? (_openBlock6(), _createElementBlock5(
-                _Fragment4,
-                { key: 1 },
-                [
-                  _createCommentVNode4(" \u9AD8\u4EAE\u540E\u7684\u4EE3\u7801 "),
-                  _createElementVNode4("div", {
-                    innerHTML: $setup.highlightedHtml,
-                    class: "shiki-wrapper"
-                  }, null, 8, _hoisted_16)
-                ],
-                2112
-                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-              )) : (_openBlock6(), _createElementBlock5(
-                _Fragment4,
-                { key: 2 },
-                [
-                  _createCommentVNode4(" \u56DE\u9000\uFF1A\u65E0\u9AD8\u4EAE "),
-                  _createElementVNode4("pre", _hoisted_17, [
-                    _createElementVNode4(
-                      "code",
-                      null,
-                      _toDisplayString4($setup.code),
-                      1
-                      /* TEXT */
-                    )
-                  ])
-                ],
-                2112
-                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-              ))
-            ])
-          ])
+          _createCommentVNode6(" \u9ED8\u8BA4\u4EE3\u7801\u5757\u6E32\u67D3\uFF08\u652F\u6301\u7528\u6237\u81EA\u5B9A\u4E49\uFF09 "),
+          (_openBlock9(), _createBlock3(_resolveDynamicComponent3($props.defaultCodeComponent), {
+            node: $props.node,
+            theme: $props.theme,
+            "fallback-theme": $props.fallbackTheme,
+            "disable-highlight": $props.disableHighlight
+          }, null, 8, ["node", "theme", "fallback-theme", "disable-highlight"]))
         ],
         2112
         /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
@@ -1619,14 +1936,14 @@ function render6(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/IncremarkCode.vue
-IncremarkCode_default.render = render6;
+IncremarkCode_default.render = render9;
 IncremarkCode_default.__file = "src/components/IncremarkCode.vue";
 var IncremarkCode_default2 = IncremarkCode_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkList.vue?type=script
-import { defineComponent as _defineComponent7 } from "vue";
-import { computed as computed8 } from "vue";
-var IncremarkList_default = /* @__PURE__ */ _defineComponent7({
+import { defineComponent as _defineComponent10 } from "vue";
+import { computed as computed11 } from "vue";
+var IncremarkList_default = /* @__PURE__ */ _defineComponent10({
   ...{
     name: "IncremarkList"
   },
@@ -1637,7 +1954,7 @@ var IncremarkList_default = /* @__PURE__ */ _defineComponent7({
   setup(__props, { expose: __expose }) {
     __expose();
     const props = __props;
-    const tag = computed8(() => props.node.ordered ? "ol" : "ul");
+    const tag = computed11(() => props.node.ordered ? "ol" : "ul");
     function getItemInlineContent(item) {
       const firstChild = item.children[0];
       if (firstChild?.type === "paragraph") {
@@ -1663,61 +1980,62 @@ var IncremarkList_default = /* @__PURE__ */ _defineComponent7({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkList.vue?type=template
-import { renderList as _renderList3, Fragment as _Fragment5, openBlock as _openBlock7, createElementBlock as _createElementBlock6, createElementVNode as _createElementVNode5, createVNode as _createVNode5, createCommentVNode as _createCommentVNode5, createBlock as _createBlock4, normalizeClass as _normalizeClass2, resolveDynamicComponent as _resolveDynamicComponent4, withCtx as _withCtx3 } from "vue";
+import { renderList as _renderList3, Fragment as _Fragment7, openBlock as _openBlock10, createElementBlock as _createElementBlock9, createElementVNode as _createElementVNode6, createVNode as _createVNode8, createCommentVNode as _createCommentVNode7, createBlock as _createBlock4, normalizeClass as _normalizeClass3, resolveDynamicComponent as _resolveDynamicComponent4, withCtx as _withCtx3 } from "vue";
 var _hoisted_18 = {
   key: 0,
   class: "task-label"
 };
-var _hoisted_24 = ["checked"];
-var _hoisted_34 = { class: "task-content" };
-function render7(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock7(), _createBlock4(_resolveDynamicComponent4($setup.tag), {
-    class: _normalizeClass2(["incremark-list", { "task-list": $props.node.children.some((item) => item.checked !== null && item.checked !== void 0) }])
+var _hoisted_25 = ["checked"];
+var _hoisted_35 = { class: "task-content" };
+function render10(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock10(), _createBlock4(_resolveDynamicComponent4($setup.tag), {
+    class: _normalizeClass3(["incremark-list", { "task-list": $props.node.children.some((item) => item.checked !== null && item.checked !== void 0) }]),
+    start: $props.node.start || void 0
   }, {
     default: _withCtx3(() => [
-      (_openBlock7(true), _createElementBlock6(
-        _Fragment5,
+      (_openBlock10(true), _createElementBlock9(
+        _Fragment7,
         null,
         _renderList3($props.node.children, (item, index) => {
-          return _openBlock7(), _createElementBlock6(
+          return _openBlock10(), _createElementBlock9(
             "li",
             {
               key: index,
-              class: _normalizeClass2(["incremark-list-item", { "task-item": item.checked !== null && item.checked !== void 0 }])
+              class: _normalizeClass3(["incremark-list-item", { "task-item": item.checked !== null && item.checked !== void 0 }])
             },
             [
-              item.checked !== null && item.checked !== void 0 ? (_openBlock7(), _createElementBlock6("label", _hoisted_18, [
-                _createElementVNode5("input", {
+              item.checked !== null && item.checked !== void 0 ? (_openBlock10(), _createElementBlock9("label", _hoisted_18, [
+                _createElementVNode6("input", {
                   type: "checkbox",
                   checked: item.checked,
                   disabled: "",
                   class: "checkbox"
-                }, null, 8, _hoisted_24),
-                _createElementVNode5("span", _hoisted_34, [
-                  _createVNode5($setup["IncremarkInline"], {
+                }, null, 8, _hoisted_25),
+                _createElementVNode6("span", _hoisted_35, [
+                  _createVNode8($setup["IncremarkInline"], {
                     nodes: $setup.getItemInlineContent(item)
                   }, null, 8, ["nodes"])
                 ])
-              ])) : (_openBlock7(), _createElementBlock6(
-                _Fragment5,
+              ])) : (_openBlock10(), _createElementBlock9(
+                _Fragment7,
                 { key: 1 },
                 [
-                  _createVNode5($setup["IncremarkInline"], {
+                  _createVNode8($setup["IncremarkInline"], {
                     nodes: $setup.getItemInlineContent(item)
                   }, null, 8, ["nodes"]),
-                  _createCommentVNode5(" \u9012\u5F52\u6E32\u67D3\u6240\u6709\u5757\u7EA7\u5185\u5BB9\uFF08\u5D4C\u5957\u5217\u8868\u3001heading\u3001blockquote\u3001code\u3001table \u7B49\uFF09 "),
-                  $setup.hasBlockChildren(item) ? (_openBlock7(true), _createElementBlock6(
-                    _Fragment5,
+                  _createCommentVNode7(" \u9012\u5F52\u6E32\u67D3\u6240\u6709\u5757\u7EA7\u5185\u5BB9\uFF08\u5D4C\u5957\u5217\u8868\u3001heading\u3001blockquote\u3001code\u3001table \u7B49\uFF09 "),
+                  $setup.hasBlockChildren(item) ? (_openBlock10(true), _createElementBlock9(
+                    _Fragment7,
                     { key: 0 },
                     _renderList3($setup.getItemBlockChildren(item), (child, childIndex) => {
-                      return _openBlock7(), _createBlock4($setup["IncremarkRenderer"], {
+                      return _openBlock10(), _createBlock4($setup["IncremarkRenderer"], {
                         key: childIndex,
                         node: child
                       }, null, 8, ["node"]);
                     }),
                     128
                     /* KEYED_FRAGMENT */
-                  )) : _createCommentVNode5("v-if", true)
+                  )) : _createCommentVNode7("v-if", true)
                 ],
                 64
                 /* STABLE_FRAGMENT */
@@ -1733,17 +2051,17 @@ function render7(_ctx, _cache, $props, $setup, $data, $options) {
     ]),
     _: 1
     /* STABLE */
-  }, 8, ["class"]);
+  }, 8, ["class", "start"]);
 }
 
 // src/components/IncremarkList.vue
-IncremarkList_default.render = render7;
+IncremarkList_default.render = render10;
 IncremarkList_default.__file = "src/components/IncremarkList.vue";
 var IncremarkList_default2 = IncremarkList_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkTable.vue?type=script
-import { defineComponent as _defineComponent8 } from "vue";
-var IncremarkTable_default = /* @__PURE__ */ _defineComponent8({
+import { defineComponent as _defineComponent11 } from "vue";
+var IncremarkTable_default = /* @__PURE__ */ _defineComponent11({
   __name: "IncremarkTable",
   props: {
     node: { type: null, required: true }
@@ -1760,62 +2078,62 @@ var IncremarkTable_default = /* @__PURE__ */ _defineComponent8({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkTable.vue?type=template
-import { renderList as _renderList4, Fragment as _Fragment6, openBlock as _openBlock8, createElementBlock as _createElementBlock7, createVNode as _createVNode6, normalizeStyle as _normalizeStyle, createCommentVNode as _createCommentVNode6, createElementVNode as _createElementVNode6 } from "vue";
+import { renderList as _renderList4, Fragment as _Fragment8, openBlock as _openBlock11, createElementBlock as _createElementBlock10, createVNode as _createVNode9, normalizeClass as _normalizeClass4, createCommentVNode as _createCommentVNode8, createElementVNode as _createElementVNode7 } from "vue";
 var _hoisted_19 = { class: "incremark-table-wrapper" };
-var _hoisted_25 = { class: "incremark-table" };
-var _hoisted_35 = { key: 0 };
-function render8(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock8(), _createElementBlock7("div", _hoisted_19, [
-    _createElementVNode6("table", _hoisted_25, [
-      _createElementVNode6("thead", null, [
-        $props.node.children[0] ? (_openBlock8(), _createElementBlock7("tr", _hoisted_35, [
-          (_openBlock8(true), _createElementBlock7(
-            _Fragment6,
+var _hoisted_26 = { class: "incremark-table" };
+var _hoisted_36 = { key: 0 };
+function render11(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock11(), _createElementBlock10("div", _hoisted_19, [
+    _createElementVNode7("table", _hoisted_26, [
+      _createElementVNode7("thead", null, [
+        $props.node.children[0] ? (_openBlock11(), _createElementBlock10("tr", _hoisted_36, [
+          (_openBlock11(true), _createElementBlock10(
+            _Fragment8,
             null,
             _renderList4($props.node.children[0].children, (cell, cellIndex) => {
-              return _openBlock8(), _createElementBlock7(
+              return _openBlock11(), _createElementBlock10(
                 "th",
                 {
                   key: cellIndex,
-                  style: _normalizeStyle({ textAlign: $props.node.align?.[cellIndex] || "left" })
+                  class: _normalizeClass4(`incremark-table-align-${$props.node.align?.[cellIndex] || "left"}`)
                 },
                 [
-                  _createVNode6($setup["IncremarkInline"], {
+                  _createVNode9($setup["IncremarkInline"], {
                     nodes: $setup.getCellContent(cell)
                   }, null, 8, ["nodes"])
                 ],
-                4
-                /* STYLE */
+                2
+                /* CLASS */
               );
             }),
             128
             /* KEYED_FRAGMENT */
           ))
-        ])) : _createCommentVNode6("v-if", true)
+        ])) : _createCommentVNode8("v-if", true)
       ]),
-      _createElementVNode6("tbody", null, [
-        (_openBlock8(true), _createElementBlock7(
-          _Fragment6,
+      _createElementVNode7("tbody", null, [
+        (_openBlock11(true), _createElementBlock10(
+          _Fragment8,
           null,
           _renderList4($props.node.children.slice(1), (row, rowIndex) => {
-            return _openBlock8(), _createElementBlock7("tr", { key: rowIndex }, [
-              (_openBlock8(true), _createElementBlock7(
-                _Fragment6,
+            return _openBlock11(), _createElementBlock10("tr", { key: rowIndex }, [
+              (_openBlock11(true), _createElementBlock10(
+                _Fragment8,
                 null,
                 _renderList4(row.children, (cell, cellIndex) => {
-                  return _openBlock8(), _createElementBlock7(
+                  return _openBlock11(), _createElementBlock10(
                     "td",
                     {
                       key: cellIndex,
-                      style: _normalizeStyle({ textAlign: $props.node.align?.[cellIndex] || "left" })
+                      class: _normalizeClass4(`incremark-table-align-${$props.node.align?.[cellIndex] || "left"}`)
                     },
                     [
-                      _createVNode6($setup["IncremarkInline"], {
+                      _createVNode9($setup["IncremarkInline"], {
                         nodes: $setup.getCellContent(cell)
                       }, null, 8, ["nodes"])
                     ],
-                    4
-                    /* STYLE */
+                    2
+                    /* CLASS */
                   );
                 }),
                 128
@@ -1832,13 +2150,13 @@ function render8(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/IncremarkTable.vue
-IncremarkTable_default.render = render8;
+IncremarkTable_default.render = render11;
 IncremarkTable_default.__file = "src/components/IncremarkTable.vue";
 var IncremarkTable_default2 = IncremarkTable_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkBlockquote.vue?type=script
-import { defineComponent as _defineComponent9 } from "vue";
-var IncremarkBlockquote_default = /* @__PURE__ */ _defineComponent9({
+import { defineComponent as _defineComponent12 } from "vue";
+var IncremarkBlockquote_default = /* @__PURE__ */ _defineComponent12({
   __name: "IncremarkBlockquote",
   props: {
     node: { type: null, required: true }
@@ -1852,15 +2170,15 @@ var IncremarkBlockquote_default = /* @__PURE__ */ _defineComponent9({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkBlockquote.vue?type=template
-import { renderList as _renderList5, Fragment as _Fragment7, openBlock as _openBlock9, createElementBlock as _createElementBlock8, createBlock as _createBlock5 } from "vue";
+import { renderList as _renderList5, Fragment as _Fragment9, openBlock as _openBlock12, createElementBlock as _createElementBlock11, createBlock as _createBlock5 } from "vue";
 var _hoisted_110 = { class: "incremark-blockquote" };
-function render9(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock9(), _createElementBlock8("blockquote", _hoisted_110, [
-    (_openBlock9(true), _createElementBlock8(
-      _Fragment7,
+function render12(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock12(), _createElementBlock11("blockquote", _hoisted_110, [
+    (_openBlock12(true), _createElementBlock11(
+      _Fragment9,
       null,
       _renderList5($props.node.children, (child, index) => {
-        return _openBlock9(), _createBlock5($setup["IncremarkRenderer"], {
+        return _openBlock12(), _createBlock5($setup["IncremarkRenderer"], {
           key: index,
           node: child
         }, null, 8, ["node"]);
@@ -1872,13 +2190,13 @@ function render9(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/IncremarkBlockquote.vue
-IncremarkBlockquote_default.render = render9;
+IncremarkBlockquote_default.render = render12;
 IncremarkBlockquote_default.__file = "src/components/IncremarkBlockquote.vue";
 var IncremarkBlockquote_default2 = IncremarkBlockquote_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkThematicBreak.vue?type=script
-import { defineComponent as _defineComponent10 } from "vue";
-var IncremarkThematicBreak_default = /* @__PURE__ */ _defineComponent10({
+import { defineComponent as _defineComponent13 } from "vue";
+var IncremarkThematicBreak_default = /* @__PURE__ */ _defineComponent13({
   __name: "IncremarkThematicBreak",
   setup(__props, { expose: __expose }) {
     __expose();
@@ -1889,20 +2207,20 @@ var IncremarkThematicBreak_default = /* @__PURE__ */ _defineComponent10({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkThematicBreak.vue?type=template
-import { openBlock as _openBlock10, createElementBlock as _createElementBlock9 } from "vue";
+import { openBlock as _openBlock13, createElementBlock as _createElementBlock12 } from "vue";
 var _hoisted_111 = { class: "incremark-hr" };
-function render10(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock10(), _createElementBlock9("hr", _hoisted_111);
+function render13(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock13(), _createElementBlock12("hr", _hoisted_111);
 }
 
 // src/components/IncremarkThematicBreak.vue
-IncremarkThematicBreak_default.render = render10;
+IncremarkThematicBreak_default.render = render13;
 IncremarkThematicBreak_default.__file = "src/components/IncremarkThematicBreak.vue";
 var IncremarkThematicBreak_default2 = IncremarkThematicBreak_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkContainer.vue?type=script
-import { defineComponent as _defineComponent11 } from "vue";
-var IncremarkContainer_default = /* @__PURE__ */ _defineComponent11({
+import { defineComponent as _defineComponent14 } from "vue";
+var IncremarkContainer_default = /* @__PURE__ */ _defineComponent14({
   __name: "IncremarkContainer",
   props: {
     node: { type: Object, required: true },
@@ -1934,56 +2252,56 @@ var IncremarkContainer_default = /* @__PURE__ */ _defineComponent11({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkContainer.vue?type=template
-import { createCommentVNode as _createCommentVNode7, renderList as _renderList6, Fragment as _Fragment8, openBlock as _openBlock11, createElementBlock as _createElementBlock10, createBlock as _createBlock6, resolveDynamicComponent as _resolveDynamicComponent5, withCtx as _withCtx4, normalizeClass as _normalizeClass3, createElementVNode as _createElementVNode7 } from "vue";
+import { createCommentVNode as _createCommentVNode9, renderList as _renderList6, Fragment as _Fragment10, openBlock as _openBlock14, createElementBlock as _createElementBlock13, createBlock as _createBlock6, resolveDynamicComponent as _resolveDynamicComponent5, withCtx as _withCtx4, normalizeClass as _normalizeClass5, createElementVNode as _createElementVNode8 } from "vue";
 var _hoisted_112 = {
   key: 0,
   class: "incremark-container-content"
 };
-function render11(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock11(), _createElementBlock10(
-    _Fragment8,
+function render14(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock14(), _createElementBlock13(
+    _Fragment10,
     null,
     [
-      _createCommentVNode7(" \u5982\u679C\u6709\u81EA\u5B9A\u4E49\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u4F7F\u7528\u81EA\u5B9A\u4E49\u7EC4\u4EF6 "),
-      $setup.hasCustomContainer ? (_openBlock11(), _createBlock6(_resolveDynamicComponent5($setup.CustomContainer), {
+      _createCommentVNode9(" \u5982\u679C\u6709\u81EA\u5B9A\u4E49\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u4F7F\u7528\u81EA\u5B9A\u4E49\u7EC4\u4EF6 "),
+      $setup.hasCustomContainer ? (_openBlock14(), _createBlock6(_resolveDynamicComponent5($setup.CustomContainer), {
         key: 0,
         name: $setup.containerName,
         options: $setup.options
       }, {
         default: _withCtx4(() => [
-          _createCommentVNode7(" \u5C06\u5BB9\u5668\u5185\u5BB9\u4F5C\u4E3A\u9ED8\u8BA4 slot \u4F20\u9012 "),
-          $props.node.children && $props.node.children.length > 0 ? (_openBlock11(true), _createElementBlock10(
-            _Fragment8,
+          _createCommentVNode9(" \u5C06\u5BB9\u5668\u5185\u5BB9\u4F5C\u4E3A\u9ED8\u8BA4 slot \u4F20\u9012 "),
+          $props.node.children && $props.node.children.length > 0 ? (_openBlock14(true), _createElementBlock13(
+            _Fragment10,
             { key: 0 },
             _renderList6($props.node.children, (child, index) => {
-              return _openBlock11(), _createBlock6($setup["IncremarkRenderer"], {
+              return _openBlock14(), _createBlock6($setup["IncremarkRenderer"], {
                 key: index,
                 node: child
               }, null, 8, ["node"]);
             }),
             128
             /* KEYED_FRAGMENT */
-          )) : _createCommentVNode7("v-if", true)
+          )) : _createCommentVNode9("v-if", true)
         ]),
         _: 1
         /* STABLE */
-      }, 8, ["name", "options"])) : (_openBlock11(), _createElementBlock10(
-        _Fragment8,
+      }, 8, ["name", "options"])) : (_openBlock14(), _createElementBlock13(
+        _Fragment10,
         { key: 1 },
         [
-          _createCommentVNode7(" \u5982\u679C\u6CA1\u6709\u81EA\u5B9A\u4E49\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u6E32\u67D3 "),
-          _createElementVNode7(
+          _createCommentVNode9(" \u5982\u679C\u6CA1\u6709\u81EA\u5B9A\u4E49\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u6E32\u67D3 "),
+          _createElementVNode8(
             "div",
             {
-              class: _normalizeClass3(["incremark-container", `incremark-container-${$setup.containerName}`])
+              class: _normalizeClass5(["incremark-container", `incremark-container-${$setup.containerName}`])
             },
             [
-              $props.node.children && $props.node.children.length > 0 ? (_openBlock11(), _createElementBlock10("div", _hoisted_112, [
-                (_openBlock11(true), _createElementBlock10(
-                  _Fragment8,
+              $props.node.children && $props.node.children.length > 0 ? (_openBlock14(), _createElementBlock13("div", _hoisted_112, [
+                (_openBlock14(true), _createElementBlock13(
+                  _Fragment10,
                   null,
                   _renderList6($props.node.children, (child, index) => {
-                    return _openBlock11(), _createBlock6($setup["IncremarkRenderer"], {
+                    return _openBlock14(), _createBlock6($setup["IncremarkRenderer"], {
                       key: index,
                       node: child
                     }, null, 8, ["node"]);
@@ -1991,7 +2309,7 @@ function render11(_ctx, _cache, $props, $setup, $data, $options) {
                   128
                   /* KEYED_FRAGMENT */
                 ))
-              ])) : _createCommentVNode7("v-if", true)
+              ])) : _createCommentVNode9("v-if", true)
             ],
             2
             /* CLASS */
@@ -2007,13 +2325,13 @@ function render11(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/IncremarkContainer.vue
-IncremarkContainer_default.render = render11;
+IncremarkContainer_default.render = render14;
 IncremarkContainer_default.__file = "src/components/IncremarkContainer.vue";
 var IncremarkContainer_default2 = IncremarkContainer_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkDefault.vue?type=script
-import { defineComponent as _defineComponent12 } from "vue";
-var IncremarkDefault_default = /* @__PURE__ */ _defineComponent12({
+import { defineComponent as _defineComponent15 } from "vue";
+var IncremarkDefault_default = /* @__PURE__ */ _defineComponent15({
   __name: "IncremarkDefault",
   props: {
     node: { type: null, required: true }
@@ -2027,22 +2345,22 @@ var IncremarkDefault_default = /* @__PURE__ */ _defineComponent12({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkDefault.vue?type=template
-import { toDisplayString as _toDisplayString5, createElementVNode as _createElementVNode8, openBlock as _openBlock12, createElementBlock as _createElementBlock11 } from "vue";
+import { toDisplayString as _toDisplayString6, createElementVNode as _createElementVNode9, openBlock as _openBlock15, createElementBlock as _createElementBlock14 } from "vue";
 var _hoisted_113 = { class: "incremark-default" };
-var _hoisted_26 = { class: "type-badge" };
-function render12(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock12(), _createElementBlock11("div", _hoisted_113, [
-    _createElementVNode8(
+var _hoisted_27 = { class: "type-badge" };
+function render15(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock15(), _createElementBlock14("div", _hoisted_113, [
+    _createElementVNode9(
       "span",
-      _hoisted_26,
-      _toDisplayString5($props.node.type),
+      _hoisted_27,
+      _toDisplayString6($props.node.type),
       1
       /* TEXT */
     ),
-    _createElementVNode8(
+    _createElementVNode9(
       "pre",
       null,
-      _toDisplayString5(JSON.stringify($props.node, null, 2)),
+      _toDisplayString6(JSON.stringify($props.node, null, 2)),
       1
       /* TEXT */
     )
@@ -2050,12 +2368,12 @@ function render12(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/IncremarkDefault.vue
-IncremarkDefault_default.render = render12;
+IncremarkDefault_default.render = render15;
 IncremarkDefault_default.__file = "src/components/IncremarkDefault.vue";
 var IncremarkDefault_default2 = IncremarkDefault_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkRenderer.vue?type=script
-var IncremarkRenderer_default2 = /* @__PURE__ */ _defineComponent13({
+var IncremarkRenderer_default2 = /* @__PURE__ */ _defineComponent16({
   __name: "IncremarkRenderer",
   props: {
     node: { type: null, required: true },
@@ -2083,7 +2401,7 @@ var IncremarkRenderer_default2 = /* @__PURE__ */ _defineComponent13({
       leafDirective: IncremarkContainer_default2,
       textDirective: IncremarkContainer_default2
     };
-    const componentMap = computed9(() => ({
+    const componentMap = computed12(() => ({
       ...defaultComponentMap,
       ...props.components
     }));
@@ -2103,57 +2421,58 @@ var IncremarkRenderer_default2 = /* @__PURE__ */ _defineComponent13({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkRenderer.vue?type=template
-import { createCommentVNode as _createCommentVNode8, toDisplayString as _toDisplayString6, createElementVNode as _createElementVNode9, openBlock as _openBlock13, createElementBlock as _createElementBlock12, createVNode as _createVNode7, Fragment as _Fragment9, resolveDynamicComponent as _resolveDynamicComponent6, createBlock as _createBlock7 } from "vue";
+import { createCommentVNode as _createCommentVNode10, toDisplayString as _toDisplayString7, createElementVNode as _createElementVNode10, openBlock as _openBlock16, createElementBlock as _createElementBlock15, createVNode as _createVNode10, Fragment as _Fragment11, resolveDynamicComponent as _resolveDynamicComponent6, createBlock as _createBlock7 } from "vue";
 var _hoisted_114 = {
   key: 0,
   class: "incremark-html-code"
 };
-function render13(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock13(), _createElementBlock12(
-    _Fragment9,
+function render16(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock16(), _createElementBlock15(
+    _Fragment11,
     null,
     [
-      _createCommentVNode8(" HTML \u8282\u70B9\uFF1A\u6E32\u67D3\u4E3A\u4EE3\u7801\u5757\u663E\u793A\u6E90\u4EE3\u7801 "),
-      $setup.isHtmlNode($props.node) ? (_openBlock13(), _createElementBlock12("pre", _hoisted_114, [
-        _createElementVNode9(
+      _createCommentVNode10(" HTML \u8282\u70B9\uFF1A\u6E32\u67D3\u4E3A\u4EE3\u7801\u5757\u663E\u793A\u6E90\u4EE3\u7801 "),
+      $setup.isHtmlNode($props.node) ? (_openBlock16(), _createElementBlock15("pre", _hoisted_114, [
+        _createElementVNode10(
           "code",
           null,
-          _toDisplayString6($props.node.value),
+          _toDisplayString7($props.node.value),
           1
           /* TEXT */
         )
-      ])) : $setup.isContainerNode($props.node) ? (_openBlock13(), _createElementBlock12(
-        _Fragment9,
+      ])) : $setup.isContainerNode($props.node) ? (_openBlock16(), _createElementBlock15(
+        _Fragment11,
         { key: 1 },
         [
-          _createCommentVNode8(" \u5BB9\u5668\u8282\u70B9\uFF1A\u4F7F\u7528\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u4F20\u9012 customContainers "),
-          _createVNode7($setup["IncremarkContainer"], {
+          _createCommentVNode10(" \u5BB9\u5668\u8282\u70B9\uFF1A\u4F7F\u7528\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u4F20\u9012 customContainers "),
+          _createVNode10($setup["IncremarkContainer"], {
             node: $props.node,
             "custom-containers": $props.customContainers
           }, null, 8, ["node", "custom-containers"])
         ],
         2112
         /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-      )) : $props.node.type === "code" ? (_openBlock13(), _createElementBlock12(
-        _Fragment9,
+      )) : $props.node.type === "code" ? (_openBlock16(), _createElementBlock15(
+        _Fragment11,
         { key: 2 },
         [
-          _createCommentVNode8(" \u4EE3\u7801\u8282\u70B9\uFF1A\u7279\u6B8A\u5904\u7406\uFF0C\u4F20\u9012 customCodeBlocks\u3001codeBlockConfigs \u548C blockStatus "),
-          _createVNode7($setup["IncremarkCode"], {
+          _createCommentVNode10(" \u4EE3\u7801\u8282\u70B9\uFF1A\u7279\u6B8A\u5904\u7406\uFF0C\u4F20\u9012 customCodeBlocks\u3001codeBlockConfigs \u548C blockStatus "),
+          _createVNode10($setup["IncremarkCode"], {
             node: $props.node,
             "custom-code-blocks": $props.customCodeBlocks,
             "code-block-configs": $props.codeBlockConfigs,
-            "block-status": $props.blockStatus
-          }, null, 8, ["node", "custom-code-blocks", "code-block-configs", "block-status"])
+            "block-status": $props.blockStatus,
+            "default-code-component": $props.components?.["code"]
+          }, null, 8, ["node", "custom-code-blocks", "code-block-configs", "block-status", "default-code-component"])
         ],
         2112
         /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-      )) : (_openBlock13(), _createElementBlock12(
-        _Fragment9,
+      )) : (_openBlock16(), _createElementBlock15(
+        _Fragment11,
         { key: 3 },
         [
-          _createCommentVNode8(" \u5176\u4ED6\u8282\u70B9\uFF1A\u4F7F\u7528\u5BF9\u5E94\u7EC4\u4EF6 "),
-          (_openBlock13(), _createBlock7(_resolveDynamicComponent6($setup.getComponent($props.node.type)), {
+          _createCommentVNode10(" \u5176\u4ED6\u8282\u70B9\uFF1A\u4F7F\u7528\u5BF9\u5E94\u7EC4\u4EF6 "),
+          (_openBlock16(), _createBlock7(_resolveDynamicComponent6($setup.getComponent($props.node.type)), {
             node: $props.node
           }, null, 8, ["node"]))
         ],
@@ -2167,25 +2486,25 @@ function render13(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/IncremarkRenderer.vue
-IncremarkRenderer_default2.render = render13;
+IncremarkRenderer_default2.render = render16;
 IncremarkRenderer_default2.__file = "src/components/IncremarkRenderer.vue";
 var IncremarkRenderer_default = IncremarkRenderer_default2;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkFootnotes.vue?type=script
-import { defineComponent as _defineComponent14 } from "vue";
-import { computed as computed10 } from "vue";
-var IncremarkFootnotes_default = /* @__PURE__ */ _defineComponent14({
+import { defineComponent as _defineComponent17 } from "vue";
+import { computed as computed13 } from "vue";
+var IncremarkFootnotes_default = /* @__PURE__ */ _defineComponent17({
   __name: "IncremarkFootnotes",
   setup(__props, { expose: __expose }) {
     __expose();
     const { footnoteDefinitions, footnoteReferenceOrder } = useDefinationsContext();
-    const orderedFootnotes = computed10(() => {
+    const orderedFootnotes = computed13(() => {
       return footnoteReferenceOrder.value.map((identifier) => ({
         identifier,
         definition: footnoteDefinitions.value[identifier]
       })).filter((item) => item.definition !== void 0);
     });
-    const hasFootnotes = computed10(() => orderedFootnotes.value.length > 0);
+    const hasFootnotes = computed13(() => orderedFootnotes.value.length > 0);
     const __returned__ = { footnoteDefinitions, footnoteReferenceOrder, orderedFootnotes, hasFootnotes, IncremarkRenderer: IncremarkRenderer_default };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
@@ -2193,52 +2512,52 @@ var IncremarkFootnotes_default = /* @__PURE__ */ _defineComponent14({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkFootnotes.vue?type=template
-import { createElementVNode as _createElementVNode10, renderList as _renderList7, Fragment as _Fragment10, openBlock as _openBlock14, createElementBlock as _createElementBlock13, createCommentVNode as _createCommentVNode9, toDisplayString as _toDisplayString7, createBlock as _createBlock8 } from "vue";
+import { createElementVNode as _createElementVNode11, renderList as _renderList7, Fragment as _Fragment12, openBlock as _openBlock17, createElementBlock as _createElementBlock16, createCommentVNode as _createCommentVNode11, toDisplayString as _toDisplayString8, createBlock as _createBlock8 } from "vue";
 var _hoisted_115 = {
   key: 0,
   class: "incremark-footnotes"
 };
-var _hoisted_27 = { class: "incremark-footnotes-list" };
-var _hoisted_36 = ["id"];
-var _hoisted_44 = { class: "incremark-footnote-content" };
-var _hoisted_54 = { class: "incremark-footnote-number" };
-var _hoisted_64 = { class: "incremark-footnote-body" };
-var _hoisted_73 = ["href"];
-function render14(_ctx, _cache, $props, $setup, $data, $options) {
-  return $setup.hasFootnotes ? (_openBlock14(), _createElementBlock13("section", _hoisted_115, [
-    _cache[0] || (_cache[0] = _createElementVNode10(
+var _hoisted_28 = { class: "incremark-footnotes-list" };
+var _hoisted_37 = ["id"];
+var _hoisted_45 = { class: "incremark-footnote-content" };
+var _hoisted_55 = { class: "incremark-footnote-number" };
+var _hoisted_65 = { class: "incremark-footnote-body" };
+var _hoisted_74 = ["href"];
+function render17(_ctx, _cache, $props, $setup, $data, $options) {
+  return $setup.hasFootnotes ? (_openBlock17(), _createElementBlock16("section", _hoisted_115, [
+    _cache[0] || (_cache[0] = _createElementVNode11(
       "hr",
       { class: "incremark-footnotes-divider" },
       null,
       -1
       /* CACHED */
     )),
-    _createElementVNode10("ol", _hoisted_27, [
-      (_openBlock14(true), _createElementBlock13(
-        _Fragment10,
+    _createElementVNode11("ol", _hoisted_28, [
+      (_openBlock17(true), _createElementBlock16(
+        _Fragment12,
         null,
         _renderList7($setup.orderedFootnotes, (item, index) => {
-          return _openBlock14(), _createElementBlock13("li", {
+          return _openBlock17(), _createElementBlock16("li", {
             key: item.identifier,
             id: `fn-${item.identifier}`,
             class: "incremark-footnote-item"
           }, [
-            _createElementVNode10("div", _hoisted_44, [
-              _createCommentVNode9(" \u811A\u6CE8\u5E8F\u53F7 "),
-              _createElementVNode10(
+            _createElementVNode11("div", _hoisted_45, [
+              _createCommentVNode11(" \u811A\u6CE8\u5E8F\u53F7 "),
+              _createElementVNode11(
                 "span",
-                _hoisted_54,
-                _toDisplayString7(index + 1) + ".",
+                _hoisted_55,
+                _toDisplayString8(index + 1) + ".",
                 1
                 /* TEXT */
               ),
-              _createCommentVNode9(" \u811A\u6CE8\u5185\u5BB9 "),
-              _createElementVNode10("div", _hoisted_64, [
-                (_openBlock14(true), _createElementBlock13(
-                  _Fragment10,
+              _createCommentVNode11(" \u811A\u6CE8\u5185\u5BB9 "),
+              _createElementVNode11("div", _hoisted_65, [
+                (_openBlock17(true), _createElementBlock16(
+                  _Fragment12,
                   null,
                   _renderList7(item.definition.children, (child, childIndex) => {
-                    return _openBlock14(), _createBlock8($setup["IncremarkRenderer"], {
+                    return _openBlock17(), _createBlock8($setup["IncremarkRenderer"], {
                       key: childIndex,
                       node: child
                     }, null, 8, ["node"]);
@@ -2248,28 +2567,28 @@ function render14(_ctx, _cache, $props, $setup, $data, $options) {
                 ))
               ])
             ]),
-            _createCommentVNode9(" \u8FD4\u56DE\u94FE\u63A5 "),
-            _createElementVNode10("a", {
+            _createCommentVNode11(" \u8FD4\u56DE\u94FE\u63A5 "),
+            _createElementVNode11("a", {
               href: `#fnref-${item.identifier}`,
               class: "incremark-footnote-backref",
               "aria-label": "\u8FD4\u56DE\u5F15\u7528\u4F4D\u7F6E"
-            }, " \u21A9 ", 8, _hoisted_73)
-          ], 8, _hoisted_36);
+            }, " \u21A9 ", 8, _hoisted_74)
+          ], 8, _hoisted_37);
         }),
         128
         /* KEYED_FRAGMENT */
       ))
     ])
-  ])) : _createCommentVNode9("v-if", true);
+  ])) : _createCommentVNode11("v-if", true);
 }
 
 // src/components/IncremarkFootnotes.vue
-IncremarkFootnotes_default.render = render14;
+IncremarkFootnotes_default.render = render17;
 IncremarkFootnotes_default.__file = "src/components/IncremarkFootnotes.vue";
 var IncremarkFootnotes_default2 = IncremarkFootnotes_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/Incremark.vue?type=script
-var Incremark_default = /* @__PURE__ */ _defineComponent15({
+var Incremark_default = /* @__PURE__ */ _defineComponent18({
   __name: "Incremark",
   props: {
     blocks: { type: Array, required: false, default: () => [] },
@@ -2289,8 +2608,8 @@ var Incremark_default = /* @__PURE__ */ _defineComponent15({
     const {
       footnoteReferenceOrder
     } = useDefinationsContext();
-    const actualBlocks = computed11(() => props.incremark?.blocks.value || props.blocks || []);
-    const actualIsDisplayComplete = computed11(() => {
+    const actualBlocks = computed14(() => props.incremark?.blocks.value || props.blocks || []);
+    const actualIsDisplayComplete = computed14(() => {
       if (props.incremark) {
         return props.incremark.isDisplayComplete.value;
       }
@@ -2303,24 +2622,24 @@ var Incremark_default = /* @__PURE__ */ _defineComponent15({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/Incremark.vue?type=template
-import { createCommentVNode as _createCommentVNode10, renderList as _renderList8, Fragment as _Fragment11, openBlock as _openBlock15, createElementBlock as _createElementBlock14, createVNode as _createVNode8, normalizeClass as _normalizeClass4, createBlock as _createBlock9 } from "vue";
+import { createCommentVNode as _createCommentVNode12, renderList as _renderList8, Fragment as _Fragment13, openBlock as _openBlock18, createElementBlock as _createElementBlock17, createVNode as _createVNode11, normalizeClass as _normalizeClass6, createBlock as _createBlock9 } from "vue";
 var _hoisted_116 = { class: "incremark" };
-function render15(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock15(), _createElementBlock14("div", _hoisted_116, [
-    _createCommentVNode10(" \u4E3B\u8981\u5185\u5BB9\u5757 "),
-    (_openBlock15(true), _createElementBlock14(
-      _Fragment11,
+function render18(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock18(), _createElementBlock17("div", _hoisted_116, [
+    _createCommentVNode12(" \u4E3B\u8981\u5185\u5BB9\u5757 "),
+    (_openBlock18(true), _createElementBlock17(
+      _Fragment13,
       null,
       _renderList8($setup.actualBlocks, (block) => {
-        return _openBlock15(), _createElementBlock14(
-          _Fragment11,
+        return _openBlock18(), _createElementBlock17(
+          _Fragment13,
           null,
           [
-            block.node.type !== "definition" && block.node.type !== "footnoteDefinition" ? (_openBlock15(), _createElementBlock14(
+            block.node.type !== "definition" && block.node.type !== "footnoteDefinition" ? (_openBlock18(), _createElementBlock17(
               "div",
               {
-                key: block.stableId,
-                class: _normalizeClass4([
+                key: block.id,
+                class: _normalizeClass6([
                   "incremark-block",
                   block.status === "completed" ? $props.completedClass : $props.pendingClass,
                   { "incremark-show-status": $props.showBlockStatus },
@@ -2328,8 +2647,8 @@ function render15(_ctx, _cache, $props, $setup, $data, $options) {
                 ])
               },
               [
-                _createCommentVNode10(" \u4F7F\u7528 IncremarkRenderer \u7EDF\u4E00\u5904\u7406\u6240\u6709\u8282\u70B9\u7C7B\u578B "),
-                _createVNode8($setup["IncremarkRenderer"], {
+                _createCommentVNode12(" \u4F7F\u7528 IncremarkRenderer \u7EDF\u4E00\u5904\u7406\u6240\u6709\u8282\u70B9\u7C7B\u578B "),
+                _createVNode11($setup["IncremarkRenderer"], {
                   node: block.node,
                   "block-status": block.status,
                   "custom-containers": $props.customContainers,
@@ -2340,7 +2659,7 @@ function render15(_ctx, _cache, $props, $setup, $data, $options) {
               ],
               2
               /* CLASS */
-            )) : _createCommentVNode10("v-if", true)
+            )) : _createCommentVNode12("v-if", true)
           ],
           64
           /* STABLE_FRAGMENT */
@@ -2349,20 +2668,115 @@ function render15(_ctx, _cache, $props, $setup, $data, $options) {
       256
       /* UNKEYED_FRAGMENT */
     )),
-    _createCommentVNode10(" \u811A\u6CE8\u5217\u8868\uFF08\u4EC5\u5728\u5185\u5BB9\u5B8C\u5168\u663E\u793A\u540E\u663E\u793A\uFF09 "),
-    $setup.actualIsDisplayComplete && $setup.footnoteReferenceOrder.length > 0 ? (_openBlock15(), _createBlock9($setup["IncremarkFootnotes"], { key: 0 })) : _createCommentVNode10("v-if", true)
+    _createCommentVNode12(" \u811A\u6CE8\u5217\u8868\uFF08\u4EC5\u5728\u5185\u5BB9\u5B8C\u5168\u663E\u793A\u540E\u663E\u793A\uFF09 "),
+    $setup.actualIsDisplayComplete && $setup.footnoteReferenceOrder.length > 0 ? (_openBlock18(), _createBlock9($setup["IncremarkFootnotes"], { key: 0 })) : _createCommentVNode12("v-if", true)
   ]);
 }
 
 // src/components/Incremark.vue
-Incremark_default.render = render15;
+Incremark_default.render = render18;
 Incremark_default.__file = "src/components/Incremark.vue";
 var Incremark_default2 = Incremark_default;
 
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkContent.vue?type=script
+import { defineComponent as _defineComponent19 } from "vue";
+import { computed as computed15, watch as watch7 } from "vue";
+var IncremarkContent_default = /* @__PURE__ */ _defineComponent19({
+  __name: "IncremarkContent",
+  props: {
+    stream: { type: Function, required: false },
+    content: { type: String, required: false },
+    components: { type: Object, required: false },
+    customContainers: { type: Object, required: false },
+    customCodeBlocks: { type: Object, required: false },
+    codeBlockConfigs: { type: Object, required: false },
+    isFinished: { type: Boolean, required: false },
+    incremarkOptions: { type: Object, required: false },
+    pendingClass: { type: String, required: false },
+    showBlockStatus: { type: Boolean, required: false }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const incremarkOptions = computed15(() => ({
+      gfm: true,
+      htmlTree: true,
+      containers: true,
+      math: true,
+      ...props.incremarkOptions
+    }));
+    const { blocks, append, finalize, render: render23, reset, isDisplayComplete, markdown } = useIncremark(incremarkOptions);
+    const isStreamMode = computed15(() => typeof props.stream === "function");
+    async function handleStreamInput() {
+      if (!props.stream) return;
+      try {
+        const stream = props.stream();
+        for await (const chunk of stream) {
+          append(chunk);
+        }
+        finalize();
+      } catch (error) {
+        console.error("Stream error: ", error);
+        finalize();
+      }
+    }
+    function handleContentInput(newContent, oldContent) {
+      if (!newContent) {
+        if (oldContent) {
+          reset();
+        }
+        return;
+      }
+      if (newContent?.startsWith(oldContent ?? "")) {
+        const delta = newContent.slice((oldContent || "").length);
+        append(delta);
+      } else {
+        render23(newContent);
+      }
+    }
+    watch7(() => props.content, async (newContent, oldContent) => {
+      if (isStreamMode.value) {
+        await handleStreamInput();
+        return;
+      } else {
+        handleContentInput(newContent, oldContent);
+      }
+    }, { immediate: true });
+    watch7(() => props.isFinished, (newIsFinished) => {
+      if (newIsFinished && props.content === markdown.value) {
+        finalize();
+      }
+    }, { immediate: true });
+    const __returned__ = { props, incremarkOptions, blocks, append, finalize, render: render23, reset, isDisplayComplete, markdown, isStreamMode, handleStreamInput, handleContentInput, Incremark: Incremark_default2 };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/IncremarkContent.vue?type=template
+import { openBlock as _openBlock19, createBlock as _createBlock10 } from "vue";
+function render19(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock19(), _createBlock10($setup["Incremark"], {
+    blocks: $setup.blocks,
+    "pending-class": $props.pendingClass,
+    "is-display-complete": $setup.isDisplayComplete,
+    "show-block-status": $props.showBlockStatus,
+    components: $props.components,
+    "custom-containers": $props.customContainers,
+    "custom-code-blocks": $props.customCodeBlocks,
+    "code-block-configs": $props.codeBlockConfigs
+  }, null, 8, ["blocks", "pending-class", "is-display-complete", "show-block-status", "components", "custom-containers", "custom-code-blocks", "code-block-configs"]);
+}
+
+// src/components/IncremarkContent.vue
+IncremarkContent_default.render = render19;
+IncremarkContent_default.__file = "src/components/IncremarkContent.vue";
+var IncremarkContent_default2 = IncremarkContent_default;
+
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/AutoScrollContainer.vue?type=script
-import { defineComponent as _defineComponent16 } from "vue";
-import { ref as ref8, onMounted as onMounted2, onUnmounted as onUnmounted6, nextTick } from "vue";
-var AutoScrollContainer_default = /* @__PURE__ */ _defineComponent16({
+import { defineComponent as _defineComponent20 } from "vue";
+import { ref as ref8, onMounted as onMounted2, onUnmounted as onUnmounted7, nextTick } from "vue";
+var AutoScrollContainer_default = /* @__PURE__ */ _defineComponent20({
   __name: "AutoScrollContainer",
   props: {
     enabled: { type: Boolean, required: false, default: true },
@@ -2440,7 +2854,7 @@ var AutoScrollContainer_default = /* @__PURE__ */ _defineComponent16({
         characterData: true
       });
     });
-    onUnmounted6(() => {
+    onUnmounted7(() => {
       observer?.disconnect();
     });
     __expose({
@@ -2470,9 +2884,9 @@ var AutoScrollContainer_default = /* @__PURE__ */ _defineComponent16({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/AutoScrollContainer.vue?type=template
-import { renderSlot as _renderSlot, openBlock as _openBlock16, createElementBlock as _createElementBlock15 } from "vue";
-function render16(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock16(), _createElementBlock15(
+import { renderSlot as _renderSlot, openBlock as _openBlock20, createElementBlock as _createElementBlock18 } from "vue";
+function render20(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock20(), _createElementBlock18(
     "div",
     {
       ref: "containerRef",
@@ -2488,15 +2902,16 @@ function render16(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/components/AutoScrollContainer.vue
-AutoScrollContainer_default.render = render16;
+AutoScrollContainer_default.render = render20;
 AutoScrollContainer_default.__file = "src/components/AutoScrollContainer.vue";
 var AutoScrollContainer_default2 = AutoScrollContainer_default;
 
 // sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/ThemeProvider.vue?type=script
-import { defineComponent as _defineComponent17 } from "vue";
-import { ref as ref9, watch as watch6 } from "vue";
+import { defineComponent as _defineComponent21 } from "vue";
+import { ref as ref9, watch as watch9 } from "vue";
 import { applyTheme } from "@incremark/theme";
-var ThemeProvider_default = /* @__PURE__ */ _defineComponent17({
+import { isServer } from "@incremark/shared";
+var ThemeProvider_default = /* @__PURE__ */ _defineComponent21({
   __name: "ThemeProvider",
   props: {
     theme: { type: null, required: true },
@@ -2506,9 +2921,10 @@ var ThemeProvider_default = /* @__PURE__ */ _defineComponent17({
     __expose();
     const props = __props;
     const containerRef = ref9();
-    watch6(
+    watch9(
       () => props.theme,
       (theme) => {
+        if (isServer()) return;
         if (containerRef.value) {
           applyTheme(containerRef.value, theme);
         }
@@ -2522,13 +2938,13 @@ var ThemeProvider_default = /* @__PURE__ */ _defineComponent17({
 });
 
 // sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/ThemeProvider.vue?type=template
-import { renderSlot as _renderSlot2, normalizeClass as _normalizeClass5, openBlock as _openBlock17, createElementBlock as _createElementBlock16 } from "vue";
-function render17(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock17(), _createElementBlock16(
+import { renderSlot as _renderSlot2, normalizeClass as _normalizeClass7, openBlock as _openBlock21, createElementBlock as _createElementBlock19 } from "vue";
+function render21(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock21(), _createElementBlock19(
     "div",
     {
       ref: "containerRef",
-      class: _normalizeClass5([$setup.props.class, "incremark-theme-provider"])
+      class: _normalizeClass7([$setup.props.class, "incremark-theme-provider"])
     },
     [
       _renderSlot2(_ctx.$slots, "default")
@@ -2539,10 +2955,49 @@ function render17(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 // src/ThemeProvider.vue
-ThemeProvider_default.render = render17;
+ThemeProvider_default.render = render21;
 ThemeProvider_default.__file = "src/ThemeProvider.vue";
 var ThemeProvider_default2 = ThemeProvider_default;
 
+// sfc-script:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/ConfigProvider.vue?type=script
+import { defineComponent as _defineComponent22 } from "vue";
+import { provide as provide2, ref as ref10, watch as watch10 } from "vue";
+var ConfigProvider_default = /* @__PURE__ */ _defineComponent22({
+  __name: "ConfigProvider",
+  props: {
+    locale: { type: null, required: false, default: () => enShared }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const localeRef = ref10(props.locale);
+    provide2(LOCALE_KEY, localeRef);
+    watch10(
+      () => props.locale,
+      (newLocale) => {
+        if (newLocale) {
+          localeRef.value = newLocale;
+        }
+      },
+      { deep: true }
+    );
+    const __returned__ = { props, localeRef };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+// sfc-template:/Users/yishuai/develop/ai/markdown/packages/vue/src/components/ConfigProvider.vue?type=template
+import { renderSlot as _renderSlot3 } from "vue";
+function render22(_ctx, _cache, $props, $setup, $data, $options) {
+  return _renderSlot3(_ctx.$slots, "default");
+}
+
+// src/components/ConfigProvider.vue
+ConfigProvider_default.render = render22;
+ConfigProvider_default.__file = "src/components/ConfigProvider.vue";
+var ConfigProvider_default2 = ConfigProvider_default;
+
 // src/index.ts
 import {
   BlockTransformer as BlockTransformer2,
@@ -2566,12 +3021,15 @@ import {
   mergeTheme,
   applyTheme as applyTheme2
 } from "@incremark/theme";
+import { en as enShared, zhCN as zhCNShared } from "@incremark/shared";
 export {
   AutoScrollContainer_default2 as AutoScrollContainer,
   BlockTransformer2 as BlockTransformer,
+  ConfigProvider_default2 as ConfigProvider,
   Incremark_default2 as Incremark,
   IncremarkBlockquote_default2 as IncremarkBlockquote,
   IncremarkCode_default2 as IncremarkCode,
+  IncremarkContent_default2 as IncremarkContent,
   IncremarkDefault_default2 as IncremarkDefault,
   IncremarkFootnotes_default2 as IncremarkFootnotes,
   IncremarkHeading_default2 as IncremarkHeading,
@@ -2594,6 +3052,7 @@ export {
   darkTheme,
   defaultPlugins2 as defaultPlugins,
   defaultTheme,
+  enShared as en,
   generateCSSVars,
   imagePlugin,
   mathPlugin,
@@ -2605,8 +3064,10 @@ export {
   useDefinationsContext,
   useDevTools,
   useIncremark,
+  useLocale,
   useProvideDefinations,
-  useStreamRenderer
+  useStreamRenderer,
+  zhCNShared as zhCN
 };
 /**
  * @file Cursor Utils - 光标工具函数