Known · 元数据驱动的 .NET 全栈框架

说明

面向“深度思考 / 思维链”呈现的折叠面板组件，纯展示、不依赖任何浏览器 API。标题区由状态图标（Icon，默认 activity、不本地化）、Title（默认“思考过程”，作为翻译键）、状态与右侧耗时组成：Thinking 为真时图标脉冲并显示“思考中”动点、面板强制展开；转为结束时按 AutoCollapse（默认 true）自动收起一次，Elapsed（业务数据、不本地化，如“3.2s”）显示在标题右侧。Collapsible（默认 true）决定标题可否点击折叠，展开态可经 @bind-Expanded 双向绑定由宿主控制。正文支持 Text（作为翻译键、pre-wrap 渲染）或 ChildContent 富内容（推理步骤列表、代码等）二选一或叠加。展开 / 收起动画用 CSS grid 的 0fr→1fr 过渡实现，无任何 JS 互操作；标题与“思考中”走词条，耗时视为业务数据。所有外观通过 CSS 令牌接入框架明暗主题，常与 Bubble 配合把推理过程与最终回答分层展示。

常见能力：

Thinking 思考中：图标脉冲 + “思考中”动点，自动展开；结束显示 Elapsed 耗时
AutoCollapse 结束后自动收起一次，Collapsible 关闭则正文常显
@bind-Expanded 双向绑定展开态，点标题平滑展开 / 收起
Text（翻译键，pre-wrap）或 ChildContent 富内容（推理步骤 / 列表 / 代码）
展开收起为纯 CSS grid 0fr→1fr 过渡，无 JS 互操作、纯展示
标题 / “思考中”走词条，耗时视为业务数据；明暗主题随 CSS 令牌自动适配

用法

<Think Thinking="@_thinking" Elapsed="@_elapsed" @bind-Expanded="@_open"
      Title="深度思考" AutoCollapse="false">
    <ChildContent>
        <ol>
            @foreach (var s in _steps) { <li>@s</li> }
        </ol>
    </ChildContent>
</Think>

@* 简单用法：一段文本推理 *@
<Think Title="已完成推理" Elapsed="2.4s"
       Text="先拆解需求 → 定位实体 → 生成字段与校验，最后汇总成模型草稿。" />

API 参数

参数	类型	默认值	说明
`AutoCollapse`	`bool`	`true`	思考结束后是否自动收起面板。默认 true（仅在由“思考中”转为结束时生效一次）。
`ChildContent`	`RenderFragment`	`null`	富内容插槽，可放置推理步骤、列表、代码等。
`Collapsible`	`bool`	`true`	是否可折叠（点击标题切换）。默认 true。
`Elapsed`	`string`	`null`	思考耗时文本（来自业务数据、不本地化），如“3.2s”。思考结束后显示在标题右侧。
`Expanded`	`bool`	`true`	展开状态（双向绑定 @bind-Expanded）。初始值在未开始思考时作为默认展开态使用。
`ExpandedChanged`	`EventCallback<bool>`	—	事件
`Icon`	`string`	`"activity"`	状态图标名（Icon Type，不本地化）。
`Text`	`string`	`null`	思考正文文本（作为翻译键）。与 ChildContent 二选一或叠加使用。
`Thinking`	`bool`	`false`	是否处于思考中：为真显示脉冲与“思考中”指示，并强制展开。
`Title`	`string`	`"思考过程"`	面板标题（作为翻译键）。
`Visible`	`bool`	`true`	取得或设置组件是否可见，默认为false。
`VisibleChanged`	`EventCallback<bool>`	—	事件取得或设置组件可见性变化时的回调事件。
`Class`	`string`	`null`	取得或设置组件的CSS类名，用于自定义样式。
`Disabled`	`bool`	`false`	取得或设置组件是否禁用，默认为false。
`Style`	`string`	`null`	取得或设置组件的内联样式，用于自定义样式。

所有组件均继承 BaseComponent，除上表参数外还支持 Class、Style、Disabled、Visible。