{"_id":"@blueking/bklog-search-input-bar","_rev":"4-70e20a0a14f7cb7bec91bb1431cee0bf","name":"@blueking/bklog-search-input-bar","dist-tags":{"latest":"0.0.4"},"versions":{"0.0.1":{"name":"@blueking/bklog-search-input-bar","version":"0.0.1","author":{"name":"bkfe"},"license":"MIT","_id":"@blueking/bklog-search-input-bar@0.0.1","maintainers":[{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"}],"dist":{"shasum":"5c493a5f1a2fed28cab15e8af75761edee0dc9f8","tarball":"https://registry.npmjs.org/@blueking/bklog-search-input-bar/-/bklog-search-input-bar-0.0.1.tgz","fileCount":38,"integrity":"sha512-nACSRoe+A9ugPBsDQVFZd0NVMXOiMxmf11ZXaPTHpfrhMDYHltcuSm71emH36WwMeciK5+dlV93rgK3G1I3j+g==","signatures":[{"sig":"MEUCIQCrA2t2mbr3yV+vfhhney+oKUZK6WTMc9iXVufJ8hPdbQIgXX9PiJG6ax6AktON7mG+zZHy1Pka/8MIpewxK3AgYiU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":630101},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./icons.css":"./dist/icons.css","./style.css":"./dist/bklog-search-input-bar.css"},"gitHead":"ec509f7eaac712c7fbd2a90e2eb661d8a7bf28e9","scripts":{"dev":"vite","build":"vite build && tsc -p tsconfig.build.json --emitDeclarationOnly && mkdir -p dist/fonts && cp src/styles/fonts/* dist/fonts/ && cp src/styles/icons.css dist/icons.css","prepublishOnly":"npm run build"},"_npmUser":{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"},"_npmVersion":"10.8.2","description":"Native Web Component search input bar for BKLog","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"20.20.1","dependencies":{"tippy.js":"^6.3.7"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.11","codemirror":"6.0.1","typescript":"~5.4.5","@codemirror/view":"^6.42.1","@codemirror/state":"^6.6.0","@codemirror/lang-sql":"^6.7.1","@codemirror/language":"^6.10.2","@codemirror/autocomplete":"^6.18.6"},"peerDependencies":{"codemirror":"^6.0.0","@codemirror/view":"^6.0.0","@codemirror/state":"^6.0.0","@codemirror/lang-sql":"^6.0.0","@codemirror/language":"^6.0.0","@codemirror/autocomplete":"^6.0.0"},"peerDependenciesMeta":{"codemirror":{"optional":true},"@codemirror/view":{"optional":true},"@codemirror/state":{"optional":true},"@codemirror/lang-sql":{"optional":true},"@codemirror/language":{"optional":true},"@codemirror/autocomplete":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/bklog-search-input-bar_0.0.1_1786678255561_0.4705159718464573","host":"s3://npm-registry-packages-npm-production"}},"0.0.2":{"name":"@blueking/bklog-search-input-bar","version":"0.0.2","author":{"name":"bkfe"},"license":"MIT","_id":"@blueking/bklog-search-input-bar@0.0.2","maintainers":[{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"}],"dist":{"shasum":"2b426576ff6bfefddb3693e83d4e4f83da08b033","tarball":"https://registry.npmjs.org/@blueking/bklog-search-input-bar/-/bklog-search-input-bar-0.0.2.tgz","fileCount":38,"integrity":"sha512-IedBI8M9nm3pGwYnlTOZLPKp6YGBO63vzky1YN0Oio+X53hsSA3T/RwBSEA8TZMtCFBu2qv+ObJtTKmFmmqX9w==","signatures":[{"sig":"MEQCIA/zTEbg2CTkkdZ2QyuN8bNHKHzIRMA05t6nVwgFND7rAiBVRCzHDuvHyRdKwfPTaHyTBFwLwg5iYPaIIMBcsmKh0Q==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":630200},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./icons.css":"./dist/icons.css","./style.css":"./dist/bklog-search-input-bar.css"},"gitHead":"ec509f7eaac712c7fbd2a90e2eb661d8a7bf28e9","scripts":{"dev":"vite","build":"vite build && tsc -p tsconfig.build.json --emitDeclarationOnly && mkdir -p dist/fonts && cp src/styles/fonts/* dist/fonts/ && cp src/styles/icons.css dist/icons.css","prepublishOnly":"npm run build"},"_npmUser":{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"},"_npmVersion":"10.8.2","description":"Native Web Component search input bar for BKLog","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"20.20.1","dependencies":{"tippy.js":"^6.3.7"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.11","codemirror":"6.0.1","typescript":"~5.4.5","@codemirror/view":"^6.42.1","@codemirror/state":"^6.6.0","@codemirror/lang-sql":"^6.7.1","@codemirror/language":"^6.10.2","@codemirror/autocomplete":"^6.18.6"},"peerDependencies":{"codemirror":"^6.0.0","@codemirror/view":"^6.0.0","@codemirror/state":"^6.0.0","@codemirror/lang-sql":"^6.0.0","@codemirror/language":"^6.0.0","@codemirror/autocomplete":"^6.0.0"},"peerDependenciesMeta":{"codemirror":{"optional":true},"@codemirror/view":{"optional":true},"@codemirror/state":{"optional":true},"@codemirror/lang-sql":{"optional":true},"@codemirror/language":{"optional":true},"@codemirror/autocomplete":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/bklog-search-input-bar_0.0.2_1786679263297_0.6761993451330726","host":"s3://npm-registry-packages-npm-production"}},"0.0.3":{"name":"@blueking/bklog-search-input-bar","version":"0.0.3","author":{"name":"bkfe"},"license":"MIT","_id":"@blueking/bklog-search-input-bar@0.0.3","maintainers":[{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"}],"dist":{"shasum":"06580b2e5af53fcf8f9694f5314b60a1d215a626","tarball":"https://registry.npmjs.org/@blueking/bklog-search-input-bar/-/bklog-search-input-bar-0.0.3.tgz","fileCount":39,"integrity":"sha512-V+xTT6Vm6rFjd+KVKSqX33lDZaOnWXCnpQhiNW5SPmZXQSbKS+m3jN7Zi27dhP2Emay5TI+5oYS46/Xy3HSKsA==","signatures":[{"sig":"MEYCIQDPfEjdNDbe2fojvIQU5xqMxO/c30n44lAvjeCjyGMv6QIhANQhfEn6I7Q3WmwpexI9Fm35k3rbA0RrnbuHwfw0rDCN","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":638707},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./icons.css":"./dist/icons.css","./style.css":"./dist/bklog-search-input-bar.css"},"gitHead":"ec509f7eaac712c7fbd2a90e2eb661d8a7bf28e9","scripts":{"dev":"vite","build":"vite build && tsc -p tsconfig.build.json --emitDeclarationOnly && mkdir -p dist/fonts && cp src/styles/fonts/* dist/fonts/ && cp src/styles/icons.css dist/icons.css","prepublishOnly":"npm run build"},"_npmUser":{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"},"_npmVersion":"10.8.2","description":"Native Web Component search input bar for BKLog","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"20.20.1","dependencies":{"tippy.js":"^6.3.7"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.11","codemirror":"6.0.1","typescript":"~5.4.5","@codemirror/view":"^6.42.1","@codemirror/state":"^6.6.0","@codemirror/lang-sql":"^6.7.1","@codemirror/language":"^6.10.2","@codemirror/autocomplete":"^6.18.6"},"peerDependencies":{"codemirror":"^6.0.0","@codemirror/view":"^6.0.0","@codemirror/state":"^6.0.0","@codemirror/lang-sql":"^6.0.0","@codemirror/language":"^6.0.0","@codemirror/autocomplete":"^6.0.0"},"peerDependenciesMeta":{"codemirror":{"optional":true},"@codemirror/view":{"optional":true},"@codemirror/state":{"optional":true},"@codemirror/lang-sql":{"optional":true},"@codemirror/language":{"optional":true},"@codemirror/autocomplete":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/bklog-search-input-bar_0.0.3_1786697423070_0.7916385676529543","host":"s3://npm-registry-packages-npm-production"}},"0.0.4":{"name":"@blueking/bklog-search-input-bar","version":"0.0.4","description":"Native Web Component search input bar for BKLog","author":{"name":"bkfe"},"license":"MIT","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./style.css":"./dist/bklog-search-input-bar.css","./icons.css":"./dist/icons.css"},"sideEffects":["**/*.css"],"publishConfig":{"access":"public"},"scripts":{"dev":"vite","build":"vite build && tsc -p tsconfig.build.json --emitDeclarationOnly && mkdir -p dist/fonts && cp src/styles/fonts/* dist/fonts/ && cp src/styles/icons.css dist/icons.css","prepublishOnly":"npm run build"},"peerDependencies":{"@codemirror/autocomplete":"^6.0.0","@codemirror/lang-sql":"^6.0.0","@codemirror/language":"^6.0.0","@codemirror/state":"^6.0.0","@codemirror/view":"^6.0.0","codemirror":"^6.0.0"},"peerDependenciesMeta":{"codemirror":{"optional":true},"@codemirror/view":{"optional":true},"@codemirror/state":{"optional":true},"@codemirror/language":{"optional":true},"@codemirror/autocomplete":{"optional":true},"@codemirror/lang-sql":{"optional":true}},"dependencies":{"tippy.js":"^6.3.7"},"devDependencies":{"@codemirror/autocomplete":"^6.18.6","@codemirror/lang-sql":"^6.7.1","@codemirror/language":"^6.10.2","@codemirror/state":"^6.6.0","@codemirror/view":"^6.42.1","codemirror":"6.0.1","typescript":"~5.4.5","vite":"^5.4.11"},"engines":{"node":">=18"},"_id":"@blueking/bklog-search-input-bar@0.0.4","gitHead":"7c6c7c459951b912e610ad5200c240b8d5072bea","_nodeVersion":"20.20.1","_npmVersion":"10.8.2","dist":{"integrity":"sha512-SWzpYpT4U76YemTZb1KBMQXCqATqXZBbBBNy5q9zRyen4YHZOmPCjo57zrSU4v4DkINy2bOGWSsDpxkqier/qg==","shasum":"42ea5037bf63e410cc3715a20e87ecc135e7dd17","tarball":"https://registry.npmjs.org/@blueking/bklog-search-input-bar/-/bklog-search-input-bar-0.0.4.tgz","fileCount":39,"unpackedSize":644991,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCycXmMX0RfzUFixloB4UXNi1papN6XceyBiJn0t9pn3AIgLL0Z6tyZs9U2hQjf91Qnro9bUIIhJ5T50lNDZnpgeX0="}]},"_npmUser":{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"},"directories":{},"maintainers":[{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/bklog-search-input-bar_0.0.4_1786957297530_0.9862326316807843"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-14T03:30:55.372Z","modified":"2026-08-17T09:01:37.967Z","0.0.1":"2026-08-14T03:30:55.738Z","0.0.2":"2026-08-14T03:47:43.485Z","0.0.3":"2026-08-14T08:50:23.225Z","0.0.4":"2026-08-17T09:01:37.731Z"},"author":{"name":"bkfe"},"license":"MIT","description":"Native Web Component search input bar for BKLog","maintainers":[{"name":"blueking-magicbox","email":"contactus_bk@tencent.com"}],"readme":"# @blueking/bklog-search-input-bar\n\n日志检索输入条的原生 Web Component。提供 UI / 语句 / AI 三种模式，不依赖 Vue。\n\n## 安装\n\n```bash\nnpm install @blueking/bklog-search-input-bar\n```\n\n语句模式需要 CodeMirror 6，按下面版本安装（与本包开发依赖一致）。仅用 UI / AI 时可跳过。\n\n```bash\nnpm install \\\n codemirror@6.0.1 \\\n @codemirror/state@6.6.0 \\\n @codemirror/view@6.42.1 \\\n @codemirror/language@6.10.2 \\\n @codemirror/autocomplete@6.18.6 \\\n @codemirror/lang-sql@6.7.1\n```\n\n| 包 | 版本 |\n| --- | --- |\n| `codemirror` | `6.0.1` |\n| `@codemirror/state` | `6.6.0` |\n| `@codemirror/view` | `6.42.1` |\n| `@codemirror/language` | `6.10.2` |\n| `@codemirror/autocomplete` | `6.18.6` |\n| `@codemirror/lang-sql` | `6.7.1` |\n\n```ts\nimport '@blueking/bklog-search-input-bar/style.css';\nimport { createSearchInputBar } from '@blueking/bklog-search-input-bar';\n```\n\n## 快速开始\n\n`services` 为必填。其余项均可省略。\n\n```ts\nimport '@blueking/bklog-search-input-bar/style.css';\nimport { createSearchInputBar } from '@blueking/bklog-search-input-bar';\n\nconst host = document.querySelector('#search-bar')!;\n\nconst favorites = document.createElement('div');\nfavorites.dataset.slot = 'tool-favorites';\nfavorites.innerHTML = '';\nhost.append(favorites);\n\nconst bar = createSearchInputBar(host, {\n mode: 'ui',\n platform: 'default',\n enableModes: { ui: true, sql: true, ai: true },\n services: {\n getFields: () => [\n { field_name: 'log', field_alias: '日志', field_type: 'text' },\n ],\n requestFieldValues: async () => ({ aggs_items: [] }),\n convertUiToSql: async () => ({ querystring: '' }),\n requestAiQuery: async (text) => ({\n queryString: `log:\"${text}\"`,\n parseResult: 'SUCCESS',\n }),\n },\n});\n\nbar.on('search', (detail) => {\n console.log(detail.mode, detail.value);\n});\n```\n\nCustom Element：\n\n```html\n\n\n```\n\n插槽节点必须在 `createSearchInputBar` / `connectedCallback` 之前挂到 host 上（`data-slot` 或 `slot` 属性）。组件会把节点投影进内部容器。\n\n### 外观 `platform`\n\n只支持 `default` | `trace`。`default` 使用原日志平台（`log-platform`）边框与圆角；旧值 `log-platform` 会按 `default` 处理。\n\n```ts\n// 日志平台完整（显式打开设置 / 收藏 / AI）\ncreateSearchInputBar(host, {\n platform: 'default',\n mode: 'ui',\n enableModes: { ui: true, sql: true, ai: true },\n showIpSelector: false,\n toolbar: {\n showCopy: true,\n enableDefaultCopy: true,\n showClear: true,\n showSettings: true,\n showFavorites: true,\n showInspect: false,\n showAiMode: true,\n showQueryButton: true,\n },\n services,\n});\n\n// Trace 嵌入\ncreateSearchInputBar(host, {\n platform: 'trace',\n mode: 'sql',\n enableModes: { ui: false, sql: true, ai: false },\n toolbar: {\n showSettings: false,\n showFavorites: false,\n showAiMode: false,\n showInspect: false,\n },\n services,\n});\n```\n\n更多配置可在本地 Demo 中交互调整，并查看 / 复制当前源码。\n\n## 可配置项 `SearchInputBarOptions`\n\n| 字段 | 类型 | 默认 | 说明 |\n| --- | --- | --- | --- |\n| `services` | `SearchInputBarServices` | **必填** | 字段、值联想、UI→SQL、AI 解析等宿主能力 |\n| `mode` | `'ui' \\| 'sql' \\| 'ai'` | `'ui'` | 当前模式。若对应 `enableModes` 为 false，会落到第一个可用模式 |\n| `enableModes` | `{ ui?, sql?, ai? }` | 全部 `true` | 控制左侧 Toggle、Tab 切 AI、AI 药丸是否出现 |\n| `platform` | `'default' \\| 'trace'` | `'default'` | 外观。`default` 为日志平台样式（原 `log-platform`）；`trace` 为 Trace 嵌入 |\n| `className` | `string` | `''` | 追加到最外层 `.bklog-sib-root` 的 class，`setOptions` 可替换；不会覆盖内置 `bklog-sib-root` / `--default` / `--trace` |\n| `uiValue` | `UiQueryItem[]` | `[]` | UI 模式条件列表 |\n| `sqlValue` | `string` | `''` | 语句模式查询串 |\n| `aiFilterList` | `string[]` | `[]` | AI 模式已选条件芯片 |\n| `aiQueryResult` | `AiQueryResult \\| null` | `null` | AI 解析结果，驱动横幅与回填语句 |\n| `isAiLoading` | `boolean` | `false` | AI 解析中：进度条 + 禁用 Tab 切换 |\n| `disabled` | `boolean` | `false` | 禁用输入 |\n| `loading` | `boolean` | `false` | 与 Custom Element 属性同步；检索条内部不另绘遮罩 |\n| `searching` | `boolean` | `false` | 查询中：查询钮切为暂停图标、隐藏「查询」文案 |\n| `queryDisabled` | `boolean` | `false` | 禁用查询钮 |\n| `queryDisabledReason` | `string` | `''` | 查询钮 `title` |\n| `toolbar` | `ToolbarOptions` | 见下表 | 工具栏显隐 |\n| `showIpSelector` | `boolean` | `false` | 为 true 时 UI 字段列表末尾追加「IP目标」；`setOptions` 可按数据源动态开关 |\n| `commonFilter` | `CommonFilterState` | 见下表 | `focused` 控制设置按钮激活态与容器描边；筛选面板由宿主实现 |\n| `sqlMode` | `SqlModeOptions` | 见下表 | 语句模式专属 |\n| `placeholders` | `PlaceholderOptions` | 回落到 `localeTexts` | 分模式占位文案，优先于 `localeTexts` |\n| `localeTexts` | `Record` | 见文案表 | 界面文案 |\n| `indexSetId` | `string \\| number` | `undefined` | 传给 `requestAiQuery` 的上下文 |\n\n运行时更新：\n\n```ts\nbar.setOptions({\n searching: true,\n toolbar: { showCopy: false },\n placeholders: { ui: '请输入关键字' },\n});\n```\n\n`setOptions` 对 `toolbar` / `enableModes` / `sqlMode` / `placeholders` / `commonFilter` 做浅合并，不会丢掉未传入的子字段。`showIpSelector` 为顶层布尔，传入即覆盖。\n\n### `toolbar`\n\n每项工具 = `showXxx` 开关 + 可选具名插槽。`showXxx=false` 不渲染；为 `true` 时有插槽内容则覆盖默认实现。\n\n| 字段 | 默认 | 说明 |\n| --- | --- | --- |\n| `showCopy` | `true` | 复制按钮（插槽 `tool-copy`）。点击发 `copy-click` |\n| `enableDefaultCopy` | `true` | 是否执行内置复制（写剪贴板 + 弹出「复制成功」）。`false` 时点击只抛 `copy-click` |\n| `showClear` | `true` | 清空（插槽 `tool-clear`）。点击发 `clear-click`，随后仍会清空并发 `clear` |\n| `showSettings` | `false` | 常用查询设置（插槽 `tool-query-setting`）。点击发 `setting-click`，不打开内置面板 |\n| `showFavorites` | `false` | 收藏（默认星标，插槽 `tool-favorites` 可覆盖）。点击发 `favorites-click` |\n| `showInspect` | `false` | 语法校验叹号（插槽 `tool-inspect`）。点击发 `inspect-click` |\n| `showAiMode` | `false` | AI 模式入口（插槽 `tool-ai` 仅覆盖样式）。点击发 `ai-click` 并切到 AI 模式 |\n| `showQueryButton` | `true` | 外置「查询」钮。点击发 `query-click`，随后仍会发 `search` / `cancel` |\n\n### `sqlMode`\n\n| 字段 | 默认 | 说明 |\n| --- | --- | --- |\n| `enableFavoriteSuggestions` | `true` | 语句联想面板底部收藏列表 |\n| `sqlSyntaxUrl` | 按 cookie `blueking_language` 解析的正式文档地址 | 「查询语法」外链；传空串仍回落到默认地址 |\n\n### `placeholders`\n\n均会同步回 `localeTexts` 对应 key，供各模式读取。\n\n| 字段 | 对应文案 key | 说明 |\n| --- | --- | --- |\n| `ui` | `uiPlaceholder` | UI 空输入占位（`data-attr-txt`，不是 `input[placeholder]`） |\n| `sql` | `sqlPlaceholderIdle` | 语句模式未聚焦 |\n| `sqlFocus` | `sqlPlaceholderFocus` | 语句模式聚焦 / 键入 |\n| `sqlIdleAi` | `sqlPlaceholderIdleAi` | 未聚焦且启用 AI |\n| `sqlFocusAi` | `sqlPlaceholderFocusAi` | 聚焦且启用 AI；`{shortcut}` 替换为 CMD/Ctrl |\n| `ai` | `aiPlaceholder` | AI textarea placeholder |\n\n### `commonFilter`\n\n| 字段 | 默认 | 说明 |\n| --- | --- | --- |\n| `focused` | `false` | 设置按钮是否激活（`.is-focused`），容器加 `set-border`；不在组件内因点击而切换，由宿主 `setOptions` 更新 |\n| `selectedFields` | `[]` | 保留给宿主；组件不再渲染常驻筛选面板 |\n| `addition` | `[]` | 保留给宿主；组件不再渲染常驻筛选条件 |\n\n### `UiQueryItem`\n\n| 字段 | 说明 |\n| --- | --- |\n| `field` | 字段名；全文检索为 `*` |\n| `operator` | 前端运算符（如 `contains match phrase`、`=`、`exists`） |\n| `value` | 值列表 |\n| `relation` | 多值关系 `AND` / `OR` |\n| `isInclude` | 通配包含方向 |\n| `field_type` | 字段类型 |\n| `hidden_values` | 隐藏值 |\n| `disabled` | 禁用该条件 |\n| `showAll` | 展开全部值 |\n| `isCommonFixed` | 是否来自常驻筛选 |\n| `is_focus_input` | 打开面板时聚焦输入 |\n\n## `services`\n\n| 方法 | 必填 | 说明 |\n| --- | --- | --- |\n| `getFields()` | 是 | 返回 `FieldInfo[]`。决定 UI 字段列表、运算符、全文检索项 |\n| `requestFieldValues({ field, query, size, field_type? })` | 是 | 值联想。包内 300ms 防抖、同参共用进行中请求、同字段只保留最新一次；不做结果缓存。`flattened` / 非 `keyword` 带 query 不发请求 |\n| `convertUiToSql(addition)` | 是 | UI→语句。切模式且 UI 条件非空时调用 |\n| `requestAiQuery(text, ctx)` | AI 需要 | 自然语言解析。未注入时 AI 入口会告警 |\n| `getFieldTypeMap()` | 否 | 字段类型图标色 / 文案 |\n| `getOperatorDictionary()` | 否 | 运算符展示名 |\n| `getFavoriteSqlSuggestions(keyword)` | 否 | 语句收藏联想。点击项发 `favorite-click`，并回写语句检索 |\n\n`requestAiQuery` 的 `ctx`：`{ fieldsJson, indexSetId, keyword }`。\n\n返回 `AiQueryResult`：\n\n| 字段 | 说明 |\n| --- | --- |\n| `parseResult` | `'SUCCESS' \\| 'PARTIAL_SUCCESS' \\| 'FAILED'`。未通过结构校验时宿主应返回 `FAILED`，不要降级展示 |\n| `queryString` | 校验后的查询语句；成功时回填 `sqlValue` |\n| `explain` | 仅作宿主日志 / 横幅字段，UI 不渲染原始模型文本 |\n| `startTime` / `endTime` | 可选时间范围 |\n\n`FieldInfo.field_operator` 控制该字段可用运算符；缺省时组件走内置映射。\n\n## 文案 `localeTexts`\n\n未传入的 key 使用默认中文。\n\n| key | 默认 |\n| --- | --- |\n| `uiMode` | UI 模式 |\n| `sqlMode` | 语句模式 |\n| `aiMode` | AI 模式 |\n| `search` | 查询 |\n| `pause` | 暂停 |\n| `copy` | 复制 |\n| `clear` | 清空 |\n| `favorites` | 收藏 |\n| `inspect` | 语法校验 |\n| `settings` | 常用查询设置 |\n| `settingsTitle` | 设置筛选 |\n| `ipTarget` | IP目标 |\n| `availableList` | 待选列表 |\n| `fixedFilter` | 常驻筛选 |\n| `addAll` | 全部添加 |\n| `clearAll` | 清空 |\n| `confirm` | 确定 |\n| `cancel` | 取消 |\n| `searchKeyword` | 请输入关键字 |\n| `emptySearch` | 搜索为空 |\n| `uiPlaceholder` | / 唤起，输入检索内容（Tab 可切换为 AI 模式） |\n| `sqlPlaceholder` / `sqlPlaceholderIdle` | / 唤起， 输入检索内容 |\n| `sqlPlaceholderIdleAi` | / 唤起， 输入检索内容（Tab 可切换为 AI 模式） |\n| `sqlPlaceholderFocus` | / 唤起， 输入检索内容 |\n| `sqlPlaceholderFocusAi` | 可输入自然语言，{shortcut} + Enter 触发 AI 解析 |\n| `sqlDirectRetrieve` | 直接检索 |\n| `sqlMoveCursor` | 移动光标 |\n| `sqlAiParse` | AI 解析 |\n| `sqlSyntaxLink` | 查询语法 |\n| `sqlLoading` | 加载中... |\n| `sqlFavoriteTitlePrefix` | 联想到以下 |\n| `sqlFavoriteTitleSuffix` | 个收藏 |\n| `sqlFavoriteEmpty` | 暂无匹配的收藏项 |\n| `sqlFavoriteType` | 检索语句 |\n| `aiPlaceholder` | 用自然语言描述你的查询条件，Enter 执行 |\n| `tabToAi` | Tab 切换 AI 模式 |\n| `missingConvert` | 未注入 convertUiToSql，无法完成转换 |\n| `missingAi` | 未注入 requestAiQuery，无法执行 AI 解析 |\n| `convertWarn` | UI 转语句失败，已切换到语句模式 |\n| `copied` | 已复制 |\n| `copySuccess` | 复制成功 |\n\n## 插槽\n\n在 host 上放子节点，用 `data-slot` 或 `slot` 指定名称。投影发生在组件创建时。\n\n| 名称 | 位置 | 说明 |\n| --- | --- | --- |\n| `tool-inspect` | 工具栏 | 覆盖默认语法校验图标；需 `toolbar.showInspect=true` |\n| `tool-copy` | 工具栏 | 覆盖默认复制图标 |\n| `tool-clear` | 工具栏 | 覆盖默认清空图标 |\n| `tool-query-setting` | 工具栏 | 覆盖默认常用查询设置图标 |\n| `tool-favorites` | 工具栏 | 覆盖默认星标；需 `showFavorites=true` |\n| `tool-ai` | 工具栏 | 仅自定义 AI 按钮样式；点击与模式切换仍由组件处理 |\n| `custom-placeholder` | UI / 语句空输入区 | 自定义占位内容，叠在默认 placeholder 上 |\n\n```html\n\n```\n\n空容器（`:empty`）不占位；对应 `showXxx=false` 时整项隐藏。\n\n## 事件\n\n命令式实例用 `bar.on(name, handler)`，返回取消订阅函数。同时也在 host 上 `dispatchEvent(CustomEvent)`，`detail` 为载荷，`bubbles: true`。Custom Element 用 `addEventListener`。\n\n| 事件 | `detail` | 何时触发 |\n| --- | --- | --- |\n| `update:mode` | `SearchMode` | 模式变化 |\n| `update:uiValue` | `UiQueryItem[]` | UI 条件变化 |\n| `update:sqlValue` | `string` | 语句变化（含 AI 回填） |\n| `update:aiFilterList` | `string[]` | AI 芯片变化 |\n| `search` | `{ mode, value }` | 点击查询 / 提交 |\n| `mode-change` | `{ from, to, convertedKeyword? }` | 模式切换；UI→SQL 成功时带转换后的语句 |\n| `clear` | `void` | 清空完成后 |\n| `clear-click` | `{ event }` | 点击清空 |\n| `copy` | `{ text }` | 点击复制时同步抛出（兼容） |\n| `copy-click` | `{ event, text }` | 点击复制。`text` 为当前检索内容；`enableDefaultCopy=true` 时组件会写入剪贴板并弹出「复制成功」 |\n| `cancel` | `void` | 取消（Esc 收起等） |\n| `ip-selector-click` | `{ event }` | 点击「IP目标」字段 / 已有 IP 条件 / 确定；宿主打开 IP 选择器 |\n| `setting-click` | `{ active, event }` | 点击设置。`active` 为当前激活态，组件不自动切换 |\n| `inspect-click` | `{ event }` | 点击语法校验 |\n| `favorites-click` | `{ event }` | 点击工具栏收藏 |\n| `ai-click` | `{ event }` | 点击 AI 模式入口（随后切到 AI） |\n| `query-click` | `{ event, addition, keyword, mode }` | 点击查询 / 暂停。`mode` 为 `ui \\| sql`（AI 按 sql）；`addition` 为当前 UI 条件，`keyword` 为当前语句。随后发 `search` 或 `cancel` |\n| `favorite-click` | `{ event }` | 语句联想面板底部收藏项点击 |\n| `text-to-query` | `{ text, source: 'ui' \\| 'sql' \\| 'ai' }` | 发起 AI 解析前 |\n| `ai-result` | `AiQueryResult` | AI 返回；清空结果时为 `{}` |\n| `height-change` | `number` | 根节点高度变化（含 ResizeObserver） |\n| `popup-change` | `{ isShow }` | UI / 语句联想面板显隐 |\n\n```ts\nconst off = bar.on('search', ({ mode, value }) => {\n if (mode === 'ui') {\n // value: UiQueryItem[]\n } else {\n // value: string\n }\n});\noff();\n```\n\nAI 结果必须先做字段校验再 `emit`：`parseResult === 'SUCCESS'` 且 `queryString` 可用才进入检索；`FAILED` 只展示失败态，不把原始模型输出写进输入框。\n\n## 实例方法\n\n| 方法 | 说明 |\n| --- | --- |\n| `el` | 根节点 `.bklog-sib-root` |\n| `setOptions(patch)` | 合并更新配置 |\n| `setMode(mode)` | 切模式；UI→SQL 且有条件时走 `convertUiToSql` |\n| `setValue({ uiValue?, sqlValue? })` | 写入值并触发对应 `update:*` |\n| `getValue()` | `{ mode, uiValue, sqlValue, aiFilterList }` |\n| `addValue(item)` | UI 模式追加一条条件 |\n| `getRect()` | 根节点 `DOMRect` |\n| `focus()` | 聚焦当前模式输入区 |\n| `destroy()` | 卸载 |\n| `on(type, listener)` | 订阅事件，返回取消函数 |\n\nCustom Element `bklog-search-input-bar` 透传上述方法（除 `el` / `on`：事件走 DOM）。\n\n可观察属性：`mode`、`disabled`、`searching`、`loading`。\n\n## 键盘\n\n| 按键 | 行为 |\n| --- | --- |\n| Tab | 在检索条焦点内、未按修饰键时，UI/SQL ↔ AI。`enableModes.ai === false` 或 `isAiLoading` 时不响应 |\n| Enter / ⌘+Enter | 各模式提交查询（语句 / AI 见面板快捷键提示） |\n| Esc | 收起联想面板 |\n\n## 样式\n\n```ts\nimport '@blueking/bklog-search-input-bar/style.css';\n```\n\n图标字体另可按需（`font-family: bklog-sib`，与主站 `bklog` 隔离）：\n\n```ts\nimport '@blueking/bklog-search-input-bar/icons.css';\n```\n\n插槽或宿主自绘图标用 `bklog-sib-icon` + glyph 类（如 `bklog-star-line`），不要用主站 `bklog-icon`。\n\n高度 token：输入区最小 48px、最大 135px（`INPUT_MIN_HEIGHT` / `INPUT_MAX_HEIGHT`）。\n\n## 导出\n\n常用：`createSearchInputBar`、`createSearchBar`、`registerSearchInputBar`、`BklogSearchInputBarElement`、`TAG_NAME`、`mergeOptions`、运算符转换函数与常量。类型从包入口导出。\n","readmeFilename":"README.md"}