@canvas-harness/core 0.1.1 → 0.1.2

package/dist/index.cjs

@@ -4871,16 +4871,18 @@ var applyCameraTransform = (surface, camera) => {
 };
 var worldViewport = (surface, camera) => viewportWorldRect(camera, surface.cssWidth, surface.cssHeight);
 var drawWithNodeTransform = (ctx, node, fn) => {
-  ctx.save();
   if (node.angle === 0) {
     ctx.translate(node.x, node.y);
-  } else {
-    const cx = node.x + node.w / 2;
-    const cy = node.y + node.h / 2;
-    ctx.translate(cx, cy);
-    ctx.rotate(node.angle);
-    ctx.translate(-node.w / 2, -node.h / 2);
+    fn();
+    ctx.translate(-node.x, -node.y);
+    return;
   }
+  ctx.save();
+  const cx = node.x + node.w / 2;
+  const cy = node.y + node.h / 2;
+  ctx.translate(cx, cy);
+  ctx.rotate(node.angle);
+  ctx.translate(-node.w / 2, -node.h / 2);
   fn();
   ctx.restore();
 };
@@ -4902,6 +4904,12 @@ var createRenderer = (opts) => {
   let interactiveDirty = false;
   let overlaySet = /* @__PURE__ */ new Set();
   let lastDrawn = 0;
+  let sortedNodeIdsCache = null;
+  let sortedEdgeIdsCache = null;
+  const invalidateSortedCaches = () => {
+    sortedNodeIdsCache = null;
+    sortedEdgeIdsCache = null;
+  };
   const requestRepaint = () => {
     staticDirty = true;
     loop.requestFrame();
@@ -5031,7 +5039,9 @@ var createRenderer = (opts) => {
       }
       if (def.renderCanvas) {
         drawWithNodeTransform(staticSurface.ctx, node, () => {
+          staticSurface.ctx.save();
           def.renderCanvas(staticSurface.ctx, node, renderEnv);
+          staticSurface.ctx.restore();
         });
         drawn++;
       }
@@ -5064,11 +5074,19 @@ var createRenderer = (opts) => {
       }
     }
     if (def.drawPlaceholder) {
-      drawWithNodeTransform(ctx, node, () => def.drawPlaceholder(ctx, node, env));
+      drawWithNodeTransform(ctx, node, () => {
+        ctx.save();
+        def.drawPlaceholder(ctx, node, env);
+        ctx.restore();
+      });
       return true;
     }
     if (def.renderCanvas) {
-      drawWithNodeTransform(ctx, node, () => def.renderCanvas(ctx, node, env));
+      drawWithNodeTransform(ctx, node, () => {
+        ctx.save();
+        def.renderCanvas(ctx, node, env);
+        ctx.restore();
+      });
       return true;
     }
     return false;
@@ -5135,14 +5153,23 @@ var createRenderer = (opts) => {
       isMoving: isMoving2
     });
   };
+  const getSortedEdgeIds = () => {
+    if (sortedEdgeIdsCache) return sortedEdgeIdsCache;
+    const all = store.getAllEdges();
+    sortedEdgeIdsCache = all.slice().sort((a, b) => a.z - b.z || (a.id < b.id ? -1 : 1)).map((e) => e.id);
+    return sortedEdgeIdsCache;
+  };
   const visibleEdges = (viewport) => {
     const ids = store.querySpatial({ rect: viewport }).edges;
+    if (ids.length === 0) return [];
+    const visibleSet = new Set(ids);
+    const sorted = getSortedEdgeIds();
     const result = [];
-    for (const id of ids) {
+    for (const id of sorted) {
+      if (!visibleSet.has(id)) continue;
       const e = store.getEdge(id);
       if (e) result.push(e);
     }
-    result.sort((a, b) => a.z - b.z || (a.id < b.id ? -1 : 1));
     return result;
   };
   const paintInteractive = () => {
@@ -5290,21 +5317,31 @@ var createRenderer = (opts) => {
     }
     return m;
   };
+  const getSortedNodeIds = () => {
+    if (sortedNodeIdsCache) return sortedNodeIdsCache;
+    const all = store.getAllNodes();
+    sortedNodeIdsCache = all.slice().sort((a, b) => a.z - b.z || (a.id < b.id ? -1 : 1)).map((n) => n.id);
+    return sortedNodeIdsCache;
+  };
   const visibleNodes = (camera, viewport) => {
     const ids = store.querySpatial({ rect: viewport }).nodes;
+    if (ids.length === 0) return [];
+    const visibleSet = new Set(ids);
+    const sorted = getSortedNodeIds();
     const result = [];
     const minWorldSize = MIN_ON_SCREEN_SIZE_PX / camera.z;
-    for (const id of ids) {
+    for (const id of sorted) {
+      if (!visibleSet.has(id)) continue;
       const n = store.getNode(id);
       if (!n) continue;
       if (n.w < minWorldSize && n.h < minWorldSize) continue;
       if (intersectsViewport(n, viewport)) result.push(n);
     }
-    result.sort((a, b) => a.z - b.z || (a.id < b.id ? -1 : 1));
     return result;
   };
   const loop = createFrameLoop({ draw: drawFrame });
   const onStoreChange = () => {
+    invalidateSortedCaches();
     staticDirty = true;
     interactiveDirty = true;
     loop.requestFrame();