@mhamz.01/easyflow-whiteboard 2.157.0 → 2.160.0

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.
@@ -1 +1 @@
1
- {"version":3,"file":"custom-node-overlay-layer.d.ts","sourceRoot":"","sources":["../../../src/components/node/custom-node-overlay-layer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAI9C,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM,CAAC;IACxC,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,UAAU,uBAAuB;IAC/B,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACxC,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAC;IACpD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,YAAY,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACzE,qBAAqB,CAAC,EAAE,YAAY,EAAE,CAAC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IAC9C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,MAAM,IAAI,CAAC,CAAC;CAC5D;;AAaD,wBA2tBG"}
1
+ {"version":3,"file":"custom-node-overlay-layer.d.ts","sourceRoot":"","sources":["../../../src/components/node/custom-node-overlay-layer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAI9C,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM,CAAC;IACxC,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,UAAU,uBAAuB;IAC/B,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACxC,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAC;IACpD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,YAAY,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACzE,qBAAqB,CAAC,EAAE,YAAY,EAAE,CAAC;IACvC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IAC9C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,MAAM,IAAI,CAAC,CAAC;CAC5D;;AAcD,wBAutBG"}
@@ -31,6 +31,7 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
31
31
  canvasObjectsStartPos: new Map(),
32
32
  offsetX: 0,
33
33
  offsetY: 0,
34
+ groupStartPos: null, // ← add this
34
35
  });
35
36
  const rafIdRef = useRef(null);
36
37
  const fabricMoveRafRef = useRef(null); // Issue 7
@@ -309,31 +310,25 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
309
310
  startPositions.set(id, pos);
310
311
  });
311
312
  const liveActiveObjects = canvas.getActiveObjects();
312
- const activeSelection = canvas.getActiveObject();
313
313
  const canvasObjectsStartPos = new Map();
314
- liveActiveObjects.forEach((obj) => {
315
- if (activeSelection && activeSelection.type === "activeSelection") {
316
- // Store group-relative left/top, NOT world transform
317
- canvasObjectsStartPos.set(obj, {
318
- left: obj.left || 0,
319
- top: obj.top || 0,
320
- });
321
- }
322
- else {
323
- canvasObjectsStartPos.set(obj, {
324
- left: obj.left || 0,
325
- top: obj.top || 0,
326
- });
327
- }
328
- });
314
+ const groupObj = canvas.getActiveObject();
315
+ const groupStartPos = (groupObj && groupObj.type === "activeSelection")
316
+ ? { left: groupObj.left || 0, top: groupObj.top || 0 }
317
+ : null;
318
+ if (!groupStartPos) {
319
+ liveActiveObjects.forEach((obj) => {
320
+ canvasObjectsStartPos.set(obj, { left: obj.left || 0, top: obj.top || 0 });
321
+ });
322
+ }
329
323
  // 10. Commit to the ref for the requestAnimationFrame loop
330
324
  dragStateRef.current = {
331
325
  isDragging: true,
332
326
  itemIds: itemsToDrag,
333
327
  startPositions,
334
328
  canvasObjectsStartPos,
335
- offsetX: worldOffsetX, // ← was clickWorldX, should be the offset
336
- offsetY: worldOffsetY, // ← was clickWorldY
329
+ groupStartPos, // ← add this field
330
+ offsetX: worldOffsetX,
331
+ offsetY: worldOffsetY,
337
332
  };
338
333
  // if (!selectedIdsRef.current.has(itemId) && dragStateRef.current.itemIds.length === 0) {
339
334
  // setSelectedIds(new Set([itemId]));
@@ -402,31 +397,30 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
402
397
  }
403
398
  : d));
404
399
  // 7. Sync Fabric Objects (Imperative update for performance)
405
- canvasObjectsStartPos.forEach((startPos, obj) => {
406
- obj.set({
407
- left: startPos.left + deltaX,
408
- top: startPos.top + deltaY,
409
- });
410
- obj.setCoords(); // Required for selection/intersection accuracy
411
- });
400
+ // canvasObjectsStartPos.forEach((startPos, obj) => {
401
+ // obj.set({
402
+ // left: startPos.left + deltaX,
403
+ // top: startPos.top + deltaY,
404
+ // });
405
+ // obj.setCoords(); // Required for selection/intersection accuracy
406
+ // });
412
407
  const activeObj = canvas.getActiveObject();
413
408
  if (activeObj && activeObj.type === "activeSelection") {
414
- // Snapshot the group's start position once
415
- // Move the group as a whole — Fabric will keep members' relative offsets intact
416
- const groupStart = dragStateRef.current.canvasObjectsStartPos.get(activeObj);
417
- if (groupStart) {
418
- activeObj.set({ left: groupStart.left + deltaX, top: groupStart.top + deltaY });
409
+ const { groupStartPos } = dragStateRef.current;
410
+ if (groupStartPos) {
411
+ activeObj.set({
412
+ left: groupStartPos.left + deltaX,
413
+ top: groupStartPos.top + deltaY,
414
+ });
419
415
  activeObj.setCoords();
420
416
  }
421
417
  }
422
418
  else {
423
- // Single objects — move individually as before
424
419
  canvasObjectsStartPos.forEach((startPos, obj) => {
425
420
  obj.set({ left: startPos.left + deltaX, top: startPos.top + deltaY });
426
421
  obj.setCoords();
427
422
  });
428
423
  }
429
- // 8. Single render call for all Fabric changes
430
424
  canvas.requestRenderAll();
431
425
  });
432
426
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mhamz.01/easyflow-whiteboard",
3
- "version": "2.157.0",
3
+ "version": "2.160.0",
4
4
  "description": "A feature-rich whiteboard component built with Fabric.js and React",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",