@civilization/deepseek-harness-skill-mcp 0.3.1 → 0.3.3

package/README.md

@@ -145,7 +145,11 @@ MCP 工具是提供给模型的工具 schema，不是用户 `/` 命令，因此
 
 当前版本不接受 `env`、认证 header、带凭据或 token 查询参数的 URL。请勿把密钥放进工具参数、MCP 地址或提交到仓库。
 
-MCP 对端离线、命令启动失败或首次工具发现失败不会阻止 DSH 启动。stdio 与 Streamable HTTP 使用 Harness MCP client 的后台重连策略；旧版 SSE 当前依赖连接自身，在断线后可通过刷新配置重新加载。设置页在连接恢复并发现工具后更新状态。插件加载时也会把旧版本写入的严格启动配置迁移为非致命启动策略。
+### MCP 自动重连与周期配置
+
+- **重连周期滑块（3–60 秒，默认 7 秒）**：用户在添加或编辑 MCP 服务器时，可使用滑块指定最大重连等待阈值（`reconnectInterval`）。
+- **无限长效重试保底**：解除底层连续 10 次失败后彻底放弃重试的硬限制，改为长效保底探测模式。当服务端离线或重启时，客户端从 500ms 开始指数退避，并在达到设定的阈值后持续周期探测；只要 MCP 服务端恢复，客户端将在设定的阈值时间内自动重新建立连接并热重载工具。
+- **全协议统一管理**：`stdio`、`streamable-http` 与旧版 `sse` 均统一纳入监督重连体系，端点离线或初次发现失败绝不阻塞 DSH 正常启动。
 
 ## Agent 工具与 Skill
 
@@ -196,12 +200,12 @@ pnpm run web
 
 浏览器端 `/` 候选缓存失效兼容逻辑会使用公开的 `connection/reset` 客户端事件；服务端通过注入 `webServer` 与 `connection` 双重挂载 `/extensions` 路由并由 Cordis effect 托管生命周期，防止动态请求掉入前端静态资源的 405 fallback。自动测试验证 Host/RPC、HTTP 桥接和浏览器 bundle 构建，但没有在本仓库内启动完整 Harness Web 做端到端菜单点击验证。外部文件改动仍依赖 filesystem provider 先完成 watcher 失效，必要时可在变更后点击管理页“刷新”。
 
-## Harness 版本兼容
+## Harness / Cordis 版本兼容
 
-当前版本在 DeepSeek Harness **0.2.0-rc.2** 上验证：`pnpm test`（33 项）与 `pnpm run build` 通过，并逐项核对了所用公开接口——`tools.register/get/schemas/guard`、`tools/pre-execute` 的 `deny` 决策、`skills.register/snapshot`、`webServer.register(kind: 'prefix')`、服务端 `connection.rpc.handle` 与浏览器端 `connection.rpc.call`、`settings.section` 槽位、`locale.register/bind`、`connection/reset` 事件、客户端 bundle 的 `window.__ModuleLoader__.load({ id, factory })` 格式。
+当前版本在 DeepSeek Harness **0.2.1-rc.2** 及 Cordis **4.0.5** 上验证：`pnpm test`（35 项全部通过）与 `pnpm run build` 通过，并逐项核对了所用公开接口——`tools.register/get/schemas/guard`、`tools/pre-execute` 的 `deny` 决策、`skills.register/snapshot`、`webServer.register(kind: 'prefix')`、服务端 `connection.rpc.handle` 与浏览器端 `connection.rpc.call`、`settings.section` 槽位、`locale.register/bind`、`connection/reset` 事件、客户端 bundle 的 `window.__ModuleLoader__.load({ id, factory })` 格式。
 
-- `peerDependencies` 只声明**下界**（`@deepseek-ai/dsh-tools: >=0.1.5-rc.2`，无上界），以便跟随 Harness 的快速迭代：Harness 的插件兼容性判定用运行时版本比对这些范围。代价是不再对未来的破坏性变更做“响亮拒绝”，且**不保证前序版本**。
-- `@deepseek-ai/dsh-mcp-client` 与 `@deepseek-ai/dsh-skill-filesystem` 作为 `dependencies` 固定在 `0.2.0-rc.2`：插件只用它们的 `Config` 校验/规范化托管配置行（真正的连接由 Harness 自带的同名插件完成）。Schemastery 对象对未知字段**透传**，已实测 0.2.0 新增的 `maxInstructionBytes` 在旧 schema 下也不会被丢弃；但若未来 Harness 改的是必填约束或字段语义，这个固定版本会成为陈旧校验源，届时应同步升级。
+- `peerDependencies` 只声明**下界**（`@deepseek-ai/cordis: ^4.0.2`，`@deepseek-ai/dsh-tools: >=0.1.5-rc.2`，无上界），以便跟随 Harness 的快速迭代：Harness 的插件兼容性判定用运行时版本比对这些范围。
+- `@deepseek-ai/dsh-mcp-client` 与 `@deepseek-ai/dsh-skill-filesystem` 作为 `dependencies` 对齐至 `0.2.1-rc.2`，并对齐 `@deepseek-ai/schemastery: ~3.18.5`。
 - 工具目录的核心工具名单同样是版本相关数据，见上文“名单维护”。
 
 ## 发布

package/icon.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" fill="none">
+  <rect x="1" y="1" width="30" height="30" rx="8" fill="#7C3AED"/>
+  <path d="M11 6v5M21 6v5M8 11h16v6a8 8 0 0 1-8 8h0a8 8 0 0 1-8-8v-6z" stroke="#FFFFFF" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M16 25v3" stroke="#FFFFFF" stroke-width="2.2" stroke-linecap="round"/>
+</svg>

package/lib/client.js

