dsh-vision-router 2.0.0 → 2.1.0

package/lib/client-host-compat-prelude.js

@@ -0,0 +1,249 @@
+import { htmlHasScriptMarker } from './html-script-marker.js'
+
+const CLIENT_HOST_COMPAT_MARK = 'data-vision-router-host-compat'
+
+/**
+ * Client-side Host compatibility shim for the hand-maintained Vision Router
+ * settings factory.
+ *
+ * DSH 0.1.2 moved model-catalog ownership from the legacy
+ * `connection.api.llm.models()` facade to `remote.session.modelCatalog()` and
+ * renamed the forwarded credential invalidation event. Keep the old client
+ * factory unchanged: when (and only when) the new Host capability exists,
+ * expose a tiny compatibility view of those two seams to that one factory.
+ * Old rc.6/rc.7/rc.8 clients see their original Connection and Remote objects
+ * byte-for-byte because the capability probe fails closed.
+ */
+export const CLIENT_HOST_COMPAT_PRELUDE = String.raw`(function(){
+  'use strict';
+  var TARGET = 'dsh-vision-router';
+  var LEGACY_CREDENTIAL_EVENT = 'credentials/updated';
+  var HOST_CREDENTIAL_EVENT = 'credentials/reference-updated';
+
+  function hasHostCatalog(remote) {
+    return !!(
+      remote && remote.session &&
+      typeof remote.session.modelCatalog === 'function'
+    );
+  }
+
+  function wrapCatalogResult(value) {
+    // The alpha Host returns ConnectionRpcResult<ModelCatalog>. The legacy
+    // factory already understands the older { result: RpcResult } envelope, so
+    // adapt only that carrier shape and leave future direct values untouched.
+    if (value && typeof value === 'object' && typeof value.ok === 'boolean') {
+      return { result: value };
+    }
+    return value;
+  }
+
+  function catalogModels(remote) {
+    return function models() {
+      return Promise.resolve(remote.session.modelCatalog()).then(wrapCatalogResult);
+    };
+  }
+
+  function compatibleApi(originalApi, remote) {
+    var originalLlm = originalApi && originalApi.llm;
+    var llm = originalLlm && (typeof originalLlm === 'object' || typeof originalLlm === 'function')
+      ? new Proxy(originalLlm, {
+          get: function(target, property) {
+            if (property === 'models') return catalogModels(remote);
+            var value = Reflect.get(target, property, target);
+            return typeof value === 'function' ? value.bind(target) : value;
+          }
+        })
+      : { models: catalogModels(remote) };
+    if (originalApi && (typeof originalApi === 'object' || typeof originalApi === 'function')) {
+      return new Proxy(originalApi, {
+        get: function(target, property) {
+          if (property === 'llm') return llm;
+          var value = Reflect.get(target, property, target);
+          return typeof value === 'function' ? value.bind(target) : value;
+        }
+      });
+    }
+    return { llm: llm };
+  }
+
+  function compatibleConnection(connection, remote) {
+    if (!hasHostCatalog(remote)) return connection;
+    if (!connection || (typeof connection !== 'object' && typeof connection !== 'function')) return connection;
+    var api = compatibleApi(connection.api, remote);
+    return new Proxy(connection, {
+      get: function(target, property) {
+        if (property === 'api') return api;
+        var value = Reflect.get(target, property, target);
+        return typeof value === 'function' ? value.bind(target) : value;
+      }
+    });
+  }
+
+  function compatibleRemote(remote) {
+    if (!hasHostCatalog(remote)) return remote;
+    if (!remote || (typeof remote !== 'object' && typeof remote !== 'function')) return remote;
+    return new Proxy(remote, {
+      get: function(target, property) {
+        if (property === '$on') {
+          var subscribe = Reflect.get(target, property, target);
+          if (typeof subscribe !== 'function') return subscribe;
+          return function(event, listener) {
+            var args = Array.prototype.slice.call(arguments);
+            if (event === LEGACY_CREDENTIAL_EVENT) args[0] = HOST_CREDENTIAL_EVENT;
+            return subscribe.apply(target, args);
+          };
+        }
+        var value = Reflect.get(target, property, target);
+        return typeof value === 'function' ? value.bind(target) : value;
+      }
+    });
+  }
+
+  function patchCanonicalImageCopy(namespace, dictionaries) {
+    if (namespace !== 'vision-router' || !dictionaries || typeof dictionaries !== 'object') return dictionaries;
+    var next = Object.assign({}, dictionaries);
+    if (next.zh && typeof next.zh === 'object') {
+      next.zh = Object.assign({}, next.zh, {
+        hintInstantDescribe: '会话日志保留 Host 持久化后的图片；像素工具以这份 canonical 图片为坐标与像素事实源。',
+        openPresentedImage: '点击查看图片',
+        openNamedImage: '查看图片：{name}'
+      });
+    }
+    if (next.en && typeof next.en === 'object') {
+      next.en = Object.assign({}, next.en, {
+        hintInstantDescribe: 'The session log keeps the Host-persisted image; pixel tools use that canonical image as their coordinate and pixel source of truth.',
+        openPresentedImage: 'Open image',
+        openNamedImage: 'Open image: {name}'
+      });
+    }
+    return next;
+  }
+
+  function compatibleLocale(locale) {
+    if (!locale || (typeof locale !== 'object' && typeof locale !== 'function')) return locale;
+    return new Proxy(locale, {
+      get: function(target, property) {
+        if (property === 'register') {
+          var register = Reflect.get(target, property, target);
+          if (typeof register !== 'function') return register;
+          return function(namespace, dictionaries) {
+            var args = Array.prototype.slice.call(arguments);
+            args[1] = patchCanonicalImageCopy(namespace, dictionaries);
+            return register.apply(target, args);
+          };
+        }
+        var value = Reflect.get(target, property, target);
+        return typeof value === 'function' ? value.bind(target) : value;
+      }
+    });
+  }
+
+  function compatibleContext(ctx) {
+    if (!ctx || typeof ctx !== 'object' || typeof Proxy !== 'function') return ctx;
+    var remote = compatibleRemote(ctx.remote);
+    var locale = compatibleLocale(ctx.locale);
+    return new Proxy(ctx, {
+      get: function(target, property) {
+        if (property === 'remote') return remote;
+        if (property === 'locale') return locale;
+        if (property === 'get') {
+          var get = Reflect.get(target, property, target);
+          if (typeof get !== 'function') return get;
+          return function(name) {
+            var value = get.call(target, name);
+            return name === 'connection' ? compatibleConnection(value, remote) : value;
+          };
+        }
+        var value = Reflect.get(target, property, target);
+        return typeof value === 'function' ? value.bind(target) : value;
+      }
+    });
+  }
+
+  function decorate(plugin) {
+    if (!plugin || typeof plugin !== 'object' || typeof plugin.apply !== 'function') return plugin;
+    if (plugin.apply.__visionRouterHostCompat) return plugin;
+    var originalApply = plugin.apply;
+    function apply(ctx) {
+      var args = Array.prototype.slice.call(arguments);
+      args[0] = compatibleContext(ctx);
+      return originalApply.apply(this, args);
+    }
+    try { Object.defineProperty(apply, '__visionRouterHostCompat', { value: true }); } catch (_) {}
+    plugin.apply = apply;
+    return plugin;
+  }
+
+  function patchLoader(loader) {
+    if (!loader || (typeof loader !== 'object' && typeof loader !== 'function')) return;
+    if (typeof loader.load === 'function' && !loader.load.__visionRouterHostCompat) {
+      var originalLoad = loader.load;
+      function load(spec) {
+        if (spec && spec.id === TARGET && typeof spec.factory === 'function') {
+          var factory = spec.factory;
+          spec = Object.assign({}, spec, {
+            factory: function(require) { return decorate(factory(require)); }
+          });
+        }
+        return originalLoad.call(this, spec);
+      }
+      try { Object.defineProperty(load, '__visionRouterHostCompat', { value: true }); } catch (_) {}
+      loader.load = load;
+    }
+    if (typeof loader.create === 'function' && !loader.create.__visionRouterHostCompat) {
+      var originalCreate = loader.create;
+      function create() {
+        var result = originalCreate.apply(this, arguments);
+        patchLoader(loader);
+        return result;
+      }
+      try { Object.defineProperty(create, '__visionRouterHostCompat', { value: true }); } catch (_) {}
+      loader.create = create;
+    }
+  }
+
+  function install() {
+    if (window.__ModuleLoader__) {
+      patchLoader(window.__ModuleLoader__);
+      return;
+    }
+    var descriptor = Object.getOwnPropertyDescriptor(window, '__ModuleLoader__');
+    if (descriptor && descriptor.configurable === false) return;
+    var stored;
+    Object.defineProperty(window, '__ModuleLoader__', {
+      configurable: true,
+      enumerable: true,
+      get: function(){ return stored; },
+      set: function(value) {
+        stored = value;
+        patchLoader(value);
+        Object.defineProperty(window, '__ModuleLoader__', {
+          configurable: true,
+          enumerable: true,
+          writable: true,
+          value: stored
+        });
+      }
+    });
+  }
+
+  install();
+})();`
+
+export function injectClientHostCompatibility(html) {
+  if (typeof html !== 'string' || htmlHasScriptMarker(html, CLIENT_HOST_COMPAT_MARK)) return html
+  const safe = CLIENT_HOST_COMPAT_PRELUDE.replace(/<\/script/gi, '<\\/script')
+  const script = `<script ${CLIENT_HOST_COMPAT_MARK}>${safe}</script>`
+  const closeHead = html.indexOf('</head>')
+  if (closeHead !== -1) return `${html.slice(0, closeHead)}${script}${html.slice(closeHead)}`
+  return `${html}${script}`
+}
+
+export function installClientHostCompatibility(ctx) {
+  ctx?.inject?.(['webServer'], (webCtx) => {
+    webCtx.effect(
+      () => webCtx.webServer.tapIndex(injectClientHostCompatibility),
+      'vision-router: client Host compatibility boundary',
+    )
+  })
+}

