@avodado/render 0.2.4 → 0.2.5
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/index.js +10 -8
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -3624,7 +3624,7 @@ function umlRel(kind) {
|
|
|
3624
3624
|
function renderUml(data) {
|
|
3625
3625
|
const classes = data.classes ?? [];
|
|
3626
3626
|
const rels = data.rels ?? [];
|
|
3627
|
-
const colW =
|
|
3627
|
+
const colW = 144;
|
|
3628
3628
|
const rowH = 14;
|
|
3629
3629
|
const headH = (c) => 22 + (c.stereotype !== void 0 ? 10 : 0);
|
|
3630
3630
|
const compH = (list) => (list !== void 0 && list.length > 0 ? list.length * rowH : 6) + 8;
|
|
@@ -3645,7 +3645,7 @@ function renderUml(data) {
|
|
|
3645
3645
|
const n = g.node(c.id);
|
|
3646
3646
|
if (n !== void 0) at2.set(c.id, { x: n.x - colW / 2, y: n.y - clsH(c) / 2 });
|
|
3647
3647
|
}
|
|
3648
|
-
let s = `<svg viewBox="0 0 ${width} ${height}" role="img"><title>UML class diagram</title><defs><marker id="umlTri" viewBox="0 0 14 14" refX="13" refY="7" markerWidth="
|
|
3648
|
+
let s = `<svg viewBox="0 0 ${width} ${height}" role="img"><title>UML class diagram</title><defs><marker id="umlTri" viewBox="0 0 14 14" refX="13" refY="7" markerWidth="13" markerHeight="13" markerUnits="userSpaceOnUse" orient="auto-start-reverse"><path d="M1,1 L13,7 L1,13 z" fill="var(--white)" stroke="var(--charcoal)" stroke-width="1.2"/></marker><marker id="umlDiaF" viewBox="0 0 20 12" refX="19" refY="6" markerWidth="11" markerHeight="7" markerUnits="userSpaceOnUse" orient="auto-start-reverse"><path d="M1,6 L10,1 L19,6 L10,11 z" fill="var(--charcoal)"/></marker><marker id="umlDiaH" viewBox="0 0 20 12" refX="19" refY="6" markerWidth="11" markerHeight="7" markerUnits="userSpaceOnUse" orient="auto-start-reverse"><path d="M1,6 L10,1 L19,6 L10,11 z" fill="var(--white)" stroke="var(--charcoal)" stroke-width="1.2"/></marker><marker id="umlOpen" viewBox="0 0 12 12" refX="10" refY="6" markerWidth="12" markerHeight="12" markerUnits="userSpaceOnUse" orient="auto-start-reverse"><path d="M1,1 L11,6 L1,11" fill="none" stroke="var(--charcoal)" stroke-width="1.3"/></marker></defs>`;
|
|
3649
3649
|
const labels = [];
|
|
3650
3650
|
validRels.forEach((rl, i) => {
|
|
3651
3651
|
const e = g.edge(rl.from, rl.to, `e${i}`);
|
|
@@ -3758,7 +3758,8 @@ function renderMece(data) {
|
|
|
3758
3758
|
const y = yOf(n.id);
|
|
3759
3759
|
const st2 = meceStyle(depth.get(n.id) ?? 0);
|
|
3760
3760
|
const stroke = st2.solid === true ? "none" : st2.accent;
|
|
3761
|
-
const stripe = st2.solid === true ? "" : `<rect x="${x2}" y="${y}" width="5" height="${nodeH}"
|
|
3761
|
+
const stripe = st2.solid === true ? "" : `<rect x="${x2}" y="${y}" width="5" height="${nodeH}" fill="${st2.accent}"/>`;
|
|
3762
|
+
const card = st2.solid === true ? `<rect x="${x2}" y="${y}" width="${nodeW}" height="${nodeH}" rx="6" fill="${st2.fill}" stroke="${stroke}" stroke-width="1.3"/>` : `<path d="${rectRoundRight(x2, y, nodeW, nodeH, 6)}" fill="${st2.fill}" stroke="${stroke}" stroke-width="1.3"/>`;
|
|
3762
3763
|
const labelX = x2 + (st2.solid === true ? nodeW / 2 : 14);
|
|
3763
3764
|
const anchor = st2.solid === true ? "middle" : "start";
|
|
3764
3765
|
const lines = wrapText(n.label, st2.solid === true ? 22 : 20, n.note !== void 0 ? 1 : 2);
|
|
@@ -3767,7 +3768,7 @@ function renderMece(data) {
|
|
|
3767
3768
|
(ln2, j2) => `<text x="${labelX}" y="${startY + j2 * 14}" class="blk-name" fill="${st2.text}" text-anchor="${anchor}">${escapeHtml(ln2)}</text>`
|
|
3768
3769
|
).join("");
|
|
3769
3770
|
const note = n.note !== void 0 ? `<text x="${labelX}" y="${y + 38}" class="ft-note" fill="${st2.solid === true ? "#cfe0f3" : st2.accent}" text-anchor="${anchor}">${escapeHtml(n.note)}</text>` : "";
|
|
3770
|
-
s += `<g filter="url(#gshadow)"
|
|
3771
|
+
s += `<g filter="url(#gshadow)">` + card + stripe + labelTexts + note + `</g>`;
|
|
3771
3772
|
}
|
|
3772
3773
|
s += `</svg>`;
|
|
3773
3774
|
return diagramFrame(
|
|
@@ -3869,7 +3870,8 @@ function renderFrontend(data) {
|
|
|
3869
3870
|
const y = yOf(n.id);
|
|
3870
3871
|
const st2 = ftStyle(n.kind);
|
|
3871
3872
|
const stroke = st2.solid === true ? "none" : st2.accent;
|
|
3872
|
-
const stripe = st2.solid === true ? "" : `<rect x="${x2}" y="${y}" width="5" height="${nodeH}"
|
|
3873
|
+
const stripe = st2.solid === true ? "" : `<rect x="${x2}" y="${y}" width="5" height="${nodeH}" fill="${st2.accent}"/>`;
|
|
3874
|
+
const card = st2.solid === true ? `<rect x="${x2}" y="${y}" width="${nodeW}" height="${nodeH}" rx="8" fill="${st2.fill}" stroke="${stroke}" stroke-width="1.2"/>` : `<path d="${rectRoundRight(x2, y, nodeW, nodeH, 8)}" fill="${st2.fill}" stroke="${stroke}" stroke-width="1.2"/>`;
|
|
3873
3875
|
const labelX = x2 + (st2.solid === true ? nodeW / 2 : 14);
|
|
3874
3876
|
const anchor = st2.solid === true ? "middle" : "start";
|
|
3875
3877
|
const lines = wrapText(n.name, st2.solid === true ? 20 : 18, n.note !== void 0 ? 1 : 2);
|
|
@@ -3878,7 +3880,7 @@ function renderFrontend(data) {
|
|
|
3878
3880
|
(ln2, j2) => `<text x="${labelX}" y="${startY + j2 * 14}" class="blk-name" fill="${st2.text}" text-anchor="${anchor}">${escapeHtml(ln2)}</text>`
|
|
3879
3881
|
).join("");
|
|
3880
3882
|
const note = n.note !== void 0 ? `<text x="${labelX}" y="${y + 41}" class="ft-note" fill="${st2.solid === true ? "#cfe0f3" : st2.accent}" text-anchor="${anchor}">${escapeHtml(n.note)}</text>` : "";
|
|
3881
|
-
s += `<g filter="url(#gshadow)"
|
|
3883
|
+
s += `<g filter="url(#gshadow)">` + card + stripe + labelTexts + note + `</g>`;
|
|
3882
3884
|
}
|
|
3883
3885
|
s += `</svg>`;
|
|
3884
3886
|
return diagramFrame(
|
|
@@ -3944,7 +3946,7 @@ function renderCluster(data) {
|
|
|
3944
3946
|
let s = `<svg viewBox="0 0 ${width} ${height}" role="img"><title>Cluster diagram</title>`;
|
|
3945
3947
|
for (const cb of clusterBoxes) {
|
|
3946
3948
|
const kindLabel = cb.c.kind !== void 0 ? `<text x="${cb.x + cb.w - 14}" y="${cb.y + 21}" class="cl-kind">${escapeHtml(cb.c.kind)}</text>` : "";
|
|
3947
|
-
s += `<g><rect x="${cb.x}" y="${cb.y}" width="${cb.w}" height="${cb.h}" rx="12" fill="
|
|
3949
|
+
s += `<g><rect x="${cb.x}" y="${cb.y}" width="${cb.w}" height="${cb.h}" rx="12" fill="var(--navy)" fill-opacity="0.035" stroke="var(--navy)" stroke-width="1.4" stroke-dasharray="8 5"/><rect x="${cb.x}" y="${cb.y}" width="${cb.w}" height="${cHeader}" rx="12" fill="var(--navy)"/><rect x="${cb.x}" y="${cb.y + cHeader - 12}" width="${cb.w}" height="12" fill="#0e54a1"/><text x="${cb.x + 16}" y="${cb.y + 21}" class="cl-head">${escapeHtml(cb.c.label)}</text>` + kindLabel + `</g>`;
|
|
3948
3950
|
}
|
|
3949
3951
|
for (const e of edges) {
|
|
3950
3952
|
const A2 = rects.get(e.from);
|
|
@@ -3976,7 +3978,7 @@ function renderCluster(data) {
|
|
|
3976
3978
|
}
|
|
3977
3979
|
return `<g>` + bars + `<text x="${r.x + 12 + shown * 8 + 4}" y="${r.y + r.h - 7}" class="blk-tech" fill="${st2.accent}">\xD7${reps}</text></g>`;
|
|
3978
3980
|
})() : "";
|
|
3979
|
-
s += `<g filter="url(#gshadow)"><
|
|
3981
|
+
s += `<g filter="url(#gshadow)"><path d="${rectRoundRight(r.x, r.y, r.w, r.h, 8)}" fill="${st2.fill}" stroke="${st2.accent}" stroke-width="1.2"/><rect x="${r.x}" y="${r.y}" width="5" height="${r.h}" fill="${st2.accent}"/>` + gl + `<text x="${nx}" y="${r.y + (sv.tech !== void 0 ? 26 : 30)}" class="blk-name" fill="${st2.text}" style="font-size:12px">${escapeHtml(sv.label)}</text>` + techLine + repIndicator + `</g>`;
|
|
3980
3982
|
}
|
|
3981
3983
|
s += `</svg>`;
|
|
3982
3984
|
return diagramFrame(
|