dsh-mosaic 1.1.1 → 1.1.3

package/CHANGELOG.md

@@ -4,6 +4,26 @@
 > 兼容性分两处表达：`package.json` 的 `engines.dsh` 给机器可读的范围，README「安装」一节给「插件版本 ↔ 实测 Harness 版本」对照表；每次在真实 Harness 上验证后更新这两处。
 > `0.2.1` 及各 `0.2.1-<标签>` 是改规则前的历史版本，保留用于追溯。
 
+## 1.1.3
+
+- 设置页的导航图标改用插件自己的 mark（内联 SVG，按面板请求的边长渲染），不再和 General 共用同一个齿轮。注册走 `settings.section.icon`：Harness `0.2.1-rc.5` 还没有这个插槽，注册保持静默，升级到声明它的版本后自动生效。
+- 内部：`useDiagramId` 改名 `useInstanceId`，它现在同时给示意图 marker 和图标渐变生成实例 id。
+
+## 1.1.2
+
+### 修复
+
+- 示意图标签里的 `(`、`)`、`[`、`]`、`{`、`}`、`|` 会让 Mermaid 提前结束标签，`get_current_lock_id()` 这类标签直接解析失败。流程图节点与边标签现在统一加引号；`state`、`er` 等已加引号的语法不受影响。
+- 标签里的双引号原本转义成 `#quot;`，但 Mermaid 12 不解析该实体，会原样显示成 `&quot;`；改为单引号，正常显示。
+- `gantt` 的任务名与分组名遇到 `:` 会被当作标签分隔符，静默丢掉后半段；现在换成全角 `：`。
+- `warnings=` 补上 flowchart 的边数与 sequence 的消息数检查——README 与 SKILL 早就写了这两个预算，代码此前只检查节点和生命线。
+
+### 清理
+
+- 删除 `validate.js` 里两个无人调用的函数（`looksLikeSpec`、`takeString`）。
+- 删除三条没有任何组件使用的 CSS（`.mosaic-chart-title`、`.mosaic-donut-label`、`.mosaic-error`）。
+- 测试面收窄到测试真正用到的导出。
+
 ## 1.1.1
 
 发布流程修正，运行时代码与 `1.1.0` 相同。

package/README.md

