@inditextech/weave-sdk 0.22.1 → 0.23.0

package/dist/sdk.js

@@ -18102,7 +18102,7 @@ var WeaveRegisterManager = class {
 
 //#endregion
 //#region package.json
-var version = "0.22.1";
+var version = "0.23.0";
 
 //#endregion
 //#region src/managers/setup.ts
@@ -20300,14 +20300,14 @@ var WeaveStarNode = class extends WeaveNode {
 		} };
 	}
 	onRender(props) {
-		const rectangle = new Konva.Star({
+		const star = new Konva.Star({
 			...props,
 			name: "node",
 			numPoints: props.numPoints,
 			innerRadius: props.innerRadius,
 			outerRadius: props.outerRadius
 		});
-		rectangle.getTransformerProperties = () => {
+		star.getTransformerProperties = () => {
 			const stage = this.instance.getStage();
 			const node = stage.findOne(`#${props.id}`);
 			if (node && node.getAttrs().keepAspectRatio) return {
@@ -20322,8 +20322,8 @@ var WeaveStarNode = class extends WeaveNode {
 			};
 			return this.config.transform;
 		};
-		this.setupDefaultNodeEvents(rectangle);
-		return rectangle;
+		this.setupDefaultNodeEvents(star);
+		return star;
 	}
 	onUpdate(nodeInstance, nextProps) {
 		nodeInstance.setAttrs({ ...nextProps });
@@ -20378,17 +20378,17 @@ var WeaveArrowNode = class extends WeaveNode {
 	}
 	scaleReset(node) {
 		if (node.getAttrs().nodeType === "arrow") {
-			const lineNode = node;
-			const oldPoints = lineNode.points();
+			const arrowNode = node;
+			const oldPoints = arrowNode.points();
 			const newPoints = [];
 			for (let i = 0; i < oldPoints.length / 2; i++) {
 				const point = {
-					x: oldPoints[i * 2] * lineNode.scaleX(),
-					y: oldPoints[i * 2 + 1] * lineNode.scaleY()
+					x: oldPoints[i * 2] * arrowNode.scaleX(),
+					y: oldPoints[i * 2 + 1] * arrowNode.scaleY()
 				};
 				newPoints.push(point.x, point.y);
 			}
-			lineNode.points(newPoints);
+			arrowNode.points(newPoints);
 		}
 		node.width(Math.max(5, node.width() * node.scaleX()));
 		node.height(Math.max(5, node.height() * node.scaleY()));
@@ -20397,6 +20397,64 @@ var WeaveArrowNode = class extends WeaveNode {
 	}
 };
 
+//#endregion
+//#region src/nodes/regular-polygon/constants.ts
+const WEAVE_REGULAR_POLYGON_NODE_TYPE = "regular-polygon";
+
+//#endregion
+//#region src/nodes/regular-polygon/regular-polygon.ts
+var WeaveRegularPolygonNode = class extends WeaveNode {
+	nodeType = WEAVE_REGULAR_POLYGON_NODE_TYPE;
+	constructor(params) {
+		super();
+		const { config } = params ?? {};
+		this.config = { transform: {
+			...WEAVE_DEFAULT_TRANSFORM_PROPERTIES,
+			...config?.transform
+		} };
+	}
+	onRender(props) {
+		const regularPolygon = new Konva.RegularPolygon({
+			...props,
+			name: "node",
+			sides: props.sides,
+			radius: props.radius
+		});
+		regularPolygon.getTransformerProperties = () => {
+			return {
+				...this.config.transform,
+				enabledAnchors: [
+					"top-left",
+					"top-right",
+					"bottom-left",
+					"bottom-right"
+				],
+				keepRatio: true
+			};
+		};
+		this.setupDefaultNodeEvents(regularPolygon);
+		return regularPolygon;
+	}
+	onUpdate(nodeInstance, nextProps) {
+		nodeInstance.setAttrs({
+			...nextProps,
+			radius: nextProps.radius
+		});
+		const nodesSelectionPlugin = this.instance.getPlugin("nodesSelection");
+		if (nodesSelectionPlugin) {
+			const actualSelectedNodes = nodesSelectionPlugin.getSelectedNodes();
+			nodesSelectionPlugin.setSelectedNodes(actualSelectedNodes);
+			nodesSelectionPlugin.getTransformer().forceUpdate();
+		}
+	}
+	scaleReset(node) {
+		const regularPolygonNode = node;
+		regularPolygonNode.radius(Math.max(5, regularPolygonNode.radius() * regularPolygonNode.scaleX()));
+		node.scaleX(1);
+		node.scaleY(1);
+	}
+};
+
 //#endregion
 //#region src/nodes/frame/constants.ts
 const WEAVE_FRAME_NODE_TYPE = "frame";
@@ -21679,8 +21737,8 @@ var WeaveEllipseToolAction = class extends WeaveAction {
 		const node = nodeHandler.create(this.ellipseId, {
 			...this.props,
 			strokeScaleEnabled: true,
-			x: this.clickPoint?.x ?? 0,
-			y: this.clickPoint?.y ?? 0,
+			x: this.clickPoint?.x ?? 0 + this.props.radiusX,
+			y: this.clickPoint?.y ?? 0 + this.props.radiusY,
 			radiusX: 0,
 			radiusY: 0
 		});
@@ -21706,8 +21764,8 @@ var WeaveEllipseToolAction = class extends WeaveAction {
 			}
 			ellipse.setAttrs({
 				...this.props,
-				x: ellipsePos.x + ellipseRadiusX / 2,
-				y: ellipsePos.y + ellipseRadiusY / 2,
+				x: ellipsePos.x + ellipseRadiusX,
+				y: ellipsePos.y + ellipseRadiusY,
 				radiusX: ellipseRadiusX,
 				radiusY: ellipseRadiusY
 			});
@@ -21732,8 +21790,8 @@ var WeaveEllipseToolAction = class extends WeaveAction {
 				ellipsePos.y = Math.min(this.clickPoint.y, mousePoint.y);
 			}
 			ellipse.setAttrs({
-				x: ellipsePos.x + deltaX / 2,
-				y: ellipsePos.y + deltaY / 2,
+				x: ellipsePos.x + deltaX,
+				y: ellipsePos.y + deltaY,
 				radiusX: deltaX,
 				radiusY: deltaY
 			});
@@ -22363,8 +22421,8 @@ var WeaveStarToolAction = class extends WeaveAction {
 		const node = nodeHandler.create(this.starId, {
 			...this.props,
 			strokeScaleEnabled: true,
-			x: this.clickPoint?.x ?? 0,
-			y: this.clickPoint?.y ?? 0,
+			x: this.clickPoint?.x ?? 0 + this.props.outerRadius,
+			y: this.clickPoint?.y ?? 0 + this.props.outerRadius,
 			numPoints: 5,
 			innerRadius: 0,
 			outerRadius: 0
@@ -22391,8 +22449,8 @@ var WeaveStarToolAction = class extends WeaveAction {
 			}
 			star.setAttrs({
 				...this.props,
-				x: starPos.x + starOuterRadius / 2,
-				y: starPos.y + starOuterRadius / 2,
+				x: starPos.x + starOuterRadius,
+				y: starPos.y + starOuterRadius,
 				outerRadius: starOuterRadius,
 				innerRadius: starInnerRadius
 			});
@@ -22417,8 +22475,8 @@ var WeaveStarToolAction = class extends WeaveAction {
 				starPos.y = Math.min(this.clickPoint.y, mousePoint.y);
 			}
 			star.setAttrs({
-				x: starPos.x + deltaX / 2,
-				y: starPos.y + deltaX / 2,
+				x: starPos.x + deltaX,
+				y: starPos.y + deltaX,
 				outerRadius: deltaX,
 				innerRadius: deltaY
 			});
@@ -22705,6 +22763,185 @@ var WeaveArrowToolAction = class extends WeaveAction {
 	}
 };
 
+//#endregion
+//#region src/actions/regular-polygon-tool/constants.ts
+const REGULAR_POLYGON_TOOL_ACTION_NAME = "regularPolygonTool";
+const REGULAR_POLYGON_TOOL_STATE = {
+	["IDLE"]: "idle",
+	["ADDING"]: "adding",
+	["DEFINING_SIZE"]: "definingSize",
+	["ADDED"]: "added"
+};
+
+//#endregion
+//#region src/actions/regular-polygon-tool/regular-polygon-tool.ts
+var WeaveRegularPolygonToolAction = class extends WeaveAction {
+	initialized = false;
+	onPropsChange = void 0;
+	onInit = void 0;
+	constructor() {
+		super();
+		this.initialized = false;
+		this.state = REGULAR_POLYGON_TOOL_STATE.IDLE;
+		this.regularPolygonId = null;
+		this.creating = false;
+		this.moved = false;
+		this.container = void 0;
+		this.clickPoint = null;
+		this.props = this.initProps();
+	}
+	getName() {
+		return REGULAR_POLYGON_TOOL_ACTION_NAME;
+	}
+	initProps() {
+		return {
+			opacity: 1,
+			fill: "#71717aff",
+			stroke: "#000000ff",
+			strokeWidth: 1,
+			sides: 5,
+			radius: 50
+		};
+	}
+	setupEvents() {
+		const stage = this.instance.getStage();
+		stage.container().addEventListener("keydown", (e) => {
+			if (e.key === "Enter" && this.instance.getActiveAction() === REGULAR_POLYGON_TOOL_ACTION_NAME) {
+				this.cancelAction();
+				return;
+			}
+			if (e.key === "Escape" && this.instance.getActiveAction() === REGULAR_POLYGON_TOOL_ACTION_NAME) {
+				this.cancelAction();
+				return;
+			}
+		});
+		stage.on("mousedown touchstart", (e) => {
+			e.evt.preventDefault();
+			if (this.state === REGULAR_POLYGON_TOOL_STATE.ADDING) {
+				this.creating = true;
+				this.handleAdding();
+			}
+		});
+		stage.on("mousemove touchmove", (e) => {
+			e.evt.preventDefault();
+			if (this.state === REGULAR_POLYGON_TOOL_STATE.DEFINING_SIZE) {
+				this.moved = true;
+				this.handleMovement();
+			}
+		});
+		stage.on("mouseup touchend", (e) => {
+			e.evt.preventDefault();
+			if (this.state === REGULAR_POLYGON_TOOL_STATE.DEFINING_SIZE) {
+				this.creating = false;
+				this.handleSettingSize();
+			}
+		});
+		this.initialized = true;
+	}
+	setState(state) {
+		this.state = state;
+	}
+	addRegularPolygon() {
+		const stage = this.instance.getStage();
+		stage.container().style.cursor = "crosshair";
+		stage.container().focus();
+		this.clickPoint = null;
+		this.setState(REGULAR_POLYGON_TOOL_STATE.ADDING);
+	}
+	handleAdding() {
+		const { mousePoint, container } = this.instance.getMousePointer();
+		this.clickPoint = mousePoint;
+		this.container = container;
+		this.regularPolygonId = v4_default();
+		const nodeHandler = this.instance.getNodeHandler("regular-polygon");
+		const node = nodeHandler.create(this.regularPolygonId, {
+			...this.props,
+			strokeScaleEnabled: true,
+			x: (this.clickPoint?.x ?? 0) + this.props.radius,
+			y: (this.clickPoint?.y ?? 0) + this.props.radius,
+			radius: 0
+		});
+		this.instance.addNode(node, this.container?.getAttrs().id);
+		this.setState(REGULAR_POLYGON_TOOL_STATE.DEFINING_SIZE);
+	}
+	handleSettingSize() {
+		const regularPolygon = this.instance.getStage().findOne(`#${this.regularPolygonId}`);
+		if (this.regularPolygonId && this.clickPoint && this.container && regularPolygon) {
+			const { mousePoint } = this.instance.getMousePointerRelativeToContainer(this.container);
+			const nodeHandler = this.instance.getNodeHandler("regular-polygon");
+			const starPos = {
+				x: this.clickPoint.x,
+				y: this.clickPoint.y
+			};
+			let newRadius = this.props.radius;
+			if (this.moved) {
+				starPos.x = Math.min(this.clickPoint.x, mousePoint.x);
+				starPos.y = Math.min(this.clickPoint.y, mousePoint.y);
+				newRadius = Math.abs(this.clickPoint.x - mousePoint.x);
+			}
+			regularPolygon.setAttrs({
+				...this.props,
+				x: starPos.x + newRadius,
+				y: starPos.y + newRadius,
+				radius: newRadius
+			});
+			this.instance.updateNode(nodeHandler.serialize(regularPolygon));
+		}
+		this.cancelAction();
+	}
+	handleMovement() {
+		if (this.state !== REGULAR_POLYGON_TOOL_STATE.DEFINING_SIZE) return;
+		const regularPolygon = this.instance.getStage().findOne(`#${this.regularPolygonId}`);
+		if (this.regularPolygonId && this.container && this.clickPoint && regularPolygon) {
+			const { mousePoint } = this.instance.getMousePointerRelativeToContainer(this.container);
+			const deltaX = Math.abs(mousePoint.x - this.clickPoint?.x);
+			const nodeHandler = this.instance.getNodeHandler("regular-polygon");
+			const starPos = {
+				x: this.clickPoint.x,
+				y: this.clickPoint.y
+			};
+			if (this.moved) {
+				starPos.x = Math.min(this.clickPoint.x, mousePoint.x);
+				starPos.y = Math.min(this.clickPoint.y, mousePoint.y);
+			}
+			regularPolygon.setAttrs({
+				x: starPos.x + deltaX,
+				y: starPos.y + deltaX,
+				radius: deltaX
+			});
+			this.instance.updateNode(nodeHandler.serialize(regularPolygon));
+		}
+	}
+	trigger(cancelAction) {
+		if (!this.instance) throw new Error("Instance not defined");
+		if (!this.initialized) this.setupEvents();
+		const stage = this.instance.getStage();
+		stage.container().tabIndex = 1;
+		stage.container().focus();
+		this.cancelAction = cancelAction;
+		const selectionPlugin = this.instance.getPlugin("nodesSelection");
+		if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
+		this.props = this.initProps();
+		this.addRegularPolygon();
+	}
+	cleanup() {
+		const stage = this.instance.getStage();
+		stage.container().style.cursor = "default";
+		const selectionPlugin = this.instance.getPlugin("nodesSelection");
+		if (selectionPlugin) {
+			const node = stage.findOne(`#${this.regularPolygonId}`);
+			if (node) selectionPlugin.setSelectedNodes([node]);
+			this.instance.triggerAction(SELECTION_TOOL_ACTION_NAME);
+		}
+		this.regularPolygonId = null;
+		this.creating = false;
+		this.moved = false;
+		this.container = void 0;
+		this.clickPoint = null;
+		this.setState(REGULAR_POLYGON_TOOL_STATE.IDLE);
+	}
+};
+
 //#endregion
 //#region src/actions/frame-tool/constants.ts
 const FRAME_TOOL_ACTION_NAME = "frameTool";
@@ -24141,5 +24378,5 @@ var WeaveNodesSnappingPlugin = class extends WeavePlugin {
 };
 
 //#endregion
-export { ARROW_TOOL_ACTION_NAME, ARROW_TOOL_STATE, BRUSH_TOOL_ACTION_NAME, 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_LINE_DEFAULT_CONFIG, GUIDE_LINE_DRAG_SNAPPING_THRESHOLD, GUIDE_LINE_NAME, GUIDE_LINE_TRANSFORM_SNAPPING_THRESHOLD, GUIDE_ORIENTATION, IMAGE_TOOL_ACTION_NAME, IMAGE_TOOL_STATE, MOVE_TOOL_ACTION_NAME, MOVE_TOOL_STATE, NODE_SNAP, PEN_TOOL_ACTION_NAME, PEN_TOOL_STATE, RECTANGLE_TOOL_ACTION_NAME, RECTANGLE_TOOL_STATE, SELECTION_TOOL_ACTION_NAME, SELECTION_TOOL_STATE, STAR_TOOL_ACTION_NAME, STAR_TOOL_STATE, TEXT_LAYOUT, TEXT_TOOL_ACTION_NAME, TEXT_TOOL_STATE, WEAVE_ARROW_NODE_TYPE, WEAVE_COPY_PASTE_NODES_KEY, WEAVE_DEFAULT_USER_INFO_FUNCTION, WEAVE_ELLIPSE_NODE_TYPE, WEAVE_FRAME_NODE_DEFAULT_CONFIG, WEAVE_FRAME_NODE_DEFAULT_PROPS, WEAVE_FRAME_NODE_SIZES, WEAVE_FRAME_NODE_SIZES_MULTIPLIER, WEAVE_FRAME_NODE_SIZES_ORIENTATION, WEAVE_FRAME_NODE_SIZES_TYPES, WEAVE_FRAME_NODE_TYPE, WEAVE_GRID_DEFAULT_COLOR, WEAVE_GRID_DEFAULT_ORIGIN_COLOR, WEAVE_GRID_DEFAULT_SIZE, WEAVE_GRID_DEFAULT_TYPE, WEAVE_GRID_LAYER_ID, WEAVE_GRID_TYPES, WEAVE_GROUP_NODE_TYPE, WEAVE_IMAGE_NODE_TYPE, WEAVE_LAYER_NODE_TYPE, WEAVE_LINE_NODE_TYPE, WEAVE_NODES_SELECTION_KEY, WEAVE_NODES_SELECTION_LAYER_ID, WEAVE_NODES_SNAPPING_KEY, WEAVE_RECTANGLE_NODE_TYPE, WEAVE_STAGE_GRID_KEY, WEAVE_STAGE_NODE_TYPE, WEAVE_STAR_NODE_TYPE, WEAVE_TEXT_NODE_TYPE, WEAVE_USERS_POINTERS_KEY, WEAVE_USERS_SELECTION_KEY, WEAVE_USER_POINTERS_DEFAULT_PROPS, WEAVE_USER_POINTER_KEY, WEAVE_USER_SELECTION_KEY, Weave, WeaveAction, WeaveArrowNode, WeaveArrowToolAction, WeaveBrushToolAction, WeaveConnectedUsersPlugin, WeaveContextMenuPlugin, WeaveCopyPasteNodesPlugin, WeaveEllipseNode, WeaveEllipseToolAction, WeaveEraserToolAction, WeaveExportNodeToolAction, WeaveExportStageToolAction, WeaveFitToScreenToolAction, WeaveFitToSelectionToolAction, WeaveFrameNode, WeaveFrameToolAction, WeaveGroupNode, WeaveImageNode, WeaveImageToolAction, WeaveLayerNode, WeaveLineNode, WeaveMoveToolAction, WeaveNode, WeaveNodesSelectionPlugin, WeaveNodesSnappingPlugin, WeavePenToolAction, WeavePlugin, WeaveRectangleNode, WeaveRectangleToolAction, WeaveSelectionToolAction, WeaveStageDropAreaPlugin, WeaveStageGridPlugin, WeaveStageNode, WeaveStagePanningPlugin, WeaveStageResizePlugin, WeaveStageZoomPlugin, WeaveStarNode, WeaveStarToolAction, WeaveStore, WeaveTextNode, WeaveTextToolAction, WeaveUsersPointersPlugin, WeaveUsersSelectionPlugin, WeaveZoomInToolAction, WeaveZoomOutToolAction, checkIfOverContainer, clearContainerTargets, moveNodeToContainer, resetScale };
+export { ARROW_TOOL_ACTION_NAME, ARROW_TOOL_STATE, BRUSH_TOOL_ACTION_NAME, 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_LINE_DEFAULT_CONFIG, GUIDE_LINE_DRAG_SNAPPING_THRESHOLD, GUIDE_LINE_NAME, GUIDE_LINE_TRANSFORM_SNAPPING_THRESHOLD, GUIDE_ORIENTATION, IMAGE_TOOL_ACTION_NAME, IMAGE_TOOL_STATE, MOVE_TOOL_ACTION_NAME, MOVE_TOOL_STATE, NODE_SNAP, 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, STAR_TOOL_ACTION_NAME, STAR_TOOL_STATE, TEXT_LAYOUT, TEXT_TOOL_ACTION_NAME, TEXT_TOOL_STATE, WEAVE_ARROW_NODE_TYPE, WEAVE_COPY_PASTE_NODES_KEY, WEAVE_DEFAULT_USER_INFO_FUNCTION, WEAVE_ELLIPSE_NODE_TYPE, WEAVE_FRAME_NODE_DEFAULT_CONFIG, WEAVE_FRAME_NODE_DEFAULT_PROPS, WEAVE_FRAME_NODE_SIZES, WEAVE_FRAME_NODE_SIZES_MULTIPLIER, WEAVE_FRAME_NODE_SIZES_ORIENTATION, WEAVE_FRAME_NODE_SIZES_TYPES, WEAVE_FRAME_NODE_TYPE, WEAVE_GRID_DEFAULT_COLOR, WEAVE_GRID_DEFAULT_ORIGIN_COLOR, WEAVE_GRID_DEFAULT_SIZE, WEAVE_GRID_DEFAULT_TYPE, WEAVE_GRID_LAYER_ID, WEAVE_GRID_TYPES, WEAVE_GROUP_NODE_TYPE, WEAVE_IMAGE_NODE_TYPE, WEAVE_LAYER_NODE_TYPE, WEAVE_LINE_NODE_TYPE, WEAVE_NODES_SELECTION_KEY, WEAVE_NODES_SELECTION_LAYER_ID, WEAVE_NODES_SNAPPING_KEY, WEAVE_RECTANGLE_NODE_TYPE, WEAVE_REGULAR_POLYGON_NODE_TYPE, WEAVE_STAGE_GRID_KEY, WEAVE_STAGE_NODE_TYPE, WEAVE_STAR_NODE_TYPE, WEAVE_TEXT_NODE_TYPE, WEAVE_USERS_POINTERS_KEY, WEAVE_USERS_SELECTION_KEY, WEAVE_USER_POINTERS_DEFAULT_PROPS, WEAVE_USER_POINTER_KEY, WEAVE_USER_SELECTION_KEY, Weave, WeaveAction, WeaveArrowNode, WeaveArrowToolAction, WeaveBrushToolAction, WeaveConnectedUsersPlugin, WeaveContextMenuPlugin, WeaveCopyPasteNodesPlugin, WeaveEllipseNode, WeaveEllipseToolAction, WeaveEraserToolAction, WeaveExportNodeToolAction, WeaveExportStageToolAction, WeaveFitToScreenToolAction, WeaveFitToSelectionToolAction, WeaveFrameNode, WeaveFrameToolAction, WeaveGroupNode, WeaveImageNode, WeaveImageToolAction, WeaveLayerNode, WeaveLineNode, WeaveMoveToolAction, WeaveNode, WeaveNodesSelectionPlugin, WeaveNodesSnappingPlugin, WeavePenToolAction, WeavePlugin, WeaveRectangleNode, WeaveRectangleToolAction, WeaveRegularPolygonNode, WeaveRegularPolygonToolAction, WeaveSelectionToolAction, WeaveStageDropAreaPlugin, WeaveStageGridPlugin, WeaveStageNode, WeaveStagePanningPlugin, WeaveStageResizePlugin, WeaveStageZoomPlugin, WeaveStarNode, WeaveStarToolAction, WeaveStore, WeaveTextNode, WeaveTextToolAction, WeaveUsersPointersPlugin, WeaveUsersSelectionPlugin, WeaveZoomInToolAction, WeaveZoomOutToolAction, checkIfOverContainer, clearContainerTargets, moveNodeToContainer, resetScale };
 //# sourceMappingURL=sdk.js.map