emblor-maintained
Version:
A full featured, unstyled tag input component for React
2 lines • 24.9 kB
JavaScript
var at=Object.create;var Le=Object.defineProperty;var it=Object.getOwnPropertyDescriptor;var st=Object.getOwnPropertyNames;var dt=Object.getPrototypeOf,lt=Object.prototype.hasOwnProperty;var ut=(o,d)=>{for(var i in d)Le(o,i,{get:d[i],enumerable:!0})},Ve=(o,d,i,p)=>{if(d&&typeof d=="object"||typeof d=="function")for(let n of st(d))!lt.call(o,n)&&n!==i&&Le(o,n,{get:()=>d[n],enumerable:!(p=it(d,n))||p.enumerable});return o};var U=(o,d,i)=>(i=o!=null?at(dt(o)):{},Ve(d||!o||!o.__esModule?Le(i,"default",{value:o,enumerable:!0}):i,o)),gt=o=>Ve(Le({},"__esModule",{value:!0}),o);var mt={};ut(mt,{Delimiter:()=>_e,TagInput:()=>Je});module.exports=gt(mt);var b=U(require("react"));var Ce=U(require("react"));var $e=require("clsx"),We=require("tailwind-merge");function g(...o){return(0,We.twMerge)((0,$e.clsx)(o))}function Oe(){return crypto.getRandomValues(new Uint32Array(1))[0].toString()}var Y=(0,Ce.forwardRef)(({className:o,type:d,...i},p)=>Ce.default.createElement("input",{type:d,className:g("flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",o),ref:p,...i}));Y.displayName="Input";var Ee=U(require("react")),Ke=require("@radix-ui/react-slot"),Ge=require("class-variance-authority");var pt=(0,Ge.cva)("inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",{variants:{variant:{default:"bg-primary text-primary-foreground shadow hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",outline:"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2",sm:"h-8 rounded-md px-3 text-xs",lg:"h-10 rounded-md px-8",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),_=Ee.forwardRef(({className:o,variant:d,size:i,asChild:p=!1,...n},c)=>Ee.createElement(p?Ke.Slot:"button",{className:g(pt({variant:d,size:i,className:o})),ref:c,...n}));_.displayName="Button";var v=U(require("react"));var Te=U(require("react")),q=U(require("@radix-ui/react-popover"));var ke=q.Root,Ne=q.Trigger;var he=Te.forwardRef(({className:o,align:d="center",sideOffset:i=4,...p},n)=>Te.createElement(q.Portal,null,Te.createElement(q.Content,{ref:n,align:d,sideOffset:i,className:g("z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",o),...p})));he.displayName=q.Content.displayName;var A=U(require("react"));var le=U(require("react"));var Ue=require("class-variance-authority"),ct=(0,Ue.cva)("transition-all border inline-flex items-center text-sm pl-2 rounded-md",{variants:{variant:{default:"bg-secondary text-secondary-foreground hover:bg-secondary/80 disabled:cursor-not-allowed disabled:opacity-50",primary:"bg-primary border-primary text-primary-foreground hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-50",destructive:"bg-destructive border-destructive text-destructive-foreground hover:bg-destructive/90 disabled:cursor-not-allowed disabled:opacity-50"},size:{sm:"text-xs h-7",md:"text-sm h-8",lg:"text-base h-9",xl:"text-lg h-10"},shape:{default:"rounded-sm",rounded:"rounded-lg",square:"rounded-none",pill:"rounded-full"},borderStyle:{default:"border-solid",none:"border-none",dashed:"border-dashed",dotted:"border-dotted",double:"border-double"},textCase:{uppercase:"uppercase",lowercase:"lowercase",capitalize:"capitalize"},interaction:{clickable:"cursor-pointer hover:shadow-md",nonClickable:"cursor-default"},animation:{none:"",fadeIn:"animate-fadeIn",slideIn:"animate-slideIn",bounce:"animate-bounce"},textStyle:{normal:"font-normal",bold:"font-bold",italic:"italic",underline:"underline",lineThrough:"line-through"}},defaultVariants:{variant:"default",size:"md",shape:"default",borderStyle:"default",interaction:"nonClickable",animation:"fadeIn",textStyle:"normal"}}),xe=({tagObj:o,direction:d,draggable:i,onTagClick:p,onRemoveTag:n,variant:c,size:P,shape:k,borderStyle:R,textCase:r,interaction:x,animation:t,textStyle:H,isActiveTag:T,tagClasses:h,disabled:C})=>le.default.createElement("span",{key:o.id,draggable:i,className:g(ct({variant:c,size:P,shape:k,borderStyle:R,textCase:r,interaction:x,animation:t,textStyle:H}),{"justify-between w-full":d==="column","cursor-pointer":i,"ring-ring ring-offset-2 ring-2 ring-offset-background":T},h==null?void 0:h.body),onClick:()=>p==null?void 0:p(o)},o.text,le.default.createElement(_,{type:"button",variant:"ghost",onClick:B=>{B.stopPropagation(),n(o.id)},disabled:C,className:g("py-1 px-3 h-full hover:bg-transparent",h==null?void 0:h.closeButton)},le.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"lucide lucide-x"},le.default.createElement("path",{d:"M18 6 6 18"}),le.default.createElement("path",{d:"m6 6 12 12"}))));var ue=U(require("react-easy-sort"));var qe=()=>A.default.createElement("div",{className:g("h-full rounded-md bg-secondary/50")}),ge=({tags:o,customTagRenderer:d,direction:i,draggable:p,onSortEnd:n,className:c,inlineTags:P,activeTagIndex:k,setActiveTagIndex:R,classStyleProps:r,disabled:x,...t})=>{var B,F;let[H,T]=A.default.useState(null),h=l=>{T(l)},C=()=>{T(null)};return A.default.createElement(A.default.Fragment,null,P?A.default.createElement(A.default.Fragment,null,p?A.default.createElement(ue.default,{onSortEnd:n,className:"flex flex-wrap gap-2 list",dropTarget:A.default.createElement(qe,null)},o.map((l,I)=>A.default.createElement(ue.SortableItem,{key:l.id},A.default.createElement("div",{onMouseDown:()=>h(l.id),onMouseLeave:C,className:g({"border border-solid border-primary rounded-md":H===l.id},"transition-all duration-200 ease-in-out")},d?d(l,I===k):A.default.createElement(xe,{tagObj:l,isActiveTag:I===k,direction:i,draggable:p,tagClasses:r==null?void 0:r.tagClasses,...t,disabled:x}))))):o.map((l,I)=>d?d(l,I===k):A.default.createElement(xe,{key:l.id,tagObj:l,isActiveTag:I===k,direction:i,draggable:p,tagClasses:r==null?void 0:r.tagClasses,...t,disabled:x}))):A.default.createElement("div",{className:g("rounded-md w-full",{"flex flex-wrap gap-2":i==="row","flex flex-col gap-2":i==="column"},(B=r==null?void 0:r.tagListClasses)==null?void 0:B.container)},p?A.default.createElement(ue.default,{onSortEnd:n,className:`flex flex-wrap gap-2 list ${(F=r==null?void 0:r.tagListClasses)==null?void 0:F.sortableList}`,dropTarget:A.default.createElement(qe,null)},o.map((l,I)=>A.default.createElement(ue.SortableItem,{key:l.id},A.default.createElement("div",{onMouseDown:()=>h(l.id),onMouseLeave:C,className:g({"border border-solid border-primary rounded-md":H===l.id},"transition-all duration-200 ease-in-out")},d?d(l,I===k):A.default.createElement(xe,{tagObj:l,isActiveTag:I===k,direction:i,draggable:p,tagClasses:r==null?void 0:r.tagClasses,...t,disabled:x}))))):o.map((l,I)=>d?d(l,I===k):A.default.createElement(xe,{key:l.id,tagObj:l,isActiveTag:I===k,direction:i,draggable:p,tagClasses:r==null?void 0:r.tagClasses,...t,disabled:x}))))};var Pe=({children:o,tags:d,customTagRenderer:i,activeTagIndex:p,setActiveTagIndex:n,classStyleProps:c,disabled:P,usePortal:k,...R})=>{var K,z;let r=(0,v.useRef)(null),x=(0,v.useRef)(null),t=(0,v.useRef)(null),H=(0,v.useRef)(null),[T,h]=(0,v.useState)(0),[C,B]=(0,v.useState)(!1),[F,l]=(0,v.useState)(!1),[I,O]=(0,v.useState)(0);(0,v.useEffect)(()=>{let w=()=>{var E;r.current&&x.current&&(h(r.current.offsetWidth),O(r.current.offsetWidth-((E=x==null?void 0:x.current)==null?void 0:E.offsetWidth)))};return w(),window.addEventListener("resize",w),()=>window.removeEventListener("resize",w)},[r,x]),(0,v.useEffect)(()=>{let w=E=>{C&&r.current&&t.current&&!r.current.contains(E.target)&&!t.current.contains(E.target)&&B(!1)};return document.addEventListener("mousedown",w),()=>{document.removeEventListener("mousedown",w)}},[C]);let Z=(0,v.useCallback)(w=>{var E;w&&r.current&&h(r.current.offsetWidth),w&&((E=H.current)==null||E.focus(),B(w))},[F]),pe=w=>{C&&l(!0);let E=o.props.onFocus;E&&E(w)},S=w=>{l(!1),C||B(!1);let E=o.props.onBlur;E&&E(w)};return v.default.createElement(ke,{open:C,onOpenChange:Z,modal:k},v.default.createElement("div",{className:"relative flex items-center rounded-md border border-input bg-transparent pr-3",ref:r},v.default.cloneElement(o,{onFocus:pe,onBlur:S,ref:H}),v.default.createElement(Ne,{asChild:!0},v.default.createElement(_,{ref:x,variant:"ghost",size:"icon",role:"combobox",className:g("hover:bg-transparent",(K=c==null?void 0:c.popoverClasses)==null?void 0:K.popoverTrigger),onClick:()=>B(!C)},v.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:`lucide lucide-chevron-down h-4 w-4 shrink-0 opacity-50 ${C?"rotate-180":"rotate-0"}`},v.default.createElement("path",{d:"m6 9 6 6 6-6"}))))),v.default.createElement(he,{ref:t,className:g("w-full space-y-3",(z=c==null?void 0:c.popoverClasses)==null?void 0:z.popoverContent),style:{marginLeft:`-${I}px`,width:`${T}px`}},v.default.createElement("div",{className:"space-y-1"},v.default.createElement("h4",{className:"text-sm font-medium leading-none"},"Entered Tags"),v.default.createElement("p",{className:"text-sm text-muted-foregrounsd text-left"},"These are the tags you've entered.")),v.default.createElement(ge,{tags:d,customTagRenderer:i,activeTagIndex:p,setActiveTagIndex:n,classStyleProps:{tagListClasses:c==null?void 0:c.tagListClasses,tagClasses:c==null?void 0:c.tagClasses},...R,disabled:P})))};var s=U(require("react"));var Se=({tags:o,setTags:d,setInputValue:i,setTagCount:p,autocompleteOptions:n,maxTags:c,onTagAdd:P,onTagRemove:k,allowDuplicates:R,inlineTags:r,children:x,classStyleProps:t,usePortal:H})=>{let T=(0,s.useRef)(null),h=(0,s.useRef)(null),C=(0,s.useRef)(null),B=(0,s.useRef)(null),[F,l]=(0,s.useState)(0),[I,O]=(0,s.useState)(!1),[Z,pe]=(0,s.useState)(!1),[S,K]=(0,s.useState)(0),[z,w]=(0,s.useState)(-1);(0,s.useEffect)(()=>{var u,m;!T.current||!h.current||K(((u=T.current)==null?void 0:u.getBoundingClientRect().bottom)-((m=h.current)==null?void 0:m.getBoundingClientRect().bottom))},[o]),(0,s.useEffect)(()=>{let u=m=>{I&&T.current&&B.current&&!T.current.contains(m.target)&&!B.current.contains(m.target)&&O(!1)};return document.addEventListener("mousedown",u),()=>{document.removeEventListener("mousedown",u)}},[I]);let E=(0,s.useCallback)(u=>{var m;if(u&&T.current){let{width:N}=T.current.getBoundingClientRect();l(N)}u&&((m=C.current)==null||m.focus(),O(u))},[Z]),J=u=>{if(T.current){let{width:N}=T.current.getBoundingClientRect();l(N),O(!0)}I&&pe(!0);let m=x.props.onFocus;m&&m(u)},Q=u=>{pe(!1),I||O(!1);let m=x.props.onBlur;m&&m(u)},j=u=>{if(I)switch(u.key){case"ArrowUp":u.preventDefault(),w(m=>m<=0?n.length-1:m-1);break;case"ArrowDown":u.preventDefault(),w(m=>m===n.length-1?0:m+1);break;case"Enter":u.preventDefault(),z!==-1&&(te(n[z]),w(-1));break}},te=u=>{let m=o.findIndex(N=>N.text===u.text);if(m>=0){let N=o.filter((G,we)=>we!==m);d(N),p(G=>G-1),k&&k(u.text)}else{if(!R&&o.some(N=>N.text===u.text))return;(!c||o.length<c)&&(d([...o,u]),p(N=>N+1),i(""),P&&P(u.text))}w(-1)},ee=s.default.cloneElement(x,{onKeyDown:j,onFocus:J,onBlur:Q,ref:C});return s.default.createElement("div",{className:g("flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",t==null?void 0:t.command)},s.default.createElement(ke,{open:I,onOpenChange:E,modal:H},s.default.createElement("div",{className:"relative h-full flex items-center rounded-md border bg-transparent pr-3",ref:T},ee,s.default.createElement(Ne,{asChild:!0,ref:h},s.default.createElement(_,{variant:"ghost",size:"icon",role:"combobox",className:g(`hover:bg-transparent ${r?"":"ml-auto"}`,t==null?void 0:t.popoverTrigger),onClick:()=>{O(!I)}},s.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:`lucide lucide-chevron-down h-4 w-4 shrink-0 opacity-50 ${I?"rotate-180":"rotate-0"}`},s.default.createElement("path",{d:"m6 9 6 6 6-6"}))))),s.default.createElement(he,{ref:B,side:"bottom",align:"start",forceMount:!0,className:g("p-0 relative",t==null?void 0:t.popoverContent),style:{top:`${S}px`,marginLeft:`calc(-${F}px + 36px)`,width:`${F}px`,minWidth:`${F}px`,zIndex:9999}},s.default.createElement("div",{className:g("max-h-[300px] overflow-y-auto overflow-x-hidden",t==null?void 0:t.commandList),style:{minHeight:"68px"},key:n.length},n.length>0?s.default.createElement("div",{key:n.length,role:"group",className:g("overflow-y-auto overflow-hidden p-1 text-foreground",t==null?void 0:t.commandGroup),style:{minHeight:"68px"}},s.default.createElement("span",{className:"text-muted-foreground font-medium text-sm py-1.5 px-2 pb-2"},"Suggestions"),s.default.createElement("div",{role:"separator",className:"py-0.5"}),n.map((u,m)=>{let N=m===z;return s.default.createElement("div",{key:u.id,role:"option","aria-selected":N,className:g("relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 hover:bg-accent",N&&"bg-accent text-accent-foreground",t==null?void 0:t.commandItem),"data-value":u.text,onClick:()=>te(u)},s.default.createElement("div",{className:"w-full flex items-center gap-2"},u.text,o.some(G=>G.text===u.text)&&s.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"lucide lucide-check"},s.default.createElement("path",{d:"M20 6 9 17l-5-5"}))))})):s.default.createElement("div",{className:"py-6 text-center text-sm"},"No results found.")))))};var _e=(i=>(i.Comma=",",i.Enter="Enter",i))(_e||{}),Je=b.default.forwardRef((o,d)=>{var Fe,ye,He,De,Re,ze;let{id:i,placeholder:p,tags:n,setTags:c,variant:P,size:k,shape:R,enableAutocomplete:r,autocompleteOptions:x,maxTags:t,delimiter:H=",",onTagAdd:T,onTagRemove:h,allowDuplicates:C,showCount:B,validateTag:F,placeholderWhenFull:l="Max tags reached",sortTags:I,delimiterList:O,truncate:Z,autocompleteFilter:pe,borderStyle:S,textCase:K,interaction:z,animation:w,textStyle:E,minLength:J,maxLength:Q,direction:j="row",onInputChange:te,customTagRenderer:ee,onFocus:u,onBlur:m,onTagClick:N,draggable:G=!1,inputFieldPosition:we="bottom",clearAll:Qe=!1,onClearAll:Ie,usePopoverForTags:Ae=!1,inputProps:ne={},restrictTagsToAutocompleteOptions:Be,inlineTags:X=!0,addTagsOnBlur:Xe=!1,activeTagIndex:D,setActiveTagIndex:y,styleClasses:e={},disabled:W=!1,usePortal:Ye=!1,addOnPaste:Ze=!1,generateTagId:Me=Oe}=o,[V,ce]=b.default.useState(""),[je,oe]=b.default.useState(Math.max(0,n.length)),re=b.default.useRef(null);if(t!==void 0&&t<0||o.minTags!==void 0&&o.minTags<0)return console.warn("maxTags and minTags cannot be less than 0"),null;let ae=f=>{let a=f.target.value;Ze&&a.includes(H)?(a.split(H).map(M=>M.trim()).filter(M=>M).forEach(M=>{if(!M)return;let $=M.trim();if(Be&&!(x!=null&&x.some(be=>be.text===$))){console.warn("Tag not allowed as per autocomplete options");return}if(F&&!F($)){console.warn("Invalid tag as per validateTag");return}if(J&&$.length<J){console.warn(`Tag "${$}" is too short`);return}if(Q&&$.length>Q){console.warn(`Tag "${$}" is too long`);return}let ot=Me();if(C||!n.some(be=>be.text===$))if(t===void 0||n.length<t){let be={id:ot,text:$};c(rt=>[...rt,be]),T==null||T($)}else console.warn("Reached the maximum number of tags allowed");else console.warn(`Duplicate tag "${$}" not added`)}),ce("")):ce(a),te==null||te(a)},ie=f=>{y(null),u==null||u(f)},se=f=>{if(Xe&&V.trim()){let a=V.trim();if(F&&!F(a))return;if(J&&a.length<J){console.warn("Tag is too short");return}if(Q&&a.length>Q){console.warn("Tag is too long");return}if((C||!n.some(L=>L.text===a))&&(t===void 0||n.length<t)){let L=Me();c([...n,{id:L,text:a}]),T==null||T(a),oe(M=>M+1),ce("")}}m==null||m(f)},de=f=>{if(O?O.includes(f.key):f.key===H||f.key==="Enter"){f.preventDefault();let a=V.trim();if(Be&&!(x!=null&&x.some(M=>M.text===a))||F&&!F(a))return;if(J&&a.length<J){console.warn("Tag is too short");return}if(Q&&a.length>Q){console.warn("Tag is too long");return}let L=Me();a&&(C||!n.some(M=>M.text===a))&&(t===void 0||n.length<t)&&(c([...n,{id:L,text:a}]),T==null||T(a),oe(M=>M+1)),ce("")}else switch(f.key){case"Delete":if(D!==null){f.preventDefault();let a=[...n];a.splice(D,1),c(a),y(L=>a.length===0?null:L>=a.length?a.length-1:L),oe(L=>L-1),h==null||h(n[D].text)}break;case"Backspace":if(D!==null){f.preventDefault();let a=[...n];a.splice(D,1),c(a),y(L=>L===0?null:L-1),oe(L=>L-1),h==null||h(n[D].text)}break;case"ArrowRight":f.preventDefault(),y(D===null?0:a=>a+1>=n.length?0:a+1);break;case"ArrowLeft":f.preventDefault(),y(D===null?n.length-1:a=>a===0?n.length-1:a-1);break;case"Home":f.preventDefault(),y(0);break;case"End":f.preventDefault(),y(n.length-1);break}},me=f=>{var a;c(n.filter(L=>L.id!==f)),h==null||h(((a=n.find(L=>L.id===f))==null?void 0:a.text)||""),oe(L=>L-1)},fe=(f,a)=>{c(L=>{let M=[...L],[$]=M.splice(f,1);return M.splice(a,0,$),M})},et=()=>{if(!Ie){y(-1),c([]);return}Ie==null||Ie()},tt=(0,b.useMemo)(()=>(x||[]).filter(f=>f.text.toLowerCase().includes(V?V.toLowerCase():"")),[V,x]),nt=I?[...n].sort():n,ve=Z?n.map(f=>{var a;return{id:f.id,text:((a=f.text)==null?void 0:a.length)>Z?`${f.text.substring(0,Z)}...`:f.text}}):nt;return b.default.createElement("div",{className:`w-full flex ${!X&&n.length>0?"gap-3":""} ${we==="bottom"?"flex-col":we==="top"?"flex-col-reverse":"flex-row"}`},!Ae&&(X?!r&&b.default.createElement("div",{className:"w-full"},b.default.createElement("div",{className:g("flex flex-row flex-wrap items-center gap-2 p-2 w-full rounded-md border border-input bg-background text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",e==null?void 0:e.inlineTagsContainer)},b.default.createElement(ge,{tags:ve,customTagRenderer:ee,variant:P,size:k,shape:R,borderStyle:S,textCase:K,interaction:z,animation:w,textStyle:E,onTagClick:N,draggable:G,onSortEnd:fe,onRemoveTag:me,direction:j,inlineTags:X,activeTagIndex:D,setActiveTagIndex:y,classStyleProps:{tagListClasses:e==null?void 0:e.tagList,tagClasses:e==null?void 0:e.tag},disabled:W}),b.default.createElement(Y,{ref:re,id:i,type:"text",placeholder:t!==void 0&&n.length>=t?l:p,value:V,onChange:ae,onKeyDown:de,onFocus:ie,onBlur:se,...ne,className:g("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit",e==null?void 0:e.input),autoComplete:r?"on":"off",list:r?"autocomplete-options":void 0,disabled:W||t!==void 0&&n.length>=t}))):b.default.createElement(ge,{tags:ve,customTagRenderer:ee,variant:P,size:k,shape:R,borderStyle:S,textCase:K,interaction:z,animation:w,textStyle:E,onTagClick:N,draggable:G,onSortEnd:fe,onRemoveTag:me,direction:j,inlineTags:X,activeTagIndex:D,setActiveTagIndex:y,classStyleProps:{tagListClasses:e==null?void 0:e.tagList,tagClasses:e==null?void 0:e.tag},disabled:W})),r?b.default.createElement("div",{className:"w-full"},b.default.createElement(Se,{tags:n,setTags:c,setInputValue:ce,autocompleteOptions:tt,setTagCount:oe,maxTags:t,onTagAdd:T,onTagRemove:h,allowDuplicates:C!=null?C:!1,inlineTags:X,usePortal:Ye,classStyleProps:{command:(Fe=e==null?void 0:e.autoComplete)==null?void 0:Fe.command,popoverTrigger:(ye=e==null?void 0:e.autoComplete)==null?void 0:ye.popoverTrigger,popoverContent:(He=e==null?void 0:e.autoComplete)==null?void 0:He.popoverContent,commandList:(De=e==null?void 0:e.autoComplete)==null?void 0:De.commandList,commandGroup:(Re=e==null?void 0:e.autoComplete)==null?void 0:Re.commandGroup,commandItem:(ze=e==null?void 0:e.autoComplete)==null?void 0:ze.commandItem}},Ae?b.default.createElement(Pe,{tags:ve,customTagRenderer:ee,variant:P,size:k,shape:R,borderStyle:S,textCase:K,interaction:z,animation:w,textStyle:E,onTagClick:N,draggable:G,onSortEnd:fe,onRemoveTag:me,direction:j,activeTagIndex:D,setActiveTagIndex:y,classStyleProps:{popoverClasses:e==null?void 0:e.tagPopover,tagListClasses:e==null?void 0:e.tagList,tagClasses:e==null?void 0:e.tag},disabled:W},b.default.createElement(Y,{ref:re,id:i,type:"text",placeholder:t!==void 0&&n.length>=t?l:p,value:V,onChange:ae,onKeyDown:de,onFocus:ie,onBlur:se,...ne,className:g("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit",e==null?void 0:e.input),autoComplete:r?"on":"off",list:r?"autocomplete-options":void 0,disabled:W||t!==void 0&&n.length>=t})):X?b.default.createElement("div",{className:g("flex flex-row flex-wrap items-center p-2 gap-2 h-fit w-full bg-background text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",e==null?void 0:e.inlineTagsContainer)},b.default.createElement(ge,{tags:ve,customTagRenderer:ee,variant:P,size:k,shape:R,borderStyle:S,textCase:K,interaction:z,animation:w,textStyle:E,onTagClick:N,draggable:G,onSortEnd:fe,onRemoveTag:me,direction:j,inlineTags:X,activeTagIndex:D,setActiveTagIndex:y,classStyleProps:{tagListClasses:e==null?void 0:e.tagList,tagClasses:e==null?void 0:e.tag},disabled:W}),b.default.createElement(Y,{ref:re,id:i,type:"text",placeholder:t!==void 0&&n.length>=t?l:p,value:V,onChange:ae,onKeyDown:de,onFocus:ie,onBlur:se,...ne,className:g("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit",e==null?void 0:e.input),autoComplete:r?"on":"off",list:r?"autocomplete-options":void 0,disabled:W||t!==void 0&&n.length>=t})):b.default.createElement(Y,{ref:re,id:i,type:"text",placeholder:t!==void 0&&n.length>=t?l:p,value:V,onChange:ae,onKeyDown:de,onFocus:ie,onBlur:se,...ne,className:g("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit",e==null?void 0:e.input),autoComplete:r?"on":"off",list:r?"autocomplete-options":void 0,disabled:W||t!==void 0&&n.length>=t}))):b.default.createElement("div",{className:"w-full"},Ae?b.default.createElement(Pe,{tags:ve,customTagRenderer:ee,variant:P,size:k,shape:R,borderStyle:S,textCase:K,interaction:z,animation:w,textStyle:E,onTagClick:N,draggable:G,onSortEnd:fe,onRemoveTag:me,direction:j,activeTagIndex:D,setActiveTagIndex:y,classStyleProps:{popoverClasses:e==null?void 0:e.tagPopover,tagListClasses:e==null?void 0:e.tagList,tagClasses:e==null?void 0:e.tag},disabled:W},b.default.createElement(Y,{ref:re,id:i,type:"text",placeholder:t!==void 0&&n.length>=t?l:p,value:V,onChange:ae,onKeyDown:de,onFocus:ie,onBlur:se,...ne,autoComplete:r?"on":"off",list:r?"autocomplete-options":void 0,disabled:W||t!==void 0&&n.length>=t,className:g("border-0 w-full",e==null?void 0:e.input)})):X?null:b.default.createElement(Y,{ref:re,id:i,type:"text",placeholder:t!==void 0&&n.length>=t?l:p,value:V,onChange:ae,onKeyDown:de,onFocus:ie,onBlur:se,...ne,className:g(e==null?void 0:e.input),autoComplete:r?"on":"off",list:r?"autocomplete-options":void 0,disabled:W||t!==void 0&&n.length>=t})),B&&t&&b.default.createElement("div",{className:"flex"},b.default.createElement("span",{className:"text-muted-foreground text-sm mt-1 ml-auto"},`${je}`,"/",`${t}`)),Qe&&b.default.createElement(_,{type:"button",onClick:et,className:g("mt-2",e==null?void 0:e.clearAllButton)},"Clear All"))});Je.displayName="TagInput";0&&(module.exports={Delimiter,TagInput});
//# sourceMappingURL=index.js.map