@annotorious/react 3.0.14 → 3.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ImageAnnotationPopup.d.ts +2 -0
- package/dist/ImageAnnotationPopup.d.ts.map +1 -1
- package/dist/annotorious-react.es4.js +19 -18
- package/dist/annotorious-react.es4.js.map +1 -1
- package/dist/annotorious-react.es8.js +13 -12
- package/dist/annotorious-react.es8.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/openseadragon/OpenSeadragonAnnotator.d.ts.map +1 -1
- package/dist/utils/toClientRects.d.ts.map +1 -1
- package/package.json +6 -6
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
+
import { FloatingArrowProps } from '@floating-ui/react';
|
|
2
3
|
import { PopupProps } from './PopupProps';
|
|
3
4
|
interface ImageAnnotationPopupProps {
|
|
4
5
|
arrow?: boolean;
|
|
6
|
+
arrowProps?: Omit<FloatingArrowProps, 'context' | 'ref'>;
|
|
5
7
|
popup: (props: PopupProps) => ReactNode;
|
|
6
8
|
}
|
|
7
9
|
export declare const ImageAnnotationPopup: (props: ImageAnnotationPopupProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageAnnotationPopup.d.ts","sourceRoot":"","sources":["../src/ImageAnnotationPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ImageAnnotationPopup.d.ts","sourceRoot":"","sources":["../src/ImageAnnotationPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAG/D,OAAO,EASL,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAsB1C,UAAU,yBAAyB;IAEjC,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,UAAU,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,KAAK,CAAC,CAAC;IAEzD,KAAK,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,SAAS,CAAC;CAEzC;AAED,eAAO,MAAM,oBAAoB,UAAW,yBAAyB,4CAkHpE,CAAA"}
|
|
@@ -3,53 +3,53 @@ import { useState as E, useRef as C, useEffect as A } from "react";
|
|
|
3
3
|
import { useFloating as D, FloatingArrow as O } from "./annotorious-react.es13.js";
|
|
4
4
|
import { useAnnotator as j, useSelection as L } from "./annotorious-react.es2.js";
|
|
5
5
|
import { toClientRects as S } from "./annotorious-react.es14.js";
|
|
6
|
-
import { inline as U, offset as F, flip as M, shift as
|
|
7
|
-
import { autoUpdate as
|
|
6
|
+
import { inline as U, offset as F, flip as M, shift as P, arrow as b } from "./annotorious-react.es15.js";
|
|
7
|
+
import { autoUpdate as k } from "./annotorious-react.es16.js";
|
|
8
8
|
import w from "./annotorious-react.es17.js";
|
|
9
|
-
const
|
|
10
|
-
const n = t.querySelector("img"), { left:
|
|
9
|
+
const z = (i, t) => {
|
|
10
|
+
const n = t.querySelector("img"), { left: a, top: d } = n.getBoundingClientRect(), s = n.offsetWidth / n.naturalWidth, c = n.offsetHeight / n.naturalHeight, { minX: o, minY: l, maxX: p, maxY: u } = i.bounds;
|
|
11
11
|
return new DOMRect(
|
|
12
|
-
|
|
12
|
+
a + s * o,
|
|
13
13
|
d + c * l,
|
|
14
14
|
s * (p - o),
|
|
15
15
|
c * (u - l)
|
|
16
16
|
);
|
|
17
|
-
}, K = (
|
|
17
|
+
}, K = (i) => {
|
|
18
18
|
var m, f;
|
|
19
|
-
const t = j(), [n,
|
|
19
|
+
const t = j(), [n, a] = E(!1), d = C(null), { selected: s, event: c } = L(), o = (m = s[0]) == null ? void 0 : m.annotation, l = (f = s[0]) == null ? void 0 : f.editable, { refs: p, floatingStyles: u, context: h, update: H } = D({
|
|
20
20
|
open: n,
|
|
21
|
-
onOpenChange:
|
|
21
|
+
onOpenChange: a,
|
|
22
22
|
middleware: [
|
|
23
23
|
U(),
|
|
24
24
|
F(10),
|
|
25
25
|
M({ crossAxis: !0 }),
|
|
26
|
-
|
|
26
|
+
P({
|
|
27
27
|
crossAxis: !0,
|
|
28
28
|
padding: { right: 5, left: 5, top: 10, bottom: 10 }
|
|
29
29
|
}),
|
|
30
|
-
|
|
30
|
+
b({
|
|
31
31
|
element: d,
|
|
32
32
|
padding: 5
|
|
33
33
|
})
|
|
34
34
|
],
|
|
35
|
-
whileElementsMounted:
|
|
35
|
+
whileElementsMounted: k
|
|
36
36
|
});
|
|
37
37
|
A(() => {
|
|
38
38
|
if (s.length === 0)
|
|
39
|
-
|
|
39
|
+
a(!1);
|
|
40
40
|
else {
|
|
41
41
|
const e = () => {
|
|
42
|
-
const r =
|
|
42
|
+
const r = z(o.target.selector.geometry, t.element);
|
|
43
43
|
p.setReference({
|
|
44
44
|
getBoundingClientRect: () => r,
|
|
45
45
|
getClientRects: () => S(r)
|
|
46
46
|
});
|
|
47
47
|
};
|
|
48
|
-
return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), e(),
|
|
48
|
+
return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), e(), a(!0), () => {
|
|
49
49
|
window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e);
|
|
50
50
|
};
|
|
51
51
|
}
|
|
52
|
-
}, [t,
|
|
52
|
+
}, [t, i.popup, s]);
|
|
53
53
|
const x = (e) => {
|
|
54
54
|
const r = e.id || w();
|
|
55
55
|
t.state.store.addBody({
|
|
@@ -78,14 +78,15 @@ const H = (a, t) => {
|
|
|
78
78
|
ref: p.setFloating,
|
|
79
79
|
style: u,
|
|
80
80
|
children: [
|
|
81
|
-
/* @__PURE__ */ g.jsx(
|
|
81
|
+
i.arrow && /* @__PURE__ */ g.jsx(
|
|
82
82
|
O,
|
|
83
83
|
{
|
|
84
84
|
ref: d,
|
|
85
|
-
context: h
|
|
85
|
+
context: h,
|
|
86
|
+
...i.arrowProps || {}
|
|
86
87
|
}
|
|
87
88
|
),
|
|
88
|
-
|
|
89
|
+
i.popup({
|
|
89
90
|
annotation: o,
|
|
90
91
|
editable: l,
|
|
91
92
|
event: c,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"annotorious-react.es4.js","sources":["../src/ImageAnnotationPopup.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport { AnnotationBody, Geometry } from '@annotorious/annotorious';\nimport {\n useFloating,\n arrow,\n shift,\n inline,\n autoUpdate,\n flip,\n offset,\n FloatingArrow\n} from '@floating-ui/react';\nimport { useAnnotator, useSelection } from './Annotorious';\nimport { PopupProps } from './PopupProps';\nimport { toClientRects } from './utils/toClientRects';\nimport { ImageAnnotator } from '@annotorious/openseadragon';\n\nconst toDOMRect = (geometry: Geometry, container: HTMLDivElement) => {\n const img = container.querySelector('img');\n\n const { left, top } = img.getBoundingClientRect();\n\n const kx = img.offsetWidth / img.naturalWidth;\n const ky = img.offsetHeight / img.naturalHeight;\n\n const { minX, minY, maxX, maxY } = geometry.bounds;\n\n return new DOMRect(\n left + kx * minX,\n top + ky * minY,\n kx * (maxX - minX),\n ky * (maxY - minY)\n );\n}\n\ninterface ImageAnnotationPopupProps {\n\n arrow?: boolean;\n\n popup: (props: PopupProps) => ReactNode;\n\n}\n\nexport const ImageAnnotationPopup = (props: ImageAnnotationPopupProps) => {\n\n const anno = useAnnotator<ImageAnnotator>();\n\n const [isOpen, setIsOpen] = useState(false);\n\n const arrowRef = useRef(null);\n\n const { selected, event } = useSelection();\n\n const annotation = selected[0]?.annotation;\n\n const editable = selected[0]?.editable;\n\n const { refs, floatingStyles, context, update } = useFloating({\n open: isOpen,\n onOpenChange: setIsOpen,\n middleware: [\n inline(), \n offset(10),\n flip({ crossAxis: true }),\n shift({ \n crossAxis: true,\n padding: { right: 5, left: 5, top: 10, bottom: 10 }\n }),\n arrow({\n element: arrowRef,\n padding: 5\n })\n ],\n whileElementsMounted: autoUpdate\n });\n\n useEffect(() => {\n if (selected.length === 0) {\n setIsOpen(false);\n } else {\n const setPosition = () => { \n const rect = toDOMRect(annotation.target.selector.geometry, anno.element);\n\n refs.setReference({\n getBoundingClientRect: () => rect,\n getClientRects: () => toClientRects(rect)\n });\n }\n\n window.addEventListener('scroll', setPosition, true);\n window.addEventListener('resize', setPosition);\n\n setPosition();\n\n setIsOpen(true);\n\n return () => {\n window.removeEventListener('scroll', setPosition, true);\n window.removeEventListener('resize', setPosition);\n };\n }\n }, [anno, props.popup, selected]);\n\n const onCreateBody = (body: Partial<AnnotationBody>) => {\n const id = body.id || uuidv4();\n \n anno.state.store.addBody({\n ...body,\n id,\n annotation: annotation.id,\n created: body.created || new Date(),\n creator: anno.getUser()\n });\n }\n\n const onDeleteBody = (id: string) => {\n anno.state.store.deleteBody({ id, annotation: annotation.id });\n }\n\n const onUpdateBody = (current: AnnotationBody, next: AnnotationBody) => {\n const id = next.id || uuidv4();\n\n const updated: AnnotationBody = {\n updated: new Date(),\n updatedBy: anno.getUser(),\n ...next,\n id,\n annotation: annotation.id\n }\n\n anno.state.store.updateBody(current, updated);\n }\n\n return (isOpen && annotation) ? (\n <div\n className=\"a9s-popup a9s-image-popup\"\n ref={refs.setFloating}\n style={floatingStyles}>\n\n <FloatingArrow \n
|
|
1
|
+
{"version":3,"file":"annotorious-react.es4.js","sources":["../src/ImageAnnotationPopup.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport { AnnotationBody, Geometry } from '@annotorious/annotorious';\nimport {\n useFloating,\n arrow,\n shift,\n inline,\n autoUpdate,\n flip,\n offset,\n FloatingArrow,\n FloatingArrowProps\n} from '@floating-ui/react';\nimport { useAnnotator, useSelection } from './Annotorious';\nimport { PopupProps } from './PopupProps';\nimport { toClientRects } from './utils/toClientRects';\nimport { ImageAnnotator } from '@annotorious/openseadragon';\n\nconst toDOMRect = (geometry: Geometry, container: HTMLDivElement) => {\n const img = container.querySelector('img');\n\n const { left, top } = img.getBoundingClientRect();\n\n const kx = img.offsetWidth / img.naturalWidth;\n const ky = img.offsetHeight / img.naturalHeight;\n\n const { minX, minY, maxX, maxY } = geometry.bounds;\n\n return new DOMRect(\n left + kx * minX,\n top + ky * minY,\n kx * (maxX - minX),\n ky * (maxY - minY)\n );\n}\n\ninterface ImageAnnotationPopupProps {\n\n arrow?: boolean;\n\n arrowProps?: Omit<FloatingArrowProps, 'context' | 'ref'>;\n\n popup: (props: PopupProps) => ReactNode;\n\n}\n\nexport const ImageAnnotationPopup = (props: ImageAnnotationPopupProps) => {\n\n const anno = useAnnotator<ImageAnnotator>();\n\n const [isOpen, setIsOpen] = useState(false);\n\n const arrowRef = useRef(null);\n\n const { selected, event } = useSelection();\n\n const annotation = selected[0]?.annotation;\n\n const editable = selected[0]?.editable;\n\n const { refs, floatingStyles, context, update } = useFloating({\n open: isOpen,\n onOpenChange: setIsOpen,\n middleware: [\n inline(), \n offset(10),\n flip({ crossAxis: true }),\n shift({ \n crossAxis: true,\n padding: { right: 5, left: 5, top: 10, bottom: 10 }\n }),\n arrow({\n element: arrowRef,\n padding: 5\n })\n ],\n whileElementsMounted: autoUpdate\n });\n\n useEffect(() => {\n if (selected.length === 0) {\n setIsOpen(false);\n } else {\n const setPosition = () => { \n const rect = toDOMRect(annotation.target.selector.geometry, anno.element);\n\n refs.setReference({\n getBoundingClientRect: () => rect,\n getClientRects: () => toClientRects(rect)\n });\n }\n\n window.addEventListener('scroll', setPosition, true);\n window.addEventListener('resize', setPosition);\n\n setPosition();\n\n setIsOpen(true);\n\n return () => {\n window.removeEventListener('scroll', setPosition, true);\n window.removeEventListener('resize', setPosition);\n };\n }\n }, [anno, props.popup, selected]);\n\n const onCreateBody = (body: Partial<AnnotationBody>) => {\n const id = body.id || uuidv4();\n \n anno.state.store.addBody({\n ...body,\n id,\n annotation: annotation.id,\n created: body.created || new Date(),\n creator: anno.getUser()\n });\n }\n\n const onDeleteBody = (id: string) => {\n anno.state.store.deleteBody({ id, annotation: annotation.id });\n }\n\n const onUpdateBody = (current: AnnotationBody, next: AnnotationBody) => {\n const id = next.id || uuidv4();\n\n const updated: AnnotationBody = {\n updated: new Date(),\n updatedBy: anno.getUser(),\n ...next,\n id,\n annotation: annotation.id\n }\n\n anno.state.store.updateBody(current, updated);\n }\n\n return (isOpen && annotation) ? (\n <div\n className=\"a9s-popup a9s-image-popup\"\n ref={refs.setFloating}\n style={floatingStyles}>\n\n {props.arrow && (\n <FloatingArrow \n ref={arrowRef} \n context={context} \n {...(props.arrowProps || {})} />\n )}\n\n {props.popup({ \n annotation, \n editable, \n event,\n onCreateBody,\n onDeleteBody,\n onUpdateBody\n })}\n </div>\n ) : null;\n\n}\n"],"names":["toDOMRect","geometry","container","img","left","top","kx","ky","minX","minY","maxX","maxY","ImageAnnotationPopup","props","anno","useAnnotator","isOpen","setIsOpen","useState","arrowRef","useRef","selected","event","useSelection","annotation","_a","editable","_b","refs","floatingStyles","context","update","useFloating","inline","offset","flip","shift","arrow","autoUpdate","useEffect","setPosition","rect","toClientRects","onCreateBody","body","id","uuidv4","onDeleteBody","onUpdateBody","current","next","updated","jsxs","jsx","FloatingArrow"],"mappings":"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"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { j as f } from "./annotorious-react.es11.js";
|
|
2
|
-
import { createContext as
|
|
3
|
-
import {
|
|
2
|
+
import { createContext as d, useState as m, useContext as s, useEffect as n } from "react";
|
|
3
|
+
import { createAnonymousGuest as S } from "@annotorious/core";
|
|
4
|
+
import { createOSDAnnotator as A } from "@annotorious/openseadragon";
|
|
4
5
|
import { AnnotoriousContext as w } from "./annotorious-react.es2.js";
|
|
5
|
-
const
|
|
6
|
-
const { children: x, tool: r, ...c } = t, [o,
|
|
6
|
+
const a = d({ viewer: null, setViewer: null }), b = (t) => {
|
|
7
|
+
const { children: x, tool: r, ...c } = t, [o, u] = m(), { anno: e, setAnno: i } = s(w);
|
|
7
8
|
return n(() => {
|
|
8
9
|
if (o != null && o.element) {
|
|
9
|
-
const l =
|
|
10
|
+
const l = A(o, c);
|
|
10
11
|
return i(l), () => {
|
|
11
12
|
l.destroy(), i(void 0);
|
|
12
13
|
};
|
|
@@ -22,17 +23,17 @@ const s = u({ viewer: null, setViewer: null }), y = (t) => {
|
|
|
22
23
|
}, [e, r]), n(() => {
|
|
23
24
|
e && e.setModalSelect(t.modalSelect);
|
|
24
25
|
}, [e, t.modalSelect]), n(() => {
|
|
25
|
-
e && e.setUser(t.user);
|
|
26
|
+
e && (t.user ? e.setUser(t.user) : e.setUser(S()));
|
|
26
27
|
}, [e, t.user]), n(() => {
|
|
27
28
|
e && e.setUserSelectAction(t.userSelectAction);
|
|
28
|
-
}, [e, t.userSelectAction]), /* @__PURE__ */ f.jsx(
|
|
29
|
-
},
|
|
30
|
-
const { viewer: t } = a
|
|
29
|
+
}, [e, t.userSelectAction]), /* @__PURE__ */ f.jsx(a.Provider, { value: { viewer: o, setViewer: u }, children: t.children });
|
|
30
|
+
}, h = () => {
|
|
31
|
+
const { viewer: t } = s(a);
|
|
31
32
|
return t;
|
|
32
33
|
};
|
|
33
34
|
export {
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
35
|
+
b as OpenSeadragonAnnotator,
|
|
36
|
+
a as OpenSeadragonAnnotatorContext,
|
|
37
|
+
h as useViewer
|
|
37
38
|
};
|
|
38
39
|
//# sourceMappingURL=annotorious-react.es8.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"annotorious-react.es8.js","sources":["../src/openseadragon/OpenSeadragonAnnotator.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext, useEffect, useState } from 'react';\nimport OpenSeadragon from 'openseadragon';\nimport { createOSDAnnotator } from '@annotorious/openseadragon';\nimport { Annotation, AnnotoriousOpts, DrawingStyle, Filter, User} from '@annotorious/annotorious';\nimport { AnnotoriousContext } from '../Annotorious';\n\nexport const OpenSeadragonAnnotatorContext = createContext<{ \n viewer: OpenSeadragon.Viewer,\n setViewer(viewer: OpenSeadragon.Viewer): void\n}>({ viewer: null, setViewer: null });\n\nexport type OpenSeadragonAnnotatorProps<I extends Annotation, E extends unknown> = AnnotoriousOpts<I, E> & {\n\n children?: ReactNode;\n\n filter?: Filter<I>;\n\n style?: DrawingStyle | ((annotation: I) => DrawingStyle);\n\n tool?: string | null;\n\n user?: User;\n\n}\n\nexport const OpenSeadragonAnnotator = <I extends Annotation, E extends unknown>(props: OpenSeadragonAnnotatorProps<I, E>) => {\n\n const { children, tool, ...opts } = props;\n\n const [viewer, setViewer] = useState<OpenSeadragon.Viewer>();\n\n const { anno, setAnno } = useContext(AnnotoriousContext);\n\n useEffect(() => {\n if (viewer?.element) {\n const anno = createOSDAnnotator<I, E>(viewer, opts as AnnotoriousOpts<I, E>);\n setAnno(anno);\n\n return () => {\n anno.destroy();\n setAnno(undefined);\n }\n }\n }, [viewer]);\n\n useEffect(() => {\n if (anno) anno.setDrawingEnabled(props.drawingEnabled);\n }, [anno, props.drawingEnabled]);\n\n useEffect(() => {\n if (anno) anno.setFilter(props.filter);\n }, [anno, props.filter]);\n\n useEffect(() => {\n if (anno) anno.setStyle(props.style);\n }, [anno, props.style]);\n\n useEffect(() => {\n if (anno) anno.setDrawingTool(tool);\n }, [anno, tool]);\n\n useEffect(() => {\n if (anno) anno.setModalSelect(props.modalSelect);\n }, [anno, props.modalSelect]);\n\n useEffect(() => {\n if (anno) anno.setUser(props.user);\n }, [anno, props.user]);\n\n useEffect(() => {\n if (anno) anno.setUserSelectAction(props.userSelectAction);\n }, [anno, props.userSelectAction]);\n\n return (\n <OpenSeadragonAnnotatorContext.Provider value={{ viewer, setViewer }}>\n {props.children}\n </OpenSeadragonAnnotatorContext.Provider>\n )\n\n}\n\nexport const useViewer = () => {\n const { viewer } = useContext(OpenSeadragonAnnotatorContext);\n return viewer;\n}"],"names":["OpenSeadragonAnnotatorContext","createContext","OpenSeadragonAnnotator","props","children","tool","opts","viewer","setViewer","useState","anno","setAnno","useContext","AnnotoriousContext","useEffect","createOSDAnnotator","jsx","useViewer"],"mappings":"
|
|
1
|
+
{"version":3,"file":"annotorious-react.es8.js","sources":["../src/openseadragon/OpenSeadragonAnnotator.tsx"],"sourcesContent":["import { createContext, MutableRefObject, ReactNode, useContext, useEffect, useState } from 'react';\nimport OpenSeadragon from 'openseadragon';\nimport { createAnonymousGuest } from '@annotorious/core';\nimport { createOSDAnnotator } from '@annotorious/openseadragon';\nimport { Annotation, AnnotoriousOpts, DrawingStyle, Filter, User} from '@annotorious/annotorious';\nimport { AnnotoriousContext } from '../Annotorious';\nimport { AnnotoriousOpenSeadragonAnnotator } from '.';\n\nexport const OpenSeadragonAnnotatorContext = createContext<{ \n viewer: OpenSeadragon.Viewer,\n setViewer(viewer: OpenSeadragon.Viewer): void\n}>({ viewer: null, setViewer: null });\n\nexport type OpenSeadragonAnnotatorProps<I extends Annotation, E extends unknown> = AnnotoriousOpts<I, E> & {\n\n children?: ReactNode;\n\n filter?: Filter<I>;\n\n style?: DrawingStyle | ((annotation: I) => DrawingStyle);\n\n tool?: string | null;\n\n user?: User;\n\n}\n\nexport const OpenSeadragonAnnotator = <I extends Annotation, E extends unknown>(props: OpenSeadragonAnnotatorProps<I, E>) => {\n\n const { children, tool, ...opts } = props;\n\n const [viewer, setViewer] = useState<OpenSeadragon.Viewer>();\n\n const { anno, setAnno } = useContext(AnnotoriousContext);\n\n useEffect(() => {\n if (viewer?.element) {\n const anno = createOSDAnnotator<I, E>(viewer, opts as AnnotoriousOpts<I, E>);\n setAnno(anno);\n\n return () => {\n anno.destroy();\n setAnno(undefined);\n }\n }\n }, [viewer]);\n\n useEffect(() => {\n if (anno) anno.setDrawingEnabled(props.drawingEnabled);\n }, [anno, props.drawingEnabled]);\n\n useEffect(() => {\n if (anno) anno.setFilter(props.filter);\n }, [anno, props.filter]);\n\n useEffect(() => {\n if (anno) anno.setStyle(props.style);\n }, [anno, props.style]);\n\n useEffect(() => {\n if (anno) anno.setDrawingTool(tool);\n }, [anno, tool]);\n\n useEffect(() => {\n if (anno) anno.setModalSelect(props.modalSelect);\n }, [anno, props.modalSelect]);\n\n useEffect(() => {\n if (!anno) return;\n \n if (props.user)\n anno.setUser(props.user);\n else \n anno.setUser(createAnonymousGuest());\n }, [anno, props.user]);\n\n useEffect(() => {\n if (anno) anno.setUserSelectAction(props.userSelectAction);\n }, [anno, props.userSelectAction]);\n\n return (\n <OpenSeadragonAnnotatorContext.Provider value={{ viewer, setViewer }}>\n {props.children}\n </OpenSeadragonAnnotatorContext.Provider>\n )\n\n}\n\nexport const useViewer = () => {\n const { viewer } = useContext(OpenSeadragonAnnotatorContext);\n return viewer;\n}"],"names":["OpenSeadragonAnnotatorContext","createContext","OpenSeadragonAnnotator","props","children","tool","opts","viewer","setViewer","useState","anno","setAnno","useContext","AnnotoriousContext","useEffect","createOSDAnnotator","createAnonymousGuest","jsx","useViewer"],"mappings":";;;;;AAQO,MAAMA,IAAgCC,EAG1C,EAAE,QAAQ,MAAM,WAAW,KAAM,CAAA,GAgBvBC,IAAyB,CAA0CC,MAA6C;AAE3H,QAAM,EAAE,UAAAC,GAAU,MAAAC,GAAM,GAAGC,EAAS,IAAAH,GAE9B,CAACI,GAAQC,CAAS,IAAIC,EAA+B,GAErD,EAAE,MAAAC,GAAM,SAAAC,MAAYC,EAAWC,CAAkB;AAEvD,SAAAC,EAAU,MAAM;AACd,QAAIP,KAAA,QAAAA,EAAQ,SAAS;AACbG,YAAAA,IAAOK,EAAyBR,GAAQD,CAA6B;AAC3E,aAAAK,EAAQD,CAAI,GAEL,MAAM;AACXA,QAAAA,EAAK,QAAQ,GACbC,EAAQ,MAAS;AAAA,MACnB;AAAA,IAAA;AAAA,EACF,GACC,CAACJ,CAAM,CAAC,GAEXO,EAAU,MAAM;AACd,IAAIJ,KAAMA,EAAK,kBAAkBP,EAAM,cAAc;AAAA,EACpD,GAAA,CAACO,GAAMP,EAAM,cAAc,CAAC,GAE/BW,EAAU,MAAM;AACd,IAAIJ,KAAMA,EAAK,UAAUP,EAAM,MAAM;AAAA,EACpC,GAAA,CAACO,GAAMP,EAAM,MAAM,CAAC,GAEvBW,EAAU,MAAM;AACd,IAAIJ,KAAMA,EAAK,SAASP,EAAM,KAAK;AAAA,EAClC,GAAA,CAACO,GAAMP,EAAM,KAAK,CAAC,GAEtBW,EAAU,MAAM;AACV,IAAAJ,KAAWA,EAAA,eAAeL,CAAI;AAAA,EAAA,GACjC,CAACK,GAAML,CAAI,CAAC,GAEfS,EAAU,MAAM;AACd,IAAIJ,KAAMA,EAAK,eAAeP,EAAM,WAAW;AAAA,EAC9C,GAAA,CAACO,GAAMP,EAAM,WAAW,CAAC,GAE5BW,EAAU,MAAM;AACd,IAAKJ,MAEDP,EAAM,OACHO,EAAA,QAAQP,EAAM,IAAI,IAElBO,EAAA,QAAQM,GAAsB;AAAA,EACpC,GAAA,CAACN,GAAMP,EAAM,IAAI,CAAC,GAErBW,EAAU,MAAM;AACd,IAAIJ,KAAMA,EAAK,oBAAoBP,EAAM,gBAAgB;AAAA,EACxD,GAAA,CAACO,GAAMP,EAAM,gBAAgB,CAAC,GAG/Bc,gBAAAA,MAACjB,EAA8B,UAA9B,EAAuC,OAAO,EAAE,QAAAO,GAAQ,WAAAC,KACtD,UAAAL,EAAM,SACT,CAAA;AAGJ,GAEae,IAAY,MAAM;AAC7B,QAAM,EAAE,QAAAX,EAAA,IAAWK,EAAWZ,CAA6B;AACpD,SAAAO;AACT;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -6,7 +6,7 @@ export * from './PopupProps';
|
|
|
6
6
|
export * from './openseadragon';
|
|
7
7
|
export type { Annotation, AnnotationBody, AnnotationState, AnnotationTarget, Annotator, AnnotatorState, Appearance, AppearanceProvider, Color, DrawingStyle, DrawingStyleExpression, Filter, FormatAdapter, HoverState, LifecycleEvents, ParseResult, PresentUser, Selection, SelectionState, Store, StoreChangeEvent, StoreObserver, User, W3CAnnotation, W3CAnnotationBody, W3CAnnotationTarget } from '@annotorious/core';
|
|
8
8
|
export { createAnonymousGuest, createBody, defaultColorProvider, Origin, UserSelectAction } from '@annotorious/core';
|
|
9
|
-
export type { AnnotoriousOpts, DrawingMode, DrawingTool, FragmentSelector, ImageAnnotator as AnnotoriousImageAnnotator, ImageAnnotation, ImageAnnotatorState, Polygon, PolygonGeometry, Rectangle, RectangleGeometry, Shape, SVGSelector, W3CImageAnnotation, W3CImageAnnotationTarget, W3CImageFormatAdapter, W3CImageFormatAdapterOpts } from '@annotorious/annotorious';
|
|
9
|
+
export type { AnnotoriousOpts, DrawingMode, DrawingTool, FragmentSelector, ImageAnnotator as AnnotoriousImageAnnotator, ImageAnnotation, ImageAnnotationTarget, ImageAnnotatorState, Polygon, PolygonGeometry, Rectangle, RectangleGeometry, Shape, SVGSelector, W3CImageAnnotation, W3CImageAnnotationTarget, W3CImageFormatAdapter, W3CImageFormatAdapterOpts } from '@annotorious/annotorious';
|
|
10
10
|
export { chainStyles, computeStyle, createImageAnnotator, ShapeType, W3CImageFormat } from '@annotorious/annotorious';
|
|
11
11
|
export type { OpenSeadragonAnnotator as AnnotoriousOpenSeadragonAnnotator } from '@annotorious/openseadragon';
|
|
12
12
|
export type { Viewer } from 'openseadragon';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAE7B,cAAc,iBAAiB,CAAC;AAGhC,OAAO,0CAA0C,CAAC;AAClD,OAAO,0DAA0D,CAAC;AAGlE,YAAY,EACV,UAAU,EACV,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,SAAS,EACT,cAAc,EACd,UAAU,EACV,kBAAkB,EAClB,KAAK,EACL,YAAY,EACZ,sBAAsB,EACtB,MAAM,EACN,aAAa,EACb,UAAU,EACV,eAAe,EACf,WAAW,EACX,WAAW,EACX,SAAS,EACT,cAAc,EACd,KAAK,EACL,gBAAgB,EAChB,aAAa,EACb,IAAI,EACJ,aAAa,EACb,iBAAiB,EACjB,mBAAmB,EACpB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EACL,oBAAoB,EACpB,UAAU,EACV,oBAAoB,EACpB,MAAM,EACN,gBAAgB,EACjB,MAAM,mBAAmB,CAAC;AAG3B,YAAY,EACV,eAAe,EACf,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,cAAc,IAAI,yBAAyB,EAC3C,eAAe,EACf,mBAAmB,EACnB,OAAO,EACP,eAAe,EACf,SAAS,EACT,iBAAiB,EACjB,KAAK,EACL,WAAW,EACX,kBAAkB,EAClB,wBAAwB,EACxB,qBAAqB,EACrB,yBAAyB,EAC1B,MAAM,0BAA0B,CAAC;AAElC,OAAO,EACL,WAAW,EACX,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,cAAc,EACf,MAAM,0BAA0B,CAAC;AAGlC,YAAY,EACV,sBAAsB,IAAI,iCAAiC,EAC5D,MAAM,4BAA4B,CAAC;AAEpC,YAAY,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAE7B,cAAc,iBAAiB,CAAC;AAGhC,OAAO,0CAA0C,CAAC;AAClD,OAAO,0DAA0D,CAAC;AAGlE,YAAY,EACV,UAAU,EACV,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,SAAS,EACT,cAAc,EACd,UAAU,EACV,kBAAkB,EAClB,KAAK,EACL,YAAY,EACZ,sBAAsB,EACtB,MAAM,EACN,aAAa,EACb,UAAU,EACV,eAAe,EACf,WAAW,EACX,WAAW,EACX,SAAS,EACT,cAAc,EACd,KAAK,EACL,gBAAgB,EAChB,aAAa,EACb,IAAI,EACJ,aAAa,EACb,iBAAiB,EACjB,mBAAmB,EACpB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EACL,oBAAoB,EACpB,UAAU,EACV,oBAAoB,EACpB,MAAM,EACN,gBAAgB,EACjB,MAAM,mBAAmB,CAAC;AAG3B,YAAY,EACV,eAAe,EACf,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,cAAc,IAAI,yBAAyB,EAC3C,eAAe,EACf,qBAAqB,EACrB,mBAAmB,EACnB,OAAO,EACP,eAAe,EACf,SAAS,EACT,iBAAiB,EACjB,KAAK,EACL,WAAW,EACX,kBAAkB,EAClB,wBAAwB,EACxB,qBAAqB,EACrB,yBAAyB,EAC1B,MAAM,0BAA0B,CAAC;AAElC,OAAO,EACL,WAAW,EACX,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,cAAc,EACf,MAAM,0BAA0B,CAAC;AAGlC,YAAY,EACV,sBAAsB,IAAI,iCAAiC,EAC5D,MAAM,4BAA4B,CAAC;AAEpC,YAAY,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OpenSeadragonAnnotator.d.ts","sourceRoot":"","sources":["../../src/openseadragon/OpenSeadragonAnnotator.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"OpenSeadragonAnnotator.d.ts","sourceRoot":"","sources":["../../src/openseadragon/OpenSeadragonAnnotator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmC,SAAS,EAAmC,MAAM,OAAO,CAAC;AACpG,OAAO,aAAa,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,0BAA0B,CAAC;AAIlG,eAAO,MAAM,6BAA6B;YAChC,aAAa,CAAC,MAAM;sBACV,aAAa,CAAC,MAAM,GAAG,IAAI;EACV,CAAC;AAEtC,MAAM,MAAM,2BAA2B,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,SAAS,OAAO,IAAI,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IAEzG,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;IAEnB,KAAK,CAAC,EAAE,YAAY,GAAG,CAAC,CAAC,UAAU,EAAE,CAAC,KAAK,YAAY,CAAC,CAAC;IAEzD,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB,IAAI,CAAC,EAAE,IAAI,CAAC;CAEb,CAAA;AAED,eAAO,MAAM,sBAAsB,GAAI,CAAC,SAAS,UAAU,EAAE,CAAC,SAAS,OAAO,SAAS,2BAA2B,CAAC,CAAC,EAAE,CAAC,CAAC,4CA2DvH,CAAA;AAED,eAAO,MAAM,SAAS,4BAGrB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toClientRects.d.ts","sourceRoot":"","sources":["../../src/utils/toClientRects.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,aAAa,SAAU,OAAO,
|
|
1
|
+
{"version":3,"file":"toClientRects.d.ts","sourceRoot":"","sources":["../../src/utils/toClientRects.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,aAAa,SAAU,OAAO,KAOtC,WAAY,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@annotorious/react",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.16",
|
|
4
4
|
"description": "Annotorious React bindings",
|
|
5
5
|
"author": "Rainer Simon",
|
|
6
6
|
"license": "BSD-3-Clause",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@types/react": "^18.3.12",
|
|
30
30
|
"@types/react-dom": "^18.3.1",
|
|
31
|
-
"@vitejs/plugin-react": "^4.3.
|
|
32
|
-
"typescript": "5.
|
|
31
|
+
"@vitejs/plugin-react": "^4.3.4",
|
|
32
|
+
"typescript": "5.7.2",
|
|
33
33
|
"vite": "^5.4.11",
|
|
34
34
|
"vite-plugin-dts": "^4.3.0",
|
|
35
35
|
"vite-tsconfig-paths": "^5.1.3"
|
|
@@ -45,9 +45,9 @@
|
|
|
45
45
|
}
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@annotorious/annotorious": "3.0.
|
|
49
|
-
"@annotorious/core": "3.0.
|
|
50
|
-
"@annotorious/openseadragon": "3.0.
|
|
48
|
+
"@annotorious/annotorious": "3.0.16",
|
|
49
|
+
"@annotorious/core": "3.0.16",
|
|
50
|
+
"@annotorious/openseadragon": "3.0.16",
|
|
51
51
|
"@floating-ui/react": "^0.26.28",
|
|
52
52
|
"zustand": "^5.0.1"
|
|
53
53
|
},
|