tagmento/dist/index.js

A highly customizable, accessible tag input component built with shadcn/ui

'use strict';var p=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),reactSlot=require('@radix-ui/react-slot'),classVarianceAuthority=require('class-variance-authority'),K=require('@radix-ui/react-popover'),Be=require('react-easy-sort');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var p__namespace=/*#__PURE__*/_interopNamespace(p);var K__namespace=/*#__PURE__*/_interopNamespace(K);var Be__default=/*#__PURE__*/_interopDefault(Be);function r(...s){return tailwindMerge.twMerge(clsx.clsx(s))}function Ae(){return crypto.getRandomValues(new Uint32Array(1))[0].toString()}function j({className:s,type:c,...i}){return p__namespace.createElement("input",{type:c,"data-slot":"input",className:r("border-input file:text-foreground placeholder:text-muted-foreground/70 flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50","focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]","aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",c==="search"&&"[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none",c==="file"&&"text-muted-foreground/70 file:border-input file:text-foreground p-0 pr-3 italic file:me-3 file:h-full file:border-0 file:border-r file:border-solid file:bg-transparent file:px-3 file:text-sm file:font-medium file:not-italic",s),...i})}var et=classVarianceAuthority.cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-[color,box-shadow] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",{variants:{variant:{default:"bg-primary text-primary-foreground shadow-sm hover:bg-primary/90",destructive:"bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",outline:"border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground shadow-xs 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:"size-9"}},defaultVariants:{variant:"default",size:"default"}});function J({className:s,variant:c,size:i,asChild:g=false,...e}){return p__namespace.createElement(g?reactSlot.Slot:"button",{"data-slot":"button",className:r(et({variant:c,size:i,className:s})),...e})}var Ce=K__namespace.Root,we=K__namespace.Trigger;var fe=p__namespace.forwardRef(({className:s,align:c="center",sideOffset:i=4,...g},e)=>p__namespace.createElement(K__namespace.Portal,null,p__namespace.createElement(K__namespace.Content,{ref:e,align:c,sideOffset:i,className:r("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",s),...g})));fe.displayName=K__namespace.Content.displayName;var ot=classVarianceAuthority.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"}}),be=({tagObj:s,direction:c,draggable:i,onTagClick:g,onRemoveTag:e,variant:b,size:N,shape:h,borderStyle:M,textCase:n,interaction:x,animation:t,textStyle:A,isActiveTag:T,tagClasses:k,disabled:C})=>p__namespace.default.createElement("span",{key:s.id,draggable:i,className:r(ot({variant:b,size:N,shape:h,borderStyle:M,textCase:n,interaction:x,animation:t,textStyle:A}),{"justify-between w-full":c==="column","cursor-pointer":i,"ring-ring ring-offset-2 ring-2 ring-offset-background":T},k?.body),onClick:()=>g?.(s)},s.text,p__namespace.default.createElement(J,{type:"button",variant:"ghost",onClick:a=>{a.stopPropagation(),e(s.id);},disabled:C,className:r("py-1 px-3 h-full hover:bg-transparent",k?.closeButton)},p__namespace.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"},p__namespace.default.createElement("path",{d:"M18 6 6 18"}),p__namespace.default.createElement("path",{d:"m6 6 12 12"}))));var Re=()=>p__namespace.default.createElement("div",{className:r("h-full rounded-md bg-secondary/50")}),ie=({tags:s,customTagRenderer:c,direction:i,draggable:g,onSortEnd:e,className:b,inlineTags:N,activeTagIndex:h,setActiveTagIndex:M,classStyleProps:n,disabled:x,...t})=>{let[A,T]=p__namespace.default.useState(null),k=a=>{T(a);},C=()=>{T(null);};return p__namespace.default.createElement(p__namespace.default.Fragment,null,N?p__namespace.default.createElement(p__namespace.default.Fragment,null,g?p__namespace.default.createElement(Be__default.default,{onSortEnd:e,className:"flex flex-wrap gap-2 list",dropTarget:p__namespace.default.createElement(Re,null)},s.map((a,m)=>p__namespace.default.createElement(Be.SortableItem,{key:a.id},p__namespace.default.createElement("div",{onMouseDown:()=>k(a.id),onMouseLeave:C,className:r({"border border-solid border-primary rounded-md":A===a.id},"transition-all duration-200 ease-in-out")},c?c(a,m===h):p__namespace.default.createElement(be,{tagObj:a,isActiveTag:m===h,direction:i,draggable:g,tagClasses:n?.tagClasses,...t,disabled:x}))))):s.map((a,m)=>c?c(a,m===h):p__namespace.default.createElement(be,{key:a.id,tagObj:a,isActiveTag:m===h,direction:i,draggable:g,tagClasses:n?.tagClasses,...t,disabled:x}))):p__namespace.default.createElement("div",{className:r("rounded-md w-full",{"flex flex-wrap gap-2":i==="row","flex flex-col gap-2":i==="column"},n?.tagListClasses?.container)},g?p__namespace.default.createElement(Be__default.default,{onSortEnd:e,className:`flex flex-wrap gap-2 list ${n?.tagListClasses?.sortableList}`,dropTarget:p__namespace.default.createElement(Re,null)},s.map((a,m)=>p__namespace.default.createElement(Be.SortableItem,{key:a.id},p__namespace.default.createElement("div",{onMouseDown:()=>k(a.id),onMouseLeave:C,className:r({"border border-solid border-primary rounded-md":A===a.id},"transition-all duration-200 ease-in-out")},c?c(a,m===h):p__namespace.default.createElement(be,{tagObj:a,isActiveTag:m===h,direction:i,draggable:g,tagClasses:n?.tagClasses,...t,disabled:x}))))):s.map((a,m)=>c?c(a,m===h):p__namespace.default.createElement(be,{key:a.id,tagObj:a,isActiveTag:m===h,direction:i,draggable:g,tagClasses:n?.tagClasses,...t,disabled:x}))))};var ke=({children:s,tags:c,customTagRenderer:i,activeTagIndex:g,setActiveTagIndex:e,classStyleProps:b,disabled:N,usePortal:h,...M})=>{let n=p.useRef(null),x=p.useRef(null),t=p.useRef(null),A=p.useRef(null),[T,k]=p.useState(0),[C,a]=p.useState(false),[m,B]=p.useState(false),[D,O]=p.useState(0);p.useEffect(()=>{let v=()=>{n.current&&x.current&&(k(n.current.offsetWidth),O(n.current.offsetWidth-x?.current?.offsetWidth));};return v(),window.addEventListener("resize",v),()=>window.removeEventListener("resize",v)},[n,x]),p.useEffect(()=>{let v=y=>{C&&n.current&&t.current&&!n.current.contains(y.target)&&!t.current.contains(y.target)&&a(false);};return document.addEventListener("mousedown",v),()=>{document.removeEventListener("mousedown",v);}},[C]);let Q=p.useCallback(v=>{v&&n.current&&k(n.current.offsetWidth),v&&(A.current?.focus(),a(v));},[m]),le=v=>{C&&B(true);let y=s.props.onFocus;y&&y(v);},G=v=>{B(false),C||a(false);let y=s.props.onBlur;y&&y(v);};return p__namespace.default.createElement(Ce,{open:C,onOpenChange:Q,modal:h},p__namespace.default.createElement("div",{className:"relative flex items-center rounded-md border border-input bg-transparent pr-3",ref:n},p__namespace.default.cloneElement(s,{onFocus:le,onBlur:G,ref:A}),p__namespace.default.createElement(we,{asChild:true},p__namespace.default.createElement(J,{ref:x,variant:"ghost",size:"icon",role:"combobox",className:r("hover:bg-transparent",b?.popoverClasses?.popoverTrigger),onClick:()=>a(!C)},p__namespace.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"}`},p__namespace.default.createElement("path",{d:"m6 9 6 6 6-6"}))))),p__namespace.default.createElement(fe,{ref:t,className:r("w-full space-y-3",b?.popoverClasses?.popoverContent),style:{marginLeft:`-${D}px`,width:`${T}px`}},p__namespace.default.createElement("div",{className:"space-y-1"},p__namespace.default.createElement("h4",{className:"text-sm font-medium leading-none"},"Entered Tags"),p__namespace.default.createElement("p",{className:"text-sm text-muted-foregrounsd text-left"},"These are the tags you've entered.")),p__namespace.default.createElement(ie,{tags:c,customTagRenderer:i,activeTagIndex:g,setActiveTagIndex:e,classStyleProps:{tagListClasses:b?.tagListClasses,tagClasses:b?.tagClasses},...M,disabled:N})))};var Ve=({tags:s,setTags:c,setInputValue:i,setTagCount:g,autocompleteOptions:e,maxTags:b,onTagAdd:N,onTagRemove:h,allowDuplicates:M,inlineTags:n,children:x,classStyleProps:t,usePortal:A})=>{let T=p.useRef(null),k=p.useRef(null),C=p.useRef(null),a=p.useRef(null),[m,B]=p.useState(0),[D,O]=p.useState(false),[Q,le]=p.useState(false),[G,v]=p.useState(0),[y,$]=p.useState(-1);p.useEffect(()=>{!T.current||!k.current||v(T.current?.getBoundingClientRect().bottom-k.current?.getBoundingClientRect().bottom);},[s]),p.useEffect(()=>{let l=f=>{D&&T.current&&a.current&&!T.current.contains(f.target)&&!a.current.contains(f.target)&&O(false);};return document.addEventListener("mousedown",l),()=>{document.removeEventListener("mousedown",l);}},[D]);let X=p.useCallback(l=>{if(l&&T.current){let{width:f}=T.current.getBoundingClientRect();B(f);}l&&(C.current?.focus(),O(l));},[Q]),_=l=>{if(T.current){let{width:P}=T.current.getBoundingClientRect();B(P),O(true);}D&&le(true);let f=x.props.onFocus;f&&f(l);},U=l=>{le(false),D||O(false);let f=x.props.onBlur;f&&f(l);},Y=l=>{if(D)switch(l.key){case "ArrowUp":l.preventDefault(),$(f=>f<=0?e.length-1:f-1);break;case "ArrowDown":l.preventDefault(),$(f=>f===e.length-1?0:f+1);break;case "Enter":l.preventDefault(),y!==-1&&(Te(e[y]),$(-1));break}},Te=l=>{let f=s.findIndex(P=>P.text===l.text);if(f>=0){let P=s.filter((W,xe)=>xe!==f);c(P),g(W=>W-1),h&&h(l.text);}else {if(!M&&s.some(P=>P.text===l.text))return;(!b||s.length<b)&&(c([...s,l]),g(P=>P+1),i(""),N&&N(l.text));}$(-1);},Z=p__namespace.default.cloneElement(x,{onKeyDown:Y,onFocus:_,onBlur:U,ref:C});return p__namespace.default.createElement("div",{className:r("flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",t?.command)},p__namespace.default.createElement(Ce,{open:D,onOpenChange:X,modal:A},p__namespace.default.createElement("div",{className:"relative h-full flex items-center rounded-md border bg-transparent pr-3",ref:T},Z,p__namespace.default.createElement(we,{asChild:true,ref:k},p__namespace.default.createElement(J,{variant:"ghost",size:"icon",role:"combobox",className:r(`hover:bg-transparent ${n?"":"ml-auto"}`,t?.popoverTrigger),onClick:()=>{O(!D);}},p__namespace.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 ${D?"rotate-180":"rotate-0"}`},p__namespace.default.createElement("path",{d:"m6 9 6 6 6-6"}))))),p__namespace.default.createElement(fe,{ref:a,side:"bottom",align:"start",forceMount:true,className:r("p-0 relative",t?.popoverContent),style:{top:`${G}px`,marginLeft:`calc(-${m}px + 36px)`,width:`${m}px`,minWidth:`${m}px`,zIndex:9999}},p__namespace.default.createElement("div",{className:r("max-h-[300px] overflow-y-auto overflow-x-hidden",t?.commandList),style:{minHeight:"68px"},key:e.length},e.length>0?p__namespace.default.createElement("div",{key:e.length,role:"group",className:r("overflow-y-auto overflow-hidden p-1 text-foreground",t?.commandGroup),style:{minHeight:"68px"}},p__namespace.default.createElement("span",{className:"text-muted-foreground font-medium text-sm py-1.5 px-2 pb-2"},"Suggestions"),p__namespace.default.createElement("div",{role:"separator",className:"py-0.5"}),e.map((l,f)=>{let P=f===y;return p__namespace.default.createElement("div",{key:l.id,role:"option","aria-selected":P,className:r("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",P&&"bg-accent text-accent-foreground",t?.commandItem),"data-value":l.text,onClick:()=>Te(l)},p__namespace.default.createElement("div",{className:"w-full flex items-center gap-2"},l.text,s.some(W=>W.text===l.text)&&p__namespace.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"},p__namespace.default.createElement("path",{d:"M20 6 9 17l-5-5"}))))})):p__namespace.default.createElement("div",{className:"py-6 text-center text-sm"},"No results found.")))))};var st=(i=>(i.Comma=",",i.Enter="Enter",i))(st||{}),it=p__namespace.default.forwardRef((s,c)=>{let{id:i,placeholder:g,tags:e,setTags:b,variant:N,size:h,shape:M,enableAutocomplete:n,autocompleteOptions:x,maxTags:t,delimiter:A=",",onTagAdd:T,onTagRemove:k,allowDuplicates:C,showCount:a,validateTag:m,placeholderWhenFull:B="Max tags reached",sortTags:D,delimiterList:O,truncate:Q,autocompleteFilter:le,borderStyle:G,textCase:v,interaction:y,animation:$,textStyle:X,minLength:_,maxLength:U,direction:Y="row",onInputChange:Te,customTagRenderer:Z,onFocus:l,onBlur:f,onTagClick:P,draggable:W=false,inputFieldPosition:xe="bottom",clearAll:Oe=false,onClearAll:Se,usePopoverForTags:Le=false,inputProps:ee={},restrictTagsToAutocompleteOptions:Ne,inlineTags:q=true,addTagsOnBlur:$e=false,activeTagIndex:F,setActiveTagIndex:S,styleClasses:u={},disabled:V=false,usePortal:We=false,addOnPaste:Ke=false,generateTagId:Ee=Ae}=s,[R,de]=p__namespace.default.useState(""),[Ge,te]=p__namespace.default.useState(Math.max(0,e.length)),oe=p__namespace.default.useRef(null);if(t!==void 0&&t<0||s.minTags!==void 0&&s.minTags<0)return console.warn("maxTags and minTags cannot be less than 0"),null;let ne=d=>{let o=d.target.value;Ke&&o.includes(A)?(o.split(A).map(L=>L.trim()).filter(L=>L).forEach(L=>{if(!L)return;let H=L.trim();if(Ne&&!x?.some(ge=>ge.text===H)){console.warn("Tag not allowed as per autocomplete options");return}if(m&&!m(H)){console.warn("Invalid tag as per validateTag");return}if(_&&H.length<_){console.warn(`Tag "${H}" is too short`);return}if(U&&H.length>U){console.warn(`Tag "${H}" is too long`);return}let Je=Ee();if(C||!e.some(ge=>ge.text===H))if(t===void 0||e.length<t){let ge={id:Je,text:H};b(Qe=>[...Qe,ge]),T?.(H);}else console.warn("Reached the maximum number of tags allowed");else console.warn(`Duplicate tag "${H}" not added`);}),de("")):de(o),Te?.(o);},ae=d=>{S(null),l?.(d);},re=d=>{if($e&&R.trim()){let o=R.trim();if(m&&!m(o))return;if(_&&o.length<_){console.warn("Tag is too short");return}if(U&&o.length>U){console.warn("Tag is too long");return}if((C||!e.some(I=>I.text===o))&&(t===void 0||e.length<t)){let I=Ee();b([...e,{id:I,text:o}]),T?.(o),te(L=>L+1),de("");}}f?.(d);},se=d=>{if(O?O.includes(d.key):d.key===A||d.key==="Enter"){d.preventDefault();let o=R.trim();if(Ne&&!x?.some(L=>L.text===o)||m&&!m(o))return;if(_&&o.length<_){console.warn("Tag is too short");return}if(U&&o.length>U){console.warn("Tag is too long");return}let I=Ee();o&&(C||!e.some(L=>L.text===o))&&(t===void 0||e.length<t)&&(b([...e,{id:I,text:o}]),T?.(o),te(L=>L+1)),de("");}else switch(d.key){case "Delete":if(F!==null){d.preventDefault();let o=[...e];o.splice(F,1),b(o),S(I=>o.length===0?null:I>=o.length?o.length-1:I),te(I=>I-1),k?.(e[F].text);}break;case "Backspace":if(F!==null){d.preventDefault();let o=[...e];o.splice(F,1),b(o),S(I=>I===0?null:I-1),te(I=>I-1),k?.(e[F].text);}break;case "ArrowRight":d.preventDefault(),S(F===null?0:o=>o+1>=e.length?0:o+1);break;case "ArrowLeft":d.preventDefault(),S(F===null?e.length-1:o=>o===0?e.length-1:o-1);break;case "Home":d.preventDefault(),S(0);break;case "End":d.preventDefault(),S(e.length-1);break}},ue=d=>{b(e.filter(o=>o.id!==d)),k?.(e.find(o=>o.id===d)?.text||""),te(o=>o-1);},pe=(d,o)=>{b(I=>{let L=[...I],[H]=L.splice(d,1);return L.splice(o,0,H),L});},_e=()=>{if(!Se){S(-1),b([]);return}Se?.();},Ue=p.useMemo(()=>(x||[]).filter(d=>d.text.toLowerCase().includes(R?R.toLowerCase():"")),[R,x]),qe=D?[...e].sort():e,ce=Q?e.map(d=>({id:d.id,text:d.text?.length>Q?`${d.text.substring(0,Q)}...`:d.text})):qe;return p__namespace.default.createElement("div",{className:`w-full flex ${!q&&e.length>0?"gap-3":""} ${xe==="bottom"?"flex-col":xe==="top"?"flex-col-reverse":"flex-row"}`},!Le&&(q?!n&&p__namespace.default.createElement("div",{className:"w-full"},p__namespace.default.createElement("div",{className:r("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",u?.inlineTagsContainer)},p__namespace.default.createElement(ie,{tags:ce,customTagRenderer:Z,variant:N,size:h,shape:M,borderStyle:G,textCase:v,interaction:y,animation:$,textStyle:X,onTagClick:P,draggable:W,onSortEnd:pe,onRemoveTag:ue,direction:Y,inlineTags:q,activeTagIndex:F,setActiveTagIndex:S,classStyleProps:{tagListClasses:u?.tagList,tagClasses:u?.tag},disabled:V}),p__namespace.default.createElement(j,{ref:oe,id:i,type:"text",placeholder:t!==void 0&&e.length>=t?B:g,value:R,onChange:ne,onKeyDown:se,onFocus:ae,onBlur:re,...ee,className:r("border-0 h-5 focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit shadow-none",u?.input),autoComplete:n?"on":"off",list:n?"autocomplete-options":void 0,disabled:V||t!==void 0&&e.length>=t}))):p__namespace.default.createElement(ie,{tags:ce,customTagRenderer:Z,variant:N,size:h,shape:M,borderStyle:G,textCase:v,interaction:y,animation:$,textStyle:X,onTagClick:P,draggable:W,onSortEnd:pe,onRemoveTag:ue,direction:Y,inlineTags:q,activeTagIndex:F,setActiveTagIndex:S,classStyleProps:{tagListClasses:u?.tagList,tagClasses:u?.tag},disabled:V})),n?p__namespace.default.createElement("div",{className:"w-full"},p__namespace.default.createElement(Ve,{tags:e,setTags:b,setInputValue:de,autocompleteOptions:Ue,setTagCount:te,maxTags:t,onTagAdd:T,onTagRemove:k,allowDuplicates:C??false,inlineTags:q,usePortal:We,classStyleProps:{command:u?.autoComplete?.command,popoverTrigger:u?.autoComplete?.popoverTrigger,popoverContent:u?.autoComplete?.popoverContent,commandList:u?.autoComplete?.commandList,commandGroup:u?.autoComplete?.commandGroup,commandItem:u?.autoComplete?.commandItem}},Le?p__namespace.default.createElement(ke,{tags:ce,customTagRenderer:Z,variant:N,size:h,shape:M,borderStyle:G,textCase:v,interaction:y,animation:$,textStyle:X,onTagClick:P,draggable:W,onSortEnd:pe,onRemoveTag:ue,direction:Y,activeTagIndex:F,setActiveTagIndex:S,classStyleProps:{popoverClasses:u?.tagPopover,tagListClasses:u?.tagList,tagClasses:u?.tag},disabled:V},p__namespace.default.createElement(j,{ref:oe,id:i,type:"text",placeholder:t!==void 0&&e.length>=t?B:g,value:R,onChange:ne,onKeyDown:se,onFocus:ae,onBlur:re,...ee,className:r("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit shadow-none",u?.input),autoComplete:n?"on":"off",list:n?"autocomplete-options":void 0,disabled:V||t!==void 0&&e.length>=t})):q?p__namespace.default.createElement("div",{className:r("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",u?.inlineTagsContainer)},p__namespace.default.createElement(ie,{tags:ce,customTagRenderer:Z,variant:N,size:h,shape:M,borderStyle:G,textCase:v,interaction:y,animation:$,textStyle:X,onTagClick:P,draggable:W,onSortEnd:pe,onRemoveTag:ue,direction:Y,inlineTags:q,activeTagIndex:F,setActiveTagIndex:S,classStyleProps:{tagListClasses:u?.tagList,tagClasses:u?.tag},disabled:V}),p__namespace.default.createElement(j,{ref:oe,id:i,type:"text",placeholder:t!==void 0&&e.length>=t?B:g,value:R,onChange:ne,onKeyDown:se,onFocus:ae,onBlur:re,...ee,className:r("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit shadow-none",u?.input),autoComplete:n?"on":"off",list:n?"autocomplete-options":void 0,disabled:V||t!==void 0&&e.length>=t})):p__namespace.default.createElement(j,{ref:oe,id:i,type:"text",placeholder:t!==void 0&&e.length>=t?B:g,value:R,onChange:ne,onKeyDown:se,onFocus:ae,onBlur:re,...ee,className:r("border-0 h-5 bg-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 flex-1 w-fit shadow-none",u?.input),autoComplete:n?"on":"off",list:n?"autocomplete-options":void 0,disabled:V||t!==void 0&&e.length>=t}))):p__namespace.default.createElement("div",{className:"w-full"},Le?p__namespace.default.createElement(ke,{tags:ce,customTagRenderer:Z,variant:N,size:h,shape:M,borderStyle:G,textCase:v,interaction:y,animation:$,textStyle:X,onTagClick:P,draggable:W,onSortEnd:pe,onRemoveTag:ue,direction:Y,activeTagIndex:F,setActiveTagIndex:S,classStyleProps:{popoverClasses:u?.tagPopover,tagListClasses:u?.tagList,tagClasses:u?.tag},disabled:V},p__namespace.default.createElement(j,{ref:oe,id:i,type:"text",placeholder:t!==void 0&&e.length>=t?B:g,value:R,onChange:ne,onKeyDown:se,onFocus:ae,onBlur:re,...ee,autoComplete:n?"on":"off",list:n?"autocomplete-options":void 0,disabled:V||t!==void 0&&e.length>=t,className:r("border-0 w-full shadow-none",u?.input)})):q?null:p__namespace.default.createElement(j,{ref:oe,id:i,type:"text",placeholder:t!==void 0&&e.length>=t?B:g,value:R,onChange:ne,onKeyDown:se,onFocus:ae,onBlur:re,...ee,className:r(u?.input,"shadow-none"),autoComplete:n?"on":"off",list:n?"autocomplete-options":void 0,disabled:V||t!==void 0&&e.length>=t})),a&&t&&p__namespace.default.createElement("div",{className:"flex"},p__namespace.default.createElement("span",{className:"text-muted-foreground text-sm mt-1 ml-auto"},`${Ge}`,"/",`${t}`)),Oe&&p__namespace.default.createElement(J,{type:"button",onClick:_e,className:r("mt-2",u?.clearAllButton)},"Clear All"))});it.displayName="TagInput";
exports.Delimiter=st;exports.TagInput=it;//# sourceMappingURL=index.js.map
//# sourceMappingURL=index.js.map