dsh-router-core 0.4.6 → 0.4.8

package/src/client/ExtDetail.tsx

@@ -13,13 +13,12 @@
  *
  * 列表页只列**已启用**的扩展（关闭的连卡片都不出现），所以这里也不必再显示
  * 「已启用/未启用」——那行字只能是常量。布局同供应商详情：返回链接 + 图标 +
- * 名称/副行，下面跟扩展说明卡与未就绪横幅。有 `api()` 支持的自定义扩展可在未来
- * 按需加独立面板，此处不内置任何具体扩展的专属视图。
+ * 名称/副行，下面跟扩展说明卡与未就绪横幅。
  */
-import { useEffect, useState } from 'react'
+import { Fragment, useEffect, useState } from 'react'
 import { Switch } from '@deepseek-ai/dsh-client-ui-primitives'
 import { ROUTER_API_BASE, type ExtControlItem, type RouterExtItem, type RouterExtResponse } from '../shared.ts'
-import { extPanel } from './ext-panels.ts'
+import { groupControlRows } from './group-controls.ts'
 import { Modal } from './Modal.tsx'
 
 /**
@@ -436,14 +435,30 @@ function ExtControls({ item }: { item: RouterExtItem }): JSX.Element {
             它只剩两个字，却仍占一行 —— 页面进来第一眼是「子开关」这三个字而不是
             那些规则本身。列表自带每条的标题与开关，不需要再套一层说明。 */}
         <ul className="dshr-compRows">
