petari 0.3.0 → 0.4.0

package/dist/core/diff.js

@@ -0,0 +1,177 @@
+/**
+ * 行単位の diff (§4.3 ブラウザ差分ビュー用)。
+ *
+ * 不変条件: どんな入力でも「ops を a に適用すると b が完全再現される」。
+ * Myers の探索を maxD で打ち切った場合は中間部を全削除+全挿入として返すため、
+ * diff の品質はマージ (core/edit.ts) の正しさに影響しない — 打ち切りは
+ * raw バイトを保持できる行が減るだけ。
+ */
+const DEFAULT_MAX_D = 2000;
+/** 行配列 a → b の差分を返す。インデックスはともに 0-based */
+export function diffLines(a, b, maxD = DEFAULT_MAX_D) {
+    // 共通の前置き・後置きを先に確定する (パッチ適用前後の比較では大半が共通)
+    let pre = 0;
+    while (pre < a.length && pre < b.length && a[pre] === b[pre])
+        pre++;
+    let suf = 0;
+    while (suf < a.length - pre &&
+        suf < b.length - pre &&
+        a[a.length - 1 - suf] === b[b.length - 1 - suf]) {
+        suf++;
+    }
+    const ops = [];
+    for (let i = 0; i < pre; i++)
+        ops.push({ kind: "same", a: i, b: i });
+    for (const op of diffMiddle(a.slice(pre, a.length - suf), b.slice(pre, b.length - suf), maxD)) {
+        if (op.kind === "same")
+            ops.push({ kind: "same", a: op.a + pre, b: op.b + pre });
+        else if (op.kind === "del")
+            ops.push({ kind: "del", a: op.a + pre });
+        else
+            ops.push({ kind: "ins", b: op.b + pre });
+    }
+    for (let i = 0; i < suf; i++) {
+        ops.push({ kind: "same", a: a.length - suf + i, b: b.length - suf + i });
+    }
+    return ops;
+}
+/** 全削除 + 全挿入 (共通行の探索なし)。maxD 打ち切り時のフォールバック */
+function fallbackAll(n, m) {
+    const ops = [];
+    for (let i = 0; i < n; i++)
+        ops.push({ kind: "del", a: i });
+    for (let j = 0; j < m; j++)
+        ops.push({ kind: "ins", b: j });
+    return ops;
+}
+/** Myers O(ND) 貪欲法。a と b は共通の前置き・後置きを持たない前提 */
+function diffMiddle(a, b, maxD) {
+    const n = a.length;
+    const m = b.length;
+    if (n === 0 || m === 0)
+        return fallbackAll(n, m);
+    // |k| <= d <= cap なので V 配列は 2*cap+1 で足りる (スナップショット総量の上限も抑える)
+    const cap = Math.min(n + m, maxD);
+    const offset = cap;
+    const v = new Int32Array(2 * cap + 1);
+    const trace = [];
+    let found = -1;
+    outer: for (let d = 0; d <= cap; d++) {
+        trace.push(v.slice());
+        for (let k = -d; k <= d; k += 2) {
+            let x;
+            if (k === -d || (k !== d && v[offset + k - 1] < v[offset + k + 1])) {
+                x = v[offset + k + 1];
+            }
+            else {
+                x = v[offset + k - 1] + 1;
+            }
+            let y = x - k;
+            while (x < n && y < m && a[x] === b[y]) {
+                x++;
+                y++;
+            }
+            v[offset + k] = x;
+            if (x >= n && y >= m) {
+                found = d;
+                break outer;
+            }
+        }
+    }
+    if (found === -1)
+        return fallbackAll(n, m);
+    // バックトラック (trace[d] は深さ d-1 終了時点の V)
+    const rev = [];
+    let x = n;
+    let y = m;
+    for (let d = found; d > 0; d--) {
+        const vp = trace[d];
+        const k = x - y;
+        const down = k === -d || (k !== d && vp[offset + k - 1] < vp[offset + k + 1]);
+        const prevK = down ? k + 1 : k - 1;
+        const prevX = vp[offset + prevK];
+        const prevY = prevX - prevK;
+        while (x > prevX && y > prevY) {
+            rev.push({ kind: "same", a: x - 1, b: y - 1 });
+            x--;
+            y--;
+        }
+        rev.push(down ? { kind: "ins", b: prevY } : { kind: "del", a: prevX });
+        x = prevX;
+        y = prevY;
+    }
+    while (x > 0 && y > 0) {
+        rev.push({ kind: "same", a: x - 1, b: y - 1 });
+        x--;
+        y--;
+    }
+    return rev.reverse();
+}
+/**
+ * change ペア行の文字単位ハイライト範囲を両側分返す (表示専用)。
+ * 長い行や乖離が大きい行は行全体の範囲にフォールバックする (品質のみ低下)。
+ */
+export function intralineRanges(a, b) {
+    const A = Array.from(a);
+    const B = Array.from(b);
+    if (A.length > 1000 || B.length > 1000) {
+        return {
+            left: A.length > 0 ? [{ start: 0, end: A.length }] : [],
+            right: B.length > 0 ? [{ start: 0, end: B.length }] : [],
+        };
+    }
+    const push = (arr, i) => {
+        const last = arr[arr.length - 1];
+        if (last !== undefined && last.end === i)
+            last.end = i + 1;
+        else
+            arr.push({ start: i, end: i + 1 });
+    };
+    const left = [];
+    const right = [];
+    for (const op of diffLines(A, B, 500)) {
+        if (op.kind === "del")
+            push(left, op.a);
+        else if (op.kind === "ins")
+            push(right, op.b);
+    }
+    return { left, right };
+}
+/** ops を side-by-side 表示用の行に変換する (連続する del/ins は左右にペアで並べる) */
+export function toSideBySideRows(a, b, ops) {
+    const rows = [];
+    let i = 0;
+    while (i < ops.length) {
+        const op = ops[i];
+        if (op.kind === "same") {
+            rows.push({
+                kind: "same",
+                left: { no: op.a + 1, text: a[op.a] },
+                right: { no: op.b + 1, text: b[op.b] },
+            });
+            i++;
+            continue;
+        }
+        const dels = [];
+        const inss = [];
+        while (i < ops.length && ops[i].kind !== "same") {
+            const o = ops[i];
+            if (o.kind === "del")
+                dels.push(o.a);
+            else if (o.kind === "ins")
+                inss.push(o.b);
+            i++;
+        }
+        const len = Math.max(dels.length, inss.length);
+        for (let r = 0; r < len; r++) {
+            const ai = dels[r];
+            const bi = inss[r];
+            rows.push({
+                kind: ai !== undefined && bi !== undefined ? "change" : ai !== undefined ? "del" : "ins",
+                left: ai !== undefined ? { no: ai + 1, text: a[ai] } : null,
+                right: bi !== undefined ? { no: bi + 1, text: b[bi] } : null,
+            });
+        }
+    }
+    return rows;
+}

