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

说明

面向 AI 场景“代码块展示”的组件，内置一个轻量、纯托管的分词器（不依赖 highlight.js / prism 等第三方 JS，也不做任何 JS 互操作），按关键字 / 字符串 / 注释 / 数字四类着色，其余按纯文本安全渲染。Code 为源码文本、Language 为语言标识（如 csharp / cs / c#、js / javascript、ts / typescript、java、py / python、go、sql、json、sh / bash，含常见别名），未识别的语言退化为“仅字符串着色”，不会误染也不会抛错。Filename（头部左侧标题）与 Language 标签、代码内容一律视为业务数据、不本地化。ShowLanguage（默认 true）在头部显示语言徽标，LineNumbers（默认 true）显示行号槽，Wrap（默认 false）在软换行与横向滚动间切换，MaxHeight（如 “320px”）限制代码区高度并内部滚动。头部右侧的复制按钮由 Copyable（默认 true）控制、文案 CopyText（默认“复制”、作为翻译键），点击仅触发 OnCopy——组件保持无 JS，真正的 navigator.clipboard 写入由宿主在回调里完成。Visible / Class / Style / UserAttributes 沿用 BaseComponent。配色通过 CSS 自定义变量接入框架明暗主题（暗色下自动切浅色系），等宽字体走 --font-mono 令牌；常与 Bubble / Think 组合，把模型返回的代码片段以可读、可复制的形式呈现。

常见能力：

内置纯托管分词器：关键字 / 字符串 / 注释 / 数字着色，无第三方 JS、无 JS 互操作
覆盖 C# / JS / TS / Java / Python / Go / SQL / JSON / Shell，含常见别名；未识别语言安全退化为仅字符串着色
头部栏：语言徽标 ShowLanguage + 文件名 Filename + 复制按钮 Copyable
LineNumbers 行号、Wrap 软换行 / 横向滚动、MaxHeight 限高内部滚动
无 JS：复制按钮仅触发 OnCopy，navigator.clipboard 写入由宿主完成
配色走 CSS 变量随框架明暗主题切换，等宽字体用 --font-mono 令牌
代码 / 语言 / 文件名视为业务数据不本地化，仅“复制”按钮文案走词条

用法

<CodeHighlighter Code="@cs" Language="csharp" Filename="OrderService.cs"
                 MaxHeight="320px" OnCopy="@(() => CopyAsync(cs))" />

<CodeHighlighter Code="@sql" Language="sql" LineNumbers="false" Wrap="true" />

@code {
    string cs = "public class Foo { void Bar() { /* … */ } }";
    string sql = "SELECT id, name FROM t WHERE status = 'active';";
    async Task CopyAsync(string code) => await JS.InvokeVoidAsync("navigator.clipboard.writeText", code);
}

API 参数

参数	类型	默认值	说明
`Code`	`string`	`null`	源码文本（业务数据、不本地化）。
`Copyable`	`bool`	`true`	是否显示复制按钮。默认 true。
`CopyText`	`string`	`"复制"`	复制按钮文案（作为翻译键）。默认“复制”。
`Filename`	`string`	`null`	头部左侧文件名 / 标题（业务数据、不本地化）。留空则不显示。
`Language`	`string`	`null`	语言标识（如 csharp / js / python / sql，不本地化）。未知语言时退化为仅字符串着色。
`LineNumbers`	`bool`	`true`	是否显示行号。默认 true。
`MaxHeight`	`string`	`null`	代码区最大高度（如 “320px”），超出内部滚动。留空则不限高。
`OnCopy`	`EventCallback`	—	事件点击复制的回调。组件保持无 JS，实际写入剪贴板由宿主完成。
`ShowLanguage`	`bool`	`true`	是否在头部显示语言标签。默认 true。
`Visible`	`bool`	`true`	取得或设置组件是否可见，默认为false。
`VisibleChanged`	`EventCallback<bool>`	—	事件取得或设置组件可见性变化时的回调事件。
`Wrap`	`bool`	`false`	是否软换行（否则横向滚动）。默认 false。
`Class`	`string`	`null`	取得或设置组件的CSS类名，用于自定义样式。
`Disabled`	`bool`	`false`	取得或设置组件是否禁用，默认为false。
`Style`	`string`	`null`	取得或设置组件的内联样式，用于自定义样式。

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