@cardenelabs/cdl 0.12.0 → 0.13.0

package/CHANGELOG.md

@@ -7,6 +7,39 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 予定 ... feedback を反映した patch / minor。
 
+## [0.13.0] - 2026-08-22
+
+### Added
+
+- **放射図の中心にも補足を渡せるようにした** (#530)
+
+  枝 (`MindBranchNode`) は元から `subtitle` を持つのに、中心だけ渡す口が無かった。 呼出側が
+  名前と補足を連結して `rootTitle` に入れるため 1 行に全部入り、箱幅 120px に対して 163px の
+  文字が切られていた。
+
+  `MindBranchPayload` に `rootSubtitle` を足し、枝と同じ経路で 2 行に積む。 分けて渡せば
+  1 行あたりが短くなり (`図を速くする` 90px / `300 ms 短縮` 60px)、同じ箱幅でも収まる。
+
+  **箱の大きさは変えない**。 配置の計算が箱幅から出ているため。
+
+## [0.12.1] - 2026-08-22
+
+### Fixed
+
+- **放射と木の箱で、名前が枠を超えて描かれるのを直した** (#526)
+
+  補足 (`subtitle`) が無い箱は行を積む処理を通らず、名前をそのまま描いていた。 その経路
+  だけが幅を見ておらず、長い名前が箱の外へ出て枝の線と重なる (実測 = 中心の箱で文字
+  163px に対し箱 120px)。
+
+  補足の有無に関わらず箱の幅に収める。 収まらない分は末尾に `…` を付けて切る = 切られた
+  ことが読み手に見える。
+
+  **箱の幅は変えない**。 配置の計算が箱幅から出ているため、広げると枝どうしの重なりと
+  canvas 超えの確認が要る。
+
+  同じ形は木 (`tree`) にも 2 箇所あり、併せて直した。
+
 ## [0.12.0] - 2026-08-21
 
 ### Added
@@ -498,7 +531,9 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.12.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.13.0...HEAD
+[0.13.0]: https://github.com/cardene777/cdl/compare/v0.12.1...v0.13.0
+[0.12.1]: https://github.com/cardene777/cdl/compare/v0.12.0...v0.12.1
 [0.12.0]: https://github.com/cardene777/cdl/compare/v0.11.0...v0.12.0
 [0.11.0]: https://github.com/cardene777/cdl/compare/v0.10.0...v0.11.0
 [0.10.0]: https://github.com/cardene777/cdl/compare/v0.9.0...v0.10.0

package/dist/index.cjs

@@ -15837,6 +15837,7 @@ function payloadTexts(node) {
   }
   if (node.mindData) {
     \u8DB3\u3059(node.mindData.rootTitle);
+    \u8DB3\u3059(node.mindData.rootSubtitle);
     for (const b of node.mindData.branches) {
       \u8DB3\u3059(b.title);
       \u8DB3\u3059(b.subtitle);
@@ -21275,9 +21276,10 @@ function resolveTreeData(nodes, values) {
   });
 }
 function resolveMindData(data, values) {
-  const \u8AAD\u3080 = data.rootTitle.includes("{") || data.branches.some((b) => b.title.includes("{") || (b.subtitle?.includes("{") ?? false));
+  const \u8AAD\u3080 = data.rootTitle.includes("{") || (data.rootSubtitle?.includes("{") ?? false) || data.branches.some((b) => b.title.includes("{") || (b.subtitle?.includes("{") ?? false));
   if (!\u8AAD\u3080) return data;
   const root = resolveBoundText(data.rootTitle, values);
+  const rootSubtitle = data.rootSubtitle === void 0 ? void 0 : resolveBoundText(data.rootSubtitle, values);
   const branches = data.branches.map((b) => {
     const title = resolveBoundText(b.title, values);
     const subtitle = b.subtitle === void 0 ? void 0 : resolveBoundText(b.subtitle, values);
@@ -21288,8 +21290,13 @@ function resolveMindData(data, values) {
     };
     return title.ok && (subtitle?.ok ?? true) ? \u89E3\u6C7A\u5F8C2 : { ...\u89E3\u6C7A\u5F8C2, unresolved: true };
   });
-  const \u89E3\u6C7A\u5F8C = { ...data, rootTitle: root.value, branches };
-  return root.ok ? \u89E3\u6C7A\u5F8C : { ...\u89E3\u6C7A\u5F8C, unresolved: true };
+  const \u89E3\u6C7A\u5F8C = {
+    ...data,
+    rootTitle: root.value,
+    ...rootSubtitle ? { rootSubtitle: rootSubtitle.value } : {},
+    branches
+  };
+  return root.ok && (rootSubtitle?.ok ?? true) ? \u89E3\u6C7A\u5F8C : { ...\u89E3\u6C7A\u5F8C, unresolved: true };
 }
 
 // src/kinds/draw-progress.ts
@@ -22000,17 +22007,20 @@ var \u884C\u9001\u308A\u306E\u6BD4 = 1.15;
 var \u5B57\u306E\u9AD8\u3055\u306E\u6BD4 = 0.72;
 var \u4E0A\u4E0B\u306E\u4F59\u767D = 2;
 var \u5DE6\u53F3\u306E\u4F59\u767D = 8;
-function \u5E45\u3067\u5207\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E45, \u6E2C\u308B = textWidth) {
-  if (\u4F7F\u3048\u308B\u5E45 <= 0) return "";
-  if (\u6E2C\u308B(text, fontSize) <= \u4F7F\u3048\u308B\u5E45) return text;
+function \u4F7F\u3048\u308B\u5E45(\u7BB1\u306E\u5E45) {
+  return \u7BB1\u306E\u5E45 - \u5DE6\u53F3\u306E\u4F59\u767D * 2;
+}
+function \u5E45\u3067\u5207\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E452, \u6E2C\u308B = textWidth) {
+  if (\u4F7F\u3048\u308B\u5E452 <= 0) return "";
+  if (\u6E2C\u308B(text, fontSize) <= \u4F7F\u3048\u308B\u5E452) return text;
   const \u7701\u7565 = "\u2026";
   const \u7701\u7565\u306E\u5E45 = \u6E2C\u308B(\u7701\u7565, fontSize);
-  if (\u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\u5E45) return "";
+  if (\u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\u5E452) return "";
   let \u51FA = "";
   let \u5E45 = 0;
   for (const c of \u66F8\u8A18\u7D20\u306B\u5206\u3051\u308B(text)) {
     const \u5B57\u306E\u5E452 = \u6E2C\u308B(c, fontSize);
-    if (\u5E45 + \u5B57\u306E\u5E452 + \u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\u5E45) break;
+    if (\u5E45 + \u5B57\u306E\u5E452 + \u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\u5E452) break;
     \u5E45 += \u5B57\u306E\u5E452;
     \u51FA += c;
   }
@@ -22028,13 +22038,13 @@ function \u7BB1\u306B\u7A4D\u3080(\u884C, \u7BB1\u306E\u5E45, \u7BB1\u306E\u9AD8
   const \u9AD8\u3055 = (rs) => rs.reduce((a, r) => a + r.fontSize * \u884C\u9001\u308A\u306E\u6BD4, 0);
   const \u6B8B\u3059 = [...\u5019\u88DC];
   while (\u6B8B\u3059.length > 1 && \u9AD8\u3055(\u6B8B\u3059) > \u4F7F\u3048\u308B\u9AD8\u3055) \u6B8B\u3059.pop();
-  const \u4F7F\u3048\u308B\u5E45 = \u7BB1\u306E\u5E45 - \u5DE6\u53F3\u306E\u4F59\u767D * 2;
+  const \u5E45 = \u4F7F\u3048\u308B\u5E45(\u7BB1\u306E\u5E45);
   const \u7DCF\u9AD8 = \u9AD8\u3055(\u6B8B\u3059);
   let \u7A4D\u307F = -\u7DCF\u9AD8 / 2;
   return \u6B8B\u3059.map((r) => {
     const dy = \u7A4D\u307F + (\u884C\u9001\u308A\u306E\u6BD4 + \u5B57\u306E\u9AD8\u3055\u306E\u6BD4) / 2 * r.fontSize;
     \u7A4D\u307F += r.fontSize * \u884C\u9001\u308A\u306E\u6BD4;
-    return { ...r, text: \u5E45\u3067\u5207\u308B(r.text, r.fontSize, \u4F7F\u3048\u308B\u5E45), dy };
+    return { ...r, text: \u5E45\u3067\u5207\u308B(r.text, r.fontSize, \u5E45), dy };
   });
 }
 var MIND_TONES = ["accent", "teal", "success", "warning", "info", "error"];
@@ -22131,17 +22141,22 @@ function MindMapNode({
             children: r.text
           },
           r.\u5F79\u5272
-        )) : /* @__PURE__ */ jsxRuntime.jsx(
-          "text",
-          {
-            x: n.x,
-            y: n.y + 5,
-            fontSize: n.isRoot ? 15 : 13,
-            fontWeight: n.isRoot ? 700 : 600,
-            textAnchor: "middle",
-            fill: \u6587\u5B57\u306E\u8272,
-            children: n.title
-          }
+        )) : (
+          // 補足が無くても **幅に収める** (#526)。 `箱に積む` を通らないこの経路だけが
+          // 幅を見ておらず、長い名前がそのまま箱の外へ出て枝の線と重なっていた
+          // (実測 = 中心の箱で文字 163px に対し箱 120px)
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "text",
+            {
+              x: n.x,
+              y: n.y + 5,
+              fontSize: n.isRoot ? 15 : 13,
+              fontWeight: n.isRoot ? 700 : 600,
+              textAnchor: "middle",
+              fill: \u6587\u5B57\u306E\u8272,
+              children: \u5E45\u3067\u5207\u308B(n.title, n.isRoot ? 15 : 13, \u4F7F\u3048\u308B\u5E45(n.w))
+            }
+          )
         )
       ] }, `n-${n.id}`);
     })
