@incremark/vue 0.2.2 → 0.2.3

package/src/composables/useTypewriter.ts

@@ -1,205 +0,0 @@
-/**
- * @file useTypewriter Composable - 打字机效果管理
- *
- * @description
- * 管理打字机效果的状态和控制逻辑，从 useIncremark 中拆分出来以简化代码。
- *
- * @author Incremark Team
- * @license MIT
- */
-
-import { ref, shallowRef, computed, watch, onUnmounted, type Ref, type ComputedRef } from 'vue'
-import {
-  createBlockTransformer,
-  defaultPlugins,
-  type RootContent,
-  type ParsedBlock,
-  type DisplayBlock,
-  type AnimationEffect,
-  type BlockTransformer
-} from '@incremark/core'
-import type { TypewriterOptions, TypewriterControls } from './useIncremark'
-import { addCursorToNode } from '../utils/cursor'
-
-export interface UseTypewriterOptions {
-  typewriter?: TypewriterOptions
-  completedBlocks: Ref<ParsedBlock[]>
-  pendingBlocks: Ref<ParsedBlock[]>
-}
-
-export interface UseTypewriterReturn {
-  /** 用于渲染的 blocks（经过打字机处理或原始blocks） */
-  blocks: ComputedRef<Array<ParsedBlock & { stableId: string }>>
-  /** 打字机控制对象 */
-  typewriter: TypewriterControls
-  /** transformer 实例 */
-  transformer: BlockTransformer<RootContent> | null
-}
-
-/**
- * useTypewriter Composable
- *
- * @description
- * 管理打字机效果的所有状态和逻辑。
- *
- * @param options - 打字机配置和数据
- * @returns 打字机状态和控制对象
- */
-export function useTypewriter(options: UseTypewriterOptions): UseTypewriterReturn {
-  const { typewriter: typewriterConfig, completedBlocks, pendingBlocks } = options
-
-  // 打字机状态
-  const typewriterEnabled = ref(typewriterConfig?.enabled ?? !!typewriterConfig)
-  const displayBlocksRef = shallowRef<DisplayBlock<RootContent>[]>([])
-  const isTypewriterProcessing = ref(false)
-  const isTypewriterPaused = ref(false)
-  const typewriterEffect = ref<AnimationEffect>(typewriterConfig?.effect ?? 'none')
-  const typewriterCursor = ref(typewriterConfig?.cursor ?? '|')
-
-  // 创建 transformer（如果有 typewriter 配置）
-  let transformer: BlockTransformer<RootContent> | null = null
-
-  if (typewriterConfig) {
-    const twOptions = typewriterConfig
-    transformer = createBlockTransformer<RootContent>({
-      charsPerTick: twOptions.charsPerTick ?? [1, 3],
-      tickInterval: twOptions.tickInterval ?? 30,
-      effect: twOptions.effect ?? 'none',
-      pauseOnHidden: twOptions.pauseOnHidden ?? true,
-      plugins: twOptions.plugins ?? defaultPlugins,
-      onChange: (blocks) => {
-        displayBlocksRef.value = blocks as DisplayBlock<RootContent>[]
-        isTypewriterProcessing.value = transformer?.isProcessing() ?? false
-        isTypewriterPaused.value = transformer?.isPausedState() ?? false
-      }
-    })
-  }
-
-  // 将 completedBlocks 转换为 SourceBlock 格式
-  const sourceBlocks = computed(() => {
-    return completedBlocks.value.map(block => ({
-      id: block.id,
-      node: block.node,
-      status: block.status as 'pending' | 'stable' | 'completed'
-    }))
-  })
-
-  // 监听 sourceBlocks 变化，推送给 transformer
-  if (transformer) {
-    watch(
-      sourceBlocks,
-      (blocks) => {
-        transformer!.push(blocks)
-
-        // 更新正在显示的 block
-        const currentDisplaying = displayBlocksRef.value.find((b) => !b.isDisplayComplete)
-        if (currentDisplaying) {
-          const updated = blocks.find((b) => b.id === currentDisplaying.id)
-          if (updated) {
-            transformer!.update(updated)
-          }
-        }
-      },
-      { immediate: true, deep: true }
-    )
-  }
-
-  // 原始 blocks（不经过打字机）
-  const rawBlocks = computed(() => {
-    const result: Array<ParsedBlock & { stableId: string }> = []
-
-    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
-  })
-
-  // 最终用于渲染的 blocks
-  const blocks = computed(() => {
-    // 未启用打字机或没有 transformer：返回原始 blocks
-    if (!typewriterEnabled.value || !transformer) {
-      return rawBlocks.value
-    }
-
-    // 启用打字机：使用 displayBlocks
-    return displayBlocksRef.value.map((db, index) => {
-      const isPending = !db.isDisplayComplete
-      const isLastPending = isPending && index === displayBlocksRef.value.length - 1
-
-      // typing 效果时添加光标
-      let node = db.displayNode
-      if (typewriterEffect.value === 'typing' && isLastPending) {
-        node = addCursorToNode(db.displayNode, typewriterCursor.value)
-      }
-
-      return {
-        id: db.id,
-        stableId: db.id,
-        status: (db.isDisplayComplete ? 'completed' : 'pending') as 'pending' | 'stable' | 'completed',
-        isLastPending,
-        node,
-        startOffset: 0,
-        endOffset: 0,
-        rawText: ''
-      }
-    })
-  })
-
-  // 打字机控制对象
-  const typewriterControls: TypewriterControls = {
-    enabled: computed(() => typewriterEnabled.value),
-    setEnabled: (value: boolean) => {
-      typewriterEnabled.value = value
-    },
-    isProcessing: computed(() => isTypewriterProcessing.value),
-    isPaused: computed(() => isTypewriterPaused.value),
-    effect: computed(() => typewriterEffect.value),
-    skip: () => transformer?.skip(),
-    pause: () => {
-      transformer?.pause()
-      isTypewriterPaused.value = true
-    },
-    resume: () => {
-      transformer?.resume()
-      isTypewriterPaused.value = false
-    },
-    setOptions: (opts) => {
-      if (opts.enabled !== undefined) {
-        typewriterEnabled.value = opts.enabled
-      }
-      if (opts.charsPerTick !== undefined || opts.tickInterval !== undefined || opts.effect !== undefined || opts.pauseOnHidden !== undefined) {
-        transformer?.setOptions({
-          charsPerTick: opts.charsPerTick,
-          tickInterval: opts.tickInterval,
-          effect: opts.effect,
-          pauseOnHidden: opts.pauseOnHidden
-        })
-      }
-      if (opts.effect !== undefined) {
-        typewriterEffect.value = opts.effect
-      }
-      if (opts.cursor !== undefined) {
-        typewriterCursor.value = opts.cursor
-      }
-    }
-  }
-
-  // 清理
-  onUnmounted(() => {
-    transformer?.destroy()
-  })
-
-  return {
-    blocks,
-    typewriter: typewriterControls,
-    transformer
-  }
-}

