terra-draw - npm Package Compare versions

Comparing version 0.0.1-alpha.56 to 0.0.1-alpha.57

dist/geometry/transform/scale.d.ts

 import { Feature, LineString, Polygon, Position } from "geojson";
-export declare function transformScale(feature: Feature<Polygon | LineString>, factor: number, origin: Position): Feature<Polygon | LineString, import("geojson").GeoJsonProperties>;
+export declare function transformScale(feature: Feature<Polygon | LineString>, factor: number, origin: Position, axis?: "x" | "y" | "xy"): Feature<Polygon | LineString, import("geojson").GeoJsonProperties>;

dist/modes/select/select.mode.d.ts

@@ -5,2 +5,3 @@ import { TerraDrawMouseEvent, TerraDrawKeyboardEvent, TerraDrawAdapterStyling, HexColorStyling, NumericStyling, Cursor } from "../../common";
 import { GeoJSONStoreFeatures } from "../../store/store";
+import { ResizeOptions } from "./behaviors/drag-coordinate-resize.behavior";
 type TerraDrawSelectModeKeyEvents = {
@@ -21,3 +22,3 @@ deselect: KeyboardEvent["key"] | null;
             draggable?: boolean;
-            maintainShapeFrom?: "center" | "opposite";
+            resizable?: ResizeOptions;
             deletable?: boolean;
@@ -61,2 +62,3 @@ };
     cursors?: Cursors;
+    allowManualDeselection?: boolean;
 }
@@ -66,2 +68,3 @@ export declare class TerraDrawSelectMode extends TerraDrawBaseDrawMode<SelectionStyling> {
     mode: string;
+    private allowManualDeselection;
     private dragEventThrottle;
@@ -81,3 +84,3 @@ private dragEventCount;
     private scaleFeature;
-    private maintainShape;
+    private dragCoordinateResizeFeature;
     private cursors;
@@ -84,0 +87,0 @@ constructor(options?: TerraDrawSelectModeOptions<SelectionStyling>);

e2e/src/index.ts

@@ -79,5 +79,18 @@ import L from "leaflet";
 						},
+						rectangle: {
+							feature: {
+								draggable: true,
+								coordinates: {
+									draggable: true,
+									resizable: "opposite-corner-fixed",
+								},
+							},
+						},
 						circle: {
 							feature: {
 								draggable: true,
+								coordinates: {
+									draggable: true,
+									resizable: "center-fixed",
+								},
 							},
@@ -84,0 +97,0 @@ },

e2e/tests/leaflet.spec.ts

 import { test, expect } from "@playwright/test";
 import {
 	changeMode,
-	drawRectanglePolygon,
+	drawTwoClickShape,
+	drawRectangularPolygon,
 	expectGroupPosition,
@@ -260,3 +261,3 @@ expectPathDimensions,
 		// Draw a rectangle
-		const { topLeft } = await drawRectanglePolygon({ mapDiv, page });
+		const { topLeft } = await drawRectangularPolygon({ mapDiv, page });
 
@@ -296,3 +297,3 @@ // Change to select mode
 		// Draw a rectangle
-		const { topLeft } = await drawRectanglePolygon({ mapDiv, page });
+		const { topLeft } = await drawRectangularPolygon({ mapDiv, page });
 
@@ -323,2 +324,69 @@ // Change to select mode
 	});
+
+	test("selected rectangle can has it's shape maintained when coordinates are dragged", async ({
+		page,
+	}) => {
+		const mapDiv = await setupMap({ page });
+
+		await changeMode({ page, mode: "rectangle" });
+
+		// Draw a rectangle
+		const { topLeft } = await drawTwoClickShape({ mapDiv, page });
+
+		// Change to select mode
+		await changeMode({ page, mode });
+
+		// Before drag
+		const x = topLeft.x - 2;
+		const y = topLeft.y - 2;
+		await expectGroupPosition({ page, x, y });
+
+		// Select
+		await page.mouse.click(mapDiv.width / 2, mapDiv.height / 2);
+		await expectPaths({ page, count: 5 }); // 4 selection points and 1 square
+
+		// Drag
+		await page.mouse.move(topLeft.x, topLeft.y);
+		await page.mouse.down();
+		await page.mouse.move(topLeft.x - 100, topLeft.y + 100, { steps: 50 }); // Steps is required
+		await page.mouse.up();
+
+		// Deselect
+		await page.mouse.click(mapDiv.width - 10, mapDiv.height / 2);
+
+		// Dragged the square up and to the left
+		await expectGroupPosition({ page, x: 547, y: 267 });
+	});
+
+	test("selected circle can has it's shape maintained from center origin when coordinates are dragged", async ({
+		page,
+	}) => {
+		const mapDiv = await setupMap({ page });
+
+		await changeMode({ page, mode: "circle" });
+
+		// Draw a circle
+		await drawTwoClickShape({ mapDiv, page });
+
+		// Change to select mode
+		await changeMode({ page, mode });
+
+		// Select
+		await page.mouse.click(mapDiv.width / 2, mapDiv.height / 2);
+		await expectPaths({ page, count: 65 }); // 4 selection points and 1 square
+
+		// Drag
+		await page.mouse.move(mapDiv.width / 2, mapDiv.height / 2 + 50);
+		await page.mouse.down();
+		await page.mouse.move(mapDiv.width / 2, mapDiv.height / 2 + 100, {
+			steps: 50,
+		}); // Steps is required
+		await page.mouse.up();
+
+		// Deselect
+		await page.mouse.click(mapDiv.width - 10, mapDiv.height / 2);
+
+		// Dragged the square up and to the left
+		await expectGroupPosition({ page, x: 392, y: 112 });
+	});
 });
@@ -339,3 +407,3 @@
 		await changeMode({ page, mode: "polygon" });
-		await drawRectanglePolygon({ mapDiv, page });
+		await drawRectangularPolygon({ mapDiv, page });
 
@@ -342,0 +410,0 @@ await expectPaths({ page, count: 3 });

e2e/tests/setup.ts

@@ -108,3 +108,3 @@ import { Page, expect } from "@playwright/test";
 
-export const drawRectanglePolygon = async ({
+export const drawRectangularPolygon = async ({
 	mapDiv,
@@ -138,1 +138,29 @@ page,
 };
+
+export const drawTwoClickShape = async ({
+	mapDiv,
+	page,
+}: {
+	mapDiv: {
+		x: number;
+		y: number;
+		width: number;
+		height: number;
+	};
+	page: Page;
+}) => {
+	// Draw a rectangle
+	const sideLength = 100;
+	const halfLength = sideLength / 2;
+	const centerX = mapDiv.width / 2;
+	const centerY = mapDiv.height / 2;
+	const topLeft = { x: centerX - halfLength, y: centerY - halfLength };
+	const topRight = { x: centerX + halfLength, y: centerY - halfLength };
+	const bottomLeft = { x: centerX - halfLength, y: centerY + halfLength };
+	const bottomRight = { x: centerX + halfLength, y: centerY + halfLength };
+	await page.mouse.click(topLeft.x, topLeft.y);
+
+	await page.mouse.click(bottomRight.x, bottomRight.y); // Closed
+
+	return { topLeft, topRight, bottomRight, bottomLeft };
+};

package.json

 {
 	"name": "terra-draw",
-	"version": "0.0.1-alpha.56",
+	"version": "0.0.1-alpha.57",
 	"description": "Frictionless map drawing across mapping provider",
@@ -5,0 +5,0 @@ "scripts": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4029936

increased by0.26%

Lines of code

9144

increased by1.12%

No dependency changes