package/dist/core/edit.js

@@ -0,0 +1,83 @@
+/**
+ * ブラウザ編集の保存マージ (§4.3 + §8)。
+ * textarea で送信された全文を FileDocument にマージする。変更していない行は
+ * 元の DocLine (raw バイト・改行) をそのまま保持し、変更・追加行のみを
+ * 再エンコード対象 (raw: null) にする — apply の replace と同じ §8 の方式。
+ */
+import { diffLines } from "./diff.js";
+import { findUnencodable } from "./encoding.js";
+/**
+ * textarea 送信テキストを行に分解する。フォーム送信の改行は CRLF に正規化されるため
+ * \r\n / \r / \n を全て区切りとして扱う。末尾の空セグメント = 末尾改行あり
+ * (decodeFile と同じ規約)。
+ */
+export function parseEditedText(text) {
+    if (text === "")
+        return { lines: [], trailingNewline: false };
+    const segs = text.split(/\r\n|\r|\n/);
+    if (segs[segs.length - 1] === "")
+        return { lines: segs.slice(0, -1), trailingNewline: true };
+    return { lines: segs, trailingNewline: false };
+}
+/** doc を textarea 表示用の全文にする (\n 結合。parseEditedText と往復可能) */
+export function renderTextareaValue(doc) {
+    const joined = doc.lines.map((l) => l.text).join("\n");
+    return doc.trailingNewline && doc.lines.length > 0 ? joined + "\n" : joined;
+}
+/**
+ * 編集結果を doc にマージする。行 diff で整列し、テキストが一致する行は元の
+ * DocLine をそのまま使う (raw バイト・実改行を保持)。
+ * 既知の限界 (許容済み): 同一テキストで raw バイトだけ異なる重複行 (Shift_JIS の
+ * NEC/IBM 拡張の重複マッピング等) は、他所の編集により diff の整列先が入れ替わり
+ * raw が交換されることがある。デコード結果は同一のため実害はない。
+ */
+export function mergeEditedText(doc, editedText) {
+    const { lines: newTexts, trailingNewline } = parseEditedText(editedText);
+    const ops = diffLines(doc.lines.map((l) => l.text), newTexts);
+    const lines = [];
+    for (const op of ops) {
+        if (op.kind === "same")
+            lines.push(doc.lines[op.a]);
+        else if (op.kind === "ins")
+            lines.push({ text: newTexts[op.b], raw: null, eol: null });
+    }
+    return {
+        encoding: doc.encoding,
+        hasBom: doc.hasBom,
+        eol: doc.eol,
+        trailingNewline,
+        lines,
+    };
+}
+/**
+ * ブラウザ編集できない理由を返す (null = 編集可)。
+ * HTML パーサは textarea 内の CR/CRLF を LF に正規化し NUL を U+FFFD に置換するため、
+ * これらを含むファイルは「開いて保存しただけで壊れる」— 事前に編集を拒否する。
+ * (閲覧のみの diff 表示には影響しない)
+ */
+export function browserEditBlockReason(doc) {
+    for (const line of doc.lines) {
+        if (line.text.includes("\r") || line.text.includes("\u0000")) {
+            return "CR のみの改行または NUL 文字を含むため、ブラウザでの編集はできません (HTML フォームが内容を変更してしまうため)";
+        }
+    }
+    return null;
+}
+/** マージ後の再エンコード対象行 (raw: null) から変換不能文字を集める (§8 の事前検証) */
+export function findMergeUnencodable(doc) {
+    if (doc.encoding === "utf8")
+        return [];
+    const bad = [];
+    const seen = new Set();
+    for (const line of doc.lines) {
+        if (line.raw !== null)
+            continue;
+        for (const ch of findUnencodable(line.text, doc.encoding)) {
+            if (!seen.has(ch)) {
+                seen.add(ch);
+                bad.push(ch);
+            }
+        }
+    }
+    return bad;
+}

