@mocanvas/editor 4.12.1 → 4.12.3

package/dist/index.js

@@ -9130,7 +9130,9 @@ var Editor = class extends EventEmitter {
       }
       if (patches.length) this.updateShapes(patches);
     });
-    return ids.map((id) => idMap.get(id));
+    const duplicates = ids.map((id) => idMap.get(id));
+    this.setSelectedShapes(duplicates);
+    return duplicates;
   }
   /** Serializable content for the clipboard: shapes (with descendants) and bindings between them. */
   getContentFromCurrentPage(ids) {
@@ -14849,6 +14851,8 @@ function resolveTarget(editor, point) {
   if (filled && editor.getSelectedShapeIds().includes(filled.id)) return { target: "shape", shape: filled };
   return { target: "canvas" };
 }
+var IN_FRONT_OF_CANVAS_CLASS = "mocanvas-in-front-of-canvas";
+var IN_FRONT_OF_CANVAS_SELECTOR = `.${IN_FRONT_OF_CANVAS_CLASS}`;
 function useCanvasEvents(editor) {
   return useMemo(() => {
     const pointerInfo = (e, name) => {
@@ -14865,9 +14869,12 @@ function useCanvasEvents(editor) {
       };
     };
     const isHandled = (e) => editor.isEventHandled(e);
+    const isInFrontOfCanvas = (target) => target instanceof Element && target.closest(IN_FRONT_OF_CANVAS_SELECTOR) !== null;
+    const isElsewhere = (e) => e.currentTarget instanceof Node && e.target instanceof Node && !e.currentTarget.contains(e.target);
+    const ownPointers = /* @__PURE__ */ new Set();
     return {
       onPointerDown(e) {
-        if (isHandled(e)) return;
+        if (isHandled(e) || isInFrontOfCanvas(e.target) || isElsewhere(e)) return;
         if (e.button === 2) {
           editor.dispatch(pointerInfo(e, "right_click"));
           return;
@@ -14875,6 +14882,7 @@ function useCanvasEvents(editor) {
         if (e.button === 1) {
           editor.dispatch(pointerInfo(e, "middle_click"));
         }
+        ownPointers.add(e.pointerId);
         e.currentTarget.setPointerCapture(e.pointerId);
         editor.getContainer().focus({ preventScroll: true });
         const down = pointerInfo(e, "pointer_down");
@@ -14882,16 +14890,18 @@ function useCanvasEvents(editor) {
         editor.dispatch(down);
       },
       onPointerMove(e) {
-        if (isHandled(e)) return;
+        if (isHandled(e) || isInFrontOfCanvas(e.target) || isElsewhere(e)) return;
         if (e.pointerType === "mouse" && e.buttons === 0 && editor.inputs.isPointing) {
+          ownPointers.delete(e.pointerId);
           editor.dispatch(pointerInfo(e, "pointer_up"));
           return;
         }
         editor.dispatch(pointerInfo(e, "pointer_move"));
       },
       onPointerUp(e) {
-        if (isHandled(e)) return;
+        if (isHandled(e) || isInFrontOfCanvas(e.target) || isElsewhere(e)) return;
         if (e.button === 2) return;
+        if (!ownPointers.delete(e.pointerId)) return;
         const el = e.currentTarget;
         if (el.hasPointerCapture(e.pointerId)) el.releasePointerCapture(e.pointerId);
         const up = pointerInfo(e, "pointer_up");
@@ -14899,12 +14909,13 @@ function useCanvasEvents(editor) {
         editor.click.handlePointerEvent(up);
       },
       onPointerCancel(e) {
-        if (isHandled(e)) return;
+        if (isHandled(e) || isInFrontOfCanvas(e.target) || isElsewhere(e)) return;
+        if (!ownPointers.delete(e.pointerId)) return;
         editor.dispatch(pointerInfo(e, "pointer_up"));
         editor.cancel();
       },
       onWheel(e) {
-        if (isHandled(e)) return;
+        if (isHandled(e) || isInFrontOfCanvas(e.target) || isElsewhere(e)) return;
         e.preventDefault();
         const point = localPoint(editor, e);
         const scale = e.deltaMode === 1 ? 16 : e.deltaMode === 2 ? 400 : 1;
@@ -14918,6 +14929,7 @@ function useCanvasEvents(editor) {
         editor.dispatch(info);
       },
       onContextMenu(e) {
+        if (isInFrontOfCanvas(e.target) || isElsewhere(e)) return;
         e.preventDefault();
       },
       onKeyDown(e) {
@@ -15127,7 +15139,7 @@ function CanvasBody({ editor, className, style, children, components, indicatorO
           Brush ? /* @__PURE__ */ jsx(Brush, { editor }) : null
         ] }),
         children,
-        InFrontOfTheCanvas ? /* @__PURE__ */ jsx("div", { className: "mocanvas-in-front-of-canvas", style: { ...layerStyle, pointerEvents: "none" }, children: /* @__PURE__ */ jsx(InFrontOfTheCanvas, {}) }) : null
+        InFrontOfTheCanvas ? /* @__PURE__ */ jsx("div", { className: IN_FRONT_OF_CANVAS_CLASS, style: { ...layerStyle, pointerEvents: "none" }, children: /* @__PURE__ */ jsx(InFrontOfTheCanvas, {}) }) : null
       ]
     }
   ) });