@cardenelabs/cdl 0.119.0 → 0.121.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 +92 -1
- package/dist/index.cjs +38 -8
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +38 -8
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +38 -8
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +38 -8
- package/dist/react.js.map +1 -1
- package/package.json +1 -1
- package/src/layout/head-label.ts +27 -8
- package/src/render/edges.tsx +41 -7
- package/src/render/utils.ts +47 -0
package/dist/index.js
CHANGED
|
@@ -15437,6 +15437,32 @@ function shrinkPathEnd(d, shrinkPx) {
|
|
|
15437
15437
|
tokens[tokens.length - 1] = newEndY.toFixed(1);
|
|
15438
15438
|
return tokens.join(" ");
|
|
15439
15439
|
}
|
|
15440
|
+
function shrinkPathStart(d, shrinkPx) {
|
|
15441
|
+
const \u533A\u9593 = [...d.matchAll(/([MLCQZmlcqz])([^MLCQZmlcqz]*)/g)].map((m) => ({
|
|
15442
|
+
cmd: m[1],
|
|
15443
|
+
args: (m[2] ?? "").trim().split(/[\s,]+/).filter(Boolean).map(parseFloat)
|
|
15444
|
+
}));
|
|
15445
|
+
if (\u533A\u9593.length < 2) return d;
|
|
15446
|
+
const \u5148\u982D = \u533A\u9593[0];
|
|
15447
|
+
if (\u5148\u982D.cmd !== "M" || \u5148\u982D.args.length < 2) return d;
|
|
15448
|
+
const \u6B21 = \u533A\u9593[1];
|
|
15449
|
+
const \u5411\u304D\u5148 = \u6B21.cmd === "Q" || \u6B21.cmd === "C" ? { x: \u6B21.args[0], y: \u6B21.args[1] } : \u6B21.cmd === "L" || \u6B21.cmd === "M" ? { x: \u6B21.args[0], y: \u6B21.args[1] } : null;
|
|
15450
|
+
if (!\u5411\u304D\u5148 || !Number.isFinite(\u5411\u304D\u5148.x) || !Number.isFinite(\u5411\u304D\u5148.y)) return d;
|
|
15451
|
+
const x0 = \u5148\u982D.args[0];
|
|
15452
|
+
const y0 = \u5148\u982D.args[1];
|
|
15453
|
+
const dx = \u5411\u304D\u5148.x - x0;
|
|
15454
|
+
const dy = \u5411\u304D\u5148.y - y0;
|
|
15455
|
+
const len = Math.hypot(dx, dy);
|
|
15456
|
+
if (len < shrinkPx + 1) return d;
|
|
15457
|
+
const \u6BD4 = shrinkPx / len;
|
|
15458
|
+
const \u65B0x = x0 + dx * \u6BD4;
|
|
15459
|
+
const \u65B0y = y0 + dy * \u6BD4;
|
|
15460
|
+
const tokens = d.trim().split(/\s+/);
|
|
15461
|
+
if (tokens.length < 3) return d;
|
|
15462
|
+
tokens[1] = \u65B0x.toFixed(1);
|
|
15463
|
+
tokens[2] = \u65B0y.toFixed(1);
|
|
15464
|
+
return tokens.join(" ");
|
|
15465
|
+
}
|
|
15440
15466
|
function pathSubpath(d, progress) {
|
|
15441
15467
|
if (progress >= 1) return d;
|
|
15442
15468
|
if (progress <= 0) {
|
|
@@ -21566,12 +21592,12 @@ function recomputeContainedLanes(lanes, nodes) {
|
|
|
21566
21592
|
}
|
|
21567
21593
|
|
|
21568
21594
|
// src/layout/head-label.ts
|
|
21569
|
-
var \u7AEF\u306E\u5B57\
|
|
21595
|
+
var \u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055 = 26;
|
|
21596
|
+
var \u7BB1\u306E\u9AD8\u3055 = Math.round(\u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055 * 1.2);
|
|
21597
|
+
var \u7AEF\u306E\u5B57\u3068\u5370\u306E\u4F59\u767D = 12;
|
|
21570
21598
|
var \u7AEF\u306E\u5370\u306E\u5F35\u308A\u51FA\u3057 = EDGE_HEAD_MARKER_SIZE.\u65E2\u5B9A / 2;
|
|
21571
21599
|
var \u7AEF\u306E\u5B57\u3092\u623B\u3059\u8DDD\u96E2 = EDGE_HEAD_MARKER_SIZE.\u65E2\u5B9A + \u7AEF\u306E\u5B57\u3068\u5370\u306E\u4F59\u767D;
|
|
21572
21600
|
var \u7AEF\u306E\u5B57\u3068\u7DDA\u306E\u9699\u9593 = \u7AEF\u306E\u5370\u306E\u5F35\u308A\u51FA\u3057 + \u7AEF\u306E\u5B57\u3068\u5370\u306E\u4F59\u767D;
|
|
21573
|
-
var \u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055 = EDGE_LABEL_TEXT.sub.fontSize;
|
|
21574
|
-
var \u7BB1\u306E\u9AD8\u3055 = Math.round(\u7AEF\u306E\u5B57\u306E\u5927\u304D\u3055 * 1.2);
|
|
21575
21601
|
var BASELINE_RATIO = 0.8;
|
|
21576
21602
|
var \u4E21\u7AEF\u306E\u5B57\u306E\u9593 = \u7AEF\u306E\u5B57\u3092\u623B\u3059\u8DDD\u96E2 * 2;
|
|
21577
21603
|
function \u7AEF\u306E\u5B57\u306B\u8981\u308B\u7DDA\u306E\u9577\u3055(edge) {
|
|
@@ -24098,7 +24124,8 @@ function CdlEdgeView({
|
|
|
24098
24124
|
const isPassThrough = isDotted && Boolean(edge.dThrough);
|
|
24099
24125
|
const lineDotsD = isDotted ? shrinkPathEnd(edge.d, 12) : edge.d;
|
|
24100
24126
|
const glowPathId = `cdl-edge-${edge.id}`;
|
|
24101
|
-
const
|
|
24127
|
+
const \u901A\u308A\u9053\u3092\u7E2E\u3081\u308B = EDGE_HEAD_MARKER_SIZE.\u65E2\u5B9A + \u8D70\u308B\u4E38\u306E\u5916\u5074;
|
|
24128
|
+
const glowPathD = shrinkPathStart(shrinkPathEnd(edge.d, \u901A\u308A\u9053\u3092\u7E2E\u3081\u308B), \u901A\u308A\u9053\u3092\u7E2E\u3081\u308B);
|
|
24102
24129
|
return /* @__PURE__ */ jsxs(
|
|
24103
24130
|
"g",
|
|
24104
24131
|
{
|
|
@@ -24161,7 +24188,7 @@ function CdlEdgeView({
|
|
|
24161
24188
|
}
|
|
24162
24189
|
),
|
|
24163
24190
|
flowing && !isDotted && /* @__PURE__ */ jsxs("g", { "data-cdl-role": "edge-flow", children: [
|
|
24164
|
-
/* @__PURE__ */ jsx("path", { id: glowPathId, d:
|
|
24191
|
+
/* @__PURE__ */ jsx("path", { id: glowPathId, d: glowPathD, fill: "none", stroke: "none" }),
|
|
24165
24192
|
/* @__PURE__ */ jsx(EdgeGlowCircles, { color, edgeId: edge.id })
|
|
24166
24193
|
] })
|
|
24167
24194
|
]
|
|
@@ -24205,10 +24232,13 @@ function SolidEdgePath({
|
|
|
24205
24232
|
}
|
|
24206
24233
|
);
|
|
24207
24234
|
}
|
|
24235
|
+
var \u8D70\u308B\u4E38\u306E\u534A\u5F84 = { \u5916: 28, \u4E2D: 18, \u82AF: 12 };
|
|
24236
|
+
var \u8D70\u308B\u4E38\u306E\u7E01\u306E\u898B\u8FBC\u307F = 2;
|
|
24237
|
+
var \u8D70\u308B\u4E38\u306E\u5916\u5074 = \u8D70\u308B\u4E38\u306E\u534A\u5F84.\u82AF + \u8D70\u308B\u4E38\u306E\u7E01\u306E\u898B\u8FBC\u307F;
|
|
24208
24238
|
function EdgeGlowCircles({ color, edgeId }) {
|
|
24209
24239
|
const ref = `#cdl-edge-${edgeId}`;
|
|
24210
24240
|
return /* @__PURE__ */ jsxs("g", { "data-cdl-particle": edgeId, "data-cdl-particle-path-ref": ref, children: [
|
|
24211
|
-
/* @__PURE__ */ jsxs("circle", { r:
|
|
24241
|
+
/* @__PURE__ */ jsxs("circle", { r: \u8D70\u308B\u4E38\u306E\u534A\u5F84.\u5916, fill: color, children: [
|
|
24212
24242
|
/* @__PURE__ */ jsx("animateMotion", { dur: "2s", begin: "-1s", repeatCount: "indefinite", rotate: "auto", children: /* @__PURE__ */ jsx("mpath", { href: ref }) }),
|
|
24213
24243
|
/* @__PURE__ */ jsx(
|
|
24214
24244
|
"animate",
|
|
@@ -24222,7 +24252,7 @@ function EdgeGlowCircles({ color, edgeId }) {
|
|
|
24222
24252
|
}
|
|
24223
24253
|
)
|
|
24224
24254
|
] }),
|
|
24225
|
-
/* @__PURE__ */ jsxs("circle", { r:
|
|
24255
|
+
/* @__PURE__ */ jsxs("circle", { r: \u8D70\u308B\u4E38\u306E\u534A\u5F84.\u4E2D, fill: color, children: [
|
|
24226
24256
|
/* @__PURE__ */ jsx("animateMotion", { dur: "2s", begin: "-1s", repeatCount: "indefinite", rotate: "auto", children: /* @__PURE__ */ jsx("mpath", { href: ref }) }),
|
|
24227
24257
|
/* @__PURE__ */ jsx(
|
|
24228
24258
|
"animate",
|
|
@@ -24236,7 +24266,7 @@ function EdgeGlowCircles({ color, edgeId }) {
|
|
|
24236
24266
|
}
|
|
24237
24267
|
)
|
|
24238
24268
|
] }),
|
|
24239
|
-
/* @__PURE__ */ jsxs("circle", { r:
|
|
24269
|
+
/* @__PURE__ */ jsxs("circle", { r: \u8D70\u308B\u4E38\u306E\u534A\u5F84.\u82AF, fill: color, children: [
|
|
24240
24270
|
/* @__PURE__ */ jsx("animateMotion", { dur: "2s", begin: "-1s", repeatCount: "indefinite", rotate: "auto", children: /* @__PURE__ */ jsx("mpath", { href: ref }) }),
|
|
24241
24271
|
/* @__PURE__ */ jsx(
|
|
24242
24272
|
"animate",
|