@inditextech/weave-sdk 3.9.0-SNAPSHOT.186.1 → 3.9.1

package/dist/sdk.node.js

@@ -32,13 +32,13 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 }) : target, mod));
 
 //#endregion
-//#region node_modules/emittery/maps.js
+//#region ../../node_modules/emittery/maps.js
 const anyMap = new WeakMap();
 const eventsMap = new WeakMap();
 const producersMap = new WeakMap();
 
 //#endregion
-//#region node_modules/emittery/index.js
+//#region ../../node_modules/emittery/index.js
 const anyProducer = Symbol("anyProducer");
 const resolvedPromise = Promise.resolve();
 const listenerAdded = Symbol("listenerAdded");
@@ -441,11 +441,11 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 		/** Used as a safe reference for `undefined` in pre-ES5 environments. */
 		var undefined$1;
 		/** Used as the semantic version number. */
-		var VERSION = "4.17.21";
+		var VERSION = "4.18.1";
 		/** Used as the size to enable large array optimizations. */
 		var LARGE_ARRAY_SIZE$1 = 200;
 		/** Error message constants. */
-		var CORE_ERROR_TEXT = "Unsupported core-js use. Try https://npms.io/search?q=ponyfill.", FUNC_ERROR_TEXT$2 = "Expected a function", INVALID_TEMPL_VAR_ERROR_TEXT = "Invalid `variable` option passed into `_.template`";
+		var CORE_ERROR_TEXT = "Unsupported core-js use. Try https://npms.io/search?q=ponyfill.", FUNC_ERROR_TEXT$2 = "Expected a function", INVALID_TEMPL_VAR_ERROR_TEXT = "Invalid `variable` option passed into `_.template`", INVALID_TEMPL_IMPORTS_ERROR_TEXT = "Invalid `imports` option passed into `_.template`";
 		/** Used to stand-in for `undefined` hash values. */
 		var HASH_UNDEFINED$2 = "__lodash_hash_undefined__";
 		/** Used as the maximum memoize cache size. */
@@ -1885,6 +1885,10 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			* embedded Ruby (ERB) as well as ES2015 template strings. Change the
 			* following template settings to use alternative delimiters.
 			*