@@ -23,6 +23,8 @@ var index_exports = {};
 __export(index_exports, {
   CatalogSection: () => CatalogSection,
   McpSection: () => McpSection,
+  SkillMcpIcon: () => SkillMcpIcon,
+  SkillMcpPage: () => SkillMcpPage,
   SkillSection: () => SkillSection,
   apply: () => apply,
   inject: () => inject
@@ -93,6 +95,9 @@ var ExtensionsController = class {
 
 // src/client/locales.js
 var zh = {
+  panel: "\u6280\u80FD\u4E0E MCP",
+  panelTitle: "\u6280\u80FD\u4E0E\u5916\u90E8\u6269\u5C55",
+  panelIntro: "\u7BA1\u7406\u81EA\u5B9A\u4E49 Skill \u6280\u80FD\u5E93\u3001MCP \u5DE5\u5177\u670D\u52A1\u4E0E\u7CFB\u7EDF\u5DE5\u5177\u6743\u9650\u3002",
   navSkill: "Skill \u7BA1\u7406",
   navMcp: "MCP \u7BA1\u7406",
   skillIntro: "\u914D\u7F6E\u4E00\u4E2A\u6216\u591A\u4E2A Skill \u8DEF\u5F84\uFF1B\u6BCF\u4E2A\u8DEF\u5F84\u4E0B\u53EF\u4EE5\u5305\u542B\u591A\u4E2A\u6280\u80FD\u3002",
@@ -216,9 +221,15 @@ var zh = {
   noCatalogResults: "\u672A\u627E\u5230\u5339\u914D\u7684\u5DE5\u5177",
   noCatalogResultsHint: "\u8BF7\u5C1D\u8BD5\u4FEE\u6539\u641C\u7D22\u8BCD\u6216\u9009\u62E9\u5176\u4ED6\u63D2\u4EF6\u5206\u7EC4\u3002",
   toolProtected: "\u6838\u5FC3\u4FDD\u7559",
-  toolTakeoverHint: "\u6B64\u5DE5\u5177\u53D7 skill-catalog \u7EDF\u4E00\u7BA1\u7406\u3002"
+  toolTakeoverHint: "\u6B64\u5DE5\u5177\u53D7 skill-catalog \u7EDF\u4E00\u7BA1\u7406\u3002",
+  reconnectInterval: "\u91CD\u8FDE\u5468\u671F\u9608\u503C",
+  reconnectIntervalDesc: "\u670D\u52A1\u7AEF\u65AD\u5F00\u540E\u81EA\u52A8\u63A2\u6D4B\u5E76\u6062\u590D\u8FDE\u63A5\u7684\u6700\u5927\u7B49\u5F85\u65F6\u95F4\uFF08\u8303\u56F4 3\u201360 \u79D2\uFF0C\u9ED8\u8BA4 7 \u79D2\uFF09\u3002",
+  seconds: "\u79D2"
 };
 var en = {
+  panel: "Skills & MCP",
+  panelTitle: "Skills & External Extensions",
+  panelIntro: "Manage custom Skill repositories, MCP tool servers, and tool permissions.",
   navSkill: "Skills",
   navMcp: "MCP",
   skillIntro: "Configure one or more Skill paths; each path can contain multiple skills.",
@@ -342,11 +353,14 @@ var en = {
   noCatalogResults: "No matching tools found",
   noCatalogResultsHint: "Try adjusting your search terms or filter.",
   toolProtected: "Protected",
-  toolTakeoverHint: "This tool is managed under skill-catalog."
+  toolTakeoverHint: "This tool is managed under skill-catalog.",
+  reconnectInterval: "Reconnect Interval",
+  reconnectIntervalDesc: "Maximum wait time before retrying dropped connections (range 3\u201360s, default 7s).",
+  seconds: "s"
 };
 
 // src/client/styles.css
-var styles_default = '.dsh-ext{color:var(--dsw-alias-label-primary);max-width:840px;padding:4px 0 28px;font:inherit}\n.dsh-ext-heading,.dsh-ext-card>header{display:flex;justify-content:space-between;align-items:center;gap:16px}\n.dsh-ext h2{font-size:22px;letter-spacing:-.4px;margin:0 0 8px}.dsh-ext h3{font-size:15px;margin:0;display:flex;align-items:center;gap:8px}\n.dsh-ext p,.dsh-ext small{color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.6}.dsh-ext-heading p{margin:0}\n.dsh-ext button{font:inherit;font-size:13px;cursor:pointer;border:1px solid var(--dsw-alias-border-l4);border-radius:9px;background:var(--dsw-alias-bg-layer-2);color:inherit;padding:8px 13px;white-space:nowrap}\n.dsh-ext button:hover{background:var(--dsw-alias-bg-layer-3)}.dsh-ext button:disabled{opacity:.5;cursor:default}\n.dsh-ext :is(button,input,select,textarea):focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:3px}\n.dsh-ext-card{border:1px solid var(--dsw-alias-border-l4);border-radius:16px;margin-top:20px;background:var(--dsw-alias-bg-layer-2);overflow:hidden}\n.dsh-ext-card>header{padding:18px 20px;border-bottom:1px solid var(--dsw-alias-border-l4)}.dsh-ext-count{font-size:11px;font-weight:400;color:var(--dsw-alias-label-tertiary)}\n.dsh-ext-empty{padding:32px 20px}.dsh-ext-empty strong{font-size:14px;font-weight:500}.dsh-ext-empty p{margin:6px 0 0}\n.dsh-ext ul{list-style:none;padding:0;margin:0}.dsh-ext li{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--dsw-alias-border-l4)}.dsh-ext li:last-child{border:0}\n.dsh-ext-details{display:flex;flex-direction:column;gap:5px;min-width:0}.dsh-ext-details strong{font-size:14px}.dsh-ext-details code{font-size:12px;color:var(--dsw-alias-label-secondary);overflow-wrap:anywhere}\n.dsh-ext-runtime{display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:12px;color:var(--dsw-alias-label-tertiary)}\n.dsh-ext-status{width:7px;height:7px;border-radius:50%;background:#858585;box-shadow:0 0 0 3px color-mix(in srgb,#858585 16%,transparent)}\n.dsh-ext-status-available{background:#38a169;box-shadow:0 0 0 3px color-mix(in srgb,#38a169 18%,transparent)}.dsh-ext-status-waiting{background:#d69e2e;box-shadow:0 0 0 3px color-mix(in srgb,#d69e2e 18%,transparent)}\n.dsh-ext-runtime details{width:100%;margin-top:2px}.dsh-ext-runtime summary{width:max-content;cursor:pointer;color:var(--dsw-alias-label-secondary);user-select:none}.dsh-ext-runtime summary:hover{color:var(--dsw-alias-label-primary)}\n.dsh-ext-runtime .dsh-ext-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.dsh-ext-runtime .dsh-ext-tools li{display:block;border:0;padding:4px 8px;border-radius:6px;background:var(--dsw-alias-bg-layer-3)}\n.dsh-ext-form{padding:20px;border-top:1px solid var(--dsw-alias-border-l4)}.dsh-ext fieldset{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:16px}.dsh-ext label{display:flex;flex-direction:column;gap:7px;font-size:13px}\n.dsh-ext input,.dsh-ext select,.dsh-ext textarea{box-sizing:border-box;min-width:0;width:100%;font:inherit;color:inherit;background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l4);border-radius:8px;padding:10px}.dsh-ext textarea{resize:vertical}\n.dsh-ext-actions{display:flex;justify-content:flex-end;gap:8px;grid-column:1/-1}.dsh-ext fieldset>p{grid-column:1/-1;margin:0}.dsh-ext-notice{padding:12px 16px;border:1px solid var(--dsw-alias-border-l4);border-radius:10px}.dsh-ext-footnote{padding:0 4px}\n.dsh-ext-row-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}.dsh-ext .dsh-ext-danger{color:#e98282}.dsh-ext-inline-form{width:100%;padding:14px 0 2px;border:0}.dsh-skill-edit-form{margin-top:12px;padding:14px;border-radius:10px;background:var(--dsw-alias-bg-layer-1)}\n.dsh-confirm{box-sizing:border-box;width:min(430px,calc(100vw - 32px));padding:22px;border:1px solid var(--dsw-alias-border-l4);border-radius:16px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);box-shadow:0 20px 60px rgba(0,0,0,.28);font:inherit}.dsh-confirm::backdrop{background:rgba(10,12,16,.48);backdrop-filter:blur(3px)}\n.dsh-confirm-icon{display:grid;place-items:center;width:34px;height:34px;margin-bottom:16px;border-radius:10px;background:color-mix(in srgb,#e05252 14%,transparent);color:#e98282;font-size:19px;font-weight:700}.dsh-confirm-copy h3{margin:0;font-size:16px}.dsh-confirm-copy p{margin:8px 0 0;color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.65}.dsh-confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}.dsh-confirm button{font:inherit;font-size:13px;cursor:pointer;border:1px solid var(--dsw-alias-border-l4);border-radius:9px;background:var(--dsw-alias-bg-layer-2);color:inherit;padding:8px 14px}.dsh-confirm button:hover{background:var(--dsw-alias-bg-layer-3)}.dsh-confirm button:disabled{opacity:.5;cursor:default}.dsh-confirm button:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:3px}.dsh-confirm .dsh-confirm-delete{border-color:color-mix(in srgb,#e05252 45%,var(--dsw-alias-border-l4));background:#b83232;color:#fff}.dsh-confirm .dsh-confirm-delete:hover{background:#c63b3b}\n.dsh-ext-heading-actions{display:flex;gap:8px;align-items:center}.dsh-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n.dsh-skill-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}.dsh-skill-stats>div{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--dsw-alias-border-l4);border-radius:12px;background:var(--dsw-alias-bg-layer-2)}.dsh-skill-stats strong{font-size:20px}.dsh-skill-stats span{font-size:12px;color:var(--dsw-alias-label-tertiary)}\n.dsh-skill-search{margin-top:14px}.dsh-skill-search input{padding-left:13px}.dsh-skill-manager>.dsh-ext-form{margin-top:14px;border:1px solid var(--dsw-alias-border-l4);border-radius:14px;background:var(--dsw-alias-bg-layer-2)}\n.dsh-skill-filters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.dsh-skill-filters label{gap:5px;font-size:11px;color:var(--dsw-alias-label-tertiary)}.dsh-skill-filters select{padding:8px 10px;color:var(--dsw-alias-label-primary)}\n.dsh-skill-source-manager{margin-top:14px}.dsh-skill-source-manager>summary{cursor:pointer;padding:14px 18px;font-size:14px;font-weight:600;user-select:none}.dsh-skill-source-manager[open]>summary{border-bottom:1px solid var(--dsw-alias-border-l4)}\n.dsh-skill-source-manager li{padding:11px 18px;flex-wrap:wrap}.dsh-skill-source-title{display:flex;align-items:flex-start;gap:11px;min-width:0}.dsh-skill-source-title>.dsh-ext-status{margin-top:6px;flex:0 0 auto}.dsh-skill-source-title>div{display:flex;min-width:0;flex-direction:column;gap:3px}.dsh-skill-source-title code{font-size:11px;color:var(--dsw-alias-label-tertiary);overflow-wrap:anywhere}.dsh-skill-source-title small{font-size:11px;color:#e98282}\n.dsh-skill-library{margin-top:14px}.dsh-skill-group-editor{display:flex;align-items:flex-end;gap:8px}.dsh-skill-group-editor label{flex:1}.dsh-skill-group-editor input{padding:7px 9px}.dsh-skill-group-editor button{padding:7px 10px}\n.dsh-skill-row{display:block!important;padding:15px 18px!important}.dsh-skill-row-main{min-width:0}.dsh-skill-name{display:flex;align-items:center;gap:9px}.dsh-skill-name strong{font-size:14px}.dsh-skill-row-main>p{margin:6px 0 3px}.dsh-skill-row-main>code{font-size:11px;color:var(--dsw-alias-label-tertiary)}\n.dsh-skill-badge{font-size:11px;padding:2px 7px;border-radius:999px;background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-secondary)}.dsh-skill-badge-group{color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 12%,transparent)}.dsh-skill-badge-invalid{color:#e98282}.dsh-skill-badge-shadowed{color:#a98af8}.dsh-ext-status-invalid{background:#e05252;box-shadow:0 0 0 3px color-mix(in srgb,#e05252 18%,transparent)}.dsh-ext-status-shadowed{background:#8b5cf6;box-shadow:0 0 0 3px color-mix(in srgb,#8b5cf6 18%,transparent)}.dsh-ext-status-manual{background:#d69e2e;box-shadow:0 0 0 3px color-mix(in srgb,#d69e2e 18%,transparent)}\n.dsh-skill-row details{margin-top:9px}.dsh-skill-row summary{width:max-content;cursor:pointer;font-size:12px;color:var(--dsw-alias-label-secondary)}.dsh-skill-detail{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px;padding:14px;border-radius:10px;background:var(--dsw-alias-bg-layer-1)}.dsh-skill-detail>p{grid-column:1/-1;margin:0}.dsh-skill-detail p strong,.dsh-skill-detail>div>strong{display:block;margin-bottom:5px;color:var(--dsw-alias-label-secondary);font-size:12px}\n.dsh-skill-invocation{display:flex;flex-direction:column;gap:7px}.dsh-skill-invocation label,.dsh-skill-create-flags label{display:flex;flex-direction:row;align-items:center;gap:5px}.dsh-ext input[type=checkbox]{width:auto;min-width:auto}.dsh-skill-detail ul,.dsh-skill-detail li{display:block!important;margin:0;padding:0!important;border:0!important}.dsh-skill-resources{display:flex!important;flex-wrap:wrap!important;gap:5px}.dsh-skill-resources li{padding:3px 6px!important;border-radius:5px!important;background:var(--dsw-alias-bg-layer-3)!important}\n.dsh-ext-span{grid-column:1/-1}.dsh-skill-create-flags{display:flex;flex-direction:column;gap:7px;font-size:13px}.dsh-skill-create-flags>span{margin-bottom:1px}.dsh-skill-source>.dsh-ext-notice{margin:12px 18px}.dsh-skill-source>.dsh-ext-empty{padding:18px}\n@media(max-width:600px){.dsh-ext fieldset,.dsh-skill-detail,.dsh-skill-filters{grid-template-columns:1fr}.dsh-ext-heading{align-items:flex-start;flex-direction:column}.dsh-ext-heading-actions{flex-wrap:wrap}.dsh-ext-card>header{padding:14px}.dsh-ext li{padding:14px}.dsh-skill-stats{grid-template-columns:repeat(2,1fr)}.dsh-skill-group-editor{align-items:stretch;flex-direction:column}}\n\n/* Skill Catalog Takeover Styles */\n.dsh-catalog-section{margin-top:14px}\n.dsh-catalog-header-actions{display:flex;align-items:center;gap:8px}\n.dsh-catalog-group-card{margin-top:16px;border:1px solid var(--dsw-alias-border-l4);border-radius:14px;background:var(--dsw-alias-bg-layer-2);overflow:hidden}\n.dsh-catalog-group-header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:color-mix(in srgb,var(--dsw-alias-bg-layer-3) 50%,transparent);border-bottom:1px solid var(--dsw-alias-border-l4);cursor:pointer;user-select:none}\n.dsh-catalog-group-header::-webkit-details-marker{display:none}\n.dsh-catalog-group-header::marker{content:""}\n.dsh-catalog-group-card:not([open]) .dsh-catalog-group-header{border-bottom:0}\n.dsh-catalog-group-title{display:flex;align-items:center;gap:10px}\n.dsh-catalog-group-title::before{content:"\u25B6";display:inline-block;font-size:11px;color:var(--dsw-alias-label-tertiary);transition:transform .2s ease}\n.dsh-catalog-group-card[open] .dsh-catalog-group-title::before{transform:rotate(90deg)}\n.dsh-catalog-group-title h4{margin:0;font-size:14px;font-weight:600}\n.dsh-catalog-group-actions{display:flex;align-items:center;gap:6px}\n.dsh-catalog-group-actions button{padding:4px 10px;font-size:12px;border-radius:7px}\n.dsh-catalog-tool-item{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;border-bottom:1px solid var(--dsw-alias-border-l4);transition:background .15s ease}\n.dsh-catalog-tool-item:last-child{border-bottom:0}\n.dsh-catalog-tool-item:hover{background:color-mix(in srgb,var(--dsw-alias-bg-layer-3) 40%,transparent)}\n.dsh-catalog-tool-info{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}\n.dsh-catalog-tool-header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}\n.dsh-catalog-tool-header code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;font-weight:600;color:var(--dsw-alias-brand-primary)}\n.dsh-catalog-tool-info p{margin:0;font-size:12px;color:var(--dsw-alias-label-secondary);line-height:1.5}\n.dsh-catalog-switch-wrap{display:flex;align-items:center;gap:10px;flex-shrink:0}\n.dsh-catalog-switch-label{font-size:12px;font-weight:500}\n.dsh-catalog-switch{position:relative;display:inline-block;width:40px;height:22px;cursor:pointer}\n.dsh-catalog-switch input{opacity:0;width:0;height:0;position:absolute}\n.dsh-catalog-slider{position:absolute;cursor:pointer;inset:0;background:var(--dsw-alias-bg-layer-4,#3b3b3b);border:1px solid var(--dsw-alias-border-l4);border-radius:22px;transition:.2s}\n.dsh-catalog-slider:before{position:absolute;content:"";height:16px;width:16px;left:2px;bottom:2px;background:#fff;border-radius:50%;transition:.2s}\n.dsh-catalog-switch input:checked + .dsh-catalog-slider{background:var(--dsw-alias-brand-primary,#3182ce);border-color:var(--dsw-alias-brand-primary,#3182ce)}\n.dsh-catalog-switch input:checked + .dsh-catalog-slider:before{transform:translateX(18px)}\n.dsh-catalog-switch input:disabled + .dsh-catalog-slider{opacity:.4;cursor:not-allowed}\n.dsh-catalog-tool-details{margin-top:4px;width:100%}\n.dsh-catalog-tool-details summary{width:max-content;cursor:pointer;font-size:12px;color:var(--dsw-alias-label-secondary);user-select:none;transition:color .15s}\n.dsh-catalog-tool-details summary:hover{color:var(--dsw-alias-label-primary)}\n.dsh-catalog-tool-details p{margin:6px 0 2px;font-size:12px;color:var(--dsw-alias-label-tertiary);line-height:1.55;background:var(--dsw-alias-bg-layer-1);padding:8px 12px;border-radius:8px;border:1px solid var(--dsw-alias-border-l4)}\n\n';
+var styles_default = '.dsh-ext{color:var(--dsw-alias-label-primary);max-width:840px;padding:4px 0 28px;font:inherit}\n.dsh-ext-heading,.dsh-ext-card>header{display:flex;justify-content:space-between;align-items:center;gap:16px}\n.dsh-ext h2{font-size:22px;letter-spacing:-.4px;margin:0 0 8px}.dsh-ext h3{font-size:15px;margin:0;display:flex;align-items:center;gap:8px}\n.dsh-ext p,.dsh-ext small{color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.6}.dsh-ext-heading p{margin:0}\n.dsh-ext button{font:inherit;font-size:13px;cursor:pointer;border:1px solid var(--dsw-alias-border-l4);border-radius:9px;background:var(--dsw-alias-bg-layer-2);color:inherit;padding:8px 13px;white-space:nowrap}\n.dsh-ext button:hover{background:var(--dsw-alias-bg-layer-3)}.dsh-ext button:disabled{opacity:.5;cursor:default}\n.dsh-ext :is(button,input,select,textarea):focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:3px}\n.dsh-ext-card{border:1px solid var(--dsw-alias-border-l4);border-radius:16px;margin-top:20px;background:var(--dsw-alias-bg-layer-2);overflow:hidden}\n.dsh-ext-card>header{padding:18px 20px;border-bottom:1px solid var(--dsw-alias-border-l4)}.dsh-ext-count{font-size:11px;font-weight:400;color:var(--dsw-alias-label-tertiary)}\n.dsh-ext-empty{padding:32px 20px}.dsh-ext-empty strong{font-size:14px;font-weight:500}.dsh-ext-empty p{margin:6px 0 0}\n.dsh-ext ul{list-style:none;padding:0;margin:0}.dsh-ext li{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--dsw-alias-border-l4)}.dsh-ext li:last-child{border:0}\n.dsh-ext-details{display:flex;flex-direction:column;gap:5px;min-width:0}.dsh-ext-details strong{font-size:14px}.dsh-ext-details code{font-size:12px;color:var(--dsw-alias-label-secondary);overflow-wrap:anywhere}\n.dsh-ext-runtime{display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:12px;color:var(--dsw-alias-label-tertiary)}\n.dsh-ext-status{width:7px;height:7px;border-radius:50%;background:#858585;box-shadow:0 0 0 3px color-mix(in srgb,#858585 16%,transparent)}\n.dsh-ext-status-available{background:#38a169;box-shadow:0 0 0 3px color-mix(in srgb,#38a169 18%,transparent)}.dsh-ext-status-waiting{background:#d69e2e;box-shadow:0 0 0 3px color-mix(in srgb,#d69e2e 18%,transparent)}\n.dsh-ext-runtime details{width:100%;margin-top:2px}.dsh-ext-runtime summary{width:max-content;cursor:pointer;color:var(--dsw-alias-label-secondary);user-select:none}.dsh-ext-runtime summary:hover{color:var(--dsw-alias-label-primary)}\n.dsh-ext-runtime .dsh-ext-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.dsh-ext-runtime .dsh-ext-tools li{display:block;border:0;padding:4px 8px;border-radius:6px;background:var(--dsw-alias-bg-layer-3)}\n.dsh-ext-form{padding:20px;border-top:1px solid var(--dsw-alias-border-l4)}.dsh-ext fieldset{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:16px}.dsh-ext label{display:flex;flex-direction:column;gap:7px;font-size:13px}\n.dsh-ext input,.dsh-ext select,.dsh-ext textarea{box-sizing:border-box;min-width:0;width:100%;font:inherit;color:inherit;background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l4);border-radius:8px;padding:10px}.dsh-ext textarea{resize:vertical}\n.dsh-ext-actions{display:flex;justify-content:flex-end;gap:8px;grid-column:1/-1}.dsh-ext fieldset>p{grid-column:1/-1;margin:0}.dsh-ext-notice{padding:12px 16px;border:1px solid var(--dsw-alias-border-l4);border-radius:10px}.dsh-ext-footnote{padding:0 4px}\n.dsh-ext-row-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}.dsh-ext .dsh-ext-danger{color:#e98282}.dsh-ext-inline-form{width:100%;padding:14px 0 2px;border:0}.dsh-skill-edit-form{margin-top:12px;padding:14px;border-radius:10px;background:var(--dsw-alias-bg-layer-1)}\n.dsh-confirm{box-sizing:border-box;width:min(430px,calc(100vw - 32px));padding:22px;border:1px solid var(--dsw-alias-border-l4);border-radius:16px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);box-shadow:0 20px 60px rgba(0,0,0,.28);font:inherit}.dsh-confirm::backdrop{background:rgba(10,12,16,.48);backdrop-filter:blur(3px)}\n.dsh-confirm-icon{display:grid;place-items:center;width:34px;height:34px;margin-bottom:16px;border-radius:10px;background:color-mix(in srgb,#e05252 14%,transparent);color:#e98282;font-size:19px;font-weight:700}.dsh-confirm-copy h3{margin:0;font-size:16px}.dsh-confirm-copy p{margin:8px 0 0;color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.65}.dsh-confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}.dsh-confirm button{font:inherit;font-size:13px;cursor:pointer;border:1px solid var(--dsw-alias-border-l4);border-radius:9px;background:var(--dsw-alias-bg-layer-2);color:inherit;padding:8px 14px}.dsh-confirm button:hover{background:var(--dsw-alias-bg-layer-3)}.dsh-confirm button:disabled{opacity:.5;cursor:default}.dsh-confirm button:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:3px}.dsh-confirm .dsh-confirm-delete{border-color:color-mix(in srgb,#e05252 45%,var(--dsw-alias-border-l4));background:#b83232;color:#fff}.dsh-confirm .dsh-confirm-delete:hover{background:#c63b3b}\n.dsh-ext-heading-actions{display:flex;gap:8px;align-items:center}.dsh-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n.dsh-skill-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}.dsh-skill-stats>div{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--dsw-alias-border-l4);border-radius:12px;background:var(--dsw-alias-bg-layer-2)}.dsh-skill-stats strong{font-size:20px}.dsh-skill-stats span{font-size:12px;color:var(--dsw-alias-label-tertiary)}\n.dsh-skill-search{margin-top:14px}.dsh-skill-search input{padding-left:13px}.dsh-skill-manager>.dsh-ext-form{margin-top:14px;border:1px solid var(--dsw-alias-border-l4);border-radius:14px;background:var(--dsw-alias-bg-layer-2)}\n.dsh-skill-filters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.dsh-skill-filters label{gap:5px;font-size:11px;color:var(--dsw-alias-label-tertiary)}.dsh-skill-filters select{padding:8px 10px;color:var(--dsw-alias-label-primary)}\n.dsh-skill-source-manager{margin-top:14px}.dsh-skill-source-manager>summary{cursor:pointer;padding:14px 18px;font-size:14px;font-weight:600;user-select:none}.dsh-skill-source-manager[open]>summary{border-bottom:1px solid var(--dsw-alias-border-l4)}\n.dsh-skill-source-manager li{padding:11px 18px;flex-wrap:wrap}.dsh-skill-source-title{display:flex;align-items:flex-start;gap:11px;min-width:0}.dsh-skill-source-title>.dsh-ext-status{margin-top:6px;flex:0 0 auto}.dsh-skill-source-title>div{display:flex;min-width:0;flex-direction:column;gap:3px}.dsh-skill-source-title code{font-size:11px;color:var(--dsw-alias-label-tertiary);overflow-wrap:anywhere}.dsh-skill-source-title small{font-size:11px;color:#e98282}\n.dsh-skill-library{margin-top:14px}.dsh-skill-group-editor{display:flex;align-items:flex-end;gap:8px}.dsh-skill-group-editor label{flex:1}.dsh-skill-group-editor input{padding:7px 9px}.dsh-skill-group-editor button{padding:7px 10px}\n.dsh-skill-row{display:block!important;padding:15px 18px!important}.dsh-skill-row-main{min-width:0}.dsh-skill-name{display:flex;align-items:center;gap:9px}.dsh-skill-name strong{font-size:14px}.dsh-skill-row-main>p{margin:6px 0 3px}.dsh-skill-row-main>code{font-size:11px;color:var(--dsw-alias-label-tertiary)}\n.dsh-skill-badge{font-size:11px;padding:2px 7px;border-radius:999px;background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-secondary)}.dsh-skill-badge-group{color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 12%,transparent)}.dsh-skill-badge-invalid{color:#e98282}.dsh-skill-badge-shadowed{color:#a98af8}.dsh-ext-status-invalid{background:#e05252;box-shadow:0 0 0 3px color-mix(in srgb,#e05252 18%,transparent)}.dsh-ext-status-shadowed{background:#8b5cf6;box-shadow:0 0 0 3px color-mix(in srgb,#8b5cf6 18%,transparent)}.dsh-ext-status-manual{background:#d69e2e;box-shadow:0 0 0 3px color-mix(in srgb,#d69e2e 18%,transparent)}\n.dsh-skill-row details{margin-top:9px}.dsh-skill-row summary{width:max-content;cursor:pointer;font-size:12px;color:var(--dsw-alias-label-secondary)}.dsh-skill-detail{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px;padding:14px;border-radius:10px;background:var(--dsw-alias-bg-layer-1)}.dsh-skill-detail>p{grid-column:1/-1;margin:0}.dsh-skill-detail p strong,.dsh-skill-detail>div>strong{display:block;margin-bottom:5px;color:var(--dsw-alias-label-secondary);font-size:12px}\n.dsh-skill-invocation{display:flex;flex-direction:column;gap:7px}.dsh-skill-invocation label,.dsh-skill-create-flags label{display:flex;flex-direction:row;align-items:center;gap:5px}.dsh-ext input[type=checkbox]{width:auto;min-width:auto}.dsh-skill-detail ul,.dsh-skill-detail li{display:block!important;margin:0;padding:0!important;border:0!important}.dsh-skill-resources{display:flex!important;flex-wrap:wrap!important;gap:5px}.dsh-skill-resources li{padding:3px 6px!important;border-radius:5px!important;background:var(--dsw-alias-bg-layer-3)!important}\n.dsh-ext-span{grid-column:1/-1}.dsh-skill-create-flags{display:flex;flex-direction:column;gap:7px;font-size:13px}.dsh-skill-create-flags>span{margin-bottom:1px}.dsh-skill-source>.dsh-ext-notice{margin:12px 18px}.dsh-skill-source>.dsh-ext-empty{padding:18px}\n@media(max-width:600px){.dsh-ext fieldset,.dsh-skill-detail,.dsh-skill-filters{grid-template-columns:1fr}.dsh-ext-heading{align-items:flex-start;flex-direction:column}.dsh-ext-heading-actions{flex-wrap:wrap}.dsh-ext-card>header{padding:14px}.dsh-ext li{padding:14px}.dsh-skill-stats{grid-template-columns:repeat(2,1fr)}.dsh-skill-group-editor{align-items:stretch;flex-direction:column}}\n\n/* Skill Catalog Takeover Styles */\n.dsh-catalog-section{margin-top:14px}\n.dsh-catalog-header-actions{display:flex;align-items:center;gap:8px}\n.dsh-catalog-group-card{margin-top:16px;border:1px solid var(--dsw-alias-border-l4);border-radius:14px;background:var(--dsw-alias-bg-layer-2);overflow:hidden}\n.dsh-catalog-group-header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:color-mix(in srgb,var(--dsw-alias-bg-layer-3) 50%,transparent);border-bottom:1px solid var(--dsw-alias-border-l4);cursor:pointer;user-select:none}\n.dsh-catalog-group-header::-webkit-details-marker{display:none}\n.dsh-catalog-group-header::marker{content:""}\n.dsh-catalog-group-card:not([open]) .dsh-catalog-group-header{border-bottom:0}\n.dsh-catalog-group-title{display:flex;align-items:center;gap:10px}\n.dsh-catalog-group-title::before{content:"\u25B6";display:inline-block;font-size:11px;color:var(--dsw-alias-label-tertiary);transition:transform .2s ease}\n.dsh-catalog-group-card[open] .dsh-catalog-group-title::before{transform:rotate(90deg)}\n.dsh-catalog-group-title h4{margin:0;font-size:14px;font-weight:600}\n.dsh-catalog-group-actions{display:flex;align-items:center;gap:6px}\n.dsh-catalog-group-actions button{padding:4px 10px;font-size:12px;border-radius:7px}\n.dsh-catalog-tool-item{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;border-bottom:1px solid var(--dsw-alias-border-l4);transition:background .15s ease}\n.dsh-catalog-tool-item:last-child{border-bottom:0}\n.dsh-catalog-tool-item:hover{background:color-mix(in srgb,var(--dsw-alias-bg-layer-3) 40%,transparent)}\n.dsh-catalog-tool-info{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}\n.dsh-catalog-tool-header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}\n.dsh-catalog-tool-header code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;font-weight:600;color:var(--dsw-alias-brand-primary)}\n.dsh-catalog-tool-info p{margin:0;font-size:12px;color:var(--dsw-alias-label-secondary);line-height:1.5}\n.dsh-catalog-switch-wrap{display:flex;align-items:center;gap:10px;flex-shrink:0}\n.dsh-catalog-switch-label{font-size:12px;font-weight:500}\n.dsh-catalog-switch{position:relative;display:inline-block;width:40px;height:22px;cursor:pointer}\n.dsh-catalog-switch input{opacity:0;width:0;height:0;position:absolute}\n.dsh-catalog-slider{position:absolute;cursor:pointer;inset:0;background:var(--dsw-alias-bg-layer-4,#3b3b3b);border:1px solid var(--dsw-alias-border-l4);border-radius:22px;transition:.2s}\n.dsh-catalog-slider:before{position:absolute;content:"";height:16px;width:16px;left:2px;bottom:2px;background:#fff;border-radius:50%;transition:.2s}\n.dsh-catalog-switch input:checked + .dsh-catalog-slider{background:var(--dsw-alias-brand-primary,#3182ce);border-color:var(--dsw-alias-brand-primary,#3182ce)}\n.dsh-catalog-switch input:checked + .dsh-catalog-slider:before{transform:translateX(18px)}\n.dsh-catalog-switch input:disabled + .dsh-catalog-slider{opacity:.4;cursor:not-allowed}\n.dsh-catalog-tool-details{margin-top:4px;width:100%}\n.dsh-catalog-tool-details summary{width:max-content;cursor:pointer;font-size:12px;color:var(--dsw-alias-label-secondary);user-select:none;transition:color .15s}\n.dsh-catalog-tool-details summary:hover{color:var(--dsw-alias-label-primary)}\n.dsh-catalog-tool-details p{margin:6px 0 2px;font-size:12px;color:var(--dsw-alias-label-tertiary);line-height:1.55;background:var(--dsw-alias-bg-layer-1);padding:8px 12px;border-radius:8px;border:1px solid var(--dsw-alias-border-l4)}\n\n/* MCP Reconnect Slider */\n.dsh-mcp-slider-group{grid-column:1/-1;display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:10px;background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l4)}\n.dsh-mcp-slider-header{display:flex;justify-content:space-between;align-items:center}\n.dsh-mcp-slider-header label{font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary)}\n.dsh-mcp-slider-badge{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 14%,transparent)}\n.dsh-mcp-slider-group input[type=range]{width:100%;cursor:pointer;accent-color:var(--dsw-alias-brand-primary);margin:4px 0}\n.dsh-mcp-slider-hint{margin:0;font-size:12px;color:var(--dsw-alias-label-tertiary);line-height:1.4}\n\n\n\n/* Main Panel Page Layout */\n.dsh-ext-page{box-sizing:border-box;height:100%;display:flex;flex-direction:column;align-items:center;overflow:auto;padding:0 clamp(24px,4vw,48px) 48px;color:var(--dsw-alias-label-primary)}\n.dsh-ext-page>*{width:100%;max-width:960px}\n.dsh-ext-page-head{box-sizing:border-box;padding-top:28px}\n[data-platform=darwin] .dsh-ext-page-head{padding-top:calc(28px + var(--dsh-frame-top-clearance,0px))}\n.dsh-ext-page-title{margin:0;font-size:20px;font-weight:500;line-height:28px}\n.dsh-ext-page-intro{margin:4px 0 0;font-size:13px;line-height:20px;color:var(--dsw-alias-label-secondary)}\n.dsh-ext-page-tabs{display:flex;gap:8px;margin-top:20px;border-bottom:1px solid var(--dsw-alias-border-l4);padding-bottom:12px}\n.dsh-ext-page-tabs button{font:inherit;font-size:13px;cursor:pointer;border:1px solid var(--dsw-alias-border-l4);border-radius:9px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);padding:6px 14px;transition:all .15s ease}\n.dsh-ext-page-tabs button:hover{background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-primary)}\n.dsh-ext-page-tabs button.is-active{background:var(--dsw-alias-brand-primary);color:#fff;border-color:var(--dsw-alias-brand-primary);font-weight:500}\n.dsh-ext-page-body{width:100%;max-width:960px}\n';
 
 // src/client/index.jsx
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -381,17 +395,20 @@ function apply(ctx) {
     return ok;
   };
   const face = { hooks: { manager: controller }, request };
-  const section = (id, kind) => ctx.slots.inject("settings.section", () => ctx.slots.register({
-    name: "settings.section",
-    id,
-    order: kind === "skill" ? 16 : kind === "mcp" ? 17 : 18,
-    label: () => t(kind === "skill" ? "navSkill" : kind === "mcp" ? "navMcp" : "navCatalog"),
+  const PANEL_ID = "skill-mcp";
+  ctx.slots.inject("main", () => ctx.slots.register({
+    name: "main",
+    key: PANEL_ID,
     locale: namespace,
     inject: () => face
-  }, kind === "skill" ? SkillSection : kind === "mcp" ? McpSection : CatalogSection));
-  section("skill-manager", "skill");
-  section("mcp-manager", "mcp");
-  section("skill-catalog", "catalog");
+  }, SkillMcpPage));
+  ctx.slots.inject("sidebar.panellist", () => ctx.slots.register({
+    name: "sidebar.panellist",
+    id: PANEL_ID,
+    order: 21,
+    locale: namespace,
+    label: () => t("panel")
+  }, SkillMcpIcon));
 }
 function SkillSection({ t, useManager, request }) {
   const state = useManager((value) => value);
@@ -962,8 +979,9 @@ function SkillSourceForm({ source, t, busy, onSave, onCancel }) {
 }
 function McpForm({ row, t, busy, onSave, onCancel }) {
   const prefix = (0, import_react.useId)();
-  const initial = row?.configuration ?? { transport: "stdio", command: "", args: [], cwd: "" };
+  const initial = row?.configuration ?? { transport: "stdio", command: "", args: [], cwd: "", reconnectInterval: 7 };
   const [transport, setTransport] = (0, import_react.useState)(initial.transport);
+  const [reconnectInterval, setReconnectInterval] = (0, import_react.useState)(initial.reconnectInterval ?? 7);
   const field = (name, required = true, multiline = false, value = "") => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { htmlFor: `${prefix}-${name}`, children: [
     t(name),
     multiline ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", { id: `${prefix}-${name}`, name, rows: 3, defaultValue: value }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { id: `${prefix}-${name}`, name, required, autoComplete: "off", defaultValue: value, ...name === "id" ? { pattern: "[A-Za-z0-9_\\-]{1,32}", maxLength: 32 } : {} })
@@ -971,7 +989,7 @@ function McpForm({ row, t, busy, onSave, onCancel }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("form", { className: row ? "dsh-ext-inline-form" : "dsh-ext-form", onSubmit: (event) => {
     event.preventDefault();
     const data = Object.fromEntries(new FormData(event.currentTarget));
-    const configuration = JSON.stringify(transport === "stdio" ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd } : { transport, url: data.url });
+    const configuration = JSON.stringify(transport === "stdio" ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd, reconnectInterval } : { transport, url: data.url, reconnectInterval });
     void onSave({ id: row?.id ?? data.id, configuration });
   }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("fieldset", { disabled: busy, children: [
     !row && field("id"),
@@ -988,6 +1006,29 @@ function McpForm({ row, t, busy, onSave, onCancel }) {
       field("args", false, true, (initial.args ?? []).join("\n")),
       field("cwd", false, false, initial.cwd)
     ] }) : field("url", true, false, initial.url),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-mcp-slider-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-mcp-slider-header", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: `${prefix}-reconnect`, children: t("reconnectInterval") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "dsh-mcp-slider-badge", children: [
+          reconnectInterval,
+          " ",
+          t("seconds")
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "input",
+        {
+          id: `${prefix}-reconnect`,
+          type: "range",
+          min: "3",
+          max: "60",
+          step: "1",
+          value: reconnectInterval,
+          onChange: (event) => setReconnectInterval(Number(event.target.value))
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-mcp-slider-hint", children: t("reconnectIntervalDesc") })
+    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: t("secret") }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ext-actions", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: onCancel, children: t("cancel") }),
@@ -998,6 +1039,7 @@ function McpForm({ row, t, busy, onSave, onCancel }) {
 function AddForm({ kind, t, busy, onSave, onCancel }) {
   const prefix = (0, import_react.useId)();
   const [transport, setTransport] = (0, import_react.useState)("stdio");
+  const [reconnectInterval, setReconnectInterval] = (0, import_react.useState)(7);
   const field = (name, required = true, multiline = false) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { htmlFor: `${prefix}-${name}`, children: [
     t(name),
     multiline ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", { id: `${prefix}-${name}`, name, rows: 3 }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { id: `${prefix}-${name}`, name, required, autoComplete: "off", ...name === "id" ? { pattern: "[A-Za-z0-9_\\-]{1,32}", maxLength: 32 } : {} })
@@ -1007,7 +1049,7 @@ function AddForm({ kind, t, busy, onSave, onCancel }) {
     const data = Object.fromEntries(new FormData(event.currentTarget));
     const args = kind === "skill" ? { directory: data.directory } : {
       id: data.id,
-      configuration: JSON.stringify(transport === "stdio" ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd } : { transport, url: data.url })
+      configuration: JSON.stringify(transport === "stdio" ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd, reconnectInterval } : { transport, url: data.url, reconnectInterval })
     };
     void onSave(args);
   }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("fieldset", { disabled: busy, children: [
@@ -1026,6 +1068,29 @@ function AddForm({ kind, t, busy, onSave, onCancel }) {
         field("args", false, true),
         field("cwd", false)
       ] }) : field("url"),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-mcp-slider-group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-mcp-slider-header", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: `${prefix}-reconnect`, children: t("reconnectInterval") }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "dsh-mcp-slider-badge", children: [
+            reconnectInterval,
+            " ",
+            t("seconds")
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "input",
+          {
+            id: `${prefix}-reconnect`,
+            type: "range",
+            min: "3",
+            max: "60",
+            step: "1",
+            value: reconnectInterval,
+            onChange: (event) => setReconnectInterval(Number(event.target.value))
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-mcp-slider-hint", children: t("reconnectIntervalDesc") })
+      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: t("secret") })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ext-actions", children: [
@@ -1181,5 +1246,30 @@ function CatalogSection({ t, useManager, request }) {
     ] }, group.id))
   ] });
 }
+function SkillMcpIcon({ size = 16 }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { viewBox: "0 0 16 16", width: size, height: size, fill: "none", "aria-hidden": "true", style: { display: "block" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M5.5 2v3M10.5 2v3M3.5 5h9v3.8c0 2.2-1.8 4-4 4h-1c-2.2 0-4-1.8-4-4V5z", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round", strokeLinejoin: "round" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M8 12.8v1.7", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round" })
+  ] });
+}
+function SkillMcpPage({ t, useManager, request }) {
+  const [activeTab, setActiveTab] = (0, import_react.useState)("skills");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ext-page", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { className: "dsh-ext-page-head", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "dsh-ext-page-title", children: t("panelTitle") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-ext-page-intro", children: t("panelIntro") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ext-page-tabs", role: "tablist", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", role: "tab", "aria-selected": activeTab === "skills", className: activeTab === "skills" ? "is-active" : "", onClick: () => setActiveTab("skills"), children: t("navSkill") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", role: "tab", "aria-selected": activeTab === "mcp", className: activeTab === "mcp" ? "is-active" : "", onClick: () => setActiveTab("mcp"), children: t("navMcp") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", role: "tab", "aria-selected": activeTab === "catalog", className: activeTab === "catalog" ? "is-active" : "", onClick: () => setActiveTab("catalog"), children: t("navCatalog") })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("main", { className: "dsh-ext-page-body", children: [
+      activeTab === "skills" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SkillSection, { t, useManager, request }),
+      activeTab === "mcp" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(McpSection, { t, useManager, request }),
+      activeTab === "catalog" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CatalogSection, { t, useManager, request })
+    ] })
+  ] });
+}
 
 return module.exports;}});

