@takagaki/cortex-decisions-viewer 0.12.150 → 0.12.152

package/dist/render.js

@@ -4972,6 +4972,19 @@ button.site-icon[aria-busy="true"] .site-icon-plus { opacity: 0; }
 .card-facet-yomi { font-size: 11.5px; }
 .card-titlerow { display: flex; align-items: baseline; gap: 12px; margin: 0 0 6px; }
 .card-titlerow .card-title { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; margin: 2px 0 0; }
+/* 関係者のアイコン（行の右端・一覧と各ページで同じ見た目。名前は他の区画と同じく左詰め）。portal.id がある人はポータルの人のページへのリンク */
+.card-namerow { display: flex; align-items: center; gap: 10px; margin: 2px 0 6px; }
+.card-namerow .card-title { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; margin: 0; }
+.card-titlerow .mface { align-self: center; margin-left: auto; }
+.card-namerow .mface, .detail-namerow .mface { margin-left: auto; }
+.detail-namerow { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; }
+.detail-namerow .detail-title { margin: 0; min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
+.mface { position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; overflow: hidden; background: var(--border, #e5e7eb); color: var(--muted, #6b7280); font-size: 13px; font-weight: 700; line-height: 1; text-decoration: none; box-sizing: border-box; }
+a.mface:hover { box-shadow: 0 0 0 2px var(--accent, #4f46e5); }
+.mface svg { width: 18px; height: 18px; display: block; }
+.mface img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
+.detail-namerow .mface { width: 36px; height: 36px; font-size: 16px; }
+.detail-namerow .mface svg { width: 22px; height: 22px; }
 /* card-title はカードの見出し（#1 新しいタブでも開けるよう <a> にした）。見た目は元の <div> と揃える */
 .card-title { display: block; font-size: 16px; font-weight: 650; margin: 2px 0 6px; color: var(--text); }
 .card-summary { color: #3b424c; font-size: 14px; margin: 0; }
@@ -7595,6 +7608,105 @@ ${story_1.splitByNameLinks.toString()}
     var id = ask && ask.subject && ask.subject.userId;
     return typeof id === "string" && /^[0-9A-Za-z_-]{1,64}$/.test(id) ? PORTAL_ORIGIN + "/people/" + encodeURIComponent(id) : null;
   }
+  // ---------- 関係者のアイコン（行の右端・cortex-engine #1775） ----------
+  //
+  // 🔴 **正は記録の frontmatter の portal.id**（V4 の boundIds の重なりで人を探さない）。portal の欄が無い・形が違う人は
+  //    人型のデフォルト（押せない）。portal.id がある人は「頭文字の丸」を押せるリンクで出し、ポータルの人のページへ行く。
+  // 🔴 **画像の URL は配布物に焼かない。** 画面に出ている人の portal.id を集めて intake の member-faces を 1 回呼び
+  //    （失敗は覚えない）、返った相対パスを PORTAL_ORIGIN につないで img にする。取れない・読み込めないときは頭文字のまま。
+  // 🔴 portal の欄の中身（email を持つ）は画面に生で出さない（アイコンとリンクにだけ使う・member.no-email）。
+  // 🔴 値は全部 textContent / setAttribute で入れる。img は alt=""（名前は横に出ている）・no-referrer・lazy。
+  var MF_ID = /^[0-9A-Za-z_-]{1,64}$/;
+  var MF_AVATAR = /^\\/icons\\/u\\/[0-9A-Za-z_-]+\\.(?:jpg|jpeg|png|webp|gif)$/;
+  /** 記録の portal.id（形が違えば空文字） */
+  function mfPortalId(rec) {
+    var p = rec && rec.fm ? rec.fm.portal : null;
+    var id = p && typeof p === "object" && !Array.isArray(p) ? p.id : "";
+    return typeof id === "string" && MF_ID.test(id) ? id : "";
+  }
+  /** 取れた画像の相対パス（userId -> パス）・もう頼んだ人・まだ待っている子 */
+  var mfFaces = {};
+  var mfAsked = {};
+  var mfWaiting = [];
+  var mfTimer = null;
+  function mfAttach(box, path) {
+    if (!box.isConnected && !box.parentNode) return;
+    var img = document.createElement("img");
+    img.setAttribute("alt", "");
+    img.setAttribute("referrerpolicy", "no-referrer");
+    img.setAttribute("loading", "lazy");
+    img.addEventListener("error", function () { if (img.parentNode) img.parentNode.removeChild(img); });
+    img.setAttribute("src", PORTAL_ORIGIN + path);
+    box.appendChild(img);
+  }
+  function mfFlush() {
+    mfTimer = null;
+    var waiting = mfWaiting;
+    mfWaiting = [];
+    if (!waiting.length || !SITE.intake || !actorTicket()) return;
+    var ids = [];
+    waiting.forEach(function (w) {
+      if (Object.prototype.hasOwnProperty.call(mfFaces, w.id)) { if (mfFaces[w.id]) mfAttach(w.box, mfFaces[w.id]); return; }
+      if (!Object.prototype.hasOwnProperty.call(mfAsked, w.id) && ids.indexOf(w.id) < 0 && ids.length < 200) ids.push(w.id);
+    });
+    if (!ids.length) return;
+    ids.forEach(function (id) { mfAsked[id] = 1; });
+    var give = function (j) {
+      (j.people || []).forEach(function (one) {
+        if (one && typeof one.userId === "string" && typeof one.avatarUrl === "string" && MF_AVATAR.test(one.avatarUrl)) mfFaces[one.userId] = one.avatarUrl;
+      });
+      ids.forEach(function (id) { if (!Object.prototype.hasOwnProperty.call(mfFaces, id)) mfFaces[id] = null; });
+      waiting.forEach(function (w) { if (mfFaces[w.id]) mfAttach(w.box, mfFaces[w.id]); });
+    };
+    var forget = function () { ids.forEach(function (id) { delete mfAsked[id]; }); };
+    intakeJson(callIntake("member-faces", { op: "member-faces", userIds: ids })).then(function (res) {
+      var j = (res && res.j) || {};
+      if (res && res.ok && j.ok === true && Array.isArray(j.people)) give(j);
+      else forget();
+    }, forget);
+  }
+  function mfWant(id, box) {
+    mfWaiting.push({ id: id, box: box });
+    if (!mfTimer) mfTimer = setTimeout(mfFlush, 0);
+  }
+  var SVG_NS = "http://www.w3.org/2000/svg";
+  /** 人型のデフォルト（インライン SVG・はてなは使わない） */
+  function mfDefaultSvg() {
+    var svg = document.createElementNS(SVG_NS, "svg");
+    svg.setAttribute("viewBox", "0 0 24 24");
+    svg.setAttribute("aria-hidden", "true");
+    svg.setAttribute("focusable", "false");
+    var c = document.createElementNS(SVG_NS, "circle");
+    c.setAttribute("cx", "12"); c.setAttribute("cy", "8"); c.setAttribute("r", "4"); c.setAttribute("fill", "currentColor");
+    var b = document.createElementNS(SVG_NS, "path");
+    b.setAttribute("d", "M4 21c0-4.4 3.6-7 8-7s8 2.6 8 7z"); b.setAttribute("fill", "currentColor");
+    svg.appendChild(c);
+    svg.appendChild(b);
+    return svg;
+  }
+  /** 関係者 1 人のアイコン。一覧のカードも詳細も、この 1 つの関数で組む */
+  function mfAvatar(rec) {
+    var id = mfPortalId(rec);
+    if (!id) {
+      var plain = el("span", { class: "mface mface-default", "data-face": "default" });
+      plain.appendChild(mfDefaultSvg());
+      return plain;
+    }
+    var name = Array.from(humanTitle(rec.title))[0] || "";
+    var a = el("a", {
+      class: "mface mface-portal",
+      "data-face": "portal",
+      href: PORTAL_ORIGIN + "/people/" + encodeURIComponent(id),
+      target: "_blank",
+      rel: "noopener",
+      title: "ポータルでこの人のページを開く",
+    });
+    a.appendChild(el("span", { class: "mface-initial", text: name }));
+    // 行ごと（カード・詳細）の click に伝えない（カードを押した扱いで詳細へ移らない）
+    a.addEventListener("click", function (ev) { ev.stopPropagation(); });
+    mfWant(id, a);
+    return a;
+  }
   /**
    * 断られたときの 1 行（code ごとに一手）。**帯は症状・行は一手・繰り返さない。**
    * final: 押し直しても同じ答えになる（ボタンを畳む）／false: 時間をおけば通りうる（ボタンを残す）
@@ -8005,7 +8117,7 @@ ${story_1.splitByNameLinks.toString()}
   }
 
   /** 一覧カードの頭（上の段 + 題）を組む。左側の中身（札・日付・エラーの札）が 1 つも無いときは
-   * 空の .card-meta を作らず、「🕸 つながり」を題の行の右端に置く（#1094）。 */
+   * 空の .card-meta を作らず、題の行に「🕸 つながり」を置く（#1094）。関係者のアイコンはどちらの経路でも行の最後（右端）。 */
   function cardHead(rec, leftNodes, titleExtra) {
     var trace = el("a", { class: "mc-trace", href: "?tab=graph", text: "🕸 つながり" });
     trace.addEventListener("click", function (ev) { ev.preventDefault(); ev.stopPropagation(); openExplorerFor(rec); });
@@ -8013,9 +8125,11 @@ ${story_1.splitByNameLinks.toString()}
     var eb = fmErrorBadge(rec);
     if (eb) meta.appendChild(eb);
     var title = cardTitleLink(rec, titleExtra);
-    if (!meta.childNodes.length) return [el("div", { class: "card-titlerow" }, [title, trace])];
+    // 関係者は行の右端にアイコン（詳細と同じ mfAvatar・名前は左詰め）
+    var face = isMemberRec(rec) ? mfAvatar(rec) : null;
+    if (!meta.childNodes.length) return [el("div", { class: "card-titlerow" }, [title, trace, face])];
     meta.appendChild(trace);
-    return [meta, title];
+    return [meta, face ? el("div", { class: "card-namerow" }, [title, face]) : title];
   }
 
   /**
@@ -20131,7 +20245,10 @@ ${story_1.splitByNameLinks.toString()}
     if (detailPagerG) app.appendChild(detailPagerG);
 
     var head = el("div", { class: "detail-head" });
-    head.appendChild(el("div", {}, [ el("h1", { class: "detail-title", text: humanTitle(r.title) }) ]));
+    var titleH1 = el("h1", { class: "detail-title", text: humanTitle(r.title) });
+    head.appendChild(isMemberRec(r)
+      ? el("div", { class: "detail-namerow" }, [ titleH1, mfAvatar(r) ])
+      : el("div", {}, [ titleH1 ]));
     var traceBtn2 = el("a", { class: "trace-btn", href: "?tab=graph", text: "🕸 つながり" });
     traceBtn2.addEventListener("click", function (ev) { ev.preventDefault(); openExplorerFor(r); });
     var editRowR = el("div", { class: "detail-actions-row" });
@@ -21472,6 +21589,8 @@ ${story_1.splitByNameLinks.toString()}
     panel.appendChild(el("summary", { class: "fm-title", text: "レコード情報（frontmatter）" }));
     var grid = el("div", { class: "fm-grid" });
     Object.keys(fm).forEach(function (k) {
+      // 🔴 portal（中にポータルのアカウントのメールを持つ）は生で出さない。アイコンとリンクにだけ使う（member.no-email）
+      if (k === "portal") return;
       grid.appendChild(el("div", { class: "fm-key", text: k }));
       var cell = el("div", { class: "fm-val" });
       var v = fm[k];

package/package.json

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