@@ -89,7 +89,7 @@ $DSH_HOME/logs/dsh-mosaic/YYYY-MM-DD.jsonl   # 未设置 DSH_HOME 时是 ~/.dsh/
 ```
 
 - 一行一个 JSON 对象，字段固定：`ts`、`level`（debug/info/warn/error）、`event`，其余按事件附带（如 `tool`、`ms`、`status`、`route`、`source`、`reason`）。
-- 记录什么：激活/停用、Prompt 的读取与保存（来源、字符数、是否落盘）、工具执行（名称、结果状态、耗时）、路由请求（方法、状态码、耗时）、技能被读取、以及浏览器侧上报的失败（`client.` 前缀：围栏解析失败、Mermaid 失败、Prompt 读写失败、Widget 动作被限流/超限丢弃）。
+- 记录什么：激活/停用、Prompt 的读取与保存（来源、字符数、是否落盘）、工具执行（名称、结果状态、耗时）、路由请求（方法、状态码、耗时）、技能被读取、以及浏览器侧上报的失败（`client.` 前缀：围栏解析失败、Mermaid 失败、示意图导出失败、Prompt 读写失败、Widget 动作被限流/超限丢弃）。
 - 不记录什么：Prompt 正文、组件 JSON、任何文本字段的内容。字段名为 `prompt`/`text`/`code`/`content`/`secret`/`token`/`password`/`apiKey` 时只写字符数；其它字符串超过 300 字符会被截断。
 - 体积：单文件超过 2 MB 滚动为 `<日期>.1.jsonl`；超过 7 天的文件在下次启动时删除；文件权限 `0600`。写不进去时不会影响插件，只在宿主日志里告警一次。
 - 浏览器侧的失败通过同源 `POST /dsh-mosaic/log` 上报（请求体上限 4 KB，非本机权威或跨站一律 403，客户端每分钟最多 20 条）；接口在日志落盘之后才回 204，看到成功就是真的写进去了。
@@ -108,13 +108,14 @@ grep -c '"event":"tool.failed"' "$DSH_HOME"/logs/dsh-mosaic/*.jsonl
 
 ## 已知边界
 
-- 本插件的 npm 版本独立递增（当前 `1.0.0`），不再与 Harness 版本号对齐；兼容范围由 `package.json` 的 `engines.dsh` 声明，最近一次实测的 Harness 版本见「安装」一节。
+- 本插件的 npm 版本独立递增（当前 `1.1.3`），不再与 Harness 版本号对齐；兼容范围由 `package.json` 的 `engines.dsh` 声明，最近一次实测的 Harness 版本见「安装」一节。
 - 围栏渲染靠扫描页面里的代码块实现：0.2.1 全系列（实测 rc.3 与 rc.5，master 同样）都没有给插件开放「渲染 fenced code block」的扩展点。工具通道 `render_view` + `tool.call.toolview` 是原生做法，围栏是它的补充。
 - 从 0.2.1 起代码块由 Shiki 渲染，`<code>` 上**没有** `language-*` 类；识别靠「代码块位于 assistant 行内 + 正文能解析成合法视图 spec」这条路径，用户消息、工具结果、推理块里的代码块都被排除。
 - `diagram` 与 `chart` 自带缩放/平移：卡片右上角有 `−`/`+`/`⟲`/`⤢`，放大后按住图面拖动即可平移，`Ctrl/⌘ + 滚轮`缩放，双击复位；示意图按原始尺寸渲染，不会被压缩到卡片宽度。触屏上图表区域只拦横向拖动（`touch-action: pan-y`），手指上下划仍然滚动聊天页面。
 - `widget` 里调用 `window.mosaic.action()` 只有**真实用户手势**之后才会把动作发回模型：Widget 自己也在判断 `navigator.userActivation`，但决定权在宿主——消息的 nonce 就写在 Widget 自己的文档里，模型代码能读出来直接伪造，所以父页面独立再校验一次自己文档的激活状态。确实需要自行提交的 Widget 要在节点上写 `actions: "programmatic"`；无论哪种，整个会话共享「每分钟 10 次、单次 payload 16 KB（按 UTF-8 字节算）」的额度，新开一个 Widget 不会重置。浏览器若不提供 `navigator.userActivation`，非 `programmatic` 的 Widget 会被按「没有手势」处理，按钮不会回模型。
 - `widget` 是 iframe，拿不到宿主的 `ctx.locale`，因此内部文案由调用方自己写；主题靠宿主令牌值传入。围栏是独立的 React root，切换外观不会触发它重渲染，所以 widget 会观察 `body[data-ds-dark-theme]` 这一个外观属性并在变化时重发令牌——这是插件唯一读取的宿主属性。
 - Mermaid 资产走包内私有路由 `/dsh-mosaic/assets`；没有 Web 服务时 diagram 回落到内置 SVG 布局。
+- 设置页的导航图标走 `settings.section.icon` 插槽。Harness `0.2.1-rc.5` 的导航图标是写死的映射，没有这个插槽，Mosaic 会落到默认齿轮；升级到声明该插槽的版本（`0.2.2-alpha.3` 起）后自动显示自己的 mark，插件不用再改。
 - 自有路由（`/prompt`、`/log`）先验 **Host 必须是本机权威**（loopback、监听地址，或 `config.trustedHosts` 里声明的），再验 `Sec-Fetch-Site` 与 `Origin`。只比 Origin 和 Host 挡不住 DNS rebinding：被 rebinding 的页面这两者都等于攻击者域名，看起来完全同源。宿主把 Web 服务绑到非 loopback 地址时，请把对应主机名写进 `config.trustedHosts`，否则这些路由会拒绝请求。
 - bundle patch 只插入 Mosaic 自己这一行，不改动任何其他插件。若你还装了别的围栏类插件，两者可以对同一段围栏各显一套，按需在 profile 里关掉其中一个即可。
 - 持久化只用「Host 数据目录里的一个 JSON 文件」，没有走 DSH 的 storageDomain。实测（rc.5）：`storageDomain` 可用，但记录校验只在**重新打开**时执行（`put` 不校验）；`single` 布局遇到版本变化会直接拒绝打开，`compatibleVersions` 也不适用。对一份 Prompt 来说这些能力换不来收益，反而多一个依赖和三条失败分支。
@@ -154,10 +155,12 @@ dsh plugin --profile desktop add link:/absolute/path/to/dsh-mosaic
 
 安装后重启或刷新 DSH Web，新会话即可使用。bundle patch 只插入本插件一行，不会关闭或覆盖别人的插件。
 
-**兼容性**：npm 版本独立于 DeepSeek Harness 版本，`1.0.x` 对应下方实测的 Harness 范围；声明式范围见 `package.json` 的 `engines.dsh`（当前 `>=0.2.1-rc.1 <0.3.0-0`）。
+**兼容性**：npm 版本独立于 DeepSeek Harness 版本，`1.1.x` 对应下方实测的 Harness 范围；声明式范围见 `package.json` 的 `engines.dsh`（当前 `>=0.2.1-rc.1 <0.3.0-0`）。
 
 | 插件版本 | 实测通过的 DeepSeek Harness | 说明 |
 | --- | --- | --- |
+| `1.1.3` | `0.2.1-rc.5` | 设置页改用插件自己的图标；需要 Harness 声明 `settings.section.icon`，rc.5 尚未提供 |
+| `1.1.2` | `0.2.1-rc.5` | 修复示意图标签里的括号/方括号/花括号导致解析失败；补上边与消息的可读预算 |
 | `1.1.1` | `0.2.1-rc.5` | 运行时代码与 `1.1.0` 相同；仅修正发布工作流的无效输入 |
 | `1.1.0` | `0.2.1-rc.5` | 13 种示意图、PNG/SVG 导出、`warnings=` 可读规模提示、布局修正 |
 | `1.0.0` | `0.2.1-rc.5`（同时复核 rc.3 行为） | 首个稳定版；含 Widget 沙箱、路由权威、Prompt 并发等修正 |

package/SKILL.md

@@ -117,7 +117,7 @@ A single `diagram` node fragment (this is not a complete fence; wrap it in `{"it
 ],"legend":[{"label":"命中路径","tone":"accent"}]}
 ```
 
-`flowchart`, `sequence`, `state`, `er`, `gantt`, and `mindmap` render through a lazy-loaded Mermaid engine; `timeline`, `layers`, `quadrant`, `tree`, `funnel`, `venn`, and `swimlane` are drawn by Mosaic itself. Every diagram card has `svg`, `png`, and `drawio` export buttons in its header.
+`flowchart`, `sequence`, `state`, `er`, `gantt`, and `mindmap` render through a lazy-loaded Mermaid engine; `timeline`, `layers`, `quadrant`, `tree`, `funnel`, `venn`, and `swimlane` are drawn by Mosaic itself. Every diagram card exports `svg` and `png` from its header; `drawio` appears for the kinds it can express as vertices and edges (`flowchart`, `sequence`, `timeline`, `layers`, `state`).
 
 ### Media and links
 

package/lib/client.js

@@ -340,14 +340,12 @@ window.__ModuleLoader__.load({
 .mosaic-diff-new{background:color-mix(in srgb,var(--m-success) 7%,var(--m-bg))}
 .mosaic-chart{width:100%;height:auto;display:block;overflow:visible}
 .mosaic-chart text{font-size:10px;fill:var(--m-muted)}
-.mosaic-chart .mosaic-chart-title{font-size:12px;font-weight:600;fill:var(--m-text)}
 .mosaic-chart .mosaic-axis{stroke:var(--m-border);stroke-width:1}
 .mosaic-chart .mosaic-axis-label{font-size:9px;fill:var(--m-muted);font-variant-numeric:tabular-nums}
 .mosaic-chart .mosaic-grid-line{stroke:var(--m-border);stroke-width:1;opacity:.45}
 .mosaic-chart .mosaic-line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
 .mosaic-chart .mosaic-dot{stroke:var(--m-bg);stroke-width:1.5}
 .mosaic-chart .mosaic-bar{shape-rendering:geometricPrecision}
-.mosaic-chart .mosaic-donut-label{font-size:11px;fill:var(--m-text)}
 .mosaic-diagram-wrap{max-width:100%;overflow:hidden;padding-bottom:2px}
 .mosaic-diagram{display:block;width:auto;max-width:none;height:auto;margin:0 auto;overflow:visible}
 .mosaic-mermaid{max-width:100%;padding:2px 0}
@@ -482,7 +480,6 @@ window.__ModuleLoader__.load({
 .mosaic-overlay-body[data-figure="true"]{width:min(1440px,97vw);overflow:hidden}
 .mosaic-overlay-image{display:block;max-width:100%;max-height:76vh;margin:0 auto;border-radius:10px;object-fit:contain}
 .mosaic-diagnostic{margin:0 0 6px;padding:6px 10px;border:1px solid color-mix(in srgb,var(--m-danger) 40%,transparent);border-radius:7px;background:color-mix(in srgb,var(--m-danger) 10%,transparent);color:var(--m-danger);font-size:12px;line-height:1.5;white-space:pre-wrap}
-.mosaic-error{margin:8px 0;padding:8px 10px;border:1px solid color-mix(in srgb,var(--m-danger) 40%,transparent);border-radius:8px;background:color-mix(in srgb,var(--m-danger) 8%,var(--m-bg));color:var(--m-danger);font-size:12px}
 .mosaic-skeleton{display:flex;flex-direction:column;gap:8px;padding:10px 0}
 .mosaic-skeleton span{display:block;height:10px;border-radius:5px;background:var(--m-bg2);animation:mosaic-pulse 1.2s ease-in-out infinite}
 .mosaic-skeleton span:nth-child(2){width:70%}
@@ -600,6 +597,33 @@ window.__ModuleLoader__.load({
     const PROMPT_URL = '/dsh-mosaic/prompt'
     const PROMPT_LIMIT = 128 * 1024
 
+    /** The plugin's own mark: four tiles on the brand gradient. */
+    function MosaicMark({ size = 16 }) {
+      const gradientId = useInstanceId('mosaic-mark')
+      return h('svg', {
+        width: size,
+        height: size,
+        viewBox: '0 0 64 64',
+        'aria-hidden': 'true',
+        focusable: 'false',
+        style: { display: 'block' },
+      },
+      h('defs', null,
+        h('linearGradient', { id: gradientId, x1: '0', y1: '0', x2: '1', y2: '1' },
+          h('stop', { offset: '0', stopColor: '#1d4ed8' }),
+          h('stop', { offset: '1', stopColor: '#0f766e' }))),
+      h('rect', { x: 2, y: 2, width: 60, height: 60, rx: 14, fill: `url(#${gradientId})` }),
+      h('rect', { x: 10, y: 10, width: 20, height: 20, rx: 5, fill: '#ffffff', fillOpacity: 0.94 }),
+      h('rect', { x: 34, y: 10, width: 20, height: 20, rx: 5, fill: '#ffffff', fillOpacity: 0.72 }),
+      h('rect', { x: 10, y: 34, width: 20, height: 20, rx: 5, fill: '#ffffff', fillOpacity: 0.72 }),
+      h('rect', { x: 34, y: 34, width: 20, height: 20, rx: 5, fill: '#ffffff', fillOpacity: 0.46 }))
+    }
+
+    /** The settings nav glyph, rendered at the edge the shell asks for. */
+    function SettingsSectionIcon({ size }) {
+      return h(MosaicMark, { size: typeof size === 'number' && size > 0 ? size : 16 })
+    }
+
     /**
      * The model prompt, editable in place. The Host owns the value and persists it, so
      * the same text is used by every browser and survives a restart; this page only
@@ -1528,7 +1552,9 @@ window.__ModuleLoader__.load({
 
     function SpacerNode() {
       return h('div', { className: 'mosaic-spacer' })
-    }function numberValue(value) {
+    }
+
+    function numberValue(value) {
       if (typeof value === 'number' && Number.isFinite(value)) return value
       const text = String(value ?? '').trim().replace(/[,$£€¥%]/g, '')
       if (text === '') return null
@@ -2480,11 +2506,19 @@ window.__ModuleLoader__.load({
     function mermaidLabel(value) {
       return String(value ?? '')
         .replace(/\s+/g, ' ')
-        .replace(/"/g, '#quot;')
-        .replace(/\|/g, '#124;')
+        .replace(/"/g, "'")
         .trim()
     }
 
+    /**
+     * A quoted Mermaid label. Unquoted labels end at `()`, `[]`, `{}` or `|`,
+     * so a label like `get_current_lock_id()` fails to parse; quoting is the
+     * only form that survives them.
+     */
+    function mermaidQuoted(value) {
+      return `"${mermaidLabel(value)}"`
+    }
+
     /** Parse a token colour into `[r, g, b]`; `undefined` when it is not a plain colour. */
     function parseColor(value) {
       const text = String(value ?? '').trim()
@@ -2601,6 +2635,11 @@ window.__ModuleLoader__.load({
       return lines.join('\n')
     }
 
+    /** A gantt name ends at the first `:`, so a literal one would truncate it. */
+    function ganttLabel(value) {
+      return mermaidLabel(value).replace(/:/g, '\uff1a')
+    }
+
     function ganttMermaid(node) {
       const lines = ['gantt', '  dateFormat YYYY-MM-DD', '  axisFormat %m-%d']
       let section
@@ -2608,10 +2647,10 @@ window.__ModuleLoader__.load({
       for (const task of Array.isArray(node.tasks) ? node.tasks : []) {
         if (task.section && task.section !== section) {
           section = task.section
-          lines.push(`  section ${mermaidLabel(section)}`)
+          lines.push(`  section ${ganttLabel(section)}`)
         }
         index += 1
-        lines.push(`  ${mermaidLabel(task.name)} :t${index}, ${task.start}, ${task.end}`)
+        lines.push(`  ${ganttLabel(task.name)} :t${index}, ${task.start}, ${task.end}`)
       }
       return lines.join('\n')
     }
@@ -2659,8 +2698,7 @@ window.__ModuleLoader__.load({
       const usedTones = new Set()
       const lines = [`flowchart ${node.direction === 'LR' ? 'LR' : 'TB'}`]
       nodes.forEach((entry) => {
-        const label = mermaidLabel(entry.label)
-        const withSub = entry.sub ? `${label}<br/>${mermaidLabel(entry.sub)}` : label
+        const withSub = mermaidQuoted(entry.sub ? `${entry.label}<br/>${entry.sub}` : entry.label)
         const id = idOf.get(entry.id)
         if (entry.shape === 'diamond') lines.push(`  ${id}{${withSub}}`)
         else if (entry.shape === 'round') lines.push(`  ${id}(${withSub})`)
@@ -2676,7 +2714,7 @@ window.__ModuleLoader__.load({
         const to = idOf.get(edge.to)
         if (!from || !to) return
         const arrow = edge.kind === 'dashed' ? '-.->' : edge.kind === 'accent' ? '==>' : '-->'
-        const label = edge.label ? `|${mermaidLabel(edge.label)}|` : ''
+        const label = edge.label ? `|${mermaidQuoted(edge.label)}|` : ''
         lines.push(`  ${from} ${arrow}${label} ${to}`)
       })
       if (baseStyle !== undefined) lines.push(`  classDef mosaic_base ${baseStyle}`)
@@ -3129,15 +3167,15 @@ window.__ModuleLoader__.load({
     }
 
     /**
-     * A stable id per component instance. Marker ids live in the document, so
-     * two diagrams on one page must not share `#mosaic-arrow`.
+     * A stable id per component instance. SVG ids live in the document, so two
+     * instances on one page must not share `#mosaic-arrow` or a gradient.
      */
-    let diagramInstances = 0
-    function useDiagramId(prefix) {
+    let instanceIds = 0
+    function useInstanceId(prefix) {
       const ref = useRef(null)
       if (ref.current === null) {
-        diagramInstances += 1
-        ref.current = `${prefix}-${diagramInstances}`
+        instanceIds += 1
+        ref.current = `${prefix}-${instanceIds}`
       }
       return ref.current
     }
@@ -3368,8 +3406,8 @@ window.__ModuleLoader__.load({
     }
 
     function FlowchartDiagram({ node }) {
-      const arrowId = useDiagramId('mosaic-arrow')
-      const accentArrowId = useDiagramId('mosaic-arrow-accent')
+      const arrowId = useInstanceId('mosaic-arrow')
+      const accentArrowId = useInstanceId('mosaic-arrow-accent')
       const layout = useMemo(() => {
         const nodes = Array.isArray(node.nodes) ? node.nodes : []
         const edges = Array.isArray(node.edges) ? node.edges : []
@@ -3553,9 +3591,9 @@ window.__ModuleLoader__.load({
     }
 
     function SequenceDiagram({ node }) {
-      const syncId = useDiagramId('mosaic-seq-arrow')
-      const returnId = useDiagramId('mosaic-seq-arrow-muted')
-      const asyncId = useDiagramId('mosaic-seq-arrow-accent')
+      const syncId = useInstanceId('mosaic-seq-arrow')
+      const returnId = useInstanceId('mosaic-seq-arrow-muted')
+      const asyncId = useInstanceId('mosaic-seq-arrow-accent')
       const layout = useMemo(() => {
         const participants = Array.isArray(node.participants) ? node.participants : []
         const messages = Array.isArray(node.messages) ? node.messages : []
@@ -3788,7 +3826,7 @@ window.__ModuleLoader__.load({
     function SwimlaneDiagram({ node }) {
       const lanes = Array.isArray(node.lanes) ? node.lanes : []
       const steps = Array.isArray(node.steps) ? node.steps : []
-      const arrowId = useDiagramId('mosaic-swim-arrow')
+      const arrowId = useInstanceId('mosaic-swim-arrow')
       const layout = useMemo(() => layoutSwimlane(lanes, steps), [node.lanes, node.steps])
       const display = diagramDisplaySize(layout.width, layout.height)
       const arrows = []
@@ -4378,6 +4416,12 @@ window.__ModuleLoader__.load({
         label: () => translate('settingsTitle'),
         locale: NS,
       }, MosaicSettings))
+      // Hosts older than the `settings.section.icon` seat never declare it, so this
+      // stays dormant and the shell keeps its default gear for our section.
+      ctx.slots.inject('settings.section.icon', () => ctx.slots.register({
+        name: 'settings.section.icon',
+        id: 'mosaic',
+      }, SettingsSectionIcon))
       ctx.effect(() => installFenceRenderer(ctx, sendAction), 'dsh-mosaic: fence')
       console.info('[mosaic] client active; fence=dsh-view')
     }
@@ -4386,7 +4430,6 @@ window.__ModuleLoader__.load({
     // `inject`, so this extra key is inert at runtime.
     const __test = {
       widgetDocument,
-      widgetParts,
       WIDGET_CSP,
       widgetBridge,
       textWidth,
@@ -4397,8 +4440,6 @@ window.__ModuleLoader__.load({
       layoutVenn,
       layoutSwimlane,
       toMermaid,
-      diagrams: { QuadrantDiagram, TreeDiagram, FunnelDiagram, VennDiagram, SwimlaneDiagram, DiagramLegend },
-      inlineSvgMarkup,
       parseView,
     }
 

package/lib/validate.js

@@ -74,10 +74,6 @@ function asBoolean(value) {
   return typeof value === 'boolean' ? value : undefined
 }
 
-function looksLikeSpec(value) {
-  return isRecord(value) && Array.isArray(value.items)
-}
-
 function looksLikeNode(value) {
   return isRecord(value) && typeof value.type === 'string'
 }
@@ -103,12 +99,6 @@ function fail(state, path, message) {
   state.errors.push(`${path}: ${message}`)
 }
 
-function takeString(state, path, value, cap = LIMITS.maxString) {
-  const result = asString(value, cap)
-  if (result === undefined) fail(state, path, 'must be a string')
-  return result
-}
-
 function takeOptionalNumber(state, path, value, min, max) {
   if (value === undefined) return undefined
   const result = asNumber(value, min, max)
@@ -1362,13 +1352,19 @@ const READABLE = {
 
 /** Counts per diagram kind that a reader can take in without a guide. */
 const DIAGRAM_READABLE = {
-  flowchart: { limit: 9, count: (node) => node.nodes.length, noun: 'nodes' },
-  state: { limit: 9, count: (node) => node.nodes.length, noun: 'states' },
-  sequence: { limit: 5, count: (node) => node.participants.length, noun: 'lifelines' },
-  timeline: { limit: 7, count: (node) => node.items.length, noun: 'items' },
-  layers: { limit: 6, count: (node) => node.layers.length, noun: 'layers' },
-  funnel: { limit: 6, count: (node) => node.items.length, noun: 'steps' },
-  swimlane: { limit: 6, count: (node) => node.steps.length, noun: 'steps' },
+  flowchart: [
+    { limit: 9, count: (node) => node.nodes.length, noun: 'nodes' },
+    { limit: 12, count: (node) => node.edges.length, noun: 'edges' },
+  ],
+  state: [{ limit: 9, count: (node) => node.nodes.length, noun: 'states' }],
+  sequence: [
+    { limit: 5, count: (node) => node.participants.length, noun: 'lifelines' },
+    { limit: 12, count: (node) => node.messages.length, noun: 'messages' },
+  ],
+  timeline: [{ limit: 7, count: (node) => node.items.length, noun: 'items' }],
+  layers: [{ limit: 6, count: (node) => node.layers.length, noun: 'layers' }],
+  funnel: [{ limit: 6, count: (node) => node.items.length, noun: 'steps' }],
+  swimlane: [{ limit: 6, count: (node) => node.steps.length, noun: 'steps' }],
 }
 
 const REMOTE_ASSET_RE = /<(?:script|img|iframe|link|video|audio|source)[^>]+(?:src|href)\s*=\s*["']?(?:https?:)?\/\//iu
@@ -1421,8 +1417,7 @@ export function lintView(spec) {
       if (Array.isArray(node.nodes)) {
         accents += node.nodes.filter((entry) => entry?.tone === 'accent').length
       }
-      const budget = DIAGRAM_READABLE[node.kind]
-      if (budget !== undefined) {
+      for (const budget of DIAGRAM_READABLE[node.kind] ?? []) {
         const count = budget.count(node)
         if (count > budget.limit) {
           add(`${path}: ${count} ${budget.noun}; keep ${budget.limit} or fewer, or split`)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-mosaic",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "type": "module",
   "description": "Lightweight visual answers for DeepSeek Harness: one compact visual style, an editable model prompt, dsh-view components, Mermaid diagrams, a sandboxed HTML/JS escape hatch, local-first interactions, and link-only media cards.",
   "author": "imwhatiam",