lost-sia 3.0.0 → 3.1.0

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.
@@ -1 +1 @@
1
- var r=Object.defineProperty;var l=(o,e,s)=>e in o?r(o,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):o[e]=s;var t=(o,e,s)=>l(o,typeof e!="symbol"?e+"":e,s);import h from"../../models/AnnotationMode.js";import m from"../../models/AnnotationStatus.js";class u{constructor(e,s,n,i=h.CREATE,a=m.CREATING,d=""){t(this,"internalId");t(this,"externalId");t(this,"annoTime");t(this,"coordinates");t(this,"labelIds");t(this,"mode");t(this,"selectedNode");t(this,"status");t(this,"type");this.internalId=e,this.externalId=d,this.labelIds=[],this.type=s,this.mode=i,this.status=a,this.coordinates=n,this.selectedNode=1,this.annoTime=0}}export{u as default};
1
+ import a from"../../models/AnnotationMode.js";import d from"../../models/AnnotationStatus.js";class m{internalId;externalId;annoTime;coordinates;labelIds;mode;selectedNode;status;type;constructor(t,e,o,s=a.CREATE,n=d.CREATING,i=""){this.internalId=t,this.externalId=i,this.labelIds=[],this.type=e,this.mode=s,this.status=n,this.coordinates=o,this.selectedNode=1,this.annoTime=0}}export{m as default};
@@ -1 +1 @@
1
- import{jsxs as G,jsx as d}from"react/jsx-runtime";import E from"../../models/AnnotationTool.js";import{getDefaultColor as L}from"../../utils/color.js";import H from"./tools/Point.js";import J from"./tools/Line.js";import K from"./atoms/AnnoBar.js";import Q from"../../models/CanvasAction.js";import X from"./tools/BBox.js";import Y from"./tools/Polygon.js";import{useState as h,useRef as x,useEffect as I}from"react";import e from"../../models/AnnotationMode.js";import Z from"../../utils/TimeUtils.js";const fo=({scaledAnnotation:r,annotationSettings:m,possibleLabels:A,svgScale:i,svgTranslation:f,pageToStageOffset:a,strokeWidth:B,nodeRadius:P,isSelected:c,isDisabled:V=!1,onFinishAnnoCreate:w,onLabelIconClicked:W,onAction:k=(n,l)=>{},onAnnoChanged:b=n=>{},onAnnotationModeChange:F=n=>{},onNotification:O=n=>{}})=>{const[n,l]=h(r.coordinates),[t,M]=h(r.mode),[j,C]=h(!1),R=x(void 0),[_,U]=h();I(()=>{R.current=_},[_]);const N=x(n);I(()=>{N.current=n},[n]);const y=()=>{M(e.VIEW);const o={...r,coordinates:N.current};w(o)},q=o=>A.find(s=>s.id===o),T=(()=>{if(!r.labelIds||r.labelIds.length==0)return L();const o=q(r.labelIds[0]);return(o==null?void 0:o.color)===void 0||o.color===null?L():o.color})(),u={stroke:T,fill:T,strokeWidth:B/i,r:P/i},D=o=>{l(o);let s=o;[e.ADD,e.MOVE].includes(t)&&(s=o.slice(0,-1)),b({...r,coordinates:s})},p=o=>{[e.ADD,e.CREATE,e.MOVE].includes(t)||(M(e.MOVE),U(performance.now())),l(o)},g=()=>{M(e.VIEW);const o=Z.getRoundedDuration(R.current,performance.now()),s=Number.isNaN(r.annoTime)||r.annoTime===null?o:r.annoTime+o;b({...r,coordinates:N.current,annoTime:s})};I(()=>{F(t)},[t]),I(()=>{t===e.CREATE||t===e.ADD||l(r.coordinates)},[r]);const z=()=>{switch(r.type){case E.Point:return d(H,{isSelected:c,annotationSettings:m,coordinates:n[0],pageToStageOffset:a,svgScale:i,svgTranslation:f,style:u,onMoving:o=>p([o]),onMoved:g,onIsDraggingStateChanged:C});case E.Line:return d(J,{annotationSettings:m,coordinates:n,isSelected:c,pageToStageOffset:a,annotationMode:t,svgScale:i,svgTranslation:f,style:u,onAddNode:D,onDeleteNode:D,onMoving:p,onMoved:g,onIsDraggingStateChanged:C,onFinishAnnoCreate:y});case E.BBox:return d(X,{annotationMode:t,annotationSettings:m,startCoords:n[0],endCoords:n[1],isSelected:c,pageToStageOffset:a,style:u,svgScale:i,svgTranslation:f,onDeleteNode:()=>{console.log("TODO")},onIsDraggingStateChanged:C,onFinishAnnoCreate:y,onMoving:p,onMoved:g});case E.Polygon:return d(Y,{annotationSettings:m,coordinates:n,isSelected:c,isDisabled:V,pageToStageOffset:a,annotationMode:t,svgScale:i,svgTranslation:f,style:u,onAddNode:D,onDeleteNode:D,onMoving:p,onMoved:g,onNotification:O,onIsDraggingStateChanged:C,onFinishAnnoCreate:y})}};return G("g",{onClick:o=>{o.stopPropagation(),k(r,Q.ANNO_SELECTED)},children:[!j&&t!==e.CREATE&&d(K,{annotationCoordinates:n,canLabel:m.canLabel,labels:A,color:T,isSelected:c,selectedLabelIds:r.labelIds,style:u,svgScale:i,onLabelIconClicked:W}),z()]})};export{fo as default};
1
+ import{jsxs as G,jsx as d}from"react/jsx-runtime";import E from"../../models/AnnotationTool.js";import{getDefaultColor as L}from"../../utils/color.js";import H from"./tools/Point.js";import J from"./tools/Line.js";import K from"./atoms/AnnoBar.js";import Q from"../../models/CanvasAction.js";import X from"./tools/BBox.js";import Y from"./tools/Polygon.js";import{useState as h,useRef as x,useEffect as I}from"react";import e from"../../models/AnnotationMode.js";import Z from"../../utils/TimeUtils.js";const lo=({scaledAnnotation:r,annotationSettings:m,possibleLabels:T,svgScale:i,svgTranslation:l,pageToStageOffset:f,strokeWidth:B,nodeRadius:P,isSelected:c,isDisabled:V=!1,onFinishAnnoCreate:w,onLabelIconClicked:W,onAction:k=(n,a)=>{},onAnnoChanged:A=n=>{},onAnnotationModeChange:F=n=>{},onNotification:O=n=>{}})=>{const[n,a]=h(r.coordinates),[t,M]=h(r.mode),[j,C]=h(!1),R=x(void 0),[_,U]=h();I(()=>{R.current=_},[_]);const N=x(n);I(()=>{N.current=n},[n]);const b=()=>{M(e.VIEW);const o={...r,coordinates:N.current};w(o)},q=o=>T.find(s=>s.id===o),y=(()=>{if(!r.labelIds||r.labelIds.length==0)return L();const o=q(r.labelIds[0]);return o?.color===void 0||o.color===null?L():o.color})(),u={stroke:y,fill:y,strokeWidth:B/i,r:P/i},D=o=>{a(o);let s=o;[e.ADD,e.MOVE].includes(t)&&(s=o.slice(0,-1)),A({...r,coordinates:s})},p=o=>{[e.ADD,e.CREATE,e.MOVE].includes(t)||(M(e.MOVE),U(performance.now())),a(o)},g=()=>{M(e.VIEW);const o=Z.getRoundedDuration(R.current,performance.now()),s=Number.isNaN(r.annoTime)||r.annoTime===null?o:r.annoTime+o;A({...r,coordinates:N.current,annoTime:s})};I(()=>{F(t)},[t]),I(()=>{t===e.CREATE||t===e.ADD||a(r.coordinates)},[r]);const z=()=>{switch(r.type){case E.Point:return d(H,{isSelected:c,annotationSettings:m,coordinates:n[0],pageToStageOffset:f,svgScale:i,svgTranslation:l,style:u,onMoving:o=>p([o]),onMoved:g,onIsDraggingStateChanged:C});case E.Line:return d(J,{annotationSettings:m,coordinates:n,isSelected:c,pageToStageOffset:f,annotationMode:t,svgScale:i,svgTranslation:l,style:u,onAddNode:D,onDeleteNode:D,onMoving:p,onMoved:g,onIsDraggingStateChanged:C,onFinishAnnoCreate:b});case E.BBox:return d(X,{annotationMode:t,annotationSettings:m,startCoords:n[0],endCoords:n[1],isSelected:c,pageToStageOffset:f,style:u,svgScale:i,svgTranslation:l,onDeleteNode:()=>{console.log("TODO")},onIsDraggingStateChanged:C,onFinishAnnoCreate:b,onMoving:p,onMoved:g});case E.Polygon:return d(Y,{annotationSettings:m,coordinates:n,isSelected:c,isDisabled:V,pageToStageOffset:f,annotationMode:t,svgScale:i,svgTranslation:l,style:u,onAddNode:D,onDeleteNode:D,onMoving:p,onMoved:g,onNotification:O,onIsDraggingStateChanged:C,onFinishAnnoCreate:b})}};return G("g",{onClick:o=>{o.stopPropagation(),k(r,Q.ANNO_SELECTED)},children:[!j&&t!==e.CREATE&&d(K,{annotationCoordinates:n,canLabel:m.canLabel,labels:T,color:y,isSelected:c,selectedLabelIds:r.labelIds,style:u,svgScale:i,onLabelIconClicked:W}),z()]})};export{lo as default};
@@ -1 +1 @@
1
- import{jsxs as _,jsx as x}from"react/jsx-runtime";import{useState as r,useRef as C,useEffect as f}from"react";import T from"../../../utils/transform.js";import H from"./DaviIcon.js";const R=10,a=15,j=3,U=({annotationCoordinates:u,canLabel:y,color:b,labels:E,selectedLabelIds:h=[],isSelected:L,svgScale:t,style:d,onLabelIconClicked:P})=>{const[c,w]=r({x:0,y:0}),e={x:c.x+7/t,y:c.y-10/t},[p,D]=r(0),[z,A]=r(0),[l,B]=r(0),[m,F]=r(""),s=C(null);f(()=>{F(W())},[h]),f(()=>{const o=T.getTopPoint(u),i=T.getMostLeftPoints(o)[0];w(i);const n=Math.ceil(R/t);B(n),A(a/t)},[t]),f(()=>{if(s===void 0)return;const n=(s.current.getBoundingClientRect().width+j)/t;D(n)},[s,m,l]);const W=()=>{const i=E.filter(n=>h.includes(n.id)).map(n=>n.name).join(", ");return i.length?i:"no label"};return _("g",{children:[L&&y&&x(H,{x:e.x-33/t,y:e.y-30/t,color:b,size:60/t,onClick:()=>P(c)}),x("rect",{x:e.x,y:e.y-6/(t*1.2),width:p,height:z,rx:5/t,opacity:"0.5",style:d}),x("text",{x:e.x+1/t,y:e.y+6/t,fill:"white",textAnchor:"start",alignmentBaseline:"central",ref:s,fontSize:`${l}pt`,children:m}),x("rect",{x:e.x,y:e.y-6/(t*1.2),width:p,height:a,rx:5/t,opacity:"0.01",style:d,onContextMenu:o=>o.preventDefault()})]})};export{U as default};
1
+ import{jsxs as C,jsx as x}from"react/jsx-runtime";import{useState as r,useRef as H,useEffect as f}from"react";import m from"../../../utils/transform.js";import R from"./DaviIcon.js";const j=10,a=15,I=3,k=({annotationCoordinates:u,canLabel:y,color:L,labels:b,selectedLabelIds:h=[],isSelected:E,svgScale:t,style:p,onLabelIconClicked:P})=>{const[c,w]=r({x:0,y:0}),e={x:c.x+7/t,y:c.y-10/t},[d,D]=r(0),[z,A]=r(0),[l,B]=r(0),[T,F]=r(""),s=H(null);f(()=>{F(W())},[h]),f(()=>{const i=m.getTopPoint(u),o=m.getMostLeftPoints(i),n=o.length>0?o[0]:{x:0,y:0};w(n);const _=Math.ceil(j/t);B(_),A(a/t)},[t]),f(()=>{if(s===void 0)return;const n=(s.current.getBoundingClientRect().width+I)/t;D(n)},[s,T,l]);const W=()=>{const o=b.filter(n=>h.includes(n.id)).map(n=>n.name).join(", ");return o.length?o:"no label"};return C("g",{children:[E&&y&&x(R,{x:e.x-33/t,y:e.y-30/t,color:L,size:60/t,onClick:()=>P(c)}),x("rect",{x:e.x,y:e.y-6/(t*1.2),width:d,height:z,rx:5/t,opacity:"0.5",style:p}),x("text",{x:e.x+1/t,y:e.y+6/t,fill:"white",textAnchor:"start",alignmentBaseline:"central",ref:s,fontSize:`${l}pt`,children:T}),x("rect",{x:e.x,y:e.y-6/(t*1.2),width:d,height:a,rx:5/t,opacity:"0.01",style:p,onContextMenu:i=>i.preventDefault()})]})};export{k as default};
@@ -1 +1 @@
1
- import{jsx as l}from"react/jsx-runtime";import s from"../atoms/Node.js";const N=({annotationSettings:e,coordinates:o,isSelected:n,pageToStageOffset:t,svgScale:r,svgTranslation:d,style:i,onMoving:m,onMoved:f,onIsDraggingStateChanged:p})=>l(s,{index:0,annotationSettings:e,coordinates:o,pageToStageOffset:t,svgScale:r,svgTranslation:d,style:i,onDeleteNode:()=>{},onMoving:(u,x)=>n&&m(x),onMoved:()=>f([o]),onIsDraggingStateChanged:p});export{N as default};
1
+ import{jsx as l}from"react/jsx-runtime";import s from"../atoms/Node.js";const N=({annotationSettings:e,coordinates:o,isSelected:n,pageToStageOffset:t,svgScale:r,svgTranslation:d,style:i,onMoving:m,onMoved:f,onIsDraggingStateChanged:p})=>l(s,{index:0,annotationSettings:e,coordinates:o,pageToStageOffset:t,svgScale:r,svgTranslation:d,style:i,onDeleteNode:(()=>{}),onMoving:(u,x)=>n&&m(x),onMoved:()=>f([o]),onIsDraggingStateChanged:p});export{N as default};
@@ -26,6 +26,7 @@ type CanvasProps = {
26
26
  onSetIsImageJunk: (newJunkState: boolean) => void;
27
27
  onSetSelectedTool: (tool: AnnotationTool) => void;
28
28
  onShouldDeleteAnno: (internalAnnoId: number) => void;
29
+ onTraverseAnnotationHistory: (isUndo: boolean) => void;
29
30
  };
