mirror of
https://gitee.com/mateos/mateclaw.git
synced 2026-09-13 19:23:42 +08:00
- add useStreamingMarkdown: cap mid-stream markdown re-render to ~140ms, full-fidelity render once the segment completes - skip code-block language auto-detection while streaming (escaped plain text), restore full highlighting on the final render - defer echarts/mermaid blocks to a lightweight loading placeholder while streaming so their parsers never run on truncated source - bypass the render cache for streaming-mode output - wire into ContentSegment and MessageBubble (content + thinking)
37 lines
913 B
Vue
37 lines
913 B
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { useStreamingMarkdown } from '@/composables/useStreamingMarkdown'
|
|
import TypingCursor from './TypingCursor.vue'
|
|
import type { MessageSegment } from '@/types'
|
|
|
|
const props = withDefaults(defineProps<{
|
|
segment: MessageSegment
|
|
showCursor?: boolean
|
|
}>(), {
|
|
showCursor: false,
|
|
})
|
|
|
|
const isRunning = computed(() => props.segment.status === 'running')
|
|
|
|
// Throttle markdown rendering while the segment streams; render once at full
|
|
// fidelity the moment it completes.
|
|
const { html: renderedContent } = useStreamingMarkdown(
|
|
() => props.segment.text || '',
|
|
() => isRunning.value,
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<div class="seg-content">
|
|
<div class="markdown-body" v-html="renderedContent"></div>
|
|
<TypingCursor v-if="isRunning && showCursor" />
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.seg-content {
|
|
padding: 4px 0;
|
|
margin-top: 4px;
|
|
}
|
|
</style>
|