package/src/index.ts

@@ -1,78 +0,0 @@
-// Composables
-export { useIncremark, useStreamRenderer, useDevTools, useBlockTransformer } from './composables'
-export { useProvideDefinations } from './composables/useProvideDefinations'
-export { useDefinationsContext } from './composables/useDefinationsContext'
-export type {
-  UseIncremarkOptions,
-  TypewriterOptions,
-  TypewriterControls,
-  UseStreamRendererOptions,
-  UseDevToolsOptions,
-  UseBlockTransformerOptions,
-  UseBlockTransformerReturn
-} from './composables'
-
-// Components
-export {
-  Incremark,
-  IncremarkRenderer,
-  IncremarkHeading,
-  IncremarkParagraph,
-  IncremarkCode,
-  IncremarkList,
-  IncremarkTable,
-  IncremarkBlockquote,
-  IncremarkThematicBreak,
-  IncremarkInline,
-  IncremarkMath,
-  IncremarkHtmlElement,
-  IncremarkDefault,
-  IncremarkFootnotes,
-  AutoScrollContainer
-} from './components'
-export type { ComponentMap, BlockWithStableId } from './components'
-export { default as ThemeProvider } from './ThemeProvider.vue'
-
-// Re-export core types
-export type {
-  ParsedBlock,
-  IncrementalUpdate,
-  ParserOptions,
-  BlockStatus,
-  Root,
-  RootContent,
-  // Transformer types
-  SourceBlock,
-  DisplayBlock,
-  TransformerPlugin,
-  TransformerOptions,
-  TransformerState,
-  AnimationEffect
-} from '@incremark/core'
-
-// Re-export transformer utilities and plugins
-export {
-  BlockTransformer,
-  createBlockTransformer,
-  countChars,
-  sliceAst,
-  cloneNode,
-  codeBlockPlugin,
-  mermaidPlugin,
-  imagePlugin,
-  mathPlugin,
-  thematicBreakPlugin,
-  defaultPlugins,
-  allPlugins,
-  createPlugin
-} from '@incremark/core'
-
-// Re-export theme utilities
-export {
-  type DesignTokens,
-  defaultTheme,
-  darkTheme,
-  generateCSSVars,
-  mergeTheme,
-  applyTheme
-} from '@incremark/theme'

package/src/utils/cursor.ts

@@ -1,46 +0,0 @@
-/**
- * @file Cursor Utils - 光标工具函数
- *
- * @description
- * 用于在 AST 节点末尾添加光标的工具函数。
- *
- * @author Incremark Team
- * @license MIT
- */
-
-import type { RootContent } from '@incremark/core'
-
-/**
- * 在节点末尾添加光标
- *
- * @param node - 要添加光标的节点
- * @param cursor - 光标字符
- * @returns 添加了光标的新节点
- */
-export function addCursorToNode(node: RootContent, cursor: string): RootContent {
-  const cloned = JSON.parse(JSON.stringify(node))
-
-  function addToLast(n: { children?: unknown[]; type?: string; value?: string }): boolean {
-    if (n.children && n.children.length > 0) {
-      for (let i = n.children.length - 1; i >= 0; i--) {
-        if (addToLast(n.children[i] as { children?: unknown[]; type?: string; value?: string })) {
-          return true
-        }
-      }
-      n.children.push({ type: 'text', value: cursor })
-      return true
-    }
-    if (n.type === 'text' && typeof n.value === 'string') {
-      n.value += cursor
-      return true
-    }
-    if (typeof n.value === 'string') {
-      n.value += cursor
-      return true
-    }
-    return false
-  }
-
-  addToLast(cloned)
-  return cloned
-}