30
- declare const Canvas: ({ annotations, annotationSettings, defaultLabelId, image, isFullscreen, isImageJunk, isPolygonSelectionMode, polygonOperationResult, possibleLabels, preventScrolling, selectedAnnotation, selectedAnnoTool, toolbarHeight, uiConfig, onAnnoCreated, onAnnoCreationFinished, onAnnoChanged, onAnnoEditing, onNotification, onRequestNewAnnoId, onSelectAnnotation, onSetIsImageJunk, onSetSelectedTool, onShouldDeleteAnno, }: CanvasProps) => import("react/jsx-runtime").JSX.Element;
31
+ declare const Canvas: ({ annotations, annotationSettings, defaultLabelId, image, isFullscreen, isImageJunk, isPolygonSelectionMode, polygonOperationResult, possibleLabels, preventScrolling, selectedAnnotation, selectedAnnoTool, toolbarHeight, uiConfig, onAnnoCreated, onAnnoCreationFinished, onAnnoChanged, onAnnoEditing, onNotification, onRequestNewAnnoId, onSelectAnnotation, onSetIsImageJunk, onSetSelectedTool, onShouldDeleteAnno, onTraverseAnnotationHistory, }: CanvasProps) => import("react/jsx-runtime").JSX.Element;
31
32
  export default Canvas;
