@cardenelabs/cdl 0.21.0 → 0.21.2
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 +37 -1
- package/dist/index.cjs +70 -29
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +70 -29
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +70 -29
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +70 -29
- package/dist/react.js.map +1 -1
- package/package.json +1 -1
- package/src/kinds/generic.tsx +24 -17
- package/src/layout/collisions.ts +72 -10
- package/src/layout/spec.ts +31 -0
package/dist/react.cjs
CHANGED
|
@@ -848,6 +848,18 @@ function \u4E2D\u8EAB\u304B\u3089\u51FA\u3059\u9AD8\u3055(kind, \u6E80\u8F09h, \
|
|
|
848
848
|
return Math.max(MIN_BOX_H, \u6E80\u8F09h - \u5F15\u304F);
|
|
849
849
|
}
|
|
850
850
|
var MIN_BOX_H = 44;
|
|
851
|
+
var CLOUD_CIRCLES = [
|
|
852
|
+
{ cx: -0.8, cy: -0.05 + 0.08, r: 0.32 },
|
|
853
|
+
{ cx: -0.4, cy: -0.05 - 0.05, r: 0.4 },
|
|
854
|
+
{ cx: 0, cy: -0.05 - 0.1, r: 0.46 },
|
|
855
|
+
{ cx: 0.4, cy: -0.05 - 0.05, r: 0.4 },
|
|
856
|
+
{ cx: 0.8, cy: -0.05 + 0.08, r: 0.32 }
|
|
857
|
+
];
|
|
858
|
+
var CLOUD_ART_CENTER_RISE = (() => {
|
|
859
|
+
const \u4E0A = Math.min(...CLOUD_CIRCLES.map((c) => c.cy - c.r));
|
|
860
|
+
const \u4E0B = Math.max(...CLOUD_CIRCLES.map((c) => c.cy + c.r));
|
|
861
|
+
return -(\u4E0A + \u4E0B) / 2;
|
|
862
|
+
})();
|
|
851
863
|
|
|
852
864
|
// src/layout/footer-shape.ts
|
|
853
865
|
var SHAPE_DRAW_UP_EXTENT = {
|
|
@@ -1756,8 +1768,12 @@ function resolveEdgeLabelOverlapsWithChainAndPropagate(edges, obstacles, minClea
|
|
|
1756
1768
|
for (const { p } of ordered) {
|
|
1757
1769
|
const axis = p.axis;
|
|
1758
1770
|
if (!pathShiftIsSafe(e.id, axis, p.sign, amount)) continue;
|
|
1771
|
+
const \u52D5\u304B\u3057\u305F\u5F8C = measurePathLabelGapSegs(
|
|
1772
|
+
simulateShiftedSegments(e, axis === "x" ? p.sign * amount : 0, axis === "y" ? p.sign * amount : 0),
|
|
1773
|
+
label
|
|
1774
|
+
);
|
|
1759
1775
|
out.push({ target: { kind: "edge-path", id: e.id }, axis, sign: p.sign, amount });
|
|
1760
|
-
\u7DDA\u3092\u52D5\u304B\u305B\u305F =
|
|
1776
|
+
\u7DDA\u3092\u52D5\u304B\u305B\u305F = \u52D5\u304B\u3057\u305F\u5F8C > gap;
|
|
1761
1777
|
break;
|
|
1762
1778
|
}
|
|
1763
1779
|
if (!\u7DDA\u3092\u52D5\u304B\u305B\u305F) {
|
|
@@ -1780,16 +1796,49 @@ function resolveEdgeLabelOverlapsWithChainAndPropagate(edges, obstacles, minClea
|
|
|
1780
1796
|
if (\u8FD1\u3044\u70B9) {
|
|
1781
1797
|
const dx = \u82AF.x - \u8FD1\u3044\u70B9.x;
|
|
1782
1798
|
const dy = \u82AF.y - \u8FD1\u3044\u70B9.y;
|
|
1783
|
-
const
|
|
1784
|
-
const \
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
axis,
|
|
1789
|
-
sign
|
|
1790
|
-
|
|
1791
|
-
|
|
1799
|
+
const \u91CF = pathLabelClearance - gap + NEAR_MISS_MARGIN;
|
|
1800
|
+
const \u5019\u88DC = Math.abs(dx) >= Math.abs(dy) ? [
|
|
1801
|
+
{ axis: "x", sign: dx >= 0 ? 1 : -1 },
|
|
1802
|
+
{ axis: "y", sign: dy >= 0 ? 1 : -1 }
|
|
1803
|
+
] : [
|
|
1804
|
+
{ axis: "y", sign: dy >= 0 ? 1 : -1 },
|
|
1805
|
+
{ axis: "x", sign: dx >= 0 ? 1 : -1 }
|
|
1806
|
+
];
|
|
1807
|
+
const \u52D5\u304B\u3057\u305F\u7BB1 = (axis, sign) => ({
|
|
1808
|
+
...label,
|
|
1809
|
+
x: label.x + (axis === "x" ? sign * \u91CF : 0),
|
|
1810
|
+
y: label.y + (axis === "y" ? sign * \u91CF : 0)
|
|
1792
1811
|
});
|
|
1812
|
+
const \u7DDA\u3054\u3068\u306E\u8DDD\u96E2 = (\u7BB1) => {
|
|
1813
|
+
const \u51FA = /* @__PURE__ */ new Map();
|
|
1814
|
+
for (const \u4ED6 of edges) {
|
|
1815
|
+
if (\u4ED6.id === label.id) continue;
|
|
1816
|
+
const segs2 = segmentsExcludingOwnPath(shiftedSegments(\u4ED6.id, \u4ED6.d), ownSegsOf(label.id));
|
|
1817
|
+
if (segs2.length === 0) continue;
|
|
1818
|
+
\u51FA.set(\u4ED6.id, measurePathLabelGapSegs(segs2, \u7BB1));
|
|
1819
|
+
}
|
|
1820
|
+
return \u51FA;
|
|
1821
|
+
};
|
|
1822
|
+
const \u3044\u307E\u306E\u8DDD\u96E2 = \u7DDA\u3054\u3068\u306E\u8DDD\u96E2(label);
|
|
1823
|
+
const \u60AA\u304F\u3059\u308B = (\u7BB1) => {
|
|
1824
|
+
const \u5F8C = \u7DDA\u3054\u3068\u306E\u8DDD\u96E2(\u7BB1);
|
|
1825
|
+
for (const [id, \u524D\u306E\u5024] of \u3044\u307E\u306E\u8DDD\u96E2) {
|
|
1826
|
+
const \u5F8C\u306E\u5024 = \u5F8C.get(id) ?? Infinity;
|
|
1827
|
+
if (\u5F8C\u306E\u5024 < Math.min(\u524D\u306E\u5024, pathLabelClearance)) return true;
|
|
1828
|
+
}
|
|
1829
|
+
return false;
|
|
1830
|
+
};
|
|
1831
|
+
for (const \u5019 of \u5019\u88DC) {
|
|
1832
|
+
if (\u60AA\u304F\u3059\u308B(\u52D5\u304B\u3057\u305F\u7BB1(\u5019.axis, \u5019.sign))) continue;
|
|
1833
|
+
out.push({
|
|
1834
|
+
target: { kind: "label", id: label.id },
|
|
1835
|
+
axis: \u5019.axis,
|
|
1836
|
+
sign: \u5019.sign,
|
|
1837
|
+
amount: \u91CF,
|
|
1838
|
+
chain: false
|
|
1839
|
+
});
|
|
1840
|
+
break;
|
|
1841
|
+
}
|
|
1793
1842
|
}
|
|
1794
1843
|
}
|
|
1795
1844
|
}
|
|
@@ -6818,21 +6867,12 @@ function GenericNode({
|
|
|
6818
6867
|
if (shape === "cloud") {
|
|
6819
6868
|
const cx = w / 2;
|
|
6820
6869
|
const cy = h / 2;
|
|
6821
|
-
const
|
|
6822
|
-
const
|
|
6823
|
-
|
|
6824
|
-
|
|
6825
|
-
|
|
6826
|
-
|
|
6827
|
-
{ cx: cx - halfW * 0.4, cy: cloudCenterY - h * 0.05, r: h * 0.4 },
|
|
6828
|
-
// 左
|
|
6829
|
-
{ cx, cy: cloudCenterY - h * 0.1, r: h * 0.46 },
|
|
6830
|
-
// 中央 (最大)
|
|
6831
|
-
{ cx: cx + halfW * 0.4, cy: cloudCenterY - h * 0.05, r: h * 0.4 },
|
|
6832
|
-
// 右
|
|
6833
|
-
{ cx: cx + halfW * 0.8, cy: cloudCenterY + h * 0.08, r: h * 0.32 }
|
|
6834
|
-
// 右端
|
|
6835
|
-
];
|
|
6870
|
+
const halfW = w * 0.85 / 2;
|
|
6871
|
+
const circles = CLOUD_CIRCLES.map((c) => ({
|
|
6872
|
+
cx: cx + halfW * c.cx,
|
|
6873
|
+
cy: cy + h * c.cy,
|
|
6874
|
+
r: h * c.r
|
|
6875
|
+
}));
|
|
6836
6876
|
return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
|
|
6837
6877
|
circles.map((c, i) => /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: c.cx, cy: c.cy, r: c.r, fill: "var(--cdl-node-fill, #ffffff)" }, `fill-${i}`)),
|
|
6838
6878
|
circles.map((c, i) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -6871,11 +6911,12 @@ function GenericNode({
|
|
|
6871
6911
|
const textX = centered ? w / 2 : 20;
|
|
6872
6912
|
const cylinderShift = genericTextShift(node.kind);
|
|
6873
6913
|
const \u7E70\u308A\u4E0A\u3052 = node.eyebrow || centered ? 0 : \u76EE\u5370\u306A\u3057\u306E\u7E70\u308A\u4E0A\u3052(node.kind, hasRows);
|
|
6874
|
-
const
|
|
6875
|
-
const
|
|
6876
|
-
const
|
|
6914
|
+
const \u7D75\u306E\u82AF = centered && STYLES[node.kind]?.shape === "cloud" ? h * CLOUD_ART_CENTER_RISE : 0;
|
|
6915
|
+
const eyebrowY = centered ? h / 2 - 26 - \u7D75\u306E\u82AF : 32 + cylinderShift;
|
|
6916
|
+
const titleY = genericTitleBaselineY(node.kind, h, hasRows) - \u7E70\u308A\u4E0A\u3052 - \u7D75\u306E\u82AF;
|
|
6917
|
+
const subtitleY = centered ? h / 2 + 28 - \u7D75\u306E\u82AF : 96 + cylinderShift - \u7E70\u308A\u4E0A\u3052;
|
|
6877
6918
|
const iconX = centered ? w / 2 + 40 : w - 48;
|
|
6878
|
-
const iconY = centered ? h / 2 - 44 : 18 + cylinderShift;
|
|
6919
|
+
const iconY = centered ? h / 2 - 44 - \u7D75\u306E\u82AF : 18 + cylinderShift;
|
|
6879
6920
|
const dominantBaseline = centered ? "middle" : void 0;
|
|
6880
6921
|
return /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${x} ${y})`, "data-cdl-role": "node-body", children: [
|
|
6881
6922
|
shapeEl,
|