@cardenelabs/cdl 0.12.0 → 0.13.0
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/CHANGELOG.md +36 -1
- package/dist/index.cjs +55 -33
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +55 -33
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +54 -33
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +1 -1
- package/dist/react.d.ts +1 -1
- package/dist/react.js +54 -33
- package/dist/react.js.map +1 -1
- package/dist/{render-C7FKvMqq.d.cts → render-B5JHcUrb.d.cts} +8 -0
- package/dist/{render-C7FKvMqq.d.ts → render-B5JHcUrb.d.ts} +8 -0
- package/package.json +1 -1
- package/src/kinds/box-lines.ts +12 -2
- package/src/kinds/mind-map.tsx +9 -4
- package/src/kinds/tree.tsx +5 -3
- package/src/presets.ts +3 -0
- package/src/render/payload-binding.ts +14 -4
- package/src/render/template-fields.ts +1 -0
- package/src/types.ts +8 -0
package/dist/react.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import 'react';
|
|
2
|
-
export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-
|
|
2
|
+
export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-B5JHcUrb.cjs';
|
package/dist/react.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import 'react';
|
|
2
|
-
export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-
|
|
2
|
+
export { n as CdlDiagramView, j as CdlDiagramViewProps } from './render-B5JHcUrb.js';
|
package/dist/react.js
CHANGED
|
@@ -4857,6 +4857,7 @@ function payloadTexts(node) {
|
|
|
4857
4857
|
}
|
|
4858
4858
|
if (node.mindData) {
|
|
4859
4859
|
\u8DB3\u3059(node.mindData.rootTitle);
|
|
4860
|
+
\u8DB3\u3059(node.mindData.rootSubtitle);
|
|
4860
4861
|
for (const b of node.mindData.branches) {
|
|
4861
4862
|
\u8DB3\u3059(b.title);
|
|
4862
4863
|
\u8DB3\u3059(b.subtitle);
|
|
@@ -6575,9 +6576,10 @@ function resolveTreeData(nodes, values) {
|
|
|
6575
6576
|
});
|
|
6576
6577
|
}
|
|
6577
6578
|
function resolveMindData(data, values) {
|
|
6578
|
-
const \u8AAD\u3080 = data.rootTitle.includes("{") || data.branches.some((b) => b.title.includes("{") || (b.subtitle?.includes("{") ?? false));
|
|
6579
|
+
const \u8AAD\u3080 = data.rootTitle.includes("{") || (data.rootSubtitle?.includes("{") ?? false) || data.branches.some((b) => b.title.includes("{") || (b.subtitle?.includes("{") ?? false));
|
|
6579
6580
|
if (!\u8AAD\u3080) return data;
|
|
6580
6581
|
const root = resolveBoundText(data.rootTitle, values);
|
|
6582
|
+
const rootSubtitle = data.rootSubtitle === void 0 ? void 0 : resolveBoundText(data.rootSubtitle, values);
|
|
6581
6583
|
const branches = data.branches.map((b) => {
|
|
6582
6584
|
const title = resolveBoundText(b.title, values);
|
|
6583
6585
|
const subtitle = b.subtitle === void 0 ? void 0 : resolveBoundText(b.subtitle, values);
|
|
@@ -6588,8 +6590,13 @@ function resolveMindData(data, values) {
|
|
|
6588
6590
|
};
|
|
6589
6591
|
return title.ok && (subtitle?.ok ?? true) ? \u89E3\u6C7A\u5F8C2 : { ...\u89E3\u6C7A\u5F8C2, unresolved: true };
|
|
6590
6592
|
});
|
|
6591
|
-
const \u89E3\u6C7A\u5F8C = {
|
|
6592
|
-
|
|
6593
|
+
const \u89E3\u6C7A\u5F8C = {
|
|
6594
|
+
...data,
|
|
6595
|
+
rootTitle: root.value,
|
|
6596
|
+
...rootSubtitle ? { rootSubtitle: rootSubtitle.value } : {},
|
|
6597
|
+
branches
|
|
6598
|
+
};
|
|
6599
|
+
return root.ok && (rootSubtitle?.ok ?? true) ? \u89E3\u6C7A\u5F8C : { ...\u89E3\u6C7A\u5F8C, unresolved: true };
|
|
6593
6600
|
}
|
|
6594
6601
|
|
|
6595
6602
|
// src/kinds/draw-progress.ts
|
|
@@ -7300,17 +7307,20 @@ var \u884C\u9001\u308A\u306E\u6BD4 = 1.15;
|
|
|
7300
7307
|
var \u5B57\u306E\u9AD8\u3055\u306E\u6BD4 = 0.72;
|
|
7301
7308
|
var \u4E0A\u4E0B\u306E\u4F59\u767D = 2;
|
|
7302
7309
|
var \u5DE6\u53F3\u306E\u4F59\u767D = 8;
|
|
7303
|
-
function \
|
|
7304
|
-
|
|
7305
|
-
|
|
7310
|
+
function \u4F7F\u3048\u308B\u5E45(\u7BB1\u306E\u5E45) {
|
|
7311
|
+
return \u7BB1\u306E\u5E45 - \u5DE6\u53F3\u306E\u4F59\u767D * 2;
|
|
7312
|
+
}
|
|
7313
|
+
function \u5E45\u3067\u5207\u308B(text, fontSize, \u4F7F\u3048\u308B\u5E452, \u6E2C\u308B = textWidth) {
|
|
7314
|
+
if (\u4F7F\u3048\u308B\u5E452 <= 0) return "";
|
|
7315
|
+
if (\u6E2C\u308B(text, fontSize) <= \u4F7F\u3048\u308B\u5E452) return text;
|
|
7306
7316
|
const \u7701\u7565 = "\u2026";
|
|
7307
7317
|
const \u7701\u7565\u306E\u5E45 = \u6E2C\u308B(\u7701\u7565, fontSize);
|
|
7308
|
-
if (\u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\
|
|
7318
|
+
if (\u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\u5E452) return "";
|
|
7309
7319
|
let \u51FA = "";
|
|
7310
7320
|
let \u5E45 = 0;
|
|
7311
7321
|
for (const c of \u66F8\u8A18\u7D20\u306B\u5206\u3051\u308B(text)) {
|
|
7312
7322
|
const \u5B57\u306E\u5E452 = \u6E2C\u308B(c, fontSize);
|
|
7313
|
-
if (\u5E45 + \u5B57\u306E\u5E452 + \u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\
|
|
7323
|
+
if (\u5E45 + \u5B57\u306E\u5E452 + \u7701\u7565\u306E\u5E45 > \u4F7F\u3048\u308B\u5E452) break;
|
|
7314
7324
|
\u5E45 += \u5B57\u306E\u5E452;
|
|
7315
7325
|
\u51FA += c;
|
|
7316
7326
|
}
|
|
@@ -7328,13 +7338,13 @@ function \u7BB1\u306B\u7A4D\u3080(\u884C, \u7BB1\u306E\u5E45, \u7BB1\u306E\u9AD8
|
|
|
7328
7338
|
const \u9AD8\u3055 = (rs) => rs.reduce((a, r) => a + r.fontSize * \u884C\u9001\u308A\u306E\u6BD4, 0);
|
|
7329
7339
|
const \u6B8B\u3059 = [...\u5019\u88DC];
|
|
7330
7340
|
while (\u6B8B\u3059.length > 1 && \u9AD8\u3055(\u6B8B\u3059) > \u4F7F\u3048\u308B\u9AD8\u3055) \u6B8B\u3059.pop();
|
|
7331
|
-
const \u4F7F\u3048\u308B\u5E45
|
|
7341
|
+
const \u5E45 = \u4F7F\u3048\u308B\u5E45(\u7BB1\u306E\u5E45);
|
|
7332
7342
|
const \u7DCF\u9AD8 = \u9AD8\u3055(\u6B8B\u3059);
|
|
7333
7343
|
let \u7A4D\u307F = -\u7DCF\u9AD8 / 2;
|
|
7334
7344
|
return \u6B8B\u3059.map((r) => {
|
|
7335
7345
|
const dy = \u7A4D\u307F + (\u884C\u9001\u308A\u306E\u6BD4 + \u5B57\u306E\u9AD8\u3055\u306E\u6BD4) / 2 * r.fontSize;
|
|
7336
7346
|
\u7A4D\u307F += r.fontSize * \u884C\u9001\u308A\u306E\u6BD4;
|
|
7337
|
-
return { ...r, text: \u5E45\u3067\u5207\u308B(r.text, r.fontSize, \
|
|
7347
|
+
return { ...r, text: \u5E45\u3067\u5207\u308B(r.text, r.fontSize, \u5E45), dy };
|
|
7338
7348
|
});
|
|
7339
7349
|
}
|
|
7340
7350
|
var MIND_TONES = ["accent", "teal", "success", "warning", "info", "error"];
|
|
@@ -7431,17 +7441,22 @@ function MindMapNode({
|
|
|
7431
7441
|
children: r.text
|
|
7432
7442
|
},
|
|
7433
7443
|
r.\u5F79\u5272
|
|
7434
|
-
)) :
|
|
7435
|
-
|
|
7436
|
-
|
|
7437
|
-
|
|
7438
|
-
|
|
7439
|
-
|
|
7440
|
-
|
|
7441
|
-
|
|
7442
|
-
|
|
7443
|
-
|
|
7444
|
-
|
|
7444
|
+
)) : (
|
|
7445
|
+
// 補足が無くても **幅に収める** (#526)。 `箱に積む` を通らないこの経路だけが
|
|
7446
|
+
// 幅を見ておらず、長い名前がそのまま箱の外へ出て枝の線と重なっていた
|
|
7447
|
+
// (実測 = 中心の箱で文字 163px に対し箱 120px)
|
|
7448
|
+
/* @__PURE__ */ jsx(
|
|
7449
|
+
"text",
|
|
7450
|
+
{
|
|
7451
|
+
x: n.x,
|
|
7452
|
+
y: n.y + 5,
|
|
7453
|
+
fontSize: n.isRoot ? 15 : 13,
|
|
7454
|
+
fontWeight: n.isRoot ? 700 : 600,
|
|
7455
|
+
textAnchor: "middle",
|
|
7456
|
+
fill: \u6587\u5B57\u306E\u8272,
|
|
7457
|
+
children: \u5E45\u3067\u5207\u308B(n.title, n.isRoot ? 15 : 13, \u4F7F\u3048\u308B\u5E45(n.w))
|
|
7458
|
+
}
|
|
7459
|
+
)
|
|
7445
7460
|
)
|
|
7446
7461
|
] }, `n-${n.id}`);
|
|
7447
7462
|
})
|
|
@@ -7455,6 +7470,8 @@ function computeMindMapLayout(mindData, cx, cy, canvasW, canvasH) {
|
|
|
7455
7470
|
nodes.push({
|
|
7456
7471
|
id: mindData.rootId,
|
|
7457
7472
|
title: mindData.rootTitle,
|
|
7473
|
+
// 中心も枝と同じく 2 行に積める (#530)。 高さ 52 に 15px + 9px の 2 行が入る
|
|
7474
|
+
...mindData.rootSubtitle === void 0 ? {} : { subtitle: mindData.rootSubtitle },
|
|
7458
7475
|
x: cx,
|
|
7459
7476
|
y: cy,
|
|
7460
7477
|
w: rootW,
|
|
@@ -8057,17 +8074,21 @@ function TreeNode({
|
|
|
8057
8074
|
\u7BB1\u306E\u9AD8\u3055: n.h,
|
|
8058
8075
|
fill: "var(--cdl-text-on-tone, #ffffff)",
|
|
8059
8076
|
\u540D\u524D\u306E\u592A\u3055: 700
|
|
8060
|
-
}) :
|
|
8061
|
-
|
|
8062
|
-
|
|
8063
|
-
|
|
8064
|
-
|
|
8065
|
-
|
|
8066
|
-
|
|
8067
|
-
|
|
8068
|
-
|
|
8069
|
-
|
|
8070
|
-
|
|
8077
|
+
}) : (
|
|
8078
|
+
// 補足が無くても幅に収める (#526)。 `箱の文字` を通らないこの経路だけが
|
|
8079
|
+
// 幅を見ておらず、長い名前が箱の外へ出ていた
|
|
8080
|
+
/* @__PURE__ */ jsx(
|
|
8081
|
+
"text",
|
|
8082
|
+
{
|
|
8083
|
+
x: n.w / 2,
|
|
8084
|
+
y: n.h / 2 + 5,
|
|
8085
|
+
fontSize: 13,
|
|
8086
|
+
fontWeight: 700,
|
|
8087
|
+
textAnchor: "middle",
|
|
8088
|
+
fill: "var(--cdl-text-on-tone, #ffffff)",
|
|
8089
|
+
children: \u5E45\u3067\u5207\u308B(n.title, 13, \u4F7F\u3048\u308B\u5E45(n.w))
|
|
8090
|
+
}
|
|
8091
|
+
)
|
|
8071
8092
|
)
|
|
8072
8093
|
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
8073
8094
|
/* @__PURE__ */ jsx(
|
|
@@ -8100,7 +8121,7 @@ function TreeNode({
|
|
|
8100
8121
|
fontWeight: 600,
|
|
8101
8122
|
textAnchor: "middle",
|
|
8102
8123
|
fill: "var(--cdl-chip-text, #1a1f2a)",
|
|
8103
|
-
children: n.title
|
|
8124
|
+
children: \u5E45\u3067\u5207\u308B(n.title, 12, \u4F7F\u3048\u308B\u5E45(n.w))
|
|
8104
8125
|
}
|
|
8105
8126
|
)
|
|
8106
8127
|
] })
|