Skip to content

Commit 150a48f

Browse files
committed
feat(cli): 支持 Markdown 引用块渲染并改进表格显示
- 新增 BlockquoteRenderer 组件,使用 ▎ 竖条和斜体样式渲染引用块 - 在 markdown 解析器和增量处理器中新增对引用块语法的识别与处理 - 重构表格渲染器,采用三层宽度策略(理想/收缩/强制断词)并支持多行单元格换行 - 当终端过窄或行数过多时,表格自动降级为垂直键值对格式以提升可读性 - 移除代码块中对 markdown 语言的递归解析,简化处理逻辑
1 parent ffee334 commit 150a48f

6 files changed

Lines changed: 480 additions & 156 deletions

File tree

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
/**
2+
* Blockquote 渲染器
3+
* 使用 ▎ (U+258E) 竖条 + italic 样式显示引用内容
4+
*/
5+
6+
import { Box, Text } from 'ink';
7+
import React from 'react';
8+
import { useTheme } from '../../store/selectors/index.js';
9+
import { InlineRenderer } from './InlineRenderer.js';
10+
11+
interface BlockquoteRendererProps {
12+
lines: string[];
13+
level: number;
14+
}
15+
16+
const BLOCKQUOTE_BAR = '\u258e'; // ▎ left one-quarter block
17+
18+
export const BlockquoteRenderer: React.FC<BlockquoteRendererProps> = React.memo(
19+
({ lines, level }) => {
20+
const theme = useTheme();
21+
const bar = BLOCKQUOTE_BAR.repeat(level);
22+
23+
return (
24+
<Box flexDirection="column">
25+
{lines.map((line, i) => {
26+
if (line.trim() === '') {
27+
return <Box key={i} height={1} />;
28+
}
29+
return (
30+
<Box key={i} flexDirection="row">
31+
<Text dimColor color={theme.colors.text.muted}>
32+
{bar}{' '}
33+
</Text>
34+
<Text italic wrap="wrap">
35+
<InlineRenderer text={line} />
36+
</Text>
37+
</Box>
38+
);
39+
})}
40+
</Box>
41+
);
42+
}
43+
);

packages/cli/src/ui/components/MessageRenderer.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
} from '../utils/markdownParser.js';
2323
import { CodeHighlighter } from './CodeHighlighter.js';
2424
import { DiffRenderer } from './DiffRenderer.js';
25+
import { BlockquoteRenderer } from './BlockquoteRenderer.js';
2526
import { InlineRenderer } from './InlineRenderer.js';
2627
import { ListItem } from './ListItem.js';
2728
import { TableRenderer } from './TableRenderer.js';
@@ -729,6 +730,11 @@ export const MessageRenderer: React.FC<MessageRendererProps> = React.memo(
729730
/>
730731
) : block.type === 'command-message' ? (
731732
<CommandMessage content={block.content} />
733+
) : block.type === 'blockquote' && block.blockquoteLines ? (
734+
<BlockquoteRenderer
735+
lines={block.blockquoteLines}
736+
level={block.blockquoteLevel || 1}
737+
/>
732738
) : (
733739
<TextBlock content={block.content} />
734740
)}

0 commit comments

Comments
 (0)