@chenzy-design/svelte 0.3.1 → 0.4.1

package/dist/sidebar/meta.d.ts

@@ -0,0 +1,373 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * SideBar — see specs/components/show/SideBar.spec.md
+ *
+ * 分阶段交付（P0～P5 全部落地）：本 meta 覆盖 P0（SideBarContainer 可伸缩浮层壳）+ P1（SideBar
+ * 主壳 mode 路由 + Options 图标 tab 组）+ P2（Annotation 引用溯源）+ P3（SideBarMcpConfigure MCP
+ * 工具配置）+ P4（SideBarCodeContent 代码/JSON 预览折叠列表）+ P5（SideBarFileContent 富文本查看/
+ * 编辑折叠列表，含 SideBarFileItem tiptap 编辑器 + 内嵌 Upload 的 ImageUploadNode，全程动态 import）。
+ * 全部 subComponents 已补齐（见下 subComponents），无留后项。
+ */
+export declare const meta: {
+    readonly name: "SideBar";
+    readonly category: "ai";
+    readonly stage: "M4";
+    readonly semiEquivalent: "Sidebar";
+    readonly aiScene: true;
+    readonly description: "AI 侧边信息栏套件（重量级组合，分阶段交付）：P0 SideBarContainer 为可伸缩浮层壳——贴视口右侧（RTL 贴左），role=dialog + aria-labelledby(title)，打开移焦 + focus-trap 焦点捕获/归还 + Esc 关闭，堆叠 z-index 与 Modal/SideSheet 统一层栈（后开者在上），resizable 时左边缘（RTL 右边缘）把手拖拽调宽——复用 core createResizeDrag（axis:x 单轴 + clamp minWidth/maxWidth）与 Resizable 同套把手 a11y（role=separator + aria-orientation=vertical + aria-valuenow + 键盘 ←→/Home/End），motion 展开/收起为 CSS transition（reduced-motion / motion=false 退化即时显隐）。P1 SideBar 主壳按 mode 路由：main 渲染顶部 Options 图标 tab 组（role=tablist + roving tabindex + 键盘，name 作无障碍名）+ renderMainContent(activeKey)；detail（code/file/自定义）渲染 renderDetailHeader + 返回按钮（onBackWard 可异步，await 期间禁用防重触发）+ renderDetailContent(mode)。受控 visible / activeKey（不回写，仅回调通知）。P2 SideBarAnnotation 参考来源/引用溯源：外层复用 SideBarContainer 浮层壳（透传全部 Container props，title 默认走 i18n annotationTitle），内部用 Collapse 渲染 info 分组（每组一折叠面板 + aria-expanded），展开区渲染 video（封面/时长/播放态，duration 走 locale 数值格式化为 mm:ss）/text（站点 logo/名称/引用序号）卡片；可点击卡片（url 或 onClick）用原生 button（键盘 Enter/Space + focus 环 + 时长/序号本地化可访问文本），renderItem 可整条覆盖。P4 SideBarCodeContent 代码/JSON 预览：Collapse 折叠列表，每项按 isJson 分流 JsonViewer / CodeHighlight（透传 jsonViewerProps/codeHighlightProps），onExpand 全屏回调。P3 SideBarMcpConfigure MCP 工具配置面板：外层复用 SideBarContainer（title 默认走 i18n mcpTitle），内部顶部已启用计数 + 搜索框（Input，前缀放大镜 + aria-label，headless filterMcpOptions 支持自定义 filter）+ 内置/自定义双列表并列（Semi 为 radio 二选一，本库改并列双列表更直观）；每项前置图标（string→img / Snippet）+ label + desc + 动作按钮（内置 configure 显示配置 / 自定义显示编辑，aria-label 含工具名）+ 启用开关（复用本库 Switch，原生 role=switch + aria-checked，disabled 预设项锁定 + title tooltip），启用变化经 core toggleMcpOptionActive 产出「下一份数组 + custom 标记」上抛 onStatusChange 不回写；自定义组空态显示添加按钮，无搜索结果显示提示。P5 SideBarFileContent 富文本查看/编辑：Collapse 折叠列表，每项 SideBarFileItem 一个 tiptap v3 编辑器（editable 控查看/编辑，编辑态渲染格式工具栏），默认扩展集对齐 Semi（StarterKit link openOnClick:false + TextStyleKit + Image + TextAlign + 自研 SelectionMark + 自研 ImageUploadNode，末尾拼接 extensions），onContentChange 回调 editor.getHTML()；ImageUploadNode 用 svelte-tiptap NodeViewRenderer 内嵌本库 Upload（draggable + getUploadImageSrc）；tiptap 内核 + 3 官方扩展（text-style/image/text-align）+ svelte-tiptap 全程动态 import 不进主 bundle。";
+    readonly exports: readonly ["SideBar", "SideBarContainer", "SideBarAnnotation", "SideBarCodeContent", "SideBarMcpConfigure", "SideBarFileContent", "SideBarFileItem"];
+    readonly a11yPattern: "dialog + tablist";
+    readonly apgRef: "dialog (modal) + tabs";
+    readonly relatedComponents: readonly ["SideSheet", "Resizable", "Nav", "Tabs"];
+    readonly stages: readonly [{
+        readonly phase: "P0";
+        readonly name: "Container";
+        readonly done: true;
+        readonly desc: "可伸缩浮层壳（resizable 复用 Resizable + 动画 + header/close + Esc + a11y）";
+    }, {
+        readonly phase: "P1";
+        readonly name: "主壳 + Options";
+        readonly done: true;
+        readonly desc: "SideBar 主组件 mode 路由（main/detail）+ 顶部 Options 图标 tab 组";
+    }, {
+        readonly phase: "P2";
+        readonly name: "Annotation";
+        readonly done: true;
+        readonly desc: "参考来源/引用溯源折叠列表（video/text 卡片，复用 Collapse）";
+    }, {
+        readonly phase: "P3";
+        readonly name: "MCPConfigure";
+        readonly done: true;
+        readonly desc: "MCP 工具配置面板（内置/自定义双列表 + 搜索 + 启用开关 role=switch，复用 Input/Switch）";
+    }, {
+        readonly phase: "P4";
+        readonly name: "CodeContent";
+        readonly done: true;
+        readonly desc: "代码/JSON 预览折叠列表（复用 CodeHighlight/JsonViewer + Collapse）";
+    }, {
+        readonly phase: "P5";
+        readonly name: "FileContent";
+        readonly done: true;
+        readonly desc: "富文本查看/编辑折叠列表（tiptap v3 + 3 官方扩展 + 自研 ImageUploadNode，全程动态 import）";
+    }];
+    readonly usageHints: "用于 AI 产品右侧信息/配置面板（工具配置、引用溯源、内容预览）。仅需可伸缩浮层用 SideBarContainer；通用抽屉用 SideSheet；侧边导航用 Nav。Container 与主壳分层解耦——SideBarContainer 提供浮层壳，SideBar 提供 mode 路由内容，通常内嵌 <SideBarContainer><SideBar/></SideBarContainer>。";
+    readonly subComponents: readonly [{
+        readonly name: "SideBar";
+        readonly props: readonly [{
+            readonly name: "mode";
+            readonly type: "'main' | 'code' | 'file' | string";
+            readonly default: "'main'";
+            readonly desc: "展示模式，main 主视图，其余详情视图";
+        }, {
+            readonly name: "activeKey";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "主视图激活 option（受控，不回写）";
+        }, {
+            readonly name: "options";
+            readonly type: "SideBarOption[]";
+            readonly default: "[]";
+            readonly desc: "顶部图标 tab 组（{ icon, name, key }）";
+        }, {
+            readonly name: "onActiveOptionChange";
+            readonly type: "(e: Event, key: string) => void";
+            readonly default: "undefined";
+            readonly desc: "option 切换回调";
+        }, {
+            readonly name: "renderMainContent";
+            readonly type: "Snippet<[string | undefined]>";
+            readonly default: "undefined";
+            readonly desc: "主视图内容（按 activeKey 渲染）";
+        }, {
+            readonly name: "renderDetailContent";
+            readonly type: "Snippet<[mode]>";
+            readonly default: "undefined";
+            readonly desc: "详情内容（按 mode 渲染）";
+        }, {
+            readonly name: "renderDetailHeader";
+            readonly type: "Snippet<[mode]>";
+            readonly default: "undefined";
+            readonly desc: "详情头部（返回按钮之后）";
+        }, {
+            readonly name: "onBackWard";
+            readonly type: "(e: Event, mode) => void | Promise<void>";
+            readonly default: "undefined";
+            readonly desc: "详情返回主视图（可异步，await 期间禁用防重触发）";
+        }, {
+            readonly name: "class";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义类名";
+        }, {
+            readonly name: "style";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义内联样式";
+        }];
+    }, {
+        readonly name: "SideBarContainer";
+        readonly props: readonly [{
+            readonly name: "visible";
+            readonly type: "boolean";
+            readonly default: "false";
+            readonly desc: "是否可见（受控，不回写；仅经 onCancel 通知）";
+        }, {
+            readonly name: "title";
+            readonly type: "string | Snippet";
+            readonly default: "undefined";
+            readonly desc: "标题";
+        }, {
+            readonly name: "onCancel";
+            readonly type: "(e: Event) => void";
+            readonly default: "undefined";
+            readonly desc: "关闭回调（Esc / 关闭按钮）";
+        }, {
+            readonly name: "afterVisibleChange";
+            readonly type: "(v: boolean) => void";
+            readonly default: "undefined";
+            readonly desc: "动画结束后（入场或出场）触发";
+        }, {
+            readonly name: "motion";
+            readonly type: "boolean";
+            readonly default: "true";
+            readonly desc: "展开/收起动画；false 等价即时显隐";
+        }, {
+            readonly name: "resizable";
+            readonly type: "boolean";
+            readonly default: "true";
+            readonly desc: "宽度可拖拽（复用 Resizable 把手 + 键盘 a11y）";
+        }, {
+            readonly name: "minWidth";
+            readonly type: "string | number";
+            readonly default: "150";
+            readonly desc: "最小宽度";
+        }, {
+            readonly name: "maxWidth";
+            readonly type: "string | number";
+            readonly default: "undefined";
+            readonly desc: "最大宽度";
+        }, {
+            readonly name: "defaultSize";
+            readonly type: "{ width?; height? }";
+            readonly default: "undefined";
+            readonly desc: "默认尺寸（当前消费 width）";
+        }, {
+            readonly name: "showClose";
+            readonly type: "boolean";
+            readonly default: "true";
+            readonly desc: "显示关闭按钮";
+        }, {
+            readonly name: "renderHeader";
+            readonly type: "Snippet";
+            readonly default: "undefined";
+            readonly desc: "自定义头部（覆盖 title + 关闭按钮）";
+        }, {
+            readonly name: "class";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "面板自定义类名";
+        }, {
+            readonly name: "style";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "面板自定义内联样式";
+        }];
+    }, {
+        readonly name: "SideBarAnnotation";
+        readonly props: readonly [{
+            readonly name: "info";
+            readonly type: "SideBarAnnotationGroup[]";
+            readonly default: "[]";
+            readonly desc: "分组数组（{ header, key, annotations }[]），每组一个折叠面板";
+        }, {
+            readonly name: "activeKey";
+            readonly type: "string | string[]";
+            readonly default: "undefined";
+            readonly desc: "展开的分组 key（受控，不回写；透传 Collapse）";
+        }, {
+            readonly name: "onChange";
+            readonly type: "(keys: string[]) => void";
+            readonly default: "undefined";
+            readonly desc: "展开变更回调（当前展开 key 数组）";
+        }, {
+            readonly name: "onClick";
+            readonly type: "(e: Event, item) => void";
+            readonly default: "undefined";
+            readonly desc: "点击某条引用（url 存在先在新窗口打开来源）";
+        }, {
+            readonly name: "renderItem";
+            readonly type: "Snippet<[SideBarAnnotationItem]>";
+            readonly default: "undefined";
+            readonly desc: "自定义单条渲染（覆盖默认 video/text 卡片）";
+        }, {
+            readonly name: "...Container";
+            readonly type: "SideBarContainer props";
+            readonly default: "—";
+            readonly desc: "继承并透传全部 Container props（visible/title/onCancel/resizable/... ）；title 默认走 i18n annotationTitle";
+        }];
+    }, {
+        readonly name: "SideBarCodeContent";
+        readonly props: readonly [{
+            readonly name: "codes";
+            readonly type: "CodeItemProps[]";
+            readonly default: "[]";
+            readonly desc: "代码/JSON 预览项列表；每项按 isJson 分流 JsonViewer / CodeHighlight";
+        }, {
+            readonly name: "activeKey";
+            readonly type: "string | string[]";
+            readonly default: "undefined";
+            readonly desc: "受控展开项 key（受控，不回写；仅经 onChange 通知，内部兜底非受控）";
+        }, {
+            readonly name: "onChange";
+            readonly type: "(keys: string[]) => void";
+            readonly default: "undefined";
+            readonly desc: "展开态变化回调（Collapse onChange）";
+        }, {
+            readonly name: "onExpand";
+            readonly type: "(e: MouseEvent, code: CodeItemProps, mode: string) => void";
+            readonly default: "undefined";
+            readonly desc: "点击某项展开（全屏）按钮回调；mode 固定 \"code\"（对齐 Semi onExpand）";
+        }, {
+            readonly name: "class";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义类名";
+        }, {
+            readonly name: "style";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义内联样式";
+        }];
+    }, {
+        readonly name: "SideBarMcpConfigure";
+        readonly props: readonly [{
+            readonly name: "options";
+            readonly type: "SideBarMcpOption[]";
+            readonly default: "[]";
+            readonly desc: "内置 MCP 工具列表（受控）；每项 { value, label, icon?, desc?, active?, disabled?, configure? }";
+        }, {
+            readonly name: "customOptions";
+            readonly type: "SideBarMcpOption[]";
+            readonly default: "[]";
+            readonly desc: "自定义 MCP 工具列表（受控）；空时显示添加入口";
+        }, {
+            readonly name: "filter";
+            readonly type: "(input: string, option: SideBarMcpOption) => boolean";
+            readonly default: "undefined";
+            readonly desc: "自定义搜索过滤谓词（覆盖默认 label/value 大小写不敏感包含匹配）";
+        }, {
+            readonly name: "placeholder";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "搜索占位（覆盖 i18n mcpSearchPlaceholder，修 Semi 硬编码「请输入」）";
+        }, {
+            readonly name: "onSearch";
+            readonly type: "(input: string, custom: boolean) => void";
+            readonly default: "undefined";
+            readonly desc: "搜索输入回调（custom 恒 false）";
+        }, {
+            readonly name: "onStatusChange";
+            readonly type: "(options: SideBarMcpOption[], custom: boolean) => void";
+            readonly default: "undefined";
+            readonly desc: "启用/关闭变化：产出该组「下一份数组」+ custom 标记（不回写 prop）";
+        }, {
+            readonly name: "onAddClick";
+            readonly type: "(e: MouseEvent) => void";
+            readonly default: "undefined";
+            readonly desc: "自定义组「添加」按钮回调";
+        }, {
+            readonly name: "onConfigureClick";
+            readonly type: "(e: MouseEvent, option: SideBarMcpOption) => void";
+            readonly default: "undefined";
+            readonly desc: "内置工具（configure=true）「配置」按钮回调";
+        }, {
+            readonly name: "onEditClick";
+            readonly type: "(e: MouseEvent, option: SideBarMcpOption) => void";
+            readonly default: "undefined";
+            readonly desc: "自定义工具「编辑」按钮回调";
+        }, {
+            readonly name: "renderItem";
+            readonly type: "Snippet<[{ option; custom }]>";
+            readonly default: "undefined";
+            readonly desc: "自定义单项渲染（覆盖默认项，custom 标记来自自定义组）";
+        }, {
+            readonly name: "...Container";
+            readonly type: "SideBarContainer props";
+            readonly default: "—";
+            readonly desc: "继承并透传全部 Container props（visible/title/onCancel/resizable/... ）；title 默认走 i18n mcpTitle";
+        }];
+    }, {
+        readonly name: "SideBarFileContent";
+        readonly props: readonly [{
+            readonly name: "files";
+            readonly type: "FileItemProps[]";
+            readonly default: "[]";
+            readonly desc: "富文本文件项列表；每项 { key, name, content, editable, onContentChange, extensions, imgUploadProps }，一个 tiptap 编辑器（editable 控制查看/编辑，默认只读）";
+        }, {
+            readonly name: "activeKey";
+            readonly type: "string | string[]";
+            readonly default: "undefined";
+            readonly desc: "受控展开项 key（受控，不回写；仅经 onChange 通知，内部兜底非受控）";
+        }, {
+            readonly name: "onChange";
+            readonly type: "(keys: string[]) => void";
+            readonly default: "undefined";
+            readonly desc: "展开态变化回调（Collapse onChange）";
+        }, {
+            readonly name: "onExpand";
+            readonly type: "(e: MouseEvent, file: FileItemProps, mode: string) => void";
+            readonly default: "undefined";
+            readonly desc: "点击某项展开（全屏）按钮回调；mode 固定 \"file\"（对齐 Semi onExpand）";
+        }, {
+            readonly name: "class";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义类名";
+        }, {
+            readonly name: "style";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义内联样式";
+        }];
+    }, {
+        readonly name: "SideBarFileItem";
+        readonly props: readonly [{
+            readonly name: "content";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "初始富文本内容（HTML）";
+        }, {
+            readonly name: "editable";
+            readonly type: "boolean";
+            readonly default: "true";
+            readonly desc: "是否可编辑（false=只读查看，渲染工具栏与否由此决定）";
+        }, {
+            readonly name: "onContentChange";
+            readonly type: "(html: string) => void";
+            readonly default: "undefined";
+            readonly desc: "内容变更回调（editor.getHTML()）";
+        }, {
+            readonly name: "extensions";
+            readonly type: "Extension[]";
+            readonly default: "[]";
+            readonly desc: "追加到默认扩展集末尾的自定义 tiptap 扩展（对齐 Semi extensions）";
+        }, {
+            readonly name: "imgUploadProps";
+            readonly type: "SideBarImageUploadOptions";
+            readonly default: "undefined";
+            readonly desc: "图片上传配置（透传 ImageUploadNode / 内嵌 Upload；含 action/accept/getUploadImageSrc 等）";
+        }, {
+            readonly name: "class";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义类名";
+        }, {
+            readonly name: "style";
+            readonly type: "string";
+            readonly default: "undefined";
+            readonly desc: "根自定义内联样式";
+        }];
+    }];
+    readonly tokens: readonly ["--cd-sidebar-bg", "--cd-sidebar-color", "--cd-sidebar-border", "--cd-sidebar-shadow", "--cd-sidebar-radius", "--cd-sidebar-width", "--cd-sidebar-z", "--cd-sidebar-motion-duration", "--cd-sidebar-header-padding", "--cd-sidebar-title-color", "--cd-sidebar-title-size", "--cd-sidebar-title-weight", "--cd-sidebar-close-color", "--cd-sidebar-close-hover-bg", "--cd-sidebar-close-radius", "--cd-sidebar-body-padding", "--cd-sidebar-options-gap", "--cd-sidebar-options-padding", "--cd-sidebar-option-size", "--cd-sidebar-option-radius", "--cd-sidebar-option-color", "--cd-sidebar-option-color-hover", "--cd-sidebar-option-bg-hover", "--cd-sidebar-option-color-active", "--cd-sidebar-option-bg-active", "--cd-sidebar-back-color", "--cd-sidebar-back-hover-bg", "--cd-sidebar-annotation-gap", "--cd-sidebar-annotation-card-bg", "--cd-sidebar-annotation-card-bg-hover", "--cd-sidebar-annotation-card-border", "--cd-sidebar-annotation-card-radius", "--cd-sidebar-annotation-card-padding", "--cd-sidebar-annotation-title-color", "--cd-sidebar-annotation-title-size", "--cd-sidebar-annotation-detail-color", "--cd-sidebar-annotation-detail-size", "--cd-sidebar-annotation-footer-color", "--cd-sidebar-annotation-order-color", "--cd-sidebar-annotation-order-bg", "--cd-sidebar-annotation-duration-bg", "--cd-sidebar-annotation-duration-color", "--cd-sidebar-annotation-cover-bg", "--cd-sidebar-code-head-gap", "--cd-sidebar-code-head-icon-color", "--cd-sidebar-code-head-color", "--cd-sidebar-code-head-size", "--cd-sidebar-code-head-weight", "--cd-sidebar-code-expand-color", "--cd-sidebar-code-expand-hover-bg", "--cd-sidebar-code-body-padding", "--cd-sidebar-mcp-gap", "--cd-sidebar-mcp-count-color", "--cd-sidebar-mcp-count-size", "--cd-sidebar-mcp-group-title-color", "--cd-sidebar-mcp-group-title-size", "--cd-sidebar-mcp-item-gap", "--cd-sidebar-mcp-item-padding", "--cd-sidebar-mcp-item-gutter", "--cd-sidebar-mcp-item-radius", "--cd-sidebar-mcp-item-bg", "--cd-sidebar-mcp-item-bg-hover", "--cd-sidebar-mcp-item-border", "--cd-sidebar-mcp-icon-size", "--cd-sidebar-mcp-icon-radius", "--cd-sidebar-mcp-icon-bg", "--cd-sidebar-mcp-label-color", "--cd-sidebar-mcp-label-size", "--cd-sidebar-mcp-desc-color", "--cd-sidebar-mcp-desc-size", "--cd-sidebar-mcp-action-color", "--cd-sidebar-mcp-action-hover-bg", "--cd-sidebar-mcp-empty-color", "--cd-sidebar-file-gap", "--cd-sidebar-file-menu-gap", "--cd-sidebar-file-menu-padding", "--cd-sidebar-file-menu-border", "--cd-sidebar-file-btn-radius", "--cd-sidebar-file-btn-color", "--cd-sidebar-file-btn-color-hover", "--cd-sidebar-file-btn-hover-bg", "--cd-sidebar-file-btn-color-active", "--cd-sidebar-file-btn-active-bg", "--cd-sidebar-file-editor-color", "--cd-sidebar-file-editor-size", "--cd-sidebar-file-editor-line-height", "--cd-sidebar-file-editor-min-height", "--cd-sidebar-file-image-radius", "--cd-sidebar-file-image-slot-margin", "--cd-sidebar-file-selection-bg"];
+};
+//# sourceMappingURL=meta.d.ts.map