@@ -1 +1 @@
1
- import{jsxs as K,jsx as h,Fragment as Qe}from"react/jsx-runtime";import{useState as E,useRef as Z,useEffect as M}from"react";import D from"../models/AnnotationTool.js";import i from"../models/EditorModes.js";import Ze from"../utils/KeyMapper.js";import a from"../models/KeyAction.js";import pe from"../Annotation/logic/Annotation.js";import qe from"../models/CanvasAction.js";import et from"../Annotation/ui/AnnotationComponent.js";import he from"../utils/mouse.js";import N from"../models/AnnotationMode.js";import tt from"./LabelInput.js";import{FontAwesomeIcon as nt}from"@fortawesome/react-fontawesome";import{faBan as ot}from"@fortawesome/free-solid-svg-icons";import w from"../models/AnnotationStatus.js";import x from"../utils/transform.js";import rt from"../models/NotificationType.js";import st from"../utils/TimeUtils.js";import xe from"../utils/windowViewport.js";const Dt=({annotations:A=[],annotationSettings:W,defaultLabelId:q,image:ee,isFullscreen:Ce=!1,isImageJunk:B=!1,isPolygonSelectionMode:F=!1,polygonOperationResult:X={annotationsToDelete:[],polygonsToCreate:[]},possibleLabels:te,preventScrolling:ne=!0,selectedAnnotation:r,selectedAnnoTool:R,toolbarHeight:U=0,uiConfig:z,onAnnoCreated:Oe,onAnnoCreationFinished:oe,onAnnoChanged:re,onAnnoEditing:Te=g=>{},onNotification:se=g=>{},onRequestNewAnnoId:V,onSelectAnnotation:v,onSetIsImageJunk:Ae,onSetSelectedTool:ve=g=>{},onShouldDeleteAnno:ie})=>{const[g,C]=E(i.VIEW),[Me,Ie]=E(),[ce,De]=E(q),[k,we]=E({x:-1,y:-1}),[ae,le]=E(0),L={x:k.x,y:k.y},[u,Y]=E({x:-1,y:-1}),[d,G]=E({x:-1,y:-1}),[m,de]=E({x:-1,y:-1}),[l,P]=E(1),[c,S]=E({x:0,y:0}),H={x:c.x+ae,y:c.y},[O,$]=E(),[j,_]=E(!1),fe=Z(null),p=Z(null),y=Z(null),T=((e,t)=>{if(e.x===0||e.y===0||t.x===0||t.y===0)return 0;const n=t.x/e.x,o=t.y/e.y;return Math.min(n,o)})(u,d),Se=()=>{if((y==null?void 0:y.current)===null)return{x:0,y:0};const e=u.x*T;if(z.imageCentered&&d.x>e){const f=(d.x-e)/2;le(f)}else le(0);const{top:t,left:n}=p.current.getBoundingClientRect(),o={x:n+window.scrollX,y:t+window.scrollY};we(o)},_e=new Ze(e=>Pe(e)),be=e=>{C(i.CREATE);const t=x.convertStageCoordinatesToPercentaged([e],T,u);R===D.BBox&&t.push(t[0]);const n=V(),o=new pe(n,R,t);if(Ie(performance.now()),ce!==void 0&&(o.labelIds=[ce]),Oe(o),R===D.Point){const s={...o,coordinates:[e],annoTime:0};Q(s)}},Ne=()=>{if(r&&![D.Line,D.Polygon].includes(r.type))return;const e=A.find(n=>n.internalId===(r==null?void 0:r.internalId));if(e===void 0)return;C(i.CREATE),ve(e.type);const t={...e,mode:N.CREATE,status:w.CREATING,internalId:V(),selectedNode:e.coordinates.length-1};Te(t)},Re=()=>{const e=r?r.internalId:0,t=A.find(n=>n.internalId>e);if(t)return v(t);if(A.length>0)return v(A[0])},Ve=()=>{const e=r?r.internalId:0,t=[...A];t.sort((o,s)=>s.internalId-o.internalId);const n=t.find(o=>o.internalId<e);if(n)return v(n);if(A.length>0)return v(A.at(-1))},ke=()=>{if(r){const e=JSON.stringify(r);localStorage.setItem("lostAnnotationClipboard",e);const t={title:"Success",message:"Annotation copied",type:rt.SUCCESS};se(t)}},Le=()=>{const e=localStorage.getItem("lostAnnotationClipboard");if(e==null)return;const t=JSON.parse(e);t.internalId=V(),t.externalId="",oe(t,!0),v(t)},Pe=e=>{switch(e){case a.EDIT_LABEL:r&&_(!0);break;case a.DELETE_ANNO:r&&ie(r.internalId);break;case a.DELETE_ANNO_IN_CREATION:g===i.CREATE&&(ie(r.internalId),C(i.VIEW));break;case a.ENTER_ANNO_ADD_MODE:console.log("KeyAction TODO: ENTER_ANNO_ADD_MODE");break;case a.LEAVE_ANNO_ADD_MODE:console.log("KeyAction TODO: LEAVE_ANNO_ADD_MODE");break;case a.UNDO:console.log("KeyAction TODO: UNDO");break;case a.REDO:console.log("KeyAction TODO: REDO");break;case a.TRAVERSE_ANNOS:Re();break;case a.TRAVERSE_ANNOS_BACKWARDS:Ve();break;case a.CAM_MOVE_LEFT:b(20*l,0);break;case a.CAM_MOVE_RIGHT:b(-20*l,0);break;case a.CAM_MOVE_UP:b(0,20*l);break;case a.CAM_MOVE_DOWN:b(0,-20*l);break;case a.CAM_MOVE_STOP:console.log("KeyAction TODO: CAM_MOVE_STOP");break;case a.COPY_ANNOTATION:ke();break;case a.PASTE_ANNOTATION:Le();break;case a.RECREATE_ANNO:console.log("KeyAction TODO: RECREATE_ANNO"),Ne();break;case a.TOGGLE_IMAGE_JUNK:if(g===i.ADD||g===i.CREATE)return;Ae(!B);break;default:console.log("Unknown KeyAction",e);break}},b=(e,t)=>{let n=c.x+e/l,o=c.y+t/l;const s=d.x*.45,f=d.x*.55,I=d.y*.45,je=d.y*.55,Je={x:0,y:0},Ee=xe.getViewportCoordinates(c,d,l,Je),me=xe.getViewportCoordinates(c,d,l,d);Ee.vX>=s?n=c.x-5:me.vX<=f?n=c.x+5:Ee.vY>=I?o=c.y-5:me.vY<=je&&(o=c.y+5),S({x:n,y:o})},J=(e=>m.x<=0||m.y<=0||u.x<=0||u.y<=0?[]:A.map(n=>({...n,coordinates:x.convertPercentagedCoordinatesToStage(n.coordinates,u,m)})))(),Ke=()=>{if(C(i.VIEW),de({x:-1,y:-1}),y.current!==null){const{width:e,height:t}=y.current.getBoundingClientRect();Y({x:e,y:t})}P(1),S({x:0,y:0}),$(void 0),_(!1)};M(()=>{var e;(e=fe.current)==null||e.focus()},[]),M(()=>{if((p==null?void 0:p.current)!==void 0){const{width:e,height:t}=p.current.getBoundingClientRect(),n=t-U;G({x:e,y:n});const o=new ResizeObserver(()=>{const{width:s,height:f}=p.current.getBoundingClientRect(),I=f-U;G({x:s,y:I})});return o.observe(p.current),()=>o.disconnect()}Ke()},[ee,Ce]),M(()=>{Se()},[y,c,d]),M(()=>{if(p.current===null)return;const{width:e,height:t}=p.current.getBoundingClientRect(),n=t-U;G({x:e,y:n})},[p]),M(()=>{if(y.current===null)return;const{width:e,height:t}=y.current.getBoundingClientRect();Y({x:e,y:t});const n=new ResizeObserver(()=>{const{width:o,height:s}=y.current.getBoundingClientRect();Y({x:o,y:s})});return n.observe(y.current),()=>n.disconnect()},[y]),M(()=>{if(T===0)return;const e={x:u.x*T,y:u.y*T};de(e)},[T,u]),M(()=>{F&&X.polygonsToCreate!==void 0&&X.polygonsToCreate.forEach(e=>{const t=V(),n=new pe(t,e.type,x.convertPercentagedCoordinatesToStage(e.coordinates,u,m),N.VIEW,w.CREATED);Q(n)})},[X]);const Q=e=>{C(i.VIEW);const t={...e,mode:N.VIEW};if(e.type!==D.Point){const s=st.getRoundedDuration(Me,performance.now());t.annoTime=s}const n=x.convertStageCoordinatesToPercentaged(e.coordinates,T,u);t.coordinates=n,re(t);const o=R===D.Point||F;oe(t,o)},We=e=>{_e.keyDown(e.key,e.shiftKey,e.ctrlKey)&&e.preventDefault()},Be=e=>{e.preventDefault()},Fe=e=>{if(e.button!==0){if(e.button===1)C(i.CAMERA_MOVE);else if(e.button===2){if(!W.canCreate||g===i.ADD||g===i.CREATE)return;const t=he.getAntiScaledMouseStagePosition(e,L,l,c),n={x:t.x-ae,y:t.y};be(n)}}},Xe=()=>{ne&&(document.body.style.overflow="hidden")},Ue=e=>{e.button===1&&C(i.VIEW)},ue=(e,t)=>{g===i.CAMERA_MOVE&&b(e,t)},ze=()=>{ne&&(document.body.style.overflow="")},Ye=e=>{const o=(e.deltaY<0?1:-1)>0?l*1.25:l/1.25,s=he.getAntiScaledMouseStagePosition(e,L,l,c),f=l/o,I={x:f*(s.x+c.x)-s.x,y:f*(s.y+c.y)-s.y};o<1?(P(1),(c.x!=0||c.y!=0)&&S({x:0,y:0})):o>200?(P(200),S(I)):(P(o),S(I))},Ge=(e,t)=>{if(t!==qe.ANNO_SELECTED){console.log("Unknown Canvas Action:",t);return}const n={...e,coordinates:x.convertStageCoordinatesToPercentaged([...e.coordinates],T,u)};v(n);const o=x.getMostLeftPoints(e.coordinates),s=x.getTopPoint(o)[0],f=x.convertStageToPage(s,L,l,c);$(f)},ge=e=>{const t=x.convertStageCoordinatesToPercentaged(e.coordinates,T,u),n={...e,coordinates:t};n.status===w.LOADED&&(n.status=w.CHANGED),re(n)},He=()=>{if(g===i.CAMERA_MOVE)return h(Qe,{});const t=[i.CREATE,i.ADD,i.MOVE].includes(g),n=J.map(o=>{const s=o.internalId===(r==null?void 0:r.internalId);return t&&!s?h("g",{},`annotationComponent_${o.internalId}`):h(et,{scaledAnnotation:o,annotationSettings:W,possibleLabels:te,svgScale:l,svgTranslation:H,pageToStageOffset:L,nodeRadius:z.nodeRadius,strokeWidth:z.strokeWidth,isSelected:s,isDisabled:F&&s,onFinishAnnoCreate:Q,onLabelIconClicked:()=>_(!0),onAction:Ge,onAnnoChanged:ge,onAnnotationModeChange:f=>{f===N.MOVE&&C(i.MOVE),g===i.MOVE&&f===N.VIEW&&C(i.VIEW)},onNotification:se},`annotationComponent_${o.internalId}`)});if(r){const o=J.find(f=>f.internalId===(r==null?void 0:r.internalId)),s=J.indexOf(o);n.push(n.splice(s,1)[0])}return h("g",{children:n})},$e=()=>h("circle",{cx:m.x/2,cy:m.y/2,r:"100%",style:{opacity:0},onContextMenu:e=>e.preventDefault(),onClick:()=>{_(!1)}}),ye={x:k.x+d.x/2,y:k.y+d.y/2};return K("div",{ref:p,style:{flex:"1 1 auto",minHeight:0,display:"flex",flexDirection:"column"},children:[h("div",{style:{position:"absolute",left:(O==null?void 0:O.x)??0,top:(O==null?void 0:O.y)??0,display:(O==null?void 0:O.y)===void 0?"none":"inherit",zIndex:j?7e3:-1},children:h(tt,{defaultLabelId:q,isVisible:j,selectedLabelsIds:r==null?void 0:r.labelIds,possibleLabels:te,isMultilabel:W.canHaveMultipleLabels,onLabelSelect:e=>{if(_(!1),e.length>0){const o=e.filter(s=>!r.labelIds.includes(s));o.length>0&&De(o[0])}const t=r.status===w.LOADED?w.CHANGED:r.status,n={...r,coordinates:x.convertPercentagedCoordinatesToStage(r.coordinates,u,m),labelIds:[...e],status:t};ge(n)}})}),B&&K("div",{style:{position:"absolute",left:ye.x,top:ye.y,transform:"translate(-50%, -50%)",textAlign:"center",color:"white"},children:[h(nt,{icon:ot,size:"5x",style:{marginBottom:15}}),h("h2",{children:"Marked as Junk"})]}),K("svg",{ref:fe,style:{flex:"1 1 auto",minHeight:0},onKeyDown:We,onKeyUp:Be,onMouseMove:e=>ue(e.movementX,e.movementY),tabIndex:0,onMouseDown:e=>Fe(e),children:[K("g",{transform:`scale(${l}) translate(${H.x}, ${H.y})`,onMouseOver:Xe,onMouseLeave:ze,onMouseUp:Ue,onWheel:Ye,onMouseMove:e=>ue(e.movementX,e.movementY),onClick:()=>{v(void 0)},children:[h("image",{onContextMenu:e=>e.preventDefault(),href:ee,ref:y,width:m.x>0?m.x:void 0,height:m.y>0?m.y:void 0}),He()]}),j&&$e(),B&&h("rect",{x:"0",y:"0",width:d.x,height:d.y,style:{opacity:.8},onContextMenu:e=>e.preventDefault(),onClick:()=>{$(void 0)}})]})]})};export{Dt as default};
1
+ import{jsxs as L,jsx as m,Fragment as Ze}from"react/jsx-runtime";import{useState as y,useRef as Z,useEffect as I}from"react";import M from"../models/AnnotationTool.js";import i from"../models/EditorModes.js";import qe from"../utils/KeyMapper.js";import c from"../models/KeyAction.js";import Ae from"../Annotation/logic/Annotation.js";import et from"../models/CanvasAction.js";import tt from"../Annotation/ui/AnnotationComponent.js";import he from"../utils/mouse.js";import _ from"../models/AnnotationMode.js";import nt from"./LabelInput.js";import{FontAwesomeIcon as ot}from"@fortawesome/react-fontawesome";import{faBan as rt}from"@fortawesome/free-solid-svg-icons";import w from"../models/AnnotationStatus.js";import A from"../utils/transform.js";import st from"../models/NotificationType.js";import it from"../utils/TimeUtils.js";import xe from"../utils/windowViewport.js";const bt=({annotations:v=[],annotationSettings:W,defaultLabelId:q,image:ee,isFullscreen:Ce=!1,isImageJunk:B=!1,isPolygonSelectionMode:K=!1,polygonOperationResult:F={annotationsToDelete:[],polygonsToCreate:[]},possibleLabels:te,preventScrolling:ne=!0,selectedAnnotation:s,selectedAnnoTool:N,toolbarHeight:X=0,uiConfig:z,onAnnoCreated:ve,onAnnoCreationFinished:oe,onAnnoChanged:re,onAnnoEditing:Te=g=>{},onNotification:se=g=>{},onRequestNewAnnoId:R,onSelectAnnotation:T,onSetIsImageJunk:Ie,onSetSelectedTool:Oe=g=>{},onShouldDeleteAnno:ie,onTraverseAnnotationHistory:ae})=>{const[g,h]=y(i.VIEW),[Me,we]=y(),[ce,be]=y(q),[V,Se]=y({x:-1,y:-1}),[le,de]=y(0),k={x:V.x,y:V.y},[u,U]=y({x:-1,y:-1}),[d,Y]=y({x:-1,y:-1}),[E,fe]=y({x:-1,y:-1}),[l,P]=y(1),[a,b]=y({x:0,y:0}),G={x:a.x+le,y:a.y},[H,$]=y(),[j,S]=y(!1),ue=Z(null),x=Z(null),p=Z(null),C=((e,t)=>{if(e.x===0||e.y===0||t.x===0||t.y===0)return 0;const n=t.x/e.x,o=t.y/e.y;return Math.min(n,o)})(u,d),De=()=>{if(p?.current===null)return{x:0,y:0};const e=u.x*C;if(z.imageCentered&&d.x>e){const f=(d.x-e)/2;de(f)}else de(0);const{top:t,left:n}=x.current.getBoundingClientRect(),o={x:n+window.scrollX,y:t+window.scrollY};Se(o)},_e=new qe(e=>We(e)),Ne=e=>{h(i.CREATE);const t=A.convertStageCoordinatesToPercentaged([e],C,u);N===M.BBox&&t.push(t[0]);const n=R(),o=new Ae(n,N,t);if(we(performance.now()),ce!==void 0&&(o.labelIds=[ce]),ve(o),N===M.Point){const r={...o,coordinates:[e],annoTime:0};Q(r)}},Re=()=>{if(s&&![M.Line,M.Polygon].includes(s.type))return;const e=v.find(n=>n.internalId===s?.internalId);if(e===void 0)return;h(i.CREATE),Oe(e.type);const t={...e,mode:_.CREATE,status:w.CREATING,internalId:R(),selectedNode:e.coordinates.length-1};Te(t)},Ve=()=>{const e=s?s.internalId:0,t=v.find(n=>n.internalId>e);if(t)return T(t);if(v.length>0)return T(v[0])},ke=()=>{const e=s?s.internalId:0,t=[...v];t.sort((o,r)=>r.internalId-o.internalId);const n=t.find(o=>o.internalId<e);if(n)return T(n);if(v.length>0)return T(v.at(-1))},Pe=()=>{if(s){const e=JSON.stringify(s);localStorage.setItem("lostAnnotationClipboard",e);const t={title:"Success",message:"Annotation copied",type:st.SUCCESS};se(t)}},Le=()=>{const e=localStorage.getItem("lostAnnotationClipboard");if(e==null)return;const t=JSON.parse(e);t.internalId=R(),t.externalId="",oe(t,!0),T(t)},We=e=>{switch(e){case c.EDIT_LABEL:s&&S(!0);break;case c.DELETE_ANNO:s&&ie(s.internalId);break;case c.DELETE_ANNO_IN_CREATION:g===i.CREATE&&(ie(s.internalId),h(i.VIEW));break;case c.ENTER_ANNO_ADD_MODE:console.log("KeyAction TODO: ENTER_ANNO_ADD_MODE");break;case c.LEAVE_ANNO_ADD_MODE:console.log("KeyAction TODO: LEAVE_ANNO_ADD_MODE");break;case c.UNDO:ae(!0);break;case c.REDO:ae(!1);break;case c.TRAVERSE_ANNOS:Ve();break;case c.TRAVERSE_ANNOS_BACKWARDS:ke();break;case c.CAM_MOVE_LEFT:D(20*l,0);break;case c.CAM_MOVE_RIGHT:D(-20*l,0);break;case c.CAM_MOVE_UP:D(0,20*l);break;case c.CAM_MOVE_DOWN:D(0,-20*l);break;case c.CAM_MOVE_STOP:console.log("KeyAction TODO: CAM_MOVE_STOP");break;case c.COPY_ANNOTATION:Pe();break;case c.PASTE_ANNOTATION:Le();break;case c.RECREATE_ANNO:console.log("KeyAction TODO: RECREATE_ANNO"),Re();break;case c.TOGGLE_IMAGE_JUNK:if(g===i.ADD||g===i.CREATE)return;Ie(!B);break;default:console.log("Unknown KeyAction",e);break}},D=(e,t)=>{let n=a.x+e/l,o=a.y+t/l;const r=d.x*.45,f=d.x*.55,O=d.y*.45,Je=d.y*.55,Qe={x:0,y:0},me=xe.getViewportCoordinates(a,d,l,Qe),pe=xe.getViewportCoordinates(a,d,l,d);me.vX>=r?n=a.x-5:pe.vX<=f?n=a.x+5:me.vY>=O?o=a.y-5:pe.vY<=Je&&(o=a.y+5),b({x:n,y:o})},J=(e=>E.x<=0||E.y<=0||u.x<=0||u.y<=0?[]:v.map(n=>({...n,coordinates:A.convertPercentagedCoordinatesToStage(n.coordinates,u,E)})))(),Be=()=>{if(h(i.VIEW),fe({x:-1,y:-1}),p.current!==null){const{width:e,height:t}=p.current.getBoundingClientRect();U({x:e,y:t})}P(1),b({x:0,y:0}),$(void 0),S(!1)};I(()=>{ue.current?.focus()},[]),I(()=>{if(x?.current!==void 0){const{width:e,height:t}=x.current.getBoundingClientRect(),n=t-X;Y({x:e,y:n});const o=new ResizeObserver(()=>{const{width:r,height:f}=x.current.getBoundingClientRect(),O=f-X;Y({x:r,y:O})});return o.observe(x.current),()=>o.disconnect()}Be()},[ee,Ce]),I(()=>{De()},[p,a,d]),I(()=>{if(x.current===null)return;const{width:e,height:t}=x.current.getBoundingClientRect(),n=t-X;Y({x:e,y:n})},[x]),I(()=>{if(p.current===null)return;const{width:e,height:t}=p.current.getBoundingClientRect();U({x:e,y:t});const n=new ResizeObserver(()=>{const{width:o,height:r}=p.current.getBoundingClientRect();U({x:o,y:r})});return n.observe(p.current),()=>n.disconnect()},[p]),I(()=>{if(C===0)return;const e={x:u.x*C,y:u.y*C};fe(e)},[C,u]),I(()=>{K&&F.polygonsToCreate!==void 0&&F.polygonsToCreate.forEach(e=>{const t=R(),n=new Ae(t,e.type,A.convertPercentagedCoordinatesToStage(e.coordinates,u,E),_.VIEW,w.CREATED);Q(n)})},[F]);const Q=e=>{h(i.VIEW);const t={...e,mode:_.VIEW};if(e.type!==M.Point){const r=it.getRoundedDuration(Me,performance.now());t.annoTime=r}const n=A.convertStageCoordinatesToPercentaged(e.coordinates,C,u);t.coordinates=n,re(t);const o=N===M.Point||K;oe(t,o)},Ke=e=>{_e.keyDown(e.key,e.shiftKey,e.ctrlKey)&&e.preventDefault()},Fe=e=>{e.preventDefault()},Xe=e=>{if(e.button!==0){if(e.button===1)h(i.CAMERA_MOVE);else if(e.button===2){if(!W.canCreate||g===i.ADD||g===i.CREATE)return;const t=he.getAntiScaledMouseStagePosition(e,k,l,a),n={x:t.x-le,y:t.y};Ne(n)}}},ze=()=>{ne&&(document.body.style.overflow="hidden")},Ue=e=>{e.button===1&&h(i.VIEW)},ge=(e,t)=>{g===i.CAMERA_MOVE&&D(e,t)},Ye=()=>{ne&&(document.body.style.overflow="")},Ge=e=>{const o=(e.deltaY<0?1:-1)>0?l*1.25:l/1.25,r=he.getAntiScaledMouseStagePosition(e,k,l,a),f=l/o,O={x:f*(r.x+a.x)-r.x,y:f*(r.y+a.y)-r.y};o<1?(P(1),(a.x!=0||a.y!=0)&&b({x:0,y:0})):o>200?(P(200),b(O)):(P(o),b(O))},He=(e,t)=>{if(t!==et.ANNO_SELECTED){console.log("Unknown Canvas Action:",t);return}const n={...e,coordinates:A.convertStageCoordinatesToPercentaged([...e.coordinates],C,u)};T(n);const o=A.getMostLeftPoints(e.coordinates),r=A.getTopPoint(o)[0],f=A.convertStageToPage(r,k,l,a);$(f)},ye=e=>{const t=A.convertStageCoordinatesToPercentaged(e.coordinates,C,u),n={...e,coordinates:t};n.status===w.LOADED&&(n.status=w.CHANGED),re(n)},$e=()=>{if(g===i.CAMERA_MOVE)return m(Ze,{});const t=[i.CREATE,i.ADD,i.MOVE].includes(g),n=J.map(o=>{const r=o.internalId===s?.internalId;return t&&!r?m("g",{},`annotationComponent_${o.internalId}`):m(tt,{scaledAnnotation:o,annotationSettings:W,possibleLabels:te,svgScale:l,svgTranslation:G,pageToStageOffset:k,nodeRadius:z.nodeRadius,strokeWidth:z.strokeWidth,isSelected:r,isDisabled:K&&r,onFinishAnnoCreate:Q,onLabelIconClicked:()=>S(!0),onAction:He,onAnnoChanged:ye,onAnnotationModeChange:f=>{f===_.MOVE&&h(i.MOVE),g===i.MOVE&&f===_.VIEW&&h(i.VIEW)},onNotification:se},`annotationComponent_${o.internalId}`)});if(s){const o=J.find(f=>f.internalId===s?.internalId),r=J.indexOf(o);n.push(n.splice(r,1)[0])}return m("g",{children:n})},je=()=>m("circle",{cx:E.x/2,cy:E.y/2,r:"100%",style:{opacity:0},onContextMenu:e=>e.preventDefault(),onClick:()=>{S(!1)}}),Ee={x:V.x+d.x/2,y:V.y+d.y/2};return L("div",{ref:x,style:{flex:"1 1 auto",minHeight:0,display:"flex",flexDirection:"column"},children:[m("div",{style:{position:"absolute",left:H?.x??0,top:H?.y??0,display:H?.y===void 0?"none":"inherit",zIndex:j?7e3:-1},children:m(nt,{defaultLabelId:q,isVisible:j,selectedLabelsIds:s?.labelIds,possibleLabels:te,isMultilabel:W.canHaveMultipleLabels,onLabelSelect:e=>{if(S(!1),e.length>0){const o=e.filter(r=>!s.labelIds.includes(r));o.length>0&&be(o[0])}const t=s.status===w.LOADED?w.CHANGED:s.status,n={...s,coordinates:A.convertPercentagedCoordinatesToStage(s.coordinates,u,E),labelIds:[...e],status:t};ye(n)}})}),B&&L("div",{style:{position:"absolute",left:Ee.x,top:Ee.y,transform:"translate(-50%, -50%)",textAlign:"center",color:"white"},children:[m(ot,{icon:rt,size:"5x",style:{marginBottom:15}}),m("h2",{children:"Marked as Junk"})]}),L("svg",{ref:ue,style:{flex:"1 1 auto",minHeight:0},onKeyDown:Ke,onKeyUp:Fe,onMouseMove:e=>ge(e.movementX,e.movementY),tabIndex:0,onMouseDown:e=>Xe(e),children:[L("g",{transform:`scale(${l}) translate(${G.x}, ${G.y})`,onMouseOver:ze,onMouseLeave:Ye,onMouseUp:Ue,onWheel:Ge,onMouseMove:e=>ge(e.movementX,e.movementY),onClick:()=>{T(void 0)},children:[m("image",{onContextMenu:e=>e.preventDefault(),href:ee,ref:p,width:E.x>0?E.x:void 0,height:E.y>0?E.y:void 0}),$e()]}),j&&je(),B&&m("rect",{x:"0",y:"0",width:d.x,height:d.y,style:{opacity:.8},onContextMenu:e=>e.preventDefault(),onClick:()=>{$(void 0)}})]})]})};export{bt as default};
@@ -1 +1 @@
1
- import{jsxs as r,Fragment as v,jsx as o}from"react/jsx-runtime";import{useState as g}from"react";import{CPopover as w,CDropdown as D,CDropdownToggle as x,CDropdownMenu as y,CFormInput as F,CDropdownDivider as I,CDropdownItem as c}from"@coreui/react";const S=({defaultLabelId:i,isVisible:d,selectedLabelsIds:l,possibleLabels:s,isMultilabel:m=!1,onLabelSelect:f})=>{const[a,C]=g(""),p=s.filter(e=>e.name.toLowerCase().includes(a.toLowerCase())),h=e=>{let n=[];if(m){n=[...l];const u=l.indexOf(e.id);u===-1?n.push(e.id):n.splice(u,1)}else n=[e.id];f(n)},t=i?s.find(e=>e.id===i):void 0;return r(v,{children:[o(w,{content:`Default Label: ${t==null?void 0:t.name}`,visible:d&&t!==void 0,children:o("div",{style:{marginLeft:80}})}),r(D,{visible:d,autoClose:!1,style:{marginTop:-25},children:[o(x,{style:{display:"none"}}),r(y,{children:[o("div",{className:"px-3 py-2",children:o(F,{placeholder:"Filter label...",value:a,onChange:e=>C(e.target.value),autoFocus:!0})}),o(I,{}),p.length>0?p.map(e=>o(c,{onClick:()=>h(e),children:e.name},e.id)):o(c,{disabled:!0,children:"No results"})]})]})]})};export{S as default};
1
+ import{jsxs as n,Fragment as v,jsx as o}from"react/jsx-runtime";import{useState as g}from"react";import{CPopover as w,CDropdown as D,CDropdownToggle as x,CDropdownMenu as y,CFormInput as F,CDropdownDivider as L,CDropdownItem as c}from"@coreui/react";const S=({defaultLabelId:r,isVisible:i,selectedLabelsIds:l,possibleLabels:d,isMultilabel:f=!1,onLabelSelect:m})=>{const[s,C]=g(""),a=d.filter(e=>e.name.toLowerCase().includes(s.toLowerCase())),h=e=>{let t=[];if(f){t=[...l];const u=l.indexOf(e.id);u===-1?t.push(e.id):t.splice(u,1)}else t=[e.id];m(t)},p=r?d.find(e=>e.id===r):void 0;return n(v,{children:[o(w,{content:`Default Label: ${p?.name}`,visible:i&&p!==void 0,children:o("div",{style:{marginLeft:80}})}),n(D,{visible:i,autoClose:!1,style:{marginTop:-25},children:[o(x,{style:{display:"none"}}),n(y,{children:[o("div",{className:"px-3 py-2",children:o(F,{placeholder:"Filter label...",value:s,onChange:e=>C(e.target.value),autoFocus:!0})}),o(L,{}),a.length>0?a.map(e=>o(c,{onClick:()=>h(e),children:e.name},e.id)):o(c,{disabled:!0,children:"No results"})]})]})]})};export{S as default};
@@ -1 +1 @@
1
- import{jsx as t,jsxs as A}from"react/jsx-runtime";import{faSync as F}from"@fortawesome/free-solid-svg-icons";import{FontAwesomeIcon as v}from"@fortawesome/react-fontawesome";import{CTooltip as I,CButton as y}from"@coreui/react";const D=({loadingSize:o="1x",isLoading:n=!1,margin:c=5,icon:j,text:i="",size:s,isTextLeft:N=!1,style:a={},id:B=void 0,type:C="button",disabled:r=!1,onClick:l,className:m="",color:f="primary",isOutline:T=!0,tooltip:u="",ttipPlacement:b="top",shape:w=""})=>{const e=j,p=T?"outline":void 0,x=()=>{if(n)return A("div",{className:"flex justify-center items-center",children:[t(v,{className:"mr-3",size:o||"2x",icon:F,spin:!0}),t("span",{className:"text-center",children:"Loading"})]});const d=e!=null&&e.iconName&&e.prefix?t(v,{icon:e,size:o||"2x"},"icon"):null,h=i?t("span",{style:{marginLeft:c,marginRight:c},children:i},"text"):null;return N?[h,d]:[d,h]};return u!=""?t(I,{content:u,placement:b,children:t(y,{id:B,size:s,className:m,style:a,variant:p,disabled:r||n,onClick:l,color:r||n?"secondary":f,shape:w,children:x()})}):t(y,{size:s,type:C,className:m,style:a,variant:p,disabled:r||n,onClick:l,color:r||n?"secondary":f,children:x()})};export{D as default};
1
+ import{jsx as t,jsxs as w}from"react/jsx-runtime";import{faSync as A}from"@fortawesome/free-solid-svg-icons";import{FontAwesomeIcon as v}from"@fortawesome/react-fontawesome";import{CTooltip as F,CButton as y}from"@coreui/react";const D=({loadingSize:o="1x",isLoading:n=!1,margin:c=5,icon:B,text:i="",size:s,isTextLeft:j=!1,style:a={},id:I=void 0,type:N="button",disabled:e=!1,onClick:u,className:l="",color:m="primary",isOutline:C=!0,tooltip:f="",ttipPlacement:T="top",shape:b=""})=>{const r=B,p=C?"outline":void 0,x=()=>{if(n)return w("div",{className:"flex justify-center items-center",children:[t(v,{className:"mr-3",size:o||"2x",icon:A,spin:!0}),t("span",{className:"text-center",children:"Loading"})]});const d=r?.iconName&&r.prefix?t(v,{icon:r,size:o||"2x"},"icon"):null,h=i?t("span",{style:{marginLeft:c,marginRight:c},children:i},"text"):null;return j?[h,d]:[d,h]};return f!=""?t(F,{content:f,placement:T,children:t(y,{id:I,size:s,className:l,style:a,variant:p,disabled:e||n,onClick:u,color:e||n?"secondary":m,shape:b,children:x()})}):t(y,{size:s,type:N,className:l,style:a,variant:p,disabled:e||n,onClick:u,color:e||n?"secondary":m,children:x()})};export{D as default};
package/dist/Sia.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { ReactElement } from 'react';
2
2
  import { default as AnnotationTool } from './models/AnnotationTool';