package/locale/en.json

@@ -0,0 +1,6 @@
+{
+  "meta": {
+    "title": "Skills & MCP",
+    "description": "Manage external Skill paths and MCP server connections for DeepSeek Harness."
+  }
+}

package/locale/zh.json

@@ -0,0 +1,6 @@
+{
+  "meta": {
+    "title": "技能与 MCP 管理",
+    "description": "管理外部 Skill 技能路径与 MCP 服务连接，赋予模型外部工具调用能力。"
+  }
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@civilization/deepseek-harness-skill-mcp",
-  "version": "0.3.1",
-  "description": "Skill path and MCP server management for DeepSeek Harness Web",
+  "version": "0.3.3",
+  "description": "管理外部 Skill 技能路径与 MCP 服务连接，赋予模型外部工具调用能力。",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -18,6 +18,8 @@
   "exports": {
     ".": "./src/index.js",
     "./client": "./lib/client.js",
+    "./locale/*.json": "./locale/*.json",
+    "./icon": "./icon.svg",
     "./mcp-sse": "./src/mcp-sse.js",
     "./package.json": "./package.json"
   },
@@ -25,6 +27,8 @@
     "src",
     "lib",
     "skills",
+    "locale/*.json",
+    "icon.svg",
     "cordis.patch.yml",
     "README.md",
     "LICENSE"
@@ -35,8 +39,11 @@
     },
     "client": {
       "platform": "web",
+      "immediately": true,
       "inject": [
-        "@deepseek-ai/dsh-client-ui-settings"
+        "@deepseek-ai/dsh-client-locale",
+        "@deepseek-ai/dsh-client-ui-layout",
+        "@deepseek-ai/dsh-client-ui-sidebar"
       ]
     }
   },