package/dist/core/editor-html.js

@@ -0,0 +1,301 @@
+/**
+ * Monaco Editor (VS Code のエディタ実装) によるブラウザ差分エディタページ (§4.3 --edit)。
+ * 純粋な文字列生成のみ。
+ *
+ * セキュリティ方針 (2026-08-12 Monaco 採用で更新):
+ * - スクリプトは「ビルド時に同梱した monaco-editor (script-src 'self')」と
+ *   「このファイルに埋め込んだ自前ブートストラップ (nonce)」のみ。
+ *   外部 CDN・外部リソースへの参照はゼロ (CSP が遮断する)
+ * - 埋め込みデータ (JSON) は JSON.stringify 後に < を < へ置換し、
+ *   </script> による脱出を封じる (type="application/json" の不活性ブロック)
+ * - トークンを HTML に埋め込まない: monaco 資産のパスは実行時に location.pathname
+ *   から組み立てる。フォーム action・リンクは相対のみ
+ * - JS が無効でも動く: <noscript> 内の素のフォーム (textarea) で保存できる。
+ *   textarea の値はエスケープ以外の加工禁止・開きタグ直後の改行必須 (diff-html.ts と同じ理由)
+ *
+ * 実装メモ: monaco.editor.createDiffEditor が VS Code と同じ差分 UI
+ * (view zone による完全な行整列・右ペイン編集・シンタックスハイライト) を提供する。
+ * モデルの改行は monaco が単一 EOL に正規化するが、保存は §8 の mergeEditedText が
+ * 行テキスト単位で raw バイトを保全するため、無変更行の実バイトは壊れない。
+ */
+import { escapeHtml, CSP } from "./diff-html.js";
+/**
+ * エディタページ用 CSP。同梱 monaco ('self') + 自前ブートストラップ (nonce) のみ許可。
+ * font-src data: は monaco の codicon フォント (CSS 内 data: URI)、
+ * worker-src は monaco のエディタ/差分計算ワーカー用。
+ */
+export function editorCsp(nonce) {
+    return CSP.replace("default-src 'none'; style-src 'unsafe-inline'", `default-src 'none'; script-src 'self' 'nonce-${nonce}'; style-src 'unsafe-inline' 'self'; ` +
+        "font-src data:; img-src 'self' data:; worker-src 'self' blob:; connect-src 'self'");
+}
+const STYLE = `
+:root{
+  --bg:#ffffff;--panel:#f3f3f3;--border:#e5e5e5;--fg:#1f1f1f;--muted:#6e7681;
+  --accent:#005fb8;--accent-fg:#ffffff;--status-bg:#005fb8;--status-fg:#ffffff;
+  --ok:#1a7f37;--err:#c72e2e;
+}
+@media (prefers-color-scheme: dark){:root{
+  --bg:#1e1e1e;--panel:#252526;--border:#3c3c3c;--fg:#d4d4d4;--muted:#858585;
+  --accent:#0e639c;--accent-fg:#ffffff;--status-bg:#007acc;--status-fg:#ffffff;
+  --ok:#89d185;--err:#f48771;
+}}
+*{box-sizing:border-box;margin:0}
+html,body{height:100%}
+body{background:var(--bg);color:var(--fg);overflow:hidden;
+  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Noto Sans JP",sans-serif;font-size:13px}
+.app{display:flex;flex-direction:column;height:100vh}
+.titlebar{display:flex;align-items:center;gap:.8rem;background:var(--panel);
+  border-bottom:1px solid var(--border);padding:0 .6rem 0 0;flex-shrink:0}
+.tab{display:flex;align-items:center;gap:.45em;background:var(--bg);border-right:1px solid var(--border);
+  padding:.45em .95em;font-size:12.5px}
+.tab code{font-family:ui-monospace,Menlo,Consolas,monospace}
+#dirty{color:var(--fg);visibility:hidden}
+.tb-sp{flex:1}
+#msg{font-size:12px;color:var(--muted)}
+#msg.ok{color:var(--ok)} #msg.err{color:var(--err)}
+.btn{font-size:12.5px;padding:.34em 1.1em;border-radius:3px;border:1px solid transparent;cursor:pointer;
+  background:var(--accent);color:var(--accent-fg)}
+.btn:hover{filter:brightness(1.15)}
+.btn.ghost{background:transparent;color:var(--fg);border-color:var(--border);text-decoration:none;display:inline-block}
+.inline{display:inline}
+.banner{padding:.4rem .8rem;font-size:12.5px;border-bottom:1px solid var(--border)}
+.banner.ok{color:var(--ok)} .banner.err{color:var(--err)}
+#ed{flex:1;min-height:0}
+.note{color:var(--muted);padding:.8rem}
+noscript textarea{width:100%;height:60vh;font-family:ui-monospace,Menlo,Consolas,monospace;
+  font-size:12.5px;background:var(--bg);color:var(--fg);border:1px solid var(--border)}
+noscript .nsform{padding:.8rem}
+.statusbar{display:flex;align-items:center;gap:1.2em;background:var(--status-bg);color:var(--status-fg);
+  font-size:12px;padding:.18em .9em;flex-shrink:0}
+.statusbar .sp{flex:1}
+`.trim();
+/** 埋め込み JSON: </script> 脱出と行分離子を封じる */
+function embedJson(value) {
+    return JSON.stringify(value)
+        .replaceAll("<", "\\u003c")
+        .replaceAll("\u2028", "\\u2028")
+        .replaceAll("\u2029", "\\u2029");
+}
+// 埋め込みブートストラップ JS。テンプレートリテラル内のため ` と ${ は使わない
+const BOOT_JS = String.raw `
+(function () {
+  "use strict";
+  var data = JSON.parse(document.getElementById("pd").textContent);
+  var msgEl = document.getElementById("msg");
+  function setMsg(text, cls) {
+    msgEl.textContent = text;
+    msgEl.className = cls || "";
+  }
+  if (data.blocked) return;
+  var saveBtn = document.getElementById("savebtn");
+  var dirtyEl = document.getElementById("dirty");
+  var statEl = document.getElementById("diffstat");
+  var caretEl = document.getElementById("caret");
+  // monaco 資産のベース URL。トークンは HTML に埋めず実行時に URL から得る
+  var tokenBase = "/" + window.location.pathname.split("/").filter(function (s) { return s !== ""; })[0];
+  var baseSha = data.baseSha256;
+  var saving = false, dirty = false;
+  var modified = null;
+  var msgTimer = null;
+
+  var css = document.createElement("link");
+  css.rel = "stylesheet";
+  css.href = tokenBase + "/vs/editor/editor.main.css";
+  document.head.appendChild(css);
+  // 読み込みが黙って止まった場合の見張り (依存欠落は AMD ではエラーにならないことがある)
+  var watchdog = setTimeout(function () {
+    setMsg("エディタの読み込みに時間がかかっています (コンソールを確認してください)", "err");
+  }, 20000);
+  // 日本語 NLS: monaco 0.5x では AMD モジュールではなく素のスクリプトが
+  // globalThis._VSCODE_NLS_MESSAGES を設定する方式。editor.main より先に読み込む。
+  // (旧 availableLanguages 設定で読むと define されないモジュールを待ってハングする)
+  var nls = document.createElement("script");
+  nls.src = tokenBase + "/vs/nls/lang/ja.js";
+  nls.onload = loadLoader;
+  nls.onerror = loadLoader; // NLS がなくても英語 UI で続行
+  document.head.appendChild(nls);
+
+  function loadLoader() {
+    var s = document.createElement("script");
+    s.src = tokenBase + "/vs/loader.js";
+    s.onload = boot;
+    s.onerror = function () { setMsg("エディタ資産を読み込めませんでした", "err"); };
+    document.head.appendChild(s);
+  }
+
+  function boot() {
+    window.require.config({ paths: { vs: tokenBase + "/vs" } });
+    window.require(["vs/editor/editor.main"], init, function () {
+      setMsg("エディタを初期化できませんでした", "err");
+    });
+  }
+
+  function init() {
+    var monaco = window.monaco;
+    var dark = window.matchMedia("(prefers-color-scheme: dark)");
+    var original = monaco.editor.createModel(
+      data.snapshotText === null ? "" : data.snapshotText,
+      undefined,
+      monaco.Uri.file("/original/" + data.path)
+    );
+    var mod = monaco.editor.createModel(
+      data.currentText,
+      undefined,
+      monaco.Uri.file("/modified/" + data.path)
+    );
+    modified = mod;
+    var diffEditor = monaco.editor.createDiffEditor(document.getElementById("ed"), {
+      automaticLayout: true,
+      originalEditable: false,
+      renderSideBySide: true,
+      ignoreTrimWhitespace: false,
+      theme: dark.matches ? "vs-dark" : "vs",
+    });
+    diffEditor.setModel({ original: original, modified: mod });
+    if (dark.addEventListener) {
+      dark.addEventListener("change", function (e) {
+        monaco.editor.setTheme(e.matches ? "vs-dark" : "vs");
+      });
+    }
+    mod.onDidChangeContent(function () {
+      if (!dirty) { dirty = true; dirtyEl.style.visibility = "visible"; }
+    });
+    diffEditor.onDidUpdateDiff(function () {
+      var changes = diffEditor.getLineChanges() || [];
+      var add = 0, del = 0;
+      for (var i = 0; i < changes.length; i++) {
+        var c = changes[i];
+        if (c.modifiedEndLineNumber >= c.modifiedStartLineNumber && c.modifiedEndLineNumber > 0) {
+          add += c.modifiedEndLineNumber - c.modifiedStartLineNumber + 1;
+        }
+        if (c.originalEndLineNumber >= c.originalStartLineNumber && c.originalEndLineNumber > 0) {
+          del += c.originalEndLineNumber - c.originalStartLineNumber + 1;
+        }
+      }
+      statEl.textContent = "+" + add + " −" + del;
+    });
+    var me = diffEditor.getModifiedEditor();
+    me.onDidChangeCursorPosition(function (e) {
+      caretEl.textContent = "行 " + e.position.lineNumber + "、列 " + e.position.column;
+    });
+    me.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS, doSave);
+    saveBtn.hidden = false;
+    saveBtn.addEventListener("click", doSave);
+    document.addEventListener("keydown", function (e) {
+      if ((e.metaKey || e.ctrlKey) && (e.key === "s" || e.key === "S")) {
+        e.preventDefault();
+        doSave();
+      }
+    });
+    window.addEventListener("beforeunload", function (e) {
+      if (dirty) e.preventDefault();
+    });
+    clearTimeout(watchdog);
+    setMsg("", "");
+    me.focus();
+  }
+
+  function doSave() {
+    if (saving || modified === null) return;
+    saving = true;
+    setMsg("保存中…", "");
+    var body = new URLSearchParams();
+    body.set("baseSha256", baseSha);
+    body.set("text", modified.getValue());
+    body.set("ajax", "1");
+    fetch(window.location.pathname, {
+      method: "POST",
+      headers: { "content-type": "application/x-www-form-urlencoded;charset=UTF-8" },
+      body: body.toString(),
+    }).then(function (res) {
+      return res.json().then(function (j) { return { status: res.status, j: j }; });
+    }).then(function (r) {
+      saving = false;
+      if (r.j.ok === true) {
+        baseSha = r.j.baseSha256;
+        dirty = false;
+        dirtyEl.style.visibility = "hidden";
+        setMsg("保存しました ✓", "ok");
+        if (msgTimer !== null) clearTimeout(msgTimer);
+        msgTimer = setTimeout(function () { setMsg("", ""); }, 3000);
+      } else {
+        setMsg(r.j.error || "保存に失敗しました (" + r.status + ")", "err");
+      }
+    }).catch(function () {
+      saving = false;
+      setMsg("保存に失敗しました (接続エラー)", "err");
+    });
+  }
+})();
+`;
+export function buildEditorPage(d) {
+    const banners = [];
+    if (d.saved)
+        banners.push(`<div class="banner ok">保存しました</div>`);
+    if (d.errorBanner !== null)
+        banners.push(`<div class="banner err">${escapeHtml(d.errorBanner)}</div>`);
+    if (d.blockReason !== null)
+        banners.push(`<div class="banner err">${escapeHtml(d.blockReason)}</div>`);
+    if (d.snapshotNote !== null)
+        banners.push(`<div class="banner">${escapeHtml(d.snapshotNote)}</div>`);
+    // JS 無効時のフォールバック: 素のフォーム POST (§8 の保存経路は同じ)。
+    // <textarea> 開きタグ直後の改行はブラウザに 1 個食われるため必ず入れる
+    const noscriptForm = d.blockReason !== null
+        ? ""
+        : `<noscript><div class="nsform">
+<p class="note">JS が無効のため Monaco エディタは使えません。以下で直接編集して保存できます (${escapeHtml(d.leftLabel)}との差分表示はありません)</p>
+<form method="post" action="">
+<input type="hidden" name="baseSha256" value="${escapeHtml(d.baseSha256)}">
+<textarea name="text" spellcheck="false" autocomplete="off">
+${escapeHtml(d.currentText)}</textarea>
+<p><button class="btn">保存</button></p>
+</form>
+</div></noscript>`;
+    const editorArea = d.blockReason !== null
+        ? `<div class="note">${escapeHtml(d.blockReason)}</div>`
+        : `<div id="ed"></div>\n${noscriptForm}`;
+    const data = {
+        blocked: d.blockReason !== null,
+        path: d.path,
+        snapshotText: d.snapshotText,
+        currentText: d.currentText,
+        baseSha256: d.baseSha256,
+    };
+    const body = `<div class="app">
+<div class="titlebar">
+<div class="tab"><span id="dirty">●</span><code>${escapeHtml(d.path)}</code></div>
+<span id="msg">エディタを読み込み中…</span>
+<div class="tb-sp"></div>
+${d.blockReason === null ? `<button class="btn" id="savebtn" hidden>保存</button>` : ""}
+<a class="btn ghost" href="../">一覧</a>
+<form class="inline" method="post" action="../quit"><button class="btn ghost">終了</button></form>
+</div>
+${banners.join("\n")}
+${editorArea}
+<div class="statusbar">
+<span>${escapeHtml(d.leftLabel)} ⇔ 現在のファイル</span>
+<span id="diffstat"></span>
+<span class="sp"></span>
+<span>無操作 ${d.idleMinutes} 分で自動終了</span>
+<span>${escapeHtml(d.encodingLabel)}</span>
+<span>${escapeHtml(d.eolLabel)}</span>
+<span id="caret"></span>
+</div>
+</div>
+<script type="application/json" id="pd">${embedJson(data)}</script>
+<script nonce="${escapeHtml(d.nonce)}">${BOOT_JS}</script>`;
+    return `<!doctype html>
+<html lang="ja">
+<head>
+<meta charset="utf-8">
+<meta http-equiv="Content-Security-Policy" content="${editorCsp(d.nonce)}">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${escapeHtml(d.path)} — petari</title>
+<style>${STYLE}</style>
+</head>
+<body>
+${body}
+</body>
+</html>
+`;
+}

