@annotorious/annotorious 3.6.2 → 3.6.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@annotorious/annotorious",
-  "version": "3.6.2",
+  "version": "3.6.4",
   "description": "Add image annotation functionality to any web page with a few lines of JavaScript",
   "author": "Rainer Simon",
   "license": "BSD-3-Clause",
@@ -49,7 +49,7 @@
     "vitest": "^3.2.4"
   },
   "dependencies": {
-    "@annotorious/core": "3.6.2",
+    "@annotorious/core": "3.6.4",
     "dequal": "^2.0.3",
     "rbush": "^4.0.1",
     "simplify-js": "^1.2.4",

package/src/annotation/editors/Handle.svelte

@@ -52,6 +52,9 @@
       cx={x}
       cy={y}
       r={handleRadius + (6 / scale)} 
+      role="button"
+      tabindex="0"
+      on:dblclick
       on:pointerenter
       on:pointerleave
       on:pointerdown

package/src/model/w3c/svg/pathParser.ts

@@ -60,10 +60,26 @@ export const svgPathToMultiPolygonElement = (d: string): MultiPolygonElement | u
   }
 }
 
+const areHandlesSymmetrical = (pt: PolylinePoint) => {
+  // Check if all three points are on a straight line (with a bit of tolerance)
+  const { point, inHandle, outHandle } = pt;
+
+  if (!inHandle || !outHandle) return false;
+
+  const dx1 = inHandle[0] - point[0];
+  const dy1 = inHandle[1] - point[1];
+  const dx2 = outHandle[0] - point[0];
+  const dy2 = outHandle[1] - point[1];
+
+  const cross = dx1 * dy2 - dy1 * dx2;
+
+  return Math.abs(cross) < 0.01;
+}
+
 export const svgPathToPolyline = (d: string): PolylineGeometry => {
   const commands = parsePathCommands(d);
 
-  const points: PolylinePoint[] = [];
+  let points: PolylinePoint[] = [];
 
   let currentPoint: [number, number] = [0, 0];
   let closed = false;
@@ -125,6 +141,7 @@ export const svgPathToPolyline = (d: string): PolylineGeometry => {
     }
   }
 
+  points = points.map(pt => areHandlesSymmetrical(pt) ? {...pt, locked: true } : pt);
   const bounds = boundsFromPoints(approximateAsPolygon(points, closed));
 
   return {