lost-sia/dist/Toolbar/ToolbarItems/ImageToolItems/ImageLabelInput.js

Single Image Annotation Tool

import{jsx as r,jsxs as s}from"react/jsx-runtime";import{useState as C}from"react";import{CTooltip as L,CDropdown as w,CDropdownToggle as v,CDropdownMenu as T,CFormInput as x,CDropdownDivider as y,CDropdownItem as d}from"@coreui/react";import{FontAwesomeIcon as D}from"@fortawesome/react-fontawesome";import{faTag as b}from"@fortawesome/free-solid-svg-icons";import F from"./TagLabel.js";const M=({isDisabled:c,isVisible:m,selectedLabelsIds:t,possibleLabels:n,isMultilabel:p=!1,onLabelSelect:u})=>{const[i,f]=C(""),a=n.filter(e=>e.name.toLowerCase().includes(i.toLowerCase())),g=e=>{let o=[];if(p){o=[...t];const l=t.indexOf(e.id);l!==-1?o.splice(l,1):o.push(e.id)}else o=[e.id];u(o)},h=()=>n.filter(o=>t.includes(o.id));return r(L,{content:"Add Image Label",children:s(w,{visible:m,autoClose:!1,children:[r(v,{variant:"outline",caret:!1,color:c?"secondary":"primary",style:{paddingTop:0,paddingBottom:0},as:"div",children:t.length===0?r("div",{style:{marginTop:6},children:r(D,{icon:b})}):h().map(o=>r(F,{name:o.name,color:o.color,size:25,triangleSize:17,style:{marginLeft:1,marginTop:5}},o.name))}),s(T,{children:[r("div",{className:"px-3 py-2",children:r(x,{placeholder:"Filter label...",value:i,onChange:e=>f(e.target.value),autoFocus:!0})}),r(y,{}),a.length>0?a.map(e=>r(d,{onClick:()=>g(e),children:e.name},e.id)):r(d,{disabled:!0,children:"No results"})]})]})})};export{M as default};