-          {controls.map((c, index) => (
+          {/* 分组渲染（`ExtControl.group`）：无组节（准则分类）平铺在前 ——
+              没用 group 的扩展拿到的就是原来的平铺列表，行为不变；有组的
+              条目（宿主段落）每组前插一行组标题。组的先后与组内顺序都来自
+              服务端 `rows`（= prompt 序），这里不重排。 */}
+          {groupControlRows(controls).map((g) => (
+            <Fragment key={g.label ?? '__plain__'}>
+              {g.label !== undefined && (
+                <li className="dshr-extGroupTitle">{g.label}</li>
+              )}
+              {g.items.map((c) => {
+                // 下标永远对 `controls`（= 服务端 rows）取：分组只影响**渲染
+                // 顺序**，拖动落盘的 ids 必须基于原列表 —— 段落行不可拖（见下），
+                // 可拖的准则全在无组节，原下标与视图位置天然一致。
+                const index = controls.indexOf(c)
+                const sortable = c.sortable !== false
+                return (
             <li
               key={c.id}
               className={`dshr-compRow${dragIndex === index ? ' dshr-linkRowDragging' : ''}`}
-              draggable
-              onDragStart={(e) => { setDragIndex(index); e.dataTransfer.effectAllowed = 'move' }}
-              onDragOver={(e) => { e.preventDefault(); e.dataTransfer.dropEffect = 'move' }}
+              draggable={sortable}
+              onDragStart={(e) => { if (!sortable) return; setDragIndex(index); e.dataTransfer.effectAllowed = 'move' }}
+              onDragOver={(e) => { if (!sortable) return; e.preventDefault(); e.dataTransfer.dropEffect = 'move' }}
               onDrop={(e) => {
+                if (!sortable) { setDragIndex(null); return }
                 e.preventDefault()
                 if (dragIndex === null || dragIndex === index) { setDragIndex(null); return }
                 const next = [...controls]
@@ -511,6 +526,9 @@ function ExtControls({ item }: { item: RouterExtItem }): JSX.Element {
                 onChange={(next) => { void toggle(c.id, next) }}
               />
             </li>
+                )
+              })}
+            </Fragment>
           ))}
         </ul>
         {withBody.length === 0 && (
@@ -579,10 +597,6 @@ interface ExtDetailProps {
 }
 
 export function ExtDetail({ item, onBack }: ExtDetailProps): JSX.Element {
-  // 扩展**自带**详情面板时用它（插件自检就是这么做的：选供应商/模型/连接 + 跑测试）。
-  // 没有就退回下面这张通用只读页 —— 保留返回链接与标题，导航形状与有没有自定义
-  // 面板无关，用户点进去的预期是稳定的。
-  const Custom = extPanel(item.id)
   return (
     <div className="dshr-tabBody">
       {/* Header（同供应商详情：返回链接 + 图标 + 名称/副行） */}
@@ -615,13 +629,9 @@ export function ExtDetail({ item, onBack }: ExtDetailProps): JSX.Element {
         </div>
       </div>
 
-      {/* 扩展自带的面板优先（注册表命中时下面几块都不渲染） */}
-      {Custom !== undefined ? <Custom /> : (
-        <>
       {/* 子开关（扩展自己的行为细节；没有 controls 就不渲染这一块） */}
       {item.controls !== undefined && item.controls.length > 0 && <ExtControls item={item} />}
 
-      {/* 实际生效的提示词（只读预览；回答「关掉的真的没进去吗」） */}
       {/* 未就绪警示（同供应商详情的出错横幅） */}
       {item.ready === false && (
         <div className="dshr-alert">
@@ -629,8 +639,6 @@ export function ExtDetail({ item, onBack }: ExtDetailProps): JSX.Element {
           <span>{item.detail !== undefined && item.detail !== '' ? item.detail : '当前不可用'}</span>
         </div>
       )}
-        </>
-      )}
     </div>
   )
 }

package/src/client/group-controls.test.ts

@@ -0,0 +1,53 @@
+/**
+ * 详情页 controls 分组的判据（`group-controls.ts`）。
+ *
+ * 关键是**向后兼容不可退**：没用 `group` 字段的扩展必须
+ * 拿到"一个无组节、顺序不变"的结果 —— 分组是新能力的**叠加**，不是重排。
+ */
+import test from 'node:test'
+import assert from 'node:assert/strict'
+import { groupControlRows } from './group-controls.ts'
+import type { ExtControlItem } from '../shared.ts'
+
+function row(id: string, extra: Partial<ExtControlItem> = {}): ExtControlItem {
+  return { id, title: id, on: true, custom: false, overridden: false, ...extra }
+}
+
+test('★ 全部无组 ⇒ 单一个无组节（旧扩展的面板展示与改动前一致）', () => {
+  const groups = groupControlRows([row('a'), row('b')])
+  assert.equal(groups.length, 1)
+  assert.equal(groups[0]!.label, undefined)
+  assert.deepEqual(groups[0]!.items.map((i) => i.id), ['a', 'b'], '无组条目顺序被改了')
+})
+
+test('★ 无组节恒排最前，且不产出空的无组节', () => {
+  const groups = groupControlRows([row('a'), row('t1', { group: '工具说明' })])
+  assert.deepEqual(groups.map((g) => g.label), [undefined, '工具说明'])
+  const onlyGrouped = groupControlRows([row('t1', { group: '工具说明' })])
+  assert.deepEqual(onlyGrouped.map((g) => g.label), ['工具说明'], '只有分组条目时不该冒出一个空的无组节')
+})
+
+test('组的先后 = 首次出现序（不按字母重排）', () => {
+  const groups = groupControlRows([
+    row('h', { group: '开场身份' }),
+    row('w', { group: '工具说明' }),
+    row('e', { group: '工具说明' }),
+    row('p', { group: '计划模式' }),
+  ])
+  assert.deepEqual(groups.map((g) => g.label), ['开场身份', '工具说明', '计划模式'])
+  assert.deepEqual(groups[1]!.items.map((i) => i.id), ['w', 'e'], '组内顺序被重排 ⇒ 面板序与 prompt 序脱钩')
+})
+
+test('同名组跨位置仍归一组（不因中间夹了别的组而拆开）', () => {
+  const groups = groupControlRows([
+    row('w1', { group: '工具说明' }),
+    row('h', { group: '开场身份' }),
+    row('w2', { group: '工具说明' }),
+  ])
+  const tool = groups.find((g) => g.label === '工具说明')!
+  assert.deepEqual(tool.items.map((i) => i.id), ['w1', 'w2'])
+})
+
+test('空输入 ⇒ 空数组', () => {
+  assert.deepEqual(groupControlRows([]), [])
+})

package/src/client/group-controls.ts

@@ -0,0 +1,43 @@
+/**
+ * 扩展详情页 controls 的**分组**纯逻辑（客户端，可单测）。
+ *
+ * 分组是**归属信息**，不是样式：一条扩展同时管两类东西时（分层提示词 =
+ * 准则分类 + 宿主系统提示词段落），平铺成一长列无从分辨哪条是谁的。
+ *
+ * 两条规则：
+ *   ① **无组节恒排最前** —— 没用 `group` 字段的扩展拿到的
+ *      分组结果就是原来的平铺列表（一个无名节），面板行为一个像素不变；
+ *   ② 组的先后 = 组名在 `rows` 里的**首次出现序**，组内保持原顺序 ——
+ *      不按字母重排：`rows` 的顺序来自服务端（段落按 prompt 序），重排
+ *      就会把"面板顺序 ≈ 模型看到的顺序"这条对应关系打断。
+ */
+import type { ExtControlItem } from '../shared.ts'
+
+/** 一个分组：`label === undefined` 表示"无组节"（平铺条目）。 */
+export interface ControlGroup {
+  label?: string
+  items: ExtControlItem[]
+}
+
+/** 按 `group` 分组；空输入返回空数组（不产出空的无组节）。 */
+export function groupControlRows(rows: readonly ExtControlItem[]): ControlGroup[] {
+  const plain: ExtControlItem[] = []
+  const groups: ControlGroup[] = []
+  const byLabel = new Map<string, ExtControlItem[]>()
+  for (const c of rows) {
+    if (c.group === undefined) {
+      plain.push(c)
+      continue
+    }
+    let items = byLabel.get(c.group)
+    if (!items) {
+      items = []
+      byLabel.set(c.group, items)
+      groups.push({ label: c.group, items })
+    }
+    items.push(c)
+  }
+  const out: ControlGroup[] = []
+  if (plain.length > 0) out.push({ items: plain })
+  return [...out, ...groups]
+}

package/src/client/index.tsx

@@ -11,9 +11,6 @@
 import { mountRouterWorkspace } from './workspace-mount.tsx'
 import { RouterSettingsSection } from './settings-section.tsx'
 import { RouterComponentsSection } from './RouterComponentsSection.tsx'
-import { ExtTestPanel } from './ExtTestPanel.tsx'
-import { registerExtPanel } from './ext-panels.ts'
-import { EXT_TEST_ID } from '../ext-test/plugin.ts'
 import { registerSettingsNavIcon } from './settings-nav-icon.ts'
 import { rewriteRouterModelHint } from './model-hint-copy.ts'
 import { LastHitDock } from './LastHitDock.tsx'
@@ -97,19 +94,6 @@ function mountComponentsSection(ctx: Ctx): (() => void) | undefined {
   }, RouterComponentsSection))
 }
 
-/**
- * 给「插件自检」扩展登记它的详情面板。
- *
- * 面板的**唯一入口**是设置 → 路由 → 扩展 → 点开那张卡片（`ExtDetail` 查注册表拿到
- * 本组件）。**刻意不给插件页那一行再挂一个详情页**：那一行的宿主行开关已经能开/关
- * 它了，再点进去看同一块面板就是同一个东西有两个入口 —— 与「内置扩展不在自绘节里
- * 重复列」是同一条理由。
- */
-function registerExtTestPanel(ctx: Ctx): void {
-  const dispose = registerExtPanel(EXT_TEST_ID, ExtTestPanel)
-  ctx.effect(() => dispose, 'dsh-router: ext test panel registry')
-}
-
 export function apply(ctx: Ctx): void {
   // 「最近命中」徽章：走官方 conversation.composer.dock（scope: session → 组件
   // props 注入 sessionId，按当前会话取命中）。0.2.0 起这个座位无条件可用 ——
@@ -128,7 +112,6 @@ export function apply(ctx: Ctx): void {
   if (disposeComponents !== undefined) {
     ctx.effect(() => disposeComponents, 'dsh-router: plugin page components')
   }
-  registerExtTestPanel(ctx)
   // 换掉宿主的默认齿轮（契约没有 icon 字段，只能注册后认领自己的行）
   ctx.effect(() => registerSettingsNavIcon(SECTION_LABEL), 'dsh-router: settings nav icon')
   // 设置-模型 里 Router 卡片的那句死路提示 → 正确说法（同样只能认领后就地改写）

package/src/client/router-components.test.ts

@@ -105,7 +105,7 @@ test('内置扩展不进这一节（它已经是原生「包含的组件」里
   const out = groupRouterComponents({ ok: true }, {
     ok: true,
     enhancers: [
-      { id: 'test', name: '插件自检', source: 'builtin' },
+      { id: 'prompt', name: '分层提示词', source: 'builtin' },
       { id: 'rtk', name: 'RTK' },
     ],
   })

package/src/client/router.css

@@ -3360,6 +3360,25 @@ html[data-dsh-router-active]:not([data-dsh-taskboard-active]):not(
     list-style: none;
 }
 
+/* 分组标题行 —— `ExtControl.group` 的渲染落点，插在 `.dshr-compRows` 里
+   的非交互 <li>（无拖把/开关，不可点）。与 `compTitle` 的区别：那是详情页
+   主标题（页头），这是**组**名（次要色 + 小字号）。左右 14px 对齐
+   `.dshr-compRow` 的行内缩，组名与行文字左缘一致。 */
+.dshr-extGroupTitle {
+    margin: 14px 0 2px;
+    padding: 0 14px;
+    color: var(--dsw-alias-label-tertiary);
+    font-size: 12px;
+    font-weight: 500;
+    line-height: 18px;
+    list-style: none;
+}
+
+/* 全部分组的扩展：首个渲染节点就是组标题，去掉上边距避免顶双空。 */
+.dshr-extGroupTitle:first-child {
+    margin-top: 0;
+}
+
 .dshr-compRow {
     display: flex;
     align-items: center;
@@ -3437,9 +3456,9 @@ html[data-dsh-router-active]:not([data-dsh-taskboard-active]):not(
 }
 
 /* 标题 + 「修改」按钮的**同一行**（`ExtDetail` 的子开关区）。
-   ⚠️ 单独一个类而不改 `.dshr-compRowName`：那个类 `RouterComponentsSection` /
-   `ExtTestPanel` 也在用，给它加 `display:flex` 会把**那些页面的标题**也变成
-   flex 盒子（它们标题后面没有按钮，平白多一层）。
+   ⚠️ 单独一个类而不改 `.dshr-compRowName`：那个类 `RouterComponentsSection`
+   也在用，给它加 `display:flex` 会把**那一页的标题**也变成
+   flex 盒子（那边标题后面没有按钮，平白多一层）。
    没有这层时按钮会掉到**下一行**：`.dshr-compRowMain` 是 column，而
    `.dshr-compRowName` 是行内元素、标题一长就折行（2026-09-29 用户报）。 */
 /* 子开关区：`.dshr-compGroup` 的 `gap: 12px` 覆盖为 0（2026-09-30 用户要求）。
@@ -3489,358 +3508,7 @@ html[data-dsh-router-active]:not([data-dsh-taskboard-active]):not(
     overflow-wrap: anywhere;
     /* 保留换行：子开关的**原文**是这个类的另一个用法（2026-09-29 合并进来），
        它是多行段落。状态文案都是单行，所以这条对它们没有副作用。
-       ⇒ 原来的 `.dshr-compRowBody` 整块删掉：14 条规则的正文不需要左边框 +
+       ⇒ 原来的 `.dshr-compRowBody` 整块删掉：各条规则的正文不需要左边框 +
        缩进那种「引用块」的额外装饰（用户要求），层级只靠颜色就够。 */
     white-space: pre-wrap;
 }
-
-/* ============================================================
-   dsh-router — 插件自检面板（设置 → 路由 → 扩展 → 插件自检）
-   ------------------------------------------------------------
-   这一页渲染在**宿主的插件页**里，DOM 祖先既不是 .dshr-settings 也不是
-   .dshr-shell，所以文件顶部那套 `--rs-*` 主题变量在这里**不存在**（未定义的
-   var() 会让整条声明失效：边框/文字色退成继承值）。
-
-   所以这里**不用**设置页那套组件样式，直接按宿主页面的视觉语言写，用宿主的
-   `--dsw-alias-*` token：几何对齐它（14px 小标题、12px 次要文字、0.5px 描边、
-   12px 圆角），配色也从同一套 token 取 —— 于是这块面板看起来就是原生的一部分。
-   主按钮不用在这里画：交给宿主的 Button 原语（见 env.d.ts），配色由原语自己的
-   token 家族决定，不必猜「主色底上配什么字色」。
-   ============================================================ */
-
-.dshr-comp {
-    gap: 16px;
-}
-
-.dshr-compIntro {
-    margin: 0;
-    color: var(--dsw-alias-label-secondary);
-    font-size: 13px;
-    line-height: 20px;
-}
-
-/* 三栏收进同一块面板，读起来是「一组控件」而不是三个飘着的输入框。
-   窄了换行（详情区宽度随窗口变，写死三列会在窄窗口挤成一团）。 */
-.dshr-compForm {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-    gap: 14px 16px;
-    padding: 14px 16px;
-    border: 0.5px solid var(--dsw-alias-border-l1);
-    border-radius: 12px;
-    background: var(--dsw-alias-bg-layer-1);
-}
-
-.dshr-compField {
-    display: flex;
-    flex-direction: column;
-    gap: 6px;
-    min-width: 0;
-}
-
-.dshr-compFieldHead {
-    display: flex;
-    align-items: baseline;
-    justify-content: space-between;
-    gap: 8px;
-}
-
-.dshr-compFieldLabel {
-    color: var(--dsw-alias-label-primary);
-    font-size: 12px;
-    font-weight: 500;
-    line-height: 18px;
-}
-
-/* 标题右侧的用法要点。语义放这里比塞进顶部那段长文字更容易被读到 ——
-   「模型只列可用的」「连接留空 = 池内任选」都是用这一栏时才关心的。 */
-.dshr-compFieldNote {
-    color: var(--dsw-alias-label-tertiary);
-    font-size: 12px;
-    line-height: 18px;
-    text-align: right;
-}
-
-/* 36px / 12px 圆角，与宿主 Button 原语的 md 尺寸对齐。 */
-.dshr-compSelect {
-    width: 100%;
-    height: 36px;
-    padding: 0 32px 0 11px;
-    appearance: none;
-    border: 0.5px solid var(--dsw-alias-border-l2);
-    border-radius: 12px;
-    background-color: var(--dsw-alias-bg-layer-2);
-    background-image:
-        linear-gradient(45deg, transparent 50%, var(--dsw-alias-label-tertiary) 50%),
-        linear-gradient(135deg, var(--dsw-alias-label-tertiary) 50%, transparent 50%);
-    background-position:
-        calc(100% - 17px) 16px,
-        calc(100% - 12px) 16px;
-    background-size: 5px 5px;
-    background-repeat: no-repeat;
-    color: var(--dsw-alias-label-primary);
-    font: inherit;
-    font-size: 13px;
-    line-height: 18px;
-    text-overflow: ellipsis;
-    cursor: pointer;
-}
-
-.dshr-compSelect:hover:not(:disabled) {
-    border-color: var(--dsw-alias-border-l3);
-}
-
-.dshr-compSelect:focus {
-    outline: none;
-    border-color: var(--dsw-alias-brand-primary);
-    box-shadow: 0 0 0 3px color-mix(in srgb, var(--dsw-alias-brand-primary) 22%, transparent);
-}
-
-.dshr-compSelect:disabled {
-    border-color: var(--dsw-alias-border-l1);
-    background-color: var(--dsw-alias-bg-layer-1);
-    color: var(--dsw-alias-label-tertiary);
-    cursor: not-allowed;
-}
-
-/* 动作行：把按钮与它旁边的提示排在一条基线上。两个动作行（访问测试 / 契约体检）
-   共用 `dshr-compBtnRow` —— 那条抬特异性的字色规则就挂在它上面（见下）。 */
-.dshr-compActions {
-    display: flex;
-    align-items: center;
-    gap: 12px;
-}
-
-.dshr-compHint {
-    color: var(--dsw-alias-label-tertiary);
-    font-size: 12px;
-    line-height: 18px;
-}
-
-/* 结果区：成功/失败/请求失败 三种语气。底下垫一层极淡的状态色，比只有一行
-   彩色文字更容易扫到 —— 自检的结果是这一页唯一重要的信息。 */
-.dshr-compNotice {
-    display: flex;
-    gap: 10px;
-    padding: 12px 14px;
-    border: 0.5px solid var(--dsw-alias-border-l1);
-    border-radius: 12px;
-    background: var(--dsw-alias-bg-layer-1);
-}
-
-.dshr-compNotice[data-tone="ok"] {
-    border-color: color-mix(in srgb, var(--dsw-alias-state-success-primary) 34%, transparent);
-    background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 8%, transparent);
-}
-
-.dshr-compNotice[data-tone="fail"],
-.dshr-compNotice[data-tone="network"] {
-    border-color: color-mix(in srgb, var(--dsw-alias-state-error-primary) 34%, transparent);
-    background: color-mix(in srgb, var(--dsw-alias-state-error-primary) 8%, transparent);
-}
-
-.dshr-compNoticeIcon {
-    flex: none;
-    width: 16px;
-    height: 16px;
-    margin-top: 2px;
-    color: var(--dsw-alias-state-success-secondary);
-}
-
-.dshr-compNotice[data-tone="fail"] .dshr-compNoticeIcon,
-.dshr-compNotice[data-tone="network"] .dshr-compNoticeIcon {
-    color: var(--dsw-alias-state-error-primary);
-}
-
-.dshr-compNoticeBody {
-    display: flex;
-    flex-direction: column;
-    gap: 2px;
-    min-width: 0;
-}
-
-.dshr-compNoticeTitle {
-    color: var(--dsw-alias-label-primary);
-    font-size: 13px;
-    font-weight: 500;
-    line-height: 20px;
-}
-
-.dshr-compNoticeText {
-    color: var(--dsw-alias-label-secondary);
-    font-size: 12.5px;
-    line-height: 19px;
-    /* 上游可能回一整段 HTML/JSON，限定宽度换行，别把布局撑破 */
-    overflow-wrap: anywhere;
-}
-
-/* 回显测的是哪三样。一条「通过」如果不带对象，就是没法归因的一串绿字。 */
-.dshr-compNoticeMeta {
-    color: var(--dsw-alias-label-tertiary);
-    font-size: 12px;
-    line-height: 18px;
-    overflow-wrap: anywhere;
-}
-
-/* 宿主 Button 原语的 primary 想把字色设成 --dsw-alias-label-primary-foreground，
-   但上面那条兜底 `.dshr-settings button { color: inherit; font: inherit }`
-   特异性 (1,1) **高于**原语的 `.primary` (1,0) —— 赢的是它。于是按钮变成
-   「#0f1115 的底 + 继承来的 #0f1115 的字」，黑底黑字、按钮看着是空的。
-
-   按本文件既有的抬特异性办法修（见文件里 .dshr-tab-on / .dshr-period 那几处注释：
-   凡是受这条兜底影响的规则，都必须带挂载容器抬到 (2,0) 以上）。这里
-   `.dshr-comp .dshr-compBtnRow button` 是 (2,1)，不依赖源码顺序，以后有人挪块也不会翻车。
-
-   作用域挂在**动作行的共用类 `dshr-compBtnRow`** 上，不是某个具体容器：上一版这条
-   只写了 `.dshr-compActions`，随后新增的「契约体检」按钮在另一个容器里，于是又变回
-   黑底黑字。现在两个动作行共用这个类，再加按钮只需沿用它。
-
-   修的是**把原语的意图还回去**，不是自己另挑一个颜色：字色仍由原语那个 token 决定。 */
-.dshr-comp .dshr-compBtnRow button {
-    color: var(--dsw-alias-label-primary-foreground);
-    font-size: 14px;
-    line-height: 22px;
-}
-
-/* --- 契约体检区（插件自检面板的第二块） ---
-   状态靠 data-state 上色，和「结果卡」那套语气一致：过了是绿、失败是红、
-   没实现是灰、不执行是中性（它是**故意**不跑的，不是问题）。 */
-
-.dshr-compSection {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-    margin-top: 4px;
-    padding-top: 16px;
-    border-top: 0.5px solid var(--dsw-alias-border-l1);
-}
-
-.dshr-compHead {
-    display: flex;
-    align-items: baseline;
-    justify-content: space-between;
-    gap: 8px;
-}
-
-.dshr-compSectionTitle {
-    margin: 0;
-    color: var(--dsw-alias-label-primary);
-    font-size: 14px;
-    font-weight: 500;
-    line-height: 20px;
-}
-
-.dshr-compSectionNote {
-    color: var(--dsw-alias-label-tertiary);
-    font-size: 12px;
-    line-height: 18px;
-}
-
-.dshr-compProbeRow {
-    display: flex;
-    align-items: flex-end;
-    gap: 12px;
-}
-
-.dshr-compProbeRow .dshr-compField {
-    flex: 1;
-}
-
-.dshr-compProbeBtn {
-    flex: none;
-}
-
-.dshr-compReport {
-    display: flex;
-    flex-direction: column;
-    gap: 8px;
-    padding: 12px 14px;
-    border: 0.5px solid var(--dsw-alias-border-l1);
-    border-radius: 12px;
-    background: var(--dsw-alias-bg-layer-1);
-}
-
-.dshr-compReportHead {
-    display: flex;
-    align-items: baseline;
-    justify-content: space-between;
-    gap: 10px;
-    flex-wrap: wrap;
-}
-
-.dshr-compReportName {
-    color: var(--dsw-alias-label-primary);
-    font-size: 13px;
-    font-weight: 500;
-    line-height: 20px;
-}
-
-.dshr-compReportSum {
-    color: var(--dsw-alias-label-tertiary);
-    font-size: 12px;
-    line-height: 18px;
-}
-
-.dshr-compMembers {
-    display: flex;
-    flex-direction: column;
-    margin: 0;
-    padding: 0;
-    list-style: none;
-}
-
-.dshr-compMember {
-    display: grid;
-    grid-template-columns: 16px minmax(0, auto) minmax(0, 1fr);
-    align-items: baseline;
-    gap: 10px;
-    padding: 5px 0;
-    border-bottom: 0.5px solid var(--dsw-alias-border-l1);
-}
-
-.dshr-compMember:last-child {
-    border-bottom: 0;
-}
-
-.dshr-compMemberState {
-    flex: none;
-    text-align: center;
-    font-size: 12px;
-    line-height: 18px;
-}
-
-.dshr-compMember[data-state="ok"] .dshr-compMemberState {
-    color: var(--dsw-alias-state-success-secondary);
-}
-
-.dshr-compMember[data-state="fail"] .dshr-compMemberState {
-    color: var(--dsw-alias-state-error-primary);
-}
-
-.dshr-compMember[data-state="absent"] .dshr-compMemberState,
-.dshr-compMember[data-state="skipped"] .dshr-compMemberState {
-    color: var(--dsw-alias-label-tertiary);
-}
-
-.dshr-compMemberName {
-    color: var(--dsw-alias-label-primary);
-    font-size: 12.5px;
-    line-height: 19px;
-    white-space: nowrap;
-}
-
-.dshr-compMemberKey {
-    margin-left: 6px;
-    color: var(--dsw-alias-label-tertiary);
-    font-family: var(--dsw-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
-    font-size: 11px;
-}
-
-.dshr-compMemberDetail {
-    color: var(--dsw-alias-label-secondary);
-    font-size: 12px;
-    line-height: 18px;
-    overflow-wrap: anywhere;
-}
-
-

package/src/ext/contract.ts

@@ -68,7 +68,7 @@ export interface RouterExt {
    * 扩展自带的**子开关**（可选；不声明 = 只有总开关）。
    *
    * 为什么需要：有些扩展的「开/关」不是一件事而是**几件独立的事** —— 例如分层
-   * 提示词有 14 个准则分类，每条都该能单独关。硬塞进一个总开关 = 要么全给、
+   * 提示词的准则分类，每条都该能单独关。硬塞进一个总开关 = 要么全给、
    * 要么全不给。
    *
    * ⚠️ **与总开关的关系**：子开关是**叠加**在总开关之上的，总开关关 ⇒ 全部子开关
@@ -179,6 +179,25 @@ export interface ExtControl {
   readonly custom?: boolean
   /** 文本被用户改过（决定「还原」按钮是否可点）。 */
   readonly overridden?: boolean
+  /**
+   * 分组名（可选；缺省 = 无组）—— 面板按它把控制条**分节**渲染，组间插一条
+   * 组标题行，组内顺序照旧。**无组的条目照旧平铺** ⇒ 没用这个字段的扩展
+   * 面板行为一个像素都不变。
+   *
+   * 为什么要有：一条扩展同时管两类东西时（分层提示词 = 准则分类 + 宿主段落），
+   * 平铺成一长列会让"哪条是准则、哪条是宿主的段"无从分辨 —— 分组是**归属
+   * 信息**，不是样式。
+   */
+  readonly group?: string
+  /**
+   * 这一条参与拖动排序（可选；缺省 = 参与，保持既有行为）。
+   *
+   * 为什么需要显式关掉：排序落盘只认扩展自己的条目 id（`setControlOrder`
+   * 过滤未知 id）—— 宿主段落的 id 不在其中，拖它只会被静默丢弃 ⇒ 看起来能拖、
+   * 松手弹回，是假交互。**由扩展逐条声明**，与 `editable` 同一理由：能力在
+   * 实现方手里，由它说哪条有。
+   */
+  readonly sortable?: boolean
 }
 
 /** 面板/API 用的一条扩展器信息 = 核心存的开关 + 插件报的运行时事实。 */