@quolu/lattice 0.49.0 → 0.50.1

package/README.ja.md

@@ -51,7 +51,7 @@ planを再コンパイルします。共有面が共有でなくなるので、
 `design_memo`を必ず持ちます。空欄やファイル参照だけでは登録できません。本当に何も考えていない場合だけ、
 正確なsentinel `NO_PLAN`を本文にします。Latticeはauthoring時に次の問いを返し、空欄のまま通しません。
 
-> If you have not thought through this ToDo, write exactly `NO_PLAN` in its design memo.
+> あなたがこのToDoに対して、何も考えていないならば、設計メモに `NO_PLAN` と書いてください
 
 通常の`lattice todo show`と、成功するすべての`lattice todo start`は、この初期設計メモを自動で返します。
 作業開始後に増えた方針、棄却案、調査結果、注意、未解決事項は、別のappend-only note chainへ追記できます。
@@ -65,7 +65,7 @@ lattice todo show --plan <key> --task <id> --json
 
 動的工程表は、選択したToDoの右ペインへ初期設計メモと追記noteの本文を表示します。あわせて前提工程・
 後続工程それぞれの状態（未着手／作業中／完了／ブロック中）と、その工程の並列可否を示します。
-note本文を落とすのはrepo外へHTMLを出す公開配信面だけです。project別HTMLの生成や再生成は不要です。
+note本文はHTMLを描くすべての面へ載ります。project別HTMLの生成や再生成は不要です。
 
 ### 変換の受入五条件
 
@@ -102,7 +102,7 @@ MarkItDownは別区分の第三者CLIです。
 [docs/00_product-contract.md](docs/00_product-contract.md)を参照してください。
 
 CLIの全体像は`lattice --help`、各公開namespaceの正規構文は
-`lattice <plan|run|event|todo|sensor|factory-diagnostics|runtime-errors|bridge> --help`で確認できます。
+`lattice <plan|run|event|todo|sensor|factory-diagnostics|runtime-errors|bridge|hooks> --help`で確認できます。
 個別操作は`lattice <namespace> <subcommand> --help`または`lattice help <namespace> <subcommand>`で
 正規optionをstore非依存に確認できます。
 
@@ -126,7 +126,8 @@ codex-sidecar diagnostics --project . --preset auditor --json
 未初期化projectで`sensor sync`した場合は`LATTICE_SENSOR_NOT_INITIALIZED`と正規`next_action`を返します。
 その他のsensor失敗もexit code、signal、bounded stderrをtyped detailへ残し、原因を隠しません。
 
-Node.js 22.13以上を使用します。境界観測は配布物に同梱したLattice sensorだけを使い、PATH上の
+Node.js 22.13以上、ただし25.xを除きます（`engines: >=22.13 <25 || >=26`。Node 25.xはV8 turboshaft
+WASM JITの不具合で同梱sensorが壊れるため、bannerを出して起動を止めます）。境界観測は配布物に同梱したLattice sensorだけを使い、PATH上の
 廃止済みruntimeや旧cache/dataへfallbackしません。Spotterはproject単位で生成stateの所有境界を守ります。
 
 どのrepoでも、Latticeの導入状態はdirectoryの有無を推測せず、最初に次のtyped discoveryで判定します。
@@ -136,12 +137,12 @@ lattice status --json
 ```
 
 `state`は`uninitialized | ready | active_run | invalid`のいずれかです。`uninitialized`は
-正常な未初期化状態で、`next_action`が正規の初期authoring入口を返します。初回planは
-新規planはPhase監査とToDo schedulingを分離し、全ToDoに設計メモを持つ`lattice.plan_create_input.v4`のcanonical
-JSON+LFを用意し、次で作成します。既存v2/v4は互換契約として維持されます。
+正常な未初期化状態で、`next_action`が正規の初期authoring入口を返します。新規planはPhase監査と
+ToDo schedulingを分離し、全ToDoに設計メモを持つ`lattice.plan_create_input.v4`のcanonical
+JSON+LFを用意し、次で作成します。既存のv1〜v3は互換契約として維持され、`--schema-version`で取得できます。
 
 ```bash
-lattice plan create --schema-version 4 --json
+lattice plan create --schema-version 4 --json   # v4のJSON Schemaを取る（作成はしない）
 ```
 
 ```bash