@@ -44,16 +51,17 @@
     "test": "node --test tests/*.test.js",
     "build": "node scripts/build.js",
     "web": "node scripts/web.js",
-    "setup": "node scripts/setup.js"
+    "setup": "node scripts/setup.js",
+    "prepack": "pnpm build"
   },
   "engines": {
     "node": ">=22.19.0"
   },
   "packageManager": "pnpm@10.33.0",
   "dependencies": {
-    "@deepseek-ai/dsh-mcp-client": "0.2.0-rc.2",
-    "@deepseek-ai/dsh-skill-filesystem": "0.2.0-rc.2",
-    "@deepseek-ai/schemastery": "3.18.2",
+    "@deepseek-ai/dsh-mcp-client": ">=0.2.1-rc.2 <0.3.0",
+    "@deepseek-ai/dsh-skill-filesystem": ">=0.2.1-rc.2 <0.3.0",
+    "@deepseek-ai/schemastery": "~3.18.5",
     "@modelcontextprotocol/sdk": "1.29.0",
     "yaml": "^2.9.0"
   },
@@ -62,10 +70,10 @@
     "@deepseek-ai/dsh-tools": ">=0.1.5-rc.2"
   },
   "devDependencies": {
-    "@deepseek-ai/cordis": "4.0.4",
-    "@deepseek-ai/dsh-skill": "0.2.0-rc.2",
-    "@deepseek-ai/dsh-system-prompt": "0.2.0-rc.2",
-    "@deepseek-ai/dsh-tools": "0.2.0-rc.2",
+    "@deepseek-ai/cordis": "4.0.5",
+    "@deepseek-ai/dsh-skill": "0.2.1-rc.2",
+    "@deepseek-ai/dsh-system-prompt": "0.2.1-rc.2",
+    "@deepseek-ai/dsh-tools": "0.2.1-rc.2",
     "esbuild": "^0.28.2",
     "react": "^19.2.8"
   }

