@incremark/core 0.3.2 → 0.3.4

package/README.en.md

@@ -129,11 +129,76 @@ Get completed blocks.
 
 Get current buffer content.
 
-## BlockTransformer
+## Framework Integration
+
+For daily use, it's recommended to use the framework packages which have built-in incremental parsing and typewriter effect support:
+
+```vue
+<!-- Vue -->
+<script setup>
+import { ref } from 'vue'
+import { IncremarkContent } from '@incremark/vue'
+
+const content = ref('')
+const isFinished = ref(false)
+
+async function simulateStream() {
+  content.value = ''
+  isFinished.value = false
+
+  const text = '# Hello\n\nThis is **Incremark**!'
+  for (const chunk of text.match(/[\s\S]{1,5}/g) || []) {
+    content.value += chunk  // Incremental append
+    await new Promise(r => setTimeout(r, 50))
+  }
+  isFinished.value = true
+}
+</script>
+
+<template>
+  <IncremarkContent
+    :content="content"
+    :is-finished="isFinished"
+    :incremark-options="{ typewriter: { enabled: true } }"
+  />
+</template>
+```
+
+```tsx
+// React
+import { useState } from 'react'
+import { IncremarkContent } from '@incremark/react'
+
+function App() {
+  const [content, setContent] = useState('')
+  const [isFinished, setIsFinished] = useState(false)
+
+  async function simulateStream() {
+    setContent('')
+    setIsFinished(false)
+
+    const text = '# Hello\n\nThis is **Incremark**!'
+    const chunks = text.match(/[\s\S]{1,5}/g) || []
+    for (const chunk of chunks) {
+      setContent(prev => prev + chunk)  // Incremental append
+      await new Promise(r => setTimeout(r, 50))
+    }
+    setIsFinished(true)
+  }
+
+  return (
+    <IncremarkContent
+      content={content}
+      isFinished={isFinished}
+      incremarkOptions={{ typewriter: { enabled: true } } }
+    />
+  )
+}
+```
 
-Typewriter effect controller, serves as middleware between parser and renderer.
+## Advanced: BlockTransformer
 
-### Basic Usage
+`BlockTransformer` is the typewriter effect controller, serving as middleware between parser and renderer. Only use this when you need custom rendering logic.
 
 ```ts
 import { createBlockTransformer, defaultPlugins } from '@incremark/core'

package/README.md

@@ -87,11 +87,76 @@ console.log(update.completed) // 已完成的块
 
 获取完整 AST。
 
-## BlockTransformer
+## 与框架集成
+
+对于日常使用，建议直接使用框架集成包，它们已内置增量解析和打字机效果支持：
+
+```vue
+<!-- Vue -->
+<script setup>
+import { ref } from 'vue'
+import { IncremarkContent } from '@incremark/vue'
 
-打字机效果控制器，作为解析器和渲染器之间的中间层。
+const content = ref('')
+const isFinished = ref(false)
 
-### 基本用法
+async function simulateStream() {
+  content.value = ''
+  isFinished.value = false
+
+  const text = '# Hello\n\nThis is **Incremark**!'
+  for (const chunk of text.match(/[\s\S]{1,5}/g) || []) {
+    content.value += chunk  // 增量追加
+    await new Promise(r => setTimeout(r, 50))
+  }
+  isFinished.value = true
+}
+</script>
+
+<template>
+  <IncremarkContent
+    :content="content"
+    :is-finished="isFinished"
+    :incremark-options="{ typewriter: { enabled: true } }"
+  />
+</template>
+```
+
+```tsx
+// React
+import { useState } from 'react'
+import { IncremarkContent } from '@incremark/react'
+
+function App() {
+  const [content, setContent] = useState('')
+  const [isFinished, setIsFinished] = useState(false)
+
+  async function simulateStream() {
+    setContent('')
+    setIsFinished(false)
+
+    const text = '# Hello\n\nThis is **Incremark**!'
+    const chunks = text.match(/[\s\S]{1,5}/g) || []
+    for (const chunk of chunks) {
+      setContent(prev => prev + chunk)  // 增量追加
+      await new Promise(r => setTimeout(r, 50))
+    }
+    setIsFinished(true)
+  }
+
+  return (
+    <IncremarkContent
+      content={content}
+      isFinished={isFinished}
+      incremarkOptions={{ typewriter: { enabled: true } } }
+    />
+  )
+}
+```
+
+## 高级用法：BlockTransformer
+
+`BlockTransformer` 是打字机效果控制器，作为解析器和渲染器之间的中间层。仅在需要自定义渲染逻辑时使用。
 
 ```ts
 import { createBlockTransformer, defaultPlugins } from '@incremark/core'
@@ -181,11 +246,6 @@ interface DisplayBlock {
 }
 ```
 
-## 与框架集成
-
-- Vue: [@incremark/vue](../vue)
-- React: [@incremark/react](../react)
-
 ## License
 
 MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@incremark/core",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "High-performance incremental markdown parser specifically designed for AI streaming output scenarios.",
   "type": "module",
   "main": "./dist/index.js",