@incremark/svelte 0.2.3 → 0.2.5

package/dist/components/AutoScrollContainer.svelte

@@ -5,11 +5,12 @@
 
 <script lang="ts">
   import { onMount, onDestroy } from 'svelte'
+  import type { HTMLAttributes } from 'svelte/elements';
 
   /**
    * 组件 Props
    */
-  interface Props {
+  interface Props extends HTMLAttributes<HTMLDivElement>{
     /** 是否启用自动滚动 */
     enabled?: boolean
     /** 触发自动滚动的底部阈值（像素） */

package/dist/components/AutoScrollContainer.svelte.d.ts

@@ -1,7 +1,8 @@
+import type { HTMLAttributes } from 'svelte/elements';
 /**
  * 组件 Props
  */
-interface Props {
+interface Props extends HTMLAttributes<HTMLDivElement> {
     /** 是否启用自动滚动 */
     enabled?: boolean;
     /** 触发自动滚动的底部阈值（像素） */

package/dist/components/AutoScrollContainer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutoScrollContainer.svelte.d.ts","sourceRoot":"","sources":["../../src/components/AutoScrollContainer.svelte.ts"],"names":[],"mappings":"AAME;;GAEG;AACH,UAAU,KAAK;IACb,eAAe;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW;IACX,QAAQ,CAAC,EAAE,cAAc,CAAA;IACzB,UAAU;IACV,QAAQ,CAAC,EAAE,OAAO,QAAQ,EAAE,OAAO,CAAA;CACpC;AAmJH,QAAA,MAAM,mBAAmB,2CAAwC,CAAC;AAClE,KAAK,mBAAmB,GAAG,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAClE,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"AutoScrollContainer.svelte.d.ts","sourceRoot":"","sources":["../../src/components/AutoScrollContainer.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD;;GAEG;AACH,UAAU,KAAM,SAAQ,cAAc,CAAC,cAAc,CAAC;IACpD,eAAe;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW;IACX,QAAQ,CAAC,EAAE,cAAc,CAAA;IACzB,UAAU;IACV,QAAQ,CAAC,EAAE,OAAO,QAAQ,EAAE,OAAO,CAAA;CACpC;AAoJH,QAAA,MAAM,mBAAmB,2CAAwC,CAAC;AAClE,KAAK,mBAAmB,GAAG,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAClE,eAAe,mBAAmB,CAAC"}

package/dist/components/Incremark.svelte

@@ -4,8 +4,9 @@
 -->
 
 <script lang="ts">
+  import type { Component } from 'svelte'
   import type { Readable } from 'svelte/store'
-  import type { ParsedBlock, RootContent } from '@incremark/core'
+  import type { RootContent } from '@incremark/core'
   import type { HTML } from 'mdast'
   
   import { getDefinitionsContext } from '../context/definitionsContext'
@@ -24,6 +25,7 @@
   import IncremarkHtmlElement from './IncremarkHtmlElement.svelte'
   import IncremarkDefault from './IncremarkDefault.svelte'
   import IncremarkFootnotes from './IncremarkFootnotes.svelte'
+  import IncremarkRenderer from './IncremarkRenderer.svelte'
 
   /**
    * 检查是否是 html 节点
@@ -40,6 +42,10 @@
     blocks?: BlockWithStableId[] | Readable<BlockWithStableId[]>
     /** 自定义组件映射，key 为节点类型 */
     components?: ComponentMap
+    /** 自定义容器组件映射，key 为容器名称（如 'warning', 'info'） */
+    customContainers?: Record<string, Component<any>>
+    /** 自定义代码块组件映射，key 为代码语言名称（如 'echart', 'mermaid'） */
+    customCodeBlocks?: Record<string, Component<any>>
     /** 待处理块的样式类名 */
     pendingClass?: string
     /** 已完成块的样式类名 */
@@ -53,28 +59,21 @@
   let {
     blocks = [],
     components = {},
+    customContainers = {},
+    customCodeBlocks = {},
     pendingClass = 'incremark-pending',
     completedClass = 'incremark-completed',
     showBlockStatus = false,
     incremark
   }: Props = $props()
 
-  // 从 context 获取 footnoteReferenceOrder（如果有的话）
-  // 使用 $derived 来确保响应式
-  const footnoteReferenceOrder = $derived.by(() => {
-    try {
-      const context = getDefinitionsContext()
-      return context.footnoteReferenceOrder
-    } catch {
-      // 如果没有 context，返回 null
-      return null
-    }
-  })
+  const context = getDefinitionsContext();
+  const footnoteReferenceOrder = $derived(context?.footnoteReferenceOrder ?? []);
 
-  // 计算 isFinalized（当不使用 incremark 时）
-  const actualIsFinalized = $derived.by(() => {
+  // 计算 isDisplayComplete（当不使用 incremark 时）
+  const actualIsDisplayComplete = $derived.by(() => {
     if (incremark) {
-      // 如果提供了 incremark，在模板中直接使用 $incremark.isFinalized
+      // 如果提供了 incremark，在模板中直接使用 $incremark.isDisplayComplete
       return false
     }
     // 如果手动传入 blocks，自动判断是否所有 block 都是 completed
@@ -102,13 +101,6 @@
     ...components
   })
 
-  /**
-   * 获取组件
-   */
-  function getComponent(type: string): any {
-    return mergedComponents[type] || components?.default || IncremarkDefault
-  }
-
   // 处理 blocks（可能是 store 或数组）
   const blocksArray = $derived.by(() => {
     if (incremark) {
@@ -120,7 +112,7 @@
 
   // 提取 incremark 的 stores（如果存在）
   const incremarkBlocks = $derived.by(() => incremark?.blocks)
-  const incremarkIsFinalized = $derived.by(() => incremark?.isFinalized)
+  const incremarkIsDisplayComplete = $derived.by(() => incremark?.isDisplayComplete)
 </script>
 
 <div class="incremark">
@@ -132,16 +124,13 @@
         <div
           class="incremark-block {block.status === 'completed' ? completedClass : pendingClass} {showBlockStatus ? 'incremark-show-status' : ''} {(block as BlockWithStableId).isLastPending ? 'incremark-last-pending' : ''}"
         >
-          <!-- HTML 节点：渲染为代码块显示源代码 -->
-          {#if isHtmlNode(block.node)}
-            <pre class="incremark-html-code"><code>{block.node.value}</code></pre>
-          {:else}
-            <!-- 其他节点：使用对应组件 -->
-            {@const Component = getComponent(block.node.type)}
-            {#if Component}
-              <Component node={block.node} />
-            {/if}
-          {/if}
+          <!-- 使用 IncremarkRenderer，传递 customContainers 和 customCodeBlocks -->
+          <IncremarkRenderer 
+            node={block.node} 
+            customContainers={customContainers}
+            customCodeBlocks={customCodeBlocks}
+            blockStatus={block.status}
+          />
         </div>
       {/if}
     {/each}
@@ -152,28 +141,25 @@
         <div
           class="incremark-block {block.status === 'completed' ? completedClass : pendingClass} {showBlockStatus ? 'incremark-show-status' : ''} {block.isLastPending ? 'incremark-last-pending' : ''}"
         >
-          <!-- HTML 节点：渲染为代码块显示源代码 -->
-          {#if isHtmlNode(block.node)}
-            <pre class="incremark-html-code"><code>{block.node.value}</code></pre>
-          {:else}
-            <!-- 其他节点：使用对应组件 -->
-            {@const Component = getComponent(block.node.type)}
-            {#if Component}
-              <Component node={block.node} />
-            {/if}
-          {/if}
+          <!-- 使用 IncremarkRenderer，传递 customContainers 和 customCodeBlocks -->
+          <IncremarkRenderer 
+            node={block.node} 
+            customContainers={customContainers}
+            customCodeBlocks={customCodeBlocks}
+            blockStatus={block.status}
+          />
         </div>
       {/if}
     {/each}
   {/if}
 
-  <!-- 脚注列表（仅在 finalize 后显示） -->
-  {#if incremark && incremarkIsFinalized && footnoteReferenceOrder && $incremarkIsFinalized}
+  <!-- 脚注列表（仅在内容完全显示后显示） -->
+  {#if incremark && incremarkIsDisplayComplete && footnoteReferenceOrder && $incremarkIsDisplayComplete}
     {@const footnoteOrder = $footnoteReferenceOrder ?? []}
     {#if footnoteOrder.length > 0}
       <IncremarkFootnotes />
     {/if}
-  {:else if !incremark && actualIsFinalized && footnoteReferenceOrder}
+  {:else if !incremark && actualIsDisplayComplete && footnoteReferenceOrder}
     {@const footnoteOrder = $footnoteReferenceOrder ?? []}
     {#if footnoteOrder.length > 0}
       <IncremarkFootnotes />

package/dist/components/Incremark.svelte.d.ts

@@ -1,3 +1,4 @@
+import type { Component } from 'svelte';
 import type { Readable } from 'svelte/store';
 import type { UseIncremarkReturn } from '../stores/useIncremark';
 import type { ComponentMap, BlockWithStableId } from './types';
@@ -9,6 +10,10 @@ interface Props {
     blocks?: BlockWithStableId[] | Readable<BlockWithStableId[]>;
     /** 自定义组件映射，key 为节点类型 */
     components?: ComponentMap;
+    /** 自定义容器组件映射，key 为容器名称（如 'warning', 'info'） */
+    customContainers?: Record<string, Component<any>>;
+    /** 自定义代码块组件映射，key 为代码语言名称（如 'echart', 'mermaid'） */
+    customCodeBlocks?: Record<string, Component<any>>;
     /** 待处理块的样式类名 */
     pendingClass?: string;
     /** 已完成块的样式类名 */
@@ -18,7 +23,7 @@ interface Props {
     /** 可选：useIncremark 返回的对象（用于自动注入数据） */
     incremark?: UseIncremarkReturn;
 }
-declare const Incremark: import("svelte").Component<Props, {}, "">;
+declare const Incremark: Component<Props, {}, "">;
 type Incremark = ReturnType<typeof Incremark>;
 export default Incremark;
 //# sourceMappingURL=Incremark.svelte.d.ts.map

package/dist/components/Incremark.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Incremark.svelte.d.ts","sourceRoot":"","sources":["../../src/components/Incremark.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAK5C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAChE,OAAO,KAAK,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAe5D;;GAEG;AACH,UAAU,KAAK;IACb,wCAAwC;IACxC,MAAM,CAAC,EAAE,iBAAiB,EAAE,GAAG,QAAQ,CAAC,iBAAiB,EAAE,CAAC,CAAA;IAC5D,wBAAwB;IACxB,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB,gBAAgB;IAChB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gBAAgB;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,gBAAgB;IAChB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,sCAAsC;IACtC,SAAS,CAAC,EAAE,kBAAkB,CAAA;CAC/B;AAmKH,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"Incremark.svelte.d.ts","sourceRoot":"","sources":["../../src/components/Incremark.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AACvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAK5C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAChE,OAAO,KAAK,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAgB5D;;GAEG;AACH,UAAU,KAAK;IACb,wCAAwC;IACxC,MAAM,CAAC,EAAE,iBAAiB,EAAE,GAAG,QAAQ,CAAC,iBAAiB,EAAE,CAAC,CAAA;IAC5D,wBAAwB;IACxB,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC,CAAA;IACjD,oDAAoD;IACpD,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC,CAAA;IACjD,gBAAgB;IAChB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gBAAgB;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,gBAAgB;IAChB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,sCAAsC;IACtC,SAAS,CAAC,EAAE,kBAAkB,CAAA;CAC/B;AAuIH,QAAA,MAAM,SAAS,0BAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/components/IncremarkCode.svelte

@@ -19,13 +19,19 @@
     disableHighlight?: boolean
     /** Mermaid 渲染延迟（毫秒），用于流式输入时防抖 */
     mermaidDelay?: number
+    /** 自定义代码块组件映射，key 为代码语言名称 */
+    customCodeBlocks?: Record<string, any>
+    /** 块状态，用于判断是否使用自定义组件 */
+    blockStatus?: 'pending' | 'stable' | 'completed'
   }
 
   let {
     node,
     theme = 'github-dark',
     disableHighlight = false,
-    mermaidDelay = 500
+    mermaidDelay = 500,
+    customCodeBlocks,
+    blockStatus = 'completed'
   }: Props = $props()
 
   // 状态
@@ -55,6 +61,18 @@
   const code = $derived(node.value)
   const isMermaid = $derived(language === 'mermaid')
 
+  // 检查是否有自定义代码块组件
+  const CustomCodeBlock = $derived.by(() => {
+    // 如果代码块还在 pending 状态，不使用自定义组件
+    if (blockStatus === 'pending') {
+      return null
+    }
+    return customCodeBlocks?.[language] || null
+  })
+
+  // 是否使用自定义组件
+  const useCustomComponent = $derived(!!CustomCodeBlock)
+
   /**
    * 切换 Mermaid 视图模式
    */
@@ -210,8 +228,15 @@
   })
 </script>
 
+<!-- 自定义代码块组件 -->
+{#if useCustomComponent && CustomCodeBlock}
+  <svelte:component 
+    this={CustomCodeBlock} 
+    codeStr={code} 
+    lang={language}
+  />
 <!-- Mermaid 图表 -->
-{#if isMermaid}
+{:else if isMermaid}
   <div class="incremark-mermaid">
     <div class="mermaid-header">
       <span class="language">MERMAID</span>

package/dist/components/IncremarkCode.svelte.d.ts

@@ -11,6 +11,10 @@ interface Props {
     disableHighlight?: boolean;
     /** Mermaid 渲染延迟（毫秒），用于流式输入时防抖 */
     mermaidDelay?: number;
+    /** 自定义代码块组件映射，key 为代码语言名称 */
+    customCodeBlocks?: Record<string, any>;
+    /** 块状态，用于判断是否使用自定义组件 */
+    blockStatus?: 'pending' | 'stable' | 'completed';
 }
 declare const IncremarkCode: import("svelte").Component<Props, {}, "">;
 type IncremarkCode = ReturnType<typeof IncremarkCode>;

package/dist/components/IncremarkCode.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IncremarkCode.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkCode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAI/B;;GAEG;AACH,UAAU,KAAK;IACb,WAAW;IACX,IAAI,EAAE,IAAI,CAAA;IACV,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,eAAe;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAkQH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"IncremarkCode.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkCode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAI/B;;GAEG;AACH,UAAU,KAAK;IACb,WAAW;IACX,IAAI,EAAE,IAAI,CAAA;IACV,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,eAAe;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6BAA6B;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACtC,wBAAwB;IACxB,WAAW,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,WAAW,CAAA;CACjD;AAmRH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/IncremarkContainer.svelte

@@ -0,0 +1,83 @@
+<!--
+  @file IncremarkContainer.svelte - 容器组件
+  @description 用于渲染自定义容器节点
+-->
+
+<script lang="ts">
+  import type { RootContent } from 'mdast'
+  import IncremarkRenderer from './IncremarkRenderer.svelte'
+
+  /**
+   * 容器节点类型定义
+   * 根据 directive 解析后的结构
+   */
+  export interface ContainerNode {
+    type: 'containerDirective' | 'leafDirective' | 'textDirective'
+    name: string
+    attributes?: Record<string, string>
+    children?: RootContent[]
+  }
+
+  /**
+   * 组件 Props
+   */
+  interface Props {
+    node: ContainerNode
+    customContainers?: Record<string, any>
+  }
+
+  let { node, customContainers = {} }: Props = $props()
+
+  /**
+   * 解析 attributes 字符串为对象
+   * directive 的 attributes 可能是字符串格式，需要解析
+   */
+  function parseOptions(attributes?: Record<string, string>): Record<string, any> {
+    if (!attributes) return {}
+    
+    const options: Record<string, any> = {}
+    for (const [key, value] of Object.entries(attributes)) {
+      // 尝试解析 JSON 值
+      try {
+        options[key] = JSON.parse(value)
+      } catch {
+        // 如果不是 JSON，直接使用字符串值
+        options[key] = value
+      }
+    }
+    return options
+  }
+
+  const containerName = $derived(node.name)
+  const options = $derived(parseOptions(node.attributes))
+  const CustomContainer = $derived(customContainers?.[containerName])
+
+  // 如果没有自定义容器组件，使用默认渲染
+  const hasCustomContainer = $derived(!!CustomContainer)
+</script>
+
+{#if hasCustomContainer && CustomContainer}
+  <!-- 如果有自定义容器组件，使用自定义组件 -->
+  <CustomContainer
+    name={containerName}
+    options={options}
+  >
+    {#if node.children && node.children.length > 0}
+      {#each node.children as child, index (index)}
+        <IncremarkRenderer node={child} />
+      {/each}
+    {/if}
+  </CustomContainer>
+{:else}
+  <!-- 如果没有自定义容器组件，使用默认渲染 -->
+  <div class="incremark-container incremark-container-{containerName}">
+    {#if node.children && node.children.length > 0}
+      <div class="incremark-container-content">
+        {#each node.children as child, index (index)}
+          <IncremarkRenderer node={child} />
+        {/each}
+      </div>
+    {/if}
+  </div>
+{/if}
+

package/dist/components/IncremarkContainer.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { RootContent } from 'mdast';
+/**
+ * 容器节点类型定义
+ * 根据 directive 解析后的结构
+ */
+export interface ContainerNode {
+    type: 'containerDirective' | 'leafDirective' | 'textDirective';
+    name: string;
+    attributes?: Record<string, string>;
+    children?: RootContent[];
+}
+/**
+ * 组件 Props
+ */
+interface Props {
+    node: ContainerNode;
+    customContainers?: Record<string, any>;
+}
+declare const IncremarkContainer: import("svelte").Component<Props, {}, "">;
+type IncremarkContainer = ReturnType<typeof IncremarkContainer>;
+export default IncremarkContainer;
+//# sourceMappingURL=IncremarkContainer.svelte.d.ts.map

package/dist/components/IncremarkContainer.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IncremarkContainer.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkContainer.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAItC;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,oBAAoB,GAAG,eAAe,GAAG,eAAe,CAAA;IAC9D,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;CACzB;AAED;;GAEG;AACH,UAAU,KAAK;IACb,IAAI,EAAE,aAAa,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACvC;AAgEH,QAAA,MAAM,kBAAkB,2CAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}

package/dist/components/IncremarkFootnotes.svelte

@@ -9,19 +9,10 @@
   import { getDefinitionsContext } from '../context/definitionsContext'
   import IncremarkRenderer from './IncremarkRenderer.svelte'
 
-  // 从 context 获取数据
-  let definations: Readable<Record<string, any>> | null = null
-  let footnoteDefinitions: Readable<Record<string, FootnoteDefinition>> | null = null
-  let footnoteReferenceOrder: Readable<string[]> | null = null
 
-  try {
-    const context = getDefinitionsContext()
-    definations = context.definations
-    footnoteDefinitions = context.footnoteDefinitions
-    footnoteReferenceOrder = context.footnoteReferenceOrder
-  } catch {
-    // Context 不存在
-  }
+  const context = getDefinitionsContext()
+  const footnoteDefinitions = $derived(context?.footnoteDefinitions ?? {});
+  const footnoteReferenceOrder = $derived(context?.footnoteReferenceOrder ?? []);
 
   /**
    * 按引用顺序排列的脚注列表

package/dist/components/IncremarkFootnotes.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IncremarkFootnotes.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkFootnotes.svelte.ts"],"names":[],"mappings":"AAqFA,QAAA,MAAM,kBAAkB,2DAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"IncremarkFootnotes.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkFootnotes.svelte.ts"],"names":[],"mappings":"AA4EA,QAAA,MAAM,kBAAkB,2DAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}

package/dist/components/IncremarkInline.svelte

@@ -4,7 +4,6 @@
 -->
 
 <script lang="ts">
-  import type { Readable } from 'svelte/store'
   import type { PhrasingContent, ImageReference, LinkReference } from 'mdast'
   import type { TextChunk } from '@incremark/core'
   import {
@@ -72,25 +71,9 @@
 
   // 获取 definitions context（可能不存在）
   // 使用 $derived 来确保响应式
-  const definations = $derived.by(() => {
-    try {
-      const context = getDefinitionsContext()
-      return context.definations
-    } catch {
-      // Context 不存在，返回 null
-      return null
-    }
-  })
-  
-  const footnoteDefinitions = $derived.by(() => {
-    try {
-      const context = getDefinitionsContext()
-      return context.footnoteDefinitions
-    } catch {
-      // Context 不存在，返回 null
-      return null
-    }
-  })
+  const context = getDefinitionsContext()
+  const definations = $derived(context?.definations ?? {});
+
 
   /**
    * 获取节点的 chunks（类型安全）
@@ -173,7 +156,7 @@
 
   <!-- 引用式图片（imageReference） -->
   {#if isImageReference(node)}
-    {#if definations && $definations[node.identifier]}
+    {#if $definations && $definations[node.identifier]}
       <img
         class="incremark-image incremark-reference-image"
         src={$definations[node.identifier].url}
@@ -191,7 +174,7 @@
 
   <!-- 引用式链接（linkReference） -->
   {#if isLinkReference(node)}
-    {#if definations && $definations[node.identifier]}
+    {#if $definations && $definations[node.identifier]}
       <a
         class="incremark-link incremark-reference-link"
         href={$definations[node.identifier].url}

package/dist/components/IncremarkInline.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IncremarkInline.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkInline.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAiC,MAAM,OAAO,CAAA;AAW3E,OAAO,eAAe,MAAM,0BAA0B,CAAC;AAGrD;;GAEG;AACH,UAAU,KAAK;IACb,aAAa;IACb,KAAK,EAAE,eAAe,EAAE,CAAA;CACzB;AAyMH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"IncremarkInline.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkInline.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAiC,MAAM,OAAO,CAAA;AAW3E,OAAO,eAAe,MAAM,0BAA0B,CAAC;AAGrD;;GAEG;AACH,UAAU,KAAK;IACb,aAAa;IACb,KAAK,EAAE,eAAe,EAAE,CAAA;CACzB;AAwLH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/components/IncremarkList.svelte

@@ -1,11 +1,12 @@
 <!--
   @file IncremarkList.svelte - 列表组件
-  @description 渲染 Markdown 列表（有序列表和无序列表），支持任务列表
+  @description 渲染 Markdown 列表（有序列表和无序列表），支持任务列表和嵌套列表
 -->
 
 <script lang="ts">
-  import type { List, ListItem, PhrasingContent } from 'mdast'
+  import type { List, ListItem, PhrasingContent, BlockContent } from 'mdast'
   import IncremarkInline from './IncremarkInline.svelte'
+  import IncremarkList from './IncremarkList.svelte';
 
   /**
    * 组件 Props
@@ -30,12 +31,12 @@
   )
 
   /**
-   * 获取列表项内容
-   * 
+   * 获取列表项的内联内容（来自第一个 paragraph）
+   *
    * @param item - 列表项节点
    * @returns 行内内容数组
    */
-  function getItemContent(item: ListItem): PhrasingContent[] {
+  function getItemInlineContent(item: ListItem): PhrasingContent[] {
     const firstChild = item.children[0]
     if (firstChild?.type === 'paragraph') {
       return firstChild.children as PhrasingContent[]
@@ -43,9 +44,26 @@
     return []
   }
 
+  /**
+   * 获取列表项的块级子节点（嵌套列表、代码块等）
+   * 排除第一个 paragraph，因为它已经被 getItemInlineContent 处理
+   *
+   * @param item - 列表项节点
+   * @returns 块级子节点数组
+   */
+  function getItemBlockChildren(item: ListItem): BlockContent[] {
+    return item.children.filter((child, index) => {
+      // 第一个 paragraph 已经被处理为内联内容
+      if (index === 0 && child.type === 'paragraph') {
+        return false
+      }
+      return true
+    }) as BlockContent[]
+  }
+
   /**
    * 判断列表项是否是任务项
-   * 
+   *
    * @param item - 列表项节点
    * @returns 是否是任务项
    */
@@ -54,30 +72,37 @@
   }
 </script>
 
-<svelte:element 
-  this={tag} 
+<svelte:element
+  this={tag}
   class="incremark-list"
   class:task-list={isTaskList}
 >
   {#each node.children as item, index (index)}
-    <li 
+    <li
       class="incremark-list-item"
       class:task-item={isTaskItem(item)}
     >
       {#if isTaskItem(item)}
         <label class="task-label">
-          <input 
-            type="checkbox" 
-            checked={item.checked} 
-            disabled 
+          <input
+            type="checkbox"
+            checked={item.checked}
+            disabled
             class="checkbox"
           />
           <span class="task-content">
-            <IncremarkInline nodes={getItemContent(item)} />
+            <IncremarkInline nodes={getItemInlineContent(item)} />
           </span>
         </label>
       {:else}
-        <IncremarkInline nodes={getItemContent(item)} />
+        <IncremarkInline nodes={getItemInlineContent(item)} />
+        <!-- 递归渲染嵌套列表和其他块级内容 -->
+        {#each getItemBlockChildren(item) as child, childIndex (childIndex)}
+          {#if child.type === 'list'}
+            <IncremarkList node={child} />
+          {/if}
+          <!-- 其他块级内容可以在这里扩展 -->
+        {/each}
       {/if}
     </li>
   {/each}

package/dist/components/IncremarkList.svelte.d.ts

@@ -1,4 +1,5 @@
 import type { List } from 'mdast';
+import IncremarkList from './IncremarkList.svelte';
 /**
  * 组件 Props
  */

package/dist/components/IncremarkList.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IncremarkList.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkList.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAA6B,MAAM,OAAO,CAAA;AAI1D;;GAEG;AACH,UAAU,KAAK;IACb,WAAW;IACX,IAAI,EAAE,IAAI,CAAA;CACX;AAmEH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"IncremarkList.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkList.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAA2C,MAAM,OAAO,CAAA;AAE1E,OAAO,aAAa,MAAM,wBAAwB,CAAC;AAGjD;;GAEG;AACH,UAAU,KAAK;IACb,WAAW;IACX,IAAI,EAAE,IAAI,CAAA;CACX;AA4FH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/IncremarkRenderer.svelte

@@ -15,16 +15,25 @@
   import IncremarkMath from './IncremarkMath.svelte'
   import IncremarkHtmlElement from './IncremarkHtmlElement.svelte'
   import IncremarkDefault from './IncremarkDefault.svelte'
+  import IncremarkContainer, { type ContainerNode } from './IncremarkContainer.svelte'
 
   /**
    * 组件 Props
    */
   interface Props {
     /** 要渲染的节点 */
-    node: RootContent
+    node: RootContent | ContainerNode
+    customContainers?: Record<string, any>
+    customCodeBlocks?: Record<string, any>
+    blockStatus?: 'pending' | 'stable' | 'completed'
   }
 
-  let { node }: Props = $props()
+  let { 
+    node, 
+    customContainers,
+    customCodeBlocks,
+    blockStatus
+  }: Props = $props()
 
   /**
    * 组件映射
@@ -52,14 +61,39 @@
   /**
    * 检查是否是 html 节点
    */
-  function isHtmlNode(node: RootContent): node is HTML {
+  function isHtmlNode(node: RootContent | ContainerNode): node is HTML {
     return node.type === 'html'
   }
+
+  /**
+   * 检查是否是容器节点
+   */
+  function isContainerNode(node: RootContent | ContainerNode): node is ContainerNode {
+    return (node as any).type === 'containerDirective' || 
+           (node as any).type === 'leafDirective' || 
+           (node as any).type === 'textDirective'
+  }
 </script>
 
 <!-- HTML 节点：渲染为代码块显示源代码 -->
 {#if isHtmlNode(node)}
   <pre class="incremark-html-code"><code>{node.value}</code></pre>
+<!-- 容器节点：使用容器组件，传递 customContainers -->
+{:else if isContainerNode(node)}
+  <IncremarkContainer 
+    node={node} 
+    customContainers={customContainers}
+  />
+<!-- 代码节点：特殊处理，传递 customCodeBlocks 和 blockStatus -->
+{:else if node.type === 'code'}
+  {@const Component = getComponent('code')}
+  {#if Component}
+    <Component 
+      node={node} 
+      customCodeBlocks={customCodeBlocks}
+      blockStatus={blockStatus}
+    />
+  {/if}
 {:else}
   <!-- 其他节点：使用对应组件 -->
   {@const Component = getComponent(node.type)}

package/dist/components/IncremarkRenderer.svelte.d.ts

@@ -1,10 +1,14 @@
 import type { RootContent } from 'mdast';
+import { type ContainerNode } from './IncremarkContainer.svelte';
 /**
  * 组件 Props
  */
 interface Props {
     /** 要渲染的节点 */
-    node: RootContent;
+    node: RootContent | ContainerNode;
+    customContainers?: Record<string, any>;
+    customCodeBlocks?: Record<string, any>;
+    blockStatus?: 'pending' | 'stable' | 'completed';
 }
 declare const IncremarkRenderer: import("svelte").Component<Props, {}, "">;
 type IncremarkRenderer = ReturnType<typeof IncremarkRenderer>;

package/dist/components/IncremarkRenderer.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IncremarkRenderer.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkRenderer.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAQ,MAAM,OAAO,CAAA;AAa5C;;GAEG;AACH,UAAU,KAAK;IACb,aAAa;IACb,IAAI,EAAE,WAAW,CAAA;CAClB;AAgEH,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"IncremarkRenderer.svelte.d.ts","sourceRoot":"","sources":["../../src/components/IncremarkRenderer.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAQ,MAAM,OAAO,CAAA;AAW9C,OAA2B,EAAE,KAAK,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAGnF;;GAEG;AACH,UAAU,KAAK;IACb,aAAa;IACb,IAAI,EAAE,WAAW,GAAG,aAAa,CAAA;IACjC,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACtC,WAAW,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,WAAW,CAAA;CACjD;AAwFH,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/stores/useIncremark.d.ts

@@ -73,6 +73,13 @@ export interface UseIncremarkReturn {
     isLoading: Writable<boolean>;
     /** 是否已完成（finalize） */
     isFinalized: Writable<boolean>;
+    /**
+     * 内容是否完全显示完成
+     * - 无打字机：等于 isFinalized
+     * - 有打字机：isFinalized + 动画播放完成
+     * 适用于控制 footnote 等需要在内容完全显示后才出现的元素
+     */
+    isDisplayComplete: Readable<boolean>;
     /** 脚注引用的出现顺序 */
     footnoteReferenceOrder: Writable<string[]>;
     /** 追加内容 */

package/dist/stores/useIncremark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useIncremark.d.ts","sourceRoot":"","sources":["../../src/stores/useIncremark.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"useIncremark.d.ts","sourceRoot":"","sources":["../../src/stores/useIncremark.ts"],"names":[],"mappings":"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"}

package/dist/stores/useIncremark.js

@@ -61,11 +61,15 @@ export function useIncremark(options = {}) {
     const isFinalized = writable(false);
     const footnoteReferenceOrder = writable([]);
     // 使用 useTypewriter store 管理打字机效果
-    const { blocks, typewriter, transformer } = useTypewriter({
+    const { blocks, typewriter, transformer, isAnimationComplete } = useTypewriter({
         typewriter: options.typewriter,
         completedBlocks,
         pendingBlocks
     });
+    // 内容是否完全显示完成
+    // 如果没有启用打字机：解析完成即显示完成
+    // 如果启用打字机：解析完成 + 动画完成
+    const isDisplayComplete = derived([isFinalized, isAnimationComplete], ([$isFinalized, $isAnimationComplete]) => $isFinalized && $isAnimationComplete);
     // AST
     const ast = derived([completedBlocks, pendingBlocks], ([$completedBlocks, $pendingBlocks]) => ({
         type: 'root',
@@ -165,6 +169,7 @@ export function useIncremark(options = {}) {
         blocks,
         isLoading,
         isFinalized,
+        isDisplayComplete,
         footnoteReferenceOrder,
         append,
         finalize,

package/dist/stores/useTypewriter.d.ts

@@ -28,6 +28,8 @@ export interface UseTypewriterReturn {
     typewriter: TypewriterControls;
     /** transformer 实例 */
     transformer: BlockTransformer<RootContent> | null;
+    /** 所有动画是否已完成（队列为空且没有正在处理的 block） */
+    isAnimationComplete: Readable<boolean>;
 }
 /**
  * useTypewriter Store

package/dist/stores/useTypewriter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTypewriter.d.ts","sourceRoot":"","sources":["../../src/stores/useTypewriter.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAqB,KAAK,QAAQ,EAAE,KAAK,QAAQ,EAAE,MAAM,cAAc,CAAA;AAC9E,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,WAAW,EAGhB,KAAK,gBAAgB,EACtB,MAAM,iBAAiB,CAAA;AACxB,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAG3E;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,YAAY;IACZ,UAAU,CAAC,EAAE,iBAAiB,CAAA;IAC9B,oBAAoB;IACpB,eAAe,EAAE,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAA;IACxC,oBAAoB;IACpB,aAAa,EAAE,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAA;CACvC;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,qCAAqC;IACrC,MAAM,EAAE,QAAQ,CAAC,KAAK,CAAC,WAAW,GAAG;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAA;IAC3D,cAAc;IACd,UAAU,EAAE,kBAAkB,CAAA;IAC9B,qBAAqB;IACrB,WAAW,EAAE,gBAAgB,CAAC,WAAW,CAAC,GAAG,IAAI,CAAA;CAClD;AAED;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,oBAAoB,GAAG,mBAAmB,CAkKhF"}
+{"version":3,"file":"useTypewriter.d.ts","sourceRoot":"","sources":["../../src/stores/useTypewriter.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAqB,KAAK,QAAQ,EAAE,KAAK,QAAQ,EAAE,MAAM,cAAc,CAAA;AAC9E,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,WAAW,EAGhB,KAAK,gBAAgB,EACtB,MAAM,iBAAiB,CAAA;AACxB,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAG3E;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,YAAY;IACZ,UAAU,CAAC,EAAE,iBAAiB,CAAA;IAC9B,oBAAoB;IACpB,eAAe,EAAE,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAA;IACxC,oBAAoB;IACpB,aAAa,EAAE,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAA;CACvC;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,qCAAqC;IACrC,MAAM,EAAE,QAAQ,CAAC,KAAK,CAAC,WAAW,GAAG;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAA;IAC3D,cAAc;IACd,UAAU,EAAE,kBAAkB,CAAA;IAC9B,qBAAqB;IACrB,WAAW,EAAE,gBAAgB,CAAC,WAAW,CAAC,GAAG,IAAI,CAAA;IACjD,oCAAoC;IACpC,mBAAmB,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAA;CACvC;AAED;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,oBAAoB,GAAG,mBAAmB,CA4KhF"}

package/dist/stores/useTypewriter.js

@@ -23,6 +23,7 @@ export function useTypewriter(options) {
     const isTypewriterPaused = writable(false);
     const typewriterEffect = writable(typewriterConfig?.effect ?? 'none');
     const typewriterCursor = writable(typewriterConfig?.cursor ?? '|');
+    const isAnimationComplete = writable(true); // 初始为 true（没有动画时视为完成）
     // 创建 transformer（如果有 typewriter 配置）
     let transformer = null;
     if (typewriterConfig) {
@@ -37,6 +38,14 @@ export function useTypewriter(options) {
                 displayBlocks.set(blocks);
                 isTypewriterProcessing.set(transformer?.isProcessing() ?? false);
                 isTypewriterPaused.set(transformer?.isPausedState() ?? false);
+                // 有 blocks 正在处理时，动画未完成
+                if (transformer?.isProcessing()) {
+                    isAnimationComplete.set(false);
+                }
+            },
+            onAllComplete: () => {
+                // 所有动画完成
+                isAnimationComplete.set(true);
             }
         });
     }
@@ -148,6 +157,7 @@ export function useTypewriter(options) {
     return {
         blocks,
         typewriter: typewriterControls,
-        transformer
+        transformer,
+        isAnimationComplete: derived(isAnimationComplete, ($v) => $v)
     };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@incremark/svelte",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "description": "Incremark Svelte 5 集成",
   "type": "module",
   "svelte": "./dist/index.js",
@@ -24,10 +24,10 @@
   ],
   "dependencies": {
     "shiki": "^3.20.0",
-    "@incremark/core": "0.2.3",
-    "@incremark/theme": "0.2.3",
-    "@incremark/shared": "0.2.3",
-    "@incremark/devtools": "0.2.3"
+    "@incremark/core": "0.2.5",
+    "@incremark/devtools": "0.2.5",
+    "@incremark/shared": "0.2.5",
+    "@incremark/theme": "0.2.5"
   },
   "peerDependencies": {
     "svelte": "^5.0.0",