package/src/client/index.jsx

@@ -31,15 +31,15 @@ export function apply(ctx) {
     return ok
   }
   const face = { hooks: { manager: controller }, request }
-  // The three sections share one controller and managed patch; each kind gets its own settings page.
-  const section = (id, kind) => ctx.slots.inject('settings.section', () => ctx.slots.register({
-    name: 'settings.section', id, order: kind === 'skill' ? 16 : kind === 'mcp' ? 17 : 18,
-    label: () => t(kind === 'skill' ? 'navSkill' : kind === 'mcp' ? 'navMcp' : 'navCatalog'), locale: namespace,
+    const PANEL_ID = 'skill-mcp'
+  ctx.slots.inject('main', () => ctx.slots.register({
+    name: 'main', key: PANEL_ID, locale: namespace,
     inject: () => face,
-  }, kind === 'skill' ? SkillSection : kind === 'mcp' ? McpSection : CatalogSection))
-  section('skill-manager', 'skill')
-  section('mcp-manager', 'mcp')
-  section('skill-catalog', 'catalog')
+  }, SkillMcpPage))
+  ctx.slots.inject('sidebar.panellist', () => ctx.slots.register({
+    name: 'sidebar.panellist', id: PANEL_ID, order: 21, locale: namespace,
+    label: () => t('panel'),
+  }, SkillMcpIcon))
 }
 
 export function SkillSection({ t, useManager, request }) {
@@ -343,8 +343,9 @@ function SkillSourceForm({ source, t, busy, onSave, onCancel }) {
 
 function McpForm({ row, t, busy, onSave, onCancel }) {
   const prefix = useId()
-  const initial = row?.configuration ?? { transport: 'stdio', command: '', args: [], cwd: '' }
+  const initial = row?.configuration ?? { transport: 'stdio', command: '', args: [], cwd: '', reconnectInterval: 7 }
   const [transport, setTransport] = useState(initial.transport)
+  const [reconnectInterval, setReconnectInterval] = useState(initial.reconnectInterval ?? 7)
   const field = (name, required = true, multiline = false, value = '') => <label htmlFor={`${prefix}-${name}`}>{t(name)}{multiline
     ? <textarea id={`${prefix}-${name}`} name={name} rows={3} defaultValue={value} />
     : <input id={`${prefix}-${name}`} name={name} required={required} autoComplete="off" defaultValue={value} {...(name === 'id' ? { pattern: '[A-Za-z0-9_\\-]{1,32}', maxLength: 32 } : {})} />}</label>
@@ -352,13 +353,29 @@ function McpForm({ row, t, busy, onSave, onCancel }) {
     event.preventDefault()
     const data = Object.fromEntries(new FormData(event.currentTarget))
     const configuration = JSON.stringify(transport === 'stdio'
-      ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd }
-      : { transport, url: data.url })
+      ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd, reconnectInterval }
+      : { transport, url: data.url, reconnectInterval })
     void onSave({ id: row?.id ?? data.id, configuration })
   }}><fieldset disabled={busy}>{!row && field('id')}
     <label htmlFor={`${prefix}-transport`}>{t('transport')}<select id={`${prefix}-transport`} value={transport} onChange={event => setTransport(event.target.value)}>
       <option value="stdio">{t('stdio')}</option><option value="streamable-http">{t('http')}</option><option value="sse">{t('sse')}</option></select></label>
     {transport === 'stdio' ? <>{field('command', true, false, initial.command)}{field('args', false, true, (initial.args ?? []).join('\n'))}{field('cwd', false, false, initial.cwd)}</> : field('url', true, false, initial.url)}
