pkg-components
Version:
2 lines (1 loc) • 2.6 kB
JavaScript
import{a as h,j as i}from"./jsx-runtime-DI8_P1Ft.js";import{P as l}from"./index-B3IC6ylx.js";import{r as y}from"./index-DPzuYzxM.js";import{v as _}from"./index-CIjh_EDQ.js";import"./index-XORxt8qY.js";import{T as I}from"./index-DH2uhswi.js";const f=({label:p,id:o,name:n,placeholder:V,error:m,onChange:s,defaultTags:g,emailValidation:v})=>{const[c,d]=y.useState(""),[t,u]=y.useState(g||[]),[q,T]=y.useState(!1),N=a=>{d(a.target.value),s(n,t)},k=a=>{const e=t.filter(r=>r!==a);u(e),s(n,e)},b=a=>{if(a.preventDefault(),a.target.value!==""&&a.target.value!==","){if(a.key===","){const e=c.trim().split(",")[0];if(v){if(!t.includes(e)&&e!==""&&_(e)){const r=[...t,e];u(r),s(n,r)}}else if(!t.includes(e)&&e!==""){const r=[...t,e];u(r),s(n,r)}d("")}else if(a.key==="Enter"){const e=c.trim();if(v){if(!t.includes(e)&&e!==""&&_(e)){const r=[...t,e];u(r),s(n,r)}}else if(!t.includes(e)&&e!==""){const r=[...t,e];u(r),s(n,r)}d("")}}if(a.key==="Backspace"&&t.length>0&&c===""){const e=[...t];e.pop(),u(e),s(n,e)}},x=()=>{T(!0)},E=()=>{T(!1)};return h("div",{className:q?"tags-input active":"tags-input",children:[p&&i("label",{htmlFor:o||n,children:p}),i("div",{className:"tags-input__wrapper",children:h("div",{className:"tags-input__tags",children:[t.map(a=>i(I,{className:"tag",label:a,children:i("span",{onClick:()=>k(a),children:i("i",{className:"fas",children:"X"})})},a)),i("input",{autoComplete:"off",id:o||n,name:n,onBlur:E,onChange:N,onFocus:x,onKeyDown:a=>a.key==="Enter"&&a.preventDefault(),onKeyPress:a=>a.key==="Enter"&&a.preventDefault(),onKeyUp:b,placeholder:V,type:"text",value:c})]})}),m&&i("div",{className:"error",children:m})]})};f.propTypes={defaultTags:l.any,emailValidation:l.any,error:l.any,id:l.any,label:l.any,name:l.any,onChange:l.func,placeholder:l.any};try{f.displayName="TagsInput",f.__docgenInfo={description:"",displayName:"TagsInput",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"any"}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"any"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"any"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!0,type:{name:"any"}},error:{defaultValue:null,description:"",name:"error",required:!0,type:{name:"any"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"any"}},defaultTags:{defaultValue:null,description:"",name:"defaultTags",required:!0,type:{name:"any"}},emailValidation:{defaultValue:null,description:"",name:"emailValidation",required:!0,type:{name:"any"}}}}}catch{}export{f as T};