@annotorious/annotorious 3.7.14-beta → 3.7.15

package/dist/model/w3c/W3CImageAnnotation.d.ts

@@ -2,7 +2,7 @@ import { W3CAnnotation, W3CAnnotationTarget } from '@annotorious/core';
 import { FragmentSelector } from './fragment';
 import { SVGSelector } from './svg';
 export interface W3CImageAnnotation extends W3CAnnotation {
-    target: W3CImageAnnotationTarget | W3CImageAnnotationTarget[];
+    target: W3CImageAnnotationTarget | W3CImageAnnotationTarget[] | string;
 }
 export interface W3CImageAnnotationTarget extends W3CAnnotationTarget {
     selector: W3CImageSelector | W3CImageSelector[];

package/dist/model/w3c/fragment/FragmentSelector.d.ts

@@ -4,5 +4,6 @@ export interface FragmentSelector {
     conformsTo: 'http://www.w3.org/TR/media-frags/';
     value: string;
 }
+export declare const isFragmentSelector: (selector: any) => boolean;
 export declare const parseFragmentSelector: (fragmentOrSelector: FragmentSelector | string, invertY?: boolean) => Rectangle;
 export declare const serializeFragmentSelector: (geometry: RectangleGeometry) => FragmentSelector;

package/package.json

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

package/src/model/w3c/W3CImageAnnotation.ts

@@ -4,7 +4,7 @@ import type { SVGSelector } from './svg';
 
 export interface W3CImageAnnotation extends W3CAnnotation {
 
-  target: W3CImageAnnotationTarget | W3CImageAnnotationTarget[];
+  target: W3CImageAnnotationTarget | W3CImageAnnotationTarget[] | string;
 
 }
 

package/src/model/w3c/W3CImageFormatAdapter.ts

@@ -4,7 +4,7 @@ import type { FormatAdapter, ParseResult, W3CAnnotation } from '@annotorious/cor
 import { ShapeType } from '../core';
 import type { ImageAnnotation, RectangleGeometry } from '../core';
 import type {FragmentSelector } from './fragment';
-import { parseFragmentSelector, serializeFragmentSelector } from './fragment';
+import { isFragmentSelector, parseFragmentSelector, serializeFragmentSelector } from './fragment';
 import type { SVGSelector } from './svg';
 import { parseSVGSelector, serializeSVGSelector } from './svg';
 import type { W3CImageAnnotation } from './W3CImageAnnotation';
@@ -58,7 +58,7 @@ export const parseW3CImageAnnotation = (
         ? w3cTarget.selector[0] : w3cTarget.selector;
 
   const selector = 
-    typeof w3cSelector === 'string' || w3cSelector?.type === 'FragmentSelector' ?
+    isFragmentSelector(w3cSelector) ?
       parseFragmentSelector(w3cSelector as FragmentSelector, opts.invertY) :
     w3cSelector?.type === 'SvgSelector' ?
       parseSVGSelector(w3cSelector as SVGSelector) : undefined;
@@ -133,7 +133,7 @@ export const serializeW3CImageAnnotation = (
   // Remove core properties that should not appear in the W3C annotation
   delete serialized.bodies;
   
-  if ('annotation' in serialized.target)
+  if (typeof serialized.target !== 'string' && 'annotation' in serialized.target)
     delete serialized.target.annotation;
 
   return serialized;

package/src/model/w3c/fragment/FragmentSelector.ts

@@ -11,6 +11,23 @@ export interface FragmentSelector {
 
 }
 
+export const isFragmentSelector = (
+  selector: any
+): boolean => {
+  if (selector?.type === 'FragmentSelector')
+    return true;
+
+  if (typeof selector === 'string') {
+    const hashIndex = selector.indexOf("#");
+    if (hashIndex < 0) return false;
+
+    const xywh = /^#xywh(?:=(?:pixel:|percent:)?)\s*\d+(\.\d*)?,\s*\d+(\.\d*)?,\s*\d+(\.\d*)?,\s*\d+(\.\d*)?$/i;
+    return xywh.test(selector);
+  }
+
+  return false;
+}
+
 export const parseFragmentSelector = (
   fragmentOrSelector: FragmentSelector | string,
   invertY = false
@@ -21,6 +38,9 @@ export const parseFragmentSelector = (
   const regex = /(xywh)=(pixel|percent)?:?(.+?),(.+?),(.+?),(.+)*/g;
 
   const matches = [...fragment.matchAll(regex)][0];
+
+  if (!matches) throw new Error('Not a MediaFragment: ' + fragment);
+
   const [_, prefix, unit, a, b, c, d] = matches;
 
   if (prefix !== 'xywh') throw new Error('Unsupported MediaFragment: ' + fragment);