package/lib/client-presentation-boundary.js

@@ -1,16 +1,70 @@
 import { htmlHasScriptMarker } from './html-script-marker.js'
 import {
-  CLIENT_PRESENTATION_PRELUDE,
+  CLIENT_PRESENTATION_PRELUDE as BASE_CLIENT_PRESENTATION_PRELUDE,
   resolveVisionModePair,
 } from './client-presentation-boundary-main.js'
+import {
+  installClientHostCompatibility,
+} from './client-host-compat-prelude.js'
 import { installVisionModelVisibilityBoundary } from './vision-model-visibility-boundary.js'
 
 const CLIENT_PRESENTATION_MARK = 'data-vision-router-presentation-boundary'
 
+const VISION_TOGGLE_TEXT_GLYPH = String.raw`          React.createElement('span', { 'aria-hidden': 'true', style: { fontSize: 13, lineHeight: 1 } }, '👁'),
+          React.createElement('span', null, t('label')),
+          active
+            ? React.createElement('span', {
+                'aria-hidden': 'true',
+                style: { fontSize: 12, lineHeight: 1, fontWeight: 800, marginLeft: 1 }
+              }, '✓')
+            : null`
+
+const VISION_TOGGLE_FIXED_SVG = String.raw`          React.createElement('svg', {
+            width: 14,
+            height: 14,
+            viewBox: '0 0 14 14',
+            fill: 'none',
+            'aria-hidden': 'true',
+            focusable: 'false',
+            style: { display: 'block', flex: '0 0 auto' }
+          }, React.createElement('path', {
+            fillRule: 'evenodd',
+            clipRule: 'evenodd',
+            d: 'M7 2.25c-2.84 0-5.04 1.69-6.25 4.25a1.15 1.15 0 0 0 0 1C1.96 10.06 4.16 11.75 7 11.75s5.04-1.69 6.25-4.25a1.15 1.15 0 0 0 0-1C12.04 3.94 9.84 2.25 7 2.25Zm0 1.25c2.16 0 3.96 1.21 5.05 3.5C10.96 9.29 9.16 10.5 7 10.5S3.04 9.29 1.95 7C3.04 4.71 4.84 3.5 7 3.5Zm0 1.25A2.25 2.25 0 1 0 7 9.25a2.25 2.25 0 0 0 0-4.5Zm0 1.25a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z',
+            fill: 'currentColor'
+          })),
+          React.createElement('span', null, t('label')),
+          active
+            ? React.createElement('svg', {
+                width: 12,
+                height: 12,
+                viewBox: '0 0 14 14',
+                fill: 'none',
+                'aria-hidden': 'true',
+                focusable: 'false',
+                style: { display: 'block', flex: '0 0 auto', marginLeft: 1 }
+              }, React.createElement('path', {
+                d: 'M2.75 7.15 5.6 10 11.25 4.35',
+                stroke: 'currentColor',
+                strokeWidth: 1.5,
+                strokeLinecap: 'round',
+                strokeLinejoin: 'round'
+              }))
+            : null`
+
+export function transformVisionModeToggleIcons(source = BASE_CLIENT_PRESENTATION_PRELUDE) {
+  const input = String(source)
+  if (!input.includes(VISION_TOGGLE_TEXT_GLYPH)) {
+    throw new Error('vision toggle icon transform anchor missing')
+  }
+  return input.replace(VISION_TOGGLE_TEXT_GLYPH, VISION_TOGGLE_FIXED_SVG)
+}
+
+export const CLIENT_PRESENTATION_PRELUDE = transformVisionModeToggleIcons()
+
 export {
-  CLIENT_PRESENTATION_PRELUDE,
   resolveVisionModePair,
-} from './client-presentation-boundary-main.js'
+}
 
 export function injectClientPresentationBoundary(html) {
   if (typeof html !== 'string' || htmlHasScriptMarker(html, CLIENT_PRESENTATION_MARK)) return html
@@ -28,6 +82,10 @@ export function installClientPresentationBoundary(ctx) {
       'vision-router: client presentation boundary',
     )
   })
