@inditextech/weave-sdk 2.18.1 → 2.20.0

package/dist/sdk.node.js

@@ -20079,7 +20079,8 @@ var WeaveNode = class {
 	register(instance) {
 		this.instance = instance;
 		this.logger = this.instance.getChildLogger(this.getNodeType());
-		this.instance.getChildLogger("node").debug(`Node with type [${this.getNodeType()}] registered`);
+		this.onRegister();
+		this.instance.getChildLogger(`node-${this.getNodeType()}`).debug(`Node with type [${this.getNodeType()}] registered`);
 		return this;
 	}
 	getNodeType() {
@@ -20567,6 +20568,7 @@ var WeaveNode = class {
 			}
 		};
 	}
+	onRegister() {}
 	onAdd(nodeInstance) {}
 	onDestroy(nodeInstance) {
 		nodeInstance.destroy();
@@ -22075,7 +22077,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "2.18.1";
+var version = "2.20.0";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -22768,6 +22770,7 @@ function watchMap(onChange, map = new Map()) {
 //#endregion
 //#region src/managers/async/async.ts
 var WeaveAsyncManager = class {
+	asyncElementsLoadedEventEmitted = false;
 	constructor(instance) {
 		this.instance = instance;
 		this.logger = this.instance.getChildLogger("async-manager");
@@ -22779,6 +22782,12 @@ var WeaveAsyncManager = class {
 	asyncElementsLoaded() {
 		return [...this.asyncElements.values()].every((el) => el.status === WEAVE_ASYNC_STATUS.LOADED);
 	}
+	getAmountAsyncElements() {
+		return [...this.asyncElements.values()].length;
+	}
+	getAmountAsyncElementsLoaded() {
+		return [...this.asyncElements.values()].filter((el) => el.status === WEAVE_ASYNC_STATUS.LOADED).length;
+	}
 	loadAsyncElement(nodeId, type) {
 		let element = this.asyncElements.get(nodeId);
 		if (element) element.status = WEAVE_ASYNC_STATUS.LOADING;
@@ -22787,6 +22796,10 @@ var WeaveAsyncManager = class {
 			status: WEAVE_ASYNC_STATUS.LOADING
 		};
 		this.asyncElements.set(nodeId, element);
+		this.instance.emitEvent("onAsyncElementsLoading", {
+			loaded: this.getAmountAsyncElementsLoaded(),
+			total: this.getAmountAsyncElements()
+		});
 	}
 	resolveAsyncElement(nodeId, type) {
 		let element = this.asyncElements.get(nodeId);
@@ -22796,6 +22809,17 @@ var WeaveAsyncManager = class {
 			status: WEAVE_ASYNC_STATUS.LOADED
 		};
 		this.asyncElements.set(nodeId, element);
+		this.instance.emitEvent("onAsyncElementsLoading", {
+			loaded: this.getAmountAsyncElementsLoaded(),
+			total: this.getAmountAsyncElements()
+		});
+		if (!this.asyncElementsLoadedEventEmitted) {
+			const allLoaded = this.asyncElementsLoaded();
+			if (allLoaded) {
+				this.instance.emitEvent("onAsyncElementsLoaded");
+				this.asyncElementsLoadedEventEmitted = true;
+			}
+		}
 	}
 };
 
@@ -24454,6 +24478,10 @@ var WeaveTextNode = class extends WeaveNode {
 		this.instance.addEventListener("onNodeRenderedAdded", (node) => {
 			if (node.id() === text.id() && node.getParent() !== text.getParent()) text.getAttr("cancelEditMode")?.();
 		});
+		if (!this.instance.isServerSide() && !this.keyPressHandler) {
+			this.keyPressHandler = this.handleKeyPress.bind(this);
+			window.addEventListener("keypress", this.keyPressHandler);
+		}
 		return text;
 	}
 	onUpdate(nodeInstance, nextProps) {
@@ -24879,6 +24907,7 @@ var WeaveImageCrop = class WeaveImageCrop {
 		if (nodeDistanceSnappingPlugin) nodeDistanceSnappingPlugin.disable();
 		const nodesSelectionPlugin = this.getNodesSelectionPlugin();
 		if (nodesSelectionPlugin) nodesSelectionPlugin.disable();
+		this.node.clearCache(this.image);
 		this.image.setAttrs({ cropping: true });
 		const imageAttrs = this.image.getAttrs();
 		this.internalImage.hide();
@@ -25057,6 +25086,7 @@ var WeaveImageCrop = class WeaveImageCrop {
 		if (nodesSelectionPlugin) nodesSelectionPlugin.enable();
 		stage.mode(WEAVE_STAGE_DEFAULT_MODE);
 		this.instance.releaseMutexLock();
+		this.node.cacheNode(this.image);
 		this.instance.emitEvent("onImageCropEnd", { instance: this.image });
 	}
 	drawGridLines(x, y, width, height) {
@@ -25118,6 +25148,7 @@ var WeaveImageCrop = class WeaveImageCrop {
 		this.image.setAbsolutePosition(cropImageStage);
 		this.image.attrs.cropInfo = void 0;
 		this.instance.updateNode(this.node.serialize(this.image));
+		this.node.cacheNode(this.image);
 	}
 	handleClipEnd() {
 		const clipRect = this.cropRect.getClientRect({ relativeTo: this.cropGroup });
@@ -25214,11 +25245,15 @@ const WEAVE_IMAGE_CROP_END_TYPE = {
 	["ACCEPT"]: "accept",
 	["CANCEL"]: "cancel"
 };
-const WEAVE_IMAGE_DEFAULT_CONFIG = { crossOrigin: "anonymous" };
+const WEAVE_IMAGE_DEFAULT_CONFIG = {
+	performance: { cache: { enabled: false } },
+	crossOrigin: "anonymous"
+};
 
 //#endregion
 //#region src/nodes/image/image.ts
 var WeaveImageNode = class extends WeaveNode {
+	imageBitmapCache = {};
 	imageSource = {};
 	imageState = {};
 	nodeType = WEAVE_IMAGE_NODE_TYPE;
@@ -25234,6 +25269,9 @@ var WeaveImageNode = class extends WeaveNode {
 		this.config = mergeExceptArrays(WEAVE_IMAGE_DEFAULT_CONFIG, config);
 		this.imageCrop = null;
 	}
+	onRegister() {
+		this.logger.info(`image caching enabled: ${this.config.performance.cache.enabled}`);
+	}
 	triggerCrop(imageNode) {
 		const stage = this.instance.getStage();
 		if (imageNode.getAttrs().cropping ?? false) return;
@@ -25383,8 +25421,9 @@ var WeaveImageNode = class extends WeaveNode {
 		};
 		if (this.imageSource[id]) {
 			imagePlaceholder.destroy();
+			const imageSource = this.imageSource[id];
 			internalImage.setAttrs({
-				image: this.imageSource[id],
+				image: imageSource,
 				visible: true
 			});
 			image.setAttr("imageInfo", {
@@ -25408,14 +25447,27 @@ var WeaveImageNode = class extends WeaveNode {
 			this.updatePlaceholderSize(image, imagePlaceholder);
 			this.loadImage(imageProps, image);
 		}
+		if (this.config.performance.cache.enabled) image.on("transformend", () => {
+			this.cacheNode(image);
+		});
 		image.setAttr("imageURL", imageProps.imageURL);
 		this.instance.addEventListener("onNodeRenderedAdded", (node) => {
 			if (node.id() === image.id() && node.getParent() !== image.getParent()) {
 				if (this.imageCrop) this.closeCrop(image, WEAVE_IMAGE_CROP_END_TYPE.CANCEL);
 			}
 		});
+		this.cacheNode(image);
 		return image;
 	}
+	clearCache(nodeInstance) {
+		if (this.config.performance.cache.enabled) nodeInstance.clearCache();
+	}
+	cacheNode(nodeInstance) {
+		if (this.config.performance.cache.enabled) {
+			nodeInstance.clearCache();
+			nodeInstance.cache({ pixelRatio: this.config.performance.cache.pixelRatio });
+		}
+	}
 	onUpdate(nodeInstance, nextProps) {
 		const id = nodeInstance.getAttrs().id;
 		const node = nodeInstance;
@@ -25515,6 +25567,7 @@ var WeaveImageNode = class extends WeaveNode {
 			});
 			this.updateImageCrop(nodeInstance);
 		}
+		this.cacheNode(nodeInstance);
 	}
 	preloadImage(imageId, imageURL, { onLoad, onError }) {
 		const realImageURL = this.config.urlTransformer?.(imageURL ?? "") ?? imageURL;
@@ -25529,7 +25582,7 @@ var WeaveImageNode = class extends WeaveNode {
 			delete this.imageState[imageId];
 			onError(error);
 		};
-		this.imageSource[imageId].onload = () => {
+		this.imageSource[imageId].onload = async () => {
 			this.imageState[imageId] = {
 				loaded: true,
 				error: false
@@ -25561,10 +25614,11 @@ var WeaveImageNode = class extends WeaveNode {
 						height: imageProps.height ? imageProps.height : this.imageSource[id].height
 					});
 					imagePlaceholder.destroy();
+					const imageSource = this.imageSource[id];
 					internalImage.setAttrs({
 						width: imageProps.width ? imageProps.width : this.imageSource[id].width,
 						height: imageProps.height ? imageProps.height : this.imageSource[id].height,
-						image: this.imageSource[id],
+						image: imageSource,
 						visible: true
 					});
 					internalImage.setAttr("imageInfo", {
@@ -25587,6 +25641,7 @@ var WeaveImageNode = class extends WeaveNode {
 					};
 					this.updateImageCrop(image);
 					this.resolveAsyncElement(id);
+					this.cacheNode(image);
 				}
 			},
 			onError: (error) => {
@@ -25611,6 +25666,7 @@ var WeaveImageNode = class extends WeaveNode {
 				console.error("Error loading image", realImageURL, error);
 				imagePlaceholder?.setAttrs({ visible: true });
 				internalImage?.setAttrs({ visible: false });
+				this.cacheNode(image);
 			}
 		});
 	}
@@ -31608,13 +31664,14 @@ var WeaveBrushToolAction = class extends WeaveAction {
 				this.cancelAction();
 				return;
 			}
-			if (e.code === "Space" && this.instance.getActiveAction() === BRUSH_TOOL_ACTION_NAME) this.isSpacePressed = true;
-			if (e.code === "Escape" && this.instance.getActiveAction() === BRUSH_TOOL_ACTION_NAME) {
-				this.cancelAction();
+			if (e.code === "Space" && this.instance.getActiveAction() === BRUSH_TOOL_ACTION_NAME) {
+				this.isSpacePressed = true;
 				return;
 			}
+			if (e.code === "Escape" && this.instance.getActiveAction() === BRUSH_TOOL_ACTION_NAME) this.cancelAction();
 		});
 		const handlePointerDown = (e) => {
+			if (this.state === BRUSH_TOOL_STATE.INACTIVE) return;
 			if (this.state !== BRUSH_TOOL_STATE.IDLE) return;
 			if (this.getZoomPlugin()?.isPinching()) return;
 			if (this.isSpacePressed) return;