/** * Tagify (v 3.11.0)- tags input component * By Yair Even-Or * Don't sell this code. (c) * https://github.com/yairEO/tagify */ !function(t,e){"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?module.exports=e():t.Tagify=e()}(this,function(){"use strict";function s(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);t&&(s=s.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),i.push.apply(i,s)}return i}function u(e){for(var t=1;t[\r\n ]+\<").replace(/(<.*?>)|\s+/g,function(t,e){return e||" "}):""}function o(t){return t.replace(/&/g,"&").replace(//g,">").replace(/"/g,""").replace(/`|'/g,"'")}function h(t,e,i){function s(t,e){for(var i in e)e.hasOwnProperty(i)&&(f(e[i])?f(t[i])?s(t[i],e[i]):t[i]=Object.assign({},e[i]):t[i]=e[i])}return t instanceof Object||(t={}),s(t,e),i&&s(t,i),t}function v(t){return String.prototype.normalize?"string"==typeof t?t.normalize("NFD").replace(/[\u0300-\u036f]/g,""):void 0:t}function t(t,e){if(!t)return console.warn("Tagify: ","invalid input element ",t),this;this.applySettings(t,e||{}),this.state={editing:!1,actions:{},mixMode:{},dropdown:{},flaggedTags:{}},this.value=[],this.listeners={},this.DOM={},h(this,new this.EventDispatcher(this)),this.build(t),this.getCSSVars(),this.loadOriginalValues(),this.events.customBinding.call(this),this.events.binding.call(this),t.autofocus&&this.DOM.input.focus()}return(t.prototype={isIE:window.document.documentMode,TEXTS:{empty:"empty",exceed:"number of tags exceeded",pattern:"pattern mismatch",duplicate:"already exists",notAllowed:"not allowed"},DEFAULTS:{delimiters:",",pattern:null,maxTags:1/0,callbacks:{},addTagOnBlur:!0,duplicates:!1,whitelist:[],blacklist:[],enforceWhitelist:!1,keepInvalidTags:!1,mixTagsAllowedAfter:/,|\.|\:|\s/,mixTagsInterpolator:["[[","]]"],backspace:!0,skipInvalid:!1,editTags:2,transformTag:function(){},autoComplete:{enabled:!0,rightKey:!1},dropdown:{classname:"",enabled:2,maxItems:10,searchKeys:[],fuzzySearch:!0,accentedSearch:!0,highlightFirst:!1,closeOnSelect:!0,position:"all"},hooks:{beforeRemoveTag:function(){return Promise.resolve()},suggestionClick:function(){return Promise.resolve()}}},templates:{wrapper:function(t,e){return'\n \n ')},tag:function(t,e){return'\n \n
\n ").concat(t,"\n
\n
")},dropdown:function(t){var e=t.dropdown,i="".concat("manual"==e.position?"":"tagify__dropdown tagify__dropdown--".concat(e.position)," ").concat(e.classname).trim();return'
\n
\n
')},dropdownItem:function(t){return"
').concat(t.value,"
")}},customEventsList:["add","remove","invalid","input","click","keydown","focus","blur","edit:input","edit:updated","edit:start","edit:keydown","dropdown:show","dropdown:hide","dropdown:select"],applySettings:function(i,t){var s=this;if(this.DEFAULTS.templates=this.templates,this.settings=h({},this.DEFAULTS,t),this.settings.readonly=i.hasAttribute("readonly"),this.settings.placeholder=i.getAttribute("placeholder")||this.settings.placeholder||"",this.isIE&&(this.settings.autoComplete=!1),["whitelist","blacklist"].forEach(function(t){var e=i.getAttribute("data-"+t);e&&(e=e.split(s.settings.delimiters))instanceof Array&&(s.settings[t]=e)}),"autoComplete"in t&&!f(t.autoComplete)&&(this.settings.autoComplete=this.DEFAULTS.autoComplete,this.settings.autoComplete.enabled=t.autoComplete),i.pattern)try{this.settings.pattern=new RegExp(i.pattern)}catch(t){}if(this.settings.delimiters)try{this.settings.delimiters=new RegExp(this.settings.delimiters,"g")}catch(t){}"select"==this.settings.mode&&(this.settings.dropdown.enabled=0),"mix"==this.settings.mode&&(this.settings.autoComplete.rightKey=!0)},getAttributes:function(t){if("[object Object]"!=Object.prototype.toString.call(t))return"";var e,i,s=Object.keys(t),n="";for(i=s.length;i--;)"class"!=(e=s[i])&&t.hasOwnProperty(e)&&t[e]&&(n+=" "+e+(t[e]?'="'.concat(t[e],'"'):""));return n},getCaretGlobalPosition:function(){var t=document.getSelection();if(t.rangeCount){var e,i,s=t.getRangeAt(0),n=s.startContainer,a=s.startOffset;return 0=o.length)&&(s.removeTags(i.anchorNode.previousElementSibling),s.fixFirefoxLastTagNoCaret(),2==s.DOM.input.children.length&&"BR"==s.DOM.input.children[1].tagName))return s.DOM.input.innerHTML="",!(s.value.length=0);s.value=[].map.call(r,function(t,e){var i=t.__tagifyTagData;if(t.parentNode)return i;s.trigger("remove",{tag:t,index:e,data:i})}).filter(function(t){return t})},50)}return!0}switch(t.key){case"Backspace":this.state.dropdown.visible||""!=e&&8203!=e.charCodeAt(0)||(!0===this.settings.backspace?this.removeTags():"edit"==this.settings.backspace&&setTimeout(this.editTag.bind(this),0));break;case"Esc":case"Escape":if(this.state.dropdown.visible)return;t.target.blur();break;case"Down":case"ArrowDown":this.state.dropdown.visible||this.dropdown.show.call(this);break;case"ArrowRight":var l=this.state.inputSuggestion||this.state.ddItemData;if(l&&this.settings.autoComplete.rightKey)return void this.addTags([l],!0);break;case"Tab":if(!e||"select"==this.settings.mode)return!0;case"Enter":t.preventDefault(),setTimeout(function(){s.state.actions.selectOption||s.addTags(e,!0)})}},onInput:function(t){var e=this.input.normalize.call(this),i=e.length>=this.settings.dropdown.enabled,s={value:e,inputElm:this.DOM.input};if("mix"==this.settings.mode)return this.events.callbacks.onMixTagsInput.call(this,t);s.isValid=this.validateTag({value:e}),this.trigger("input",s),this.input.value!=e&&(this.input.set.call(this,e,!1),-1!=e.search(this.settings.delimiters)?this.addTags(e)&&this.input.set.call(this):0<=this.settings.dropdown.enabled&&this.dropdown[i?"show":"hide"].call(this,e))},onMixTagsInput:function(){var t,e,i,s,n,a,o,r,l=this,d=this.settings;if(this.value.length=d.dropdown.enabled;try{r=(r=this.state.flaggedTags[this.state.tag.baseOffset]).prefix==this.state.tag.prefix&&r.value[0]==this.state.tag.value[0],this.state.flaggedTags[this.state.tag.baseOffset]&&!this.state.tag.value&&delete this.state.flaggedTags[this.state.tag.baseOffset]}catch(t){}(r||s=this.settings.dropdown.enabled&&(this.state.editing.value=a,this.dropdown.show.call(this,a)),this.trigger("edit:input",{tag:i,index:s,data:h({},this.value[s],{newValue:a}),originalEvent:this.cloneEvent(e)})},onEditTagFocus:function(t){this.state.editing={scope:t,input:t.querySelector("[contenteditable]")}},onEditTagBlur:function(t){if(this.state.editing=!1,this.state.hasFocus||this.toggleFocusClass(),this.DOM.scope.contains(t)){var e=t.closest(".tagify__tag"),i=this.input.normalize.call(this,t),s=i,n=h({},this.tagData(e),{value:s}),a=s!=n.__originalData.value,o=this.validateTag(n);if(!i)return this.removeTags(e),void this.onEditTagDone(null,n);a?(this.settings.transformTag.call(this,n),!0===(o=this.validateTag(n))?(n=this.getWhitelistItemsByValue({value:s})||n.__preInvalidData||{},n=Object.assign({},n,{value:s}),this.settings.transformTag.call(this,n),this.onEditTagDone(e,n)):this.trigger("invalid",{data:n,tag:e,message:o})):this.onEditTagDone(e,n.__originalData)}},onEditTagkeydown:function(t,e){switch(this.trigger("edit:keydown",{originalEvent:this.cloneEvent(t)}),t.key){case"Esc":case"Escape":t.target.textContent=e.__tagifyTagData.__originalData.value;case"Enter":case"Tab":t.preventDefault(),t.target.blur()}},onDoubleClickScope:function(t){var e,i,s=t.target.closest("tag"),n=this.settings;s&&(e=s.classList.contains("tagify__tag--editable"),i=s.hasAttribute("readonly"),"select"==n.mode||n.readonly||e||i||!this.settings.editTags||this.editTag(s),this.toggleFocusClass(!0),this.trigger("dblclick",{tag:s,index:this.getNodeIndex(s),data:this.tagData(s)}))}}},fixFirefoxLastTagNoCaret:function(){var t=this.DOM.input;if(e&&t.childNodes.length&&1==t.lastChild.nodeType)return t.appendChild(document.createTextNode("​")),this.setRangeAtStartEnd(!0),!0},placeCaretAfterTag:function(t){var e=t.nextSibling,i=window.getSelection(),s=i.getRangeAt(0);e||(e=document.createTextNode(""),t.appendChild(e),t.parentNode.insertBefore(e,t.nextSibling)),i.rangeCount&&(s.setStartAfter(t),s.setEndAfter(t),i.removeAllRanges(),i.addRange(s))},editTag:function(e,t){var i=this;t=t||{};var s=(e=e||this.getLastTag()).querySelector(".tagify__tag-text"),n=this.getNodeIndex(e),a=e.__tagifyTagData,o=this.events.callbacks,r=this,l=!0;if(s){if(!(a instanceof Object&&"editable"in a)||a.editable)return e.__tagifyTagData.__originalData=h({},a),e.classList.add("tagify__tag--editable"),s.setAttribute("contenteditable",!0),s.addEventListener("focus",o.onEditTagFocus.bind(this,e)),s.addEventListener("blur",function(){setTimeout(o.onEditTagBlur.bind(r),0,s)}),s.addEventListener("input",o.onEditTagInput.bind(this,s)),s.addEventListener("keydown",function(t){return o.onEditTagkeydown.call(i,t,e)}),s.focus(),this.setRangeAtStartEnd(!1,s),t.skipValidation||(l=this.editTagToggleValidity(e,a.value)),s.originalIsValid=l,this.trigger("edit:start",{tag:e,index:n,data:a,isValid:l}),this}else console.warn("Cannot find element in Tag template: ",".tagify__tag-text")},editTagToggleValidity:function(t){var e,i=t.__tagifyTagData;if(i)return e=!(!i.__isValid||1==i.__isValid),t.classList.toggle("tagify--invalid",e),i.__isValid;console.warn("tag has no data: ",t,i)},onEditTagDone:function(t,e){e=e||{};var i={tag:t,index:this.getNodeIndex(t),data:e};this.trigger("edit:beforeUpdate",i),delete e.__originalData,t&&(this.editTagToggleValidity(t),this.replaceTag(t,e)),this.trigger("edit:updated",i),this.dropdown.hide.call(this),this.settings.keepInvalidTags&&this.reCheckInvalidTags()},replaceTag:function(t,e){e&&e.value||(e=t.__tagifyTagData),e.__isValid&&1!=e.__isValid&&h(e,this.getInvaildTagParams(e,e.__isValid));var i=this.createTagElem(e);t.parentNode.replaceChild(i,t),this.updateValueByDOMTags()},updateValueByDOMTags:function(){var e=this;this.value.length=0,[].forEach.call(this.getTagElms(),function(t){t.classList.contains("tagify--notAllowed")||e.value.push(e.tagData(t))}),this.update()},setRangeAtStartEnd:function(e,i){i=(i=i||this.DOM.input).lastChild||i;var s=document.getSelection();s.rangeCount&&["Start","End"].forEach(function(t){return s.getRangeAt(0)["set"+t](i,e?0:i.length)})},injectAtCaret:function(t,e){e=e||this.state.selection||{};var i,s=window.getSelection();if(e.anchorNode&&void 0!==e.anchorOffset)return"string"==typeof t&&(t=document.createTextNode(t)),s.getRangeAt&&s.rangeCount&&((i=s.getRangeAt(0)).deleteContents(),i.insertNode(t)),this.DOM.input.focus(),this.setRangeAtStartEnd(!0,t.nextSibling),this.updateValueByDOMTags(),this.update(),this},input:{value:"",set:function(t,e){var i=0=this.settings.maxTags&&this.TEXTS.exceed},normalizeTags:function(t){function i(t){return(t+"").split(o).filter(function(t){return t}).map(function(t){return{value:t.trim()}})}var e,s=this,n=this.settings,a=n.whitelist,o=n.delimiters,r=n.mode,l=!!a&&a[0]instanceof Object,d=t instanceof Array,h=d&&t[0]instanceof Object&&"value"in t[0],c=[];if(h)return t=(e=[]).concat.apply(e,p(t.map(function(e){return i(e.value).map(function(t){return u(u({},e),t)})})));if("number"==typeof t&&(t=t.toString()),"string"==typeof t){if(!t.trim())return[];t=i(t)}else if(d){var g;t=(g=[]).concat.apply(g,p(t.map(function(t){return i(t)})))}return l&&(t.forEach(function(t){var e=s.getWhitelistItemsByValue({value:t.value});e?c.push(e):"mix"!=r&&c.push(t)}),c.length&&(t=c)),t},getWhitelistItemsByValue:function(t){var e=t.value;return this.settings.whitelist.filter(function(t){return c(t.value||t,e)})[0]},parseMixTags:function(t){var o=this,e=this.settings,r=e.mixTagsInterpolator,l=e.duplicates,d=e.transformTag,h=e.enforceWhitelist,c=[];return t=t.split(r[0]).map(function(t,e){var i,s,n=t.split(r[1]),a=n[0];try{i=JSON.parse(a)}catch(t){i=o.normalizeTags(a)[0]}if(!(1=this.settings.maxTags),this.DOM.scope.classList.toggle("tagify--noTags",!this.value.length)},update:function(t){this.preUpdate();var e=this.DOM.originalInput,i=(t||{}).withoutChangeEvent,s=function(t,s){return t.map(function(t){var e={};for(var i in t)s.includes(i)||(e[i]=t[i]);return e})}(this.value,["__isValid","__removed"]);e.value="mix"==this.settings.mode?this.getMixedTagsAsString(s):s.length?this.settings.originalInputValueFormat?this.settings.originalInputValueFormat(s):JSON.stringify(s):"",!i&&this.state.loadedOriginalValues&&this.triggerChangeEvent()},getMixedTagsAsString:function(){var i="",s=this,n=this.settings.mixTagsInterpolator;return function e(t){t.childNodes.forEach(function(t){if(1==t.nodeType){if(t.classList.contains("tagify__tag")&&s.tagData(t)){if(s.tagData(t).__removed)return;return void(i+=n[0]+JSON.stringify(t.__tagifyTagData)+n[1])}"BR"!=t.tagName||t.parentNode!=s.DOM.input&&1!=t.parentNode.childNodes.length?"DIV"!=t.tagName&&"P"!=t.tagName||(i+="\r\n",e(t)):i+="\r\n"}else i+=t.textContent})}(this.DOM.input),i},getNodeHeight:function(t){var e,i=t.cloneNode(!0);return i.style.cssText="position:fixed; top:-9999px; opacity:0",document.body.appendChild(i),e=i.clientHeight,i.parentNode.removeChild(i),e},dropdown:{init:function(){this.DOM.dropdown=a(this.settings.templates.dropdown(this.settings)),this.DOM.dropdown.content=this.DOM.dropdown.querySelector(".tagify__dropdown__wrapper")},show:function(t){var e,i,s,n,a=this,o=this.settings,r=window.getSelection(),l="mix"==o.mode&&!o.enforceWhitelist,d=!o.whitelist||!o.whitelist.length,h="manual"==o.dropdown.position;if(!(d&&!l||!1===o.dropdown.enable||this.state.isLoading)){if(clearTimeout(this.dropdownHide__bindEventsTimeout),this.suggestedListItems=this.dropdown.filterListItems.call(this,t),this.suggestedListItems.length)t&&l&&!this.state.editing.scope&&!c(this.suggestedListItems[0].value,t)&&this.suggestedListItems.unshift({value:t});else{if(!t||!l||this.state.editing.scope)return this.input.autocomplete.suggest.call(this),void this.dropdown.hide.call(this);this.suggestedListItems=[{value:t}]}s=f(i=this.suggestedListItems[0])?i.value:i,o.autoComplete&&s&&0==s.indexOf(t)&&this.input.autocomplete.suggest.call(this,i),e=this.dropdown.createListHTML.call(this,this.suggestedListItems),this.DOM.dropdown.content.innerHTML=g(e),o.dropdown.highlightFirst&&this.dropdown.highlightOption.call(this,this.DOM.dropdown.content.children[0]),this.DOM.scope.setAttribute("aria-expanded",!0),this.state.dropdown.visible||setTimeout(this.dropdown.events.binding.bind(this)),this.state.dropdown.visible=t||!0,this.state.dropdown.query=t,this.state.selection={anchorOffset:r.anchorOffset,anchorNode:r.anchorNode},h||this.dropdown.position.call(this),document.body.contains(this.DOM.dropdown)||h||(n=this.getNodeHeight(this.DOM.dropdown),this.DOM.dropdown.classList.add("tagify__dropdown--initial"),this.dropdown.position.call(this,n),document.body.appendChild(this.DOM.dropdown),setTimeout(function(){return a.DOM.dropdown.classList.remove("tagify__dropdown--initial")})),this.trigger("dropdown:show",this.DOM.dropdown)}},hide:function(t){var e=this,i=this.DOM,s=i.scope,n=i.dropdown,a="manual"==this.settings.dropdown.position&&!t;if(n&&document.body.contains(n)&&!a)return window.removeEventListener("resize",this.dropdown.position),this.dropdown.events.binding.call(this,!1),s.setAttribute("aria-expanded",!1),n.parentNode.removeChild(n),setTimeout(function(){e.state.dropdown.visible=!1},100),this.state.dropdown.query=this.state.ddItemData=this.state.ddItemElm=this.state.selection=null,this.state.tag&&this.state.tag.value.length&&(this.state.flaggedTags[this.state.tag.baseOffset]=this.state.tag),this.trigger("dropdown:hide",n),this},refilter:function(t){var e;t=t||this.state.dropdown.query||"",this.suggestedListItems=this.dropdown.filterListItems.call(this,t),this.suggestedListItems.length?(e=this.dropdown.createListHTML.call(this,this.suggestedListItems),this.DOM.dropdown.content.innerHTML=g(e)):this.dropdown.hide.call(this),this.trigger("dropdown:updated",this.DOM.dropdown)},position:function(t){var e,i,s,n,a,o,r=this.DOM.dropdown,l=this.DOM["input"==this.settings.dropdown.position?"input":"scope"];this.state.dropdown.visible&&(o="text"==this.settings.dropdown.position?(n=(i=this.getCaretGlobalPosition()).bottom,s=i.top,a=i.left,"auto"):(s=(i=l.getBoundingClientRect()).top,n=i.bottom-1,a=i.left,i.width+"px"),s=Math.floor(s),n=Math.ceil(n),e=document.documentElement.clientHeight-n<(t||r.clientHeight),r.style.cssText="left:"+(a+window.pageXOffset)+"px; width:"+o+";"+(e?"bottom:"+(document.documentElement.clientHeight-s-window.pageYOffset-2)+"px;":"top: "+(n+window.pageYOffset)+"px"),r.setAttribute("placement",e?"top":"bottom"))},events:{binding:function(t){var e=!(0