@@ -22155,6 +22170,8 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
   nodes.push({
     id: mindData.rootId,
     title: mindData.rootTitle,
+    // 中心も枝と同じく 2 行に積める (#530)。 高さ 52 に 15px + 9px の 2 行が入る
+    ...mindData.rootSubtitle === void 0 ? {} : { subtitle: mindData.rootSubtitle },
     x: cx,
     y: cy,
     w: rootW,
@@ -22757,17 +22774,21 @@ function TreeNode({
               \u7BB1\u306E\u9AD8\u3055: n.h,
               fill: "var(--cdl-text-on-tone, #ffffff)",
               \u540D\u524D\u306E\u592A\u3055: 700
-            }) : /* @__PURE__ */ jsxRuntime.jsx(
-              "text",
-              {
-                x: n.w / 2,
-                y: n.h / 2 + 5,
-                fontSize: 13,
-                fontWeight: 700,
-                textAnchor: "middle",
-                fill: "var(--cdl-text-on-tone, #ffffff)",
-                children: n.title
-              }
+            }) : (
+              // 補足が無くても幅に収める (#526)。 `箱の文字` を通らないこの経路だけが
+              // 幅を見ておらず、長い名前が箱の外へ出ていた
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "text",
+                {
+                  x: n.w / 2,
+                  y: n.h / 2 + 5,
+                  fontSize: 13,
+                  fontWeight: 700,
+                  textAnchor: "middle",
+                  fill: "var(--cdl-text-on-tone, #ffffff)",
+                  children: \u5E45\u3067\u5207\u308B(n.title, 13, \u4F7F\u3048\u308B\u5E45(n.w))
+                }
+              )
             )
           ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -22800,7 +22821,7 @@ function TreeNode({
                 fontWeight: 600,
                 textAnchor: "middle",
                 fill: "var(--cdl-chip-text, #1a1f2a)",
-                children: n.title
+                children: \u5E45\u3067\u5207\u308B(n.title, 12, \u4F7F\u3048\u308B\u5E45(n.w))
               }
             )
           ] })
@@ -28391,6 +28412,7 @@ function mindMap(preset) {
         mindData: {
           rootId: preset.rootId,
           rootTitle: preset.rootTitle,
+          ...preset.rootSubtitle === void 0 ? {} : { rootSubtitle: preset.rootSubtitle },
           branches: branches.map((br) => ({
             id: br.id,
             title: br.title,