sketchmark 1.3.6 → 1.3.7

package/dist/renderer/svg/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/renderer/svg/index.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EACV,UAAU,EAEX,MAAM,aAAa,CAAC;AAoQrB,MAAM,WAAW,kBAAkB;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,WAAW,CACzB,EAAE,EAAE,UAAU,EACd,SAAS,EAAE,WAAW,GAAG,aAAa,EACtC,OAAO,GAAE,kBAAuB,GAC/B,aAAa,CAglBf;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,aAAa,GAAG,MAAM,CAKtD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/renderer/svg/index.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EACV,UAAU,EAKX,MAAM,aAAa,CAAC;AA0TrB,MAAM,WAAW,kBAAkB;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,WAAW,CACzB,EAAE,EAAE,UAAU,EACd,SAAS,EAAE,WAAW,GAAG,aAAa,EACtC,OAAO,GAAE,kBAAuB,GAC/B,aAAa,CAolBf;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,aAAa,GAAG,MAAM,CAKtD"}

package/dist/sketchmark.iife.js

@@ -8281,6 +8281,36 @@ var AIDiagram = (function (exports) {
         if (groupId)
             el.dataset.parentGroup = groupId;
     }
+    function resolveEdgeEndpointKind(id, nm, tm, gm, cm) {
+        if (nm.has(id))
+            return "node";
+        if (gm.has(id))
+            return "group";
+        if (tm.has(id))
+            return "table";
+        if (cm.has(id))
+            return "chart";
+        return null;
+    }
+    function collectEdgeGroupLineage(endpointId, endpointKind, parentGroups) {
+        const lineage = [];
+        let groupId = endpointKind === "group"
+            ? endpointId
+            : parentGroups.get(`${endpointKind}:${endpointId}`);
+        while (groupId) {
+            lineage.push(groupId);
+            groupId = parentGroups.get(`group:${groupId}`);
+        }
+        return lineage;
+    }
+    function resolveEdgeParentGroupId(fromId, toId, nm, tm, gm, cm, parentGroups) {
+        const fromKind = resolveEdgeEndpointKind(fromId, nm, tm, gm, cm);
+        const toKind = resolveEdgeEndpointKind(toId, nm, tm, gm, cm);
+        if (!fromKind || !toKind)
+            return undefined;
+        const toLineage = new Set(collectEdgeGroupLineage(toId, toKind, parentGroups));
+        return collectEdgeGroupLineage(fromId, fromKind, parentGroups).find((groupId) => toLineage.has(groupId));
+    }
     // ── Node shapes ───────────────────────────────────────────────────────────
     function renderShape$1(rc, n, palette) {
         const s = n.style ?? {};
@@ -8438,6 +8468,7 @@ var AIDiagram = (function (exports) {
             const [x1, y1] = getConnPoint(src, dstCX, dstCY, e.fromAnchor);
             const [x2, y2] = getConnPoint(dst, srcCX, srcCY, e.toAnchor);
             const eg = mkGroup(`edge-${e.from}-${e.to}`, "eg");
+            setParentGroupData(eg, resolveEdgeParentGroupId(e.from, e.to, nm, tm, gmMap, cm, parentGroups));
             if (e.style?.opacity != null)
                 eg.setAttribute("opacity", String(e.style.opacity));
             const len = Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2) || 1;
@@ -9484,7 +9515,7 @@ var AIDiagram = (function (exports) {
     const getNoteEl = (svg, id) => getEl(svg, `note-${id}`);
     const getChartEl = (svg, id) => getEl(svg, `chart-${id}`);
     const getMarkdownEl = (svg, id) => getEl(svg, `markdown-${id}`);
-    const POSITIONABLE_SELECTOR = ".ng, .gg, .tg, .ntg, .cg, .mdg";
+    const POSITIONABLE_SELECTOR = ".ng, .gg, .tg, .ntg, .cg, .eg, .mdg";
     function resolveNonEdgeDrawEl(svg, target) {
         return (getGroupEl(svg, target) ??
             getTableEl(svg, target) ??
@@ -10078,8 +10109,16 @@ var AIDiagram = (function (exports) {
         _buildDrawStepIndex() {
             const drawStepIndexByElementId = new Map();
             forEachPlaybackStep(this.steps, (step, stepIndex) => {
-                if (step.action !== "draw" || parseEdgeTarget(step.target))
+                if (step.action !== "draw")
                     return;
+                const edge = parseEdgeTarget(step.target);
+                if (edge) {
+                    const edgeEl = getEdgeEl(this.svg, edge.from, edge.to);
+                    if (edgeEl && !drawStepIndexByElementId.has(edgeEl.id)) {
+                        drawStepIndexByElementId.set(edgeEl.id, stepIndex);
+                    }
+                    return;
+                }
                 const el = resolveNonEdgeDrawEl(this.svg, step.target);
                 if (el && !drawStepIndexByElementId.has(el.id)) {
                     drawStepIndexByElementId.set(el.id, stepIndex);
@@ -10779,6 +10818,7 @@ var AIDiagram = (function (exports) {
                 const el = getEdgeEl(this.svg, edge.from, edge.to);
                 if (!el)
                     return;
+                showDrawEl(el);
                 if (silent) {
                     revealEdgeInstant(el);
                     requestAnimationFrame(() => requestAnimationFrame(() => {
@@ -11392,11 +11432,12 @@ var AIDiagram = (function (exports) {
 .cg.faded, .eg.faded, .mdg.faded { opacity: 0.22; }
 
 .ng.hidden { opacity: 0; pointer-events: none; }
-.gg.gg-hidden  { opacity: 0; }
-.tg.gg-hidden  { opacity: 0; }
-.ntg.gg-hidden { opacity: 0; }
-.cg.gg-hidden  { opacity: 0; }
-.mdg.gg-hidden { opacity: 0; }
+.gg.gg-hidden  { opacity: 0; }
+.tg.gg-hidden  { opacity: 0; }
+.ntg.gg-hidden { opacity: 0; }
+.cg.gg-hidden  { opacity: 0; }
+.eg.gg-hidden  { opacity: 0; }
+.mdg.gg-hidden { opacity: 0; }
 
 /* narration caption */
 .skm-caption { pointer-events: none; user-select: none; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sketchmark",
-  "version": "1.3.6",
+  "version": "1.3.7",
   "description": "A plain-text DSL for hand-drawn diagrams. Write boxes, edges, and groups as code — renders sketchy SVG/Canvas via rough.js with a built-in step-by-step animation system.",
   "keywords": [
     "diagram",