@inditextech/weave-sdk 2.10.0 → 2.11.1

package/dist/sdk.node.js

@@ -10311,7 +10311,7 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			* _.isNaN(undefined);
 			* // => false
 			*/
-			function isNaN(value) {
+			function isNaN$1(value) {
 				return isNumber(value) && value != +value;
 			}
 			/**
@@ -14728,7 +14728,7 @@ var require_lodash = __commonJS({ "../../node_modules/lodash/lodash.js"(exports,
 			lodash.isMap = isMap;
 			lodash.isMatch = isMatch;
 			lodash.isMatchWith = isMatchWith;
-			lodash.isNaN = isNaN;
+			lodash.isNaN = isNaN$1;
 			lodash.isNative = isNative;
 			lodash.isNil = isNil;
 			lodash.isNull = isNull;
@@ -15256,6 +15256,7 @@ const WEAVE_NODES_SELECTION_DEFAULT_CONFIG = {
 				anchor.offsetX(4);
 			}
 		},
+		anchorSize: 12,
 		borderStroke: "#1a1aff",
 		borderStrokeWidth: 2
 	},
@@ -20660,6 +20661,7 @@ var WeaveReconciler = class {
 					newProps.height = rootContainer.getStageConfiguration().height;
 				}
 				const element = handler.onRender(newProps);
+				hostContext.emitEvent("onNodeRenderedAdded", element);
 				return element;
 			},
 			detachDeletedInstance(node) {
@@ -21873,7 +21875,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "2.10.0";
+var version = "2.11.1";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -22535,6 +22537,10 @@ var Weave = class {
 		this.moduleLogger.debug(`Listening event [${event}]`);
 		this.emitter.on(event, callback);
 	}
+	addOnceEventListener(event, callback) {
+		this.moduleLogger.debug(`Listening once event [${event}]`);
+		this.emitter.once(event).then(callback);
+	}
 	removeEventListener(event, callback) {
 		this.moduleLogger.debug(`Removing listening to event [${event}]`);
 		this.emitter.off(event, callback);
@@ -27005,6 +27011,698 @@ var WeaveVideoNode = class extends WeaveNode {
 	}
 };
 
+//#endregion
+//#region src/nodes/measure/constants.ts
+const WEAVE_MEASURE_NODE_TYPE = "measure";
+const WEAVE_MEASURE_NODE_DEFAULT_CONFIG = { style: {
+	separationLine: {
+		padding: 0,
+		strokeWidth: 1,
+		dash: [],
+		stroke: "#FF3366"
+	},
+	text: {
+		padding: 10,
+		fontSize: 14,
+		fontFamily: "monospace",
+		fill: "#FF3366"
+	},
+	intersectionCircle: {
+		radius: 3,
+		fill: "#FF3366"
+	},
+	measureLine: {
+		stroke: "#FF3366",
+		dash: [4, 4],
+		strokeWidth: 1
+	},
+	handler: {
+		noSpaceSeparationMultiplier: 2.5,
+		spaceSeparationMultiplier: 1.5
+	}
+} };
+
+//#endregion
+//#region src/nodes/measure/measure.ts
+var WeaveMeasureNode = class extends WeaveNode {
+	nodeType = WEAVE_MEASURE_NODE_TYPE;
+	handlePointCircleRadius = 6;
+	constructor(params) {
+		super();
+		this.config = mergeExceptArrays(WEAVE_MEASURE_NODE_DEFAULT_CONFIG, params?.config ?? {});
+	}
+	onRender(props) {
+		const measure = new Konva.Group({
+			...props,
+			name: "node",
+			draggable: false
+		});
+		const fromPoint = props.fromPoint;
+		const toPoint = props.toPoint;
+		const separation = props.separation ?? 100;
+		const orientation = props.orientation ?? -1;
+		const unit = props.unit ?? "cms";
+		const unitPerPixel = props.unitPerPixel ?? 100;
+		const measureLine = this.config.style.measureLine;
+		const intersectionCircle = this.config.style.intersectionCircle;
+		const separationLine = this.config.style.separationLine;
+		const textConfig = this.config.style.text;
+		const fromFinalPerp = this.perpendicularPoint(fromPoint, toPoint, fromPoint, (separation + separationLine.padding) * orientation);
+		const linePerpFrom = new Konva.Line({
+			id: `linePerpFrom-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			points: [
+				fromPoint.x,
+				fromPoint.y,
+				fromFinalPerp.left.x,
+				fromFinalPerp.left.y
+			],
+			stroke: separationLine.stroke,
+			strokeWidth: separationLine.strokeWidth,
+			dash: separationLine.dash
+		});
+		measure.add(linePerpFrom);
+		const toFinalPerp = this.perpendicularPoint(fromPoint, toPoint, toPoint, (separation + separationLine.padding) * orientation);
+		const linePerpTo = new Konva.Line({
+			id: `linePerpTo-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			points: [
+				toPoint.x,
+				toPoint.y,
+				toFinalPerp.left.x,
+				toFinalPerp.left.y
+			],
+			stroke: separationLine.stroke,
+			strokeWidth: separationLine.strokeWidth,
+			dash: separationLine.dash
+		});
+		measure.add(linePerpTo);
+		const fromPerp = this.perpendicularPoint(fromPoint, toPoint, fromPoint, separation * orientation);
+		const fromCircle = new Konva.Circle({
+			id: `fromCircle-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			x: fromPerp.left.x,
+			y: fromPerp.left.y,
+			radius: intersectionCircle.radius,
+			fill: intersectionCircle.fill
+		});
+		measure.add(fromCircle);
+		const toPerp = this.perpendicularPoint(fromPoint, toPoint, toPoint, separation * orientation);
+		const toCircle = new Konva.Circle({
+			id: `toCircle-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			x: toPerp.left.x,
+			y: toPerp.left.y,
+			radius: intersectionCircle.radius,
+			fill: intersectionCircle.fill
+		});
+		measure.add(toCircle);
+		const midPoint = this.midPoint(fromPerp.left, toPerp.left);
+		const distance = this.distanceBetweenPoints(fromPoint, toPoint);
+		const units = distance / unitPerPixel;
+		const text = `${units.toFixed(2)} ${unit}`;
+		const measureText = new Konva.Text({
+			id: `measureText-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			x: midPoint.x,
+			y: midPoint.y,
+			text,
+			fontFamily: textConfig.fontFamily,
+			fontSize: textConfig.fontSize,
+			verticalAlign: "middle",
+			align: "center",
+			fill: textConfig.fill
+		});
+		const angle = this.getAngle(fromPoint, toPoint);
+		const textSize = measureText.measureSize(text);
+		const textOffsetX = textSize.width / 2;
+		measureText.rotation(angle);
+		measureText.offsetX(textSize.width / 2);
+		measureText.offsetY(textSize.height / 2);
+		if (textSize.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left)) {
+			const perpPointTextMid = this.perpendicularPoint(fromPerp.left, toPerp.left, midPoint, (textSize.height + separationLine.padding) * orientation);
+			measureText.x(perpPointTextMid.left.x);
+			measureText.y(perpPointTextMid.left.y);
+		}
+		measure.add(measureText);
+		const pointLeftText = this.pointFromMid(fromPerp.left, toPerp.left, textSize.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left) ? 0 : textOffsetX + textConfig.padding, false);
+		const pointRightText = this.pointFromMid(fromPerp.left, toPerp.left, textSize.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left) ? 0 : textOffsetX + textConfig.padding, true);
+		const lineLeft = new Konva.Line({
+			id: `lineLeft-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			points: [
+				fromPerp.left.x,
+				fromPerp.left.y,
+				pointLeftText.x,
+				pointLeftText.y
+			],
+			dash: measureLine.dash,
+			stroke: measureLine.stroke,
+			strokeWidth: measureLine.strokeWidth
+		});
+		const lineRight = new Konva.Line({
+			id: `lineRight-${props.id}`,
+			nodeId: props.id,
+			nodeType: WEAVE_MEASURE_NODE_TYPE,
+			points: [
+				pointRightText.x,
+				pointRightText.y,
+				toPerp.left.x,
+				toPerp.left.y
+			],
+			dash: measureLine.dash,
+			stroke: measureLine.stroke,
+			strokeWidth: measureLine.strokeWidth
+		});
+		measure.add(measureText);
+		measure.add(lineLeft);
+		measure.add(lineRight);
+		this.setupDefaultNodeAugmentation(measure);
+		measure.getTransformerProperties = function() {
+			return {
+				resizeEnabled: false,
+				rotateEnabled: false,
+				borderEnabled: false
+			};
+		};
+		this.instance.addEventListener("onZoomChange", () => {
+			const selectionPlugin = this.instance.getPlugin("nodesSelection");
+			if (selectionPlugin) {
+				const selectedNodes = selectionPlugin.getSelectedNodes();
+				if (selectedNodes.length === 1 && selectedNodes[0].getAttrs().id === measure.getAttrs().id) this.updateSelectionHandlers(measure);
+			}
+		});
+		this.instance.addEventListener("onNodesChange", () => {
+			let isSelected = false;
+			const selectionPlugin = this.instance.getPlugin("nodesSelection");
+			if (selectionPlugin) {
+				const selectedNodes = selectionPlugin.getSelectedNodes();
+				if (selectedNodes.length === 1 && selectedNodes[0].getAttrs().id === measure.getAttrs().id) {
+					isSelected = true;
+					this.createSelectionHandlers(measure);
+					this.updateSelectionHandlers(measure);
+				}
+			}
+			if (!isSelected) this.destroySelectionHandlers(measure);
+		});
+		this.instance.addEventListener("onMeasureReferenceChange", ({ unit: unit$1, unitPerPixel: unitPerPixel$1 }) => {
+			measure.setAttrs({
+				unit: unit$1,
+				unitPerPixel: unitPerPixel$1
+			});
+			this.instance.updateNode(this.serialize(measure));
+		});
+		measure.allowedAnchors = function() {
+			return [];
+		};
+		this.setupDefaultNodeEvents(measure);
+		return measure;
+	}
+	createSelectionHandlers(node) {
+		const props = node.getAttrs();
+		const fromPoint = props.fromPoint;
+		const toPoint = props.toPoint;
+		const separation = props.separation ?? 100;
+		const orientation = props.orientation ?? -1;
+		const angle = this.getAngle(fromPoint, toPoint);
+		const moveToCircleAct = node.findOne(`#moveToCircle-${node.getAttrs().id}`);
+		const crosshairFromAct = node.findOne(`#crosshairFrom-${node.getAttrs().id}`);
+		const moveFromCircleAct = node.findOne(`#moveFromCircle-${node.getAttrs().id}`);
+		const crosshairToAct = node.findOne(`#crosshairTo-${node.getAttrs().id}`);
+		const moveSeparationRectAct = node.findOne(`#moveSeparationRect-${node.getAttrs().id}`);
+		const measureText = node.findOne(`#measureText-${node.getAttrs().id}`);
+		if (moveToCircleAct && crosshairFromAct && moveFromCircleAct && crosshairToAct && moveSeparationRectAct) return;
+		const textSize = measureText?.measureSize(measureText.text());
+		const moveFromCircle = new Konva.Circle({
+			id: `moveFromCircle-${props.id}`,
+			edgeDistanceDisableOnDrag: true,
+			edgeSnappingDisableOnDrag: true,
+			x: fromPoint.x,
+			y: fromPoint.y,
+			radius: this.handlePointCircleRadius,
+			fill: "#FFFFFF",
+			stroke: "#000000",
+			strokeWidth: 1,
+			draggable: true
+		});
+		const crosshairFrom = this.buildCrosshair("crosshairFrom", node, fromPoint, angle);
+		const moveToCircle = new Konva.Circle({
+			id: `moveToCircle-${props.id}`,
+			edgeDistanceDisableOnDrag: true,
+			edgeSnappingDisableOnDrag: true,
+			x: toPoint.x,
+			y: toPoint.y,
+			radius: this.handlePointCircleRadius,
+			fill: "#FFFFFF",
+			stroke: "#000000",
+			strokeWidth: 1,
+			draggable: true
+		});
+		const crosshairTo = this.buildCrosshair("crosshairTo", node, toPoint, angle);
+		const fromPerp = this.perpendicularPoint(fromPoint, toPoint, fromPoint, separation * orientation);
+		const toPerp = this.perpendicularPoint(fromPoint, toPoint, toPoint, separation * orientation);
+		const pointMidMeasure = this.pointFromMid(fromPerp.left, toPerp.left, 0, false);
+		const isTextBiggerThanMeasureSpace = (textSize?.width ?? 0) > this.distanceBetweenPoints(fromPerp.left, toPerp.left);
+		const multiplier = isTextBiggerThanMeasureSpace ? this.config.style.handler.noSpaceSeparationMultiplier : this.config.style.handler.spaceSeparationMultiplier;
+		const separatorPoint = this.perpendicularPoint(fromPerp.left, toPerp.left, pointMidMeasure, multiplier * (textSize?.height ?? 0) * orientation);
+		const moveSeparationRect = new Konva.Rect({
+			id: `moveSeparationRect-${props.id}`,
+			edgeDistanceDisableOnDrag: true,
+			edgeSnappingDisableOnDrag: true,
+			x: separatorPoint.left.x,
+			y: separatorPoint.left.y,
+			width: this.handlePointCircleRadius * 2 * 3,
+			height: this.handlePointCircleRadius * 2,
+			offsetX: this.handlePointCircleRadius * 3,
+			offsetY: this.handlePointCircleRadius,
+			cornerRadius: this.handlePointCircleRadius,
+			rotation: angle,
+			fill: "#FFFFFF",
+			stroke: "#000000",
+			strokeWidth: 1,
+			draggable: true
+		});
+		node.add(moveFromCircle);
+		node.add(crosshairFrom);
+		node.add(moveToCircle);
+		node.add(crosshairTo);
+		node.add(moveSeparationRect);
+		moveFromCircle.moveToTop();
+		crosshairFrom.moveToBottom();
+		moveToCircle.moveToTop();
+		crosshairTo.moveToBottom();
+		moveSeparationRect.moveToTop();
+		moveFromCircle.on("dragstart", () => {
+			moveFromCircle.visible(false);
+			moveToCircle.visible(false);
+			moveSeparationRect.visible(false);
+			crosshairFrom.visible(true);
+		});
+		moveFromCircle.on("dragmove", (e) => {
+			const actCircle = e.target;
+			const realNode = e.target.getParent();
+			const newFromPoint = {
+				x: actCircle.x(),
+				y: actCircle.y()
+			};
+			realNode.setAttrs({ fromPoint: newFromPoint });
+			this.onUpdate(realNode, this.serialize(realNode).props);
+		});
+		moveFromCircle.on("dragend", (e) => {
+			const actCircle = e.target;
+			const realNode = e.target.getParent();
+			moveFromCircle.visible(true);
+			moveToCircle.visible(true);
+			moveSeparationRect.visible(true);
+			crosshairFrom.visible(false);
+			const newFromPoint = {
+				x: actCircle.x(),
+				y: actCircle.y()
+			};
+			realNode.setAttrs({ fromPoint: newFromPoint });
+			this.instance.updateNode(this.serialize(realNode));
+		});
+		moveToCircle.on("dragstart", () => {
+			moveFromCircle.visible(false);
+			moveToCircle.visible(false);
+			moveSeparationRect.visible(false);
+			crosshairTo.visible(true);
+		});
+		moveToCircle.on("dragmove", (e) => {
+			const actCircle = e.target;
+			const realNode = e.target.getParent();
+			const newToPoint = {
+				x: actCircle.x(),
+				y: actCircle.y()
+			};
+			realNode.setAttrs({ toPoint: newToPoint });
+			this.onUpdate(realNode, this.serialize(realNode).props);
+		});
+		moveToCircle.on("dragend", (e) => {
+			const actCircle = e.target;
+			const realNode = e.target.getParent();
+			moveFromCircle.visible(true);
+			moveToCircle.visible(true);
+			moveSeparationRect.visible(true);
+			crosshairTo.visible(false);
+			const newToPoint = {
+				x: actCircle.x(),
+				y: actCircle.y()
+			};
+			realNode.setAttrs({ toPoint: newToPoint });
+			this.instance.updateNode(this.serialize(realNode));
+		});
+		let originalSeparationHandlerPosition = {
+			x: 0,
+			y: 0
+		};
+		moveSeparationRect.on("dragstart", () => {
+			const pos = moveSeparationRect.position();
+			originalSeparationHandlerPosition = pos;
+		});
+		moveSeparationRect.on("dragmove", (e) => {
+			const pos = e.target.position();
+			const realNode = e.target.getParent();
+			const fromPoint$1 = node.getAttrs().fromPoint;
+			const toPoint$1 = node.getAttrs().toPoint;
+			const midPoint = this.midPoint(fromPoint$1, toPoint$1);
+			const isTextBiggerThanMeasureSpace$1 = (textSize?.width ?? 0) > this.distanceBetweenPoints(fromPerp.left, toPerp.left);
+			const multiplier$1 = isTextBiggerThanMeasureSpace$1 ? this.config.style.handler.noSpaceSeparationMultiplier : this.config.style.handler.spaceSeparationMultiplier;
+			const separatorPoint$1 = this.perpendicularPoint(fromPoint$1, toPoint$1, midPoint, multiplier$1 * (textSize?.height ?? 0) * orientation);
+			const pointInLine = this.projectPointToLine(separatorPoint$1.left, originalSeparationHandlerPosition, pos);
+			if (isNaN(pointInLine.t)) {
+				const point = this.movePointPerpendicularToLine(fromPoint$1, toPoint$1, separatorPoint$1.left, (multiplier$1 * (textSize?.height ?? 0) + 1) * orientation);
+				moveSeparationRect.position(point);
+				originalSeparationHandlerPosition = point;
+				realNode.setAttrs({ separation: (textSize?.height ?? 0) + 1 });
+			} else {
+				moveSeparationRect.position(pointInLine);
+				const dx = originalSeparationHandlerPosition.x - separatorPoint$1.left.x;
+				const dy = originalSeparationHandlerPosition.y - separatorPoint$1.left.y;
+				const len = Math.hypot(dx, dy);
+				let newLength = pointInLine.t * len;
+				if (newLength < 0) newLength = 0;
+				realNode.setAttrs({ separation: newLength });
+			}
+			this.onUpdate(realNode, this.serialize(realNode).props);
+		});
+		moveSeparationRect.on("dragend", (e) => {
+			const pos = e.target.position();
+			const realNode = e.target.getParent();
+			const fromPoint$1 = node.getAttrs().fromPoint;
+			const toPoint$1 = node.getAttrs().toPoint;
+			const midPoint = this.midPoint(fromPoint$1, toPoint$1);
+			const multiplier$1 = isTextBiggerThanMeasureSpace ? this.config.style.handler.noSpaceSeparationMultiplier : this.config.style.handler.spaceSeparationMultiplier;
+			const separatorPoint$1 = this.perpendicularPoint(fromPoint$1, toPoint$1, midPoint, multiplier$1 * (textSize?.height ?? 0) * orientation);
+			const pointInLine = this.projectPointToLine(separatorPoint$1.left, originalSeparationHandlerPosition, pos);
+			moveSeparationRect.position(pointInLine);
+			const dx = originalSeparationHandlerPosition.x - separatorPoint$1.left.x;
+			const dy = originalSeparationHandlerPosition.y - separatorPoint$1.left.y;
+			const len = Math.hypot(dx, dy);
+			let newLength = pointInLine.t * len;
+			if (newLength < 0) newLength = 0;
+			realNode.setAttrs({ separation: newLength });
+			this.instance.updateNode(this.serialize(realNode));
+		});
+	}
+	updateSelectionHandlers(node) {
+		const stage = this.instance.getStage();
+		const scale = stage.scaleX();
+		const fromPoint = node.getAttrs().fromPoint;
+		const toPoint = node.getAttrs().toPoint;
+		const moveToCircle = node.findOne(`#moveToCircle-${node.getAttrs().id}`);
+		const crosshairFrom = node.findOne(`#crosshairFrom-${node.getAttrs().id}`);
+		const moveFromCircle = node.findOne(`#moveFromCircle-${node.getAttrs().id}`);
+		const crosshairTo = node.findOne(`#crosshairTo-${node.getAttrs().id}`);
+		const moveSeparationRect = node.findOne(`#moveSeparationRect-${node.getAttrs().id}`);
+		if (moveToCircle) moveToCircle.scale({
+			x: 1 / scale,
+			y: 1 / scale
+		});
+		if (crosshairFrom) crosshairFrom.scale({
+			x: 1 / scale,
+			y: 1 / scale
+		});
+		if (moveFromCircle) moveFromCircle.scale({
+			x: 1 / scale,
+			y: 1 / scale
+		});
+		if (crosshairTo) crosshairTo.scale({
+			x: 1 / scale,
+			y: 1 / scale
+		});
+		if (moveSeparationRect) {
+			const measureText = node.findOne(`#measureText-${node.getAttrs().id}`);
+			const angle = this.getAngle(fromPoint, toPoint);
+			const textSize = measureText?.measureSize(measureText.text());
+			const separation = node.getAttrs().separation ?? 100;
+			const orientation = node.getAttrs().orientation ?? -1;
+			const fromPerp = this.perpendicularPoint(fromPoint, toPoint, fromPoint, separation * orientation);
+			const toPerp = this.perpendicularPoint(fromPoint, toPoint, toPoint, separation * orientation);
+			const pointMidMeasure = this.pointFromMid(fromPerp.left, toPerp.left, 0, false);
+			const isTextBiggerThanMeasureSpace = (textSize?.width ?? 0) > this.distanceBetweenPoints(fromPerp.left, toPerp.left);
+			const multiplier = isTextBiggerThanMeasureSpace ? this.config.style.handler.noSpaceSeparationMultiplier : this.config.style.handler.spaceSeparationMultiplier;
+			const separatorPoint = this.perpendicularPoint(fromPerp.left, toPerp.left, pointMidMeasure, multiplier * (textSize?.height ?? 0) * orientation);
+			moveSeparationRect.x(separatorPoint.left.x);
+			moveSeparationRect.y(separatorPoint.left.y);
+			moveSeparationRect.rotation(angle);
+			moveSeparationRect.scale({
+				x: 1 / scale,
+				y: 1 / scale
+			});
+		}
+	}
+	destroySelectionHandlers(node) {
+		const moveToCircle = node.findOne(`#moveToCircle-${node.getAttrs().id}`);
+		const crosshairFrom = node.findOne(`#crosshairFrom-${node.getAttrs().id}`);
+		const moveFromCircle = node.findOne(`#moveFromCircle-${node.getAttrs().id}`);
+		const crosshairTo = node.findOne(`#crosshairTo-${node.getAttrs().id}`);
+		const moveSeparationRect = node.findOne(`#moveSeparationRect-${node.getAttrs().id}`);
+		if (moveToCircle) moveToCircle.destroy();
+		if (crosshairFrom) crosshairFrom.destroy();
+		if (moveFromCircle) moveFromCircle.destroy();
+		if (crosshairTo) crosshairTo.destroy();
+		if (moveSeparationRect) moveSeparationRect.destroy();
+	}
+	pointFromMid(from, to, distance, towardsSecond = true) {
+		const mx = (from.x + to.x) / 2;
+		const my = (from.y + to.y) / 2;
+		const dx = to.x - from.x;
+		const dy = to.y - from.y;
+		const len = Math.hypot(dx, dy);
+		const ux = dx / len;
+		const uy = dy / len;
+		const sign = towardsSecond ? 1 : -1;
+		return {
+			x: mx + ux * distance * sign,
+			y: my + uy * distance * sign
+		};
+	}
+	angleBetweenPoints(from, to) {
+		return Math.atan2(to.y - from.y, to.x - from.x) * 180 / Math.PI;
+	}
+	midPoint(from, to) {
+		return {
+			x: (from.x + to.x) / 2,
+			y: (from.y + to.y) / 2
+		};
+	}
+	perpendicularPoint(from, to, point, distance) {
+		const dx = to.x - from.x;
+		const dy = to.y - from.y;
+		const perpX = -dy;
+		const perpY = dx;
+		const len = Math.hypot(perpX, perpY);
+		const ux = perpX / len;
+		const uy = perpY / len;
+		return {
+			left: {
+				x: point.x + ux * distance,
+				y: point.y + uy * distance
+			},
+			right: {
+				x: point.x - ux * distance,
+				y: point.y - uy * distance
+			}
+		};
+	}
+	distanceBetweenPoints(from, to) {
+		return Math.hypot(to.x - from.x, to.y - from.y);
+	}
+	onUpdate(nodeInstance, nextProps) {
+		nodeInstance.setAttrs({ ...nextProps });
+		const measure = nodeInstance;
+		const fromPoint = nextProps.fromPoint;
+		const toPoint = nextProps.toPoint;
+		const separation = nextProps.separation ?? 100;
+		const orientation = nextProps.orientation ?? -1;
+		const unit = nextProps.unit ?? "cms";
+		const unitPerPixel = nextProps.unitPerPixel ?? 100;
+		const separationLine = this.config.style.separationLine;
+		const textConfig = this.config.style.text;
+		const fromFinalPerp = this.perpendicularPoint(fromPoint, toPoint, fromPoint, (separation + separationLine.padding) * orientation);
+		const linePerpFrom = measure.findOne(`#linePerpFrom-${nextProps.id}`);
+		linePerpFrom?.points([
+			fromPoint.x,
+			fromPoint.y,
+			fromFinalPerp.left.x,
+			fromFinalPerp.left.y
+		]);
+		const toFinalPerp = this.perpendicularPoint(fromPoint, toPoint, toPoint, (separation + separationLine.padding) * orientation);
+		const linePerpTo = measure.findOne(`#linePerpTo-${nextProps.id}`);
+		linePerpTo?.points([
+			toPoint.x,
+			toPoint.y,
+			toFinalPerp.left.x,
+			toFinalPerp.left.y
+		]);
+		const fromPerp = this.perpendicularPoint(fromPoint, toPoint, fromPoint, separation * orientation);
+		const fromCircle = measure.findOne(`#fromCircle-${nextProps.id}`);
+		fromCircle?.position({
+			x: fromPerp.left.x,
+			y: fromPerp.left.y
+		});
+		const toPerp = this.perpendicularPoint(fromPoint, toPoint, toPoint, separation * orientation);
+		const toCircle = measure.findOne(`#toCircle-${nextProps.id}`);
+		toCircle?.position({
+			x: toPerp.left.x,
+			y: toPerp.left.y
+		});
+		const midPoint = this.midPoint(fromPerp.left, toPerp.left);
+		const distance = this.distanceBetweenPoints(fromPoint, toPoint);
+		const units = distance / unitPerPixel;
+		const text = `${units.toFixed(2)} ${unit}`;
+		const measureText = measure.findOne(`#measureText-${nextProps.id}`);
+		const angle = this.getAngle(fromPoint, toPoint);
+		const textSize = measureText.measureSize(text);
+		const textOffsetX = textSize.width / 2;
+		measureText?.text(text);
+		measureText?.rotation(angle);
+		measureText?.x(midPoint.x);
+		measureText?.y(midPoint.y);
+		measureText?.offsetX(textSize.width / 2);
+		measureText?.offsetY(textSize.height / 2);
+		if (textSize.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left)) {
+			const perpPointTextMid = this.perpendicularPoint(fromPerp.left, toPerp.left, midPoint, (textSize.height + separationLine.padding) * orientation);
+			measureText.x(perpPointTextMid.left.x);
+			measureText.y(perpPointTextMid.left.y);
+		}
+		const pointLeftText = this.pointFromMid(fromPerp.left, toPerp.left, textSize.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left) ? 0 : textOffsetX + textConfig.padding, false);
+		const pointRightText = this.pointFromMid(fromPerp.left, toPerp.left, textSize.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left) ? 0 : textOffsetX + textConfig.padding, true);
+		const lineLeft = measure.findOne(`#lineLeft-${nextProps.id}`);
+		lineLeft?.points([
+			fromPerp.left.x,
+			fromPerp.left.y,
+			pointLeftText.x,
+			pointLeftText.y
+		]);
+		const lineRight = measure.findOne(`#lineRight-${nextProps.id}`);
+		lineRight?.points([
+			pointRightText.x,
+			pointRightText.y,
+			toPerp.left.x,
+			toPerp.left.y
+		]);
+		const pointMidMeasure = this.pointFromMid(fromPerp.left, toPerp.left, 0, false);
+		const crosshairFrom = measure.findOne(`#crosshairFrom-${measure.getAttrs().id}`);
+		if (crosshairFrom) {
+			crosshairFrom.x(fromPoint.x);
+			crosshairFrom.y(fromPoint.y);
+			crosshairFrom.rotation(angle);
+		}
+		const crosshairTo = measure.findOne(`#crosshairTo-${measure.getAttrs().id}`);
+		if (crosshairTo) {
+			crosshairTo.x(toPoint.x);
+			crosshairTo.y(toPoint.y);
+			crosshairTo.rotation(angle);
+		}
+		const moveSeparationRect = measure.findOne(`#moveSeparationRect-${measure.getAttrs().id}`);
+		if (moveSeparationRect) {
+			const textSize$1 = measureText.measureSize(measureText.text());
+			const isTextBiggerThanMeasureSpace = textSize$1.width > this.distanceBetweenPoints(fromPerp.left, toPerp.left);
+			const multiplier = isTextBiggerThanMeasureSpace ? this.config.style.handler.noSpaceSeparationMultiplier : this.config.style.handler.spaceSeparationMultiplier;
+			const separatorPoint = this.perpendicularPoint(fromPerp.left, toPerp.left, pointMidMeasure, multiplier * textSize$1.height * orientation);
+			moveSeparationRect.x(separatorPoint.left.x);
+			moveSeparationRect.y(separatorPoint.left.y);
+			moveSeparationRect.rotation(angle);
+		}
+	}
+	projectPointToLine(fromPoint, toPoint, pointToProject) {
+		const dx = toPoint.x - fromPoint.x;
+		const dy = toPoint.y - fromPoint.y;
+		const lenSq = dx * dx + dy * dy;
+		const t = ((pointToProject.x - fromPoint.x) * dx + (pointToProject.y - fromPoint.y) * dy) / lenSq;
+		return {
+			x: fromPoint.x + t * dx,
+			y: fromPoint.y + t * dy,
+			t,
+			flipped: t < 0
+		};
+	}
+	buildCrosshair(name, node, point, angle) {
+		const props = node.getAttrs();
+		const crosshairSize = 60;
+		const crosshair = new Konva.Group({
+			id: `${name}-${props.id}`,
+			x: point.x,
+			y: point.y,
+			rotation: angle,
+			visible: false,
+			listening: false,
+			draggable: false
+		});
+		const horizontalLineFrom = new Konva.Line({
+			points: [
+				0,
+				0,
+				crosshairSize,
+				0
+			],
+			x: -1 * (crosshairSize / 2),
+			y: 0,
+			stroke: "#CC0000",
+			strokeWidth: 1
+		});
+		const verticalLineFrom = new Konva.Line({
+			points: [
+				0,
+				0,
+				0,
+				crosshairSize
+			],
+			x: 0,
+			y: -1 * crosshairSize / 2,
+			stroke: "#CC0000",
+			strokeWidth: 1
+		});
+		crosshair.add(horizontalLineFrom);
+		crosshair.add(verticalLineFrom);
+		return crosshair;
+	}
+	movePointPerpendicularToLine(fromPoint, toPoint, point, distance) {
+		const dx = toPoint.x - fromPoint.x;
+		const dy = toPoint.y - fromPoint.y;
+		const len = Math.hypot(dx, dy);
+		const ux = -dy / len;
+		const uy = dx / len;
+		return {
+			x: point.x + ux * distance,
+			y: point.y + uy * distance
+		};
+	}
+	getAngle(fromPoint, toPoint) {
+		let angle = this.angleBetweenPoints(fromPoint, toPoint);
+		if (fromPoint.x > toPoint.x) angle = angle + 180;
+		return angle;
+	}
+	flipOrientation(node) {
+		this.destroySelectionHandlers(node);
+		const currentOrientation = node.getAttrs().orientation ?? -1;
+		node.setAttrs({ orientation: currentOrientation * -1 });
+		this.instance.updateNode(this.serialize(node));
+		this.createSelectionHandlers(node);
+		this.updateSelectionHandlers(node);
+	}
+	getNormalizedDistance(node) {
+		const stage = this.instance.getStage();
+		const scale = stage.scaleX();
+		const fromCircle = node.findOne(`#fromCircle-${node.getAttrs().id}`);
+		const toCircle = node.findOne(`#toCircle-${node.getAttrs().id}`);
+		if (fromCircle && toCircle) {
+			const fromPoint = fromCircle.getAbsolutePosition();
+			const toPoint = toCircle.getAbsolutePosition();
+			return Math.hypot(toPoint.x - fromPoint.x, toPoint.y - fromPoint.y) / scale;
+		}
+		return 0;
+	}
+};
+
 //#endregion
 //#region src/plugins/stage-zoom/constants.ts
 const WEAVE_STAGE_ZOOM_TYPE = {
@@ -30759,6 +31457,17 @@ var WeaveVideoToolAction = class extends WeaveAction {
 	}
 };
 
+//#endregion
+//#region src/actions/measure-tool/constants.ts
+const MEASURE_TOOL_ACTION_NAME = "measureTool";
+const MEASURE_TOOL_STATE = {
+	["IDLE"]: "idle",
+	["SET_FROM"]: "set_from",
+	["SET_TO"]: "set_to",
+	["FINISHED"]: "finished"
+};
+const WEAVE_MEASURE_TOOL_DEFAULT_CONFIG = { style: { stroke: "#FF3366" } };
+
 //#endregion
 //#region src/plugins/stage-grid/stage-grid.ts
 var WeaveStageGridPlugin = class extends WeavePlugin {
@@ -31474,6 +32183,11 @@ var WeaveStageResizePlugin = class extends WeavePlugin {
 		const containerParent = stage.container().parentNode;
 		if (!this.enabled) return;
 		if (containerParent) {
+			const upscaleScale = stage.getAttr("upscaleScale");
+			if (upscaleScale === 1) {
+				stage.width(containerParent.clientWidth);
+				stage.height(containerParent.clientHeight);
+			}
 			setupUpscaleStage(this.instance, stage);
 			const plugins = this.instance.getPlugins();
 			for (const pluginId of Object.keys(plugins)) {
@@ -31483,11 +32197,14 @@ var WeaveStageResizePlugin = class extends WeavePlugin {
 		}
 	}
 	onInit() {
-		window.addEventListener("resize", () => {
+		const throttledResize = (0, import_lodash.throttle)(() => {
 			this.resizeStage();
+		}, 100);
+		window.addEventListener("resize", () => {
+			throttledResize();
 		});
 		const resizeObserver = new ResizeObserver(() => {
-			this.resizeStage();
+			throttledResize();
 		});
 		const stage = this.instance.getStage();
 		resizeObserver.observe(stage.container());
@@ -32139,7 +32856,9 @@ var WeaveNodesEdgeSnappingPlugin = class extends WeavePlugin {
 		const utilityLayer = this.instance.getUtilityLayer();
 		if (!this.enabled) return;
 		if (!utilityLayer) return;
+		if (e.target.getAttr("edgeSnappingDisableOnDrag")) return;
 		const { targetNode: node, skipNodes } = getTargetAndSkipNodes(this.instance, e);
+		if (node?.getAttr("edgeSnappingDisable")) return;
 		if (typeof node === "undefined") return;
 		const nodeParent = this.getSelectionParentNode(node);
 		if (nodeParent === null) return;
@@ -33204,5 +33923,276 @@ var WeaveStageKeyboardMovePlugin = class extends WeavePlugin {
 };
 
 //#endregion
-export { ALIGN_NODES_ALIGN_TO, ALIGN_NODES_TOOL_ACTION_NAME, ALIGN_NODES_TOOL_STATE, ARROW_TOOL_ACTION_NAME, ARROW_TOOL_STATE, BRUSH_TOOL_ACTION_NAME, BRUSH_TOOL_DEFAULT_CONFIG, BRUSH_TOOL_STATE, COPY_PASTE_NODES_PLUGIN_STATE, ELLIPSE_TOOL_ACTION_NAME, ELLIPSE_TOOL_STATE, ERASER_TOOL_ACTION_NAME, ERASER_TOOL_STATE, FRAME_TOOL_ACTION_NAME, FRAME_TOOL_STATE, GUIDE_DISTANCE_LINE_DEFAULT_CONFIG, GUIDE_ENTER_SNAPPING_TOLERANCE, GUIDE_EXIT_SNAPPING_TOLERANCE, GUIDE_HORIZONTAL_LINE_NAME, GUIDE_LINE_DEFAULT_CONFIG, GUIDE_LINE_DRAG_SNAPPING_THRESHOLD, GUIDE_LINE_NAME, GUIDE_LINE_TRANSFORM_SNAPPING_THRESHOLD, GUIDE_ORIENTATION, GUIDE_VERTICAL_LINE_NAME, IMAGE_TOOL_ACTION_NAME, IMAGE_TOOL_STATE, MOVE_TOOL_ACTION_NAME, MOVE_TOOL_STATE, NODE_SNAP, NODE_SNAP_HORIZONTAL, NODE_SNAP_VERTICAL, PEN_TOOL_ACTION_NAME, PEN_TOOL_STATE, RECTANGLE_TOOL_ACTION_NAME, RECTANGLE_TOOL_STATE, REGULAR_POLYGON_TOOL_ACTION_NAME, REGULAR_POLYGON_TOOL_STATE, SELECTION_TOOL_ACTION_NAME, SELECTION_TOOL_STATE, STAGE_MINIMAP_DEFAULT_CONFIG, STAR_TOOL_ACTION_NAME, STAR_TOOL_STATE, TEXT_LAYOUT, TEXT_TOOL_ACTION_NAME, TEXT_TOOL_STATE, VIDEO_TOOL_ACTION_NAME, VIDEO_TOOL_STATE, WEAVE_ARROW_NODE_TYPE, WEAVE_COMMENTS_RENDERER_KEY, WEAVE_COMMENTS_TOOL_LAYER_ID, WEAVE_COMMENT_CREATE_ACTION, WEAVE_COMMENT_NODE_ACTION, WEAVE_COMMENT_NODE_DEFAULTS, WEAVE_COMMENT_NODE_TYPE, WEAVE_COMMENT_STATUS, WEAVE_COMMENT_TOOL_ACTION_NAME, WEAVE_COMMENT_TOOL_DEFAULT_CONFIG, WEAVE_COMMENT_TOOL_STATE, WEAVE_COMMENT_VIEW_ACTION, WEAVE_COPY_PASTE_CONFIG_DEFAULT, WEAVE_COPY_PASTE_NODES_KEY, WEAVE_COPY_PASTE_PASTE_CATCHER_ID, WEAVE_COPY_PASTE_PASTE_MODES, WEAVE_DEFAULT_USER_INFO_FUNCTION, WEAVE_ELLIPSE_NODE_TYPE, WEAVE_FRAME_DEFAULT_BACKGROUND_COLOR, WEAVE_FRAME_NODE_DEFAULT_CONFIG, WEAVE_FRAME_NODE_DEFAULT_PROPS, WEAVE_FRAME_NODE_TYPE, WEAVE_GRID_DEFAULT_COLOR, WEAVE_GRID_DEFAULT_DOT_MAX_DOTS_PER_AXIS, WEAVE_GRID_DEFAULT_MAJOR_DOT_RATIO, WEAVE_GRID_DEFAULT_MAJOR_EVERY, WEAVE_GRID_DEFAULT_MAJOR_LINE_RATIO, WEAVE_GRID_DEFAULT_ORIGIN_COLOR, WEAVE_GRID_DEFAULT_RADIUS, WEAVE_GRID_DEFAULT_SIZE, WEAVE_GRID_DEFAULT_STROKE, WEAVE_GRID_DEFAULT_TYPE, WEAVE_GRID_LAYER_ID, WEAVE_GRID_TYPES, WEAVE_GROUP_NODE_TYPE, WEAVE_IMAGE_CROP_END_TYPE, WEAVE_IMAGE_DEFAULT_CONFIG, WEAVE_IMAGE_NODE_TYPE, WEAVE_LAYER_NODE_TYPE, WEAVE_LINE_NODE_DEFAULT_CONFIG, WEAVE_LINE_NODE_TYPE, WEAVE_NODES_DISTANCE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_EDGE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_DEFAULT_CONFIG, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_LAYER_ID, WEAVE_NODES_SELECTION_DEFAULT_CONFIG, WEAVE_NODES_SELECTION_KEY, WEAVE_NODES_SELECTION_LAYER_ID, WEAVE_RECTANGLE_NODE_TYPE, WEAVE_REGULAR_POLYGON_NODE_TYPE, WEAVE_STAGE_DEFAULT_MODE, WEAVE_STAGE_GRID_PLUGIN_KEY, WEAVE_STAGE_KEYBOARD_MOVE_DEFAULT_CONFIG, WEAVE_STAGE_KEYBOARD_MOVE_KEY, WEAVE_STAGE_MINIMAP_KEY, WEAVE_STAGE_NODE_TYPE, WEAVE_STAGE_PANNING_DEFAULT_CONFIG, WEAVE_STAGE_PANNING_KEY, WEAVE_STAR_NODE_TYPE, WEAVE_STROKE_NODE_DEFAULT_CONFIG, WEAVE_STROKE_NODE_TYPE, WEAVE_TEXT_NODE_TYPE, WEAVE_USERS_POINTERS_CONFIG_DEFAULT_PROPS, WEAVE_USERS_POINTERS_KEY, WEAVE_USERS_SELECTION_KEY, WEAVE_USER_POINTER_KEY, WEAVE_USER_SELECTION_KEY, WEAVE_VIDEO_DEFAULT_CONFIG, WEAVE_VIDEO_NODE_TYPE, Weave, WeaveAction, WeaveAlignNodesToolAction, WeaveArrowNode, WeaveArrowToolAction, WeaveBrushToolAction, WeaveCommentNode, WeaveCommentToolAction, WeaveCommentsRendererPlugin, WeaveConnectedUsersPlugin, WeaveContextMenuPlugin, WeaveCopyPasteNodesPlugin, WeaveEllipseNode, WeaveEllipseToolAction, WeaveEraserToolAction, WeaveExportNodesToolAction, WeaveExportStageToolAction, WeaveFitToScreenToolAction, WeaveFitToSelectionToolAction, WeaveFrameNode, WeaveFrameToolAction, WeaveGroupNode, WeaveImageNode, WeaveImageToolAction, WeaveLayerNode, WeaveLineNode, WeaveMoveToolAction, WeaveNode, WeaveNodesDistanceSnappingPlugin, WeaveNodesEdgeSnappingPlugin, WeaveNodesMultiSelectionFeedbackPlugin, WeaveNodesSelectionPlugin, WeavePenToolAction, WeavePlugin, WeaveRectangleNode, WeaveRectangleToolAction, WeaveRegularPolygonNode, WeaveRegularPolygonToolAction, WeaveSelectionToolAction, WeaveStageDropAreaPlugin, WeaveStageGridPlugin, WeaveStageKeyboardMovePlugin, WeaveStageMinimapPlugin, WeaveStageNode, WeaveStagePanningPlugin, WeaveStageResizePlugin, WeaveStageZoomPlugin, WeaveStarNode, WeaveStarToolAction, WeaveStore, WeaveStrokeNode, WeaveTextNode, WeaveTextToolAction, WeaveUsersPointersPlugin, WeaveUsersSelectionPlugin, WeaveVideoNode, WeaveVideoToolAction, WeaveZoomInToolAction, WeaveZoomOutToolAction, canComposite, clearContainerTargets, containerOverCursor, containsNodeDeep, defaultInitialState, getBoundingBox, getExportBoundingBox, getPositionRelativeToContainerOnPosition, getSelectedNodesMetadata, getStageClickPoint, getTargetAndSkipNodes, getTargetedNode, getTopmostShadowHost, getVisibleNodes, getVisibleNodesInViewport, hasFrames, hasImages, intersectArrays, isIOS, isInShadowDOM, isNodeInSelection, isServer, memoize, mergeExceptArrays, moveNodeToContainer, resetScale, setupCanvasBackend, setupSkiaBackend };
+//#region src/actions/measure-tool/measure-tool.ts
+var WeaveMeasureToolAction = class extends WeaveAction {
+	initialized = false;
+	initialCursor = null;
+	onPropsChange = void 0;
+	onInit = void 0;
+	constructor(params) {
+		super();
+		this.config = mergeExceptArrays(WEAVE_MEASURE_TOOL_DEFAULT_CONFIG, params?.config ?? {});
+		this.initialized = false;
+		this.state = MEASURE_TOOL_STATE.IDLE;
+		this.measureId = null;
+		this.container = void 0;
+		this.clickPoint = null;
+		this.crosshairCursor = null;
+		this.firstPoint = null;
+		this.measureLine = null;
+		this.measureContainer = void 0;
+		this.props = this.initProps();
+	}
+	getName() {
+		return MEASURE_TOOL_ACTION_NAME;
+	}
+	initProps() {
+		return {
+			orientation: -1,
+			separation: 0,
+			unit: "cm",
+			unitPerPixel: 10
+		};
+	}
+	setupEvents() {
+		const stage = this.instance.getStage();
+		window.addEventListener("keydown", (e) => {
+			if (e.code === "Escape" && this.instance.getActiveAction() === MEASURE_TOOL_ACTION_NAME) this.cancelAction();
+		});
+		stage.on("pointermove", () => {
+			if (this.state === MEASURE_TOOL_STATE.IDLE) return;
+			if (this.state === MEASURE_TOOL_STATE.SET_TO) {
+				const finalPoint = this.defineFinalPoint();
+				if (this.measureLine && this.firstPoint) this.measureLine.points([
+					0,
+					0,
+					finalPoint.x,
+					finalPoint.y
+				]);
+			}
+			this.setCursor();
+		});
+		stage.on("pointerclick", () => {
+			if (this.state === MEASURE_TOOL_STATE.IDLE) return;
+			if (this.state === MEASURE_TOOL_STATE.SET_FROM) {
+				this.handleSetFrom();
+				return;
+			}
+			if (this.state === MEASURE_TOOL_STATE.SET_TO) this.handleSetTo();
+		});
+		this.initialized = true;
+	}
+	setState(state) {
+		this.state = state;
+	}
+	addMeasure() {
+		const selectionPlugin = this.instance.getPlugin("nodesSelection");
+		if (selectionPlugin) {
+			const tr = selectionPlugin.getTransformer();
+			tr.hide();
+		}
+		this.instance.addEventListener("onZoomChange", () => {
+			if (this.crosshairCursor) {
+				const stage = this.instance.getStage();
+				this.crosshairCursor.scale({
+					x: 1 / stage.scaleX(),
+					y: 1 / stage.scaleY()
+				});
+			}
+		});
+		this.buildCrosshairCursor();
+		this.setCursor();
+		this.setFocusStage();
+		this.clickPoint = null;
+		this.setState(MEASURE_TOOL_STATE.SET_FROM);
+	}
+	buildCrosshairCursor() {
+		const stage = this.instance.getStage();
+		const { mousePoint } = this.instance.getMousePointer();
+		this.crosshairCursor = new Konva.Group({
+			x: mousePoint?.x,
+			y: mousePoint?.y,
+			scale: {
+				x: 1 / stage.scaleX(),
+				y: 1 / stage.scaleY()
+			},
+			listening: false,
+			draggable: false
+		});
+		const crosshairSize = 60;
+		const lineH = new Konva.Line({
+			points: [
+				0,
+				0,
+				crosshairSize,
+				0
+			],
+			x: -1 * (crosshairSize / 2),
+			y: 0,
+			stroke: this.config.style.stroke,
+			strokeWidth: 1
+		});
+		const lineV = new Konva.Line({
+			points: [
+				0,
+				0,
+				0,
+				crosshairSize
+			],
+			x: 0,
+			y: -1 * crosshairSize / 2,
+			stroke: this.config.style.stroke,
+			strokeWidth: 1
+		});
+		this.crosshairCursor.add(lineH);
+		this.crosshairCursor.add(lineV);
+		this.instance.getStage().on("pointermove.measureTool", () => {
+			const pos = this.instance.getStage().getRelativePointerPosition();
+			if (this.crosshairCursor && pos) {
+				this.crosshairCursor.position(pos);
+				this.crosshairCursor.moveToTop();
+			}
+		});
+		this.instance.getUtilityLayer()?.add(this.crosshairCursor);
+	}
+	handleSetFrom() {
+		const stage = this.instance.getStage();
+		const realMousePoint = stage.getRelativePointerPosition();
+		const { container, measureContainer } = this.instance.getMousePointer();
+		this.clickPoint = realMousePoint;
+		this.container = container;
+		this.measureContainer = measureContainer;
+		this.firstPoint = new Konva.Circle({
+			x: this.clickPoint?.x ?? 0,
+			y: this.clickPoint?.y ?? 0,
+			radius: 6,
+			fill: "#FFFFFF",
+			stroke: "#000000",
+			scale: {
+				x: 1 / stage.scaleX(),
+				y: 1 / stage.scaleY()
+			},
+			strokeWidth: 1,
+			listening: false,
+			draggable: false
+		});
+		this.measureLine = new Konva.Line({
+			x: this.clickPoint?.x,
+			y: this.clickPoint?.y,
+			points: [0, 0],
+			scale: {
+				x: 1 / stage.scaleX(),
+				y: 1 / stage.scaleY()
+			},
+			stroke: this.config.style.stroke,
+			dashed: [4, 4],
+			strokeWidth: 1,
+			listening: false,
+			draggable: false
+		});
+		this.instance.getUtilityLayer()?.add(this.firstPoint);
+		this.instance.getUtilityLayer()?.add(this.measureLine);
+		this.firstPoint.moveToTop();
+		this.measureLine.moveToBottom();
+		this.setState(MEASURE_TOOL_STATE.SET_TO);
+	}
+	handleSetTo() {
+		const stage = this.instance.getStage();
+		const realMousePoint = stage.getRelativePointerPosition();
+		const { container } = this.instance.getMousePointer();
+		this.clickPoint = realMousePoint;
+		this.container = container;
+		const nodeHandler = this.instance.getNodeHandler("measure");
+		if (nodeHandler && this.firstPoint) {
+			this.measureId = v4_default();
+			const node = nodeHandler.create(this.measureId, {
+				...this.props,
+				id: this.measureId,
+				x: 0,
+				y: 0,
+				fromPoint: {
+					x: this.firstPoint.x(),
+					y: this.firstPoint.y()
+				},
+				toPoint: {
+					x: this.clickPoint?.x ?? 0,
+					y: this.clickPoint?.y ?? 0
+				},
+				draggable: true
+			});
+			this.instance.addOnceEventListener("onNodeRenderedAdded", (child) => {
+				if (child.getAttrs().id === this.measureId) {
+					if (typeof this.measureContainer !== "undefined" && this.measureContainer?.id() !== "mainLayer") {
+						const nodeInstance = this.instance.getMainLayer()?.findOne(`#${this.measureId}`);
+						const stage$1 = this.instance.getStage();
+						let realContainer = this.measureContainer;
+						if (realContainer?.getAttrs().nodeId !== void 0) realContainer = stage$1.findOne(`#${realContainer?.getAttrs().nodeId}`);
+						if (nodeInstance) moveNodeToContainer(this.instance, nodeInstance, realContainer);
+					}
+					this.cancelAction();
+				}
+			});
+			this.instance.addNode(node, "mainLayer");
+			this.setState(MEASURE_TOOL_STATE.FINISHED);
+		}
+	}
+	trigger(cancelAction) {
+		if (!this.instance) throw new Error("Instance not defined");
+		if (!this.initialized) this.setupEvents();
+		this.cancelAction = cancelAction;
+		const selectionPlugin = this.instance.getPlugin("nodesSelection");
+		if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
+		this.props = this.initProps();
+		this.addMeasure();
+	}
+	cleanup() {
+		const stage = this.instance.getStage();
+		stage.container().style.cursor = "default";
+		this.instance.getStage().off("pointermove.measureTool");
+		const selectionPlugin = this.instance.getPlugin("nodesSelection");
+		if (selectionPlugin) {
+			const node = stage.findOne(`#${this.measureId}`);
+			if (node) selectionPlugin.setSelectedNodes([node]);
+			this.instance.triggerAction(SELECTION_TOOL_ACTION_NAME);
+		}
+		if (this.crosshairCursor) this.crosshairCursor.destroy();
+		if (this.firstPoint) this.firstPoint.destroy();
+		if (this.measureLine) this.measureLine.destroy();
+		this.initialCursor = null;
+		this.measureId = null;
+		this.container = void 0;
+		this.clickPoint = null;
+		this.firstPoint = null;
+		this.measureLine = null;
+		this.setState(MEASURE_TOOL_STATE.IDLE);
+	}
+	setCursor() {
+		const stage = this.instance.getStage();
+		stage.container().style.cursor = "none";
+	}
+	setFocusStage() {
+		const stage = this.instance.getStage();
+		stage.container().tabIndex = 1;
+		stage.container().blur();
+		stage.container().focus();
+	}
+	defineFinalPoint() {
+		if (!this.measureLine || !this.measureContainer) return {
+			x: 0,
+			y: 0
+		};
+		const stage = this.instance.getStage();
+		const realMousePoint = this.instance.getStage().getRelativePointerPosition();
+		const pos = {
+			x: 0,
+			y: 0
+		};
+		pos.x = ((realMousePoint?.x ?? 0) - this.measureLine.x()) * stage.scaleX();
+		pos.y = ((realMousePoint?.y ?? 0) - this.measureLine.y()) * stage.scaleY();
+		return pos;
+	}
+};
+
+//#endregion
+export { ALIGN_NODES_ALIGN_TO, ALIGN_NODES_TOOL_ACTION_NAME, ALIGN_NODES_TOOL_STATE, ARROW_TOOL_ACTION_NAME, ARROW_TOOL_STATE, BRUSH_TOOL_ACTION_NAME, BRUSH_TOOL_DEFAULT_CONFIG, BRUSH_TOOL_STATE, COPY_PASTE_NODES_PLUGIN_STATE, ELLIPSE_TOOL_ACTION_NAME, ELLIPSE_TOOL_STATE, ERASER_TOOL_ACTION_NAME, ERASER_TOOL_STATE, FRAME_TOOL_ACTION_NAME, FRAME_TOOL_STATE, GUIDE_DISTANCE_LINE_DEFAULT_CONFIG, GUIDE_ENTER_SNAPPING_TOLERANCE, GUIDE_EXIT_SNAPPING_TOLERANCE, GUIDE_HORIZONTAL_LINE_NAME, GUIDE_LINE_DEFAULT_CONFIG, GUIDE_LINE_DRAG_SNAPPING_THRESHOLD, GUIDE_LINE_NAME, GUIDE_LINE_TRANSFORM_SNAPPING_THRESHOLD, GUIDE_ORIENTATION, GUIDE_VERTICAL_LINE_NAME, IMAGE_TOOL_ACTION_NAME, IMAGE_TOOL_STATE, MEASURE_TOOL_ACTION_NAME, MEASURE_TOOL_STATE, MOVE_TOOL_ACTION_NAME, MOVE_TOOL_STATE, NODE_SNAP, NODE_SNAP_HORIZONTAL, NODE_SNAP_VERTICAL, PEN_TOOL_ACTION_NAME, PEN_TOOL_STATE, RECTANGLE_TOOL_ACTION_NAME, RECTANGLE_TOOL_STATE, REGULAR_POLYGON_TOOL_ACTION_NAME, REGULAR_POLYGON_TOOL_STATE, SELECTION_TOOL_ACTION_NAME, SELECTION_TOOL_STATE, STAGE_MINIMAP_DEFAULT_CONFIG, STAR_TOOL_ACTION_NAME, STAR_TOOL_STATE, TEXT_LAYOUT, TEXT_TOOL_ACTION_NAME, TEXT_TOOL_STATE, VIDEO_TOOL_ACTION_NAME, VIDEO_TOOL_STATE, WEAVE_ARROW_NODE_TYPE, WEAVE_COMMENTS_RENDERER_KEY, WEAVE_COMMENTS_TOOL_LAYER_ID, WEAVE_COMMENT_CREATE_ACTION, WEAVE_COMMENT_NODE_ACTION, WEAVE_COMMENT_NODE_DEFAULTS, WEAVE_COMMENT_NODE_TYPE, WEAVE_COMMENT_STATUS, WEAVE_COMMENT_TOOL_ACTION_NAME, WEAVE_COMMENT_TOOL_DEFAULT_CONFIG, WEAVE_COMMENT_TOOL_STATE, WEAVE_COMMENT_VIEW_ACTION, WEAVE_COPY_PASTE_CONFIG_DEFAULT, WEAVE_COPY_PASTE_NODES_KEY, WEAVE_COPY_PASTE_PASTE_CATCHER_ID, WEAVE_COPY_PASTE_PASTE_MODES, WEAVE_DEFAULT_USER_INFO_FUNCTION, WEAVE_ELLIPSE_NODE_TYPE, WEAVE_FRAME_DEFAULT_BACKGROUND_COLOR, WEAVE_FRAME_NODE_DEFAULT_CONFIG, WEAVE_FRAME_NODE_DEFAULT_PROPS, WEAVE_FRAME_NODE_TYPE, WEAVE_GRID_DEFAULT_COLOR, WEAVE_GRID_DEFAULT_DOT_MAX_DOTS_PER_AXIS, WEAVE_GRID_DEFAULT_MAJOR_DOT_RATIO, WEAVE_GRID_DEFAULT_MAJOR_EVERY, WEAVE_GRID_DEFAULT_MAJOR_LINE_RATIO, WEAVE_GRID_DEFAULT_ORIGIN_COLOR, WEAVE_GRID_DEFAULT_RADIUS, WEAVE_GRID_DEFAULT_SIZE, WEAVE_GRID_DEFAULT_STROKE, WEAVE_GRID_DEFAULT_TYPE, WEAVE_GRID_LAYER_ID, WEAVE_GRID_TYPES, WEAVE_GROUP_NODE_TYPE, WEAVE_IMAGE_CROP_END_TYPE, WEAVE_IMAGE_DEFAULT_CONFIG, WEAVE_IMAGE_NODE_TYPE, WEAVE_LAYER_NODE_TYPE, WEAVE_LINE_NODE_DEFAULT_CONFIG, WEAVE_LINE_NODE_TYPE, WEAVE_MEASURE_NODE_DEFAULT_CONFIG, WEAVE_MEASURE_NODE_TYPE, WEAVE_MEASURE_TOOL_DEFAULT_CONFIG, WEAVE_NODES_DISTANCE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_EDGE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_DEFAULT_CONFIG, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_LAYER_ID, WEAVE_NODES_SELECTION_DEFAULT_CONFIG, WEAVE_NODES_SELECTION_KEY, WEAVE_NODES_SELECTION_LAYER_ID, WEAVE_RECTANGLE_NODE_TYPE, WEAVE_REGULAR_POLYGON_NODE_TYPE, WEAVE_STAGE_DEFAULT_MODE, WEAVE_STAGE_GRID_PLUGIN_KEY, WEAVE_STAGE_KEYBOARD_MOVE_DEFAULT_CONFIG, WEAVE_STAGE_KEYBOARD_MOVE_KEY, WEAVE_STAGE_MINIMAP_KEY, WEAVE_STAGE_NODE_TYPE, WEAVE_STAGE_PANNING_DEFAULT_CONFIG, WEAVE_STAGE_PANNING_KEY, WEAVE_STAR_NODE_TYPE, WEAVE_STROKE_NODE_DEFAULT_CONFIG, WEAVE_STROKE_NODE_TYPE, WEAVE_TEXT_NODE_TYPE, WEAVE_USERS_POINTERS_CONFIG_DEFAULT_PROPS, WEAVE_USERS_POINTERS_KEY, WEAVE_USERS_SELECTION_KEY, WEAVE_USER_POINTER_KEY, WEAVE_USER_SELECTION_KEY, WEAVE_VIDEO_DEFAULT_CONFIG, WEAVE_VIDEO_NODE_TYPE, Weave, WeaveAction, WeaveAlignNodesToolAction, WeaveArrowNode, WeaveArrowToolAction, WeaveBrushToolAction, WeaveCommentNode, WeaveCommentToolAction, WeaveCommentsRendererPlugin, WeaveConnectedUsersPlugin, WeaveContextMenuPlugin, WeaveCopyPasteNodesPlugin, WeaveEllipseNode, WeaveEllipseToolAction, WeaveEraserToolAction, WeaveExportNodesToolAction, WeaveExportStageToolAction, WeaveFitToScreenToolAction, WeaveFitToSelectionToolAction, WeaveFrameNode, WeaveFrameToolAction, WeaveGroupNode, WeaveImageNode, WeaveImageToolAction, WeaveLayerNode, WeaveLineNode, WeaveMeasureNode, WeaveMeasureToolAction, WeaveMoveToolAction, WeaveNode, WeaveNodesDistanceSnappingPlugin, WeaveNodesEdgeSnappingPlugin, WeaveNodesMultiSelectionFeedbackPlugin, WeaveNodesSelectionPlugin, WeavePenToolAction, WeavePlugin, WeaveRectangleNode, WeaveRectangleToolAction, WeaveRegularPolygonNode, WeaveRegularPolygonToolAction, WeaveSelectionToolAction, WeaveStageDropAreaPlugin, WeaveStageGridPlugin, WeaveStageKeyboardMovePlugin, WeaveStageMinimapPlugin, WeaveStageNode, WeaveStagePanningPlugin, WeaveStageResizePlugin, WeaveStageZoomPlugin, WeaveStarNode, WeaveStarToolAction, WeaveStore, WeaveStrokeNode, WeaveTextNode, WeaveTextToolAction, WeaveUsersPointersPlugin, WeaveUsersSelectionPlugin, WeaveVideoNode, WeaveVideoToolAction, WeaveZoomInToolAction, WeaveZoomOutToolAction, canComposite, clearContainerTargets, containerOverCursor, containsNodeDeep, defaultInitialState, getBoundingBox, getExportBoundingBox, getPositionRelativeToContainerOnPosition, getSelectedNodesMetadata, getStageClickPoint, getTargetAndSkipNodes, getTargetedNode, getTopmostShadowHost, getVisibleNodes, getVisibleNodesInViewport, hasFrames, hasImages, intersectArrays, isIOS, isInShadowDOM, isNodeInSelection, isServer, memoize, mergeExceptArrays, moveNodeToContainer, resetScale, setupCanvasBackend, setupSkiaBackend };
 //# sourceMappingURL=sdk.node.js.map