+  // Keep Host-version compatibility in its own capability-detected prelude.
+  // This lets the large legacy client factory stay byte-stable while alpha/new
+  // Hosts expose their current Remote/Connection seams to it.
+  installClientHostCompatibility(ctx)
   // #286 keeps real wrapper routes registered while hiding only confidently
   // owned wrappers from DSH's stock model-selection presentation. Compose that
   // presentation boundary here so v2 can retain its hardened script-marker

package/lib/client.js

@@ -1,6 +1,5 @@
-// dsh-vision-router browser half: a first-class 设置 > Vision Router page plus
-// the legacy 设置 > 插件 configuration card, both editing the same host-owned
-// `vision-router` settings namespace. Self-contained
+// dsh-vision-router browser half: one first-class Settings > Vision Router page
+// backed by the host-owned `vision-router` settings namespace. Self-contained
 // by hand (no bundler in this repo): the client module system wraps it in a
 // CJS factory and the kernel adopts { apply, inject } as a client plugin.
 window.__ModuleLoader__.load({
@@ -56,9 +55,6 @@ window.__ModuleLoader__.load({
       remoteSettingsProxyBody: '远程设置路由返回 404。若使用 Nginx/Caddy/其他反向代理，请同时转发 /vision-router-settings/* 到 DSH。',
       remoteSafeScopeHint: '远程页面只允许修改低风险偏好；网络、凭据、本地后端、产物目录、桌面截图和宿主路由等设置只能在 DSH 本机修改。',
       settingsConflict: '设置已被另一端修改。已刷新最新配置，请确认你的修改后重新保存。',
-      legacyMovedTitle: 'Vision Router 设置已迁移',
-      legacyMovedBody: '主设置入口现在位于「设置 → Vision Router」。此处仅保留兼容入口，不再维护第二份可编辑表单。',
-      legacyOpen: '打开 Vision Router 设置',
       overridden: '已覆盖',
       reset: '恢复默认',
       toggleInstantDescribe: '即时本地识图',
@@ -255,13 +251,14 @@ window.__ModuleLoader__.load({
       guidanceOverridePlaceholder: '输入自定义引导语（留空 = 使用内置）',
       addGuidanceOverride: '+ 添加一条自定义引导',
       selectKind: '选择图片类型…',
-      visionDepthFast: '快速（最多再细看 1 次）',
-      visionDepthStandard: '标准（细看 1-2 次，默认）',
-      visionDepthDeep: '细致（细看 2-4 次）',
-      visionDepthCustom: '自定义（自己填次数上限）',
-      hintVisionDepth: '选择看图时的精细度：快速最省（最多再细看 1 次）、标准为默认（细看 1-2 次）、细致看得最细（细看 2-4 次）。档位只限制「再细看几次」，具体看什么由模型按你的问题决定。',
-      labelVisionDepthMaxCalls: '自定义深挖次数上限',
-      hintVisionDepthMaxCalls: '选择「自定义」后填写次数上限（1-100）；留空或填 0 = 不限制深挖次数（视同标准档）。bootstrap 预识别那遍不计入，失败的调用也不占次数。',
+      visionDepthFast: '快速（优先整体判断）',
+      visionDepthStandard: '标准（按需查证，默认）',
+      visionDepthDeep: '细致（主动交叉验证）',
+      hintVisionDepth: '看图深度只决定识图策略，不限制调用次数：快速优先整体判断，标准按问题需要查证，细致会主动做更多局部检查与交叉验证。如需限制调用次数，请启用下方「限制深挖次数」。',
+      depthCapTitle: '限制深挖次数',
+      depthCapHint: '默认关闭，不限制视觉证据调用次数。启用后可设置本轮最多允许多少次成功的深挖证据调用；bootstrap 预识别不计入，失败或空证据调用不占次数。',
+      depthCapValueLabel: '最多深挖次数',
+      depthCapInvalid: '请输入 1–100 之间的整数。',
       numHintTimeoutMs: '单个视觉请求超时；默认 120000。',
       numHintVisionTaskTimeoutMs: '一次识图任务（含全部 provider、回退与重试）共享的总时限；默认 45000。认证失败/限流会立即熔断对应后端。',
       numHintOcrTimeoutMs: '一次 OCR 任务的总时限；本地 tesseract 最多用 12 秒，视觉模型回退只用剩余部分；默认 30000。',
@@ -332,9 +329,6 @@ window.__ModuleLoader__.load({
       remoteSettingsProxyBody: 'The remote-settings route returned 404. If DSH is behind Nginx, Caddy, or another reverse proxy, also forward /vision-router-settings/* to DSH.',
       remoteSafeScopeHint: 'Remote pages can change low-risk preferences only. Network, credentials, local backends, artifact paths, desktop capture, and host routing remain loopback-only.',
       settingsConflict: 'Settings changed on another client. The latest values were refreshed; review your draft and save again.',
-      legacyMovedTitle: 'Vision Router settings moved',
-      legacyMovedBody: 'The canonical editor is now Settings → Vision Router. This compatibility entry no longer keeps a second editable form.',
-      legacyOpen: 'Open Vision Router settings',
       overridden: 'Overridden',
       reset: 'Reset',
       toggleInstantDescribe: 'Instant local image recognition',
@@ -534,13 +528,14 @@ window.__ModuleLoader__.load({
       guidanceOverridePlaceholder: 'Enter custom guidance (empty = built-in)',
       addGuidanceOverride: '+ Add a custom guidance line',
       selectKind: 'Select image type…',
-      visionDepthFast: 'Quick (at most 1 more look)',
-      visionDepthStandard: 'Standard (1-2 looks, default)',
-      visionDepthDeep: 'Thorough (2-4 looks)',
-      visionDepthCustom: 'Custom (set your own cap)',
-      hintVisionDepth: 'How thoroughly to look after the structured pre-scan: Quick is cheapest (at most 1 more look), Standard is the default (1-2 looks), Thorough looks the closest (2-4 looks). The tier only caps how many extra looks are allowed; what the model looks for is driven by your question.',
-      labelVisionDepthMaxCalls: 'Custom deep-dive call cap',
-      hintVisionDepthMaxCalls: 'Pick "Custom" first, then enter a cap (1-100). Empty or 0 = no cap (same as Standard). The bootstrap pre-scan does not count, and failed calls do not consume the quota.',
+      visionDepthFast: 'Quick (overall-first)',
+      visionDepthStandard: 'Standard (evidence as needed, default)',
+      visionDepthDeep: 'Thorough (proactive cross-checking)',
+      hintVisionDepth: 'Vision depth chooses the inspection strategy, not a call-count limit: Quick stays overall-first, Standard verifies evidence as needed, and Thorough proactively inspects details and cross-checks important claims. To cap calls, enable “Limit deep-dive calls” below.',
+      depthCapTitle: 'Limit deep-dive calls',
+      depthCapHint: 'Off by default, so visual evidence calls are unlimited. Enable this to cap successful deep-evidence calls for the turn. The bootstrap pre-scan does not count, and failed or empty-evidence calls do not consume the cap.',
+      depthCapValueLabel: 'Maximum deep-dive calls',
+      depthCapInvalid: 'Enter an integer from 1 to 100.',
       numHintTimeoutMs: 'Per vision-call deadline; default 120000.',
       numHintVisionTaskTimeoutMs: 'One vision task (all providers, fallbacks and retries) shares this wall-clock budget; default 45000. Auth failures and rate limits trip their backend immediately.',
       numHintOcrTimeoutMs: 'Total budget for one OCR task: tesseract gets at most 12s, the vision fallback only the remainder; default 30000.',
@@ -1196,11 +1191,13 @@ window.__ModuleLoader__.load({
       if (provider === '' || model === '') return undefined
       return { provider, model }
     }
-    function parseNumber(text, min) {
+    function parseNumber(text, min, max) {
       const trimmed = String(text ?? '').trim()
       if (trimmed === '') return { clear: true }
       const parsed = Number(trimmed)
-      return Number.isInteger(parsed) && parsed >= min ? { value: parsed } : undefined
+      return Number.isInteger(parsed) && parsed >= min && (max === undefined || parsed <= max)
+        ? { value: parsed }
+        : undefined
     }
 
     // ── styles: mirrors the built-in plugin cards (same design tokens) ──────
@@ -1768,8 +1765,7 @@ window.__ModuleLoader__.load({
       return list.find(guideElementUsable)
     }
     // The walkthrough has one canonical destination: the first-class
-    // Vision Router settings section. The legacy plugin card remains mounted
-    // for compatibility, but onboarding never teaches two competing paths.
+    // Vision Router settings section registered below.
     function guideVisionRouterNav() {
       const panel = guideSettingsPanel()
       if (!panel) return undefined
@@ -2758,7 +2754,8 @@ window.__ModuleLoader__.load({
         }
         if (key === 'localDescribeStyle') return value === 'structured' ? 'structured' : 'plain'
         if (SELECT_KEYS.includes(key)) {
-          return value === 'fast' || value === 'standard' || value === 'deep' || value === 'custom' ? value : 'standard'
+          if (value === 'custom') return 'standard'
+          return value === 'fast' || value === 'standard' || value === 'deep' ? value : 'standard'
         }
         return typeof value === 'string' ? value : ''
       }
@@ -2785,7 +2782,9 @@ window.__ModuleLoader__.load({
           const value = parseTextProvider(text)
           return value === undefined ? undefined : { value }
         }
-        if (NUMBER_KEYS.includes(key) || DEPTH_NUMBER_KEYS.includes(key)) return parseNumber(text, NUMBER_META[key].min)
+        if (NUMBER_KEYS.includes(key) || DEPTH_NUMBER_KEYS.includes(key)) {
+          return parseNumber(text, NUMBER_META[key].min, NUMBER_META[key].max)
+        }
         if (key === 'guidanceOverrides') {
           const rows = Array.isArray(text) ? text : []
           const cleaned = []
@@ -2815,7 +2814,7 @@ window.__ModuleLoader__.load({
           return text === 'structured' || text === 'plain' ? { value: text } : undefined
         }
         if (SELECT_KEYS.includes(key)) {
-          return text === 'fast' || text === 'standard' || text === 'deep' || text === 'custom' ? { value: text } : undefined
+          return text === 'fast' || text === 'standard' || text === 'deep' ? { value: text } : undefined
         }
         if (key === 'proxyHosts') {
           const list = String(text ?? '')
@@ -3136,6 +3135,7 @@ window.__ModuleLoader__.load({
           ),
           h('select', {
             className: 'vr-input vr-select' + (invalidField ? ' vr-input-invalid' : ''),
+            'data-vr-depth-strategy': key === 'visionDepth' ? '1' : undefined,
             value: format(key), disabled: editBlocked,
             onChange: (event) => setDraft(key, event.target.value),
           },
@@ -3148,6 +3148,44 @@ window.__ModuleLoader__.load({
               : null,
         )
       }
+      const depthCapField = () => {
+        const key = 'visionDepthMaxCalls'
+        const raw = format(key)
+        const parsed = Number(raw)
+        const enabled = Number.isInteger(parsed) && parsed > 0
+        const invalidField = key in drafts && parse(key, drafts[key]) === undefined
+        const savedRaw = Number(readValue(snapshot, key))
+        const savedCap = Number.isInteger(savedRaw) && savedRaw >= 1 && savedRaw <= 100 ? savedRaw : 4
+        return h('div', { className: 'vr-field', key, 'data-vr-depth-cap': '1' },
+          h('div', { className: 'vr-field-head' },
+            h('div', { className: 'vr-toggle' },
+              h('span', { className: 'vr-label' }, t('depthCapTitle')),
+              h('input', {
+                type: 'checkbox', className: 'vr-check', checked: enabled,
+                'data-vr-depth-cap-toggle': '1', disabled: editBlocked,
+                onChange: (event) => setDraft(key, event.target.checked ? String(savedCap) : '0'),
+              }),
+            ),
+            overriddenBadge(key),
+          ),
+          h('p', { className: 'vr-hint' }, t('depthCapHint')),
+          enabled
+            ? h('div', { className: 'vr-local-row' },
+                h('label', { className: 'vr-label vr-local-label' }, t('depthCapValueLabel')),
+                h('input', {
+                  className: 'vr-input' + (invalidField ? ' vr-input-invalid' : ''),
+                  type: 'number', min: 1, max: 100, step: 1, value: raw,
+                  'data-vr-depth-cap-value': '1', disabled: editBlocked,
+                  onChange: (event) => setDraft(key, event.target.value),
+                }),
+                invalidField
+                  ? h('p', { className: 'vr-invalid' }, t('depthCapInvalid'))
+                  : null,
+              )
+            : null,
+        )
+      }
+
       // 自定义识图引导编辑器：每行 [图片类型 select] [引导语 input] [移除]，+ 添加。
       const GUIDANCE_KIND_OPTIONS = [
         { value: 'code', label: 'code（代码）' },
@@ -3948,14 +3986,11 @@ window.__ModuleLoader__.load({
                       { value: 'fast', label: t('visionDepthFast') },
                       { value: 'standard', label: t('visionDepthStandard') },
                       { value: 'deep', label: t('visionDepthDeep') },
-                      { value: 'custom', label: t('visionDepthCustom') },
                     ])),
-                    format('visionDepth') === 'custom'
-                      ? DEPTH_NUMBER_KEYS.map((key) => textField(key, t(LABEL_KEY[key]), t(HINT_KEY[key]), false))
-                      : null,
                     guidanceOverridesEditor(),
                   )
                 : null,
+              depthCapField(),
               // Local vision is a primary capability. Keep the heavy editors
               // collapsed by default, but make the entry obvious at a glance.
               !remoteMode ? h('div', {
@@ -4214,23 +4249,6 @@ window.__ModuleLoader__.load({
       )
     }
 
-    function VisionRouterLegacyEntry(props) {
-      const t = props.t
-      const h = React.createElement
-      return h('li', { className: 'vr-card vr-card-open' },
-        h('div', { className: 'vr-body' },
-          h('div', { className: 'vr-quickstart' },
-            h('div', { className: 'vr-quickstart-title' }, t('legacyMovedTitle')),
-            h('p', { className: 'vr-quickstart-body' }, t('legacyMovedBody')),
-            h('button', {
-              type: 'button', className: 'vr-btn vr-btn-save',
-              onClick: () => { guideHostUi.openVisionRouter() },
-            }, t('legacyOpen')),
-          ),
-        ),
-      )
-    }
-
     function apply(ctx) {
       const localScope = ctx.settingsScope.bind({ namespace: 'vision-router' })
       const presentedImageUrls = new Map()
@@ -4365,11 +4383,9 @@ window.__ModuleLoader__.load({
       // this identity stays fixed across slot renders.
       const subscribeConnectionReset = (listener) => ctx.on('connection/reset', listener)
       const cardInject = { getConnection, t, locale: ctx.locale, remote: ctx.remote, subscribeConnectionReset }
-      // One form implementation, two presentation surfaces. Only the primary
-      // section switches to the opt-in remote scope on a non-loopback client;
-      // the legacy plugin card remains a compatibility shell over DSH's local scope.
+      // Vision Router owns one canonical settings surface. The section switches
+      // to the opt-in remote scope on a non-loopback client.
       const sectionCardInject = Object.freeze({ ...cardInject, scope: primaryScope, surface: 'section' })
-      const legacyEntryInject = Object.freeze({ t })
       const VisionRouterSettingsSection = (sectionProps) =>
         React.createElement(
           'ul',
@@ -4392,23 +4408,6 @@ window.__ModuleLoader__.load({
           }),
         'vision-router: primary settings section',
       )
-      ctx.effect(
-        () =>
-          ctx.slots.inject('settings.plugin.item', function* () {
-            yield ctx.slots.register(
-              {
-                name: 'settings.plugin.item',
-                key: 'vision-router',
-                id: 'vision-router',
-                order: 30,
-                label: () => t('nav'),
-                inject: () => legacyEntryInject,
-              },
-              VisionRouterLegacyEntry,
-            )
-          }),
-        'vision-router: legacy plugin settings card',
-      )
       ctx.effect(
         () =>
           ctx.slots.inject('tool.call.toolview', function* () {