cortico 0.1.2 → 0.1.3

package/src/web/client/features/providers/index.ts

@@ -3,13 +3,12 @@ import { icon } from '../../ui/icons.ts';
 import { NEW_DRAFT_ID, providerDrafts } from './drafts.ts';
 import type { FeatureContext, FrameworkFeature } from '../feature.ts';
 import { get, post } from '../../core/api.ts';
-import { LANGUAGE } from '../../core/language.ts';
-import { panel } from '../../console-pages/builtins/llm-settings/strings.ts';
-import { probeCard, type ProbeResult } from '../../console-pages/builtins/llm-settings/panel.ts';
 import { S } from './strings.ts';
 import { connectionPath, type HubState, type Connection, type Module, type Detail, type Editing } from './types.ts';
 import { mountDetail, type DetailController } from './detail.ts';
 
+/** How often the card list re-reads other deployments' usage. */
+const USAGE_REFRESH_MS = 5000;
 export async function mountProviders(ctx: FeatureContext): Promise<void> {
   const { ui, root } = ctx;
   root.append(pageIntro(ui, S.pageTitle));
@@ -32,7 +31,7 @@ export async function mountProviders(ctx: FeatureContext): Promise<void> {
   let renderId = 0;
   interface CardNode {
     el: HTMLElement; title: HTMLElement; model: HTMLElement; url: HTMLElement; status: HTMLElement; secondary: HTMLElement;
-    kind: HTMLElement; activate: HTMLButtonElement; erase: HTMLButtonElement; probe: HTMLButtonElement; probePanel: HTMLElement; probeBody: HTMLElement;
+    kind: HTMLElement; activate: HTMLButtonElement; erase: HTMLButtonElement;
   }
   const nodes = new Map<string, CardNode>();
   const rows = new Map<string, Connection>();
@@ -52,40 +51,51 @@ export async function mountProviders(ctx: FeatureContext): Promise<void> {
       let node = nodes.get(identity);
       if (!node) {
         const el = ui.h('article', 'connection-card'); el.dataset.provider = identity;
-        const title = ui.h('div', 'connection-name'); const kind = ui.h('div', 'connection-kind');
-        const model = ui.h('div', 'connection-model'); const url = ui.h('div', 'connection-url');
+        const title = ui.h('div', 'connection-name');
+        const facts = ui.h('div', 'connection-facts');
+        const fact = (key: string) => { const box = ui.h('span', `kv kv-${key}`); const value = ui.h('span', 'kv-v'); box.append(ui.h('span', 'kv-k', key), value); facts.append(box); return value; };
+        const kind = fact('kind'); const model = fact('model'); const url = fact('baseUrl');
         const status = ui.h('div', 'connection-status'); const secondary = ui.h('div', 'connection-secondary');
-        const actions = ui.rowbar();
-        const configure = ui.button(S.configure, { size: 'sm', onClick: () => run(() => select(identity)) });
-        const activate = ui.button(S.activate, { size: 'sm', onClick: () => run(async () => {
+        const activate = ui.button('⇄', { size: 'sm', onClick: () => run(async () => {
           activate.disabled = true;
           try { await post(connectionPath(identity) + '/activate', {}, opts); state.active = identity; paint(); }
           finally { activate.disabled = false; }
         }) });
-        const probePanel = ui.h('div', 'connection-probe');
-        const probeBody = ui.h('div', 'connection-probe-body');
-        probePanel.append(probeBody);
-        const probe = ui.button(S.probe, { size: 'sm', onClick: () => run(() => runProbe(identity)) });
-        probe.classList.add('connection-probe-btn'); probe.append(ui.h('span', 'connection-spin'));
+        activate.classList.add('connection-activate');
+        activate.setAttribute('aria-label', S.activate); activate.title = S.activate;
+        const connect = ui.h('div', 'connection-connect'); connect.append(activate, ui.h('span', 'connection-connect-label', S.connect));
         const erase = eraseButton(identity);
-        actions.append(configure, probe, activate); el.append(erase, title, kind, model, url, status, secondary, actions, probePanel);
+        el.append(erase, title, facts, status, secondary, connect);
+        el.tabIndex = 0;
+        el.addEventListener('keydown', event => { if (event.target === el && (event.key === 'Enter' || event.key === ' ')) { event.preventDefault(); run(() => select(identity)); } }, opts);
         el.addEventListener('click', event => { if (!(event.target as Element).closest('button')) run(() => select(identity)); }, opts);
         if (identity === NEW_DRAFT_ID) cards.prepend(el); else cards.append(el);
-        node = { el, title, kind, model, url, status, secondary, activate, erase, probe, probePanel, probeBody }; nodes.set(identity, node);
+        node = { el, title, kind, model, url, status, secondary, activate, erase }; nodes.set(identity, node);
       }
       const active = identity === state.active;
       node.el.classList.toggle('is-active', active); node.el.classList.toggle('is-selected', identity === selected);
       node.title.textContent = identity === NEW_DRAFT_ID ? newDraft?.name || S.newName : identity;
       node.title.title = node.title.textContent;
+      const draft = identity === NEW_DRAFT_ID ? null : drafts.get(identity);
+      const model = draft?.entry.spec?.model || item.model || '—'; const url = draft?.entry.baseUrl || item.baseUrl || '—';
       node.kind.textContent = item.moduleTitle; node.kind.title = item.moduleTitle;
-      node.model.textContent = item.model || '—'; node.url.textContent = item.baseUrl || '—';
-      node.model.title = item.model ?? ''; node.url.title = item.baseUrl ?? '';
+      node.model.textContent = model; node.url.textContent = url;
+      node.model.title = model; node.url.title = url;
       const readiness = invalid.has(identity) && identity !== NEW_DRAFT_ID ? 'invalid' : item.readiness.state;
-      node.status.textContent = active ? S.active : S.readiness[readiness];
-      node.secondary.textContent = active && readiness !== 'ready' ? S.readiness[readiness] : identity !== NEW_DRAFT_ID && drafts.has(identity) ? S.readiness.draft : '';
-      node.activate.hidden = active || identity === NEW_DRAFT_ID;
-      node.activate.disabled = item.readiness.state !== 'ready';
-      node.probe.hidden = identity === NEW_DRAFT_ID;
+      const users = 'usage' in item ? item.usage : [];
+      const running = users.filter(user => user.running).map(user => user.name);
+      const stopped = users.filter(user => !user.running).map(user => user.name);
+      const tone = active || running.length ? 'active' : readiness === 'draft' ? 'draft' : readiness === 'ready' ? 'ready' : 'error';
+      node.status.dataset.tone = tone;
+      node.status.textContent = `${{ active: '●', ready: '✓', error: '!', draft: '✎' }[tone]} ${active ? S.active : running.length ? S.inUse(running.join('、')) : S.readiness[readiness]}`;
+      const notes: string[] = [];
+      if ((active || running.length) && readiness !== 'ready') notes.push('! ' + S.readiness[readiness]);
+      if (identity !== NEW_DRAFT_ID && drafts.has(identity)) notes.push('✎ ' + S.readiness.draft);
+      if (active && running.length) notes.push(S.inUse(running.join('、')));
+      if (stopped.length) notes.push(S.selectedBy(stopped.join('、')));
+      node.secondary.textContent = notes.join(' · ');
+      node.secondary.dataset.tone = (active || running.length) && readiness !== 'ready' ? 'error' : 'draft';
+      node.activate.parentElement!.hidden = active || identity === NEW_DRAFT_ID || readiness !== 'ready' || running.length > 0;
       if (identity === NEW_DRAFT_ID) rows.delete(identity); else rows.set(identity, item as Connection);
     }
   }
@@ -118,23 +128,9 @@ export async function mountProviders(ctx: FeatureContext): Promise<void> {
     await refresh();
     if (selected === identity) await select(fallback(), true);
   }
-  /** 探活结果挂在卡片下面,与模块页上的那份同一种呈现。 */
-  async function runProbe(identity: string): Promise<void> {
-    const node = nodes.get(identity);
-    if (!node || node.probe.disabled) return;
-    node.probe.disabled = true; node.probe.classList.add('is-busy');
-    try {
-      const result = await post<ProbeResult>(connectionPath(identity) + '/test', {}, opts);
-      if (ctx.signal.aborted) return;
-      const close = ui.button(S.probeClose, { size: 'sm', onClick: () => node.probePanel.classList.remove('is-open') });
-      node.probeBody.replaceChildren(probeCard(ui, LANGUAGE === 'en' ? panel.en : panel.zh, result), close);
-      node.probePanel.classList.add('is-open');
-    } finally { node.probe.disabled = false; node.probe.classList.remove('is-busy'); }
-  }
   async function refresh() { state = await get<HubState>('/api/providers', opts); paint(); }
   async function select(identity: string, force = false): Promise<void> {
     if (!force && identity === selected) return;
-    if (!force && controller && !(await controller.leave())) return;
     const gen = ++renderId;
     controller?.dispose(); controller = null;
     selected = identity; paint(); detailRoot.replaceChildren();
@@ -146,9 +142,13 @@ export async function mountProviders(ctx: FeatureContext): Promise<void> {
     if (gen !== renderId || ctx.signal.aborted) return;
     const detailView = ui.h('div'); detailRoot.replaceChildren(detailView);
     const mounted = await mountDetail({ ctx, root: detailView, modules, saved, draft: identity === NEW_DRAFT_ID ? newDraft : drafts.get(identity),
-      discarded: () => { invalid.delete(identity); if (identity === NEW_DRAFT_ID) newDraft = drafts.get(NEW_DRAFT_ID); paint(); },
-      saveDraft: editing => { drafts.set(editing); paint(); },
-      changed: (editing, hasErrors) => { if (hasErrors) invalid.add(identity); else invalid.delete(identity); if (identity === NEW_DRAFT_ID) newDraft = editing; paint(); },
+      // Edits persist as a browser draft as they happen; a form back at its saved state drops the draft.
+      changed: (editing, hasErrors, dirty) => {
+        if (hasErrors) invalid.add(identity); else invalid.delete(identity);
+        if (identity === NEW_DRAFT_ID) { newDraft = editing; drafts.set(editing); }
+        else if (dirty) drafts.set(editing); else drafts.remove(identity);
+        paint();
+      },
       onSaved: async (name, show = true) => { drafts.remove(identity); invalid.delete(identity); if (identity === NEW_DRAFT_ID) newDraft = null; await refresh(); if (show) await select(name, true); },
       cancelled: async () => { drafts.remove(identity); invalid.delete(identity); if (identity === NEW_DRAFT_ID) newDraft = null; await select(identity === NEW_DRAFT_ID ? state.providers.find(item => item.name === state.active)?.name || state.providers[0]?.name || '' : identity, true); },
       deleted: async () => { drafts.remove(identity); invalid.delete(identity); await refresh(); await select(state.providers.find(item => item.name === state.active)?.name || state.providers[0]?.name || '', true); },
@@ -164,8 +164,8 @@ export async function mountProviders(ctx: FeatureContext): Promise<void> {
   }
   async function create() {
     if (newDraft) return select(NEW_DRAFT_ID);
-    if (controller && !(await controller.leave())) return;
     newDraft = { original: null, name: '', entry: { kind: '', baseUrl: '' }, secretValue: '', raw: {} };
+    drafts.set(newDraft);
     await select(NEW_DRAFT_ID, true);
   }
   const moduleName = (kind: string) => modules.find(module => module.id === kind)?.title ?? kind;
@@ -175,10 +175,16 @@ export async function mountProviders(ctx: FeatureContext): Promise<void> {
   creator.append(ui.button(S.create, { variant: 'primary', onClick: () => run(create) }), ui.h('p', 'connection-create-hint', S.createHint));
   index.append(creator, cards);
   ctx.lifecycle.own({ dispose: () => { renderId++; controller?.dispose(); } });
-  ctx.lifecycle.own(ctx.router.addLeaveDecision(async () => controller ? controller.leave() : true));
   ctx.lifecycle.own(ctx.router.onChange(route => {
     if (route.segments[0] === 'providers' && route.segments[1]) run(() => select(route.segments[1]));
   }));
+  // Other deployments' selections and liveness change without this page; the detail form is left alone.
+  let refreshing = false;
+  ctx.lifecycle.interval(() => {
+    if (refreshing) return;
+    refreshing = true;
+    run(async () => { try { await refresh(); } finally { refreshing = false; } });
+  }, USAGE_REFRESH_MS);
   paint();
   const wanted = ctx.route.segments[1] ?? (newDraft ? NEW_DRAFT_ID : undefined);
   await select(wanted && (wanted === NEW_DRAFT_ID || state.providers.some(item => item.name === wanted)) ? wanted : state.providers.find(item => item.name === state.active)?.name ?? state.providers[0]?.name ?? '', true);

package/src/web/client/features/providers/strings.ts

@@ -1,50 +1,54 @@
 import { pick } from '../../core/language.ts';
 const zh = {
-  pageTitle: '模型供应商', navLabel: '模型供应商', navGroup: 'Core', create: '+ 新建供应商实例', newName: '新建实例',
+  pageTitle: '模型供应商', navLabel: '模型供应商', navGroup: 'Core', create: '+ 新建供应商实例', newName: '未命名实例',
   createHint: '实例 = 填一组供应商配置保存成卡片',
   empty: '还没有模型供应商', emptyHint: '添加一条模型连接后，Cortico 才能进行模型推理。',
-  configure: '⚙ 配置', activate: '⇄ 设为当前', active: '当前模型', missing: '当前模型供应商不存在，配置中引用：',
-  eraseConfirm: '确认删除', probe: '测试可用性', probeClose: '收起',
-  readiness: { ready: '配置完成', 'needs-setup': '需要完善配置', 'runtime-unavailable': '运行环境未就绪', invalid: '配置错误', 'module-missing': '模块不可用', draft: '草稿' } as Record<string, string>,
+  eraseConfirm: '确认删除',
+  connect: '连接', activate: '设为当前供应商', active: '当前模型', missing: '当前模型供应商不存在，配置中引用：',
+  inUse: (names: string) => `其他实例使用中：${names}`, selectedBy: (names: string) => `已被 ${names} 选用（未运行）`,
+  readiness: { ready: '可连接', 'needs-setup': '需要完善配置', 'runtime-unavailable': '运行环境未就绪', invalid: '配置错误', 'module-missing': '模块不可用', draft: '草稿' } as Record<string, string>,
   basic: '基本信息', connection: '连接', modelSection: '模型与生成', moduleSection: '模块设置', pricing: '成本与计价', advanced: '高级协议',
   name: '供应商名称', module: '供应商类型', url: 'API 地址', key: 'API Key', model: '模型',
-  moduleNote: (description: string, id: string) => `${description} 模块标识：${id}`,
   nameHint: '英文字母、数字、- 或 _，以字母或数字开头，不允许空格或系统保留名。',
   fixedModule: '供应商类型保存后不可更改。使用其他类型需新建供应商。',
-  test: '测试连接', testOk: '测试成功', testFailed: '测试失败', savedFirst: '请先保存配置，再执行此操作。',
-  keySet: '已配置；留空保留现有密钥', keyEmpty: '输入 API Key', fetchModels: '获取模型列表',
+  test: '测试连接', testOk: '测试成功', testFailed: '测试失败',
+  keyEmpty: '输入 API Key', fetchModels: '获取模型列表',
   reasoning: '推理强度', thinking: '开启推理', temperature: '温度', maxTokens: '最大输出 token', context: '上下文上限', tier: '服务档位', images: '接受图片',
+  catalogNoWindow: '目录没有给出这个模型的上下文上限；请按服务商文档手填。',
   advancedHint: '仅在使用自定义 API 网关或兼容服务时调整。', secret: '密钥环境变量名',
   extraHeaders: '附加请求头（JSON object）', extraBody: '附加请求体（JSON object）', priceRules: '完整计价规则（JSON array）',
   shared: '共享配置：此供应商可被多个 Bot 使用。修改会改变这份共享配置；若需要不同参数，建议新建一个供应商。',
-  remove: '删除供应商', duplicate: '复制供应商', cancel: '取消', draft: '保存草稿', save: '保存', saved: '已保存', drafted: '草稿已保存到此浏览器。API Key 不保存在浏览器草稿中。',
+  remove: '删除供应商', duplicate: '复制供应商', cancel: '放弃更改', save: '保存', saved: '已保存',
+  draftNote: '改动暂存在此浏览器，保存后才写入配置。API Key 不进暂存。',
   chooseModule: '请选择供应商类型。', invalidNumber: '请输入有效范围内的数值。',
   required: '此项必填。', jsonObject: '请输入合法 JSON 对象。', jsonArray: '请输入合法 JSON 数组。',
-  unsaved: '你有未保存的更改。', stay: '留在这里', discard: '放弃更改并切换',
+  unsaved: '已暂存；保存后写入配置。',
   deleteConfirm: '删除供应商及其目录中的全部文件？', referenced: '此供应商正在被以下 Bot 使用，不能删除：', reload: '重新加载',
 };
 const en: typeof zh = {
-  pageTitle: 'Model connections', navLabel: 'Model connections', navGroup: 'Core', create: '+ New connection instance', newName: 'New instance',
+  pageTitle: 'Model connections', navLabel: 'Model connections', navGroup: 'Core', create: '+ New connection instance', newName: 'Unnamed instance',
   createHint: 'An instance is one set of provider settings saved as a card.',
   empty: 'No model connections yet', emptyHint: 'Add a model connection to enable inference.',
-  configure: '⚙ Configure', activate: '⇄ Set current', active: 'Current model', missing: 'Current model connection is missing: ',
-  eraseConfirm: 'Confirm delete', probe: 'Test endpoint', probeClose: 'Hide',
-  readiness: { ready: 'Configured', 'needs-setup': 'Needs setup', 'runtime-unavailable': 'Runtime unavailable', invalid: 'Invalid configuration', 'module-missing': 'Module unavailable', draft: 'Draft' },
+  eraseConfirm: 'Confirm delete',
+  connect: 'Connect', activate: 'Set current connection', active: 'Current model', missing: 'Current model connection is missing: ',
+  inUse: (names: string) => `In use by: ${names}`, selectedBy: (names: string) => `Selected by ${names} (not running)`,
+  readiness: { ready: 'Ready to connect', 'needs-setup': 'Needs setup', 'runtime-unavailable': 'Runtime unavailable', invalid: 'Invalid configuration', 'module-missing': 'Module unavailable', draft: 'Draft' },
   basic: 'Basic information', connection: 'Connection', modelSection: 'Model and generation', moduleSection: 'Module settings', pricing: 'Pricing', advanced: 'Advanced protocol',
   name: 'Connection name', module: 'Connection type', url: 'API URL', key: 'API Key', model: 'Model',
-  moduleNote: (description: string, id: string) => `${description} Module ID: ${id}`,
   nameHint: 'English letters, digits, - or _; start with a letter or digit. No spaces or reserved system names.',
   fixedModule: 'The connection type cannot change after saving. Create a connection to use another type.',
-  test: 'Test connection', testOk: 'Test successful', testFailed: 'Test failed', savedFirst: 'Save the configuration before this operation.',
-  keySet: 'Configured; leave blank to keep the current key', keyEmpty: 'Enter API Key', fetchModels: 'Fetch model list',
+  test: 'Test connection', testOk: 'Test successful', testFailed: 'Test failed',
+  keyEmpty: 'Enter API Key', fetchModels: 'Fetch model list',
   reasoning: 'Reasoning effort', thinking: 'Enable reasoning', temperature: 'Temperature', maxTokens: 'Max output tokens', context: 'Context limit', tier: 'Service tier', images: 'Accept images',
+  catalogNoWindow: 'The model list states no context window for this model; fill it in from the provider\'s documentation.',
   advancedHint: 'Adjust only for custom API gateways or compatible services.', secret: 'Credential environment variable',
   extraHeaders: 'Extra headers (JSON object)', extraBody: 'Extra request body (JSON object)', priceRules: 'Full pricing rules (JSON array)',
   shared: 'Shared configuration: multiple bots can use this connection. Changes update this shared configuration; create another connection if you need different settings.',
-  remove: 'Delete connection', duplicate: 'Duplicate connection', cancel: 'Cancel', draft: 'Save draft', save: 'Save', saved: 'Saved', drafted: 'Draft saved in this browser. API Keys are not stored in browser drafts.',
+  remove: 'Delete connection', duplicate: 'Duplicate connection', cancel: 'Discard changes', save: 'Save', saved: 'Saved',
+  draftNote: 'Edits are kept in this browser and written to the configuration on save. API Keys are never kept.',
   chooseModule: 'Choose a connection type.', invalidNumber: 'Enter a number within the allowed range.',
   required: 'Required.', jsonObject: 'Enter a valid JSON object.', jsonArray: 'Enter a valid JSON array.',
-  unsaved: 'You have unsaved changes.', stay: 'Stay here', discard: 'Discard and switch',
+  unsaved: 'Kept as a draft; written on save.',
   deleteConfirm: 'Delete this connection and all files in its directory?', referenced: 'This connection is used by these bots and cannot be deleted: ', reload: 'Reload',
 };
 export const S = pick({ zh, en });

package/src/web/client/ui/fields.ts

@@ -138,7 +138,9 @@ export function checkbox(
  */
 export function field(doc: Document, label: string, control: HTMLElement): HTMLLabelElement {
   const el = h(doc, 'label', 'fieldrow');
-  el.append(h(doc, 'span', 'fieldlabel', label), control);
+  const caption = h(doc, 'span', 'fieldlabel', label.replace(/\s*\*$/, ''));
+  if (/\*$/.test(label)) caption.append(h(doc, 'span', 'required-mark', ' *'));
+  el.append(caption, control);
   return el;
 }
 

package/src/web/public/styles.css

@@ -1749,17 +1749,23 @@
 .connection-card{min-width:0;border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--paper);cursor:pointer;transition:background .15s,border-color .15s}
 .connection-card.is-active{border-color:var(--accent);box-shadow:0 0 8px color-mix(in srgb,var(--accent) 12%,transparent)}
 .connection-card.is-selected{background:color-mix(in srgb,var(--ink) 5%,var(--paper));outline:2px solid var(--ink-dim);outline-offset:1px}
-.connection-name,.connection-kind,.connection-model,.connection-url,.connection-status,.connection-secondary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.connection-name{font:700 17px/1.25 var(--sans)}.connection-kind{margin-top:4px;font:600 11.5px/1.3 var(--sans);color:var(--muted-foreground)}.connection-model{margin-top:9px;font-size:13px}.connection-url{font-size:11px;color:var(--ink-dim);margin-top:3px}
+.connection-name,.connection-status,.connection-secondary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.connection-name{font:700 17px/1.25 var(--sans)}
+.connection-facts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;min-width:0}
+.connection-facts .kv{max-width:100%}.connection-facts .kv-v{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.kv-kind{--kv-line:color-mix(in srgb,var(--ink-blue) 60%,transparent)}.kv-model{--kv-line:color-mix(in srgb,var(--accent-2) 75%,transparent)}.kv-baseUrl{--kv-line:var(--line-strong)}
 .connection-status{font-size:12px;margin-top:14px}.connection-secondary{font-size:11px;color:var(--ink-dim)}
-.connection-card .rowbar{margin-top:12px;justify-content:space-between;gap:4px}
 .connection-detail{min-width:0}.connection-detail .sheet{margin-bottom:16px}
+.connection-identity{background:var(--paper-2);border-color:var(--line-2)}
+.connection-identity+.connection-flow{margin-top:22px;padding-top:18px;border-top:1px dashed var(--line-2)}
+.connection-flow{counter-reset:step}.connection-step{counter-increment:step;min-width:0}
+.connection-step td.mono{white-space:normal;overflow-wrap:anywhere}
+.connection-step table.data .btn{white-space:nowrap}
+.connection-step>.sheet>h3::before,.connection-step>details.sheet>summary>h3::before{content:counter(step);display:inline-grid;place-items:center;width:20px;height:20px;margin-right:9px;border-radius:50%;background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent);font:600 11px/1 var(--mono);vertical-align:2px}
 .connection-detail .connection-field{margin-bottom:15px}.connection-detail input:not([type=checkbox]),.connection-detail select,.connection-detail textarea{max-width:100%;width:100%}
 .connection-detail .field-error{color:var(--danger,#b43c38);font-size:12px;min-height:0}.connection-shared{color:var(--ink-dim);font-size:12px;line-height:1.7;margin:20px 0 12px}
 .connection-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.connection-actions .grow{flex:1}
 @media(max-width:760px){.connection-hub{grid-template-columns:1fr}.connection-index{position:static;max-height:320px}.connection-cards{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}}
-.connection-guard{border:1px solid var(--line);border-radius:16px;padding:24px;background:var(--paper);color:var(--ink);max-width:560px;box-shadow:0 12px 60px #0003}
-.connection-guard::backdrop{background:#0005}.connection-guard h3{margin-bottom:20px}
 
 .live-summary { flex-wrap:wrap; }
 .live-connection { display:inline-flex; align-items:center; gap:7px; min-width:0; max-width:48%; background:none; border:0; color:var(--ink-soft); cursor:pointer; padding:0; font:11.5px/1 var(--sans); }
@@ -1807,26 +1813,28 @@
 .coreview > .scroll { scrollbar-gutter: auto; }
 .panelslot > :first-child > .sheet:first-child { padding-top: 0; }
 
-/* 卡片上的删除与探活。 */
+/* 卡片:连接在右上,删除在右下,图标底边对齐状态行。 */
 .connection-create { margin-bottom:16px; }
 .connection-create-hint { margin:7px 2px 0; font:var(--text-detail)/1.5 var(--sans); color:var(--muted-foreground); }
 .connection-create > .btn { width:100%; }
-.connection-card { position:relative; }
-.connection-erase { position:absolute; top:10px; right:10px; display:flex; align-items:center; gap:0; height:26px; padding:0 6px; border:1px solid transparent; border-radius:8px; background:none; color:var(--ink-dim); cursor:pointer; transition:color .14s ease, background .14s ease, border-color .14s ease, gap .18s ease; }
-.connection-erase .icon { width:14px; height:14px; flex:none; }
+.connection-card { position:relative; padding-right:64px; }
+.connection-erase { position:absolute; bottom:13px; right:13px; display:flex; align-items:center; gap:0; height:28px; padding:0 4px; border:1px solid transparent; border-radius:8px; background:none; color:var(--ink-dim); cursor:pointer; transition:color .14s ease, background .14s ease, border-color .14s ease, gap .18s ease; }
+.connection-erase .icon { width:20px; height:20px; flex:none; }
 .connection-erase:hover { color:var(--danger,#b43c38); background:var(--hover); }
 .connection-erase-text { display:grid; grid-template-columns:0fr; overflow:hidden; font:600 12px/1 var(--sans); white-space:nowrap; transition:grid-template-columns .18s ease; }
 .connection-erase-text > span { overflow:hidden; }
 .connection-erase.is-armed { gap:6px; color:var(--danger,#b43c38); border-color:currentColor; background:var(--paper); }
 .connection-erase.is-armed .connection-erase-text { grid-template-columns:1fr; }
-.connection-name { padding-right:34px; }
-.connection-probe-btn .connection-spin { display:none; width:12px; height:12px; margin-left:6px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:connection-spin .7s linear infinite; }
-.connection-probe-btn.is-busy .connection-spin { display:inline-block; }
-@keyframes connection-spin { to { transform:rotate(360deg); } }
-.connection-probe { display:grid; grid-template-rows:0fr; margin-top:0; transition:grid-template-rows .2s ease, margin-top .2s ease, opacity .2s ease; opacity:0; }
-.connection-probe.is-open { grid-template-rows:1fr; margin-top:12px; opacity:1; }
-.connection-probe-body { overflow:hidden; }
-.connection-probe .sheet { margin:0; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
-.connection-probe .kvtable td { padding:3px 0; font-size:11.5px; word-break:break-word; }
-.connection-probe .kvtable td:first-child { padding-right:8px; color:var(--muted-foreground); white-space:nowrap; }
-.connection-probe > .connection-probe-body > .btn { margin-top:8px; }
+.connection-connect { position:absolute; top:12px; right:12px; width:32px; text-align:center; }
+.connection-connect[hidden] { display:none; }
+.connection-hub .btn.connection-activate { display:block; width:32px; height:28px; min-height:28px; padding:0; border:0; font-size:17px; line-height:28px; }
+.connection-connect-label { display:block; font-size:10px; line-height:14px; color:var(--muted-foreground); }
+.connection-index { scrollbar-width:none; }
+.connection-index::-webkit-scrollbar { display:none; }
+.required-mark { color:var(--danger); }
+.connection-test { gap:12px; align-items:center; }
+.connection-test .msgline { margin:0; }
+.connection-status[data-tone="active"] { color:var(--accent); }
+.connection-status[data-tone="ready"] { color:var(--ok); }
+.connection-status[data-tone="error"], .connection-secondary[data-tone="error"] { color:var(--danger); }
+.connection-status[data-tone="draft"], .connection-secondary[data-tone="draft"] { color:var(--foreground); }

package/src/web/server.ts

@@ -1409,8 +1409,10 @@ export class WebApp {
     app.post('/api/providers/:name/save', express.json(), providerRoute((hub, req) => hub.save(String(req.params.name), req.body, this.languageOf(req))));
     app.post('/api/providers/:name/delete', express.json(), providerRoute((hub, req) => hub.delete(String(req.params.name), req.body.expectedRevision)));
     app.post('/api/providers/:name/activate', providerRoute((hub, req) => hub.activate(String(req.params.name), this.languageOf(req))));
-    app.post('/api/providers/:name/test', providerRoute((hub, req) => hub.action(String(req.params.name), 'test', this.languageOf(req))));
-    app.post('/api/providers/:name/models', providerRoute((hub, req) => hub.action(String(req.params.name), 'models', this.languageOf(req))));
+    // A body with `entry` probes the browser's draft instead of the saved connection.
+    const draftOf = (req: Request) => (req.body && typeof req.body === 'object' && req.body.entry ? { entry: req.body.entry, secretValue: req.body.secretValue } : undefined);
+    app.post('/api/providers/:name/test', express.json(), providerRoute((hub, req) => hub.action(String(req.params.name), 'test', this.languageOf(req), draftOf(req))));
+    app.post('/api/providers/:name/models', express.json(), providerRoute((hub, req) => hub.action(String(req.params.name), 'models', this.languageOf(req), draftOf(req))));
 
     app.get('/api/status', wrap((_req, res) => {
       res.json({ ...this.safeStatus(), uptimeSec: Math.round(process.uptime()) });

package/src/web/shared/console-protocol.ts

@@ -58,6 +58,17 @@ export function isBuiltinPanel(name: unknown): name is string {
   return typeof name === 'string' && BUILTIN_PANEL_RE.test(name);
 }
 
+/**
+ * 端点编辑页自带的四块段落。`llm:*` 页除 `settings` 外的面板按声明顺序就是编辑页的段落:
+ * `builtin` 取这里的名字的由编辑页自己画,标题与说明用声明的;其余是模块自己的浏览器实现。
+ */
+export const CONNECTION_EDITOR_BLOCKS = ['connection-endpoint', 'connection-model', 'connection-pricing', 'connection-protocol'] as const;
+export type ConnectionEditorBlock = (typeof CONNECTION_EDITOR_BLOCKS)[number];
+
+export function isConnectionEditorBlock(name: unknown): name is ConnectionEditorBlock {
+  return (CONNECTION_EDITOR_BLOCKS as readonly unknown[]).includes(name);
+}
+
 /** 构建脚本与服务端注册表共用的目录到 page id 映射。 */
 export function pageIdFor(kind: ContributingKind, name: string): string {
   return `${kind}:${name}`;
@@ -85,6 +96,8 @@ export interface ConsoleAssetManifest {
   core: string | null;
   /** key 为 page id。 */
   providers: Record<string, ConsoleAssetEntry>;
+  /** esbuild 在仓库内读到的每个源文件的 sha256，键为仓库相对路径；启动器据此判断产物是否落后于源码。 */
+  sources?: Record<string, string>;
 }
 
 /** 静态资源 URL 的唯一合法前缀。服务端把它映射到 `dist/web/`。 */

package/src/worlds/minecraft/client-launch.ts

@@ -65,6 +65,8 @@ interface ClientLaunch {
   nativeJars: string[];
   /** 实际用到的版本 id 链,child → root */
   versionChain: string[];
+  /** 版本 JSON 点名、但 libraries 目录里没有的条目,相对 libraries 目录。类路径里少了它们。 */
+  missingLibraries: string[];
 }
 
 const OS_NAMES: Partial<Record<NodeJS.Platform, string>> = {
@@ -202,6 +204,7 @@ export function buildClientLaunch(input: ClientLaunchInput): ClientLaunch | { er
   const librariesDir = join(gameDir, 'libraries');
   const classpath: string[] = [];
   const nativeJars: string[] = [];
+  const missingLibraries: string[] = [];
   const seenPaths = new Set<string>();
   for (const version of chain) {
     for (const lib of version.libraries ?? []) {
@@ -211,7 +214,10 @@ export function buildClientLaunch(input: ClientLaunchInput): ClientLaunch | { er
       const abs = join(librariesDir, rel);
       if (seenPaths.has(abs)) continue;
       seenPaths.add(abs);
-      if (!existsSync(abs)) continue;
+      if (!existsSync(abs)) {
+        missingLibraries.push(rel);
+        continue;
+      }
       if (/natives/i.test(rel)) nativeJars.push(abs);
       classpath.push(abs);
     }
@@ -222,7 +228,9 @@ export function buildClientLaunch(input: ClientLaunchInput): ClientLaunch | { er
   const separator = os === 'windows' ? ';' : ':';
   const vars: Record<string, string> = {
     auth_player_name: input.username,
-    version_name: versionId,
+    // 加载器版本靠 `-DignoreList=...,${version_name}.jar` 把主 jar 挡在模块路径外,所以这个名字
+    // 必须是实际加载的那个 jar;继承链上的版本没有自己的 jar,用的是 jarId 那个。
+    version_name: jarId,
     game_directory: gameDir,
     assets_root: join(gameDir, 'assets'),
     game_assets: join(gameDir, 'assets'),
@@ -268,5 +276,6 @@ export function buildClientLaunch(input: ClientLaunchInput): ClientLaunch | { er
     mainClass,
     nativeJars,
     versionChain: chain.map((v, i) => v.id ?? (i === 0 ? versionId : '?')),
+    missingLibraries,
   };
 }

package/src/worlds/minecraft/client.ts

@@ -215,6 +215,10 @@ export class GameClient {
       return this.state();
     }
     this.activeGameDir = gameDir;
+    if ('missingLibraries' in launch && launch.missingLibraries.length > 0) {
+      this.opts.log.warn(`${this.opts.label}版本 JSON 点名的 ${launch.missingLibraries.length} 个库`
+        + `不在 libraries 目录,类路径里没有它们:${launch.missingLibraries.join(' ')}`);
+    }
     if ('nativeJars' in launch) prepareNatives(launch.nativeJars, launch.nativesDir, this.opts.log);
     if (!this.opts.commandOverride) {
       if (this.opts.noPauseOnLostFocus()) {

package/src/worlds/qq/world.ts

@@ -132,7 +132,9 @@ export class QQWorld implements World {
   private host?: WorldHost;
   private driver?: OneBotDriver;
   private log: Logger = nullLogger();
-  private imagePolicy: ImageRenderPolicy = () => '[图片]';
+  /** 主模型支持 image/png 或 World 配置了视觉模型时启用取图；每次渲染按当前端点判断。 */
+  private readonly imagePolicy: ImageRenderPolicy = (data) =>
+    makeImagePolicy(!!this.vision || (this.host?.modelFacts.accepts('image/png') ?? false))(data);
 
   /** 外挂视觉(注入=auxVLM生效);null=无,一切保持[图片]占位现状 */
   private readonly vision?: VisionService;
@@ -548,8 +550,6 @@ export class QQWorld implements World {
   async start(host: WorldHost): Promise<void> {
     this.host = host;
     this.log = host.log;
-    // 主模型支持 image/png 或 World 配置了视觉模型时启用取图。
-    this.imagePolicy = makeImagePolicy(!!this.vision || host.modelFacts.accepts('image/png'));
     // 外挂视觉的用量自愿上报进 core 的成本账(不报就在成本页看不到)
     this.vision?.setUsageSink((usage, model) =>
       host.reportUsage(usage, { model, label: 'QQWorld·辅助视觉' }),