@cardenelabs/cdl 0.73.0 → 0.74.0

package/CHANGELOG.md

@@ -5,6 +5,43 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.74.0] - 2026-09-26
+
+### Changed
+
+- **縮めた絵の字の打ち消しに共通の上限の仕組みを置いた** (#886 / #889)
+
+  0.73.0 で連鎖の箱 (`shape-blockchain-block`) に入れた打ち消しを、絵が使い回せる形へ出した。
+
+  ```ts
+  打ち消しの倍率(倍率, [{ text, size, letterSpacing, 帯: { 幅, 高さ } }])
+  ```
+
+  絵が「その字が座る場所の広さ」 を渡し、上限を **幅と高さの両方から出して小さい方を採る**。
+  0.73.0 は高さ 2 本 (行の間隔 22 と見出しの帯 32) からしか出しておらず、中央揃えの看板の
+  ように幅が字数に比例して伸びる字を横へ出す形だった。
+
+  | 軸 | 8 割で止めるか | 理由 |
+  |---|---|---|
+  | 高さ | 止める | 帯の高さは次の行までの距離で、そのまま使うと上下が触れる |
+  | 幅 | 止めない | 絵が余白を引いた内側の幅を渡すので、8 割にすると字を切る予算より狭い所で止まる |
+
+  帯に収まっていない字がある絵では 1 を返す (打ち消すと確実に外へ出る)。
+  実測 = 判子の中の `印` は半径 8 の丸に収まる四角の 1 辺 11.3 を指定 10 の 1 字でほぼ
+  使い切っており、幅から出る上限が 1 を下回る。
+
+  連鎖の箱をこの仕組みに乗せ替えた。 幅の上限が加わったぶん、強く縮めた箱での打ち消しが
+  1.6 倍から 1.43 倍に下がる。 代わりに 240x220 と 400x400 の箱で 3 行目の値が切れなくなった
+  (小さい箱では切れたままで、そちらは #885 が持つ)。
+
+  **包みに印を付けた** (`data-cdl-art-fit`)。 `scale(` を持つ変換は絵の縮小だけではない =
+  `event` は目立たせるための脈動を `scale(0.78)` から `scale(1)` で描いており、
+  変換を正規表現で探す形だとその脈動まで絵の縮小として数える (実測で 16 件目に出た)。
+
+  打ち消した字にも印を付けた (`data-cdl-counter-scaled`)。
+  実物を描いて打ち消しが行き渡っていない種別を数える検査がこの印を読む。
+  残りの 14 種別を乗せるのは #887。
+
 ## [0.73.0] - 2026-09-26
 
 ### Fixed
@@ -3052,7 +3089,8 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.73.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.74.0...HEAD
+[0.74.0]: https://github.com/cardene777/cdl/compare/v0.73.0...v0.74.0
 [0.73.0]: https://github.com/cardene777/cdl/compare/v0.72.0...v0.73.0
 [0.72.0]: https://github.com/cardene777/cdl/compare/v0.71.0...v0.72.0
 [0.71.0]: https://github.com/cardene777/cdl/compare/v0.70.0...v0.71.0

package/dist/index.cjs

@@ -14610,7 +14610,38 @@ function fitArt(region, extent, art) {
   const dx = region.cx - s * \u7D75cx;
   const dy = region.cy - s * \u7D75cy;
   if (s >= 1 && dx === 0 && dy === 0) return \u7D44\u3080(1);
-  return /* @__PURE__ */ jsxRuntime.jsx("g", { transform: `translate(${dx} ${dy}) scale(${s})`, children: \u7D44\u3080(s) });
+  return (
+    /*
+     * 包みに印を付ける (#886)。 **`scale(` を持つ変換は他にもある** = `event` は目立たせる
+     * ための脈動を `scale(0.78)` から `scale(1)` で描き、絵を箱に収める縮小ではない。
+     * 祖先の変換を正規表現で見る形だと、その脈動まで「絵の縮小」 として数える。
+     */
+    /* @__PURE__ */ jsxRuntime.jsx("g", { "data-cdl-art-fit": "1", transform: `translate(${dx} ${dy}) scale(${s})`, children: \u7D44\u3080(s) })
+  );
+}
+var \u5E2F\u306E\u9AD8\u3055\u306B\u5BFE\u3059\u308B\u4E0A\u9650 = 0.8;
+function \u7D75\u306E\u4E2D\u306E\u5B57\u306E\u5E45(text, size, letterSpacing = 0) {
+  return Math.max(
+    displayWidth(text) * size * MONO_ADVANCE_RATIO,
+    textWidth(text, size, letterSpacing)
+  );
+}
+function \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(\u500D\u7387, \u5B57\u3089) {
+  const \u623B\u3057 = Number.isFinite(\u500D\u7387) && \u500D\u7387 > 0 ? 1 / \u500D\u7387 : 1;
+  let \u4E0A\u9650 = Number.POSITIVE_INFINITY;
+  for (const \u5B572 of \u5B57\u3089) {
+    if (!(Number.isFinite(\u5B572.size) && \u5B572.size > 0)) continue;
+    const { \u5E45, \u9AD8\u3055 } = \u5B572.\u5E2F;
+    if (Number.isFinite(\u9AD8\u3055) && \u9AD8\u3055 > 0) {
+      \u4E0A\u9650 = Math.min(\u4E0A\u9650, \u9AD8\u3055 * \u5E2F\u306E\u9AD8\u3055\u306B\u5BFE\u3059\u308B\u4E0A\u9650 / \u5B572.size);
+    }
+    const \u5B9F\u5E45 = \u7D75\u306E\u4E2D\u306E\u5B57\u306E\u5E45(\u5B572.text, \u5B572.size, \u5B572.letterSpacing ?? 0);
+    if (Number.isFinite(\u5E45) && \u5E45 > 0 && \u5B9F\u5E45 > 0) {
+      \u4E0A\u9650 = Math.min(\u4E0A\u9650, \u5E45 / \u5B9F\u5E45);
+    }
+  }
+  if (!Number.isFinite(\u4E0A\u9650)) return 1;
+  return Math.max(1, Math.min(\u623B\u3057, \u4E0A\u9650));
 }
 
 // src/render/tone.ts
@@ -29849,15 +29880,6 @@ var \u540D\u306E\u5B57 = 10.5;
 var \u5024\u306E\u5B57 = 11;
 var \u884C\u306E\u9593\u9694 = 22;
 var \u898B\u51FA\u3057\u306E\u5E2F = 32;
-var \u5E2F\u306B\u5BFE\u3059\u308B\u4E0A\u9650 = 0.8;
-function \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(k) {
-  const \u623B\u3057 = Number.isFinite(k) && k > 0 ? 1 / k : 1;
-  const \u4E0A\u9650 = Math.min(
-    \u884C\u306E\u9593\u9694 * \u5E2F\u306B\u5BFE\u3059\u308B\u4E0A\u9650 / \u5024\u306E\u5B57,
-    \u898B\u51FA\u3057\u306E\u5E2F * \u5E2F\u306B\u5BFE\u3059\u308B\u4E0A\u9650 / \u898B\u51FA\u3057\u306E\u5B57
-  );
-  return Math.max(1, Math.min(\u623B\u3057, \u4E0A\u9650));
-}
 var BLOCK_SHADOW = 6;
 var NFT_W = 220;
 var NFT_H = 240;
@@ -30004,7 +30026,7 @@ function ShapeSmartContractNode({ node, active, lang }) {
     bottomLabel2(node, r.cx, r.label)
   ] });
 }
