@mhamz.01/easyflow-whiteboard 2.31.0 → 2.34.0

package/dist/components/node/custom-node-overlay-layer.js

@@ -300,7 +300,7 @@ export default function CanvasOverlayLayer({ tasks, documents, onTasksUpdate, on
                 setLocalDocuments((prev) => prev.map((d) => itemIds.includes(d.id) ? {
                     ...d,
                     x: (startPositions.get(d.id)?.x ?? d.x) + deltaX,
-                    y: (startPositions.get(d.id)?.y ?? d.y),
+                    y: (startPositions.get(d.id)?.y ?? d.y) + deltaY,
                 } : d));
                 // 7. Sync Fabric Objects (Imperative update for performance)
                 canvasObjectsStartPos.forEach((startPos, obj) => {

package/dist/components/whiteboard/whiteboard-test.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"whiteboard-test.d.ts","sourceRoot":"","sources":["../../../src/components/whiteboard/whiteboard-test.tsx"],"names":[],"mappings":"AA4CA,MAAM,CAAC,OAAO,UAAU,gBAAgB,4CAoQvC"}
+{"version":3,"file":"whiteboard-test.d.ts","sourceRoot":"","sources":["../../../src/components/whiteboard/whiteboard-test.tsx"],"names":[],"mappings":"AA4CA,MAAM,CAAC,OAAO,UAAU,gBAAgB,4CA0QvC"}

package/dist/components/whiteboard/whiteboard-test.js

@@ -165,8 +165,11 @@ export default function FabricWhiteboard() {
         const vpt = canvas.viewportTransform;
         if (!vpt)
             return;
-        const cx = (canvas.getWidth() / 2 - vpt[4]) / canvasZoom;
-        const cy = (canvas.getHeight() / 2 - vpt[5]) / canvasZoom;
+        // vpt[0] = live zoom, vpt[4]/vpt[5] = live pan
+        // Never use canvasZoom state here — it can be 1 render behind
+        const liveZoom = vpt[0];
+        const cx = (canvas.getWidth() / 2 - vpt[4]) / liveZoom;
+        const cy = (canvas.getHeight() / 2 - vpt[5]) / liveZoom;
         setTasks((prev) => [
             ...prev,
             {
@@ -184,14 +187,15 @@ export default function FabricWhiteboard() {
         const vpt = canvas.viewportTransform;
         if (!vpt)
             return;
-        const cx = (canvas.getWidth() / 2 - vpt[4]) / canvasZoom;
-        const cy = (canvas.getHeight() / 2 - vpt[5]) / canvasZoom;
+        const liveZoom = vpt[0];
+        const cx = (canvas.getWidth() / 2 - vpt[4]) / liveZoom;
+        const cy = (canvas.getHeight() / 2 - vpt[5]) / liveZoom;
         setDocuments((prev) => [
             ...prev,
             {
                 ...docTemplate,
                 id: `${docTemplate.id}-${Date.now()}`,
-                x: cx - 150,
+                x: cx - 160, // 320px wide → center offset
                 y: cy - 80,
             },
         ]);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mhamz.01/easyflow-whiteboard",
-    "version": "2.31.0",
+    "version": "2.34.0",
     "description": "A feature-rich whiteboard component built with Fabric.js and React",
     "main": "dist/index.js",
     "types": "dist/index.d.ts",