@@ -303,8 +304,9 @@ daemonの生死はdescriptor 1枚では持ちません。daemonは自分のpid
 配信を続けているdaemonを引き取ります。signalを送るのはその場で再認証を通った相手だけで、応答しない
 pidへは送りません（pid再利用で無関係のprocessを止めうるためです）。規約は
 [ADR 0157](docs/adr/0157-dashboard-daemons-are-discoverable-by-record.md)が正です。
-状態を書き込む`start / block / unblock / done / evidence promote / reopen / revise / revise-phase / revise-set`
-では、監査actorとして次の3環境変数をすべて設定してください。
+状態を書き込む`start / block / unblock / done / evidence promote / reopen / note / independence mode /
+revise / revise-phase / revise-set / phase review|accept|reject|reopen|close-unaudited|baseline /
+dashboard adopt`では、監査actorとして次の3環境変数をすべて設定してください。
 
 ```bash
 export LATTICE_TODO_ACTOR_HOST=<host-id>

package/README.md

@@ -78,8 +78,8 @@ lattice todo show --plan <key> --task <id> --json
 
 The selected ToDo's detail pane shows the initial design memo and the append-only note bodies, plus the
 status of each prerequisite and dependent ToDo (pending, in progress, done, blocked) and whether the ToDo
-can run in parallel. Only a public distribution surface — HTML served outside the repository — drops note
-bodies. Static per-project HTML is not generated; `lattice todo gantt serve` and the shared dashboard
+can run in parallel. Note bodies are carried by every rendered surface, including HTML served outside the
+repository. Static per-project HTML is not generated; `lattice todo gantt serve` and the shared dashboard
 read the store dynamically.
 
 ### The five acceptance conditions
@@ -120,7 +120,8 @@ the operating AI.
 npm install -g @quolu/lattice
 ```
 
-Requires **Node.js 22.13+**. The structure sensor ships inside the package — there is nothing
+Requires **Node.js 22.13 or newer, except 25.x** (`engines: >=22.13 <25 || >=26`; Node 25's V8
+turboshaft WASM JIT breaks the bundled sensor, so it is blocked with a banner). The structure sensor ships inside the package — there is nothing
 else to install, and Lattice never falls back to a sensor on your `PATH`.
 
 ## Quick start
