lost-sia/dist/LabelInput.js

Single Image Annotation Tool

import{jsx as l,jsxs as z}from"react/jsx-runtime";import{useState as s,useRef as B,useEffect as h}from"react";import{Popup as F,Ref as G,Dropdown as J,Header as O}from"semantic-ui-react";const W=({defaultLabel:f,disabled:L,focusOnRender:g,initLabelIds:o,multilabels:i,possibleLabelsProp:a,relatedId:P,renderPopup:_,visible:c,open:D,onClose:b,onLabelConfirmed:m,onLabelUpdate:v})=>{const[r,u]=s([]),[y,K]=s([]),[R,k]=s(!0),[p,j]=s(0),d=B(null);h(()=>{S()},[]),h(()=>{o&&k(!0)},[o]),h(()=>{c&&g&&d.current&&d.current.click(),p!==0&&(x(r),w()),o&&R&&(k(!1),o.length>0?u(o):u([]))},[c,g,r,p,a,o,P]);const H=e=>{e.stopPropagation(),A(e.key)},N=(e,n)=>{let t;i?t=n.value!==-1?n.value:[]:t=n.value!==-1?[n.value]:[],u(t),x(t)},C=(e,n)=>{I()},S=()=>{let e=[],n;f?Number.isInteger(f)?n=void 0:n=f:n="no label",a.length>0&&(e=a.map(t=>({key:t.id,value:t.id,text:t.label,content:l("div",{onClick:q=>C(q,t.id),children:t.label})}))),n&&e.unshift({key:-1,value:-1,text:n,content:l("div",{onClick:t=>C(),children:n})}),K(e)},A=e=>{switch(e){case"Enter":i||c&&I();break;case"Escape":w();break}},x=e=>{v&&v(e.filter(n=>n!==-1))},I=()=>{j(p+1)},w=()=>{m&&m(r.filter(e=>e!==-1)),b&&b()},E=()=>{let e;return i?e=r:e=r.length>0?r[0]:-1,l(G,{innerRef:d,children:l(J,{multiple:i,search:!0,selection:!0,closeOnChange:!0,icon:"search",options:y,placeholder:"Enter label",tabIndex:0,onKeyDown:n=>H(n),value:e,onChange:(n,t)=>N(n,t),style:{opacity:.8},disabled:L,open:D})})},M=()=>{if(!r)return null;let e;return r.length>0&&(e=y.find(n=>r[r.length-1]===n.id)),e?z("div",{children:[l(O,{children:e.label}),l("div",{dangerouslySetInnerHTML:{__html:e.description}})]}):"No label"},T=()=>l("div",{children:M()});return c?_?l(F,{trigger:E(),content:T(),open:!0,position:"right center",style:{opacity:.9}}):E():null};export{W as default};