@cardenelabs/cdl 0.12.1 → 0.13.1

package/dist/react.d.cts

@@ -1,2 +1,2 @@
 import 'react';
-export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-C7FKvMqq.cjs';
+export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-B5JHcUrb.cjs';

package/dist/react.d.ts

@@ -1,2 +1,2 @@
 import 'react';
-export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-C7FKvMqq.js';
+export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-B5JHcUrb.js';

package/dist/react.js

@@ -4857,6 +4857,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);
@@ -5567,10 +5568,10 @@ function fitTextSize(text, maxWidth, targetSize, minSize) {
 }
 var COMPACT_MAX_H = 100;
 var COMPACT_PADDING_X = 16;
-var MIN_SIZE = 11;
+var MIN_TEXT_SIZE = 11;
 var ASCENT = 0.72;
 var DESCENT = 0.25;
-var MIN_BAND_H = MIN_SIZE * (ASCENT + DESCENT);
+var MIN_BAND_H = MIN_TEXT_SIZE * (ASCENT + DESCENT);
 var EYEBROW_BASELINE = 38;
 var EYEBROW_SIZE = 18;
 var EYEBROW_GAP = 8;
@@ -5592,10 +5593,10 @@ function titlePlacement(node, \u901A\u5E38, opts = {}) {
     node.title,
     Math.max(0, node.w - COMPACT_PADDING_X),
     \u901A\u5E38.size,
-    MIN_SIZE
+    MIN_TEXT_SIZE
   );
   const \u5E2F\u3067 = Math.floor(\u5E2F / (ASCENT + DESCENT));
-  const size = Math.max(MIN_SIZE, Math.min(\u5E45\u3067, \u5E2F\u3067));
+  const size = Math.max(MIN_TEXT_SIZE, Math.min(\u5E45\u3067, \u5E2F\u3067));
   const \u5B57\u9AD8 = size * (ASCENT + DESCENT);
   const y = \u5B57\u9AD8 <= \u5E2F ? \u4E0A + \u5E2F / 2 + size * (ASCENT - DESCENT) / 2 : \u4E0A > 0 ? \u4E0A + size * ASCENT : (\u9AD8\u3055 - \u5B57\u9AD8) / 2 + size * ASCENT;
   return { x: node.w / 2, y, size, anchor: "middle" };
@@ -6575,9 +6576,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);
@@ -6588,8 +6590,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
@@ -7319,6 +7326,12 @@ function \u5E45\u3067\u5207\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E452, \u6
   }
   return `${\u51FA}${\u7701\u7565}`;
 }
+var \u7E2E\u3081\u306E\u4E0B\u9650 = MIN_TEXT_SIZE;
+function \u5E45\u306B\u53CE\u3081\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E452, \u6E2C\u308B = textWidth) {
+  let size = fontSize;
+  while (size > \u7E2E\u3081\u306E\u4E0B\u9650 && \u6E2C\u308B(text, size) > \u4F7F\u3048\u308B\u5E452) size -= 1;
+  return { text: \u5E45\u3067\u5207\u308B(text, size, \u4F7F\u3048\u308B\u5E452, \u6E2C\u308B), fontSize: size };
+}
 function \u66F8\u8A18\u7D20\u306B\u5206\u3051\u308B(text) {
   const \u533A\u5207\u308A = Intl.Segmenter;
   if (typeof \u533A\u5207\u308A !== "function") return [...text];
@@ -7332,12 +7345,13 @@ function \u7BB1\u306B\u7A4D\u3080(\u884C, \u7BB1\u306E\u5E45, \u7BB1\u306E\u9AD8
   const \u6B8B\u3059 = [...\u5019\u88DC];
   while (\u6B8B\u3059.length > 1 && \u9AD8\u3055(\u6B8B\u3059) > \u4F7F\u3048\u308B\u9AD8\u3055) \u6B8B\u3059.pop();
   const \u5E45 = \u4F7F\u3048\u308B\u5E45(\u7BB1\u306E\u5E45);
-  const \u7DCF\u9AD8 = \u9AD8\u3055(\u6B8B\u3059);
+  const \u53CE\u3081\u305F = \u6B8B\u3059.map((r) => ({ ...r, ...\u5E45\u306B\u53CE\u3081\u308B(r.text, r.fontSize, \u5E45) }));
+  const \u7DCF\u9AD8 = \u9AD8\u3055(\u53CE\u3081\u305F);
   let \u7A4D\u307F = -\u7DCF\u9AD8 / 2;
-  return \u6B8B\u3059.map((r) => {
+  return \u53CE\u3081\u305F.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, \u5E45), dy };
+    return { ...r, dy };
   });
 }
 var MIND_TONES = ["accent", "teal", "success", "warning", "info", "error"];
