@inditextech/weave-sdk 4.0.1 → 4.1.0

package/dist/sdk.js

@@ -4,6 +4,7 @@ import { WEAVE_ASYNC_STATUS, WEAVE_AWARENESS_LAYER_ID, WEAVE_EXPORT_BACKGROUND_C
 import { getYjsDoc, getYjsValue, observeDeep, syncedStore } from "@syncedstore/core";
 import * as Y$1 from "yjs";
 import * as Y from "yjs";
+import simplify from "simplify-js";
 import "konva/lib/types";
 import "konva/lib/Stage";
 
@@ -22187,7 +22188,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "4.0.1";
+var version = "4.1.0";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -28442,8 +28443,8 @@ var WeaveStrokeNode = class extends WeaveNode {
 			const segLen = Math.hypot(dx, dy) || 1;
 			const nx = -dy / segLen;
 			const ny = dx / segLen;
-			const w0 = baseW * p0.pressure / 2;
-			const w1 = baseW * p1.pressure / 2;
+			const w0 = Math.max(baseW * p0.pressure / 2, .5);
+			const w1 = Math.max(baseW * p1.pressure / 2, .5);
 			let traveled = 0;
 			while (traveled < segLen) {
 				const step = Math.min(dashRemaining, segLen - traveled);
@@ -34521,6 +34522,11 @@ const BRUSH_TOOL_DEFAULT_CONFIG = { interpolationSteps: 10 };
 var WeaveBrushToolAction = class extends WeaveAction {
 	initialized = false;
 	isSpacePressed = false;
+	penActive = false;
+	lastSmoothedPressure = .5;
+	lastPointerPos = null;
+	lastPointerTime = 0;
+	predictedCount = 0;
 	onPropsChange = void 0;
 	onInit = void 0;
 	constructor(params) {
@@ -34550,11 +34556,29 @@ var WeaveBrushToolAction = class extends WeaveAction {
 		};
 	}
 	getEventPressure(e) {
-		if (e.evt.pointerType && e.evt.pointerType === "pen") return e.evt.pressure || .5;
-		return .5;
+		const now$2 = performance.now();
+		let velocity = 0;
+		if (this.lastPointerPos && now$2 - this.lastPointerTime > 0) {
+			const dx = e.evt.clientX - this.lastPointerPos.x;
+			const dy = e.evt.clientY - this.lastPointerPos.y;
+			velocity = Math.hypot(dx, dy) / (now$2 - this.lastPointerTime) * 1e3;
+		}
+		this.lastPointerPos = {
+			x: e.evt.clientX,
+			y: e.evt.clientY
+		};
+		this.lastPointerTime = now$2;
+		const alpha = Math.min(Math.max(velocity / 1500, .15), .6);
+		let raw;
+		if (e.evt.pointerType === "pen") raw = e.evt.pressure || .5;
+		else raw = .5;
+		this.lastSmoothedPressure = alpha * raw + (1 - alpha) * this.lastSmoothedPressure;
+		return Math.max(this.lastSmoothedPressure, .15);
 	}
 	setupEvents() {
 		const stage = this.instance.getStage();
+		this.prevTouchAction = stage.container().style.touchAction;
+		stage.container().style.touchAction = "none";
 		window.addEventListener("keyup", (e) => {
 			if (e.code === "Space" && this.instance.getActiveAction() === BRUSH_TOOL_ACTION_NAME) this.isSpacePressed = false;
 		}, { signal: this.instance.getEventsController()?.signal });
@@ -34580,6 +34604,8 @@ var WeaveBrushToolAction = class extends WeaveAction {
 			if (this.getZoomPlugin()?.isPinching()) return;
 			if (this.isSpacePressed) return;
 			if (e?.evt?.button !== 0) return;
+			if (e.evt.pointerType === "touch" && this.penActive) return;
+			if (e.evt.pointerType === "pen") this.penActive = true;
 			const pointPressure = this.getEventPressure(e);
 			this.handleStartStroke(pointPressure);
 			e.evt.stopPropagation();
@@ -34590,12 +34616,27 @@ var WeaveBrushToolAction = class extends WeaveAction {
 			this.setCursor();
 			if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
 			if (this.getZoomPlugin()?.isPinching()) return;
-			const pointPressure = this.getEventPressure(e);
-			this.handleMovement(pointPressure);
+			const coalescedEvents = e.evt.getCoalescedEvents ? e.evt.getCoalescedEvents() : [];
+			if (coalescedEvents.length > 1) {
+				for (const ce of coalescedEvents) {
+					const pointPressure = ce.pointerType === "pen" && typeof ce.pressure === "number" ? ce.pressure : .5;
+					this.handleMovement(pointPressure, void 0, false);
+				}
+				const predictedEvents = e.evt.getPredictedEvents ? e.evt.getPredictedEvents() : [];
+				if (predictedEvents.length > 0) {
+					const last = predictedEvents[predictedEvents.length - 1];
+					const predPressure = last.pointerType === "pen" && typeof last.pressure === "number" ? last.pressure : .5;
+					this.handleMovement(predPressure, last, true);
+				}
+			} else {
+				const pointPressure = this.getEventPressure(e);
+				this.handleMovement(pointPressure, void 0, false);
+			}
 			e.evt.stopPropagation();
 		};
 		stage.on("pointermove", handlePointerMove);
 		const handlePointerUp = (e) => {
+			this.penActive = false;
 			if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
 			if (this.getZoomPlugin()?.isPinching()) return;
 			this.handleEndStroke();
@@ -34632,6 +34673,10 @@ var WeaveBrushToolAction = class extends WeaveAction {
 		};
 	}
 	handleStartStroke(pressure) {
+		this.lastSmoothedPressure = .5;
+		this.lastPointerPos = null;
+		this.lastPointerTime = 0;
+		this.predictedCount = 0;
 		const { mousePoint, container, measureContainer } = this.instance.getMousePointer();
 		this.clickPoint = mousePoint;
 		this.container = container;
@@ -34660,17 +34705,25 @@ var WeaveBrushToolAction = class extends WeaveAction {
 		}
 		this.setState(BRUSH_TOOL_STATE.DEFINE_STROKE);
 	}
-	handleMovement(pressure) {
+	handleMovement(pressure, predictedEvent, isPredicted = false) {
 		if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
+		const stage = this.instance.getStage();
 		const tempStroke = this.instance.getStage().findOne(`#${this.strokeId}`);
 		if (this.measureContainer && tempStroke) {
+			if (predictedEvent) stage.setPointersPositions(predictedEvent);
 			const { mousePoint } = this.instance.getMousePointerRelativeToContainer(this.measureContainer);
 			const currentPoint = {
 				x: mousePoint.x - tempStroke.x(),
 				y: mousePoint.y - tempStroke.y(),
 				pressure
 			};
-			const newStrokeElements = [...tempStroke.getAttrs().strokeElements, currentPoint];
+			let newStrokeElements = [...tempStroke.getAttrs().strokeElements];
+			if (!isPredicted && this.predictedCount > 0) {
+				newStrokeElements = newStrokeElements.slice(0, -1 * this.predictedCount);
+				this.predictedCount = 0;
+			}
+			newStrokeElements.push(currentPoint);
+			if (isPredicted) this.predictedCount++;
 			const box = this.getBoundingBox(newStrokeElements);
 			tempStroke.setAttrs({
 				width: box.width,
@@ -34690,17 +34743,22 @@ var WeaveBrushToolAction = class extends WeaveAction {
 			if (nodeHandler) {
 				const box = this.getBoundingBox(tempStroke.getAttrs().strokeElements);
 				let newStrokeElements = [...tempStroke.getAttrs().strokeElements];
+				if (this.predictedCount > 0) {
+					newStrokeElements = newStrokeElements.slice(0, -1 * this.predictedCount);
+					this.predictedCount = 0;
+				}
 				newStrokeElements = newStrokeElements.map((point) => ({
 					...point,
 					x: point.x - box.x,
 					y: point.y - box.y
 				}));
+				const compressedPoints = simplify(newStrokeElements, 1, true);
 				tempStroke.setAttrs({
 					width: box.width,
 					height: box.height,
 					x: box.x,
 					y: box.y,
-					strokeElements: newStrokeElements
+					strokeElements: compressedPoints
 				});
 				const realNode = this.instance.getStage().findOne(`#${tempStroke.getAttrs().id}`);
 				if (realNode) realNode.destroy();
@@ -34736,6 +34794,7 @@ var WeaveBrushToolAction = class extends WeaveAction {
 	}
 	cleanup() {
 		const stage = this.instance.getStage();
+		stage.container().style.touchAction = this.prevTouchAction;
 		stage.container().style.cursor = "default";
 		this.instance.emitEvent("onAddedBrush");
 		const selectionPlugin = this.instance.getPlugin("nodesSelection");

package/dist/sdk.node.js

@@ -4,6 +4,7 @@ import pino from "pino";
 import { WEAVE_ASYNC_STATUS, WEAVE_AWARENESS_LAYER_ID, WEAVE_EXPORT_BACKGROUND_COLOR, WEAVE_EXPORT_FORMATS, WEAVE_EXPORT_RETURN_FORMAT, WEAVE_INSTANCE_STATUS, WEAVE_KONVA_BACKEND, WEAVE_LOG_LEVEL, WEAVE_NODE_CHANGE_TYPE, WEAVE_NODE_CUSTOM_EVENTS, WEAVE_NODE_LAYER_ID, WEAVE_NODE_POSITION, WEAVE_STORE_CONNECTION_STATUS, WEAVE_UTILITY_LAYER_ID } from "@inditextech/weave-types";
 import { getYjsDoc, getYjsValue, observeDeep, syncedStore } from "@syncedstore/core";
 import * as Y from "yjs";
+import simplify from "simplify-js";
 import "konva/lib/types";
 import "konva/lib/Stage";
 
@@ -22186,7 +22187,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "4.0.1";
+var version = "4.1.0";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -28441,8 +28442,8 @@ var WeaveStrokeNode = class extends WeaveNode {
 			const segLen = Math.hypot(dx, dy) || 1;
 			const nx = -dy / segLen;
 			const ny = dx / segLen;
-			const w0 = baseW * p0.pressure / 2;
-			const w1 = baseW * p1.pressure / 2;
+			const w0 = Math.max(baseW * p0.pressure / 2, .5);
+			const w1 = Math.max(baseW * p1.pressure / 2, .5);
 			let traveled = 0;
 			while (traveled < segLen) {
 				const step = Math.min(dashRemaining, segLen - traveled);
@@ -34520,6 +34521,11 @@ const BRUSH_TOOL_DEFAULT_CONFIG = { interpolationSteps: 10 };
 var WeaveBrushToolAction = class extends WeaveAction {
 	initialized = false;
 	isSpacePressed = false;
+	penActive = false;
+	lastSmoothedPressure = .5;
+	lastPointerPos = null;
+	lastPointerTime = 0;
+	predictedCount = 0;
 	onPropsChange = void 0;
 	onInit = void 0;
 	constructor(params) {
@@ -34549,11 +34555,29 @@ var WeaveBrushToolAction = class extends WeaveAction {
 		};
 	}
 	getEventPressure(e) {
-		if (e.evt.pointerType && e.evt.pointerType === "pen") return e.evt.pressure || .5;
-		return .5;
+		const now$2 = performance.now();
+		let velocity = 0;
+		if (this.lastPointerPos && now$2 - this.lastPointerTime > 0) {
+			const dx = e.evt.clientX - this.lastPointerPos.x;
+			const dy = e.evt.clientY - this.lastPointerPos.y;
+			velocity = Math.hypot(dx, dy) / (now$2 - this.lastPointerTime) * 1e3;
+		}
+		this.lastPointerPos = {
+			x: e.evt.clientX,
+			y: e.evt.clientY
+		};
+		this.lastPointerTime = now$2;
+		const alpha = Math.min(Math.max(velocity / 1500, .15), .6);
+		let raw;
+		if (e.evt.pointerType === "pen") raw = e.evt.pressure || .5;
+		else raw = .5;
+		this.lastSmoothedPressure = alpha * raw + (1 - alpha) * this.lastSmoothedPressure;
+		return Math.max(this.lastSmoothedPressure, .15);
 	}
 	setupEvents() {
 		const stage = this.instance.getStage();
+		this.prevTouchAction = stage.container().style.touchAction;
+		stage.container().style.touchAction = "none";
 		window.addEventListener("keyup", (e) => {
 			if (e.code === "Space" && this.instance.getActiveAction() === BRUSH_TOOL_ACTION_NAME) this.isSpacePressed = false;
 		}, { signal: this.instance.getEventsController()?.signal });
@@ -34579,6 +34603,8 @@ var WeaveBrushToolAction = class extends WeaveAction {
 			if (this.getZoomPlugin()?.isPinching()) return;
 			if (this.isSpacePressed) return;
 			if (e?.evt?.button !== 0) return;
+			if (e.evt.pointerType === "touch" && this.penActive) return;
+			if (e.evt.pointerType === "pen") this.penActive = true;
 			const pointPressure = this.getEventPressure(e);
 			this.handleStartStroke(pointPressure);
 			e.evt.stopPropagation();
@@ -34589,12 +34615,27 @@ var WeaveBrushToolAction = class extends WeaveAction {
 			this.setCursor();
 			if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
 			if (this.getZoomPlugin()?.isPinching()) return;
-			const pointPressure = this.getEventPressure(e);
-			this.handleMovement(pointPressure);
+			const coalescedEvents = e.evt.getCoalescedEvents ? e.evt.getCoalescedEvents() : [];
+			if (coalescedEvents.length > 1) {
+				for (const ce of coalescedEvents) {
+					const pointPressure = ce.pointerType === "pen" && typeof ce.pressure === "number" ? ce.pressure : .5;
+					this.handleMovement(pointPressure, void 0, false);
+				}
+				const predictedEvents = e.evt.getPredictedEvents ? e.evt.getPredictedEvents() : [];
+				if (predictedEvents.length > 0) {
+					const last = predictedEvents[predictedEvents.length - 1];
+					const predPressure = last.pointerType === "pen" && typeof last.pressure === "number" ? last.pressure : .5;
+					this.handleMovement(predPressure, last, true);
+				}
+			} else {
+				const pointPressure = this.getEventPressure(e);
+				this.handleMovement(pointPressure, void 0, false);
+			}
 			e.evt.stopPropagation();
 		};
 		stage.on("pointermove", handlePointerMove);
 		const handlePointerUp = (e) => {
+			this.penActive = false;
 			if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
 			if (this.getZoomPlugin()?.isPinching()) return;
 			this.handleEndStroke();
@@ -34631,6 +34672,10 @@ var WeaveBrushToolAction = class extends WeaveAction {
 		};
 	}
 	handleStartStroke(pressure) {
+		this.lastSmoothedPressure = .5;
+		this.lastPointerPos = null;
+		this.lastPointerTime = 0;
+		this.predictedCount = 0;
 		const { mousePoint, container, measureContainer } = this.instance.getMousePointer();
 		this.clickPoint = mousePoint;
 		this.container = container;
@@ -34659,17 +34704,25 @@ var WeaveBrushToolAction = class extends WeaveAction {
 		}
 		this.setState(BRUSH_TOOL_STATE.DEFINE_STROKE);
 	}
-	handleMovement(pressure) {
+	handleMovement(pressure, predictedEvent, isPredicted = false) {
 		if (this.state !== BRUSH_TOOL_STATE.DEFINE_STROKE) return;
+		const stage = this.instance.getStage();
 		const tempStroke = this.instance.getStage().findOne(`#${this.strokeId}`);
 		if (this.measureContainer && tempStroke) {
+			if (predictedEvent) stage.setPointersPositions(predictedEvent);
 			const { mousePoint } = this.instance.getMousePointerRelativeToContainer(this.measureContainer);
 			const currentPoint = {
 				x: mousePoint.x - tempStroke.x(),
 				y: mousePoint.y - tempStroke.y(),
 				pressure
 			};
-			const newStrokeElements = [...tempStroke.getAttrs().strokeElements, currentPoint];
+			let newStrokeElements = [...tempStroke.getAttrs().strokeElements];
+			if (!isPredicted && this.predictedCount > 0) {
+				newStrokeElements = newStrokeElements.slice(0, -1 * this.predictedCount);
+				this.predictedCount = 0;
+			}
+			newStrokeElements.push(currentPoint);
+			if (isPredicted) this.predictedCount++;
 			const box = this.getBoundingBox(newStrokeElements);
 			tempStroke.setAttrs({
 				width: box.width,
@@ -34689,17 +34742,22 @@ var WeaveBrushToolAction = class extends WeaveAction {
 			if (nodeHandler) {
 				const box = this.getBoundingBox(tempStroke.getAttrs().strokeElements);
 				let newStrokeElements = [...tempStroke.getAttrs().strokeElements];
+				if (this.predictedCount > 0) {
+					newStrokeElements = newStrokeElements.slice(0, -1 * this.predictedCount);
+					this.predictedCount = 0;
+				}
 				newStrokeElements = newStrokeElements.map((point) => ({
 					...point,
 					x: point.x - box.x,
 					y: point.y - box.y
 				}));
+				const compressedPoints = simplify(newStrokeElements, 1, true);
 				tempStroke.setAttrs({
 					width: box.width,
 					height: box.height,
 					x: box.x,
 					y: box.y,
-					strokeElements: newStrokeElements
+					strokeElements: compressedPoints
 				});
 				const realNode = this.instance.getStage().findOne(`#${tempStroke.getAttrs().id}`);
 				if (realNode) realNode.destroy();
@@ -34735,6 +34793,7 @@ var WeaveBrushToolAction = class extends WeaveAction {
 	}
 	cleanup() {
 		const stage = this.instance.getStage();
+		stage.container().style.touchAction = this.prevTouchAction;
 		stage.container().style.cursor = "default";
 		this.instance.emitEvent("onAddedBrush");
 		const selectionPlugin = this.instance.getPlugin("nodesSelection");