lost-sia/dist/Annotation/ui/AnnotationComponent.js

Single Image Annotation Tool

import{jsxs as G,jsx as d}from"react/jsx-runtime";import g 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 V,useEffect as I}from"react";import e from"../../models/AnnotationMode.js";import Z from"../../utils/TimeUtils.js";const fo=({scaledAnnotation:r,annotationSettings:u,possibleLabels:T,svgScale:i,svgTranslation:f,pageToStageOffset:l,strokeWidth:x,nodeRadius:B,isSelected:s,isDisabled:P=!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(s?r.mode:e.VIEW),[j,C]=h(!1),R=V(void 0),[_,U]=h();I(()=>{R.current=_},[_]);const N=V(n);I(()=>{N.current=n},[n]);const b=()=>{M(e.VIEW);const o={...r,coordinates:N.current};W(o)},q=o=>T.find(m=>m.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})(),c={stroke:y,fill:y,strokeWidth:x/i,r:B/i},D=o=>{a(o);let m=o;[e.ADD,e.MOVE].includes(t)&&(m=o.slice(0,-1)),A({...r,coordinates:m})},p=o=>{[e.ADD,e.CREATE,e.MOVE].includes(t)||(M(e.MOVE),U(performance.now())),a(o)},E=()=>{M(e.VIEW);const o=Z.getRoundedDuration(R.current,performance.now()),m=Number.isNaN(r.annoTime)||r.annoTime===null?o:r.annoTime+o;A({...r,coordinates:N.current,annoTime:m})};I(()=>{F(t)},[t]),I(()=>{t===e.CREATE||t===e.ADD||a(r.coordinates)},[r]);const z=()=>{switch(r.type){case g.Point:return d(H,{isSelected:s,annotationSettings:u,coordinates:n[0],pageToStageOffset:l,svgScale:i,svgTranslation:f,style:c,onMoving:o=>p([o]),onMoved:E,onIsDraggingStateChanged:C});case g.Line:return d(J,{annotationSettings:u,coordinates:n,isSelected:s,pageToStageOffset:l,annotationMode:t,svgScale:i,svgTranslation:f,style:c,onAddNode:D,onDeleteNode:D,onMoving:p,onMoved:E,onIsDraggingStateChanged:C,onFinishAnnoCreate:b});case g.BBox:return d(X,{annotationMode:t,annotationSettings:u,startCoords:n[0],endCoords:n[1],isSelected:s,pageToStageOffset:l,style:c,svgScale:i,svgTranslation:f,onDeleteNode:()=>{console.log("TODO")},onIsDraggingStateChanged:C,onFinishAnnoCreate:b,onMoving:p,onMoved:E});case g.Polygon:return d(Y,{annotationSettings:u,coordinates:n,isSelected:s,isDisabled:P,pageToStageOffset:l,annotationMode:t,svgScale:i,svgTranslation:f,style:c,onAddNode:D,onDeleteNode:D,onMoving:p,onMoved:E,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:u.canLabel,labels:T,color:y,isSelected:s,selectedLabelIds:r.labelIds,style:c,svgScale:i,onLabelIconClicked:w}),z()]})};export{fo as default};