-var \u5B57\u306E\u5E45 = (text, size) => Math.max(displayWidth(text) * size * MONO_ADVANCE_RATIO, textWidth(text, size));
+var \u5B57\u306E\u5E45 = (text, size) => \u7D75\u306E\u4E2D\u306E\u5B57\u306E\u5E45(text, size);
 var BLOCK_DEFAULT_FIELDS = [
   { key: "hash", label: "blockchainBlock.hash", value: { text: "0xaf31c9d2..." } },
   { key: "prev", label: "blockchainBlock.prev", value: { text: "0x7b3f92c1..." } },
@@ -30033,8 +30055,19 @@ function ShapeBlockchainBlockNode({ node, active, lang }) {
     };
   });
   const \u898B\u51FA\u3057\u306E\u5E45 = bw - 14 - 30;
+  const \u6253\u3061\u6D88\u3059\u5B57\u3089 = [
+    { text: \u898B\u51FA\u3057, size: \u898B\u51FA\u3057\u306E\u5B57, \u5E2F: { \u5E45: \u898B\u51FA\u3057\u306E\u5E45, \u9AD8\u3055: \u898B\u51FA\u3057\u306E\u5E2F } },
+    ...fields.flatMap((f) => [
+      { text: f.label, size: \u540D\u306E\u5B57, \u5E2F: { \u5E45: bw - 28, \u9AD8\u3055: \u884C\u306E\u9593\u9694 } },
+      {
+        text: f.value,
+        size: \u5024\u306E\u5B57,
+        \u5E2F: { \u5E45: bw - 28 - \u5B57\u306E\u5E45(f.label, \u540D\u306E\u5B57) - 8, \u9AD8\u3055: \u884C\u306E\u9593\u9694 }
+      }
+    ])
+  ];
   const art = (\u500D\u7387) => {
-    const \u500D = \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(\u500D\u7387);
+    const \u500D = \u6253\u3061\u6D88\u3057\u306E\u500D\u7387(\u500D\u7387, \u6253\u3061\u6D88\u3059\u5B57\u3089);
     const \u984C\u306E\u5927\u304D\u3055 = \u898B\u51FA\u3057\u306E\u5B57 * \u500D;
     const \u540D\u306E\u5927\u304D\u3055 = \u540D\u306E\u5B57 * \u500D;
     const \u5024\u306E\u5927\u304D\u3055 = \u5024\u306E\u5B57 * \u500D;
@@ -30042,11 +30075,11 @@ function ShapeBlockchainBlockNode({ node, active, lang }) {
       /* @__PURE__ */ jsxRuntime.jsx("rect", { x: x + 6, y: y + 6, width: bw, height: bh, rx: 8, fill: frame.stroke, opacity: 0.2, stroke: "none" }),
       /* @__PURE__ */ jsxRuntime.jsx("rect", { "data-cdl-role": "node-body", x, y, width: bw, height: bh, rx: 8, ...frame }),
       /* @__PURE__ */ jsxRuntime.jsx("path", { d: `M ${x} ${y + 32} L ${x} ${y + 8} Q ${x} ${y}, ${x + 8} ${y} L ${x + bw - 8} ${y} Q ${x + bw} ${y}, ${x + bw} ${y + 8} L ${x + bw} ${y + 32} Z`, fill: "var(--cdl-tone-accent, #2d6a8f)", fillOpacity: 0.9, stroke: "none" }),
-      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-role": "blockchain-block-title", x: x + 14, y: y + 22, fontSize: \u984C\u306E\u5927\u304D\u3055, fontWeight: 700, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fill: "#ffffff", children: \u5E45\u3067\u5207\u308B(\u898B\u51FA\u3057, \u984C\u306E\u5927\u304D\u3055, \u898B\u51FA\u3057\u306E\u5E45, \u5B57\u306E\u5E45) }),
+      /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-role": "blockchain-block-title", "data-cdl-counter-scaled": "1", x: x + 14, y: y + 22, fontSize: \u984C\u306E\u5927\u304D\u3055, fontWeight: 700, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fill: "#ffffff", children: \u5E45\u3067\u5207\u308B(\u898B\u51FA\u3057, \u984C\u306E\u5927\u304D\u3055, \u898B\u51FA\u3057\u306E\u5E45, \u5B57\u306E\u5E45) }),
       /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: x + bw - 16, cy: y + 16, r: 5.5, fill: "#7cd88f", stroke: "#ffffff", strokeWidth: 1.5 }),
       fields.map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("text", { x: x + 14, y: y + 54 + i * \u884C\u306E\u9593\u9694, fontSize: \u540D\u306E\u5927\u304D\u3055, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fill: "var(--cdl-text-dim, #5a6270)", children: f.label }),
