dsh-deferred-boot 0.3.0 → 0.3.2

package/lib/client.js

@@ -1,228 +1,627 @@
-// Client half of dsh-deferred-boot.
-//
-// It renders the plugin's form on the plugin page (the bundle-config slot of
-// dsh-client-ui-plugin-manager) and reads/writes the `deferred-boot` settings
-// namespace through ctx.configForms. The host half (src/index.js) declares the
-// four fields as volatile so this form is the only place they are edited.
-window.__ModuleLoader__.load({
-  id: 'dsh-deferred-boot',
-  factory: (require) => {
-    var module = { exports: {} }
-    var exports = module.exports
-    const React = require('react')
-    const h = React.createElement
-
-    const styles = {
-      root: { display: 'flex', flexDirection: 'column', gap: '6px', fontSize: 13, lineHeight: 1.5 },
-      intro: { margin: '0 0 10px', color: 'var(--dsh-text-2, #c8c8c8)' },
-      row: { display: 'flex', flexDirection: 'column', gap: '3px', padding: '6px 0' },
-      rowMain: { display: 'flex', alignItems: 'center', gap: 12 },
-      label: { width: 156, flex: '0 0 156px', color: 'var(--dsh-text-2, #c8c8c8)' },
-      input: {
-        flex: '0 1 240px',
-        minWidth: 120,
-        padding: '4px 8px',
-        borderRadius: 6,
-        border: '1px solid var(--dsh-border, #3a3a3a)',
-        background: 'var(--dsh-surface, #1f1f1f)',
-        color: 'inherit',
-        font: 'inherit',
-      },
-      hint: { margin: '0 0 0 168px', fontSize: 12, lineHeight: 1.5, color: 'var(--dsh-text-3, #8b8b8b)' },
-      note: { margin: '0 0 0 168px', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' },
-      textarea: {
-        width: '100%',
-        minHeight: 96,
-        padding: '6px 8px',
-        borderRadius: 6,
-        border: '1px solid var(--dsh-border, #3a3a3a)',
-        background: 'var(--dsh-surface, #1f1f1f)',
-        color: 'inherit',
-        font: 'inherit',
-        resize: 'vertical',
-      },
-      actions: { display: 'flex', alignItems: 'center', gap: 10, marginTop: 8 },
-      button: {
-        padding: '4px 14px',
-        borderRadius: 6,
-        border: '1px solid var(--dsh-accent, #4d6bfe)',
-        background: 'var(--dsh-accent, #4d6bfe)',
-        color: '#fff',
-        cursor: 'pointer',
-        font: 'inherit',
-      },
-      status: { fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' },
-    }
-
-    const ZH = {
-      intro: '把指定的插件推迟到主界面就绪之后再挂载，一次空闲切片只挂一个，避免插件成批初始化把首屏拖住。',
-      'field.idleDelay': '就绪后延迟 (ms)',
-      'field.disposeTimeout': 'dispose 超时 (ms)',
-      'field.readyFallbackMs': '就绪兜底超时 (ms)',
-      'field.deferredPlugins': '延迟挂载的插件',
-      'plugins.label': '延迟挂载的插件（JSON 数组，每项 { id, name, strategy, config }）',
-      'plugins.hint': 'strategy: idle（就绪后自动挂载）/ manual（调用 deferredBoot.ensure(id) 才挂载）/ inline-lazy / disabled。',
-      'hint.idleDelay': '主界面就绪后等待多久才开始第一次空闲调度（毫秒）。调大更晚开始、首屏更稳；调小更早挂载目标插件。',
-      'hint.disposeTimeout': '卸载或热重载目标插件时最多等待多久（毫秒）。超时视为已卸载并继续，防止卸载卡住调度。',
-      'hint.readyFallbackMs': '等不到“主界面已就绪”信号时的兜底超时（毫秒）。超时后按已就绪处理，继续延迟挂载。',
-      'hint.plugins': '每项一个目标插件：id 为 loader 条目 id，name 为模块名，strategy 决定挂载方式，config 传给目标插件。',
-      save: '保存',
-      saving: '保存中…',
-      saved: '已保存，下一次操作起生效。',
-      conflict: '配置已被其他窗口修改，已重新载入，请再保存一次。',
-      failed: '保存失败，请查看 Host 日志。',
-      badJson: '延迟插件不是合法 JSON，请修正后再保存。',
-      notArray: '延迟插件必须是 JSON 数组。',
-      unavailable: '配置服务暂不可用（需要新版 DSH 客户端）。',
-      note: '配置写入当前 profile 的 Cordis patch，无需手动编辑 cordis.patch.yml。',
-    }
-
-    const EN = {
-      intro: 'Mount the listed plugins after the main UI is ready, one idling slice at a time, so a batch of heavy plugins cannot hold up the first screen.',
-      'field.idleDelay': 'Delay after ready (ms)',
-      'field.disposeTimeout': 'Dispose timeout (ms)',
-      'field.readyFallbackMs': 'Ready fallback (ms)',
-      'field.deferredPlugins': 'Deferred plugins',
-      'plugins.label': 'Deferred plugins (JSON array, each { id, name, strategy, config })',
-      'plugins.hint': 'strategy: idle (mount after ready) / manual (wait for deferredBoot.ensure(id)) / inline-lazy / disabled.',
-      'hint.idleDelay': 'How long to wait after the main UI is ready before the first idle slice (ms). Larger waits longer for a steadier first paint; smaller mounts targets sooner.',
-      'hint.disposeTimeout': 'Maximum time to wait while unloading or hot-reloading a target (ms). On timeout the target is treated as unmounted and scheduling continues.',
-      'hint.readyFallbackMs': 'Fallback timeout for “main UI ready” (ms). When no ready signal arrives, mounting starts after this delay.',
-      'hint.plugins': 'One entry per deferred plugin: id is the loader entry id, name is the module name, strategy controls how it mounts, config is passed to the target.',
-      save: 'Save',
-      saving: 'Saving…',
-      saved: 'Saved; takes effect from the next operation.',
-      conflict: 'The settings changed in another window. Reloaded — please save again.',
-      failed: 'Save failed; check the host log.',
-      badJson: 'Deferred plugins is not valid JSON.',
-      notArray: 'Deferred plugins must be a JSON array.',
-      unavailable: 'The config form service is unavailable (a newer DSH client is required).',
-      note: 'The change is written to the current profile Cordis patch; cordis.patch.yml stays untouched.',
-    }
-
-    function Row(props) {
-      return h(
-        'div',
-        { style: styles.row },
-        h('div', { style: styles.rowMain }, h('span', { style: styles.label }, props.label), props.children),
-        props.hint ? h('p', { style: styles.hint }, props.hint) : null,
-      )
-    }
-
-    function useSnapshot(form) {
-      const [snapshot, setSnapshot] = React.useState(() => form.getSnapshot())
-      React.useEffect(() => {
-        setSnapshot(form.getSnapshot())
-        return form.subscribe(setSnapshot)
-      }, [form])
-      return snapshot
-    }
-
-    function toDraft(snapshot) {
-      const value = (snapshot && snapshot.value) || {}
-      const plugins = Array.isArray(value.deferredPlugins) ? value.deferredPlugins : []
-      return {
-        idleDelay: String(value.idleDelay ?? 1200),
-        disposeTimeout: String(value.disposeTimeout ?? 10000),
-        readyFallbackMs: String(value.readyFallbackMs ?? 5000),
-        plugins: JSON.stringify(plugins, null, 2),
-      }
-    }
-
-    // The slot system does not guarantee that a form component receives the
-    // plugin ctx, so keep the injected instance reachable from apply().
-    let pluginCtx = null
-
-    function DeferredBootForm(props) {
-      const t = typeof props?.t === 'function' ? props.t : (key) => key
-      const forms = (props && props.ctx && props.ctx.configForms) || (pluginCtx && pluginCtx.configForms)
-      if (!forms || typeof forms.get !== 'function') return h('p', { style: styles.intro }, t('unavailable'))
-      const form = forms.get('deferred-boot')
-      const snapshot = useSnapshot(form)
-      const [draft, setDraft] = React.useState(() => toDraft(snapshot))
-      const [status, setStatus] = React.useState('')
-
-      React.useEffect(() => {
-        setDraft(toDraft(snapshot))
-      }, [snapshot])
-
-      const set = (key) => (event) => setDraft((prev) => ({ ...prev, [key]: event.target.value }))
-
-      const save = async () => {
-        let plugins
-        try {
-          plugins = JSON.parse(draft.plugins)
-        } catch {
-          setStatus(t('badJson'))
-          return
-        }
-        if (!Array.isArray(plugins)) {
-          setStatus(t('notArray'))
-          return
-        }
-        setStatus(t('saving'))
-        try {
-          const base = snapshot && snapshot.revision
-          const result = await form.mutate(
-            [
-              { op: 'set', path: ['idleDelay'], value: Number(draft.idleDelay) || 0 },
-              { op: 'set', path: ['disposeTimeout'], value: Number(draft.disposeTimeout) || 0 },
-              { op: 'set', path: ['readyFallbackMs'], value: Number(draft.readyFallbackMs) || 0 },
-              { op: 'set', path: ['deferredPlugins'], value: plugins },
-            ],
-            base,
-          )
-          if (result === false) setStatus(t('conflict'))
-          else setStatus(t('saved'))
-        } catch {
-          setStatus(t('failed'))
-        }
-      }
-
-      return h(
-        'div',
-        { style: styles.root },
-        h('p', { style: styles.intro }, t('intro')),
-        h('div', { style: styles.row, padding: 0 }, h('span', { style: styles.label }, t('plugins.label'))),
-        h(Row, {
-          label: t('field.idleDelay'),
-          hint: t('hint.idleDelay'),
-        }, h('input', { style: styles.input, type: 'number', value: draft.idleDelay, onChange: set('idleDelay') })),
-        h(Row, {
-          label: t('field.disposeTimeout'),
-          hint: t('hint.disposeTimeout'),
-        }, h('input', { style: styles.input, type: 'number', value: draft.disposeTimeout, onChange: set('disposeTimeout') })),
-        h(Row, {
-          label: t('field.readyFallbackMs'),
-          hint: t('hint.readyFallbackMs'),
-        }, h('input', { style: styles.input, type: 'number', value: draft.readyFallbackMs, onChange: set('readyFallbackMs') })),
-        h('p', { style: { margin: '10px 0 0', color: 'var(--dsh-text-2, #c8c8c8)' } }, t('plugins.label')),
-        h('p', { style: styles.note, margin: '2px 0 6px' }, t('plugins.hint')),
-        h('textarea', { style: styles.textarea, value: draft.plugins, onChange: set('plugins') }),
-        h('p', { style: styles.hint, margin: '2px 0 0' }, t('hint.plugins')),
-        h('div', { style: styles.actions }, h('button', { style: styles.button, type: 'button', onClick: save }, t('save')), h('span', { style: styles.status }, status || t('note'))),
-      )
-    }
-
-    function apply(ctx) {
-      pluginCtx = ctx
-      if (ctx.locale && typeof ctx.locale.register === 'function') {
-        ctx.effect(() => ctx.locale.register('deferredBoot', 'zh', ZH), 'dsh-deferred-boot: zh dictionary')
-        ctx.effect(() => ctx.locale.register('deferredBoot', 'en', EN), 'dsh-deferred-boot: en dictionary')
-      }
-      ctx.effect(
-        () =>
-          ctx.configForms.whileServed(['deferred-boot'], () =>
-            ctx.slots.inject('plugins.bundle.config', () =>
-              ctx.slots.register({ name: 'plugins.bundle.config', key: 'dsh-deferred-boot', locale: 'deferredBoot' }, DeferredBootForm),
-            ),
-          ),
-        'dsh-deferred-boot: bundle config form',
-      )
-    }
-
-    exports.apply = apply
-    exports.inject = ['slots', 'configForms', 'remote', 'locale']
-    return module.exports
-  },
-})
+// Client half of dsh-deferred-boot.
+//
+// It renders the plugin's form in the settings item slot of the plugin
+// manager, lists the installed plugins with a startup cost grade, and
+// reads/writes the `deferred-boot` settings namespace through ctx.configForms.
+// The host half (src/index.js) declares the four fields as volatile so this
+// form is the only place they are edited.
+window.__ModuleLoader__.load({
+  id: 'dsh-deferred-boot',
+  factory: (require) => {
+    var module = { exports: {} }
+    var exports = module.exports
+    const React = require('react')
+    const h = React.createElement
+
+    const styles = {
+      root: { display: 'flex', flexDirection: 'column', gap: '6px', fontSize: 13, lineHeight: 1.5 },
+      intro: { margin: '0 0 10px', color: 'var(--dsh-text-2, #c8c8c8)' },
+      row: { display: 'flex', flexDirection: 'column', gap: '3px', padding: '6px 0' },
+      rowMain: { display: 'flex', alignItems: 'center', gap: 12 },
+      label: { width: 156, flex: '0 0 156px', color: 'var(--dsh-text-2, #c8c8c8)' },
+      input: {
+        flex: '0 1 240px',
+        minWidth: 120,
+        padding: '4px 8px',
+        borderRadius: 6,
+        border: '1px solid var(--dsh-border, #3a3a3a)',
+        background: 'var(--dsh-surface, #1f1f1f)',
+        color: 'inherit',
+        font: 'inherit',
+      },
+      hint: { margin: '0 0 0 168px', fontSize: 12, lineHeight: 1.5, color: 'var(--dsh-text-3, #8b8b8b)' },
+      note: { margin: '0 0 0 168px', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' },
+      textarea: {
+        width: '100%',
+        minHeight: 96,
+        padding: '6px 8px',
+        borderRadius: 6,
+        border: '1px solid var(--dsh-border, #3a3a3a)',
+        background: 'var(--dsh-surface, #1f1f1f)',
+        color: 'inherit',
+        font: 'inherit',
+        resize: 'vertical',
+      },
+      actions: { display: 'flex', alignItems: 'center', gap: 10, marginTop: 8 },
+      button: {
+        padding: '4px 14px',
+        borderRadius: 6,
+        border: '1px solid var(--dsh-accent, #4d6bfe)',
+        background: 'var(--dsh-accent, #4d6bfe)',
+        color: '#fff',
+        cursor: 'pointer',
+        font: 'inherit',
+      },
+      status: { fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' },
+      list: { margin: '4px 0 0', padding: 0, listStyle: 'none', display: 'flex', flexDirection: 'column', gap: 2 },
+      item: { display: 'flex', alignItems: 'center', gap: 8, padding: '3px 0' },
+      itemName: { flex: '1 1 auto', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' },
+      itemMeta: { flex: '0 0 auto', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' },
+      badge: {
+        flex: '0 0 auto',
+        padding: '0 6px',
+        borderRadius: 4,
+        fontSize: 11,
+        lineHeight: '18px',
+        border: '1px solid var(--dsh-border, #3a3a3a)',
+        color: 'var(--dsh-text-2, #c8c8c8)',
+      },
+      badgeHeavy: { borderColor: '#a33', color: '#e88' },
+      badgeMedium: { borderColor: '#a73', color: '#ec8' },
+      badgeLight: { borderColor: '#3a7', color: '#8d8' },
+      footer: {
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        marginTop: 10,
+        paddingTop: 8,
+        borderTop: '1px solid var(--dsh-border, #3a3a3a)',
+        fontSize: 12,
+        color: 'var(--dsh-text-3, #8b8b8b)',
+      },
+      estimate: { color: 'var(--dsh-text-2, #c8c8c8)' },
+      groupTitle: { margin: '12px 0 2px', fontSize: 12, color: 'var(--dsh-text-2, #c8c8c8)' },
+      linkButton: {
+        background: 'transparent',
+        border: 0,
+        padding: 0,
+        color: 'var(--dsh-accent, #4d6bfe)',
+        font: 'inherit',
+        fontSize: 12,
+        cursor: 'pointer',
+      },
+      card: {
+        border: '1px solid var(--dsh-border, #3a3a3a)',
+        borderRadius: 10,
+        padding: '12px 14px',
+        marginBottom: 10,
+        background: 'var(--dsh-surface-2, #1c1c1c)',
+      },
+      cardTitle: { margin: '0 0 10px', fontSize: 13, fontWeight: 600, color: 'var(--dsh-text-1, #e8e8e8)' },
+    }
+
+    const ZH = {
+      intro: '把指定的插件推迟到主界面就绪之后再挂载，一次空闲切片只挂一个，避免插件成批初始化把首屏拖住。',
+      'field.idleDelay': '就绪后延迟 (ms)',
+      'field.disposeTimeout': 'dispose 超时 (ms)',
+      'field.readyFallbackMs': '就绪兜底超时 (ms)',
+      'field.deferredPlugins': '延迟挂载的插件',
+      'plugins.label': '延迟挂载的插件（JSON 数组，每项 { id, name, strategy, config }）',
+      'plugins.hint': 'strategy: idle（就绪后自动挂载）/ manual（调用 deferredBoot.ensure(id) 才挂载）/ inline-lazy / disabled。',
+      'hint.idleDelay': '主界面就绪后等待多久才开始第一次空闲调度（毫秒）。调大更晚开始、首屏更稳；调小更早挂载目标插件。',
+      'hint.disposeTimeout': '卸载或热重载目标插件时最多等待多久（毫秒）。超时视为已卸载并继续，防止卸载卡住调度。',
+      'hint.readyFallbackMs': '等不到“主界面已就绪”信号时的兜底超时（毫秒）。超时后按已就绪处理，继续延迟挂载。',
+      'hint.plugins': '每项一个目标插件：id 为 loader 条目 id，name 为模块名，strategy 决定挂载方式，config 传给目标插件。',
+      'catalog.title': '可放缓启动的插件',
+      'catalog.hint': '勾选后这些插件会在主界面就绪后逐个挂载；评级按启动开销经验估算，仅供参考。',
+      'catalog.loading': '正在读取已安装插件…',
+      'catalog.failed': '读取插件列表失败（需要新版 DSH 客户端）。',
+      'catalog.empty': '没有可勾选的插件。',
+      'catalog.core': '核心',
+      'catalog.self': '本插件',
+      'catalog.running': '运行中',
+      'catalog.disabled': '已禁用',
+      'catalog.unknown': '未运行',
+      'grade.light': '较轻',
+      'grade.medium': '中等',
+      'grade.heavy': '严重',
+      'advanced': '高级：直接编辑 deferredPlugins（JSON）',
+      'estimate': '预计本次启动额外等待 ≈ {seconds} 秒（估算）',
+      save: '保存',
+      saving: '保存中…',
+      saved: '已保存，下一次操作起生效。',
+      conflict: '配置已被其他窗口修改，已重新载入，请再保存一次。',
+      failed: '保存失败，请查看 Host 日志。',
+      badJson: '延迟插件不是合法 JSON，请修正后再保存。',
+      notArray: '延迟插件必须是 JSON 数组。',
+      unavailable: '配置服务暂不可用（需要新版 DSH 客户端）。',
+      note: '配置写入当前 profile 的 Cordis patch，无需手动编辑 cordis.patch.yml。',
+      'section.hint': '主界面就绪后再逐个挂载插件，避免成批初始化拖住首屏。',
+      'section.open': '配置',
+      'section.close': '收起',
+      'panel.timing': '启动时机',
+      'group.third': '第三方插件',
+      'group.official': '官方插件',
+      'group.expand': '展开官方插件',
+      'group.collapse': '收起官方插件',
+    }
+
+    const EN = {
+      intro: 'Mount the listed plugins after the main UI is ready, one idling slice at a time, so a batch of heavy plugins cannot hold up the first screen.',
+      'field.idleDelay': 'Delay after ready (ms)',
+      'field.disposeTimeout': 'Dispose timeout (ms)',
+      'field.readyFallbackMs': 'Ready fallback (ms)',
+      'field.deferredPlugins': 'Deferred plugins',
+      'plugins.label': 'Deferred plugins (JSON array, each { id, name, strategy, config })',
+      'plugins.hint': 'strategy: idle (mount after ready) / manual (wait for deferredBoot.ensure(id)) / inline-lazy / disabled.',
+      'hint.idleDelay': 'How long to wait after the main UI is ready before the first idle slice (ms). Larger waits longer for a steadier first paint; smaller mounts targets sooner.',
+      'hint.disposeTimeout': 'Maximum time to wait while unloading or hot-reloading a target (ms). On timeout the target is treated as unmounted and scheduling continues.',
+      'hint.readyFallbackMs': 'Fallback timeout for “main UI ready” (ms). When no ready signal arrives, mounting starts after this delay.',
+      'hint.plugins': 'One entry per deferred plugin: id is the loader entry id, name is the module name, strategy controls how it mounts, config is passed to the target.',
+      'catalog.title': 'Plugins that can start later',
+      'catalog.hint': 'Checked plugins mount one by one after the main UI is ready. Grades are rough startup-cost estimates for reference only.',
+      'catalog.loading': 'Reading installed plugins…',
+      'catalog.failed': 'Could not read the installed plugin list (a newer DSH client is required).',
+      'catalog.empty': 'No plugins to choose from.',
+      'catalog.core': 'core',
+      'catalog.self': 'this plugin',
+      'catalog.running': 'running',
+      'catalog.disabled': 'disabled',
+      'catalog.unknown': 'not running',
+      'grade.light': 'light',
+      'grade.medium': 'medium',
+      'grade.heavy': 'heavy',
+      'advanced': 'Advanced: edit deferredPlugins (JSON) directly',
+      'estimate': 'Estimated extra wait this start ≈ {seconds}s (rough)',
+      save: 'Save',
+      saving: 'Saving…',
+      saved: 'Saved; takes effect from the next operation.',
+      conflict: 'The settings changed in another window. Reloaded — please save again.',
+      failed: 'Save failed; check the host log.',
+      badJson: 'Deferred plugins is not valid JSON.',
+      notArray: 'Deferred plugins must be a JSON array.',
+      unavailable: 'The config form service is unavailable (a newer DSH client is required).',
+      note: 'The change is written to the current profile Cordis patch; cordis.patch.yml stays untouched.',
+      'section.hint': 'Mount plugins one by one after the main UI is ready so a batch of initializers cannot hold up the first screen.',
+      'section.open': 'Configure',
+      'section.close': 'Collapse',
+      'panel.timing': 'Startup timing',
+      'group.third': 'Third-party plugins',
+      'group.official': 'Official plugins',
+      'group.expand': 'Show official plugins',
+      'group.collapse': 'Hide official plugins',
+    }
+
+    // Startup-cost grades are rough estimates used only for ordering and the
+    // bottom-right figure. They do not claim to be measurements.
+    const COST = { light: 200, medium: 600, heavy: 1800 }
+    const HEAVY = /billion-context|dshmarket|univer|office-toolkit|solidworks|mech-workbench|tabbit/
+    const MEDIUM = /dsh-pilot|whale|token-usage|plugin-mgr|dsh-unlag/
+
+    function gradeOf(name) {
+      const text = String(name || '')
+      if (HEAVY.test(text)) return 'heavy'
+      if (MEDIUM.test(text)) return 'medium'
+      return 'light'
+    }
+
+    function Row(props) {
+      return h(
+        'div',
+        { style: styles.row },
+        h('div', { style: styles.rowMain }, h('span', { style: styles.label }, props.label), props.children),
+        props.hint ? h('p', { style: styles.hint }, props.hint) : null,
+      )
+    }
+
+    function useSnapshot(form) {
+      // A settings controller can refuse `getSnapshot()` before its describe
+      // round-trip lands. That throw used to unmount the whole slot subtree
+      // (the form "flashed" and vanished), so every read is guarded.
+      const read = () => {
+        try {
+          if (!form || typeof form.getSnapshot !== 'function') return null
+          const value = form.getSnapshot()
+          return value && typeof value === 'object' ? value : null
+        } catch {
+          return null
+        }
+      }
+      const [snapshot, setSnapshot] = React.useState(read)
+      React.useEffect(() => {
+        if (!form || typeof form.subscribe !== 'function') return undefined
+        const sync = () => {
+          try {
+            setSnapshot(form.getSnapshot())
+          } catch {}
+        }
+        sync()
+        let off = null
+        try {
+          off = form.subscribe(sync)
+        } catch {}
+        return () => {
+          try {
+            if (typeof off === 'function') off()
+          } catch {}
+        }
+      }, [form])
+      return snapshot
+    }
+
+    function toPlugins(snapshot) {
+      const value = (snapshot && snapshot.value) || {}
+      return Array.isArray(value.deferredPlugins) ? value.deferredPlugins : []
+    }
+
+    function toDraft(snapshot) {
+      const value = (snapshot && snapshot.value) || {}
+      return {
+        idleDelay: String(value.idleDelay ?? 1200),
+        disposeTimeout: String(value.disposeTimeout ?? 10000),
+        readyFallbackMs: String(value.readyFallbackMs ?? 5000),
+        plugins: JSON.stringify(toPlugins(snapshot), null, 2),
+      }
+    }
+
+    function badgeStyle(grade) {
+      if (grade === 'heavy') return Object.assign({}, styles.badge, styles.badgeHeavy)
+      if (grade === 'medium') return Object.assign({}, styles.badge, styles.badgeMedium)
+      return Object.assign({}, styles.badge, styles.badgeLight)
+    }
+
+    // `listPlugins` reports each entry under its full loader id, e.g.
+    // `include:bili-native`. The scheduler hands that id straight to
+    // `loader.create`, which builds a *root* entry — and a root entry called
+    // `include:bili-native` collides with the very entry the bundle patch
+    // already inserted inside the `include` group. DSH treats a duplicate
+    // entry id as a hard error, so only the short name may be stored.
+    function shortEntryId(raw) {
+      const text = String(raw == null ? '' : raw)
+      const cut = text.lastIndexOf(':')
+      return cut < 0 ? text : text.slice(cut + 1)
+    }
+
+    // Normalise whatever is in the config: strip the group prefix, drop loader
+    // namespace nodes (`cordis:include` is a group, not a plugin, and creating
+    // it always fails), and de-duplicate by module name.
+    function normalizeDeferred(list) {
+      const out = []
+      const seen = new Set()
+      for (const item of Array.isArray(list) ? list : []) {
+        if (!item || typeof item.name !== 'string') continue
+        if (item.name.indexOf('cordis:') === 0) continue
+        if (seen.has(item.name)) continue
+        seen.add(item.name)
+        const next = Object.assign({}, item)
+        next.id = shortEntryId(next.id || item.name)
+        out.push(next)
+      }
+      return out
+    }
+
+    // The slot system does not guarantee that a form component receives the
+    // plugin ctx, so keep the injected instance reachable from apply().
+    let pluginCtx = null
+
+    // Reading a service off a Cordis context is gated by `inject` and throws on
+    // the strict proxy when the service is not injected for this component, so
+    // every access goes through try/catch: a throw here would unmount the whole
+    // slot subtree (the form "flashes" and disappears).
+    function configFormsOf(props) {
+      try {
+        const forms = props && props.ctx && props.ctx.configForms
+        if (forms && typeof forms.get === 'function') return forms
+      } catch {}
+      try {
+        const forms = pluginCtx && pluginCtx.configForms
+        if (forms && typeof forms.get === 'function') return forms
+      } catch {}
+      return null
+    }
+
+    // The slot renders the full form directly: opening the settings card (or
+    // the plugin page) lands on the form itself, without an extra collapsed
+    // row. The form lives in its own component so it mounts hook-safely.
+    function DeferredBootForm(props) {
+      const t = typeof props?.t === 'function'
+        ? props.t
+        : (key, params) => {
+          let text = ZH[key] ?? key
+          if (params && params.seconds !== undefined) text = text.replace('{seconds}', params.seconds)
+          return text
+        }
+      const forms = configFormsOf(props)
+      if (!forms) return h('p', { style: styles.intro }, t('unavailable'))
+      let form = null
+      for (const namespace of ['deferred-boot', 'include:deferred-boot']) {
+        try {
+          const candidate = forms.get(namespace)
+          if (candidate && typeof candidate.getSnapshot === 'function') {
+            form = candidate
+            break
+          }
+        } catch {}
+      }
+      if (!form || typeof form.getSnapshot !== 'function') return h('p', { style: styles.intro }, t('unavailable'))
+      const snapshot = useSnapshot(form)
+      const [draft, setDraft] = React.useState(() => toDraft(snapshot))
+      const [status, setStatus] = React.useState('')
+      const [catalog, setCatalog] = React.useState({ status: 'loading', rows: [] })
+      const [officialOpen, setOfficialOpen] = React.useState(false)
+
+      React.useEffect(() => {
+        setDraft(toDraft(snapshot))
+      }, [snapshot])
+
+      // Read the installed plugin rows through the owner-side remote API. The
+      // owner page is always allowed, so no remoteAccess gate is needed.
+      React.useEffect(() => {
+        const ctx = pluginCtx || (props && props.ctx)
+        let alive = true
+        let timer = null
+        const fail = (message) => {
+          if (!alive) return
+          setCatalog({ status: 'failed', rows: [], error: message || '' })
+        }
+        if (!ctx) {
+          fail('no context')
+          return () => {
+            alive = false
+          }
+        }
+        // `remote` may be mounted slightly after the page loads, so retry a
+        // few times before giving up. Cordis 4 contexts are strict proxies:
+        // reading an unknown service throws, so guard every touch.
+        const attempt = (remaining) => {
+          let api = null
+          try {
+            api = (typeof ctx.get === 'function' ? ctx.get('remote.pluginManager') : null)
+              || (ctx.remote && ctx.remote.pluginManager)
+          } catch (error) {
+            fail(error && error.message ? error.message : 'remote unavailable')
+            return
+          }
+          if (!api || typeof api.listPlugins !== 'function') {
+            fail('pluginManager/listPlugins unavailable')
+            return
+          }
+          Promise.resolve()
+            .then(() => api.listPlugins())
+            .then((answer) => {
+              if (!alive) return
+              if (!answer || !answer.ok) {
+                if (remaining > 0) {
+                  timer = setTimeout(() => attempt(remaining - 1), 1200)
+                  return
+                }
+                fail(answer && answer.error ? (answer.error.code || answer.error.message) : 'listPlugins refused')
+                return
+              }
+              const rows = (Array.isArray(answer.value) ? answer.value : [])
+                .filter((row) => row && typeof row.moduleName === 'string')
+                // `cordis:*` are loader namespace/group nodes, not plugins.
+                .filter((row) => row.moduleName.indexOf('cordis:') !== 0)
+                .map((row) => ({
+                  id: shortEntryId(row.entryId ?? row.moduleName),
+                  name: row.moduleName,
+                  enabled: row.enabled !== false,
+                  phase: row.fiberPhase ?? null,
+                }))
+              setCatalog({ status: 'ready', rows })
+            })
+            .catch((error) => {
+              if (!alive) return
+              if (remaining > 0) {
+                timer = setTimeout(() => attempt(remaining - 1), 1200)
+                return
+              }
+              fail(error && error.message ? error.message : 'listPlugins failed')
+            })
+        }
+        attempt(2)
+        return () => {
+          alive = false
+          if (timer) clearTimeout(timer)
+        }
+      }, [props && props.ctx])
+
+      const set = (key) => (event) => setDraft((prev) => ({ ...prev, [key]: event.target.value }))
+
+      const plugins = React.useMemo(() => {
+        try {
+          const parsed = JSON.parse(draft.plugins)
+          return Array.isArray(parsed) ? parsed : []
+        } catch {
+          return []
+        }
+      }, [draft.plugins])
+
+      const selected = React.useMemo(() => {
+        const map = new Map()
+        for (const item of plugins) {
+          if (item && typeof item.name === 'string') map.set(item.name, item)
+        }
+        return map
+      }, [plugins])
+
+      const toggle = (row, checked) => {
+        let current = []
+        try {
+          const parsed = JSON.parse(draft.plugins)
+          current = Array.isArray(parsed) ? parsed : []
+        } catch {}
+        const list = current.slice()
+        const index = list.findIndex((item) => item && item.name === row.name)
+        if (checked && index < 0) {
+          list.push({ id: shortEntryId(row.id), name: row.name, strategy: 'idle' })
+        } else if (!checked && index >= 0) {
+          list.splice(index, 1)
+        }
+        setDraft((prev) => ({ ...prev, plugins: JSON.stringify(list, null, 2) }))
+      }
+
+      const estimateMs = React.useMemo(() => {
+        let total = Number(draft.idleDelay) || 0
+        for (const name of selected.keys()) total += COST[gradeOf(name)] || 0
+        return total
+      }, [selected, draft.idleDelay])
+
+      const save = async () => {
+        let plugins
+        try {
+          plugins = JSON.parse(draft.plugins)
+        } catch {
+          setStatus(t('badJson'))
+          return
+        }
+        if (!Array.isArray(plugins)) {
+          setStatus(t('notArray'))
+          return
+        }
+        plugins = normalizeDeferred(plugins)
+        setDraft((prev) => ({ ...prev, plugins: JSON.stringify(plugins, null, 2) }))
+        setStatus(t('saving'))
+        try {
+          const base = snapshot && snapshot.revision
+          const result = await form.mutate(
+            [
+              { op: 'set', path: ['idleDelay'], value: Number(draft.idleDelay) || 0 },
+              { op: 'set', path: ['disposeTimeout'], value: Number(draft.disposeTimeout) || 0 },
+              { op: 'set', path: ['readyFallbackMs'], value: Number(draft.readyFallbackMs) || 0 },
+              { op: 'set', path: ['deferredPlugins'], value: plugins },
+            ],
+            base,
+          )
+          if (result === false) setStatus(t('conflict'))
+          else setStatus(t('saved'))
+        } catch {
+          setStatus(t('failed'))
+        }
+      }
+
+      const rows = catalog.rows
+      const groups = React.useMemo(() => {
+        const official = []
+        const third = []
+        for (const row of rows) {
+          if (row.name.indexOf('@deepseek-ai/') === 0) official.push(row)
+          else third.push(row)
+        }
+        return { official, third }
+      }, [rows])
+
+      const renderRow = (row) => {
+        const isSelf = row.name === 'dsh-deferred-boot'
+        const isCore = row.name.indexOf('@deepseek-ai/') === 0
+        const locked = isSelf || isCore
+        const grade = gradeOf(row.name)
+        const checked = selected.has(row.name)
+        const stateText = row.phase === 'failed' ? t('catalog.unknown') : row.enabled ? t('catalog.running') : t('catalog.disabled')
+        return h('li', { key: row.id, style: styles.item },
+          h('input', {
+            type: 'checkbox',
+            checked,
+            disabled: locked,
+            onChange: (event) => { if (!locked) toggle(row, event.target.checked) },
+          }),
+          h('span', { style: styles.itemName, title: row.name }, row.name),
+          h('span', { style: Object.assign({}, badgeStyle(grade), { width: 56, flex: '0 0 56px', textAlign: 'center' }) }, t('grade.' + grade)),
+          h('span', { style: { width: 56, flex: '0 0 56px', textAlign: 'right', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' } }, isSelf ? t('catalog.self') : isCore ? t('catalog.core') : stateText),
+          h('span', { style: { width: 72, flex: '0 0 72px', textAlign: 'right', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)', fontVariantNumeric: 'tabular-nums' } }, '~' + COST[grade] + 'ms'),
+        )
+      }
+
+      return h(
+        'div',
+        { style: styles.root },
+        h('p', { style: styles.intro }, t('intro')),
+        h('section', { style: styles.card },
+          h('h3', { style: styles.cardTitle }, t('panel.timing')),
+          h(Row, {
+            label: t('field.idleDelay'),
+            hint: t('hint.idleDelay'),
+          }, h('input', { style: styles.input, type: 'number', value: draft.idleDelay, onChange: set('idleDelay') })),
+          h(Row, {
+            label: t('field.disposeTimeout'),
+            hint: t('hint.disposeTimeout'),
+          }, h('input', { style: styles.input, type: 'number', value: draft.disposeTimeout, onChange: set('disposeTimeout') })),
+          h(Row, {
+            label: t('field.readyFallbackMs'),
+            hint: t('hint.readyFallbackMs'),
+          }, h('input', { style: styles.input, type: 'number', value: draft.readyFallbackMs, onChange: set('readyFallbackMs') })),
+        ),
+        h('section', { style: styles.card },
+          h('h3', { style: styles.cardTitle }, t('catalog.title')),
+          h('p', { style: { margin: '0 0 8px', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' } }, t('catalog.hint')),
+          catalog.status === 'loading'
+            ? h('p', { style: Object.assign({}, styles.note, { margin: '0' }) }, t('catalog.loading'))
+            : catalog.status === 'failed'
+              ? h('p', { style: Object.assign({}, styles.note, { margin: '0' }) }, t('catalog.failed') + (catalog.error ? '（' + catalog.error + '）' : ''))
+              : rows.length === 0
+                ? h('p', { style: Object.assign({}, styles.note, { margin: '0' }) }, t('catalog.empty'))
+                : h('div', null,
+                  h('p', { style: styles.groupTitle }, t('group.third') + '（' + groups.third.length + '）'),
+                  groups.third.length === 0 ? null : h('ul', { style: styles.list }, groups.third.map(renderRow)),
+                  h('button', { type: 'button', style: styles.linkButton, onClick: () => setOfficialOpen((value) => !value) },
+                    (officialOpen ? t('group.collapse') : t('group.expand')) + '（' + groups.official.length + '）'),
+                  officialOpen ? h('ul', { style: styles.list }, groups.official.map(renderRow)) : null,
+                ),
+        ),
+
+        h('details', { style: { marginTop: 10 } },
+          h('summary', { style: { cursor: 'pointer', fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' } }, t('advanced')),
+          h('textarea', { style: styles.textarea, value: draft.plugins, onChange: set('plugins') }),
+        ),
+
+        h('div', { style: styles.footer },
+          h('span', { style: styles.status }, status || t('note')),
+          h('span', { style: styles.estimate }, t('estimate', { seconds: (estimateMs / 1000).toFixed(1) })),
+        ),
+        h('div', { style: styles.actions },
+          h('button', { style: styles.button, type: 'button', onClick: save }, t('save')),
+          typeof props?.onClose === 'function'
+            ? h('button', { type: 'button', style: styles.linkButton, onClick: props.onClose }, t('section.close'))
+            : null,
+        ),
+      )
+    }
+
+    // The settings item is rendered twice by the manager: once as the card
+    // summary in the installed list and once as the page body after opening
+    // it. `view` tells them apart, so the long form only mounts on the page.
+    function DeferredBootItem(props) {
+      const t = typeof props?.t === 'function'
+        ? props.t
+        : (key) => ZH[key] ?? key
+      if (props && props.view === 'summary') {
+        return h('span', { style: { fontSize: 12, color: 'var(--dsh-text-3, #8b8b8b)' } }, t('section.hint'))
+      }
+      return h(DeferredBootForm, props)
+    }
+
+    function apply(ctx) {
+      pluginCtx = ctx
+      try {
+        if (ctx.locale && typeof ctx.locale.register === 'function') {
+          ctx.effect(() => ctx.locale.register('deferredBoot', 'zh', ZH), 'dsh-deferred-boot: zh dictionary')
+          ctx.effect(() => ctx.locale.register('deferredBoot', 'en', EN), 'dsh-deferred-boot: en dictionary')
+        }
+      } catch (error) {
+        // A locale failure must never prevent the configuration form from mounting.
+        console.warn('dsh-deferred-boot: locale registration failed', error)
+      }
+      ctx.effect(
+        () =>
+          ctx.slots.inject('plugins.item', () =>
+            ctx.slots.register({ name: 'plugins.item', id: 'dsh-deferred-boot', order: 40, label: '延迟启动' }, DeferredBootItem),
+          ),
+        'dsh-deferred-boot: settings item',
+      )
+    }
+
+    exports.apply = apply
+    exports.inject = ['slots', 'configForms', 'remote']
+    return module.exports
+  },
+})