@@ -156,7 +157,7 @@ lattice todo seam-proposal land    --plan <key> --names names.json
 ```
 
 Full CLI surface: `lattice --help`, then
-`lattice <plan|run|event|todo|sensor|bridge|runtime-errors> --help`.
+`lattice <plan|run|event|todo|sensor|factory-diagnostics|runtime-errors|bridge|hooks> --help`.
 
 ## Design principles
 

package/bin/lattice-dashboard.mjs

@@ -6,6 +6,7 @@ import path from 'node:path';
 import { readTodoStoreStable } from '../src/todo-store.mjs';
 import { TODO_STATUS_DISPATCH_ONLY, projectTodoStatus } from '../src/todo-status.mjs';
 import { ganttLiveHeadDigest, renderTodoGanttForProject } from '../src/todo-cli.mjs';
+import { readProjectExternalPane } from '../src/project-identity.mjs';
 import {
   forgetTodoDashboardDaemonRecord,
   readVisibleTodoDashboardProjects,
@@ -96,6 +97,10 @@ async function synchronize() {
         return {
           html: result.rendered.html,
           head_digest: await ganttLiveHeadDigest({ repoRoot: entry.repo_root, store }),
+          // 配信のたびに読む。外部ペインを差した／外した側にdaemon再起動を要求しない。
+          external_pane: await readProjectExternalPane({
+            repoRoot: entry.repo_root, projectId: entry.project_id,
+          }),
         };
       },
       readHead: async () => ganttLiveHeadDigest({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quolu/lattice",
-  "version": "0.49.0",
+  "version": "0.50.1",
   "description": "Schedulability compiler for multi-agent development: observe real code boundaries, refactor the conflicting seam, recompile the plan for parallel execution",
   "author": {
     "name": "Quo / クオ at kitepon.dev",

package/src/project-identity.mjs

@@ -4,6 +4,9 @@ import { parseTree } from 'jsonc-parser';
 
 export const PROJECT_IDENTITY_REF = '.lattice/project.json';
 const MAX_BYTES = 65_536;
+const URL_MAX_BYTES = 2_048;
+const IDENTITY_KEYS = 'display_name,project_id,schema';
+const IDENTITY_KEYS_WITH_PANE = 'display_name,external_pane,project_id,schema';
 const CONTROL = /[\u0000-\u001f\u007f]/u;
 
 function fail(reason) {
@@ -30,23 +33,45 @@ function duplicateKey(node) {
   return false;
 }
 
-export async function resolveProjectIdentity({ repoRoot, projectId, env = process.env }) {
-  if (!path.isAbsolute(repoRoot) || typeof projectId !== 'string' || projectId.length === 0
-    || env === null || typeof env !== 'object' || Array.isArray(env)) {
-    throw new TypeError('project identity options invalid');
-  }
-  const override = env.LATTICE_PROJECT_DISPLAY_NAME;
-  if (override !== undefined) {
-    if (!displayName(override)) fail('environment_display_name_invalid');
-    return Object.freeze({ projectId, displayName: override, source: 'environment' });
+/** 外部ペインのURLは、閲覧者のブラウザが実際に取りに行く先である。絶対URLだけを通す。 */
+function paneUrl(value) {
+  if (typeof value !== 'string' || value.length === 0 || CONTROL.test(value)
+    || Buffer.byteLength(value, 'utf8') > URL_MAX_BYTES) return null;
+  let url;
+  try { url = new URL(value); } catch { return null; }
+  if (url.protocol !== 'https:' && url.protocol !== 'http:') return null;
+  return url;
+}
+
+/**
+ * projectごとに1枚だけ差せる外部ペインの設定。Latticeは中身が何のサービスかを知らない
+ * ——題名・埋め込み先URL・生存probe URLの3つだけを受け取る汎用の口である。
+ */
+function externalPane(value) {
+  if (value === null || typeof value !== 'object' || Array.isArray(value)
+    || Object.keys(value).sort().join(',') !== 'probe_url,title,url') {
+    fail('external_pane_schema_invalid');
   }
+  if (!displayName(value.title)) fail('external_pane_title_invalid');
+  const url = paneUrl(value.url);
+  const probe = paneUrl(value.probe_url);
+  if (url === null) fail('external_pane_url_invalid');
+  if (probe === null) fail('external_pane_probe_url_invalid');
+  return Object.freeze({
+    title: value.title,
+    url: url.href,
+    probeUrl: probe.href,
+    frameOrigin: url.origin,
+    probeOrigin: probe.origin,
+  });
+}
+
+async function readIdentityDocument({ repoRoot, projectId }) {
   const canonicalRoot = await realpath(repoRoot);
   const ref = path.join(canonicalRoot, PROJECT_IDENTITY_REF);
   let stats;
   try { stats = await lstat(ref); } catch (error) {
-    if (error?.code === 'ENOENT') {
-      return Object.freeze({ projectId, displayName: projectId, source: 'project_id' });
-    }
+    if (error?.code === 'ENOENT') return null;
     throw error;
   }
   if (!stats.isFile() || stats.isSymbolicLink() || stats.size > MAX_BYTES) fail('identity_file_unsafe');
@@ -61,11 +86,45 @@ export async function resolveProjectIdentity({ repoRoot, projectId, env = proces
   if (errors.length > 0 || tree === undefined || duplicateKey(tree)) fail('identity_json_invalid');
   let document;
   try { document = JSON.parse(text); } catch { fail('identity_json_invalid'); }
-  if (document === null || typeof document !== 'object' || Array.isArray(document)
-    || Object.keys(document).sort().join(',') !== 'display_name,project_id,schema'
+  const keys = document === null || typeof document !== 'object' || Array.isArray(document)
+    ? '' : Object.keys(document).sort().join(',');
+  if ((keys !== IDENTITY_KEYS && keys !== IDENTITY_KEYS_WITH_PANE)
     || document.schema !== 'lattice.project_identity.v1'
     || document.project_id !== projectId || !displayName(document.display_name)) {
     fail('identity_schema_invalid');
   }
+  return document;
+}
+
+export async function resolveProjectIdentity({ repoRoot, projectId, env = process.env }) {
+  if (!path.isAbsolute(repoRoot) || typeof projectId !== 'string' || projectId.length === 0
+    || env === null || typeof env !== 'object' || Array.isArray(env)) {
+    throw new TypeError('project identity options invalid');
+  }
+  const override = env.LATTICE_PROJECT_DISPLAY_NAME;
+  if (override !== undefined) {
+    if (!displayName(override)) fail('environment_display_name_invalid');
+    return Object.freeze({ projectId, displayName: override, source: 'environment' });
+  }
+  const document = await readIdentityDocument({ repoRoot, projectId });
+  if (document === null) {
+    return Object.freeze({ projectId, displayName: projectId, source: 'project_id' });
+  }
+  // external_paneは表示名の出典ではない。ここでは形の妥当性だけ確かめて落とす
+  // ——壊れた設定を黙って無視すると、差したはずのペインが出ない理由が追えなくなる。
+  if (document.external_pane !== undefined) externalPane(document.external_pane);
   return Object.freeze({ projectId, displayName: document.display_name, source: 'project_file' });
 }
+
+/**
+ * 差してあるなら外部ペイン設定を、無ければnullを返す。配信のたびに読むので、
+ * 設定を書いた／消した側はdaemonの再起動を要さない（reloadで反映される）。
+ */
+export async function readProjectExternalPane({ repoRoot, projectId }) {
+  if (!path.isAbsolute(repoRoot) || typeof projectId !== 'string' || projectId.length === 0) {
+    throw new TypeError('project identity options invalid');
+  }
+  const document = await readIdentityDocument({ repoRoot, projectId });
+  if (document === null || document.external_pane === undefined) return null;
+  return externalPane(document.external_pane);
+}

package/src/todo-cli.mjs

@@ -27,7 +27,7 @@ import {
   ensureTodoDashboardActivity,
   removeTodoDashboardProject,
 } from './todo-dashboard-registry.mjs';
-import { resolveProjectIdentity } from './project-identity.mjs';
+import { readProjectExternalPane, resolveProjectIdentity } from './project-identity.mjs';
 import { layoutTodoGantt } from './todo-gantt-layout.mjs';
 import { TODO_GANTT_SCOPES } from './todo-gantt-scope.mjs';
 import { loadTodoGanttPresentation } from './todo-gantt-presentation.mjs';
@@ -2299,7 +2299,7 @@ async function seamProposalsForGantt({ repoRoot, store }) {
 
 export async function renderTodoGanttForProject({
   repoRoot, stable = false, displayName = null, env = process.env, readModel = null,
-  scope = DEFAULT_GANTT_SCOPE, includeNotes = true,
+  scope = DEFAULT_GANTT_SCOPE,
 }) {
   const store = readModel
     ?? (stable ? await readTodoStoreStable({ repoRoot }) : await readTodoStore({ repoRoot }));
@@ -2312,8 +2312,7 @@ export async function renderTodoGanttForProject({
   const [independence, seamProposals, notes] = await Promise.all([
     independenceForGantt({ repoRoot, store }),
     seamProposalsForGantt({ repoRoot, store }),
-    includeNotes ? notesForGantt({ repoRoot, store })
-      : { contexts: null, warnings: [], headBindings: [] },
+    notesForGantt({ repoRoot, store }),
   ]);
   const layout = layoutTodoGantt(store, chain, { scope, independence, seamProposals });
   // When the diagram hides history, the page also carries the full diagram so
@@ -2366,16 +2365,6 @@ export async function renderTodoGanttForProject({
   return { store, metadata, memberBindings, rendered };
 }
 
-/**
- * 公開配信面はToDo本体の設計メモを表示し、append-only作業記録は除外する。
- *
- * loopbackのdashboardと`gantt serve`は公開配信面ではない。作業者本人が読む面なので
- * 記録込みで描く。この入口はrepo外へHTMLを出す面が生えた時に使う。
- */
-export async function renderPublicTodoGanttForProject(options = {}) {
-  return renderTodoGanttForProject({ ...options, includeNotes: false });
-}
-
 async function serveGantt({ repoRoot, port, stdout, env, scope = DEFAULT_GANTT_SCOPE }) {
   const initialStore = await readTodoStoreStable({ repoRoot });
   const identity = await resolveProjectIdentity({ repoRoot, projectId: initialStore.project_id, env });
@@ -2388,7 +2377,9 @@ async function serveGantt({ repoRoot, port, stdout, env, scope = DEFAULT_GANTT_S
       const { rendered } = await renderTodoGanttForProject({
         repoRoot, stable: true, displayName: identity.displayName, scope, readModel: store,
       });
-      return { html: rendered.html, head_digest: await ganttLiveHeadDigest({ repoRoot, store }) };
+      return { html: rendered.html, head_digest: await ganttLiveHeadDigest({ repoRoot, store }),
+        // ローカルの動的dashboardも公開daemonと同じ口を通す（毎描画で読むので差し外しが即反映される）。
+        external_pane: await readProjectExternalPane({ repoRoot, projectId: store.project_id }) };
     },
     readHead: async () => ganttLiveHeadDigest({
       repoRoot, store: await readTodoStoreStable({ repoRoot }),

package/src/todo-gantt-live.mjs

@@ -4,6 +4,9 @@ import { TODO_DASHBOARD_CODE_VERSION } from './todo-dashboard-registry.mjs';
 
 const LOOPBACK = '127.0.0.1';
 const POLL_MS = 500;
+const SSE_HEARTBEAT_MS = 25_000;
+const SSE_STALE_MS = 62_500;
+const SSE_WATCHDOG_MS = 12_500;
 const HTTP_ERROR_SCHEMA = 'lattice.todo_gantt_http_error.v1';
 const PROJECT_ID = /^[A-Za-z0-9][A-Za-z0-9._-]{0,127}$/u;
 
@@ -11,16 +14,63 @@ function projectPath(projectId) {
   return `/projects/${encodeURIComponent(projectId)}/`;
 }
 
-function liveHtml(html, headDigest, eventsPath) {
-  const controller = `<script>(()=>{const badge=document.createElement('div');badge.setAttribute('role','status');badge.style.cssText='position:fixed;right:12px;bottom:12px;z-index:99;padding:6px 10px;border:1px solid #d9d8d4;border-radius:4px;background:#fcfcfb;font:600 12px system-ui';badge.textContent='進捗: 接続中';document.body.append(badge);let head=${JSON.stringify(headDigest)};const stream=new EventSource(${JSON.stringify(eventsPath)});stream.addEventListener('state',event=>{const next=JSON.parse(event.data);badge.textContent='進捗: 最新';if(next.head_digest!==head){badge.textContent='進捗: 更新を反映中';location.reload();}});stream.addEventListener('lattice-error',event=>{const detail=JSON.parse(event.data);badge.textContent='進捗: エラー '+detail.code;badge.style.borderColor='#d03b3b';});stream.onerror=()=>{badge.textContent='進捗: 再接続中';};})();</script>`;
+/**
+ * 注入点が消えていたら黙って注入をやめない。タブが出ない理由を後から追えるように、
+ * 差せなかった事実をtyped errorとして立てる（差し込み位置は描画部品の実装に依る）。
+ */
+function injectOnce(html, marker, replacement) {
+  const at = html.indexOf(marker);
+  if (at === -1 || html.indexOf(marker, at + marker.length) !== -1) {
+    const error = new Error(`external pane injection point not unique: ${marker}`);
+    error.code = 'EXTERNAL_PANE_INJECTION_FAILED';
+    error.detail = { marker };
+    throw error;
+  }
+  return `${html.slice(0, at)}${replacement}${html.slice(at + marker.length)}`;
+}
+
+const EXTERNAL_PANE_STYLE = '<style>.narrative-pane{display:flex;flex-direction:column}[data-right-panel="external"]{display:flex;flex:1 1 auto;min-height:0}[data-right-panel="external"]>iframe{flex:1 1 auto;width:100%;min-height:0;border:0;background:var(--surface-1)}</style>';
+
+/**
+ * 生存判定は「非空の一覧を返すこと」だけを根拠にする。Latticeは差された先が何の
+ * サービスかを知らないので、payloadの意味には触らない（非空配列、または配列値の
+ * プロパティが1つ以上非空）。非200・fetch失敗・空一覧はすべて概要タブのままにする。
+ */
+function externalPaneController(pane) {
+  return `<script>(()=>{const root=document.querySelector('[data-gantt-root]');const panel=root.querySelector('[data-right-panel="external"]');const frame=panel.querySelector('iframe');const content=root.querySelector('.right-content');const button=root.querySelector('[data-show-external-pane]');const show=()=>{if(frame.getAttribute('src')===null)frame.setAttribute('src',frame.dataset.src);content.hidden=true;panel.hidden=false;button.setAttribute('aria-pressed','true');root.dataset.viewState='external';};const leave=()=>{if(root.dataset.viewState==='external')return;panel.hidden=true;content.hidden=false;button.setAttribute('aria-pressed','false');};new MutationObserver(leave).observe(root,{attributeFilter:['data-view-state']});button.addEventListener('click',show);const nonEmpty=value=>Array.isArray(value)&&value.length>0;fetch(${JSON.stringify(pane.probeUrl)},{cache:'no-store'}).then(response=>response.ok?response.json():null).then(payload=>{if(nonEmpty(payload)||(payload!==null&&typeof payload==='object'&&Object.values(payload).some(nonEmpty)))show();}).catch(()=>{});})();</script>`;
+}
+
+/**
+ * projectに外部ペインが差してある時だけ、右ペインへタブ1枚とiframeを足す。
+ * Latticeは題名・埋め込み先・生存probeの3つしか知らない（差す側が明示的に書く口）。
+ */
+function withExternalPane(html, pane) {
+  const tab = `<button type="button" data-show-external-pane aria-pressed="false">${escapeHtml(pane.title)}</button>`;
+  const iframe = `<section data-right-panel="external" hidden><iframe data-src="${escapeHtml(pane.url)}" title="${escapeHtml(pane.title)}"></iframe></section>`;
+  return injectOnce(
+    injectOnce(
+      injectOnce(
+        injectOnce(html, "default-src 'none'; connect-src 'self';",
+          `default-src 'none'; connect-src 'self' ${pane.probeOrigin}; frame-src ${pane.frameOrigin};`),
+        '</head>', `${EXTERNAL_PANE_STYLE}</head>`,
+      ),
+      '<button type="button" data-show-overview>概要</button>', `${tab}<button type="button" data-show-overview>概要</button>`,
+    ),
+    '<div class="right-content">', `${iframe}<div class="right-content">`,
+  ).replace('</body>', `${externalPaneController(pane)}</body>`);
+}
+
+function liveHtml(html, headDigest, eventsPath, externalPane = null) {
+  const controller = `<script>(()=>{const badge=document.createElement('div');badge.setAttribute('role','status');badge.style.cssText='position:fixed;right:12px;bottom:12px;z-index:99;padding:6px 10px;border:1px solid #d9d8d4;border-radius:4px;background:#fcfcfb;font:600 12px system-ui';badge.textContent='進捗: 接続中';document.body.append(badge);const head=${JSON.stringify(headDigest)};let lastReceipt=Date.now();let stream=null;const receive=event=>{const next=JSON.parse(event.data);if(typeof next.head_digest!=='string')return;lastReceipt=Date.now();badge.textContent='進捗: 最新';if(next.head_digest!==head){badge.textContent='進捗: 更新を反映中';location.reload();}};const connect=()=>{if(stream)stream.close();badge.textContent='進捗: 接続中';stream=new EventSource(${JSON.stringify(eventsPath)});stream.onopen=()=>{lastReceipt=Date.now();};stream.addEventListener('state',receive);stream.addEventListener('ping',receive);stream.addEventListener('lattice-error',event=>{lastReceipt=Date.now();const detail=JSON.parse(event.data);badge.textContent='進捗: エラー '+detail.code;badge.style.borderColor='#d03b3b';});stream.onerror=()=>{badge.textContent='進捗: 再接続中';};};connect();setInterval(()=>{if(Date.now()-lastReceipt>${SSE_STALE_MS})connect();},${SSE_WATCHDOG_MS});})();</script>`;
   const publicMetadata = '<meta name="description" content="Latticeで管理しているプロジェクトの依存工程と進捗を確認できます。"><meta name="robots" content="noindex, nofollow"><meta name="theme-color" content="#f7f3ea">';
   const publicStyle = '<style>body[data-gantt-root]{grid-template-rows:auto minmax(0,1fr)}.lattice-live-brand{z-index:10;display:flex;align-items:center;gap:8px;min-width:0;padding:10px 16px;border-bottom:1px solid #d8d0c5;background:#f7f3ea;color:#6c655d;font:600 12px/1.5 system-ui,-apple-system,"Hiragino Sans","Yu Gothic UI",sans-serif}.lattice-live-brand a{color:#201d19;text-decoration:none}.lattice-live-brand a:hover{color:#315cbe}.lattice-live-brand strong{color:#201d19}.lattice-live-brand-note{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lattice-live-back{margin-left:auto!important;color:#315cbe!important;font-weight:750}@media(max-width:560px){.lattice-live-brand{padding:9px 12px}.lattice-live-brand-note{display:none}}</style>';
   const publicHeader = '<header class="lattice-live-brand"><a href="https://kitepon.dev/">kitepon.dev</a><span aria-hidden="true">/</span><strong>Lattice</strong><span class="lattice-live-brand-note">公開工程表</span><a class="lattice-live-back" href="/projects/">一覧へ戻る</a></header>';
-  return html
+  const live = html
     .replace("default-src 'none';", "default-src 'none'; connect-src 'self';")
     .replace('</head>', `${publicMetadata}${publicStyle}</head>`)
     .replace(/<body([^>]*)>/u, `<body$1>${publicHeader}`)
     .replace('</body>', `${controller}</body>`);
+  return externalPane === null ? live : withExternalPane(live, externalPane);
 }
 
 function escapeHtml(value) {
@@ -137,6 +187,7 @@ export async function startTodoGanttDashboardServer({ registry, port = 0, redire
     || typeof registry.list !== 'function') throw new TypeError('registry required');
   const clientsByProject = new Map();
   const lastHeads = new Map();
+  const lastHeartbeats = new Map();
   let eventId = 0;
   let checking = false;
   let closed = false;
@@ -147,6 +198,7 @@ export async function startTodoGanttDashboardServer({ registry, port = 0, redire
       for (const client of clients) client.end();
       clientsByProject.delete(projectId);
       lastHeads.delete(projectId);
+      lastHeartbeats.delete(projectId);
     }
   };
   const unsubscribe = typeof registry.subscribe === 'function'
@@ -208,6 +260,7 @@ export async function startTodoGanttDashboardServer({ registry, port = 0, redire
         try {
           const head = await project.readHead();
           lastHeads.set(project.projectId, head);
+          if (!lastHeartbeats.has(project.projectId)) lastHeartbeats.set(project.projectId, Date.now());
           sendEvent(response, 'state', ++eventId, { head_digest: head });
         } catch (error) {
           sendEvent(response, 'lattice-error', ++eventId, { code: error?.code ?? 'STORE_READ_FAILED' });
@@ -221,7 +274,9 @@ export async function startTodoGanttDashboardServer({ registry, port = 0, redire
         displayName: project.displayName,
       });
       lastHeads.set(project.projectId, rendered.head_digest);
-      const html = liveHtml(rendered.html, rendered.head_digest, `${projectPath(project.projectId)}events`);
+      // 外部ペイン設定は描画のたびにrender側が読み直す。差した／外した側は再起動を要さない。
+      const html = liveHtml(rendered.html, rendered.head_digest,
+        `${projectPath(project.projectId)}events`, rendered.external_pane ?? null);
       response.writeHead(200, { 'content-type': 'text/html; charset=utf-8',
         'cache-control': 'no-store', 'x-content-type-options': 'nosniff' });
       response.end(html);
@@ -252,6 +307,11 @@ export async function startTodoGanttDashboardServer({ registry, port = 0, redire
             lastHeads.set(project.projectId, head);
             for (const client of clients) sendEvent(client, 'state', ++eventId, { head_digest: head });
           }
+          const now = Date.now();
+          if (now - (lastHeartbeats.get(project.projectId) ?? now) >= SSE_HEARTBEAT_MS) {
+            lastHeartbeats.set(project.projectId, now);
+            for (const client of clients) sendEvent(client, 'ping', ++eventId, { head_digest: head });
+          }
         } catch (error) {
           for (const client of clients) sendEvent(client, 'lattice-error', ++eventId,
             { code: error?.code ?? 'STORE_READ_FAILED' });