+    <div className="dsh-mcp-slider-group">
+      <div className="dsh-mcp-slider-header">
+        <label htmlFor={`${prefix}-reconnect`}>{t('reconnectInterval')}</label>
+        <span className="dsh-mcp-slider-badge">{reconnectInterval} {t('seconds')}</span>
+      </div>
+      <input
+        id={`${prefix}-reconnect`}
+        type="range"
+        min="3"
+        max="60"
+        step="1"
+        value={reconnectInterval}
+        onChange={event => setReconnectInterval(Number(event.target.value))}
+      />
+      <p className="dsh-mcp-slider-hint">{t('reconnectIntervalDesc')}</p>
+    </div>
     <p>{t('secret')}</p>
     <div className="dsh-ext-actions"><button type="button" onClick={onCancel}>{t('cancel')}</button><button type="submit">{t(busy ? 'saving' : row ? 'saveChanges' : 'save')}</button></div>
   </fieldset></form>
@@ -367,6 +384,7 @@ function McpForm({ row, t, busy, onSave, onCancel }) {
 function AddForm({ kind, t, busy, onSave, onCancel }) {
   const prefix = useId()
   const [transport, setTransport] = useState('stdio')
+  const [reconnectInterval, setReconnectInterval] = useState(7)
   const field = (name, required = true, multiline = false) => <label htmlFor={`${prefix}-${name}`}>{t(name)}{multiline
     ? <textarea id={`${prefix}-${name}`} name={name} rows={3} />
     : <input id={`${prefix}-${name}`} name={name} required={required} autoComplete="off" {...(name === 'id' ? { pattern: '[A-Za-z0-9_\\-]{1,32}', maxLength: 32 } : {})} />}</label>
@@ -375,14 +393,30 @@ function AddForm({ kind, t, busy, onSave, onCancel }) {
     const data = Object.fromEntries(new FormData(event.currentTarget))
     const args = kind === 'skill' ? { directory: data.directory } : {
       id: data.id, configuration: JSON.stringify(transport === 'stdio'
-        ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd }
-        : { transport, url: data.url }),
+        ? { transport, command: data.command, args: data.args.split(/\r?\n/).filter(Boolean), cwd: data.cwd, reconnectInterval }
+        : { transport, url: data.url, reconnectInterval }),
     }
     void onSave(args)
   }}><fieldset disabled={busy}>{kind === 'skill' ? field('directory') : <>{field('id')}
       <label htmlFor={`${prefix}-transport`}>{t('transport')}<select id={`${prefix}-transport`} value={transport} onChange={event => setTransport(event.target.value)}>
         <option value="stdio">{t('stdio')}</option><option value="streamable-http">{t('http')}</option><option value="sse">{t('sse')}</option></select></label>
       {transport === 'stdio' ? <>{field('command')}{field('args', false, true)}{field('cwd', false)}</> : field('url')}
+      <div className="dsh-mcp-slider-group">
+        <div className="dsh-mcp-slider-header">
+          <label htmlFor={`${prefix}-reconnect`}>{t('reconnectInterval')}</label>
+          <span className="dsh-mcp-slider-badge">{reconnectInterval} {t('seconds')}</span>
+        </div>
+        <input
+          id={`${prefix}-reconnect`}
+          type="range"
+          min="3"
+          max="60"
+          step="1"
+          value={reconnectInterval}
+          onChange={event => setReconnectInterval(Number(event.target.value))}
+        />
+        <p className="dsh-mcp-slider-hint">{t('reconnectIntervalDesc')}</p>
+      </div>
       <p>{t('secret')}</p>
     </>}
     <div className="dsh-ext-actions"><button type="button" onClick={onCancel}>{t('cancel')}</button><button type="submit">{t(busy ? 'saving' : 'save')}</button></div>