package/dist/sidebar/meta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/sidebar/meta.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkNP,CAAC"}

package/dist/sidebar/meta.js

@@ -0,0 +1,219 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * SideBar — see specs/components/show/SideBar.spec.md
+ *
+ * 分阶段交付（P0～P5 全部落地）：本 meta 覆盖 P0（SideBarContainer 可伸缩浮层壳）+ P1（SideBar
+ * 主壳 mode 路由 + Options 图标 tab 组）+ P2（Annotation 引用溯源）+ P3（SideBarMcpConfigure MCP
+ * 工具配置）+ P4（SideBarCodeContent 代码/JSON 预览折叠列表）+ P5（SideBarFileContent 富文本查看/
+ * 编辑折叠列表，含 SideBarFileItem tiptap 编辑器 + 内嵌 Upload 的 ImageUploadNode，全程动态 import）。
+ * 全部 subComponents 已补齐（见下 subComponents），无留后项。
+ */
+export const meta = {
+    name: 'SideBar',
+    category: 'ai',
+    stage: 'M4',
+    semiEquivalent: 'Sidebar',
+    aiScene: true,
+    description: 'AI 侧边信息栏套件（重量级组合，分阶段交付）：P0 SideBarContainer 为可伸缩浮层壳——贴视口右侧（RTL 贴左），role=dialog + aria-labelledby(title)，打开移焦 + focus-trap 焦点捕获/归还 + Esc 关闭，堆叠 z-index 与 Modal/SideSheet 统一层栈（后开者在上），resizable 时左边缘（RTL 右边缘）把手拖拽调宽——复用 core createResizeDrag（axis:x 单轴 + clamp minWidth/maxWidth）与 Resizable 同套把手 a11y（role=separator + aria-orientation=vertical + aria-valuenow + 键盘 ←→/Home/End），motion 展开/收起为 CSS transition（reduced-motion / motion=false 退化即时显隐）。P1 SideBar 主壳按 mode 路由：main 渲染顶部 Options 图标 tab 组（role=tablist + roving tabindex + 键盘，name 作无障碍名）+ renderMainContent(activeKey)；detail（code/file/自定义）渲染 renderDetailHeader + 返回按钮（onBackWard 可异步，await 期间禁用防重触发）+ renderDetailContent(mode)。受控 visible / activeKey（不回写，仅回调通知）。P2 SideBarAnnotation 参考来源/引用溯源：外层复用 SideBarContainer 浮层壳（透传全部 Container props，title 默认走 i18n annotationTitle），内部用 Collapse 渲染 info 分组（每组一折叠面板 + aria-expanded），展开区渲染 video（封面/时长/播放态，duration 走 locale 数值格式化为 mm:ss）/text（站点 logo/名称/引用序号）卡片；可点击卡片（url 或 onClick）用原生 button（键盘 Enter/Space + focus 环 + 时长/序号本地化可访问文本），renderItem 可整条覆盖。P4 SideBarCodeContent 代码/JSON 预览：Collapse 折叠列表，每项按 isJson 分流 JsonViewer / CodeHighlight（透传 jsonViewerProps/codeHighlightProps），onExpand 全屏回调。P3 SideBarMcpConfigure MCP 工具配置面板：外层复用 SideBarContainer（title 默认走 i18n mcpTitle），内部顶部已启用计数 + 搜索框（Input，前缀放大镜 + aria-label，headless filterMcpOptions 支持自定义 filter）+ 内置/自定义双列表并列（Semi 为 radio 二选一，本库改并列双列表更直观）；每项前置图标（string→img / Snippet）+ label + desc + 动作按钮（内置 configure 显示配置 / 自定义显示编辑，aria-label 含工具名）+ 启用开关（复用本库 Switch，原生 role=switch + aria-checked，disabled 预设项锁定 + title tooltip），启用变化经 core toggleMcpOptionActive 产出「下一份数组 + custom 标记」上抛 onStatusChange 不回写；自定义组空态显示添加按钮，无搜索结果显示提示。P5 SideBarFileContent 富文本查看/编辑：Collapse 折叠列表，每项 SideBarFileItem 一个 tiptap v3 编辑器（editable 控查看/编辑，编辑态渲染格式工具栏），默认扩展集对齐 Semi（StarterKit link openOnClick:false + TextStyleKit + Image + TextAlign + 自研 SelectionMark + 自研 ImageUploadNode，末尾拼接 extensions），onContentChange 回调 editor.getHTML()；ImageUploadNode 用 svelte-tiptap NodeViewRenderer 内嵌本库 Upload（draggable + getUploadImageSrc）；tiptap 内核 + 3 官方扩展（text-style/image/text-align）+ svelte-tiptap 全程动态 import 不进主 bundle。',
+    exports: ['SideBar', 'SideBarContainer', 'SideBarAnnotation', 'SideBarCodeContent', 'SideBarMcpConfigure', 'SideBarFileContent', 'SideBarFileItem'],
+    a11yPattern: 'dialog + tablist',
+    apgRef: 'dialog (modal) + tabs',
+    relatedComponents: ['SideSheet', 'Resizable', 'Nav', 'Tabs'],
+    stages: [
+        { phase: 'P0', name: 'Container', done: true, desc: '可伸缩浮层壳（resizable 复用 Resizable + 动画 + header/close + Esc + a11y）' },
+        { phase: 'P1', name: '主壳 + Options', done: true, desc: 'SideBar 主组件 mode 路由（main/detail）+ 顶部 Options 图标 tab 组' },
+        { phase: 'P2', name: 'Annotation', done: true, desc: '参考来源/引用溯源折叠列表（video/text 卡片，复用 Collapse）' },
+        { phase: 'P3', name: 'MCPConfigure', done: true, desc: 'MCP 工具配置面板（内置/自定义双列表 + 搜索 + 启用开关 role=switch，复用 Input/Switch）' },
+        { phase: 'P4', name: 'CodeContent', done: true, desc: '代码/JSON 预览折叠列表（复用 CodeHighlight/JsonViewer + Collapse）' },
+        { phase: 'P5', name: 'FileContent', done: true, desc: '富文本查看/编辑折叠列表（tiptap v3 + 3 官方扩展 + 自研 ImageUploadNode，全程动态 import）' },
+    ],
+    usageHints: '用于 AI 产品右侧信息/配置面板（工具配置、引用溯源、内容预览）。仅需可伸缩浮层用 SideBarContainer；通用抽屉用 SideSheet；侧边导航用 Nav。Container 与主壳分层解耦——SideBarContainer 提供浮层壳，SideBar 提供 mode 路由内容，通常内嵌 <SideBarContainer><SideBar/></SideBarContainer>。',
+    subComponents: [
+        {
+            name: 'SideBar',
+            props: [
+                { name: 'mode', type: "'main' | 'code' | 'file' | string", default: "'main'", desc: '展示模式，main 主视图，其余详情视图' },
+                { name: 'activeKey', type: 'string', default: 'undefined', desc: '主视图激活 option（受控，不回写）' },
+                { name: 'options', type: 'SideBarOption[]', default: '[]', desc: '顶部图标 tab 组（{ icon, name, key }）' },
+                { name: 'onActiveOptionChange', type: '(e: Event, key: string) => void', default: 'undefined', desc: 'option 切换回调' },
+                { name: 'renderMainContent', type: 'Snippet<[string | undefined]>', default: 'undefined', desc: '主视图内容（按 activeKey 渲染）' },
+                { name: 'renderDetailContent', type: 'Snippet<[mode]>', default: 'undefined', desc: '详情内容（按 mode 渲染）' },
+                { name: 'renderDetailHeader', type: 'Snippet<[mode]>', default: 'undefined', desc: '详情头部（返回按钮之后）' },
+                { name: 'onBackWard', type: '(e: Event, mode) => void | Promise<void>', default: 'undefined', desc: '详情返回主视图（可异步，await 期间禁用防重触发）' },
+                { name: 'class', type: 'string', default: 'undefined', desc: '根自定义类名' },
+                { name: 'style', type: 'string', default: 'undefined', desc: '根自定义内联样式' },
+            ],
+        },
+        {
+            name: 'SideBarContainer',
+            props: [
+                { name: 'visible', type: 'boolean', default: 'false', desc: '是否可见（受控，不回写；仅经 onCancel 通知）' },
+                { name: 'title', type: 'string | Snippet', default: 'undefined', desc: '标题' },
+                { name: 'onCancel', type: '(e: Event) => void', default: 'undefined', desc: '关闭回调（Esc / 关闭按钮）' },
+                { name: 'afterVisibleChange', type: '(v: boolean) => void', default: 'undefined', desc: '动画结束后（入场或出场）触发' },
+                { name: 'motion', type: 'boolean', default: 'true', desc: '展开/收起动画；false 等价即时显隐' },
+                { name: 'resizable', type: 'boolean', default: 'true', desc: '宽度可拖拽（复用 Resizable 把手 + 键盘 a11y）' },
+                { name: 'minWidth', type: 'string | number', default: '150', desc: '最小宽度' },
+                { name: 'maxWidth', type: 'string | number', default: 'undefined', desc: '最大宽度' },
+                { name: 'defaultSize', type: '{ width?; height? }', default: 'undefined', desc: '默认尺寸（当前消费 width）' },
+                { name: 'showClose', type: 'boolean', default: 'true', desc: '显示关闭按钮' },
+                { name: 'renderHeader', type: 'Snippet', default: 'undefined', desc: '自定义头部（覆盖 title + 关闭按钮）' },
+                { name: 'class', type: 'string', default: 'undefined', desc: '面板自定义类名' },
+                { name: 'style', type: 'string', default: 'undefined', desc: '面板自定义内联样式' },
+            ],
+        },
+        {
+            name: 'SideBarAnnotation',
+            props: [
+                { name: 'info', type: 'SideBarAnnotationGroup[]', default: '[]', desc: '分组数组（{ header, key, annotations }[]），每组一个折叠面板' },
+                { name: 'activeKey', type: 'string | string[]', default: 'undefined', desc: '展开的分组 key（受控，不回写；透传 Collapse）' },
+                { name: 'onChange', type: '(keys: string[]) => void', default: 'undefined', desc: '展开变更回调（当前展开 key 数组）' },
+                { name: 'onClick', type: '(e: Event, item) => void', default: 'undefined', desc: '点击某条引用（url 存在先在新窗口打开来源）' },
+                { name: 'renderItem', type: 'Snippet<[SideBarAnnotationItem]>', default: 'undefined', desc: '自定义单条渲染（覆盖默认 video/text 卡片）' },
+                { name: '...Container', type: 'SideBarContainer props', default: '—', desc: '继承并透传全部 Container props（visible/title/onCancel/resizable/... ）；title 默认走 i18n annotationTitle' },
+            ],
+        },
+        {
+            name: 'SideBarCodeContent',
+            props: [
+                { name: 'codes', type: 'CodeItemProps[]', default: '[]', desc: '代码/JSON 预览项列表；每项按 isJson 分流 JsonViewer / CodeHighlight' },
+                { name: 'activeKey', type: 'string | string[]', default: 'undefined', desc: '受控展开项 key（受控，不回写；仅经 onChange 通知，内部兜底非受控）' },
+                { name: 'onChange', type: '(keys: string[]) => void', default: 'undefined', desc: '展开态变化回调（Collapse onChange）' },
+                { name: 'onExpand', type: '(e: MouseEvent, code: CodeItemProps, mode: string) => void', default: 'undefined', desc: '点击某项展开（全屏）按钮回调；mode 固定 "code"（对齐 Semi onExpand）' },
+                { name: 'class', type: 'string', default: 'undefined', desc: '根自定义类名' },
+                { name: 'style', type: 'string', default: 'undefined', desc: '根自定义内联样式' },
+            ],
+        },
+        {
+            name: 'SideBarMcpConfigure',
+            props: [
+                { name: 'options', type: 'SideBarMcpOption[]', default: '[]', desc: '内置 MCP 工具列表（受控）；每项 { value, label, icon?, desc?, active?, disabled?, configure? }' },
+                { name: 'customOptions', type: 'SideBarMcpOption[]', default: '[]', desc: '自定义 MCP 工具列表（受控）；空时显示添加入口' },
+                { name: 'filter', type: '(input: string, option: SideBarMcpOption) => boolean', default: 'undefined', desc: '自定义搜索过滤谓词（覆盖默认 label/value 大小写不敏感包含匹配）' },
+                { name: 'placeholder', type: 'string', default: 'undefined', desc: '搜索占位（覆盖 i18n mcpSearchPlaceholder，修 Semi 硬编码「请输入」）' },
+                { name: 'onSearch', type: '(input: string, custom: boolean) => void', default: 'undefined', desc: '搜索输入回调（custom 恒 false）' },
+                { name: 'onStatusChange', type: '(options: SideBarMcpOption[], custom: boolean) => void', default: 'undefined', desc: '启用/关闭变化：产出该组「下一份数组」+ custom 标记（不回写 prop）' },
+                { name: 'onAddClick', type: '(e: MouseEvent) => void', default: 'undefined', desc: '自定义组「添加」按钮回调' },
+                { name: 'onConfigureClick', type: '(e: MouseEvent, option: SideBarMcpOption) => void', default: 'undefined', desc: '内置工具（configure=true）「配置」按钮回调' },
+                { name: 'onEditClick', type: '(e: MouseEvent, option: SideBarMcpOption) => void', default: 'undefined', desc: '自定义工具「编辑」按钮回调' },
+                { name: 'renderItem', type: 'Snippet<[{ option; custom }]>', default: 'undefined', desc: '自定义单项渲染（覆盖默认项，custom 标记来自自定义组）' },
+                { name: '...Container', type: 'SideBarContainer props', default: '—', desc: '继承并透传全部 Container props（visible/title/onCancel/resizable/... ）；title 默认走 i18n mcpTitle' },
+            ],
+        },
+        {
+            name: 'SideBarFileContent',
+            props: [
+                { name: 'files', type: 'FileItemProps[]', default: '[]', desc: '富文本文件项列表；每项 { key, name, content, editable, onContentChange, extensions, imgUploadProps }，一个 tiptap 编辑器（editable 控制查看/编辑，默认只读）' },
+                { name: 'activeKey', type: 'string | string[]', default: 'undefined', desc: '受控展开项 key（受控，不回写；仅经 onChange 通知，内部兜底非受控）' },
+                { name: 'onChange', type: '(keys: string[]) => void', default: 'undefined', desc: '展开态变化回调（Collapse onChange）' },
+                { name: 'onExpand', type: '(e: MouseEvent, file: FileItemProps, mode: string) => void', default: 'undefined', desc: '点击某项展开（全屏）按钮回调；mode 固定 "file"（对齐 Semi onExpand）' },
+                { name: 'class', type: 'string', default: 'undefined', desc: '根自定义类名' },
+                { name: 'style', type: 'string', default: 'undefined', desc: '根自定义内联样式' },
+            ],
+        },
+        {
+            name: 'SideBarFileItem',
+            props: [
+                { name: 'content', type: 'string', default: 'undefined', desc: '初始富文本内容（HTML）' },
+                { name: 'editable', type: 'boolean', default: 'true', desc: '是否可编辑（false=只读查看，渲染工具栏与否由此决定）' },
+                { name: 'onContentChange', type: '(html: string) => void', default: 'undefined', desc: '内容变更回调（editor.getHTML()）' },
+                { name: 'extensions', type: 'Extension[]', default: '[]', desc: '追加到默认扩展集末尾的自定义 tiptap 扩展（对齐 Semi extensions）' },
+                { name: 'imgUploadProps', type: 'SideBarImageUploadOptions', default: 'undefined', desc: '图片上传配置（透传 ImageUploadNode / 内嵌 Upload；含 action/accept/getUploadImageSrc 等）' },
+                { name: 'class', type: 'string', default: 'undefined', desc: '根自定义类名' },
+                { name: 'style', type: 'string', default: 'undefined', desc: '根自定义内联样式' },
+            ],
+        },
+    ],
+    tokens: [
+        '--cd-sidebar-bg',
+        '--cd-sidebar-color',
+        '--cd-sidebar-border',
+        '--cd-sidebar-shadow',
+        '--cd-sidebar-radius',
+        '--cd-sidebar-width',
+        '--cd-sidebar-z',
+        '--cd-sidebar-motion-duration',
+        '--cd-sidebar-header-padding',
+        '--cd-sidebar-title-color',
+        '--cd-sidebar-title-size',
+        '--cd-sidebar-title-weight',
+        '--cd-sidebar-close-color',
+        '--cd-sidebar-close-hover-bg',
+        '--cd-sidebar-close-radius',
+        '--cd-sidebar-body-padding',
+        '--cd-sidebar-options-gap',
+        '--cd-sidebar-options-padding',
+        '--cd-sidebar-option-size',
+        '--cd-sidebar-option-radius',
+        '--cd-sidebar-option-color',
+        '--cd-sidebar-option-color-hover',
+        '--cd-sidebar-option-bg-hover',
+        '--cd-sidebar-option-color-active',
+        '--cd-sidebar-option-bg-active',
+        '--cd-sidebar-back-color',
+        '--cd-sidebar-back-hover-bg',
+        '--cd-sidebar-annotation-gap',
+        '--cd-sidebar-annotation-card-bg',
+        '--cd-sidebar-annotation-card-bg-hover',
+        '--cd-sidebar-annotation-card-border',
+        '--cd-sidebar-annotation-card-radius',
+        '--cd-sidebar-annotation-card-padding',
+        '--cd-sidebar-annotation-title-color',
+        '--cd-sidebar-annotation-title-size',
+        '--cd-sidebar-annotation-detail-color',
+        '--cd-sidebar-annotation-detail-size',
+        '--cd-sidebar-annotation-footer-color',
+        '--cd-sidebar-annotation-order-color',
+        '--cd-sidebar-annotation-order-bg',
+        '--cd-sidebar-annotation-duration-bg',
+        '--cd-sidebar-annotation-duration-color',
+        '--cd-sidebar-annotation-cover-bg',
+        '--cd-sidebar-code-head-gap',
+        '--cd-sidebar-code-head-icon-color',
+        '--cd-sidebar-code-head-color',
+        '--cd-sidebar-code-head-size',
+        '--cd-sidebar-code-head-weight',
+        '--cd-sidebar-code-expand-color',
+        '--cd-sidebar-code-expand-hover-bg',
+        '--cd-sidebar-code-body-padding',
+        '--cd-sidebar-mcp-gap',
+        '--cd-sidebar-mcp-count-color',
+        '--cd-sidebar-mcp-count-size',
+        '--cd-sidebar-mcp-group-title-color',
+        '--cd-sidebar-mcp-group-title-size',
+        '--cd-sidebar-mcp-item-gap',
+        '--cd-sidebar-mcp-item-padding',
+        '--cd-sidebar-mcp-item-gutter',
+        '--cd-sidebar-mcp-item-radius',
+        '--cd-sidebar-mcp-item-bg',
+        '--cd-sidebar-mcp-item-bg-hover',
+        '--cd-sidebar-mcp-item-border',
+        '--cd-sidebar-mcp-icon-size',
+        '--cd-sidebar-mcp-icon-radius',
+        '--cd-sidebar-mcp-icon-bg',
+        '--cd-sidebar-mcp-label-color',
+        '--cd-sidebar-mcp-label-size',
+        '--cd-sidebar-mcp-desc-color',
+        '--cd-sidebar-mcp-desc-size',
+        '--cd-sidebar-mcp-action-color',
+        '--cd-sidebar-mcp-action-hover-bg',
+        '--cd-sidebar-mcp-empty-color',
+        '--cd-sidebar-file-gap',
+        '--cd-sidebar-file-menu-gap',
+        '--cd-sidebar-file-menu-padding',
+        '--cd-sidebar-file-menu-border',
+        '--cd-sidebar-file-btn-radius',
+        '--cd-sidebar-file-btn-color',
+        '--cd-sidebar-file-btn-color-hover',
+        '--cd-sidebar-file-btn-hover-bg',
+        '--cd-sidebar-file-btn-color-active',
+        '--cd-sidebar-file-btn-active-bg',
+        '--cd-sidebar-file-editor-color',
+        '--cd-sidebar-file-editor-size',
+        '--cd-sidebar-file-editor-line-height',
+        '--cd-sidebar-file-editor-min-height',
+        '--cd-sidebar-file-image-radius',
+        '--cd-sidebar-file-image-slot-margin',
+        '--cd-sidebar-file-selection-bg',
+    ],
+};