@linkurious/ogma-annotations 1.1.13 → 1.1.15

package/dist/style.css

@@ -1 +1 @@
-:root{--handle-width: 2px;--point-handle-width: calc(3 * var(--handle-width));--point-handle-border: 2px;--point-handle-total: calc( var(--point-handle-width) + var(--point-handle-border) );--handle-color: #38e}svg text{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.handle{position:absolute;background-color:var(--handle-color)}.handle.line{cursor:move}.annotation-text-handle textarea{outline:none;margin:0;border:0;width:100%;height:100%;cursor:text;padding:0;z-index:1000;resize:none;white-space:break-spaces;background:transparent;overflow:hidden}.annotation-text-handle .noevents{pointer-events:none;z-index:20}.line-handle,.point-handle{z-index:30}.line-handle.top{cursor:ns-resize;height:var(--handle-width);left:0;width:100%;top:calc(var(--handle-width) * -1)}.line-handle.bottom{cursor:ns-resize;height:var(--handle-width);width:100%;left:0;bottom:calc(var(--handle-width) * -1)}.line-handle.left{cursor:ew-resize;height:100%;top:0;left:calc(var(--handle-width) * -1);width:var(--handle-width)}.line-handle.right{cursor:ew-resize;height:100%;right:calc(var(--handle-width) * -1);top:0;width:var(--handle-width)}.line-handle.top,.line-handle.bottom,.line-handle.left,.line-handle.right{cursor:move}.point-handle{border-radius:50%;background-color:#fff;transform-origin:center;transform:translate(-50%,-50%);border:var(--point-handle-border) solid var(--handle-color);width:var(--point-handle-width);height:var(--point-handle-width)}.point-handle.top-left{transform:translate(-75%,-75%)}.point-handle.top-right{transform:translate(-25%,-75%)}.point-handle.bottom-left{transform:translate(-75%,-25%)}.point-handle.bottom-right{transform:translate(-25%,-25%)}.point-handle.top-left,.point-handle.bottom-right{cursor:nwse-resize}.point-handle.top-right,.point-handle.bottom-left{cursor:nesw-resize}.point-handle.bottom-left,.point-handle.bottom-right{top:100%}.point-handle.top-left,.point-handle.top-right{top:0}.point-handle.bottom-left,.point-handle.top-left{left:0}.point-handle.bottom-right,.point-handle.top-right{left:100%}.arrow-handle>.handle{height:var(--point-handle-width);width:var(--point-handle-width);border-radius:50%;cursor:move;transform:translate(-50%,-50%)}.arrow-handle>.line{height:var(--handle-width);border-radius:0;cursor:move}.annotations-hidden-input{position:absolute;bottom:0;left:0;visibility:hidden;display:block}.active{background-color:#38e}.annotation-text{pointer-events:visible;cursor:pointer}.annotation-text:hover>rect{stroke:var(--handle-color)}.annotation-text a{fill:var(--handle-color)}.annotation-text a:hover{text-decoration:underline}
+:root{--handle-width: 2px;--point-handle-width: calc(3 * var(--handle-width));--point-handle-border: 2px;--point-handle-total: calc( var(--point-handle-width) + var(--point-handle-border) );--handle-color: #38e;--handle-background: #fff}svg text{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.handle{position:absolute;background-color:var(--handle-color)}.handle.line{cursor:move}.annotation-text-handle textarea{outline:none;margin:0;border:0;width:100%;height:100%;cursor:text;padding:0;z-index:1000;resize:none;white-space:break-spaces;background:transparent;overflow:hidden}.annotation-text-handle .noevents{pointer-events:none;z-index:20}.line-handle,.point-handle{z-index:30}.line-handle.top{cursor:ns-resize;height:var(--handle-width);left:0;width:100%;top:calc(var(--handle-width) * -1)}.line-handle.bottom{cursor:ns-resize;height:var(--handle-width);width:100%;left:0;bottom:calc(var(--handle-width) * -1)}.line-handle.left{cursor:ew-resize;height:100%;top:0;left:calc(var(--handle-width) * -1);width:var(--handle-width)}.line-handle.right{cursor:ew-resize;height:100%;right:calc(var(--handle-width) * -1);top:0;width:var(--handle-width)}.line-handle.top,.line-handle.bottom,.line-handle.left,.line-handle.right{cursor:move}.point-handle{border-radius:50%;background-color:#fff;transform-origin:center;transform:translate(-50%,-50%);border:var(--point-handle-border) solid var(--handle-color);width:var(--point-handle-width);height:var(--point-handle-width)}.point-handle.top-left{transform:translate(-55%,-55%)}.point-handle.top-right{transform:translate(-45%,-55%)}.point-handle.bottom-left{transform:translate(-55%,-45%)}.point-handle.bottom-right{transform:translate(-45%,-45%)}.point-handle.top-left,.point-handle.bottom-right{cursor:nwse-resize}.point-handle.top-right,.point-handle.bottom-left{cursor:nesw-resize}.point-handle.bottom-left,.point-handle.bottom-right{top:100%}.point-handle.top-left,.point-handle.top-right{top:0}.point-handle.bottom-left,.point-handle.top-left{left:0}.point-handle.bottom-right,.point-handle.top-right{left:100%}.arrow-handle>.handle{height:var(--point-handle-width);width:var(--point-handle-width);border-radius:50%;cursor:move;transform:translate(-50%,-50%)}.arrow-handle>.line{height:var(--handle-width);border-radius:0;cursor:move}.arrow-handle>.point{background-color:var(--handle-background);border:2px solid var(--handle-color)}.annotations-hidden-input{position:absolute;bottom:0;left:0;visibility:hidden;display:block}.active{background-color:#38e}.annotation-text{pointer-events:visible;cursor:pointer}.annotation-text:hover>rect{stroke:var(--handle-color)}.annotation-text a{fill:var(--handle-color)}.annotation-text a:hover{text-decoration:underline}

package/dist/types/Control.d.ts

@@ -93,6 +93,7 @@ export declare class Control extends EventEmitter<FeatureEvents> {
      * @param style The new style
      */
     updateStyle<A extends Annotation>(id: Id, style: A["properties"]["style"]): this;
+    setScale(id: Id, scale: number, ox: number, oy: number): this;
     /**
      *
      * @returns the annotations in the controller

package/dist/types/Editor/Arrows/render.d.ts

@@ -1,4 +1,4 @@
-import { Arrow, ArrowStyles } from '../../types';
+import { Arrow, ArrowStyles } from "../../types";
 /**
  * @function getArrowHeight
  * @param arrow The arrow to measure

package/dist/types/Editor/base.d.ts

@@ -17,7 +17,6 @@ export declare abstract class Editor<T extends Annotation> extends eventEmmitter
     protected shouldDetect: boolean;
     protected isDragging: boolean;
     protected showeditorOnHover: boolean;
-    protected maxHandleScale: number;
     constructor(ogma: Ogma, editorHtml: string);
     private _onKeyUp;
     protected _canRemove(): boolean;
@@ -30,6 +29,7 @@ export declare abstract class Editor<T extends Annotation> extends eventEmmitter
     add(options: T): T;
     updateStyle(annotation: T, style: Partial<T["properties"]["style"]>): void;
     updateGeometry(annotation: T, geometry: Partial<T["geometry"]>): void;
+    scale(annotation: T, scale: number, ox: number, oy: number): void;
     /**
      * @method update
      * Updates an annotation (position, color etc)

package/dist/types/types.d.ts

@@ -1,4 +1,3 @@
-import { Point } from "@linkurious/ogma";
 import type { Feature, FeatureCollection, Geometry, GeometryObject, LineString, Polygon } from "geojson";
 import { EVT_ADD, EVT_CANCEL_DRAWING, EVT_DRAG, EVT_DRAG_END, EVT_DRAG_START, EVT_HOVER, EVT_REMOVE, EVT_SELECT, EVT_UNHOVER, EVT_UNSELECT, EVT_UPDATE, EVT_LINK } from "./constants";
 export declare const isArrow: (a: AnnotationFeature<Geometry, AnnotationProps>) => a is Arrow;
@@ -17,6 +16,10 @@ export interface ArrowStyles extends StrokeOptions {
     tail?: Extremity;
     head?: Extremity;
 }
+export type Point = {
+    x: number;
+    y: number;
+};
 type ExportedLink = {
     id: Id;
     side: "start" | "end";
@@ -41,7 +44,7 @@ export interface TextStyle extends StrokeOptions {
     /** Helvetica, sans-serif...  */
     font?: string;
     /** Font size, in pixels */
-    fontSize?: number;
+    fontSize?: number | string;
     /** text color: #f00, yellow...*/
     color?: string;
     /** background color: empty for transparent #f00, yellow...*/
@@ -184,4 +187,5 @@ export type ControllerOptions = {
     maxArrowHeight: number;
 };
 export type Annotation = Arrow | Text;
+export type Vector = Point;
 export {};

package/dist/types/utils.d.ts

@@ -1,5 +1,5 @@
 import { Point } from "@linkurious/ogma";
-import type { BBox } from "geojson";
+import type { BBox, LineString, Polygon } from "geojson";
 import { AnnotationCollection, Arrow, Text } from "./types";
 export declare function createSVGElement<T extends SVGElement>(tag: string): T;
 export declare function getTextBbox(t: Text): BBox;
@@ -41,6 +41,7 @@ export declare function setArrowEndPoint(a: Arrow, side: "start" | "end", x: num
 export declare const getHandleId: (handle: HTMLDivElement) => number;
 type Bounds = [number, number, number, number];
 export declare function getAnnotationsBounds(annotations: AnnotationCollection): Bounds;
+export declare function scaleGeometry(geometry: LineString | Polygon, scale: number, ox: number, oy: number): LineString | Polygon;
 export declare function getAttachmentPointOnNode(start: Point, nodeCenter: Point, nodeRadius: number): {
     x: number;
     y: number;

package/dist/types/vec.d.ts

@@ -0,0 +1,15 @@
+import { Vector } from "./types";
+export declare const subtract: (a: Vector, b: Vector) => Vector;
+export declare const length: (v: Vector) => number;
+export declare const invert: (v: Vector) => Vector;
+export declare const clone: (v: Vector) => {
+    x: number;
+    y: number;
+};
+export declare const normalize: (v: Vector) => Vector;
+export declare const add: (a: Vector, b: Vector) => Vector;
+export declare const mul: (v: Vector, s: number) => Vector;
+export declare const multiply: (a: Vector, b: Vector) => Vector;
+export declare const rotateRadians: (v: Vector, angle: number) => Vector;
+export declare const divScalar: (v: Vector, s: number) => Vector;
+export declare const dot: (a: Vector, b: Vector) => number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linkurious/ogma-annotations",
-  "version": "1.1.13",
+  "version": "1.1.15",
   "description": "Headless annotation plugin for Ogma",
   "main": "dist/index.mjs",
   "module": "dist/index.mjs",
@@ -29,7 +29,7 @@
   "scripts": {
     "prepare": "playwright install",
     "start": "npm run dev",
-    "dev": "vite -c web/vite.config.ts",
+    "dev": "vite -c web/vite.config.mts",
     "build:demo": "vite build -c web/vite.config.mts",
     "prebuild": "rm -rf dist",
     "bump:patch": "bump2version patch && npm version --no-git-tag-version patch",
@@ -42,6 +42,7 @@
     "preview": "vite preview",
     "docs:build": "typedoc --plugin typedoc-plugin-markdown --out ../../docs/api src/index.ts",
     "postdocs:build": "npm run build:demo",
+    "test": "npm run test:unit",
     "test:unit": "vitest run -c test/unit/vitest.config.mts",
     "test:watch": "vitest watch -c test/unit/vitest.config.mts",
     "test:e2e": "vitest run -c test/e2e/vitest.config.mts",
@@ -69,13 +70,11 @@
   },
   "dependencies": {
     "@borgar/textbox": "1.6.0",
-    "eventemitter3": "5.0.1",
-    "vector2js": "2.0.1"
+    "eventemitter3": "5.0.1"
   },
   "devDependencies": {
     "@linkurious/eslint-config-ogma": "^1.0.9",
     "@types/geojson": "7946.0.13",
-    "@types/vector2js": "2.0.2",
     "canvas": "2.11.2",
     "eslint": "8.56.0",
     "get-port": "7.0.0",