@@ -532,3 +566,31 @@ export function CatalogSection({ t, useManager, request }) {
   </section>
 }
 
+
+
+export function SkillMcpIcon({ size = 16 }) {
+  return <svg viewBox="0 0 16 16" width={size} height={size} fill="none" aria-hidden="true" style={{ display: "block" }}>
+    <path d="M5.5 2v3M10.5 2v3M3.5 5h9v3.8c0 2.2-1.8 4-4 4h-1c-2.2 0-4-1.8-4-4V5z" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round" strokeLinejoin="round" />
+    <path d="M8 12.8v1.7" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round" />
+  </svg>
+}
+
+export function SkillMcpPage({ t, useManager, request }) {
+  const [activeTab, setActiveTab] = useState("skills")
+  return <div className="dsh-ext-page">
+    <header className="dsh-ext-page-head">
+      <h1 className="dsh-ext-page-title">{t("panelTitle")}</h1>
+      <p className="dsh-ext-page-intro">{t("panelIntro")}</p>
+      <div className="dsh-ext-page-tabs" role="tablist">
+        <button type="button" role="tab" aria-selected={activeTab === "skills"} className={activeTab === "skills" ? "is-active" : ""} onClick={() => setActiveTab("skills")}>{t("navSkill")}</button>
+        <button type="button" role="tab" aria-selected={activeTab === "mcp"} className={activeTab === "mcp" ? "is-active" : ""} onClick={() => setActiveTab("mcp")}>{t("navMcp")}</button>
+        <button type="button" role="tab" aria-selected={activeTab === "catalog"} className={activeTab === "catalog" ? "is-active" : ""} onClick={() => setActiveTab("catalog")}>{t("navCatalog")}</button>
+      </div>
+    </header>
+    <main className="dsh-ext-page-body">
+      {activeTab === "skills" && <SkillSection t={t} useManager={useManager} request={request} />}
+      {activeTab === "mcp" && <McpSection t={t} useManager={useManager} request={request} />}
+      {activeTab === "catalog" && <CatalogSection t={t} useManager={useManager} request={request} />}
+    </main>
+  </div>
+}

package/src/client/locales.js

