UNPKG

@vojtechlanka/vue-tags-input

Version:

A tags input component for Vue3 based on @sipec/vue-tags-input which is fork from @JohMun/vue-tags-input.

2 lines (1 loc) 21.2 kB
(function(g,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("vue"),require("vuedraggable")):typeof define=="function"&&define.amd?define(["exports","vue","vuedraggable"],s):(g=typeof globalThis<"u"?globalThis:g||self,s(g.VueTagsInput={},g.Vue,g.draggable))})(this,function(g,s,S){"use strict";const ie="",y=(e,t)=>{const a=e.__vccOpts||e;for(const[r,l]of t)a[r]=l;return a},w={name:"TagInput",props:{scope:{type:Object,required:!0}}},B=["maxlength"];function $(e,t,a,r,l,d){return a.scope.edit?s.withDirectives((s.openBlock(),s.createElementBlock("input",{key:0,"onUpdate:modelValue":t[0]||(t[0]=n=>a.scope.element.text=n),maxlength:a.scope.maxlength,type:"text",class:"ti-tag-input",size:"1",onInput:t[1]||(t[1]=n=>a.scope.validateTag(a.scope.index,n)),onBlur:t[2]||(t[2]=n=>a.scope.performCancelEdit(a.scope.index)),onKeydown:t[3]||(t[3]=n=>a.scope.performSaveEdit(a.scope.index,n))},null,40,B)),[[s.vModelText,a.scope.element.text]]):s.createCommentVNode("",!0)}const T=y(w,[["render",$],["__scopeId","data-v-a3408643"]]),k=e=>!e.some(t=>{const a=!t.text;a&&console.warn('Missing property "text"',t);let r=!1;return t.classes&&(r=typeof t.classes!="string"),r&&console.warn('Property "classes" must be type of string',t),a||r}),E=e=>!e.some(t=>{if(typeof t=="number"){const a=isFinite(t)&&Math.floor(t)===t;return a||console.warn("Only numerics are allowed for this prop. Found:",t),!a}else if(typeof t=="string"){const a=/\W|[a-z]|!\d/i.test(t);return a||console.warn("Only alpha strings are allowed for this prop. Found:",t),!a}else return console.warn("Only numeric and string values are allowed. Found:",t),!1}),D={modelValue:{type:String,default:"",required:!0},tags:{type:Array,default:()=>[],validator:k},autocompleteItems:{type:Array,default:()=>[],validator:k},allowEditTags:{type:Boolean,default:!1},autocompleteFilterDuplicates:{default:!0,type:Boolean},addOnlyFromAutocomplete:{type:Boolean,default:!1},autocompleteMinLength:{type:Number,default:1},autocompleteAlwaysOpen:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},placeholder:{type:String,default:"Add Tag"},addOnKey:{type:Array,default:()=>[13],validator:E},saveOnKey:{type:Array,default:()=>[13],validator:E},maxTags:{type:Number},maxlength:{type:Number},validation:{type:Array,default:()=>[],validator(e){return!e.some(t=>{const a=!t.rule;a&&console.warn('Property "rule" is missing',t);const r=t.rule&&(typeof t.rule=="string"||t.rule instanceof RegExp||{}.toString.call(t.rule)==="[object Function]");r||console.warn("A rule must be type of string, RegExp or function. Found:",JSON.stringify(t.rule));const l=!t.classes;l&&console.warn('Property "classes" is missing',t);const d=t.type&&typeof t.type!="string";return d&&console.warn('Property "type" must be type of string. Found:',t),!r||a||l||d})}},separators:{type:Array,default:()=>[";"],validator(e){return!e.some(t=>{const a=typeof t!="string";return a&&console.warn("Separators must be type of string. Found:",t),a})}},avoidAddingDuplicates:{type:Boolean,default:!0},addOnBlur:{type:Boolean,default:!0},isDuplicate:{type:Function,default:null},addFromPaste:{type:Boolean,default:!0},deleteOnBackspace:{default:!0,type:Boolean},isDraggable:{type:Boolean,default:!1},draggableHandle:{type:Boolean,default:!1},onBeforeAddingTag:Function,onBeforeDeletingTag:Function,onBeforeEditingTag:Function,onBeforeSavingTag:Function};function b(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var O=function e(t,a){if(t===a)return!0;if(t&&a&&typeof t=="object"&&typeof a=="object"){if(t.constructor!==a.constructor)return!1;var r,l,d;if(Array.isArray(t)){if(r=t.length,r!=a.length)return!1;for(l=r;l--!==0;)if(!e(t[l],a[l]))return!1;return!0}if(t.constructor===RegExp)return t.source===a.source&&t.flags===a.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===a.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===a.toString();if(d=Object.keys(t),r=d.length,r!==Object.keys(a).length)return!1;for(l=r;l--!==0;)if(!Object.prototype.hasOwnProperty.call(a,d[l]))return!1;for(l=r;l--!==0;){var n=d[l];if(!e(t[n],a[n]))return!1}return!0}return t!==t&&a!==a};const I=b(O),V=(e,t)=>t.filter(a=>{const{text:r}=e;return typeof a.rule=="string"?!new RegExp(a.rule).test(r):a.rule instanceof RegExp?!a.rule.test(r):{}.toString.call(a.rule)==="[object Function]"?a.rule(e):!1}).map(a=>a.classes),u=e=>JSON.parse(JSON.stringify(e)),A=(e,t)=>{let a=0;for(;a<e.length;){if(t(e[a],a,e))return a;a++}return-1},h=(e,t,a=[],r)=>{e.text===void 0&&(e={text:e});const l=V(e,a),d=A(t,i=>i===e),n=u(t),c=d!==-1?n.splice(d,1)[0]:u(e);return(r?r(n,c):n.map(i=>i.text).indexOf(c.text)!==-1)&&l.push("ti-duplicate"),l.length===0?l.push("ti-valid"):l.push("ti-invalid"),l},f=(e,...t)=>{e.text===void 0&&(e={text:e});const a=u(e);return a.tiClasses=h(e,...t),a},C=(e,...t)=>e.map(a=>f(a,e,...t)),M={name:"VueTagsInput",components:{TagInput:T,draggable:S},props:D,emits:["adding-duplicate","before-adding-tag","before-deleting-tag","before-editing-tag","before-saving-tag","max-tags-reached","saving-duplicate","tags-changed","tag-clicked","update:modelValue","update:tags","tag-order-changed","click"],inheritAttrs:!1,data(){return{tagCenter:[],newTag:null,tagsCopy:[],tagsEditStatus:null,deletionMark:null,deletionMarkTime:null,selectedItem:null,focused:null}},computed:{autocompleteOpen(){return this.autocompleteAlwaysOpen?!0:this.newTag!==null&&this.newTag.length>=this.autocompleteMinLength&&this.filteredAutocompleteItems.length>0&&this.focused},filteredAutocompleteItems(){const e=this.autocompleteItems.map(t=>f(t,this.tags,this.validation,this.isDuplicate));return this.autocompleteFilterDuplicates?e.filter(this.duplicateFilter):e}},methods:{createClasses:h,getSelectedIndex(e){const t=this.filteredAutocompleteItems,a=this.selectedItem,r=t.length-1;if(t.length!==0)return a===null?0:e==="before"&&a===0?r:e==="after"&&a===r?0:e==="after"?a+1:a-1},selectDefaultItem(){this.addOnlyFromAutocomplete&&this.filteredAutocompleteItems.length>0?this.selectedItem=0:this.selectedItem=null},selectItem(e,t){e.preventDefault(),this.selectedItem=this.getSelectedIndex(t)},isSelected(e){return this.selectedItem===e},isMarked(e){return this.deletionMark===e},setTagCenter(e){e&&this.tagCenter.push(e)},invokeDelete(){if(!this.deleteOnBackspace||this.newTag.length>0)return;const e=this.tagsCopy.length-1;this.deletionMark===null?(this.deletionMarkTime=setTimeout(()=>{this.deletionMark=null},1e3),this.deletionMark=e):this.performDeleteTag(e)},addTagsFromPaste(){this.addFromPaste&&setTimeout(()=>this.performAddTags(this.newTag),10)},performEditTag(e){this.allowEditTags&&(this.onBeforeAddingTag||this.editTag(e),this.$emit("before-editing-tag",{index:e,tag:this.tagsCopy[e],editTag:()=>this.editTag(e)}))},editTag(e){this.allowEditTags&&(this.toggleEditMode(e),this.focus(e))},toggleEditMode(e){!this.allowEditTags||this.disabled||(this.tagsEditStatus[e]=!this.tagsEditStatus[e])},createChangedTag(e,t){const a=this.tagsCopy[e];a.text=t?t.target.value:this.tagsCopy[e].text,this.tagsCopy[e]=f(a,this.tagsCopy,this.validation,this.isDuplicate)},focus(e){this.$nextTick(()=>{const t=this.tagCenter[e].querySelector("input.ti-tag-input");t&&t.focus()})},quote(e){return e.replace(/([()[{*+.$^\\|?])/g,"\\$1")},cancelEdit(e){this.tags[e]&&(this.tagsCopy[e]=u(f(this.tags[e],this.tags,this.validation,this.isDuplicate)),this.tagsEditStatus[e]=!1)},hasForbiddingAddRule(e){return e.some(t=>{const a=this.validation.find(r=>t===r.classes);return a?a.disableAdd:!1})},createTagTexts(e){const t=new RegExp(this.separators.map(a=>this.quote(a)).join("|"));return e.split(t).map(a=>({text:a}))},performDeleteTag(e){this.onBeforeDeletingTag||this.deleteTag(e),this.$emit("before-deleting-tag",{index:e,tag:this.tagsCopy[e],deleteTag:()=>this.deleteTag(e)})},deleteTag(e){this.disabled||(this.deletionMark=null,clearTimeout(this.deletionMarkTime),this.tagsCopy.splice(e,1),this.$emit("update:tags",this.tagsCopy),this.$emit("tags-changed",this.tagsCopy))},noTriggerKey(e,t){const a=this[t].indexOf(e.keyCode)!==-1||this[t].indexOf(e.key)!==-1;return a&&e.preventDefault(),!a},performAddTags(e,t,a){if(this.disabled||t&&this.noTriggerKey(t,"addOnKey"))return;let r=[];typeof e=="object"&&(r=[e]),typeof e=="string"&&(r=this.createTagTexts(e)),r=r.filter(l=>l.text.trim().length>0),r.forEach(l=>{l=f(l,this.tags,this.validation,this.isDuplicate),this.onBeforeAddingTag||this.addTag(l,a),this.$emit("before-adding-tag",{tag:l,addTag:()=>this.addTag(l,a)})})},duplicateFilter(e){return this.isDuplicate?!this.isDuplicate(this.tagsCopy,e):!this.tagsCopy.find(t=>t.text===e.text)},addTag(e,t="new-tag-input"){const a=this.filteredAutocompleteItems.map(r=>r.text);this.addOnlyFromAutocomplete&&a.indexOf(e.text)===-1||this.$nextTick(()=>{if(this.maxTags&&this.maxTags<=this.tagsCopy.length)return this.$emit("max-tags-reached",e);if(this.avoidAddingDuplicates&&!this.duplicateFilter(e))return this.$emit("adding-duplicate",e);this.hasForbiddingAddRule(e.tiClasses)||(this.newTag="",this.tagsCopy.push(e),this.$emit("update:tags",this.tagsCopy),t==="autocomplete"&&this.$refs.newTagInput.focus(),this.$emit("tags-changed",this.tagsCopy))})},performSaveTag(e,t){const a=this.tagsCopy[e];this.disabled||t&&this.noTriggerKey(t,"addOnKey")||a.text.trim().length!==0&&(this["on-before-saving-tag"]||this.saveTag(e,a),this.$emit("before-saving-tag",{index:e,tag:a,saveTag:()=>this.saveTag(e,a)}))},saveTag(e,t){if(this.avoidAddingDuplicates){const a=u(this.tagsCopy),r=a.splice(e,1)[0];if(this.isDuplicate?this.isDuplicate(a,r):a.map(d=>d.text).indexOf(r.text)!==-1)return this.$emit("saving-duplicate",t)}this.hasForbiddingAddRule(t.tiClasses)||(this.tagsCopy[e]=t,this.toggleEditMode(e),this.$emit("update:tags",this.tagsCopy),this.$emit("tags-changed",this.tagsCopy))},tagsEqual(){return!this.tagsCopy.some((e,t)=>!I(e,this.tags[t]))},updateNewTag(e){const t=e.target.value;this.newTag=t,this.$emit("update:modelValue",t)},initTags(){this.tagsCopy=C(this.tags,this.validation,this.isDuplicate),this.tagsEditStatus=u(this.tags).map(()=>!1),this.tagsEqual()||this.$emit("update:tags",this.tagsCopy)},blurredOnClick(e){this.$el.contains(e.target)||this.$el.contains(document.activeElement)||this.performBlur(e)},performBlur(){this.addOnBlur&&this.focused&&this.performAddTags(this.newTag),this.focused=!1},tagOrderChanged(){this.$emit("tag-order-changed",this.tagsCopy)},performClick(e){if(this.addOnlyFromAutocomplete)return this.$emit("click",e),!1;this.selectedItem=null,this.$emit("click",e)},getTagIndex(e){return this.tagsCopy.findIndex(t=>t.text===e.text)}},watch:{modelValue(e){this.addOnlyFromAutocomplete||(this.selectedItem=null),this.newTag=e},tags:{handler(){this.initTags()},deep:!0},autocompleteOpen:"selectDefaultItem"},created(){this.newTag=this.modelValue,this.initTags()},mounted(){this.selectDefaultItem(),document.addEventListener("click",this.blurredOnClick)},beforeUpdate(){this.tagCenter=[]},unmounted(){document.removeEventListener("click",this.blurredOnClick)}},re="",N={class:"ti-input"},F=["onClick"],K={class:"ti-content"},P={key:0,class:"handle"},j={key:1,class:"ti-tag-left"},z=["onClick"],R={key:2,class:"ti-tag-right"},q={class:"ti-actions"},L=["onClick"],U=["onClick"],H={class:"ti-new-tag-input-wrapper"},J=["placeholder","value","maxlength","disabled"],W={key:1,class:"ti-tags"},G=["onClick"],Q={class:"ti-content"},X={key:0,class:"ti-tag-left"},Y=["onClick"],Z={key:1,class:"ti-tag-right"},v={class:"ti-actions"},_=["onClick"],x=["onClick"],ee={class:"ti-new-tag-input-wrapper"},te=["placeholder","value","maxlength","disabled"],se=["onMouseover"],ae=["onClick"];function oe(e,t,a,r,l,d){const n=s.resolveComponent("tag-input"),c=s.resolveComponent("draggable");return s.openBlock(),s.createElementBlock("div",{class:s.normalizeClass(["vue-tags-input",[{"ti-disabled":e.disabled},{"ti-focus":e.focused},e.$attrs.class]]),style:s.normalizeStyle(e.$attrs.style)},[s.createElementVNode("div",N,[e.isDraggable?(s.openBlock(),s.createBlock(c,{key:0,modelValue:e.tagsCopy,"onUpdate:modelValue":t[9]||(t[9]=o=>e.tagsCopy=o),group:"tags",class:"ti-tags",tag:"ul",draggable:".item",handle:e.draggableHandle?".handle":"","ghost-class":"ghost-tag","drag-class":"drag-tag","item-key":e.getTagIndex,onStart:t[10]||(t[10]=o=>e.drag=!0),onEnd:t[11]||(t[11]=o=>{e.drag=!1,e.tagOrderChanged()})},{item:s.withCtx(({element:o,index:i})=>[(s.openBlock(),s.createElementBlock("li",{key:i,style:s.normalizeStyle(o.style),class:s.normalizeClass([[{"ti-editing":e.tagsEditStatus[i]},o.tiClasses,o.classes,{"ti-deletion-mark":e.isMarked(i)}],"ti-tag item"]),tabindex:"0",onClick:p=>e.$emit("tag-clicked",{element:o,index:i})},[s.createElementVNode("div",K,[e.draggableHandle?(s.openBlock(),s.createElementBlock("span",P,"::")):s.createCommentVNode("",!0),e.$slots["tag-left"]?(s.openBlock(),s.createElementBlock("div",j,[s.renderSlot(e.$slots,"tag-left",{tag:o,index:i,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0)])):s.createCommentVNode("",!0),s.createElementVNode("div",{ref:e.setTagCenter,class:"ti-tag-center"},[e.$slots["tag-center"]?s.createCommentVNode("",!0):(s.openBlock(),s.createElementBlock("span",{key:0,class:s.normalizeClass({"ti-hidden":e.tagsEditStatus[i]}),onClick:p=>e.performEditTag(i)},s.toDisplayString(o.text),11,z)),e.$slots["tag-center"]?s.createCommentVNode("",!0):(s.openBlock(),s.createBlock(n,{key:1,scope:{edit:e.tagsEditStatus[i],maxlength:e.maxlength,element:o,index:i,validateTag:e.createChangedTag,performCancelEdit:e.cancelEdit,performSaveEdit:e.performSaveTag}},null,8,["scope"])),s.renderSlot(e.$slots,"tag-center",{tag:o,index:i,maxlength:e.maxlength,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,validateTag:e.createChangedTag,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0)],512),e.$slots["tag-right"]?(s.openBlock(),s.createElementBlock("div",R,[s.renderSlot(e.$slots,"tag-right",{tag:o,index:i,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0)])):s.createCommentVNode("",!0)]),s.createElementVNode("div",q,[e.$slots["tag-actions"]?s.createCommentVNode("",!0):s.withDirectives((s.openBlock(),s.createElementBlock("i",{key:0,class:"ti-icon-undo",onClick:p=>e.cancelEdit(i)},null,8,L)),[[s.vShow,e.tagsEditStatus[i]]]),e.$slots["tag-actions"]?s.createCommentVNode("",!0):s.withDirectives((s.openBlock(),s.createElementBlock("i",{key:1,class:"ti-icon-close",onClick:p=>e.performDeleteTag(i)},null,8,U)),[[s.vShow,!e.tagsEditStatus[i]]]),e.$slots["tag-actions"]?s.renderSlot(e.$slots,"tag-actions",{key:2,tag:o,index:i,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0):s.createCommentVNode("",!0)])],14,F))]),footer:s.withCtx(()=>[s.createElementVNode("li",H,[s.createElementVNode("input",s.mergeProps({ref:"newTagInput"},e.$attrs,{class:[[e.createClasses(e.newTag,e.tags,e.validation,e.isDuplicate)],"ti-new-tag-input"],placeholder:e.placeholder,value:e.newTag,maxlength:e.maxlength,disabled:e.disabled,type:"text",size:"1",onKeydown:[t[0]||(t[0]=o=>e.performAddTags(e.filteredAutocompleteItems[e.selectedItem]||e.newTag,o)),t[2]||(t[2]=s.withKeys((...o)=>e.invokeDelete&&e.invokeDelete(...o),["delete"])),t[3]||(t[3]=s.withKeys((...o)=>e.performBlur&&e.performBlur(...o),["tab"])),t[4]||(t[4]=s.withKeys(o=>e.selectItem(o,"before"),["up"])),t[5]||(t[5]=s.withKeys(o=>e.selectItem(o,"after"),["down"]))],onPaste:t[1]||(t[1]=(...o)=>e.addTagsFromPaste&&e.addTagsFromPaste(...o)),onInput:t[6]||(t[6]=(...o)=>e.updateNewTag&&e.updateNewTag(...o)),onFocus:t[7]||(t[7]=o=>e.focused=!0),onClick:t[8]||(t[8]=o=>e.performClick(o))}),null,16,J)])]),_:3},8,["modelValue","handle","item-key"])):(s.openBlock(),s.createElementBlock("ul",W,[(s.openBlock(!0),s.createElementBlock(s.Fragment,null,s.renderList(e.tagsCopy,(o,i)=>(s.openBlock(),s.createElementBlock("li",{key:i,style:s.normalizeStyle(o.style),class:s.normalizeClass([[{"ti-editing":e.tagsEditStatus[i]},o.tiClasses,o.classes,{"ti-deletion-mark":e.isMarked(i)}],"ti-tag item"]),tabindex:"0",onClick:p=>e.$emit("tag-clicked",{element:o,index:i})},[s.createElementVNode("div",Q,[e.$slots["tag-left"]?(s.openBlock(),s.createElementBlock("div",X,[s.renderSlot(e.$slots,"tag-left",{tag:o,index:i,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0)])):s.createCommentVNode("",!0),s.createElementVNode("div",{ref_for:!0,ref:e.setTagCenter,class:"ti-tag-center"},[e.$slots["tag-center"]?s.createCommentVNode("",!0):(s.openBlock(),s.createElementBlock("span",{key:0,class:s.normalizeClass({"ti-hidden":e.tagsEditStatus[i]}),onClick:p=>e.performEditTag(i)},s.toDisplayString(o.text),11,Y)),e.$slots["tag-center"]?s.createCommentVNode("",!0):(s.openBlock(),s.createBlock(n,{key:1,scope:{edit:e.tagsEditStatus[i],maxlength:e.maxlength,element:o,index:i,validateTag:e.createChangedTag,performCancelEdit:e.cancelEdit,performSaveEdit:e.performSaveTag}},null,8,["scope"])),s.renderSlot(e.$slots,"tag-center",{tag:o,index:i,maxlength:e.maxlength,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,validateTag:e.createChangedTag,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0)],512),e.$slots["tag-right"]?(s.openBlock(),s.createElementBlock("div",Z,[s.renderSlot(e.$slots,"tag-right",{tag:o,index:i,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0)])):s.createCommentVNode("",!0)]),s.createElementVNode("div",v,[e.$slots["tag-actions"]?s.createCommentVNode("",!0):s.withDirectives((s.openBlock(),s.createElementBlock("i",{key:0,class:"ti-icon-undo",onClick:p=>e.cancelEdit(i)},null,8,_)),[[s.vShow,e.tagsEditStatus[i]]]),e.$slots["tag-actions"]?s.createCommentVNode("",!0):s.withDirectives((s.openBlock(),s.createElementBlock("i",{key:1,class:"ti-icon-close",onClick:p=>e.performDeleteTag(i)},null,8,x)),[[s.vShow,!e.tagsEditStatus[i]]]),e.$slots["tag-actions"]?s.renderSlot(e.$slots,"tag-actions",{key:2,tag:o,index:i,edit:e.tagsEditStatus[i],performSaveEdit:e.performSaveTag,performDelete:e.performDeleteTag,performCancelEdit:e.cancelEdit,performOpenEdit:e.performEditTag,deletionMark:e.isMarked(i)},void 0,!0):s.createCommentVNode("",!0)])],14,G))),128)),s.createElementVNode("li",ee,[s.createElementVNode("input",s.mergeProps({ref:"newTagInput"},e.$attrs,{class:[[e.createClasses(e.newTag,e.tags,e.validation,e.isDuplicate)],"ti-new-tag-input"],placeholder:e.placeholder,value:e.newTag,maxlength:e.maxlength,disabled:e.disabled,type:"text",size:"1",onKeydown:[t[12]||(t[12]=o=>e.performAddTags(e.filteredAutocompleteItems[e.selectedItem]||e.newTag,o)),t[14]||(t[14]=s.withKeys((...o)=>e.invokeDelete&&e.invokeDelete(...o),["delete"])),t[15]||(t[15]=s.withKeys((...o)=>e.performBlur&&e.performBlur(...o),["tab"])),t[16]||(t[16]=s.withKeys(o=>e.selectItem(o,"before"),["up"])),t[17]||(t[17]=s.withKeys(o=>e.selectItem(o,"after"),["down"]))],onPaste:t[13]||(t[13]=(...o)=>e.addTagsFromPaste&&e.addTagsFromPaste(...o)),onInput:t[18]||(t[18]=(...o)=>e.updateNewTag&&e.updateNewTag(...o)),onFocus:t[19]||(t[19]=o=>e.focused=!0),onClick:t[20]||(t[20]=o=>e.performClick(o))}),null,16,te)])]))]),s.renderSlot(e.$slots,"between-elements",{},void 0,!0),e.autocompleteOpen?(s.openBlock(),s.createElementBlock("div",{key:0,class:"ti-autocomplete",onMouseout:t[21]||(t[21]=o=>e.selectedItem=null)},[s.renderSlot(e.$slots,"autocomplete-header",{},void 0,!0),s.createElementVNode("ul",null,[(s.openBlock(!0),s.createElementBlock(s.Fragment,null,s.renderList(e.filteredAutocompleteItems,(o,i)=>(s.openBlock(),s.createElementBlock("li",{key:i,style:s.normalizeStyle(o.style),class:s.normalizeClass([[o.tiClasses,o.classes,{"ti-selected-item":e.isSelected(i)}],"ti-item"]),onMouseover:p=>e.disabled?!1:e.selectedItem=i},[e.$slots["autocomplete-item"]?s.renderSlot(e.$slots,"autocomplete-item",{key:1,item:o,index:i,performAdd:p=>e.performAddTags(p,void 0,"autocomplete"),selected:e.isSelected(i)},void 0,!0):(s.openBlock(),s.createElementBlock("div",{key:0,onClick:p=>e.performAddTags(o,void 0,"autocomplete")},s.toDisplayString(o.text),9,ae))],46,se))),128))]),s.renderSlot(e.$slots,"autocomplete-footer",{},void 0,!0)],32)):s.createCommentVNode("",!0)],6)}const m=y(M,[["render",oe],["__scopeId","data-v-63864685"]]);m.install=e=>e.component(m.name,m),typeof window<"u"&&window.Vue&&window.Vue.use(m),g.TagInput=T,g.VueTagsInput=m,g.createClasses=h,g.createTag=f,g.createTags=C,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})});