@inditextech/weave-sdk 2.3.0 → 2.3.2

package/dist/sdk.js

@@ -15290,7 +15290,8 @@ const WEAVE_NODES_SELECTION_DEFAULT_CONFIG = {
 				]
 			};
 		}
-	}
+	},
+	style: { dragOpacity: .75 }
 };
 
 //#endregion
@@ -18732,11 +18733,16 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 		};
 		tr.on("transform", (0, import_throttle.default)(handleTransform, 50));
 		tr.on("transformend", () => {
+			if (tr.nodes().length > 1) {
+				const nodes = tr.nodes();
+				for (const node of nodes) {
+					this.getNodesSelectionFeedbackPlugin()?.showSelectionHalo(node);
+					this.getNodesSelectionFeedbackPlugin()?.updateSelectionHalo(node);
+				}
+			}
 			this.triggerSelectedNodesEvent();
 		});
 		let initialPos = null;
-		const originalNodeOpacity = {};
-		const DRAG_OPACITY = .75;
 		tr.on("dragstart", (e) => {
 			initialPos = {
 				x: e.target.x(),
@@ -18751,8 +18757,9 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 			}
 			const nodes = tr.nodes();
 			if (nodes.length > 1) for (const node of nodes) {
-				originalNodeOpacity[node.getAttrs().id ?? ""] = node.opacity();
-				node.opacity(DRAG_OPACITY);
+				const originalNodeOpacity = node.getAttrs().opacity ?? 1;
+				node.setAttr("dragStartOpacity", originalNodeOpacity);
+				node.opacity(this.getDragOpacity());
 			}
 			e.cancelBubble = true;
 			tr.forceUpdate();
@@ -18792,6 +18799,13 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 		tr.on("dragend", (e) => {
 			if (!this.didMove) return;
 			e.cancelBubble = true;
+			if (tr.nodes().length > 1) {
+				const nodes$1 = tr.nodes();
+				for (const node of nodes$1) {
+					this.getNodesSelectionFeedbackPlugin()?.showSelectionHalo(node);
+					this.getNodesSelectionFeedbackPlugin()?.updateSelectionHalo(node);
+				}
+			}
 			this.instance.getCloningManager().cleanupClones();
 			this.getStagePanningPlugin()?.cleanupEdgeMoveIntervals();
 			const selectedNodes = tr.nodes();
@@ -18803,8 +18817,9 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 			}
 			const nodes = tr.nodes();
 			if (nodes.length > 1) for (const node of nodes) {
-				node.opacity(originalNodeOpacity[node.getAttrs().id ?? ""]);
-				delete originalNodeOpacity[node.getAttrs().id ?? ""];
+				const dragStartOpacity = node.getAttr("dragStartOpacity") ?? 1;
+				node.opacity(dragStartOpacity);
+				node.setAttr("dragStartOpacity", void 0);
 			}
 			if (this.isSelecting() && tr.nodes().length > 1) {
 				const actualCursor = stage.container().style.cursor;
@@ -18816,18 +18831,29 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 				const nodeUpdatePromise = (node) => {
 					return new Promise((resolve) => {
 						setTimeout(() => {
-							if (node.getAttrs().lockToContainer === void 0 || !node.getAttrs().lockToContainer) return resolve();
-							clearContainerTargets(this.instance);
-							const nodeHandler = this.instance.getNodeHandler(node.getAttrs().nodeType);
-							if (nodeHandler) this.instance.updateNode(nodeHandler.serialize(node));
-							let containerToMove = this.instance.getMainLayer();
-							if (layerToMove) containerToMove = layerToMove;
-							let moved = false;
-							if (containerToMove && !selectionContainsFrames) moved = moveNodeToContainer(this.instance, node, containerToMove);
-							if (containerToMove) containerToMove.fire(WEAVE_NODE_CUSTOM_EVENTS.onTargetLeave, { node: void 0 });
-							if (!nodeHandler) return resolve();
-							toSelect.push(node.getAttrs().id ?? "");
-							if (!moved) toUpdate.push(nodeHandler.serialize(node));
+							const isLockedToContainer = node.getAttrs().lockToContainer;
+							if (!isLockedToContainer) {
+								clearContainerTargets(this.instance);
+								const nodeHandler = this.instance.getNodeHandler(node.getAttrs().nodeType);
+								if (nodeHandler) this.instance.updateNode(nodeHandler.serialize(node));
+								let containerToMove = this.instance.getMainLayer();
+								if (layerToMove) containerToMove = layerToMove;
+								let moved = false;
+								if (containerToMove && !selectionContainsFrames) moved = moveNodeToContainer(this.instance, node, containerToMove);
+								if (containerToMove) containerToMove.fire(WEAVE_NODE_CUSTOM_EVENTS.onTargetLeave, { node: void 0 });
+								if (!nodeHandler) return resolve();
+								toSelect.push(node.getAttrs().id ?? "");
+								if (!moved) toUpdate.push(nodeHandler.serialize(node));
+							}
+							if (isLockedToContainer) {
+								clearContainerTargets(this.instance);
+								toSelect.push(node.getAttrs().id ?? "");
+								const nodeHandler = this.instance.getNodeHandler(node.getAttrs().nodeType);
+								if (nodeHandler) this.instance.updateNode(nodeHandler.serialize(node));
+								if (!nodeHandler) return resolve();
+								toSelect.push(node.getAttrs().id ?? "");
+								toUpdate.push(nodeHandler.serialize(node));
+							}
 							resolve();
 						}, 0);
 					});
@@ -18841,16 +18867,16 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 				Promise.allSettled(promises).then((results) => {
 					if (results.length > 0) this.instance.updateNodes(toUpdate);
 					stage.container().style.cursor = actualCursor;
+					setTimeout(() => {
+						const finalSelectedNodes = [];
+						toSelect.forEach((nodeId) => {
+							const actNode = this.instance.getStage().findOne(`#${nodeId}`);
+							if (actNode) finalSelectedNodes.push(actNode);
+						});
+						tr.nodes(finalSelectedNodes);
+						tr.forceUpdate();
+					}, 0);
 				});
-				setTimeout(() => {
-					const finalSelectedNodes = [];
-					toSelect.forEach((nodeId) => {
-						const actNode = this.instance.getStage().findOne(`#${nodeId}`);
-						if (actNode) finalSelectedNodes.push(actNode);
-					});
-					tr.nodes(finalSelectedNodes);
-					tr.forceUpdate();
-				}, 0);
 			}
 			for (const node of selectedNodes) node.setAttrs({ isCloned: void 0 });
 			tr.forceUpdate();
@@ -19453,6 +19479,9 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
 	getSelectorConfig() {
 		return this.config.selection;
 	}
+	getDragOpacity() {
+		return this.config.style.dragOpacity;
+	}
 };
 
 //#endregion
@@ -20027,7 +20056,10 @@ var WeaveNode = class {
 				if (nodesSnappingPlugin) nodesSnappingPlugin.cleanupGuidelines();
 				if (nodesSelectionPlugin) nodesSelectionPlugin.getTransformer().forceUpdate();
 				this.scaleReset(node$1);
-				this.getNodesSelectionFeedbackPlugin()?.hideSelectionHalo(node$1);
+				if (this.getSelectionPlugin()?.getSelectedNodes().length === 1) {
+					this.getNodesSelectionFeedbackPlugin()?.showSelectionHalo(node$1);
+					this.getNodesSelectionFeedbackPlugin()?.updateSelectionHalo(node$1);
+				}
 				const nodeHandler = this.instance.getNodeHandler(node$1.getAttrs().nodeType);
 				if (nodeHandler) this.instance.updateNode(nodeHandler.serialize(node$1));
 				this.getNodesSelectionPlugin()?.getHoverTransformer().forceUpdate();
@@ -20043,8 +20075,6 @@ var WeaveNode = class {
 				const nodeTarget = e.target;
 				originalPosition = nodeTarget.getAbsolutePosition();
 			});
-			let originalOpacity = void 0;
-			const DRAG_OPACITY = .75;
 			node.on("dragstart", (e) => {
 				const nodeTarget = e.target;
 				this.getNodesSelectionFeedbackPlugin()?.hideSelectionHalo(nodeTarget);
@@ -20065,8 +20095,10 @@ var WeaveNode = class {
 				}
 				const realNodeTarget = this.getRealSelectedNode(nodeTarget);
 				if (realNodeTarget.getAttrs().isCloned) return;
-				originalOpacity = realNodeTarget.opacity();
-				realNodeTarget.opacity(DRAG_OPACITY);
+				if (this.getNodesSelectionPlugin()?.getSelectedNodes().length === 1) {
+					realNodeTarget.setAttr("dragStartOpacity", realNodeTarget.opacity());
+					realNodeTarget.opacity(this.getNodesSelectionPlugin()?.getDragOpacity());
+				}
 				if (e.evt?.altKey) {
 					nodeTarget.setAttrs({ isCloneOrigin: true });
 					nodeTarget.setAttrs({ isCloned: false });
@@ -20116,7 +20148,10 @@ var WeaveNode = class {
 			node.on("dragmove", (0, import_lodash.throttle)(handleDragMove, 100));
 			node.on("dragend", (e) => {
 				const nodeTarget = e.target;
-				this.getNodesSelectionFeedbackPlugin()?.hideSelectionHalo(nodeTarget);
+				if (this.getSelectionPlugin()?.getSelectedNodes().length === 1) {
+					this.getNodesSelectionFeedbackPlugin()?.showSelectionHalo(nodeTarget);
+					this.getNodesSelectionFeedbackPlugin()?.updateSelectionHalo(nodeTarget);
+				}
 				e.cancelBubble = true;
 				if (nodeTarget.getAttrs().isCloneOrigin && originalPosition) {
 					nodeTarget.setAbsolutePosition(originalPosition);
@@ -20133,8 +20168,11 @@ var WeaveNode = class {
 				}
 				this.instance.emitEvent("onDrag", null);
 				const realNodeTarget = this.getRealSelectedNode(nodeTarget);
-				realNodeTarget.setAttrs({ opacity: originalOpacity });
-				originalOpacity = void 0;
+				if (this.getNodesSelectionPlugin()?.getSelectedNodes().length === 1) {
+					const originalNodeOpacity = realNodeTarget.getAttr("dragStartOpacity") ?? 1;
+					realNodeTarget.setAttrs({ opacity: originalNodeOpacity });
+					realNodeTarget.setAttr("dragStartOpacity", void 0);
+				}
 				if (this.isSelecting() && this.getSelectionPlugin()?.getSelectedNodes().length === 1 && (realNodeTarget.getAttrs().lockToContainer === void 0 || !realNodeTarget.getAttrs().lockToContainer)) {
 					clearContainerTargets(this.instance);
 					const nodesEdgeSnappingPlugin = this.getNodesEdgeSnappingPlugin();
@@ -20239,6 +20277,7 @@ var WeaveNode = class {
 	onDestroy(nodeInstance) {
 		nodeInstance.destroy();
 	}
+	onDestroyInstance() {}
 	serialize(instance) {
 		const attrs = instance.getAttrs();
 		const cleanedAttrs = { ...attrs };
@@ -21199,11 +21238,6 @@ var WeaveTextNode = class extends WeaveNode {
 		if (!this.instance.isServerSide() && !this.keyPressHandler) {
 			this.keyPressHandler = this.handleKeyPress.bind(this);
 			window.addEventListener("keypress", this.keyPressHandler);
-			this.instance.addEventListener("onStoreConnectionStatusChange", (status) => {
-				if (!this.keyPressHandler) return;
-				if (status !== "connected" && this.keyPressHandler) window.removeEventListener("keypress", this.keyPressHandler);
-				else if (status === "connected" && this.keyPressHandler) window.addEventListener("keypress", this.keyPressHandler);
-			});
 		}
 	}
 	onRender(props) {
@@ -21625,6 +21659,7 @@ var WeaveTextNode = class extends WeaveNode {
 		stage.container().tabIndex = 1;
 		stage.container().click();
 		stage.container().focus();
+		this.instance.emitEvent("onExitTextNodeEditMode", { node: textNode });
 	}
 	triggerEditMode(textNode) {
 		const stage = this.instance.getStage();
@@ -21644,6 +21679,14 @@ var WeaveTextNode = class extends WeaveNode {
 			y: stageRect.y + stageContainer.offsetTop + textPosition.y
 		};
 		this.createTextAreaDOM(textNode, areaPosition);
+		this.instance.emitEvent("onEnterTextNodeEditMode", { node: textNode });
+	}
+	onDestroyInstance() {
+		super.onDestroyInstance();
+		if (!this.instance.isServerSide() && this.keyPressHandler) {
+			window.removeEventListener("keypress", this.keyPressHandler);
+			this.keyPressHandler = void 0;
+		}
 	}
 };
 
@@ -29035,9 +29078,7 @@ var WeaveNodesMultiSelectionFeedbackPlugin = class extends WeavePlugin {
 			rotation: clone.rotation()
 		};
 	}
-	createSelectionHalo(node) {
-		const nodeId = node.getAttrs().id ?? "";
-		if (this.selectedHalos[nodeId]) return;
+	getNodeInfo(node) {
 		const info = this.getNodeRectInfo(node);
 		if (info) {
 			const parent = node.getParent();
@@ -29055,6 +29096,14 @@ var WeaveNodesMultiSelectionFeedbackPlugin = class extends WeavePlugin {
 					info.y += realParent.y();
 				}
 			}
+		}
+		return info;
+	}
+	createSelectionHalo(node) {
+		const nodeId = node.getAttrs().id ?? "";
+		if (this.selectedHalos[nodeId]) return;
+		const info = this.getNodeInfo(node);
+		if (info) {
 			this.selectedHalos[nodeId] = new Konva.Rect({
 				id: `${nodeId}-selection-halo`,
 				name: "selection-halo",
@@ -29079,6 +29128,30 @@ var WeaveNodesMultiSelectionFeedbackPlugin = class extends WeavePlugin {
 			delete this.selectedHalos[nodeId];
 		}
 	}
+	updateSelectionHalo(node) {
+		const nodeId = node.getAttrs().id ?? "";
+		if (!this.selectedHalos[nodeId]) return;
+		const info = this.getNodeInfo(node);
+		if (info) {
+			const selectionLayer = this.instance.getSelectionLayer();
+			if (!selectionLayer) return;
+			const groupHalo = selectionLayer.findOne(`#${node.getAttrs().id}-selection-halo`);
+			groupHalo?.setAttrs({
+				x: info.x,
+				y: info.y,
+				width: info.width,
+				height: info.height,
+				rotation: info.rotation
+			});
+		}
+	}
+	showSelectionHalo(node) {
+		const selectionLayer = this.instance.getSelectionLayer();
+		if (selectionLayer) {
+			const groupHalo = selectionLayer.findOne(`#${node.getAttrs().id}-selection-halo`);
+			if (groupHalo) groupHalo.show();
+		}
+	}
 	hideSelectionHalo(node) {
 		const selectionLayer = this.instance.getSelectionLayer();
 		if (selectionLayer) {
@@ -31665,7 +31738,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "2.3.0";
+var version = "2.3.2";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -32283,6 +32356,11 @@ var Weave = class {
 		this.emitEvent("onInstanceStatus", this.status);
 		const store = this.storeManager.getStore();
 		store.disconnect();
+		const nodeHandlers = this.registerManager.getNodesHandlers();
+		for (const nodeHandlerKey of Object.keys(nodeHandlers)) {
+			const nodeHandler = nodeHandlers[nodeHandlerKey];
+			nodeHandler?.onDestroyInstance();
+		}
 		const stage = this.getStage();
 		if (stage) stage.destroy();
 		globalThis.Konva = void 0;