@@ -1,5 +1,8 @@
 /** Both dictionaries use the same key vocabulary; checked by tests. */
 export const zh = {
+  panel: '技能与 MCP',
+  panelTitle: '技能与外部扩展',
+  panelIntro: '管理自定义 Skill 技能库、MCP 工具服务与系统工具权限。',
   navSkill: 'Skill 管理', navMcp: 'MCP 管理',
   skillIntro: '配置一个或多个 Skill 路径；每个路径下可以包含多个技能。', mcpIntro: '管理外部工具服务器，让它们在当前配置中可用。',
   skills: 'Skill 路径', mcp: 'MCP 服务器', refresh: '刷新', add: '添加路径', addMcp: '添加服务器', newSkill: '新建 Skill',
@@ -51,8 +54,14 @@ export const zh = {
   noCatalogResultsHint: '请尝试修改搜索词或选择其他插件分组。',
   toolProtected: '核心保留',
   toolTakeoverHint: '此工具受 skill-catalog 统一管理。',
+  reconnectInterval: '重连周期阈值',
+  reconnectIntervalDesc: '服务端断开后自动探测并恢复连接的最大等待时间（范围 3–60 秒，默认 7 秒）。',
+  seconds: '秒',
 }
 export const en = {
+  panel: 'Skills & MCP',
+  panelTitle: 'Skills & External Extensions',
+  panelIntro: 'Manage custom Skill repositories, MCP tool servers, and tool permissions.',
   navSkill: 'Skills', navMcp: 'MCP',
   skillIntro: 'Configure one or more Skill paths; each path can contain multiple skills.', mcpIntro: 'Manage external tool servers for this configuration.',
   skills: 'Skill paths', mcp: 'MCP servers', refresh: 'Refresh', add: 'Add path', addMcp: 'Add server', newSkill: 'New Skill',
@@ -104,4 +113,7 @@ export const en = {
   noCatalogResultsHint: 'Try adjusting your search terms or filter.',
   toolProtected: 'Protected',
   toolTakeoverHint: 'This tool is managed under skill-catalog.',
+  reconnectInterval: 'Reconnect Interval',
+  reconnectIntervalDesc: 'Maximum wait time before retrying dropped connections (range 3–60s, default 7s).',
+  seconds: 's',
 }

package/src/client/styles.css

@@ -70,3 +70,25 @@
 .dsh-catalog-tool-details summary:hover{color:var(--dsw-alias-label-primary)}
 .dsh-catalog-tool-details p{margin:6px 0 2px;font-size:12px;color:var(--dsw-alias-label-tertiary);line-height:1.55;background:var(--dsw-alias-bg-layer-1);padding:8px 12px;border-radius:8px;border:1px solid var(--dsw-alias-border-l4)}
 
+/* MCP Reconnect Slider */
+.dsh-mcp-slider-group{grid-column:1/-1;display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:10px;background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l4)}
+.dsh-mcp-slider-header{display:flex;justify-content:space-between;align-items:center}
+.dsh-mcp-slider-header label{font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary)}
+.dsh-mcp-slider-badge{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 14%,transparent)}
+.dsh-mcp-slider-group input[type=range]{width:100%;cursor:pointer;accent-color:var(--dsw-alias-brand-primary);margin:4px 0}
+.dsh-mcp-slider-hint{margin:0;font-size:12px;color:var(--dsw-alias-label-tertiary);line-height:1.4}
+
+
+
+/* Main Panel Page Layout */
+.dsh-ext-page{box-sizing:border-box;height:100%;display:flex;flex-direction:column;align-items:center;overflow:auto;padding:0 clamp(24px,4vw,48px) 48px;color:var(--dsw-alias-label-primary)}
+.dsh-ext-page>*{width:100%;max-width:960px}
+.dsh-ext-page-head{box-sizing:border-box;padding-top:28px}
+[data-platform=darwin] .dsh-ext-page-head{padding-top:calc(28px + var(--dsh-frame-top-clearance,0px))}
+.dsh-ext-page-title{margin:0;font-size:20px;font-weight:500;line-height:28px}
+.dsh-ext-page-intro{margin:4px 0 0;font-size:13px;line-height:20px;color:var(--dsw-alias-label-secondary)}
+.dsh-ext-page-tabs{display:flex;gap:8px;margin-top:20px;border-bottom:1px solid var(--dsw-alias-border-l4);padding-bottom:12px}
+.dsh-ext-page-tabs button{font:inherit;font-size:13px;cursor:pointer;border:1px solid var(--dsw-alias-border-l4);border-radius:9px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);padding:6px 14px;transition:all .15s ease}
+.dsh-ext-page-tabs button:hover{background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-primary)}
+.dsh-ext-page-tabs button.is-active{background:var(--dsw-alias-brand-primary);color:#fff;border-color:var(--dsw-alias-brand-primary);font-weight:500}
+.dsh-ext-page-body{width:100%;max-width:960px}

package/src/mcp-sse.js

@@ -18,12 +18,26 @@ export const Config = Schema.object({
   url: Schema.string().required(),
   toolCallTimeoutMs: Schema.number().default(60_000),
   failOnStartupError: Schema.boolean().default(false),
+  reconnect: Schema.object({
+    enabled: Schema.boolean().default(true),
+    initialDelayMs: Schema.number().default(500),
+    maxDelayMs: Schema.number().default(7000),
+    maxAttempts: Schema.number().default(Number.MAX_SAFE_INTEGER),
+  }).default({}),
 })
 
 export async function apply(ctx, config) {
-  const client = new Client({ name: `dsh-sse-${config.serverName}`, version: '1.0.0' }, { capabilities: {} })
-  const transport = new SSEClientTransport(new URL(config.url))
+  const reconnectPolicy = {
+    enabled: config.reconnect?.enabled ?? true,
+    initialDelayMs: config.reconnect?.initialDelayMs ?? 500,
+    maxDelayMs: config.reconnect?.maxDelayMs ?? 7000,
+    maxAttempts: config.reconnect?.maxAttempts ?? Number.MAX_SAFE_INTEGER,
+  }
+
   let disposed = false
+  let reconnectTimer
+  let failedAttempts = 0
+  let currentGeneration
   let registrations = new Map()
   let synchronization = Promise.resolve()
 
@@ -31,13 +45,25 @@ export async function apply(ctx, config) {
     for (const dispose of registrations.values()) dispose()
     registrations = new Map()
   }
-  ctx.effect(() => () => {
-    disposed = true
-    clearTools()
-    void client.close().catch(() => {})
-  }, 'mcp-sse-client.connection')
 
-  const synchronizeTools = async () => {
+  const scheduleReconnect = (cause) => {
+    if (disposed || !reconnectPolicy.enabled) return
+    if (reconnectTimer !== undefined) return
+    failedAttempts++
+    if (failedAttempts > reconnectPolicy.maxAttempts) {
+      ctx.logger.error(`mcp-sse-client(${config.serverName}): giving up after ${reconnectPolicy.maxAttempts} failed reconnect attempts`)
+      return
+    }
+    const delayMs = Math.min(reconnectPolicy.maxDelayMs, reconnectPolicy.initialDelayMs * (2 ** Math.min(failedAttempts - 1, 30)))
+    ctx.logger.warn(`mcp-sse-client(${config.serverName}): connection lost or failed (${messageOf(cause)}); reconnecting in ${delayMs}ms (attempt ${failedAttempts})`)
+    reconnectTimer = setTimeout(() => {
+      reconnectTimer = undefined
+      void connectGeneration(false)
+    }, delayMs)
+    reconnectTimer.unref?.()
+  }
+
+  const synchronizeTools = async (client, generation) => {
     const definitions = new Map()
     let cursor
     do {
@@ -52,7 +78,7 @@ export async function apply(ctx, config) {
       }
       cursor = response.nextCursor
     } while (cursor)
-    if (disposed) return
+    if (disposed || generation.closed) return
     clearTools()
     const next = new Map()
     try {
@@ -64,21 +90,60 @@ export async function apply(ctx, config) {
     }
   }
 
-  client.setNotificationHandler(ToolListChangedNotificationSchema, () => {
-    synchronization = synchronization.then(synchronizeTools).catch(error => {
-      ctx.logger.warn(`mcp-sse-client(${config.serverName}): tool refresh failed: ${messageOf(error)}`)
+  async function connectGeneration(startup) {
+    if (disposed) return
+    const client = new Client({ name: `dsh-sse-${config.serverName}`, version: '1.0.0' }, { capabilities: {} })
+    const transport = new SSEClientTransport(new URL(config.url))
+    const generation = { client, transport, closed: false }
+    currentGeneration = generation
+
+    const onDisconnect = (err) => {
+      if (generation.closed || disposed) return
+      generation.closed = true
+      clearTools()
+      void client.close().catch(() => {})
+      if (currentGeneration === generation) {
+        scheduleReconnect(err ?? new Error('connection closed'))
+      }
+    }
+
+    client.onclose = () => onDisconnect()
+    client.onerror = (err) => onDisconnect(err)
+
+    client.setNotificationHandler(ToolListChangedNotificationSchema, () => {
+      if (generation.closed || disposed) return
+      synchronization = synchronization.then(() => synchronizeTools(client, generation)).catch(error => {
+        ctx.logger.warn(`mcp-sse-client(${config.serverName}): tool refresh failed: ${messageOf(error)}`)
+      })
     })
-  })
 
-  try {
-    await client.connect(transport)
-    await synchronizeTools()
-  } catch (error) {
-    clearTools()
-    await client.close().catch(() => {})
-    if (config.failOnStartupError) throw new Error(`mcp-sse-client(${config.serverName}): initial connection failed: ${messageOf(error)}`, { cause: error })
-    ctx.logger.warn(`mcp-sse-client(${config.serverName}): initial connection failed: ${messageOf(error)}`)
+    try {
+      await client.connect(transport)
+      await synchronizeTools(client, generation)
+      failedAttempts = 0
+      ctx.logger.info(`mcp-sse-client(${config.serverName}): connected and synchronized tools`)
+    } catch (error) {
+      onDisconnect(error)
+      if (startup && config.failOnStartupError) {
+        throw new Error(`mcp-sse-client(${config.serverName}): initial connection failed: ${messageOf(error)}`, { cause: error })
+      }
+    }
   }
+
+  ctx.effect(() => () => {
+    disposed = true
+    if (reconnectTimer !== undefined) {
+      clearTimeout(reconnectTimer)
+      reconnectTimer = undefined
+    }
+    clearTools()
+    if (currentGeneration && !currentGeneration.closed) {
+      currentGeneration.closed = true
+      void currentGeneration.client.close().catch(() => {})
+    }
+  }, 'mcp-sse-client.connection')
+
+  await connectGeneration(true)
 }
 
 function createTool(client, publicName, tool, timeout) {

package/src/store.js

@@ -39,12 +39,13 @@ function validateId(id) {
 }
 
 function parsePatch(value) {
-  if (!Array.isArray(value) || value.length !== 1 || !Array.isArray(value[0]?.insert)
-    || Object.keys(value[0]).join() !== 'insert') throw new Error('Expected one managed insert operation.')
+  if (!Array.isArray(value)) throw new Error('Expected patch array.')
+  const insertOp = value.find(row => row && typeof row === 'object' && Array.isArray(row.insert))
+  if (!insertOp) throw new Error('Expected one managed insert operation.')
   const ids = new Set()
   const managed = []
   const preserved = []
-  for (const row of value[0].insert) {
+  for (const row of insertOp.insert) {
     if (row?.id === 'extension-manager' && row.name === managerModule) {
       if (ids.has(row.id)) throw new Error('Duplicate extension id.')
       ids.add(row.id)
@@ -69,7 +70,8 @@ function parsePatch(value) {
     } else throw new Error('Unknown managed plugin module.')
     managed.push(row)
   }
-  return { managed, preserved }
+  const unmanagedRows = value.filter(row => row !== insertOp)
+  return { managed, preserved, unmanagedRows }
 }
 
 /** Validate the patch and return only extension rows owned by the manager. */
@@ -84,7 +86,8 @@ function markedRows(content) {
   if (start < 0 || end < start || content.indexOf(blockStart, start + blockStart.length) >= 0
     || content.indexOf(blockEnd, end + blockEnd.length) >= 0) throw new Error('Invalid dsh-skill-mcp managed block.')
   const bodyStart = start + blockStart.length
-  return { start, end: end + blockEnd.length, rows: validatePatch(parse(content.slice(bodyStart, end))) }
+  const parsed = parsePatch(parse(content.slice(bodyStart, end)))
+  return { start, end: end + blockEnd.length, rows: parsed.managed, unmanagedRows: parsed.unmanagedRows }
 }
 
 function legacyPatch(content) {
@@ -99,7 +102,10 @@ function renderBlock(rows) {
 function writeManagedRows(content, rows) {
   const marked = markedRows(content)
   const block = renderBlock(rows)
-  if (marked) return `${content.slice(0, marked.start)}${block}${content.slice(marked.end)}`
+  if (marked) {
+    const unmanaged = marked.unmanagedRows?.length ? `\n${stringify(marked.unmanagedRows).trimEnd()}\n` : ''
+    return `${content.slice(0, marked.start)}${block}${unmanaged}${content.slice(marked.end)}`
+  }
   const legacy = legacyPatch(content)
   if (legacy) return `${JSON.stringify([{ insert: [...legacy.preserved, ...rows] }], null, 2)}\n`
   if (/^[ \t]*\[\][ \t]*$/m.test(content)) return content.replace(/^[ \t]*\[\][ \t]*$/m, block)
@@ -121,10 +127,28 @@ export class ExtensionStore {
   /** Migrate managed MCP rows so an unavailable server cannot reject profile startup. */
   async ensureNonFatalMcpStartup() {
     const rows = await this.read()
-    if (!rows.some(row => row.config.serverName && row.config.failOnStartupError !== false)) return
+    let needsUpdate = false
+    for (const row of rows) {
+      if (row.config?.serverName) {
+        if (row.config.failOnStartupError !== false || !row.config.reconnect || row.config.reconnect.maxAttempts !== Number.MAX_SAFE_INTEGER) {
+          needsUpdate = true
+          break
+        }
+      }
+    }
+    if (!needsUpdate) return
     await this.update(current => {
       for (const row of current) {
-        if (row.config.serverName) row.config.failOnStartupError = false
+        if (row.config?.serverName) {
+          row.config.failOnStartupError = false
+          const maxDelay = row.config.reconnect?.maxDelayMs ?? 7000
+          row.config.reconnect = {
+            enabled: true,
+            initialDelayMs: 500,
+            maxDelayMs: Math.min(60_000, Math.max(3_000, maxDelay)),
+            maxAttempts: Number.MAX_SAFE_INTEGER,
+          }
+        }
       }
     })
   }
@@ -195,11 +219,23 @@ export class ExtensionStore {
   normalizeMcp(id, input) {
     // Authentication values belong in the host credential setup, not tool arguments or logs.
     if (input.env || input.headers) throw new Error('This version does not accept environment values or authentication headers.')
+    const reconnectIntervalSec = Math.min(60, Math.max(3, Math.round(Number(input.reconnectInterval ?? 7)) || 7))
+    const reconnect = {
+      enabled: true,
+      initialDelayMs: 500,
+      maxDelayMs: reconnectIntervalSec * 1000,
+      maxAttempts: Number.MAX_SAFE_INTEGER,
+    }
     const normalized = input.transport === 'stdio' ? {
       ...input,
       command: typeof input.command === 'string' ? normalizeWindowsPath(input.command) : input.command,
       cwd: typeof input.cwd === 'string' && input.cwd ? normalizeWindowsPath(input.cwd) : input.cwd,
-    } : input
+      reconnect,
+    } : {
+      ...input,
+      reconnect,
+    }
+    delete normalized.reconnectInterval
     const config = input.transport === 'sse'
       ? SseMcpConfig({ ...normalized, serverName: id, failOnStartupError: false })
       : McpConfig({ ...normalized, serverName: id, failOnStartupError: false })

package/src/web.js

@@ -55,8 +55,18 @@ export async function describeExtensions(store, ctx, options = {}) {
           : row.config.customSkillDirs[0],
       transport: row.config.transport ?? '',
       configuration: row.config.serverName ? (row.config.transport === 'stdio'
-        ? { transport: row.config.transport, command: row.config.command, args: row.config.args ?? [], cwd: row.config.cwd ?? '' }
-        : { transport: row.config.transport, url: row.config.url }) : undefined,
+        ? {
+            transport: row.config.transport,
+            command: row.config.command,
+            args: row.config.args ?? [],
+            cwd: row.config.cwd ?? '',
+            reconnectInterval: row.config.reconnect?.maxDelayMs ? Math.round(row.config.reconnect.maxDelayMs / 1000) : 7,
+          }
+        : {
+            transport: row.config.transport,
+            url: row.config.url,
+            reconnectInterval: row.config.reconnect?.maxDelayMs ? Math.round(row.config.reconnect.maxDelayMs / 1000) : 7,
+          }) : undefined,
       tools: row.config.serverName
         ? toolNames.filter(name => name.startsWith(`mcp__${row.id}__`)).sort() : [],
     })),