@takagaki/cortex-decisions-viewer 0.12.43 → 0.12.44

package/dist/render.js

@@ -67,8 +67,8 @@ function renderSite(site, assets) {
     // </script> によるブレイクアウトを防ぐため < をエスケープして埋め込む
     // Claude Code Web ディープリンク（この案件リポ＋狙ったプロンプトで開く）。repoBaseUrl から slug を導出（追加入力なし）。
     const repoSlug = projectRepoSlug(site.repoBaseUrl);
-    // ヘッダーの「AIに聞く」と、接続マップの下の「Claude Code で開く」（#465）は
-    // **同じ askAiUrl を呼ぶ**（同じ先を開くことを、引数の写しではなく構造で保証する）
+    // ヘッダーの「AIに聞く」の押し先。組み立ては askAiUrl 1か所に置いてある
+    // （claudeCodeUrl を直に呼ぶと、引数を1つ落とした側だけが違う先を開く）
     const askUrl = askAiUrl(site);
     // ※ 投入フォーム設定 site.intake は build.ts が --intake-url/--intake-token/--project-key から付与する。
     const dataJson = JSON.stringify(site).replace(/</g, "\\u003c");
@@ -384,9 +384,8 @@ exports.CLAUDE_CODE_LINK = { home: CLAUDE_CODE_HOME };
 /**
  * 「この案件について聞く」導線の指示文。
  *
- * ヘッダーの「💬 プロジェクトについてAIに聞く」と、接続マップの下の
- * 「Claude Code で開く」（#465）が**同じ先を開くと決めた**ので、指示文はここ1か所に置く。
- * 片方に書き写すと、URL は同じでも**開いた先の AI への最初の一言が2通り**になる。
+ * **AI 導線の指示文はここ1か所に持つ。** 書き写した先が増えると、URL は同じでも
+ * **開いた先の AI への最初の一言が2通り**になる（`askAiUrl` と対で読む）。
  *
  * `data-ai-prompt` にも同じ値を残す（接続状況が届いたら href を組み直す・syncAiLinks）。
  */
@@ -394,8 +393,8 @@ const ASK_PROMPT = "このプロジェクトの概要について教えてくだ
 /**
  * `repoBaseUrl`（https://github.com/owner/repo）から Claude Code に渡す `owner/repo`。
  *
- * **ヘッダーの導線（renderSite）と図の下の箱（renderConnectionMap）が同じ先を開く**ので、
- * 導出もここ1か所に置く。形の検査は claudeCodeUrl 側（isRepositorySlug）が行うため、
+ * **AI 導線の slug の導出はここ1か所に置く**（`askAiUrl` と対）。形の検査は
+ * claudeCodeUrl 側（isRepositorySlug）が行うため、
  * ここは「取れなければ空文字」に留める——呼び出し側は空でもそのまま渡してよい
  * （claudeCodeUrl が素のリンクへ倒す）。
  */
@@ -409,9 +408,10 @@ function projectRepoSlug(repoBaseUrl) {
 /**
  * 「この案件を Claude Code Web で開く」URL。
  *
- * 🔴 **ヘッダーの「AIに聞く」と、図の下の「Claude Code で開く」（#465）はこの1本を呼ぶ。**
- * 呼び出し側で `claudeCodeUrl` を組み直すと、引数を1つ落とした側だけが
- * **開発リポジトリを載せない／ツールの段落を付けない**——「同じ先」が静かに割れる。
+ * 🔴 **AI 導線はこの1本を呼ぶ（`claudeCodeUrl` の呼び出しを写さない）。** 呼び出し側で
+ * 組み直すと、引数を1つ落とした側だけが**開発リポジトリを載せない／ツールの段落を
+ * 付けない**——「同じ先」が静かに割れる。指示文・slug の導出・URL の組み立ての3つを、
+ * ここと ASK_PROMPT / projectRepoSlug に閉じておく。
  *
  * `?? []` は必須——build.ts は fleet-status.json が無い案件で externalSources を持たない。
  * 第4引数は使っているツールの段落（#275・全導線に同じ段落を付ける）。
@@ -2477,22 +2477,11 @@ function repoNameOf(repoBaseUrl) {
     // owner だけの URL（github.com/owner）を名前と取り違えない
     return slug.includes("/") ? name : "";
 }
-/**
- * 図の下（「Claude Code で開く」の箱の直下）に出す注釈（#465）。
- *
- * 🔴 **社内の手続き（Slack のチャンネル名・宛先・申請文）は書かない。** 他社をテナントと
- * して入れる前提の画面に、クラスメソッド社内の申請の宛先を一律で出さない。
- * 🔴 **出し分けない。** Claude GitHub App が追加済みかは Cortex からは確かめられない
- * （追加先を一覧する API は組織オーナー権限か App 自身の資格が要る）。**判定できないものを
- * 出し分けると必ずどちらかで嘘になる**ので、1行を常に出す。
- */
-const CONN_MAP_NOTE = "Claude Code でこのリポジトリが選べないときは、あなたにこのリポジトリを見る GitHub の権限があるか、GitHub App「Claude」にこのリポジトリが追加されているかを、GitHub 組織の管理者に確かめてください";
 /**
  * 操作タブ最上部の接続マップを組み立てる（ビルド時。`<template id="conn-map">` に焼く）。
  *
- * 戻り値は **SVG の図＋その下の注釈 1 行（`<p class="conn-map-note">`）** で、
- * クライアント側（`renderConnMap`）は丸ごと clone して置くだけ。注釈を SVG の中に
- * 入れないのは、SVG の `<text>` が折り返せないため（CONN_MAP_NOTE の項）。
+ * 戻り値は **SVG の図 1 枚**で、クライアント側（`renderConnMap`）は丸ごと clone して
+ * 置くだけ。
  */
 function renderConnectionMap(site) {
     const internals = site.internalSources ?? [];
@@ -2638,7 +2627,7 @@ function renderConnectionMap(site) {
     // 案件の表示名へ落とす——名前の無い箱にしない。
     const repoName = repoNameOf(site.repoBaseUrl) || site.title;
     const repoLabel = repoName.length > 24 ? repoName.slice(0, 23) + "…" : repoName;
-    // 中央の箱のジオメトリ（下の「Claude Code で開く」もここから導く。数字を2度書かない）
+    // 中央の箱のジオメトリ（rect の座標をここから導く。数字を2度書かない）
     const REPO_LEFT = REPO_X - 170;
     const REPO_W = 340;
     const REPO_Y = 240;
@@ -2657,44 +2646,17 @@ function renderConnectionMap(site) {
         `<g class="cm-repo-logo" transform="translate(${startX.toFixed(1)}, ${266 - ICON / 2 - 1})">${GITHUB_ICON}</g>` +
         `<text class="cm-repo-label" x="${(startX + ICON + GAP).toFixed(1)}" y="272">${escapeHtml(repoLabel)}</text>` +
         `</g>`;
-    // ---- 「Claude Code で開く」（#465）------------------------------------------
-    // **図の流れを1本にする。** つないだツール → コンテキストリポジトリ →
-    // **それを読む Claude Code**。押す先はヘッダーの「AIに聞く」と同じ（askAiUrl）。
-    //
-    // 🔴 **線は実線・静止。** 点線＋流れ（.cm-link.cm-ok の animation）は「いまデータが
-    // 通っている経路」の合図として上の6本で使っている。ここは経路ではなく
-    // 「このリポジトリを Claude Code が読む」という関係なので、同じ記号を使うと嘘になる。
-    //
-    // 🔴 **クラス名に `cm-link` を使わない。** 図の線を数えるテスト（connection-map の
-    // linkStates・new-project-onboarding）が6本を前提にしており、派生名でも当たる。
-    //
-    // 🔴 **`data-ai-prompt` を付ける。** 接続状況が届いたときの貼り替え（syncAiLinks）の
-    // 対象に入る＝登録した開発リポジトリが当日から載る。ヘッダーと同じ先を保つ唯一の道。
-    const OPEN_Y = 336;
-    const OPEN_H = 46;
-    const openBox = `<path class="cm-open-line" d="M ${REPO_X} ${REPO_Y + REPO_H} L ${REPO_X} ${OPEN_Y}"></path>` +
-        `<a class="cm-open" href="${escapeHtml(askAiUrl(site))}" data-ai-prompt="${escapeHtml(ASK_PROMPT)}"` +
-        ` target="_blank" rel="noopener">` +
-        `<rect x="${REPO_LEFT}" y="${OPEN_Y}" width="${REPO_W}" height="${OPEN_H}" rx="12"></rect>` +
-        `<text class="cm-open-label" x="${REPO_X}" y="${OPEN_Y + 29}" text-anchor="middle">Claude Code で開く</text>` +
-        `</a>`;
-    // 🔴 **箱と線は cm-repo より前に連結する。** connection-map.test.mjs の repoNode() は
-    // 「cm-repo から文字列の末尾まで」を切って「図が外部から画像を読んでいないか」を見ており、
-    // 後ろに置くと href の https://claude.ai がその検査に当たる（描画順は重ならないので自由）。
-    //
-    // 注釈は **SVG の外の HTML 1行**（#465）。SVG の <text> は折り返せず、図は 760px まで
-    // 縮むので、中に入れると読めない大きさになる。**判定はしないので常に出す**——
-    // 「追加済みか」は API で確かめられない（組織オーナー権限か App 自身の資格が要る）。
-    return (`<svg class="cm-svg" viewBox="0 0 ${W} 402" xmlns="http://www.w3.org/2000/svg"` +
-        // 🔴 **role="img" にしない。** 中に本物のリンク（cm-open）が入ったので、
-        // 1枚の画像として名乗ると「キーボードでは押せるのに読み上げは何も言わない」になる
+    // 🔴 **図はリポジトリの箱で終わる。** 高さは箱の底（292）＋余白ぶんだけ取る
+    // ——余らせると、図の下に空白の帯が残る。
+    return (`<svg class="cm-svg" viewBox="0 0 ${W} 312" xmlns="http://www.w3.org/2000/svg"` +
+        // 🔴 **role="img" に戻さない。** 6つの能力のノードは role="link" tabindex="0" を
+        // 名乗っていて、押すと下の詳細カードへ飛ぶ。1枚の画像として名乗ると子孫が
+        // アクセシビリティツリーから落ち、**キーボードでは押せるのに読み上げは何も言わない**
         ` role="group" aria-label="データソースとの接続マップ">` +
         links.join("") +
         nodes.join("") +
-        openBox +
         repo +
-        `</svg>` +
-        `<p class="conn-map-note">${escapeHtml(CONN_MAP_NOTE)}</p>`);
+        `</svg>`);
 }
 /**
  * 「はじめに」セクション（Homeタブ下部）のチュートリアルデータをビルド時に生成する。
@@ -3635,22 +3597,6 @@ a.ds-name:hover { text-decoration: underline; }
 .cm-repo-label { font-size: 14px; font-weight: 700; fill: #1e3a8a; }
 /* GitHubロゴは fill="currentColor" なので、色は color で渡す（ラベルと同色に揃える） */
 .cm-repo-logo { color: #1e3a8a; }
-/* ---- 図の下の「Claude Code で開く」（#465）----
-   リポジトリの箱と同じ幅・同じ中心で、実線1本でつなぐ。**流れ（animation）は付けない**
-   ——動く点線は「いまデータが通っている」の合図で、ここは経路ではなく関係だから。 */
-/* a:hover の下線（HTML のリンクの規則）は SVG の中では二重の強調になるので外す
-   ——押せることは箱の塗り替えで見せている */
-.cm-open, .cm-open:hover { cursor: pointer; text-decoration: none; }
-.cm-open rect { fill: var(--surface); stroke: var(--accent); stroke-width: 1.5; }
-.cm-open:hover rect { fill: var(--accent-weak); }
-/* 🔴 **outline: none を書かない。** ここは本物のリンクで、キーボードだけで使う人が
-   「いまどこにいるか」を失う。枠を太らせる強調は、その上に重ねる */
-.cm-open:focus rect, .cm-open:focus-visible rect { fill: var(--accent-weak); stroke-width: 2.5; }
-.cm-open-label { font-size: 14px; font-weight: 700; fill: var(--accent); }
-.cm-open-line { fill: none; stroke: var(--accent); stroke-width: 1.6; }
-/* 注釈は図の外（HTML）。**横スクロールしても居残らせる**（.conn-map は overflow-x: auto で、
-   図は min-width 760px。左端に貼っておかないと、右へスクロールした人の視界から消える） */
-.conn-map-note { position: sticky; left: 0; color: var(--muted); font-size: 12.5px; line-height: 1.7; margin: 2px 0 0; }
 /* 未使用（非活性）行: アダプターとして存在するが、この案件では設定されていないもの */
 .ds-card.ds-inactive, .ds-pipe.ds-inactive { background: #f8f9fa; border-style: dashed; box-shadow: none; }
 .ds-inactive .ds-icon { filter: grayscale(1); opacity: .55; }
@@ -4832,11 +4778,10 @@ ${calendarAddUrl.toString()}
   // 届いたときに走るので、**画面が畳まれた後に届く**ことがある（テストの window.close()・
   // 実機のタブを閉じた直後）。掴んだノード越しなら、その後でも例外を投げずに済む
   // ——投げると応答の後段（取り直しの停止など）が丸ごと落ちる
-  // 🔴 **setAttribute で貼る（プロパティ代入にしない）。** 接続マップの中の
-  // 「Claude Code で開く」（#465）は SVG の a で、SVG の href は読み取り専用
-  // （SVGAnimatedString）——代入は例外も出さずに黙って無視され、**その箱だけが
-  // ビルド時の値のまま**（登録した開発リポジトリが載らない）になる。
-  // HTML の a では setAttribute と .href = は同じ結果になる。
+  // 🔴 **setAttribute で貼る（プロパティ代入にしない）。** HTML の a では
+  // 「.href = で代入」と同値なので、いまの画面ではどちらでも同じ結果になる。SVG の a では
+  // href が読み取り専用（SVGAnimatedString）で、**代入は例外も出さずに黙って無視される**
+  // ——図の中にリンクを置いても壊れない側に倒してある。
   function syncAiLinks() {
     var as = app.ownerDocument.querySelectorAll("a[data-ai-prompt]");
     for (var i = 0; i < as.length; i++) as[i].setAttribute("href", codeUrl(as[i].getAttribute("data-ai-prompt")));
@@ -12518,8 +12463,9 @@ ${calendarAddUrl.toString()}
 
   function renderOps() {
     renderConnMap();
-    // 追加申請の枠（#94）はここに出していたが、撤去した（#465）。
-    // 一手は図の下の「Claude Code で開く」と、その直下の注釈 1 行（CONN_MAP_NOTE）に集約。
+    // 追加申請の枠（#94）はここに出していたが、#465 で撤去した。その代わりに図の下へ
+    // 置いた箱と注釈も、#477 で撤去した。**この一手の案内は立ち上げ完了画面
+    // （ポータル）が持つ**——操作タブは繋がっているものを見せる場所に戻す。
     // 🔴 **先読みが飛行中なら、いま作った図を確認中へ倒す（#264）。**
     // 先読み（起動時の loadLiveFleet）は操作タブを開く前に走るので、
     // 確認中へ倒す口（loadLiveFleet の connMapConfirmingShown の1回）は
@@ -13078,11 +13024,11 @@ ${calendarAddUrl.toString()}
       if (target && target.scrollIntoView) target.scrollIntoView({ behavior: "smooth", block: "center" });
     }
     wrap.addEventListener("click", jumpToNode);
-    // 🔴 **キーボードでも押せるようにする（#465 の実装レビュー）。** 6つのノードは
-    // 前から role="link" tabindex="0" を名乗っているのに、押す手はクリックだけだった。
-    // 図の role を img から group に変えた（中に本物のリンクが入ったため）ので、
-    // **この瞬間からノードが支援技術に「リンク」として読み上げられる**——名乗っている
-    // 以上、Enter / Space で同じ場所へ飛べないと「押せないリンク」を配ることになる。
+    // 🔴 **キーボードでも押せるようにする（#465 の実装レビュー・#477 で維持）。**
+    // 6つのノードは role="link" tabindex="0" を名乗っており、図の role が group なので
+    // **支援技術に「リンク」として読み上げられる**——名乗っている以上、Enter / Space で
+    // 同じ場所へ飛べないと「押せないリンク」を配ることになる。図を role="img" へ戻すと
+    // その6つが読み上げから消えて、ここも無意味になるので、両方まとめて残してある。
     wrap.addEventListener("keydown", function (ev) {
       if (ev.key !== "Enter" && ev.key !== " " && ev.key !== "Spacebar") return;
       var g = ev.target && ev.target.closest ? ev.target.closest("[data-target]") : null;
@@ -13092,17 +13038,6 @@ ${calendarAddUrl.toString()}
       jumpToNode(ev);
     });
     app.appendChild(wrap);
-    // 🔴 **横にはみ出す図は、中央（リポジトリと「Claude Code で開く」の列）を出しておく。**
-    // 図は最小 760px で、狭い画面では左端＝いちばん左の能力の箱が出る。押す箱は中央に
-    // あるので、そのままだと**スクロールしないと見えない**。溢れていないときは 0 のまま
-    if (wrap.scrollWidth > wrap.clientWidth) {
-      wrap.scrollLeft = (wrap.scrollWidth - wrap.clientWidth) / 2;
-    }
-    // 🔴 **図の中の「Claude Code で開く」（#465）を、いまの値で貼り直す。**
-    // 図はビルド時に焼いてあるので、**起動時の貼り替え（syncAiLinks）はこの箱が
-    // まだ文書に無いときに終わっている**——ここで呼ばないと、仮置きのリポジトリを
-    // 持つ人や応答が届かない案件で、**この箱だけがヘッダーと違う先**を開く
-    syncAiLinks();
     updateConnMapAsOf();
     applyStateToConnMap();
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@takagaki/cortex-decisions-viewer",
-  "version": "0.12.43",
+  "version": "0.12.44",
   "description": "Cortexの意思決定記録（Decisions/*.md）を静的サイトにビルドして閲覧する。各レコードに「Edit on GitHub」リンクを付与する。",
   "license": "UNLICENSED",
   "private": false,