+			* **Security:** See
+			* [threat model](https://github.com/lodash/lodash/blob/main/threat-model.md)
+			* — `_.template` is insecure and will be removed in v5.
+			*
 			* @static
 			* @memberOf _
 			* @type {Object}
@@ -2287,7 +2291,7 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			* @name has
 			* @memberOf SetCache
 			* @param {*} value The value to search for.
-			* @returns {number} Returns `true` if `value` is found, else `false`.
+			* @returns {boolean} Returns `true` if `value` is found, else `false`.
 			*/
 			function setCacheHas(value) {
 				return this.__data__.has(value);
@@ -3825,8 +3829,15 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			*/
 			function baseUnset(object, path) {
 				path = castPath(path, object);
-				object = parent(object, path);
-				return object == null || delete object[toKey(last(path))];
+				var index = -1, length = path.length;
+				if (!length) return true;
+				while (++index < length) {
+					var key = toKey(path[index]);
+					if (key === "__proto__" && !hasOwnProperty$9.call(object, "__proto__")) return false;
+					if ((key === "constructor" || key === "prototype") && index < length - 1) return false;
+				}
+				var obj = parent(object, path);
+				return obj == null || delete obj[toKey(last(path))];
 			}
 			/**
 			* The base implementation of `_.update`.
@@ -5730,7 +5741,7 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			}
 			/**
 			* Creates an array with all falsey values removed. The values `false`, `null`,
-			* `0`, `""`, `undefined`, and `NaN` are falsey.
+			* `0`, `-0`, `0n`, `""`, `undefined`, and `NaN` are falsy.
 			*
 			* @static
 			* @memberOf _
@@ -6208,7 +6219,7 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 				var index = -1, length = pairs == null ? 0 : pairs.length, result$1 = {};
 				while (++index < length) {
 					var pair = pairs[index];
-					result$1[pair[0]] = pair[1];
+					baseAssignValue$4(result$1, pair[0], pair[1]);
 				}
 				return result$1;
 			}
@@ -12311,6 +12322,8 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			* **Note:** JavaScript follows the IEEE-754 standard for resolving
 			* floating-point values which can produce unexpected results.
 			*
+			* **Note:** If `lower` is greater than `upper`, the values are swapped.
+			*
 			* @static
 			* @memberOf _
 			* @since 0.7.0
@@ -12324,9 +12337,16 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			* _.random(0, 5);
 			* // => an integer between 0 and 5
 			*
+			* // when lower is greater than upper the values are swapped
+			* _.random(5, 0);
+			* // => an integer between 0 and 5
+			*
 			* _.random(5);
 			* // => also an integer between 0 and 5
 			*
+			* _.random(-5);
+			* // => an integer between -5 and 0
+			*
 			* _.random(5, true);
 			* // => a floating-point number between 0 and 5
 			*
@@ -12859,6 +12879,10 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			* properties may be accessed as free variables in the template. If a setting
 			* object is given, it takes precedence over `_.templateSettings` values.
 			*
+			* **Security:** `_.template` is insecure and should not be used. It will be
+			* removed in Lodash v5. Avoid untrusted input. See
+			* [threat model](https://github.com/lodash/lodash/blob/main/threat-model.md).
+			*
 			* **Note:** In the development build `_.template` utilizes
 			* [sourceURLs](http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/#toc-sourceurl)
 			* for easier debugging.
@@ -12960,8 +12984,11 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 				var settings = lodash.templateSettings;
 				if (guard && isIterateeCall$2(string, options, guard)) options = undefined$1;
 				string = toString(string);
-				options = assignInWith({}, options, settings, customDefaultsAssignIn);
-				var imports = assignInWith({}, options.imports, settings.imports, customDefaultsAssignIn), importsKeys = keys(imports), importsValues = baseValues(imports, importsKeys);
+				options = assignWith({}, options, settings, customDefaultsAssignIn);
+				var imports = assignWith({}, options.imports, settings.imports, customDefaultsAssignIn), importsKeys = keys(imports), importsValues = baseValues(imports, importsKeys);
+				arrayEach(importsKeys, function(key) {
+					if (reForbiddenIdentifierChars.test(key)) throw new Error$1(INVALID_TEMPL_IMPORTS_ERROR_TEXT);
+				});
 				var isEscaping, isEvaluating, index = 0, interpolate = options.interpolate || reNoMatch, source = "__p += '";
 				var reDelimiters = RegExp$1((options.escape || reNoMatch).source + "|" + interpolate.source + "|" + (interpolate === reInterpolate ? reEsTemplate : reNoMatch).source + "|" + (options.evaluate || reNoMatch).source + "|$", "g");
 				var sourceURL = "//# sourceURL=" + (hasOwnProperty$9.call(options, "sourceURL") ? (options.sourceURL + "").replace(/\s/g, " ") : "lodash.templateSources[" + ++templateCounter + "]") + "\n";
@@ -20754,8 +20781,8 @@ var WeaveNode = class {
 		return cancelBubble;
 	}
 	handleMouseout(e, node) {
-		const isCtrlOrMetaPressed = e.evt.ctrlKey || e.evt.metaKey;
-		if (isCtrlOrMetaPressed) return;
+		const isCtrlOrMetaPressed = e.evt?.ctrlKey || e.evt?.metaKey;
+		if (isCtrlOrMetaPressed) return false;
 		const realNode = this.instance.getInstanceRecursive(node);
 		if (realNode) this.hideHoverState();
 	}
@@ -21409,10 +21436,16 @@ var WeaveTargetingManager = class {
 		const utilityLayer = this.instance.getUtilityLayer();
 		if (utilityLayer) utilityLayer.visible(false);
 		let containerAlt = containerOverCursor(this.instance, [], relativeMousePointer);
-		if (!containerAlt) containerAlt = this.instance.getMainLayer();
 		const nodesSelection = this.instance.getPlugin("nodesSelection");
 		if (nodesSelection) nodesSelection.getTransformer().visible(false);
-		relativeMousePointer = containerAlt?.getRelativePointerPosition() ?? relativeMousePointer;
+		if (containerAlt && point === void 0) relativeMousePointer = containerAlt.getRelativePointerPosition() ?? relativeMousePointer;
+		if (!containerAlt && point === void 0) {
+			containerAlt = this.instance.getMainLayer();
+			relativeMousePointer = containerAlt?.getRelativePointerPosition() ?? {
+				x: 0,
+				y: 0
+			};
+		}
 		if (utilityLayer) utilityLayer.visible(true);
 		if (nodesSelection) nodesSelection.getTransformer().visible(true);
 		return {
@@ -22007,7 +22040,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "3.9.0-SNAPSHOT.186.1";
+var version = "3.9.1";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -25708,7 +25741,7 @@ const WEAVE_IMAGE_DEFAULT_CONFIG = {
 		cursor: { loading: "wait" }
 	},
 	imageLoading: {
-		maxRetryAttempts: 15,
+		maxRetryAttempts: 3,
 		retryDelayMs: 2e3
 	},
 	crossOrigin: "anonymous",
@@ -25758,19 +25791,7 @@ var WeaveImageCrop = class WeaveImageCrop {
 		this.onClose = () => {};
 		this.handleHide = this.hide.bind(this);
 	}
-	show(onClose, options) {
-		this.onClose = onClose;
-		const nodeEdgeSnappingPlugin = this.getNodesEdgeSnappingPlugin();
-		if (nodeEdgeSnappingPlugin) nodeEdgeSnappingPlugin.disable();
-		const nodeDistanceSnappingPlugin = this.getNodesDistanceSnappingPlugin();
-		if (nodeDistanceSnappingPlugin) nodeDistanceSnappingPlugin.disable();
-		const nodesSelectionPlugin = this.getNodesSelectionPlugin();
-		if (nodesSelectionPlugin) nodesSelectionPlugin.disable();
-		this.node.clearCache(this.image);
-		this.image.setAttrs({ cropping: true });
-		this.image.listening(false);
-		const imageAttrs = this.image.getAttrs();
-		this.internalImage.hide();
+	setupCropImage(imageAttrs, visible) {
 		this.cropGroup.destroyChildren();
 		const actualScale = imageAttrs.uncroppedImage.width / imageAttrs.imageInfo.width;
 		const cropScale = imageAttrs.cropInfo ? imageAttrs.cropInfo.scaleX : actualScale;
@@ -25784,10 +25805,26 @@ var WeaveImageCrop = class WeaveImageCrop {
 			scaleY: 1,
 			image: this.internalImage.image(),
 			crop: void 0,
-			visible: true,
+			visible,
 			listening: false,
 			draggable: false
 		});
+		return { realScale };
+	}
+	show(onClose, options) {
+		this.onClose = onClose;
+		const nodeEdgeSnappingPlugin = this.getNodesEdgeSnappingPlugin();
+		if (nodeEdgeSnappingPlugin) nodeEdgeSnappingPlugin.disable();
+		const nodeDistanceSnappingPlugin = this.getNodesDistanceSnappingPlugin();
+		if (nodeDistanceSnappingPlugin) nodeDistanceSnappingPlugin.disable();
+		const nodesSelectionPlugin = this.getNodesSelectionPlugin();
+		if (nodesSelectionPlugin) nodesSelectionPlugin.disable();
+		this.node.clearCache(this.image);
+		this.image.setAttrs({ cropping: true });
+		this.image.listening(false);
+		const imageAttrs = this.image.getAttrs();
+		this.internalImage.hide();
+		const { realScale } = this.setupCropImage(imageAttrs, true);
 		this.imageOffsetX = imageAttrs.cropInfo ? imageAttrs.cropInfo.x * realScale : 0;
 		this.imageOffsetY = imageAttrs.cropInfo ? imageAttrs.cropInfo.y * realScale : 0;
 		const cropModeConfiguration = this.node.getConfiguration().cropMode;
@@ -26164,23 +26201,7 @@ var WeaveImageCrop = class WeaveImageCrop {
 	}
 	unCrop() {
 		const imageAttrs = this.image.getAttrs();
-		this.cropGroup.destroyChildren();
-		const actualScale = imageAttrs.uncroppedImage.width / imageAttrs.imageInfo.width;
-		const cropScale = imageAttrs.cropInfo ? imageAttrs.cropInfo.scaleX : actualScale;
-		const realScale = actualScale / cropScale;
-		this.cropImage = new Konva.Image({
-			x: imageAttrs.cropInfo ? -imageAttrs.cropInfo.x * realScale : 0,
-			y: imageAttrs.cropInfo ? -imageAttrs.cropInfo.y * realScale : 0,
-			width: imageAttrs.uncroppedImage.width,
-			height: imageAttrs.uncroppedImage.height,
-			scaleX: 1,
-			scaleY: 1,
-			image: this.internalImage.image(),
-			crop: void 0,
-			visible: false,
-			listening: false,
-			draggable: false
-		});
+		this.setupCropImage(imageAttrs, false);
 		this.cropGroup.add(this.cropImage);
 		const cropImageStage = this.cropImage.getAbsolutePosition();
 		this.image.setAttrs({
@@ -26229,12 +26250,80 @@ var WeaveImageCrop = class WeaveImageCrop {
 			this.instance.updateNode(this.node.serialize(this.image));
 		}
 	}
+	handleClipExternal(image, reference) {
+		const stage = this.instance.getStage();
+		const originalRotation = image.getAbsoluteRotation();
+		if (image.getAbsoluteRotation() !== reference.getAbsoluteRotation()) throw new Error("Image and reference must have the same rotation", { cause: "RotationNotAligned" });
+		const originalContainer = image.getParent();
+		const group = new Konva.Group();
+		image.moveTo(group);
+		reference.moveTo(group);
+		originalContainer?.add(group);
+		group.rotate(-originalRotation);
+		const dImage = group.findOne("#" + image.getAttrs().id);
+		const dReference = group.findOne("#" + reference.getAttrs().id);
+		const intersectionRectAbs = this.getIntersectionRect(dImage, dReference);
+		const intersectionRect = this.getIntersectionRect(dImage, dReference, stage);
+		const imageRect = dImage.getClientRect({
+			relativeTo: stage,
+			skipStroke: true
+		});
+		if (!intersectionRect || !intersectionRectAbs) return;
+		const imageAttrs = this.image.getAttrs();
+		const actualScale = imageAttrs.uncroppedImage.width / imageAttrs.imageInfo.width;
+		const cropScale = imageAttrs.cropInfo ? imageAttrs.cropInfo.scaleX : actualScale;
+		const realScale = actualScale / cropScale;
+		const imageOffsetX = imageAttrs.cropInfo ? imageAttrs.cropInfo.x * realScale : 0;
+		const imageOffsetY = imageAttrs.cropInfo ? imageAttrs.cropInfo.y * realScale : 0;
+		const diffX = intersectionRect.x - imageRect.x;
+		const diffY = intersectionRect.y - imageRect.y;
+		const realClipRect = {
+			scaleX: actualScale,
+			scaleY: actualScale,
+			x: WeaveImageCrop.roundTo6Decimals(diffX + imageOffsetX),
+			y: WeaveImageCrop.roundTo6Decimals(diffY + imageOffsetY),
+			width: WeaveImageCrop.roundTo6Decimals(intersectionRect.width),
+			height: WeaveImageCrop.roundTo6Decimals(intersectionRect.height)
+		};
+		if (dImage) {
+			const cropSize = {
+				x: diffX,
+				y: diffY,
+				width: intersectionRect.width,
+				height: intersectionRect.height
+			};
+			dImage.setAttrs({
+				width: intersectionRect.width,
+				height: intersectionRect.height,
+				cropInfo: realClipRect,
+				cropSize,
+				uncroppedImage: {
+					width: imageAttrs.uncroppedImage.width,
+					height: imageAttrs.uncroppedImage.height
+				}
+			});
+			dImage.setAbsolutePosition(intersectionRectAbs);
+			group.rotate(originalRotation);
+			group.getChildren().forEach((child) => {
+				child.moveTo(originalContainer);
+			});
+			group.destroy();
+			const fImage = stage.findOne("#" + image.getAttrs().id);
+			if (fImage) this.instance.updateNodeNT(this.node.serialize(fImage));
+		}
+	}
 	static roundTo6Decimals(value) {
 		return parseFloat(value.toFixed(6));
 	}
-	getIntersectionRect(a, b) {
-		const rectA = a.getClientRect({ skipStroke: true });
-		const rectB = b.getClientRect({ skipStroke: true });
+	getIntersectionRect(a, b, relativeTo) {
+		const rectA = a.getClientRect({
+			skipStroke: true,
+			relativeTo
+		});
+		const rectB = b.getClientRect({
+			skipStroke: true,
+			relativeTo
+		});
 		const x1 = WeaveImageCrop.roundTo6Decimals(Math.max(rectA.x, rectB.x));
 		const y1 = WeaveImageCrop.roundTo6Decimals(Math.max(rectA.y, rectB.y));
 		const x2 = WeaveImageCrop.roundTo6Decimals(Math.min(rectA.x + rectA.width, rectB.x + rectB.width));
@@ -26726,8 +26815,8 @@ var WeaveImageNode = class extends WeaveNode {
 			y: p.y - offsetY
 		}));
 		const rect = new Konva.Rect({
-			width: absoluteCorners[1].x - absoluteCorners[0].x,
-			height: absoluteCorners[2].y - absoluteCorners[0].y,
+			width: Math.hypot(absoluteCorners[1].x - absoluteCorners[0].x, absoluteCorners[1].y - absoluteCorners[0].y),
+			height: Math.hypot(absoluteCorners[3].x - absoluteCorners[0].x, absoluteCorners[3].y - absoluteCorners[0].y),
 			fill: "transparent",
 			strokeScaleEnabled: false,
 			strokeWidth: 2,
@@ -26852,7 +26941,11 @@ var WeaveImageNode = class extends WeaveNode {
 	onUpdate(nodeInstance, nextProps) {
 		const id = nodeInstance.getAttrs().id;
 		const node = nodeInstance;
-		nodeInstance.setAttrs({ ...nextProps });
+		nodeInstance.setAttrs({
+			...nextProps,
+			...nextProps.cropInfo ? { cropInfo: nextProps.cropInfo } : { cropInfo: void 0 },
+			...nextProps.cropSize ? { cropSize: nextProps.cropSize } : { cropSize: void 0 }
+		});
 		const imagePlaceholder = node.findOne(`#${id}-placeholder`);
 		const internalImage = node.findOne(`#${id}-image`);
 		const nodeAttrs = node.getAttrs();
@@ -26896,29 +26989,12 @@ var WeaveImageNode = class extends WeaveNode {
 			});
 		}
 		if (this.imageState[id ?? ""]?.loaded && this.imageState[id ?? ""]?.error) {
-			imagePlaceholder?.setAttrs({
-				...internalImageProps,
-				...nodeAttrs.imageProperties ?? {},
-				name: void 0,
-				id: `${id}-placeholder`,
-				nodeId: id,
-				x: 0,
-				y: 0,
-				scaleX: 1,
-				scaleY: 1,
-				rotation: 0,
-				visible: true,
-				fill: this.config.style.placeholder.fill,
-				strokeWidth: 0,
-				draggable: false,
-				zIndex: 0
-			});
 			internalImage?.setAttrs({
 				...internalImageProps,
 				...nodeAttrs.imageProperties ?? {},
 				name: void 0,
 				id: `${id}-image`,
-				image: void 0,
+				image: this.imageFallback[id ?? ""],
 				nodeId: id,
 				x: 0,
 				y: 0,
@@ -26929,6 +27005,8 @@ var WeaveImageNode = class extends WeaveNode {
 				draggable: false,
 				zIndex: 1
 			});
+			internalImage?.visible(true);
+			this.updateImageCrop(nodeInstance);
 		}
 		if (this.imageState[id ?? ""]?.loaded && !this.imageState[id ?? ""]?.error) {
 			internalImage?.setAttrs({
@@ -26983,14 +27061,18 @@ var WeaveImageNode = class extends WeaveNode {
 	}
 	preloadImage(imageId, imageURL, { onLoad, onError }, loadingTryout = false) {
 		const imageURLToLoad = imageURL ?? "http://localhost/false-image";
+		if (imageURLToLoad === "") {
+			this.setErrorState(imageId);
+			return;
+		}
 		this.imageSource[imageId] = Konva.Util.createImageElement();
 		this.imageSource[imageId].crossOrigin = this.config.crossOrigin;
 		this.imageSource[imageId].onerror = (error) => {
-			if (!loadingTryout) this.imageState[imageId] = {
-				status: "error",
-				loaded: false,
-				error: true
-			};
+			if (!loadingTryout) {
+				const stage = this.instance.getStage();
+				const image = stage.findOne(`#${imageId}`);
+				if (image) this.setErrorState(imageId, image);
+			}
 			onError(error);
 		};
 		this.imageSource[imageId].onload = async () => {
@@ -27085,36 +27167,29 @@ var WeaveImageNode = class extends WeaveNode {
 				}
 			},
 			onError: (error) => {
-				if (!this.config.useFallbackImage) this.imageTryoutIds[id] = setTimeout(() => {
-					const node = this.instance.getStage().findOne(`#${id}`);
-					if (node) {
-						this.imageTryoutAttempts[id] = (this.imageTryoutAttempts[id] ?? 0) + 1;
-						this.loadImage(node.getAttrs(), node, false, true);
-					}
-				}, this.config.imageLoading.retryDelayMs);
+				if (!this.config.useFallbackImage) {
+					const tryoutAttempts = this.imageTryoutAttempts[id] ?? 0;
+					if (tryoutAttempts - 1 < this.config.imageLoading.maxRetryAttempts) {
+						this.loadImageTryout(id);
+						return;
+					} else this.setErrorState(id, image);
+				}
 				if (loadTryout) {
 					const tryoutAttempts = this.imageTryoutAttempts[id] ?? 0;
-					if (tryoutAttempts < this.config.imageLoading.maxRetryAttempts) this.imageTryoutIds[id] = setTimeout(() => {
-						const node = this.instance.getStage().findOne(`#${id}`);
-						if (node) {
-							this.imageTryoutAttempts[id] = tryoutAttempts + 1;
-							this.loadImage(node.getAttrs(), node, false, true);
-						}
-					}, this.config.imageLoading.retryDelayMs);
+					if (tryoutAttempts - 1 < this.config.imageLoading.maxRetryAttempts) {
+						this.loadImageTryout(id);
+						return;
+					} else this.setErrorState(id, image);
 					return;
 				}
 				if (this.config.useFallbackImage && !useFallback && !loadTryout && imageProps.imageFallback) {
 					this.loadImage({ ...params }, image, true);
 					return;
 				}
-				this.imageState[id] = {
-					status: "error",
-					loaded: false,
-					error: true
-				};
+				this.setErrorState(id, image);
 				image.setAttrs({ image: void 0 });
+				console.error("Error loading image", error);
 				this.resolveAsyncElement(id);
-				console.error("Error loading image", realImageURL, error);
 				imagePlaceholder?.setAttrs({ visible: true });
 				internalImage?.setAttrs({ visible: false });
 				this.cacheNode(image);
@@ -27244,6 +27319,41 @@ var WeaveImageNode = class extends WeaveNode {
 		}
 		nodeInstance.destroy();
 	}
+	loadImageTryout(imageId) {
+		this.imageTryoutIds[imageId] = setTimeout(() => {
+			const node = this.instance.getStage().findOne(`#${imageId}`);
+			if (node) {
+				const tryoutAttempts = this.imageTryoutAttempts[imageId] ?? 0;
+				this.imageTryoutAttempts[imageId] = tryoutAttempts + 1;
+				this.loadImage(node.getAttrs(), node, false, true);
+			}
+		}, this.config.imageLoading.retryDelayMs);
+	}
+	setErrorState(imageId, image) {
+		this.imageState[imageId] = {
+			status: "loaded",
+			loaded: true,
+			error: true
+		};
+		this.resolveAsyncElement(imageId);
+		if (image) this.cacheNode(image);
+	}
+	cropImageWithReference(image, reference) {
+		const internalImage = image?.findOne(`#${image.getAttrs().id}-image`);
+		const cropGroup = image?.findOne(`#${image.getAttrs().id}-cropGroup`);
+		if (!internalImage || !cropGroup) throw new Error("Provided element is not a valid image node.", { cause: "InvalidImageNode" });
+		this.imageCrop = new WeaveImageCrop(this.instance, this, image, internalImage, cropGroup);
+		this.instance.stateTransactional(() => {
+			this.imageCrop?.handleClipExternal(image, reference);
+			const nodeHandler = this.instance.getNodeHandler(reference.getAttrs().nodeType);
+			if (nodeHandler) {
+				const rectangleState = nodeHandler.serialize(reference);
+				this.instance.removeNodeNT(rectangleState);
+			}
+		});
+		this.getNodesSelectionPlugin()?.setSelectedNodes([image]);
+		this.getNodesSelectionPlugin()?.getHoverTransformer().forceUpdate();
+	}
 };
 
 //#endregion
@@ -34416,14 +34526,15 @@ var WeaveImageToolAction = class extends WeaveAction {
 			const dragProperties = this.instance.getDragProperties();
 			if (dragProperties && dragId === WEAVE_IMAGE_TOOL_ACTION_NAME) {
 				this.instance.getStage().setPointersPositions(e);
-				const position = this.instance.getStage().getRelativePointerPosition();
-				if (!position) return;
+				const { mousePoint, container } = this.instance.getMousePointer();
+				if (!mousePoint) return;
 				this.instance.triggerAction(WEAVE_IMAGE_TOOL_ACTION_NAME, {
 					type: WEAVE_IMAGE_TOOL_UPLOAD_TYPE.IMAGE_URL,
 					image: dragProperties.imageURL,
 					...dragProperties.imageId ? { imageId: dragProperties.imageId } : {},
 					...dragProperties.forceMainContainer && { forceMainContainer: dragProperties.forceMainContainer },
-					position
+					container,
+					position: mousePoint
 				});
 			}
 		});
@@ -34590,7 +34701,7 @@ var WeaveImageToolAction = class extends WeaveAction {
 			}
 			const { mousePoint, container } = this.instance.getMousePointer(position);
 			this.imageAction[nodeId].clickPoint = mousePoint;
-			this.imageAction[nodeId].container = container;
+			this.imageAction[nodeId].container = this.imageAction[nodeId].container ?? container;
 			const nodeHandler = this.instance.getNodeHandler("image");
 			const imageWidth = this.imageAction[nodeId].props.width ? this.imageAction[nodeId].props.width : imageSource?.width;
 			const imageHeight = this.imageAction[nodeId].props.height ? this.imageAction[nodeId].props.height : imageSource?.height;
@@ -34657,9 +34768,9 @@ var WeaveImageToolAction = class extends WeaveAction {
 			props: this.initProps(),
 			imageId: nodeId,
 			clickPoint: null,
-			container: void 0,
 			imageFile: null,
 			imageURL: null,
+			container: params?.container,
 			forceMainContainer: params?.forceMainContainer ?? false,
 			uploadType: null,
 			uploadImageFunction: null
@@ -34866,12 +34977,13 @@ var WeaveImagesToolAction = class extends WeaveAction {
 			const dragProperties = this.instance.getDragProperties();
 			if (dragProperties && dragId === WEAVE_IMAGES_TOOL_ACTION_NAME) {
 				this.instance.getStage().setPointersPositions(e);
-				const position = this.instance.getStage().getRelativePointerPosition();
-				if (!position) return;
+				const { mousePoint, container } = this.instance.getMousePointer();
+				if (!mousePoint) return;
 				this.instance.triggerAction(WEAVE_IMAGES_TOOL_ACTION_NAME, {
 					type: WEAVE_IMAGES_TOOL_UPLOAD_TYPE.IMAGE_URL,
 					images: dragProperties.imagesURL,
-					position,
+					container,
+					position: mousePoint,
 					...dragProperties.forceMainContainer && { forceMainContainer: dragProperties.forceMainContainer }
 				});
 			}
@@ -35032,7 +35144,7 @@ var WeaveImagesToolAction = class extends WeaveAction {
 		stage.container().style.cursor = "default";
 		const { mousePoint, container } = this.instance.getMousePointer(position);
 		this.clickPoint = mousePoint;
-		this.container = container;
+		this.container = this.container ?? container;
 		const originPoint = {
 			x: this.clickPoint?.x ?? 0,
 			y: this.clickPoint?.y ?? 0
@@ -35087,10 +35199,8 @@ var WeaveImagesToolAction = class extends WeaveAction {
 						},
 						uploadImageFunction: uploadImageFunctionInternal,
 						...imageId && { imageId },
-						position: {
-							x: position$1.x,
-							y: position$1.y
-						},
+						position: position$1,
+						container: this.container,
 						forceMainContainer: this.forceMainContainer,
 						nodeId: nodeId$1
 					}, true);
@@ -35124,10 +35234,8 @@ var WeaveImagesToolAction = class extends WeaveAction {
 					},
 					...imageId && { imageId },
 					...options && { options },
-					position: {
-						x: position$1.x,
-						y: position$1.y
-					},
+					position: position$1,
+					container: this.container,
 					forceMainContainer: this.forceMainContainer,
 					nodeId: nodeId$1
 				}, true);
@@ -35160,6 +35268,7 @@ var WeaveImagesToolAction = class extends WeaveAction {
 		const selectionPlugin = this.instance.getPlugin("nodesSelection");
 		if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
 		if (params?.position) this.setState(WEAVE_IMAGES_TOOL_STATE.SELECTED_POSITION);
+		if (params?.container) this.container = params.container;
 		this.nodesIds = [];
 		this.forceMainContainer = params.forceMainContainer ?? false;
 		if (params.type === WEAVE_IMAGES_TOOL_UPLOAD_TYPE.FILE) {
@@ -36977,11 +37086,13 @@ var WeaveVideoToolAction = class extends WeaveAction {
 			const dragProperties = this.instance.getDragProperties();
 			if (dragProperties && dragId === VIDEO_TOOL_ACTION_NAME) {
 				this.instance.getStage().setPointersPositions(e);
-				const position = this.instance.getStage().getRelativePointerPosition();
+				const { mousePoint, container } = this.instance.getMousePointer();
+				if (!mousePoint) return;
 				this.instance.triggerAction(VIDEO_TOOL_ACTION_NAME, {
 					videoId: dragProperties.videoId,
 					videoParams: dragProperties.videoParams,
-					position
+					container,
+					position: mousePoint
 				});
 			}
 		});
@@ -37032,7 +37143,7 @@ var WeaveVideoToolAction = class extends WeaveAction {
 		if (this.videoId && this.videoParams) {
 			const { mousePoint, container } = this.instance.getMousePointer(position);
 			this.clickPoint = mousePoint;
-			this.container = container;
+			this.container = this.container ?? container;
 			const nodeHandler = this.instance.getNodeHandler("video");
 			if (nodeHandler) {
 				const node = nodeHandler.create(this.videoId, {
@@ -37063,6 +37174,7 @@ var WeaveVideoToolAction = class extends WeaveAction {
 		this.cancelAction = cancelAction;
 		const selectionPlugin = this.instance.getPlugin("nodesSelection");
 		if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
+		this.container = params?.container;
 		this.forceMainContainer = params?.forceMainContainer ?? false;
 		if (params?.videoId) this.updateProps({ videoId: params.videoId });
 		if (params?.videoParams) {