@cardenelabs/cdl 0.12.1 → 0.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/react.cjs CHANGED
@@ -4859,6 +4859,7 @@ function payloadTexts(node) {
4859
4859
  }
4860
4860
  if (node.mindData) {
4861
4861
  \u8DB3\u3059(node.mindData.rootTitle);
4862
+ \u8DB3\u3059(node.mindData.rootSubtitle);
4862
4863
  for (const b of node.mindData.branches) {
4863
4864
  \u8DB3\u3059(b.title);
4864
4865
  \u8DB3\u3059(b.subtitle);
@@ -5569,10 +5570,10 @@ function fitTextSize(text, maxWidth, targetSize, minSize) {
5569
5570
  }
5570
5571
  var COMPACT_MAX_H = 100;
5571
5572
  var COMPACT_PADDING_X = 16;
5572
- var MIN_SIZE = 11;
5573
+ var MIN_TEXT_SIZE = 11;
5573
5574
  var ASCENT = 0.72;
5574
5575
  var DESCENT = 0.25;
5575
- var MIN_BAND_H = MIN_SIZE * (ASCENT + DESCENT);
5576
+ var MIN_BAND_H = MIN_TEXT_SIZE * (ASCENT + DESCENT);
5576
5577
  var EYEBROW_BASELINE = 38;
5577
5578
  var EYEBROW_SIZE = 18;
5578
5579
  var EYEBROW_GAP = 8;
@@ -5594,10 +5595,10 @@ function titlePlacement(node, \u901A\u5E38, opts = {}) {
5594
5595
  node.title,
5595
5596
  Math.max(0, node.w - COMPACT_PADDING_X),
5596
5597
  \u901A\u5E38.size,
5597
- MIN_SIZE
5598
+ MIN_TEXT_SIZE
5598
5599
  );
5599
5600
  const \u5E2F\u3067 = Math.floor(\u5E2F / (ASCENT + DESCENT));
5600
- const size = Math.max(MIN_SIZE, Math.min(\u5E45\u3067, \u5E2F\u3067));
5601
+ const size = Math.max(MIN_TEXT_SIZE, Math.min(\u5E45\u3067, \u5E2F\u3067));
5601
5602
  const \u5B57\u9AD8 = size * (ASCENT + DESCENT);
5602
5603
  const y = \u5B57\u9AD8 <= \u5E2F ? \u4E0A + \u5E2F / 2 + size * (ASCENT - DESCENT) / 2 : \u4E0A > 0 ? \u4E0A + size * ASCENT : (\u9AD8\u3055 - \u5B57\u9AD8) / 2 + size * ASCENT;
5603
5604
  return { x: node.w / 2, y, size, anchor: "middle" };
@@ -6577,9 +6578,10 @@ function resolveTreeData(nodes, values) {
6577
6578
  });
6578
6579
  }
6579
6580
  function resolveMindData(data, values) {
6580
- const \u8AAD\u3080 = data.rootTitle.includes("{") || data.branches.some((b) => b.title.includes("{") || (b.subtitle?.includes("{") ?? false));
6581
+ const \u8AAD\u3080 = data.rootTitle.includes("{") || (data.rootSubtitle?.includes("{") ?? false) || data.branches.some((b) => b.title.includes("{") || (b.subtitle?.includes("{") ?? false));
6581
6582
  if (!\u8AAD\u3080) return data;
6582
6583
  const root = resolveBoundText(data.rootTitle, values);
6584
+ const rootSubtitle = data.rootSubtitle === void 0 ? void 0 : resolveBoundText(data.rootSubtitle, values);
6583
6585
  const branches = data.branches.map((b) => {
6584
6586
  const title = resolveBoundText(b.title, values);
6585
6587
  const subtitle = b.subtitle === void 0 ? void 0 : resolveBoundText(b.subtitle, values);
@@ -6590,8 +6592,13 @@ function resolveMindData(data, values) {
6590
6592
  };
6591
6593
  return title.ok && (subtitle?.ok ?? true) ? \u89E3\u6C7A\u5F8C2 : { ...\u89E3\u6C7A\u5F8C2, unresolved: true };
6592
6594
  });
6593
- const \u89E3\u6C7A\u5F8C = { ...data, rootTitle: root.value, branches };
6594
- return root.ok ? \u89E3\u6C7A\u5F8C : { ...\u89E3\u6C7A\u5F8C, unresolved: true };
6595
+ const \u89E3\u6C7A\u5F8C = {
6596
+ ...data,
6597
+ rootTitle: root.value,
6598
+ ...rootSubtitle ? { rootSubtitle: rootSubtitle.value } : {},
6599
+ branches
6600
+ };
6601
+ return root.ok && (rootSubtitle?.ok ?? true) ? \u89E3\u6C7A\u5F8C : { ...\u89E3\u6C7A\u5F8C, unresolved: true };
6595
6602
  }
