@cardenelabs/cdl 0.51.0 → 0.52.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 +15 -1
- package/dist/index.cjs +44 -30
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -2
- package/dist/index.d.ts +8 -2
- package/dist/index.js +44 -30
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +41 -30
- 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 +41 -30
- package/dist/react.js.map +1 -1
- package/dist/{render-BoBEyCu-.d.cts → render-C0PJ2weJ.d.cts} +6 -0
- package/dist/{render-BoBEyCu-.d.ts → render-C0PJ2weJ.d.ts} +6 -0
- package/package.json +1 -1
- package/src/builder.ts +6 -0
- package/src/layout/head-label.ts +56 -36
- package/src/presets.ts +3 -0
- package/src/render/edges.tsx +8 -5
- package/src/render/stage.tsx +13 -10
- package/src/types.ts +6 -0
package/dist/react.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import 'react';
|
|
2
|
-
export { q as CdlDiagramView, m as CdlDiagramViewProps } from './render-
|
|
2
|
+
export { q as CdlDiagramView, m as CdlDiagramViewProps } from './render-C0PJ2weJ.cjs';
|
package/dist/react.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import 'react';
|
|
2
|
-
export { q as CdlDiagramView, m as CdlDiagramViewProps } from './render-
|
|
2
|
+
export { q as CdlDiagramView, m as CdlDiagramViewProps } from './render-C0PJ2weJ.js';
|
package/dist/react.js
CHANGED
|
@@ -10419,28 +10419,34 @@ var \u7AEF\u306E\u5B57\u3068\u7DDA\u306E\u9699\u9593 = 8;
|
|
|
10419
10419
|
var \u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055 = EDGE_LABEL_TEXT.sub.fontSize;
|
|
10420
10420
|
var \u7BB1\u306E\u9AD8\u30552 = Math.round(\u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055 * 1.2);
|
|
10421
10421
|
var BASELINE_RATIO = 0.8;
|
|
10422
|
-
function \
|
|
10423
|
-
const
|
|
10424
|
-
|
|
10425
|
-
|
|
10426
|
-
|
|
10427
|
-
|
|
10428
|
-
|
|
10429
|
-
const \u5236\u5FA1\u70B9 = s.cmd === "Q" ? s.ctrl?.[0] : s.cmd === "C" ? s.ctrl?.[1] : void 0;
|
|
10430
|
-
for (const p of [\u5236\u5FA1\u70B9, { x: s.x1, y: s.y1 }]) {
|
|
10431
|
-
if (!p) continue;
|
|
10432
|
-
const dx = end.x - p.x;
|
|
10433
|
-
const dy = end.y - p.y;
|
|
10434
|
-
const len = Math.hypot(dx, dy);
|
|
10435
|
-
if (len > 1e-6) return { end, ux: dx / len, uy: dy / len };
|
|
10436
|
-
}
|
|
10422
|
+
function \u5411\u304D\u3092\u53D6\u308B(end, \u5019\u88DC) {
|
|
10423
|
+
for (const p of \u5019\u88DC) {
|
|
10424
|
+
if (!p) continue;
|
|
10425
|
+
const dx = end.x - p.x;
|
|
10426
|
+
const dy = end.y - p.y;
|
|
10427
|
+
const len = Math.hypot(dx, dy);
|
|
10428
|
+
if (len > 1e-6) return { end, ux: dx / len, uy: dy / len };
|
|
10437
10429
|
}
|
|
10438
10430
|
return null;
|
|
10439
10431
|
}
|
|
10440
|
-
function \u7AEF\u306E\
|
|
10441
|
-
const
|
|
10432
|
+
function \u7AEF\u3067\u306E\u5411\u304D(d, \u7AEF) {
|
|
10433
|
+
const segs = extractPathSegments(d);
|
|
10434
|
+
if (segs.length === 0) return null;
|
|
10435
|
+
if (\u7AEF === "head") {
|
|
10436
|
+
const last = segs[segs.length - 1];
|
|
10437
|
+
const end2 = { x: last.x2, y: last.y2 };
|
|
10438
|
+
const \u5019\u88DC2 = segs.slice().reverse().flatMap((s) => [s.cmd === "Q" ? s.ctrl?.[0] : s.cmd === "C" ? s.ctrl?.[1] : void 0, { x: s.x1, y: s.y1 }]);
|
|
10439
|
+
return \u5411\u304D\u3092\u53D6\u308B(end2, \u5019\u88DC2);
|
|
10440
|
+
}
|
|
10441
|
+
const first = segs[0];
|
|
10442
|
+
const end = { x: first.x1, y: first.y1 };
|
|
10443
|
+
const \u5019\u88DC = segs.flatMap((s) => [...s.ctrl ?? [], { x: s.x2, y: s.y2 }]);
|
|
10444
|
+
return \u5411\u304D\u3092\u53D6\u308B(end, \u5019\u88DC);
|
|
10445
|
+
}
|
|
10446
|
+
function \u7AEF\u306E\u5B57\u3092\u7F6E\u304F(edge, \u7AEF = "head") {
|
|
10447
|
+
const text = (\u7AEF === "head" ? edge.headLabel : edge.tailLabel)?.trim();
|
|
10442
10448
|
if (!text) return null;
|
|
10443
|
-
const \u5411\u304D = \
|
|
10449
|
+
const \u5411\u304D = \u7AEF\u3067\u306E\u5411\u304D(edge.d, \u7AEF);
|
|
10444
10450
|
if (!\u5411\u304D) return null;
|
|
10445
10451
|
const { end, ux, uy } = \u5411\u304D;
|
|
10446
10452
|
const bx = end.x - ux * \u7AEF\u306E\u5B57\u3092\u623B\u3059\u8DDD\u96E2;
|
|
@@ -10741,11 +10747,12 @@ function CdlEdgeLabelView({
|
|
|
10741
10747
|
}
|
|
10742
10748
|
);
|
|
10743
10749
|
}
|
|
10744
|
-
function
|
|
10750
|
+
function CdlEdgeEndLabelView({
|
|
10745
10751
|
edge,
|
|
10746
|
-
active
|
|
10752
|
+
active,
|
|
10753
|
+
\u7AEF
|
|
10747
10754
|
}) {
|
|
10748
|
-
const \u7F6E\u304D\u5834\u6240 = \u7AEF\u306E\u5B57\u3092\u7F6E\u304F(edge);
|
|
10755
|
+
const \u7F6E\u304D\u5834\u6240 = \u7AEF\u306E\u5B57\u3092\u7F6E\u304F(edge, \u7AEF);
|
|
10749
10756
|
if (!\u7F6E\u304D\u5834\u6240) return null;
|
|
10750
10757
|
const color = edgeColor(edge);
|
|
10751
10758
|
return /* @__PURE__ */ jsx(
|
|
@@ -10753,6 +10760,7 @@ function CdlEdgeHeadLabelView({
|
|
|
10753
10760
|
{
|
|
10754
10761
|
"data-cdl-role": "edge-end-label",
|
|
10755
10762
|
"data-cdl-edge-end-label-for": edge.id,
|
|
10763
|
+
"data-cdl-edge-end": \u7AEF,
|
|
10756
10764
|
x: \u7F6E\u304D\u5834\u6240.x,
|
|
10757
10765
|
y: \u7F6E\u304D\u5834\u6240.y,
|
|
10758
10766
|
fontSize: \u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055,
|
|
@@ -10764,7 +10772,7 @@ function CdlEdgeHeadLabelView({
|
|
|
10764
10772
|
strokeLinejoin: "round",
|
|
10765
10773
|
paintOrder: "stroke",
|
|
10766
10774
|
style: { fontFamily: fontFamilyAttr("sub") },
|
|
10767
|
-
children: \u7B49\u5E45\u306E\u5B57(edge.headLabel, \u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055)
|
|
10775
|
+
children: \u7B49\u5E45\u306E\u5B57(\u7AEF === "head" ? edge.headLabel : edge.tailLabel, \u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055)
|
|
10768
10776
|
}
|
|
10769
10777
|
);
|
|
10770
10778
|
}
|
|
@@ -19049,14 +19057,17 @@ function CdlStage({
|
|
|
19049
19057
|
},
|
|
19050
19058
|
`label-${edge.id}`
|
|
19051
19059
|
)),
|
|
19052
|
-
laid.edges.filter((edge) => edge.headLabel && \u77E2\u5370\u306E\u51FA\u756A.\u51FA\u308B\u304B(edge.id)).
|
|
19053
|
-
|
|
19054
|
-
|
|
19055
|
-
|
|
19056
|
-
|
|
19057
|
-
|
|
19058
|
-
|
|
19059
|
-
|
|
19060
|
+
laid.edges.filter((edge) => (edge.headLabel || edge.tailLabel) && \u77E2\u5370\u306E\u51FA\u756A.\u51FA\u308B\u304B(edge.id)).flatMap(
|
|
19061
|
+
(edge) => ["head", "tail"].map((\u7AEF) => /* @__PURE__ */ jsx(
|
|
19062
|
+
CdlEdgeEndLabelView,
|
|
19063
|
+
{
|
|
19064
|
+
edge,
|
|
19065
|
+
active: activeSet.has(edge.id),
|
|
19066
|
+
\u7AEF
|
|
19067
|
+
},
|
|
19068
|
+
`${\u7AEF}-label-${edge.id}`
|
|
19069
|
+
))
|
|
19070
|
+
),
|
|
19060
19071
|
debug && /* @__PURE__ */ jsxs("g", { pointerEvents: "none", children: [
|
|
19061
19072
|
laid.bboxes.map((bbox, idx) => {
|
|
19062
19073
|
const color = bbox.kind === "node" ? "#3b82f6" : bbox.kind === "lane-label" ? "#a855f7" : bbox.kind === "edge-label" ? "#10b981" : "#f59e0b";
|