3
3
  import { default as Annotation } from './Annotation/logic/Annotation';
4
- import { AllowedTools, AnnotationSettings, ExternalAnnotation, Label, PolygonOperationResult, SIANotification, UiConfig } from './types';
4
+ import { AllowedTools, AnnotationSettings, ExternalAnnotation, Label, PolygonOperationResult, SIANotification, TimeTravelChanges, UiConfig } from './types';
5
5
  type SiaProps = {
6
6
  additionalButtons?: ReactElement;
7
7
  allowedTools?: AllowedTools;
@@ -25,9 +25,10 @@ type SiaProps = {
25
25
  onIsImageJunk?: (isJunk: boolean) => void;
26
26
  onNotification?: (notification: SIANotification) => void;
27
27
  onSelectAnnotation?: (annotation: Annotation) => void;
28
+ onTimeTravel?: (timeTravelAction: TimeTravelChanges) => void;
28
29
  };
29
30
  /**
30
31
  * Main SIA component
31
32
  */
32
- declare const Sia2: ({ additionalButtons, allowedTools: propAllowedTools, polygonOperationResult, annotationSettings: propAnnotationSettings, uiConfig: propUiConfig, defaultAnnotationTool, defaultLabelId, image, isLoading, isPolygonSelectionMode, initialAnnotations, initialImageLabelIds, initialIsImageJunk, possibleLabels, onAnnoCreated, onAnnoCreationFinished, onAnnoChanged, onAnnoDeleted, onImageLabelsChanged, onIsImageJunk, onNotification, onSelectAnnotation, }: SiaProps) => import("react/jsx-runtime").JSX.Element;
33
- export default Sia2;
33
+ declare const Sia: ({ additionalButtons, allowedTools: propAllowedTools, polygonOperationResult, annotationSettings: propAnnotationSettings, uiConfig: propUiConfig, defaultAnnotationTool, defaultLabelId, image, isLoading, isPolygonSelectionMode, initialAnnotations, initialImageLabelIds, initialIsImageJunk, possibleLabels, onAnnoCreated, onAnnoCreationFinished, onAnnoChanged, onAnnoDeleted, onImageLabelsChanged, onIsImageJunk, onNotification, onSelectAnnotation, onTimeTravel, }: SiaProps) => import("react/jsx-runtime").JSX.Element;
34
+ export default Sia;
package/dist/Sia.js CHANGED
@@ -1 +1 @@
1
- import{jsx as r,jsxs as P}from"react/jsx-runtime";import{useRef as cn,useState as i,useEffect as u}from"react";import{CSpinner as W}from"@coreui/react";import fn from"./Canvas/Canvas.js";import un from"./models/AnnotationTool.js";import In from"./Toolbar/Toolbar.js";import mn from"./models/AnnotationMode.js";import hn from"./models/AnnotationStatus.js";const wn=({additionalButtons:q,allowedTools:S,polygonOperationResult:c={annotationsToDelete:[],polygonsToCreate:[]},annotationSettings:T,uiConfig:g,defaultAnnotationTool:z,defaultLabelId:M,image:I,isLoading:w=!1,isPolygonSelectionMode:y=!1,initialAnnotations:x=void 0,initialImageLabelIds:_=void 0,initialIsImageJunk:V=!1,possibleLabels:D,onAnnoCreated:G=(f,m)=>{},onAnnoCreationFinished:K=(f,m)=>{},onAnnoChanged:Q=(f,m)=>{},onAnnoDeleted:b=(f,m)=>{},onImageLabelsChanged:X=()=>{},onIsImageJunk:Y=()=>{},onNotification:Z=f=>{},onSelectAnnotation:$=f=>{}})=>{const m=cn(null),[k,p]=i(),[s,d]=i([]),[E,R]=i(),[O,nn]=i(),[l,h]=i(),[j,N]=i(z??un.Point),[en,B]=i(_),[F,J]=i(),[v,tn]=i(!1),[L,U]=i([]),A=n=>{const e=s.findIndex(a=>a.internalId===n),t=[...s],o=t.splice(e,1)[0];d(t),h(void 0),b(o,t)},on=()=>{l!==void 0&&A(l.internalId)},sn=()=>{let n=0;const e=x.map(t=>({...t,internalId:n++,mode:mn.VIEW,selectedNode:1,status:t.status,annoTime:t.annoTime??0}));U([...new Array(n).keys()]),d(e)},an=()=>{let n=0;for(;L.includes(n);)n++;const e=[...L];return e.push(n),U(e),n},dn=n=>{const e=[...s],t=e.findIndex(C=>C.internalId===(l==null?void 0:l.internalId));if(t===-1)return;const o=e.splice(t,1)[0];b(o,e);const a=[...e];a.push(n),d(a),h(n)},H=n=>{J(n),Y(n)};u(()=>{I===void 0&&(d([]),h(void 0))},[I]),u(()=>{J(V),!(I!==void 0||x===void 0||x.length===0)&&sn()},[x]),u(()=>{B(_)},[_]),u(()=>{const e={...{canCreate:!0,canEdit:!0,canHaveMultipleLabels:!1,canLabel:!0,minimalArea:250},...T};R(e)},[T]),u(()=>{const e={...{nodeRadius:4,strokeWidth:4,imageCentered:!1},...g};nn(e)},[g]),u(()=>{const n={bbox:!0,point:!0,line:!0,junk:!0,polygon:!0};if(S===void 0)return p(n);p(S)},[S]);const ln={position:"fixed",top:0,left:0,zIndex:6e3,backgroundColor:"#ffff",width:"100%",height:"100%",padding:15},rn={flex:"1 1 auto",minHeight:0,display:"flex",flexDirection:"column"};return k===void 0?r("div",{className:"d-flex justify-content-center",children:r(W,{color:"primary",style:{width:"5rem",height:"5rem"}})}):P("div",{style:{...v?ln:{},flex:"1 1 auto",minHeight:0,display:"flex",flexDirection:"column"},children:[r("div",{ref:m,style:{marginBottom:10},children:r(In,{annotationSettings:E,allowedTools:k,additionalButtons:q,isDisabled:w,isFullscreen:v,isImageJunk:F,imageLabelIds:en,possibleLabels:D,selectedTool:j,onImageLabelsChanged:n=>{B(n),X(n)},onSetIsFullscreen:tn,onSetIsImageJunk:H,onSetSelectedTool:N,onShouldDeleteSelectedAnnotation:on})}),P("div",{style:rn,children:[w&&r("div",{className:"d-flex justify-content-center",children:r(W,{color:"primary",style:{width:"5rem",height:"5rem",marginTop:200}})}),I&&s&&r(fn,{annotations:s,annotationSettings:E,defaultLabelId:M,image:I,isFullscreen:v,isImageJunk:F,isPolygonSelectionMode:y,selectedAnnotation:l,selectedAnnoTool:j,polygonOperationResult:c,possibleLabels:D,uiConfig:O,onAnnoCreated:n=>{const e=[...s];e.push(n),d(e),h(n),G(n,e)},onAnnoChanged:n=>{const e=s.findIndex(o=>o.internalId===n.internalId);if(e===-1)return;const t=[...s];t[e]=n,d(t),Q(n,t)},onAnnoCreationFinished:(n,e)=>{const t=[...s];if(y&&(c==null?void 0:c.annotationsToDelete)!==void 0){c.annotationsToDelete.push(l);for(const o of c.annotationsToDelete){A(o.internalId);const a=t.findIndex(C=>C.internalId===o.internalId);t.splice(a,1)}}if(e)t.push(n);else{const o=s.findIndex(a=>a.internalId===n.internalId);t[o]=n}d(t),n.status=hn.CREATED,K(n,t)},onAnnoEditing:dn,onSetIsImageJunk:H,onNotification:Z,onRequestNewAnnoId:an,onSelectAnnotation:n=>{h(n),$(n)},onSetSelectedTool:N,onShouldDeleteAnno:A})]})]})};export{wn as default};
1
+ import{jsx as f,jsxs as M}from"react/jsx-runtime";import{useRef as gn,useState as a,useEffect as u}from"react";import{CSpinner as V}from"@coreui/react";import Sn from"./Canvas/Canvas.js";import _n from"./models/AnnotationTool.js";import Tn from"./Toolbar/Toolbar.js";import Cn from"./models/AnnotationMode.js";import K from"./models/AnnotationStatus.js";const Nn=({additionalButtons:Q,allowedTools:S,polygonOperationResult:y={annotationsToDelete:[],polygonsToCreate:[]},annotationSettings:w,uiConfig:D,defaultAnnotationTool:X,defaultLabelId:Y,image:I,isLoading:b=!1,isPolygonSelectionMode:k=!1,initialAnnotations:x=void 0,initialImageLabelIds:_=void 0,initialIsImageJunk:Z=!1,possibleLabels:E,onAnnoCreated:$=(l,m)=>{},onAnnoCreationFinished:O=(l,m)=>{},onAnnoChanged:nn=(l,m)=>{},onAnnoDeleted:F=(l,m)=>{},onImageLabelsChanged:tn=()=>{},onIsImageJunk:en=()=>{},onNotification:on=l=>{},onSelectAnnotation:sn=l=>{},onTimeTravel:an=l=>{}})=>{const m=gn(null),[N,J]=a(),[i,r]=a([]),[j,rn]=a(),[d,T]=a(),[A,B]=a([]),[dn,ln]=a(),[h,v]=a(),[L,P]=a(X??_n.Point),g=n=>{const t=[...n],e=[...A];d!==void 0&&e.splice(d+1),e.push(t),T(void 0),B(e)},[cn,R]=a(_),[U,W]=a(),[C,fn]=a(!1),[q,z]=a([]),p=n=>{const t=i.findIndex(o=>o.internalId===n),e=[...i],s=e.splice(t,1)[0];r(e),v(void 0),g(e),F(s,e)},un=()=>{h!==void 0&&p(h.internalId)},In=()=>{let n=0;const t=x.map(e=>({...e,internalId:n++,mode:Cn.VIEW,selectedNode:1,status:e.status,annoTime:e.annoTime??0}));z([...new Array(n).keys()]),r(t),g(t)},mn=()=>{let n=0;for(;q.includes(n);)n++;const t=[...q];return t.push(n),z(t),n},An=n=>{const t=[...i],e=t.findIndex(c=>c.internalId===h?.internalId);if(e===-1)return;const s=t.splice(e,1)[0];F(s,t);const o=[...t];o.push(n),r(o),v(n)},G=n=>{W(n),en(n)},hn=n=>{const t=d??A.length-1,e=t==A.length-1,s=t==0;if(e&&!n||s&&n)return;const o=t+(n?-1:1);T(o)},vn=n=>{const t=[],e=[],s=[];for(const o of n){const c=i.find(H=>H.internalId===o.internalId);c?JSON.stringify(c)!==JSON.stringify(o)&&s.push(o):t.push(o)}for(const o of i)n.find(H=>H.internalId===o.internalId)||e.push(o);return{addedAnnotations:t,removedAnnotations:e,changedAnnotations:s}};u(()=>{if(d==null||d<0||d>A.length-1)return;const t=[...A[d]];r(t);const e=vn(t);an(e)},[d]),u(()=>{I===void 0&&(r([]),v(void 0),B([]),T(void 0))},[I]),u(()=>{W(Z),!(I!==void 0||x===void 0||x.length===0)&&In()},[x]),u(()=>{R(_)},[_]),u(()=>{const t={...{canCreate:!0,canEdit:!0,canHaveMultipleLabels:!1,canLabel:!0,minimalArea:250},...w};rn(t)},[w]),u(()=>{const t={...{nodeRadius:4,strokeWidth:4,imageCentered:!1},...D};ln(t)},[D]),u(()=>{const n={bbox:!0,point:!0,line:!0,junk:!0,polygon:!0};if(S===void 0)return J(n);J(S)},[S]);const yn={position:"fixed",top:0,left:0,zIndex:6e3,backgroundColor:"#ffff",width:"100%",height:"100%",padding:15},xn={flex:"1 1 auto",minHeight:0,display:"flex",flexDirection:"column"};return N===void 0?f("div",{className:"d-flex justify-content-center",children:f(V,{color:"primary",style:{width:"5rem",height:"5rem"}})}):M("div",{style:{...C?yn:{},flex:"1 1 auto",minHeight:0,display:"flex",flexDirection:"column"},children:[f("div",{ref:m,style:{marginBottom:10},children:f(Tn,{annotationSettings:j,allowedTools:N,additionalButtons:Q,isDisabled:b,isFullscreen:C,isImageJunk:U,imageLabelIds:cn,possibleLabels:E,selectedTool:L,onImageLabelsChanged:n=>{R(n),tn(n)},onSetIsFullscreen:fn,onSetIsImageJunk:G,onSetSelectedTool:P,onShouldDeleteSelectedAnnotation:un})}),M("div",{style:xn,children:[b&&f("div",{className:"d-flex justify-content-center",children:f(V,{color:"primary",style:{width:"5rem",height:"5rem",marginTop:200}})}),I&&i&&f(Sn,{annotations:i,annotationSettings:j,defaultLabelId:Y,image:I,isFullscreen:C,isImageJunk:U,isPolygonSelectionMode:k,selectedAnnotation:h,selectedAnnoTool:L,polygonOperationResult:y,possibleLabels:E,uiConfig:dn,onAnnoCreated:n=>{const t=[...i];t.push(n),r(t),v(n),$(n,t)},onAnnoChanged:n=>{const t=i.findIndex(s=>s.internalId===n.internalId);if(t===-1)return;const e=[...i];e[t]=n,r(e),n.status!==K.CREATING&&g(e),nn(n,e)},onAnnoCreationFinished:(n,t)=>{const e=[...i];if(k&&y?.annotationsToDelete!==void 0){y.annotationsToDelete.push(h);for(const s of y.annotationsToDelete){p(s.internalId);const o=e.findIndex(c=>c.internalId===s.internalId);e.splice(o,1)}}if(t)e.push(n);else{const s=i.findIndex(o=>o.internalId===n.internalId);e[s]=n}r(e),g(e),n.status=K.CREATED,O(n,e)},onAnnoEditing:An,onSetIsImageJunk:G,onNotification:on,onRequestNewAnnoId:mn,onSelectAnnotation:n=>{v(n),sn(n)},onSetSelectedTool:P,onShouldDeleteAnno:p,onTraverseAnnotationHistory:hn})]})]})};export{Nn as default};