@fc-components/monaco-editor

基于 Monaco Editor 的多语言编辑器组件集合，提供开箱即用的语法高亮、代码补全、语法校验等功能。

编辑器列表

| 编辑器 | 说明 | | ------------------------------------------------------------- | ---------------------------------------- | | PromQLMonacoEditor | PromQL 查询编辑器，支持异步指标/标签补全 | | LogQLMonacoEditor | 多厂商日志查询编辑器（SLS/CLS/TLS/LTS/BLS）| | SqlMonacoEditor | SQL 编辑器，支持语法补全与校验 | | ExprMonacoEditor | 表达式编辑器 | | YamlMonacoEditor | YAML 编辑器，支持 Schema 驱动的补全 |

安装

npm install @fc-components/monaco-editor

通用 Props

各编辑器共享以下基础属性：

| 参数 | 类型 | 默认值 | 说明 | | ------------------ | ----------------------------------------- | ----------- | ---------------------- | | size | 'small' \| 'middle' \| 'large' | 'middle' | 编辑器尺寸 | | theme | 'light' \| 'dark' | 'light' | 主题 | | value | string | - | 编辑器内容 | | placeholder | string | - | 占位符文本 | | enableAutocomplete| boolean | true | 启用代码补全 | | readOnly | boolean | false | 只读模式 | | disabled | boolean | false | 禁用编辑 | | onChange | (value: string) => void | - | 内容变化回调 | | onEnter | (value: string) => void | - | Enter 键时触发 | | onBlur | (value: string) => void | - | 编辑器失焦时触发 | | editorDidMount | (editor) => void | - | 编辑器挂载完成后的回调 |

各编辑器特有的 Props 请查看对应子目录的 README。

导出

import { PromQLMonacoEditor, LogQLMonacoEditor, SqlMonacoEditor, ExprMonacoEditor, YamlMonacoEditor } from '@fc-components/monaco-editor';

每个编辑器的详细用法、完整 Props 列表和功能说明，请点击上方表格中的链接查看对应 README。