-        /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-role": `blockchain-block-${f.key}`, x: x + bw - 14, y: y + 54 + i * \u884C\u306E\u9593\u9694, fontSize: \u5024\u306E\u5927\u304D\u3055, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fontWeight: 600, textAnchor: "end", fill: "var(--cdl-text, #1a1f2a)", children: \u5E45\u3067\u5207\u308B(f.value, \u5024\u306E\u5927\u304D\u3055, bw - 28 - \u5B57\u306E\u5E45(f.label, \u540D\u306E\u5927\u304D\u3055) - 8, \u5B57\u306E\u5E45) }),
+        /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-counter-scaled": "1", x: x + 14, y: y + 54 + i * \u884C\u306E\u9593\u9694, fontSize: \u540D\u306E\u5927\u304D\u3055, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fill: "var(--cdl-text-dim, #5a6270)", children: f.label }),
+        /* @__PURE__ */ jsxRuntime.jsx("text", { "data-cdl-role": `blockchain-block-${f.key}`, "data-cdl-counter-scaled": "1", x: x + bw - 14, y: y + 54 + i * \u884C\u306E\u9593\u9694, fontSize: \u5024\u306E\u5927\u304D\u3055, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fontWeight: 600, textAnchor: "end", fill: "var(--cdl-text, #1a1f2a)", children: \u5E45\u3067\u5207\u308B(f.value, \u5024\u306E\u5927\u304D\u3055, bw - 28 - \u5B57\u306E\u5E45(f.label, \u540D\u306E\u5927\u304D\u3055) - 8, \u5B57\u306E\u5E45) }),
         /* @__PURE__ */ jsxRuntime.jsx("line", { x1: x + 14, y1: y + 60 + i * \u884C\u306E\u9593\u9694, x2: x + bw - 14, y2: y + 60 + i * \u884C\u306E\u9593\u9694, stroke: "var(--cdl-divider, #d4d4d8)", strokeWidth: 0.5, opacity: 0.5 })
       ] }, i)),
       /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${cx - 32}, ${y + bh - 26})`, children: [