thought-chain.md 3.1 KB

ThoughtChain 思维链

思维链组件用于可视化和追踪 Agent 对 Actions 和 Tools 的调用链。

何时使用

  • 调试和跟踪复杂 Agent System 中的调用链
  • 类似的链式场景中使用

代码演示

基本

:::demo 基础用法。

thought-chain/basic

:::

尺寸

:::demo ThoughtChain 有大、中、小三种尺寸。默认尺寸为中 - middle

thought-chain/size

:::

节点状态

:::demo 思维链节点支持配置 status 属性来明显的表明当前节点的执行状态

thought-chain/status

:::

可折叠的

:::demo 配置 collapsible 可开启对思维链节点内容区域的折叠功能

thought-chain/collapsible

:::

客制化

:::demo items 属性支持灵活的客制化配置,详情参考 ThoughtChainItem 定义

thought-chain/customization

:::

嵌套使用

:::demo ThoughtChain 组件支持嵌套使用

thought-chain/nested

:::

API

ThoughtChainProps

属性 说明 类型 默认值 版本
collapsible 是否可折叠 boolean | CollapsibleOptions - -
classNames 语义化结构的类名 Record<'item' | 'itemHeader' | 'itemContent' | 'itemFooter', string> - -
items 思维节点集合 ThoughtChainItem[] - -
prefixCls 自定义前缀 string - -
rootClassName 自定义根类名 string - -
size 尺寸 'large' | 'middle' | 'small' 'middle' -
styles 语义化结构的样式 Record<'item' | 'itemHeader' | 'itemContent' | 'itemFooter', CSSProperties> - -

ThoughtChainItem

属性 说明 类型 默认值 版本
content 思维节点内容 VNode | string - -
description 思维节点描述 VNode | string - -
extra 思维节点额外内容 VNode | string - -
footer 思维节点脚注 VNode | string - -
icon 思维节点图标 VNode - -
key 思维节点唯一标识符 string - -
status 思维节点状态 'pending' | 'success' | 'error' - -
title 思维节点标题 VNode | string - -

CollapsibleOptions

属性 说明 类型 默认值 版本
expandedKeys 当前展开的节点 string[] - -
onExpand 展开节点变化的回调函数 (expandedKeys: string[]) => void - -

Semantic DOM

主题变量(Design Token)