@inditextech/weave-sdk 0.32.0 → 0.33.0

package/dist/sdk.js

@@ -15647,6 +15647,7 @@ const WEAVE_NODES_SELECTION_LAYER_ID = "selectionLayer";
 const WEAVE_CONTEXT_MENU_KEY = "contextMenu";
 const WEAVE_CONTEXT_MENU_X_OFFSET_DEFAULT = 4;
 const WEAVE_CONTEXT_MENU_Y_OFFSET_DEFAULT = 4;
+const WEAVE_CONTEXT_MENU_TAP_HOLD_TIMEOUT = 500;
 
 //#endregion
 //#region src/plugins/context-menu/context-menu.ts
@@ -15658,13 +15659,14 @@ var WeaveContextMenuPlugin = class extends WeavePlugin {
 		this.touchTimer = void 0;
 		this.tapHold = false;
 		this.contextMenuVisible = false;
-		this.tapHoldTimeout = 500;
+		this.tapHoldTimeout = WEAVE_CONTEXT_MENU_TAP_HOLD_TIMEOUT;
 		const { config } = params ?? {};
 		this.config = {
 			xOffset: WEAVE_CONTEXT_MENU_X_OFFSET_DEFAULT,
 			yOffset: WEAVE_CONTEXT_MENU_Y_OFFSET_DEFAULT,
 			...config
 		};
+		this.pointers = {};
 	}
 	getName() {
 		return WEAVE_CONTEXT_MENU_KEY;
@@ -15722,28 +15724,24 @@ var WeaveContextMenuPlugin = class extends WeavePlugin {
 	}
 	initEvents() {
 		const stage = this.instance.getStage();
-		stage.on("touchstart", (e) => {
-			e.evt.preventDefault();
-			if (e.evt instanceof TouchEvent && e.evt.touches && e.evt.touches.length > 1) {
-				if (this.touchTimer) clearTimeout(this.touchTimer);
-				return;
-			}
+		stage.on("pointerdown", (e) => {
+			this.pointers[e.evt.pointerId] = e.evt;
+			if (e.evt.pointerType === "touch" && Object.keys(this.pointers).length > 1) return;
 			this.touchTimer = setTimeout(() => {
 				this.tapHold = true;
 				this.triggerContextMenu(e.target);
 			}, this.tapHoldTimeout);
 		});
-		stage.on("touchmove", () => {
+		stage.on("pointermove", () => {
 			if (this.touchTimer) clearTimeout(this.touchTimer);
 		});
-		stage.on("touchend", (e) => {
-			e.evt.preventDefault();
-			if (e.evt instanceof TouchEvent && e.evt.touches && e.evt.touches.length > 1) {
-				if (this.touchTimer) clearTimeout(this.touchTimer);
-				return;
+		stage.on("pointerup", (e) => {
+			delete this.pointers[e.evt.pointerId];
+			if (e.evt.pointerType === "touch" && Object.keys(this.pointers).length + 1 > 1) return;
+			if (this.touchTimer) {
+				clearTimeout(this.touchTimer);
+				this.tapHold = false;
 			}
-			if (this.touchTimer) clearTimeout(this.touchTimer);
-			if (this.tapHold) this.tapHold = false;
 		});
 		stage.on("contextmenu", (e) => {
 			e.evt.preventDefault();
@@ -15961,8 +15959,10 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 		this.active = false;
 		this.cameFromSelectingMultiple = false;
 		this.selecting = false;
+		this.dragging = false;
 		this.initialized = false;
 		this.enabled = false;
+		this.pointers = {};
 	}
 	getName() {
 		return WEAVE_NODES_SELECTION_KEY;
@@ -16010,20 +16010,6 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 			...this.config.transformer
 		});
 		selectionLayer?.add(tr);
-		tr.on("mouseenter", (e) => {
-			if (!this.isPasting()) {
-				const stage$1 = this.instance.getStage();
-				stage$1.container().style.cursor = "grab";
-				e.cancelBubble = true;
-			}
-		});
-		tr.on("mouseleave", (e) => {
-			if (!this.isPasting()) {
-				const stage$1 = this.instance.getStage();
-				stage$1.container().style.cursor = "default";
-				e.cancelBubble = true;
-			}
-		});
 		tr.on("transformstart", () => {
 			this.triggerSelectedNodesEvent();
 		});
@@ -16035,6 +16021,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 			this.triggerSelectedNodesEvent();
 		});
 		tr.on("dragstart", (e) => {
+			this.dragging = true;
 			const stage$1 = this.instance.getStage();
 			if (stage$1.isMouseWheelPressed()) {
 				e.cancelBubble = true;
@@ -16071,6 +16058,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 		};
 		tr.on("dragmove", (0, import_lodash$1.throttle)(handleDragMove, 50));
 		tr.on("dragend", (e) => {
+			this.dragging = false;
 			e.cancelBubble = true;
 			const selectedNodes = tr.nodes();
 			for (let i = 0; i < selectedNodes.length; i++) {
@@ -16105,11 +16093,11 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 		});
 		this.tr = tr;
 		this.selectionRectangle = selectionRectangle;
-		this.tr.on("dblclick dbltap", (evt) => {
-			evt.cancelBubble = true;
+		this.tr.on("pointerdblclick", (e) => {
+			e.cancelBubble = true;
 			if (this.tr.getNodes().length === 1) {
 				const node = this.tr.getNodes()[0];
-				node.fire("dblclick");
+				node.fire("pointerdblclick");
 			}
 		});
 		this.initEvents();
@@ -16173,14 +16161,14 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 				return;
 			}
 		});
-		stage.on("mousedown touchstart", (e) => {
+		stage.on("pointerdown", (e) => {
+			this.pointers[e.evt.pointerId] = e.evt;
 			if (!this.initialized) return;
 			if (!this.active) return;
-			if (e.evt.button && e.evt.button !== 0) return;
-			if (e.evt.touches && e.evt.touches.length > 1) return;
+			if (e.evt.pointerType === "mouse" && e.evt.button !== 0) return;
+			if (e.evt.pointerType === "touch" && Object.keys(this.pointers).length > 1) return;
 			const selectedGroup = this.instance.getInstanceRecursive(e.target);
 			if (!(e.target instanceof Konva.Stage) && !(selectedGroup && selectedGroup.getAttrs().nodeType === "frame")) return;
-			e.evt.preventDefault();
 			const intStage = this.instance.getStage();
 			x1 = intStage.getRelativePointerPosition()?.x ?? 0;
 			y1 = intStage.getRelativePointerPosition()?.y ?? 0;
@@ -16197,7 +16185,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 		const handleMouseMove = (e) => {
 			if (!this.initialized) return;
 			if (!this.active) return;
-			if (e.evt instanceof TouchEvent && e.evt.touches && e.evt.touches.length > 1) return;
+			if (e.evt.pointerType === "touch" && Object.keys(this.pointers).length > 1) return;
 			const contextMenuPlugin = this.instance.getPlugin("contextMenu");
 			if (contextMenuPlugin && contextMenuPlugin.isContextMenuVisible()) {
 				this.selecting = false;
@@ -16207,7 +16195,6 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 				this.cameFromSelectingMultiple = false;
 				return;
 			}
-			e.evt.preventDefault();
 			const intStage = this.instance.getStage();
 			x2 = intStage.getRelativePointerPosition()?.x ?? 0;
 			y2 = intStage.getRelativePointerPosition()?.y ?? 0;
@@ -16219,11 +16206,13 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 				height: Math.abs(y2 - y1)
 			});
 		};
-		stage.on("mousemove touchmove", (0, import_lodash$1.throttle)(handleMouseMove, 50));
-		stage.on("mouseup touchend", (e) => {
+		stage.on("pointermove", (0, import_lodash$1.throttle)(handleMouseMove, 50));
+		stage.on("pointerup", (e) => {
+			delete this.pointers[e.evt.pointerId];
 			if (!this.initialized) return;
 			if (!this.active) return;
-			if (e.evt instanceof TouchEvent && e.evt.touches && e.evt.touches.length > 1) return;
+			if (!this.selecting) return;
+			if (e.evt.pointerType === "touch" && Object.keys(this.pointers).length + 1 > 1) return;
 			const contextMenuPlugin = this.instance.getPlugin("contextMenu");
 			if (contextMenuPlugin && contextMenuPlugin.isContextMenuVisible()) {
 				this.selecting = false;
@@ -16235,7 +16224,6 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 				this.cameFromSelectingMultiple = false;
 				return;
 			}
-			e.evt.preventDefault();
 			this.tr.nodes([]);
 			this.selectionRectangle.visible(false);
 			const shapes = stage.find((node) => {
@@ -16271,9 +16259,10 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 			stage.container().tabIndex = 1;
 			stage.container().focus();
 		});
-		stage.on("click tap", (e) => {
+		stage.on("pointerclick", (e) => {
 			if (!this.enabled) return;
 			if (this.instance.getActiveAction() !== "selectionTool") return;
+			if (this.dragging) return;
 			const contextMenuPlugin = this.instance.getPlugin("contextMenu");
 			if (contextMenuPlugin && contextMenuPlugin.isContextMenuVisible()) {
 				this.selecting = false;
@@ -16747,37 +16736,33 @@ var WeaveNode = class {
 			}
 		});
 		this.previousPointer = null;
-		node.on("mouseenter", (e) => {
+		node.on("pointerenter", () => {
 			const realNode = this.instance.getInstanceRecursive(node);
 			if (this.isSelecting() && !this.isNodeSelected(realNode) && !this.isPasting()) {
 				const stage = this.instance.getStage();
 				this.previousPointer = stage.container().style.cursor;
 				stage.container().style.cursor = "pointer";
-				e.cancelBubble = true;
 				return;
 			}
 			if (this.isPasting()) {
 				const stage = this.instance.getStage();
 				this.previousPointer = stage.container().style.cursor;
 				stage.container().style.cursor = "crosshair";
-				e.cancelBubble = true;
 				return;
 			}
 		});
-		node.on("mouseleave", (e) => {
+		node.on("pointerleave", () => {
 			const realNode = this.instance.getInstanceRecursive(node);
 			if (this.isSelecting() && !this.isNodeSelected(realNode) && !this.isPasting()) {
 				const stage = this.instance.getStage();
 				stage.container().style.cursor = this.previousPointer ?? "default";
 				this.previousPointer = null;
-				e.cancelBubble = true;
 				return;
 			}
 			if (this.isPasting()) {
 				const stage = this.instance.getStage();
 				this.previousPointer = stage.container().style.cursor;
 				stage.container().style.cursor = "crosshair";
-				e.cancelBubble = true;
 				return;
 			}
 		});
@@ -18050,6 +18035,7 @@ var WeaveStateManager = class {
 				};
 				parent.props.children.push(finalNode);
 			}
+			this.instance.emitEvent("onNodeAdded", node);
 			if (doRender) this.instance.render();
 		}, userName);
 	}
@@ -18079,6 +18065,7 @@ var WeaveStateManager = class {
 				...node.props
 			}));
 			nodeState.props = { ...nodeNew };
+			this.instance.emitEvent("onNodeUpdated", node);
 			if (doRender) this.instance.render();
 		}, userName);
 	}
@@ -18108,6 +18095,7 @@ var WeaveStateManager = class {
 				const filteredChildren = newChildren.filter((actNode) => actNode.key !== node.key);
 				parentState.props.children = filteredChildren;
 			}
+			this.instance.emitEvent("onNodeRemoved", node);
 			if (doRender) this.instance.render();
 		}, userName);
 	}
@@ -18243,7 +18231,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "0.32.0";
+var version = "0.33.0";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -18478,6 +18466,7 @@ var WeaveExportManager = class {
 					y: unscaledBounds.y - padding,
 					width: unscaledBounds.width + 2 * padding,
 					height: unscaledBounds.height + 2 * padding,
+					strokeWidth: 0,
 					fill: backgroundColor
 				});
 				exportGroup.add(background);
@@ -18493,10 +18482,10 @@ var WeaveExportManager = class {
 				mainLayer.add(exportGroup);
 				const backgroundRect = background.getClientRect();
 				exportGroup.toImage({
-					x: backgroundRect.x,
-					y: backgroundRect.y,
-					width: backgroundRect.width,
-					height: backgroundRect.height,
+					x: Math.round(backgroundRect.x),
+					y: Math.round(backgroundRect.y),
+					width: Math.round(backgroundRect.width),
+					height: Math.round(backgroundRect.height),
 					mimeType: format$2,
 					pixelRatio,
 					quality: options.quality ?? 1,
@@ -18899,10 +18888,10 @@ var WeaveStageNode = class extends WeaveNode {
 		stage.container().addEventListener("blur", () => {
 			this.stageFocused = false;
 		});
-		stage.on("mousedown", (e) => {
+		stage.on("pointerdown", (e) => {
 			if (e.evt.button === 1) this.wheelMousePressed = true;
 		});
-		stage.on("mouseup", (e) => {
+		stage.on("pointerup", (e) => {
 			if (e.evt.button === 1) this.wheelMousePressed = false;
 		});
 		stage.batchDraw();
@@ -19238,7 +19227,7 @@ var WeaveTextNode = class extends WeaveNode {
 				}
 			}
 		});
-		text.on("dblclick dbltap", (e) => {
+		text.on("pointerdblclick", (e) => {
 			e.cancelBubble = true;
 			if (this.editing) return;
 			if (!(this.isSelecting() && this.isNodeSelected(text))) return;
@@ -19486,7 +19475,7 @@ var WeaveTextNode = class extends WeaveNode {
 				this.removeTextAreaDOM(textNode);
 				this.instance.removeEventListener("onZoomChange", this.onZoomChangeHandler(textNode).bind(this));
 				this.instance.removeEventListener("onStageMove", this.onStageMoveHandler(textNode).bind(this));
-				window.removeEventListener("click", handleOutsideClick);
+				window.removeEventListener("pointerclick", handleOutsideClick);
 				return;
 			}
 		};
@@ -19515,14 +19504,14 @@ var WeaveTextNode = class extends WeaveNode {
 				this.removeTextAreaDOM(textNode);
 				this.textArea.removeEventListener("keydown", handleKeyDown);
 				this.textArea.removeEventListener("keyup", handleKeyUp);
-				window.removeEventListener("click", handleOutsideClick);
-				window.removeEventListener("touchstart", handleOutsideClick);
+				window.removeEventListener("pointerclick", handleOutsideClick);
+				window.removeEventListener("pointerdown", handleOutsideClick);
 				return;
 			}
 		};
 		setTimeout(() => {
-			window.addEventListener("click", handleOutsideClick);
-			window.addEventListener("touchstart", handleOutsideClick);
+			window.addEventListener("pointerclick", handleOutsideClick);
+			window.addEventListener("pointerdown", handleOutsideClick);
 		}, 0);
 		this.editing = true;
 	}
@@ -19674,8 +19663,7 @@ var WeaveImageToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("click tap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerclick", () => {
 			if (this.state === IMAGE_TOOL_STATE.IDLE) return;
 			if (this.state === IMAGE_TOOL_STATE.UPLOADING) return;
 			if (this.state === IMAGE_TOOL_STATE.ADDING) {
@@ -19683,8 +19671,7 @@ var WeaveImageToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			const tempImage = this.instance.getStage().findOne(`#${this.tempImageId}`);
 			if (this.state === IMAGE_TOOL_STATE.ADDING && tempImage) {
 				const mousePos = stage.getRelativePointerPosition();
@@ -20295,7 +20282,7 @@ var WeaveImageNode = class extends WeaveNode {
 		});
 		image.add(cropGroup);
 		this.setupDefaultNodeEvents(image);
-		image.on("dblclick dbltap", (evt) => {
+		image.on("pointerdblclick", (evt) => {
 			evt.cancelBubble = true;
 			if (image.getAttrs().cropping ?? false) return;
 			if (!internalImage.getAttr("image")) return;
@@ -22753,7 +22740,6 @@ var WeaveStageZoomPlugin = class extends WeavePlugin {
 			...config
 		};
 		if (!this.config.zoomSteps.includes(this.config.defaultZoom)) throw new Error(`Default zoom ${this.config.defaultZoom} is not in zoom steps`);
-		this.isSpaceKeyPressed = false;
 		this.isCtrlOrMetaPressed = false;
 		this.updatedMinimumZoom = false;
 		this.actualStep = this.config.zoomSteps.findIndex((step) => step === this.config.defaultZoom);
@@ -22993,11 +22979,9 @@ var WeaveStageZoomPlugin = class extends WeavePlugin {
 	initEvents() {
 		window.addEventListener("keydown", (e) => {
 			if (e.ctrlKey || e.metaKey) this.isCtrlOrMetaPressed = true;
-			if (e.code === "Space") this.isSpaceKeyPressed = true;
 		});
 		window.addEventListener("keyup", (e) => {
 			if (!(e.ctrlKey || e.metaKey)) this.isCtrlOrMetaPressed = false;
-			if (e.code === "Space") this.isSpaceKeyPressed = false;
 		});
 		const stage = this.instance.getStage();
 		const stageContainer = this.instance.getStage().container();
@@ -23023,17 +23007,20 @@ var WeaveStageZoomPlugin = class extends WeavePlugin {
 			const newScale = initialScale * ev.scale;
 			this.setZoom(newScale, false, center);
 		});
-		window.addEventListener("wheel", (e) => {
+		const handleWheel = (e) => {
+			e.evt.preventDefault();
 			const stage$1 = this.instance.getStage();
-			if (!this.enabled || !stage$1.isFocused() || !this.isCtrlOrMetaPressed || this.isSpaceKeyPressed) return;
+			const performZoom = this.isCtrlOrMetaPressed || !this.isCtrlOrMetaPressed && e.evt.ctrlKey && e.evt.deltaMode === 0;
+			if (!this.enabled || !stage$1.isFocused() || !performZoom) return;
 			const oldScale = stage$1.scaleX();
 			const pointer = stage$1.getPointerPosition();
 			if (!pointer) return;
 			const scaleBy = 1.025;
-			const direction = e.deltaY > 0 ? 1 : -1;
+			const direction = e.evt.deltaY > 0 ? 1 : -1;
 			const newScale = direction > 0 ? oldScale / scaleBy : oldScale * scaleBy;
 			this.setZoom(newScale, false, pointer);
-		});
+		};
+		stage.on("wheel", handleWheel);
 	}
 };
 
@@ -23316,8 +23303,7 @@ var WeaveEraserToolAction = class extends WeaveAction {
 	}
 	setupEvents() {
 		const stage = this.instance.getStage();
-		stage.on("click tap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerclick", () => {
 			if (!this.erasing) return;
 			const nodeIntersected = this.instance.pointIntersectsElement();
 			if (nodeIntersected) {
@@ -23425,22 +23411,19 @@ var WeaveRectangleToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousedown touchstart", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerdown", () => {
 			if (this.state === RECTANGLE_TOOL_STATE.ADDING) {
 				this.creating = true;
 				this.handleAdding();
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			if (this.state === RECTANGLE_TOOL_STATE.DEFINING_SIZE) {
 				this.moved = true;
 				this.handleMovement();
 			}
 		});
-		stage.on("mouseup touchend", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerup", () => {
 			if (this.state === RECTANGLE_TOOL_STATE.DEFINING_SIZE) {
 				this.creating = false;
 				this.handleSettingSize();
@@ -23603,22 +23586,19 @@ var WeaveEllipseToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousedown touchstart", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerdown", () => {
 			if (this.state === ELLIPSE_TOOL_STATE.ADDING) {
 				this.creating = true;
 				this.handleAdding();
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			if (this.state === ELLIPSE_TOOL_STATE.DEFINING_SIZE) {
 				this.moved = true;
 				this.handleMovement();
 			}
 		});
-		stage.on("mouseup touchend", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerup", () => {
 			if (this.state === ELLIPSE_TOOL_STATE.DEFINING_SIZE) {
 				this.creating = false;
 				this.handleSettingSize();
@@ -23790,12 +23770,10 @@ var WeavePenToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("dblclick dbltap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerdblclick", () => {
 			this.cancelAction();
 		});
-		stage.on("click tap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerclick", () => {
 			if (this.state === PEN_TOOL_STATE.IDLE) return;
 			if (this.state === PEN_TOOL_STATE.ADDING) {
 				this.handleAdding();
@@ -23806,8 +23784,7 @@ var WeavePenToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			this.handleMovement();
 		});
 		this.initialized = true;
@@ -24030,22 +24007,19 @@ var WeaveBrushToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousedown touchstart", (e) => {
+		stage.on("pointerdown", (e) => {
 			if (this.state !== BRUSH_TOOL_STATE.IDLE) return;
 			this.handleStartStroke();
-			e.evt.preventDefault();
 			e.evt.stopPropagation();
 		});
-		stage.on("mousemove touchmove", (e) => {
+		stage.on("pointermove", (e) => {
 			if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
 			this.handleMovement();
-			e.evt.preventDefault();
 			e.evt.stopPropagation();
 		});
-		stage.on("mouseup touchend", (e) => {
+		stage.on("pointerup", (e) => {
 			if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
 			this.handleEndStroke();
-			e.evt.preventDefault();
 			e.evt.stopPropagation();
 		});
 		this.initialized = true;
@@ -24172,17 +24146,13 @@ var WeaveTextToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("click tap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerclick", () => {
 			if (this.state === TEXT_TOOL_STATE.IDLE) return;
 			if (this.state === TEXT_TOOL_STATE.ADDING) {
 				this.handleAdding();
 				return;
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
-		});
 		this.initialized = true;
 	}
 	setState(state) {
@@ -24299,22 +24269,19 @@ var WeaveStarToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousedown touchstart", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerdown", () => {
 			if (this.state === STAR_TOOL_STATE.ADDING) {
 				this.creating = true;
 				this.handleAdding();
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			if (this.state === STAR_TOOL_STATE.DEFINING_SIZE) {
 				this.moved = true;
 				this.handleMovement();
 			}
 		});
-		stage.on("mouseup touchend", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerup", () => {
 			if (this.state === STAR_TOOL_STATE.DEFINING_SIZE) {
 				this.creating = false;
 				this.handleSettingSize();
@@ -24492,12 +24459,10 @@ var WeaveArrowToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("dblclick dbltap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerdblclick", () => {
 			this.cancelAction();
 		});
-		stage.on("click tap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerclick", () => {
 			if (this.state === ARROW_TOOL_STATE.IDLE) return;
 			if (this.state === ARROW_TOOL_STATE.ADDING) {
 				this.handleAdding();
@@ -24508,8 +24473,7 @@ var WeaveArrowToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			this.handleMovement();
 		});
 		this.initialized = true;
@@ -24743,22 +24707,19 @@ var WeaveRegularPolygonToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("mousedown touchstart", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerdown", () => {
 			if (this.state === REGULAR_POLYGON_TOOL_STATE.ADDING) {
 				this.creating = true;
 				this.handleAdding();
 			}
 		});
-		stage.on("mousemove touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			if (this.state === REGULAR_POLYGON_TOOL_STATE.DEFINING_SIZE) {
 				this.moved = true;
 				this.handleMovement();
 			}
 		});
-		stage.on("mouseup touchend", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerup", () => {
 			if (this.state === REGULAR_POLYGON_TOOL_STATE.DEFINING_SIZE) {
 				this.creating = false;
 				this.handleSettingSize();
@@ -24913,8 +24874,7 @@ var WeaveFrameToolAction = class extends WeaveAction {
 				return;
 			}
 		});
-		stage.on("click tap", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointerclick", () => {
 			if (this.state === FRAME_TOOL_STATE.IDLE) return;
 			if (this.state === FRAME_TOOL_STATE.ADDING) {
 				this.handleAdding();
@@ -25058,11 +25018,12 @@ var WeaveExportNodesToolAction = class extends WeaveAction {
 		link.click();
 		this.cancelAction?.();
 	}
-	async trigger(cancelAction, { nodes, boundingNodes, options, download = true }) {
+	async trigger(cancelAction, { nodes, boundingNodes, options, triggerSelectionTool = true, download = true }) {
 		if (!this.instance) throw new Error("Instance not defined");
 		const stage = this.instance.getStage();
 		stage.container().tabIndex = 1;
 		stage.container().focus();
+		this.triggerSelectionTool = triggerSelectionTool;
 		this.cancelAction = cancelAction;
 		this.options = {
 			...this.defaultFormatOptions,
@@ -25081,7 +25042,7 @@ var WeaveExportNodesToolAction = class extends WeaveAction {
 		stage.container().tabIndex = 0;
 		stage.container().click();
 		stage.container().focus();
-		this.instance.triggerAction("selectionTool");
+		if (this.triggerSelectionTool) this.instance.triggerAction("selectionTool");
 	}
 };
 
@@ -25146,36 +25107,22 @@ var WeaveStageGridPlugin = class extends WeavePlugin {
 		window.addEventListener("keyup", (e) => {
 			if (e.code === "Space") this.isSpaceKeyPressed = false;
 		});
-		stage.on("mousedown", (e) => {
+		stage.on("pointerdown", (e) => {
 			const activeAction = this.instance.getActiveAction();
-			if (e && e.evt.button === 0 && activeAction === "moveTool") {
-				this.moveToolActive = true;
-				e.cancelBubble = true;
-			}
-			if (e && (e.evt.button === 2 || e.evt.buttons === 4)) {
-				this.isMouseMiddleButtonPressed = true;
-				e.cancelBubble = true;
-			}
+			if (e && e.evt.button === 0 && activeAction === "moveTool") this.moveToolActive = true;
+			if (e && (e.evt.button === 2 || e.evt.buttons === 4)) this.isMouseMiddleButtonPressed = true;
 		});
-		stage.on("mouseup", (e) => {
+		stage.on("pointerup", (e) => {
 			const activeAction = this.instance.getActiveAction();
-			if (e && e.evt.button === 0 && activeAction === "moveTool") {
-				this.moveToolActive = false;
-				e.cancelBubble = true;
-			}
-			if (e && (e.evt.button === 1 || e.evt.buttons === 0)) {
-				this.isMouseMiddleButtonPressed = false;
-				e.cancelBubble = true;
-			}
+			if (e && e.evt.button === 0 && activeAction === "moveTool") this.moveToolActive = false;
+			if (e && (e.evt.button === 1 || e.evt.buttons === 0)) this.isMouseMiddleButtonPressed = false;
 		});
-		const handleMouseMove = (e) => {
-			e.evt.preventDefault();
+		const handleMouseMove = () => {
 			if (!this.enabled || !(this.isSpaceKeyPressed || this.isMouseMiddleButtonPressed || this.moveToolActive)) return;
 			this.onRender();
 		};
-		stage.on("mousemove", (0, import_lodash$1.throttle)(handleMouseMove, 50));
-		stage.on("touchmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", (0, import_lodash$1.throttle)(handleMouseMove, 50));
+		stage.on("pointermove", () => {
 			if (!this.enabled) return;
 			this.onRender();
 		});
@@ -25430,40 +25377,33 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
 				this.disableMove();
 			}
 		});
-		stage.on("mousedown", (e) => {
+		stage.on("pointerdown", (e) => {
 			const activeAction = this.instance.getActiveAction();
 			let enableMove = false;
-			if (e && e.evt.button === 0 && activeAction === "moveTool") {
+			if (e && (e.evt.pointerType !== "mouse" || e.evt.pointerType === "mouse" && e.evt.buttons === 1) && activeAction === "moveTool") {
 				this.moveToolActive = true;
 				enableMove = true;
 			}
-			if (!enableMove && e && e.evt.button === 1) {
+			if (!enableMove && e.evt.pointerType === "mouse" && e.evt.buttons === 4) {
 				this.isMouseMiddleButtonPressed = true;
 				enableMove = true;
 			}
-			if (enableMove) {
-				this.enableMove();
-				e.cancelBubble = true;
-			}
+			if (enableMove) this.enableMove();
 		});
-		stage.on("mouseup", (e) => {
+		stage.on("pointerup", (e) => {
 			const activeAction = this.instance.getActiveAction();
 			let disableMove = false;
-			if (e && e.evt.button === 0 && activeAction === "moveTool") {
+			if (e && (e.evt.pointerType !== "mouse" || e.evt.pointerType === "mouse" && e.evt.buttons === 0) && activeAction === "moveTool") {
 				this.moveToolActive = false;
 				disableMove = true;
 			}
-			if (e && (e.evt.button === 1 || e.evt.buttons === 0)) {
+			if (e && e.evt.pointerType === "mouse" && e.evt.buttons === 0) {
 				this.isMouseMiddleButtonPressed = false;
 				disableMove = true;
 			}
-			if (disableMove) {
-				this.disableMove();
-				e.cancelBubble = true;
-			}
+			if (disableMove) this.disableMove();
 		});
-		const handleMouseMove = (e) => {
-			e.evt.preventDefault();
+		const handleMouseMove = () => {
 			const mousePos = stage.getPointerPosition();
 			if (previousMouseX === Infinity) previousMouseX = mousePos?.x ?? 0;
 			if (previousMouseY === Infinity) previousMouseY = mousePos?.y ?? 0;
@@ -25476,38 +25416,22 @@ var WeaveStagePanningPlugin = class extends WeavePlugin {
 			stage.y(stage.y() - deltaY);
 			this.instance.emitEvent("onStageMove");
 		};
-		stage.on("mousemove", (0, import_lodash$1.throttle)(handleMouseMove, 50));
-		stage.on("touchstart", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", (0, import_lodash$1.throttle)(handleMouseMove, 50));
+		stage.on("pointerdown", () => {
 			const mousePos = stage.getPointerPosition();
 			previousMouseX = mousePos?.x ?? 0;
 			previousMouseY = mousePos?.y ?? 0;
 		});
-		stage.on("touchmove", (e) => {
-			e.evt.preventDefault();
-			const activeAction = this.instance.getActiveAction();
-			if (activeAction !== "moveTool") return;
-			const mousePos = stage.getPointerPosition();
-			if (previousMouseX === Infinity) previousMouseX = mousePos?.x ?? 0;
-			if (previousMouseY === Infinity) previousMouseY = mousePos?.y ?? 0;
-			const deltaX = previousMouseX - (mousePos?.x ?? 0);
-			const deltaY = previousMouseY - (mousePos?.y ?? 0);
-			previousMouseX = mousePos?.x ?? 0;
-			previousMouseY = mousePos?.y ?? 0;
-			if (!this.enabled) return;
-			stage.x(stage.x() - deltaX);
-			stage.y(stage.y() - deltaY);
-			this.instance.emitEvent("onStageMove");
-		});
 		const handleWheel = (e) => {
 			e.evt.preventDefault();
 			const stage$1 = this.instance.getStage();
-			if (!this.enabled || !stage$1.isFocused() || this.isCtrlOrMetaPressed) return;
+			const performPanning = !this.isCtrlOrMetaPressed && !e.evt.ctrlKey;
+			if (!this.enabled || !stage$1.isFocused() || this.isCtrlOrMetaPressed || e.evt.buttons === 4 || !performPanning) return;
 			stage$1.x(stage$1.x() - e.evt.deltaX);
 			stage$1.y(stage$1.y() - e.evt.deltaY);
 			this.instance.emitEvent("onStageMove");
 		};
-		stage.on("wheel", (0, import_lodash$1.throttle)(handleWheel, 10));
+		stage.on("wheel", handleWheel);
 	}
 	enable() {
 		this.enabled = true;
@@ -25843,8 +25767,7 @@ var WeaveUsersPointersPlugin = class extends WeavePlugin {
 			for (let i = 0; i < inactiveUsers.length; i++) delete this.usersPointers[inactiveUsers[i]];
 			this.renderPointers();
 		});
-		stage.on("dragmove", (e) => {
-			e.evt.preventDefault();
+		stage.on("dragmove", () => {
 			const userInfo = this.config.getUser();
 			const mousePos = stage.getRelativePointerPosition();
 			if (mousePos) store.setAwarenessInfo(WEAVE_USER_POINTER_KEY, {
@@ -25853,8 +25776,7 @@ var WeaveUsersPointersPlugin = class extends WeavePlugin {
 				y: mousePos.y
 			});
 		});
-		stage.on("pointermove", (e) => {
-			e.evt.preventDefault();
+		stage.on("pointermove", () => {
 			const userInfo = this.config.getUser();
 			const mousePos = stage.getRelativePointerPosition();
 			if (mousePos) store.setAwarenessInfo(WEAVE_USER_POINTER_KEY, {
@@ -25968,11 +25890,9 @@ var WeaveStageDropAreaPlugin = class extends WeavePlugin {
 	initEvents() {
 		const stage = this.instance.getStage();
 		stage.container().addEventListener("dragover", (e) => {
-			e.preventDefault();
 			e.stopPropagation();
 		});
 		stage.container().addEventListener("drop", (e) => {
-			e.preventDefault();
 			e.stopPropagation();
 			this.instance.emitEvent("onStageDrop", e);
 		});