@mhamz.01/easyflow-whiteboard 2.164.0 → 2.166.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;;AAkBD,wBAsuBG"}
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;;AAkBD,wBAyvBG"}
@@ -21,6 +21,7 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
21
21
  const isSelectionBoxActiveRef = useRef(false);
22
22
  const htmlNodesSelectedByBoxRef = useRef(false);
23
23
  const dragSelectedIdsRef = useRef(new Set());
24
+ const fabricActiveObjRef = useRef(null);
24
25
  localTasksRef.current = localTasks;
25
26
  localDocumentsRef.current = localDocuments;
26
27
  selectedIdsRef.current = selectedIds;
@@ -192,9 +193,19 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
192
193
  };
193
194
  canvas.on("object:moving", handleObjectMoving);
194
195
  canvas.on("mouse:down", handleMouseDown);
195
- canvas.on("selection:created", handleFabricSelectionCreated); // ← add
196
- canvas.on("selection:updated", handleFabricSelectionUpdated); // ← add
197
- // canvas.on("selection:cleared", handleSelectionCleared);
196
+ canvas.on("selection:created", (e) => {
197
+ fabricActiveObjRef.current = canvas.getActiveObject() ?? null;
198
+ handleFabricSelectionCreated();
199
+ }); // ← add
200
+ canvas.on("selection:updated", (e) => {
201
+ fabricActiveObjRef.current = canvas.getActiveObject() ?? null;
202
+ handleFabricSelectionUpdated();
203
+ }); // ← add
204
+ canvas.on("selection:cleared", () => {
205
+ if (!isSelectionBoxActiveRef.current) {
206
+ fabricActiveObjRef.current = null;
207
+ }
208
+ });
198
209
  return () => {
199
210
  canvas.off("object:moving", handleObjectMoving);
200
211
  canvas.off("mouse:down", handleMouseDown);
@@ -271,7 +282,7 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
271
282
  const canvas = fabricCanvas?.current;
272
283
  if (!canvas)
273
284
  return;
274
- const groupObj = canvas.getActiveObject();
285
+ const groupObj = fabricActiveObjRef.current;
275
286
  const liveActiveObjects = canvas.getActiveObjects();
276
287
  // 2. Normalize the event (Touch vs Mouse)
277
288
  if (e.cancelable)
@@ -314,6 +325,9 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
314
325
  const canvasObjectsStartPos = new Map();
315
326
  // snapshot members too
316
327
  console.log("groupObj at drag start:", groupObj?.type, groupObj?.left, groupObj?.top);
328
+ console.log("clickedPos:", clickedPos.x, clickedPos.y);
329
+ console.log("groupObj.left/top:", groupObj?.left, groupObj?.top);
330
+ console.log("deltaFromAnchor:", (groupObj?.left || 0) - clickedPos.x, (groupObj?.top || 0) - clickedPos.y);
317
331
  const groupStartPos = (groupObj && groupObj.type === "activeSelection")
318
332
  ? {
319
333
  left: groupObj.left || 0,
@@ -418,6 +432,9 @@ export default React.memo(function CanvasOverlayLayer({ tasks, documents, onTask
418
432
  const { groupStartPos } = dragStateRef.current;
419
433
  if (groupStartPos) {
420
434
  const activeObj = canvas.getActiveObject();
435
+ console.log("anchorTargetX:", anchorTargetX, "anchorTargetY:", anchorTargetY);
436
+ console.log("setting group to:", anchorTargetX + groupStartPos.deltaFromAnchor.x, anchorTargetY + groupStartPos.deltaFromAnchor.y);
437
+ console.log("activeObj type:", activeObj?.type, "activeObj left/top:", activeObj?.left, activeObj?.top);
421
438
  if (activeObj) {
422
439
  // anchorTargetX is where the HTML anchor node IS right now in world units
423
440
  activeObj.set({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mhamz.01/easyflow-whiteboard",
3
- "version": "2.164.0",
3
+ "version": "2.166.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",