package/dist/infra/browser.js

@@ -0,0 +1,24 @@
+/**
+ * OS 既定ブラウザで URL / ファイルを開く (§4.3 ブラウザ差分ビュー)。
+ * 依存ゼロ方針のため OS コマンドを呼び出す (常に execFile の配列引数・シェル非経由)。
+ * 対象は自前で生成した URL (http://127.0.0.1:...) か一時ファイルのパスのみで
+ * 外部入力は渡さないが、Windows の引用は clipboard.ts と同じ単一引用符方式で行う。
+ * 自動テストなし (実機確認のみ — clipboard.ts と同方針)。
+ */
+import { execFile } from "node:child_process";
+import { promisify } from "node:util";
+const execFileP = promisify(execFile);
+/** 既定ブラウザで開く。失敗時は throw (呼び出し側がパス/URL を案内して続行する) */
+export async function openInBrowser(target) {
+    if (process.platform === "darwin") {
+        await execFileP("open", [target]);
+        return;
+    }
+    if (process.platform === "win32") {
+        // ' は '' にエスケープした単一引用符リテラルで渡す (展開・注入が起きない)
+        const quoted = `'${target.replaceAll("'", "''")}'`;
+        await execFileP("powershell", ["-NoProfile", "-Command", `Start-Process ${quoted}`]);
+        return;
+    }
+    await execFileP("xdg-open", [target]);
+}