@@ -7405,6 +7419,7 @@ function MindMapNode({
         n.h
       );
       const \u88DC\u8DB3\u3042\u308A = (n.subtitle ?? "").trim() !== "";
+      const \u53CE\u3081\u305F\u540D\u524D = \u88DC\u8DB3\u3042\u308A ? void 0 : \u5E45\u306B\u53CE\u3081\u308B(n.title, n.isRoot ? 15 : 13, \u4F7F\u3048\u308B\u5E45(n.w));
       const \u6587\u5B57\u306E\u8272 = n.isRoot ? "var(--cdl-text-on-tone, #ffffff)" : "var(--cdl-chip-text, #1a1f2a)";
       return /* @__PURE__ */ jsxs("g", { "data-cdl-unresolved": n.unresolved ? "true" : void 0, children: [
         /* @__PURE__ */ jsx(
@@ -7420,7 +7435,7 @@ function MindMapNode({
             strokeWidth: n.isRoot ? 2 : 1.75
           }
         ),
-        \u88DC\u8DB3\u3042\u308A ? \u884C.map((r) => /* @__PURE__ */ jsx(
+        \u53CE\u3081\u305F\u540D\u524D === void 0 ? \u884C.map((r) => /* @__PURE__ */ jsx(
           "text",
           {
             "data-cdl-role": r.\u5F79\u5272 === "subtitle" ? "mind-node-subtitle" : void 0,
@@ -7437,17 +7452,18 @@ function MindMapNode({
         )) : (
           // 補足が無くても **幅に収める** (#526)。 `箱に積む` を通らないこの経路だけが
           // 幅を見ておらず、長い名前がそのまま箱の外へ出て枝の線と重なっていた
-          // (実測 = 中心の箱で文字 163px に対し箱 120px)
+          // (実測 = 中心の箱で文字 163px に対し箱 120px)。
+          // 収める手段は縮めるのが先で、切るのは下限まで縮めても入らない時だけ (#534)
           /* @__PURE__ */ jsx(
             "text",
             {
               x: n.x,
               y: n.y + 5,
-              fontSize: n.isRoot ? 15 : 13,
+              fontSize: \u53CE\u3081\u305F\u540D\u524D.fontSize,
               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))
+              children: \u53CE\u3081\u305F\u540D\u524D.text
             }
           )
         )
@@ -7463,6 +7479,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,
@@ -8041,6 +8059,7 @@ function TreeNode({
         n.h
       );
       const \u88DC\u8DB3\u3042\u308A = (n.subtitle ?? "").trim() !== "";
+      const \u53CE\u3081\u305F\u540D\u524D = \u88DC\u8DB3\u3042\u308A ? void 0 : \u5E45\u306B\u53CE\u3081\u308B(n.title, isRoot ? 13 : 12, \u4F7F\u3048\u308B\u5E45(n.w));
       return /* @__PURE__ */ jsx(
         "g",
         {
@@ -8059,7 +8078,7 @@ function TreeNode({
                 fill: `url(#${gradientId})`
               }
             ),
-            \u88DC\u8DB3\u3042\u308A ? \u7BB1\u306E\u6587\u5B57({
+            \u53CE\u3081\u305F\u540D\u524D === void 0 ? \u7BB1\u306E\u6587\u5B57({
               \u884C,
               x: n.w / 2,
               \u7BB1\u306E\u9AD8\u3055: n.h,
@@ -8073,11 +8092,11 @@ function TreeNode({
                 {
                   x: n.w / 2,
                   y: n.h / 2 + 5,
-                  fontSize: 13,
+                  fontSize: \u53CE\u3081\u305F\u540D\u524D.fontSize,
                   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))
+                  children: \u53CE\u3081\u305F\u540D\u524D.text
                 }
               )
             )
@@ -8097,7 +8116,7 @@ function TreeNode({
               }
             ),
             /* @__PURE__ */ jsx("rect", { x: 0, y: 0, width: 4, height: n.h, rx: 2, fill: accent }),
-            \u88DC\u8DB3\u3042\u308A ? \u7BB1\u306E\u6587\u5B57({
+            \u53CE\u3081\u305F\u540D\u524D === void 0 ? \u7BB1\u306E\u6587\u5B57({
               \u884C,
               x: n.w / 2 + 2,
               \u7BB1\u306E\u9AD8\u3055: n.h,
@@ -8108,11 +8127,11 @@ function TreeNode({
               {
                 x: n.w / 2 + 2,
                 y: n.h / 2 + 4,
-                fontSize: 12,
+                fontSize: \u53CE\u3081\u305F\u540D\u524D.fontSize,
                 fontWeight: 600,
                 textAnchor: "middle",
                 fill: "var(--cdl-chip-text, #1a1f2a)",
-                children: \u5E45\u3067\u5207\u308B(n.title, 12, \u4F7F\u3048\u308B\u5E45(n.w))
+                children: \u53CE\u3081\u305F\u540D\u524D.text
               }
             )
           ] })
@@ -9998,15 +10017,15 @@ var externalLabel = (node, cx, bottomY) => /* @__PURE__ */ jsxs(Fragment, { chil
   )
 ] });
 var LABEL_EYEBROW_SPACING = 2;
-function \u5E45\u306B\u53CE\u3081\u308B(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
+function \u5E45\u306B\u53CE\u3081\u308B2(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
   const \u5E45 = textWidth(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593);
   const \u500D\u7387 = \u5E45 > 0 && \u7BB1\u5E45 > 0 ? Math.min(1, \u7BB1\u5E45 / \u5E45) : 1;
   return { size: \u5927\u304D\u3055 * \u500D\u7387, spacing: \u5B57\u9593 * \u500D\u7387 };
 }
 function bottomLabel(node, cx, plan) {
-  const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING, node.w);
-  const \u540D = \u5E45\u306B\u53CE\u3081\u308B(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
-  const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
+  const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B2(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING, node.w);
+  const \u540D = \u5E45\u306B\u53CE\u3081\u308B2(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
+  const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B2(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     node.eyebrow && plan.\u80A9\u66F8 && /* @__PURE__ */ jsx("text", { x: cx, y: plan.\u80A9\u66F8.y, fontSize: \u80A9.size, fontWeight: 700, letterSpacing: \u80A9.spacing, textAnchor: "middle", fill: "var(--cdl-tone-accent, #2d6a8f)", children: node.eyebrow }),
     /* @__PURE__ */ jsx("text", { "data-cdl-role": "node-label", x: cx, y: plan.\u540D\u524D.y, fontSize: \u540D.size, fontWeight: 700, textAnchor: "middle", fill: "var(--cdl-text, #1a1f2a)", children: node.title }),
@@ -11323,15 +11342,15 @@ function \u5B57\u5E45(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593) {
   }
   return \u5E45 + \u5B57\u9593 * \u5B57\u6570;
 }
-function \u5E45\u306B\u53CE\u3081\u308B2(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
+function \u5E45\u306B\u53CE\u3081\u308B3(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
   const \u5E45 = \u5B57\u5E45(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593);
   const \u500D\u7387 = \u5E45 > 0 && \u7BB1\u5E45 > 0 ? Math.min(1, \u7BB1\u5E45 / \u5E45) : 1;
   return { size: \u5927\u304D\u3055 * \u500D\u7387, spacing: \u5B57\u9593 * \u500D\u7387 };
 }
 function bottomLabel3(node, cx, plan) {
-  const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B2(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING2, node.w);
-  const \u540D = \u5E45\u306B\u53CE\u3081\u308B2(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
-  const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B2(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
+  const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B3(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING2, node.w);
+  const \u540D = \u5E45\u306B\u53CE\u3081\u308B3(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
+  const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B3(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     node.eyebrow && plan.\u80A9\u66F8 && /* @__PURE__ */ jsx("text", { x: cx, y: plan.\u80A9\u66F8.y, fontSize: \u80A9.size, fontWeight: 700, letterSpacing: \u80A9.spacing, textAnchor: "middle", fill: "var(--cdl-tone-accent, #2d6a8f)", children: node.eyebrow }),
     /* @__PURE__ */ jsx("text", { "data-cdl-role": "node-label", x: cx, y: plan.\u540D\u524D.y, fontSize: \u540D.size, fontWeight: 700, textAnchor: "middle", fill: "var(--cdl-text, #1a1f2a)", children: node.title }),
@@ -11772,15 +11791,15 @@ function \u5B57\u5E452(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593) {
   }
   return \u5E45 + \u5B57\u9593 * \u5B57\u6570;
 }
-function \u5E45\u306B\u53CE\u3081\u308B3(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
+function \u5E45\u306B\u53CE\u3081\u308B4(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
   const \u5E45 = \u5B57\u5E452(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593);
   const \u500D\u7387 = \u5E45 > 0 && \u7BB1\u5E45 > 0 ? Math.min(1, \u7BB1\u5E45 / \u5E45) : 1;
   return { size: \u5927\u304D\u3055 * \u500D\u7387, spacing: \u5B57\u9593 * \u500D\u7387 };
 }
 function bottomLabel4(node, cx, plan) {
-  const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B3(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING3, node.w);
-  const \u540D = \u5E45\u306B\u53CE\u3081\u308B3(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
-  const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B3(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
+  const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B4(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING3, node.w);
+  const \u540D = \u5E45\u306B\u53CE\u3081\u308B4(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
+  const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B4(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     node.eyebrow && plan.\u80A9\u66F8 && /* @__PURE__ */ jsx("text", { x: cx, y: plan.\u80A9\u66F8.y, fontSize: \u80A9.size, fontWeight: 700, letterSpacing: \u80A9.spacing, textAnchor: "middle", fill: "var(--cdl-tone-accent, #2d6a8f)", children: node.eyebrow }),
     /* @__PURE__ */ jsx("text", { "data-cdl-role": "node-label", x: cx, y: plan.\u540D\u524D.y, fontSize: \u540D.size, fontWeight: 700, textAnchor: "middle", fill: "var(--cdl-text, #1a1f2a)", children: node.title }),