6596
6603
 
6597
6604
  // src/kinds/draw-progress.ts
@@ -7321,6 +7328,12 @@ function \u5E45\u3067\u5207\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E452, \u6
7321
7328
  }
7322
7329
  return `${\u51FA}${\u7701\u7565}`;
7323
7330
  }
7331
+ var \u7E2E\u3081\u306E\u4E0B\u9650 = MIN_TEXT_SIZE;
7332
+ function \u5E45\u306B\u53CE\u3081\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E452, \u6E2C\u308B = textWidth) {
7333
+ let size = fontSize;
7334
+ while (size > \u7E2E\u3081\u306E\u4E0B\u9650 && \u6E2C\u308B(text, size) > \u4F7F\u3048\u308B\u5E452) size -= 1;
7335
+ return { text: \u5E45\u3067\u5207\u308B(text, size, \u4F7F\u3048\u308B\u5E452, \u6E2C\u308B), fontSize: size };
7336
+ }
7324
7337
  function \u66F8\u8A18\u7D20\u306B\u5206\u3051\u308B(text) {
7325
7338
  const \u533A\u5207\u308A = Intl.Segmenter;
7326
7339
  if (typeof \u533A\u5207\u308A !== "function") return [...text];
@@ -7334,12 +7347,13 @@ function \u7BB1\u306B\u7A4D\u3080(\u884C, \u7BB1\u306E\u5E45, \u7BB1\u306E\u9AD8
7334
7347
  const \u6B8B\u3059 = [...\u5019\u88DC];
7335
7348
  while (\u6B8B\u3059.length > 1 && \u9AD8\u3055(\u6B8B\u3059) > \u4F7F\u3048\u308B\u9AD8\u3055) \u6B8B\u3059.pop();
7336
7349
  const \u5E45 = \u4F7F\u3048\u308B\u5E45(\u7BB1\u306E\u5E45);
7337
- const \u7DCF\u9AD8 = \u9AD8\u3055(\u6B8B\u3059);
7350
+ const \u53CE\u3081\u305F = \u6B8B\u3059.map((r) => ({ ...r, ...\u5E45\u306B\u53CE\u3081\u308B(r.text, r.fontSize, \u5E45) }));
7351
+ const \u7DCF\u9AD8 = \u9AD8\u3055(\u53CE\u3081\u305F);
7338
7352
  let \u7A4D\u307F = -\u7DCF\u9AD8 / 2;
7339
- return \u6B8B\u3059.map((r) => {
7353
+ return \u53CE\u3081\u305F.map((r) => {
7340
7354
  const dy = \u7A4D\u307F + (\u884C\u9001\u308A\u306E\u6BD4 + \u5B57\u306E\u9AD8\u3055\u306E\u6BD4) / 2 * r.fontSize;
7341
7355
  \u7A4D\u307F += r.fontSize * \u884C\u9001\u308A\u306E\u6BD4;
7342
- return { ...r, text: \u5E45\u3067\u5207\u308B(r.text, r.fontSize, \u5E45), dy };
7356
+ return { ...r, dy };
7343
7357
  });
7344
7358
  }
7345
7359
  var MIND_TONES = ["accent", "teal", "success", "warning", "info", "error"];
@@ -7407,6 +7421,7 @@ function MindMapNode({
7407
7421
  n.h
7408
7422
  );
7409
7423
  const \u88DC\u8DB3\u3042\u308A = (n.subtitle ?? "").trim() !== "";
7424
+ 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));
7410
7425
  const \u6587\u5B57\u306E\u8272 = n.isRoot ? "var(--cdl-text-on-tone, #ffffff)" : "var(--cdl-chip-text, #1a1f2a)";
7411
7426
  return /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-unresolved": n.unresolved ? "true" : void 0, children: [
7412
7427
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -7422,7 +7437,7 @@ function MindMapNode({
7422
7437
  strokeWidth: n.isRoot ? 2 : 1.75
7423
7438
  }
7424
7439
  ),
7425
- \u88DC\u8DB3\u3042\u308A ? \u884C.map((r) => /* @__PURE__ */ jsxRuntime.jsx(
7440
+ \u53CE\u3081\u305F\u540D\u524D === void 0 ? \u884C.map((r) => /* @__PURE__ */ jsxRuntime.jsx(
7426
7441
  "text",
7427
7442
  {
7428
7443
  "data-cdl-role": r.\u5F79\u5272 === "subtitle" ? "mind-node-subtitle" : void 0,
@@ -7439,17 +7454,18 @@ function MindMapNode({
7439
7454
  )) : (
7440
7455
  // 補足が無くても **幅に収める** (#526)。 `箱に積む` を通らないこの経路だけが
7441
7456
  // 幅を見ておらず、長い名前がそのまま箱の外へ出て枝の線と重なっていた
7442
- // (実測 = 中心の箱で文字 163px に対し箱 120px)
7457
+ // (実測 = 中心の箱で文字 163px に対し箱 120px)
7458
+ // 収める手段は縮めるのが先で、切るのは下限まで縮めても入らない時だけ (#534)
7443
7459
  /* @__PURE__ */ jsxRuntime.jsx(
7444
7460
  "text",
7445
7461
  {
7446
7462
  x: n.x,
7447
7463
  y: n.y + 5,
7448
- fontSize: n.isRoot ? 15 : 13,
7464
+ fontSize: \u53CE\u3081\u305F\u540D\u524D.fontSize,
7449
7465
  fontWeight: n.isRoot ? 700 : 600,
7450
7466
  textAnchor: "middle",
7451
7467
  fill: \u6587\u5B57\u306E\u8272,
7452
- children: \u5E45\u3067\u5207\u308B(n.title, n.isRoot ? 15 : 13, \u4F7F\u3048\u308B\u5E45(n.w))
7468
+ children: \u53CE\u3081\u305F\u540D\u524D.text
7453
7469
  }
7454
7470
  )
7455
7471
  )
@@ -7465,6 +7481,8 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
7465
7481
  nodes.push({
7466
7482
  id: mindData.rootId,
7467
7483
  title: mindData.rootTitle,
7484
+ // 中心も枝と同じく 2 行に積める (#530)。 高さ 52 に 15px + 9px の 2 行が入る
7485
+ ...mindData.rootSubtitle === void 0 ? {} : { subtitle: mindData.rootSubtitle },
7468
7486
  x: cx,
7469
7487
  y: cy,
7470
7488
  w: rootW,
@@ -8043,6 +8061,7 @@ function TreeNode({
8043
8061
  n.h
8044
8062
  );
8045
8063
  const \u88DC\u8DB3\u3042\u308A = (n.subtitle ?? "").trim() !== "";
8064
+ 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));
8046
8065
  return /* @__PURE__ */ jsxRuntime.jsx(
8047
8066
  "g",
8048
8067
  {
@@ -8061,7 +8080,7 @@ function TreeNode({
8061
8080
  fill: `url(#${gradientId})`
8062
8081
  }
8063
8082
  ),
8064
- \u88DC\u8DB3\u3042\u308A ? \u7BB1\u306E\u6587\u5B57({
8083
+ \u53CE\u3081\u305F\u540D\u524D === void 0 ? \u7BB1\u306E\u6587\u5B57({
8065
8084
  \u884C,
8066
8085
  x: n.w / 2,
8067
8086
  \u7BB1\u306E\u9AD8\u3055: n.h,
@@ -8075,11 +8094,11 @@ function TreeNode({
8075
8094
  {
8076
8095
  x: n.w / 2,
8077
8096
  y: n.h / 2 + 5,
8078
- fontSize: 13,
8097
+ fontSize: \u53CE\u3081\u305F\u540D\u524D.fontSize,
8079
8098
  fontWeight: 700,
8080
8099
  textAnchor: "middle",
8081
8100
  fill: "var(--cdl-text-on-tone, #ffffff)",
8082
- children: \u5E45\u3067\u5207\u308B(n.title, 13, \u4F7F\u3048\u308B\u5E45(n.w))
8101
+ children: \u53CE\u3081\u305F\u540D\u524D.text
8083
8102
  }
8084
8103
  )
8085
8104
  )
@@ -8099,7 +8118,7 @@ function TreeNode({
8099
8118
  }
8100
8119
  ),
8101
8120
  /* @__PURE__ */ jsxRuntime.jsx("rect", { x: 0, y: 0, width: 4, height: n.h, rx: 2, fill: accent }),
8102
- \u88DC\u8DB3\u3042\u308A ? \u7BB1\u306E\u6587\u5B57({
8121
+ \u53CE\u3081\u305F\u540D\u524D === void 0 ? \u7BB1\u306E\u6587\u5B57({
8103
8122
  \u884C,
8104
8123
  x: n.w / 2 + 2,
8105
8124
  \u7BB1\u306E\u9AD8\u3055: n.h,
@@ -8110,11 +8129,11 @@ function TreeNode({
8110
8129
  {
8111
8130
  x: n.w / 2 + 2,
8112
8131
  y: n.h / 2 + 4,
8113
- fontSize: 12,
8132
+ fontSize: \u53CE\u3081\u305F\u540D\u524D.fontSize,
8114
8133
  fontWeight: 600,
8115
8134
  textAnchor: "middle",
8116
8135
  fill: "var(--cdl-chip-text, #1a1f2a)",
8117
- children: \u5E45\u3067\u5207\u308B(n.title, 12, \u4F7F\u3048\u308B\u5E45(n.w))
8136
+ children: \u53CE\u3081\u305F\u540D\u524D.text
8118
8137
  }
8119
8138
  )
8120
8139
  ] })
@@ -10000,15 +10019,15 @@ var externalLabel = (node, cx, bottomY) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRu
10000
10019
  )
10001
10020
  ] });
10002
10021
  var LABEL_EYEBROW_SPACING = 2;
10003
- function \u5E45\u306B\u53CE\u3081\u308B(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
10022
+ function \u5E45\u306B\u53CE\u3081\u308B2(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
10004
10023
  const \u5E45 = textWidth(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593);
10005
10024
  const \u500D\u7387 = \u5E45 > 0 && \u7BB1\u5E45 > 0 ? Math.min(1, \u7BB1\u5E45 / \u5E45) : 1;
10006
10025
  return { size: \u5927\u304D\u3055 * \u500D\u7387, spacing: \u5B57\u9593 * \u500D\u7387 };
10007
10026
  }
10008
10027
  function bottomLabel(node, cx, plan) {
10009
- const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING, node.w);
10010
- const \u540D = \u5E45\u306B\u53CE\u3081\u308B(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
10011
- const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
10028
+ const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B2(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING, node.w);
10029
+ const \u540D = \u5E45\u306B\u53CE\u3081\u308B2(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
10030
+ const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B2(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
10012
10031
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
10013
10032
  node.eyebrow && plan.\u80A9\u66F8 && /* @__PURE__ */ jsxRuntime.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 }),
10014
10033
  /* @__PURE__ */ jsxRuntime.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 }),
@@ -11325,15 +11344,15 @@ function \u5B57\u5E45(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593) {
11325
11344
  }
11326
11345
  return \u5E45 + \u5B57\u9593 * \u5B57\u6570;
11327
11346
  }
11328
- function \u5E45\u306B\u53CE\u3081\u308B2(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
11347
+ function \u5E45\u306B\u53CE\u3081\u308B3(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
11329
11348
  const \u5E45 = \u5B57\u5E45(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593);
11330
11349
  const \u500D\u7387 = \u5E45 > 0 && \u7BB1\u5E45 > 0 ? Math.min(1, \u7BB1\u5E45 / \u5E45) : 1;
11331
11350
  return { size: \u5927\u304D\u3055 * \u500D\u7387, spacing: \u5B57\u9593 * \u500D\u7387 };
11332
11351
  }
11333
11352
  function bottomLabel3(node, cx, plan) {
11334
- const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B2(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING2, node.w);
11335
- const \u540D = \u5E45\u306B\u53CE\u3081\u308B2(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
11336
- const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B2(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
11353
+ const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B3(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING2, node.w);
11354
+ const \u540D = \u5E45\u306B\u53CE\u3081\u308B3(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
11355
+ const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B3(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
11337
11356
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
11338
11357
  node.eyebrow && plan.\u80A9\u66F8 && /* @__PURE__ */ jsxRuntime.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 }),
11339
11358
  /* @__PURE__ */ jsxRuntime.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 }),
@@ -11774,15 +11793,15 @@ function \u5B57\u5E452(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593) {
11774
11793
  }
11775
11794
  return \u5E45 + \u5B57\u9593 * \u5B57\u6570;
11776
11795
  }
11777
- function \u5E45\u306B\u53CE\u3081\u308B3(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
11796
+ function \u5E45\u306B\u53CE\u3081\u308B4(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593, \u7BB1\u5E45) {
11778
11797
  const \u5E45 = \u5B57\u5E452(\u6587\u5B57\u5217, \u5927\u304D\u3055, \u5B57\u9593);
11779
11798
  const \u500D\u7387 = \u5E45 > 0 && \u7BB1\u5E45 > 0 ? Math.min(1, \u7BB1\u5E45 / \u5E45) : 1;
11780
11799
  return { size: \u5927\u304D\u3055 * \u500D\u7387, spacing: \u5B57\u9593 * \u500D\u7387 };
11781
11800
  }
11782
11801
  function bottomLabel4(node, cx, plan) {
11783
- const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B3(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING3, node.w);
11784
- const \u540D = \u5E45\u306B\u53CE\u3081\u308B3(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
11785
- const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B3(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
11802
+ const \u80A9 = \u5E45\u306B\u53CE\u3081\u308B4(node.eyebrow ?? "", plan.\u80A9\u66F8?.size ?? 0, LABEL_EYEBROW_SPACING3, node.w);
11803
+ const \u540D = \u5E45\u306B\u53CE\u3081\u308B4(node.title ?? "", plan.\u540D\u524D.size, 0, node.w);
11804
+ const \u8AAC = \u5E45\u306B\u53CE\u3081\u308B4(node.subtitle ?? "", plan.\u8AAC\u660E?.size ?? 0, 0, node.w);
11786
11805
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
11787
11806
  node.eyebrow && plan.\u80A9\u66F8 && /* @__PURE__ */ jsxRuntime.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 }),
11788
11807
  /* @__PURE__ */ jsxRuntime.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 }),