diff --git a/bower.json b/bower.json index fefacf19..2f4e1392 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,7 @@ { "name": "tribute", "description": "Native ES6 @mentions", - "version": "4.1.0", + "version": "4.1.1", "main": [ "dist/tribute.js", "dist/tribute.css" diff --git a/dist/tribute.min.js b/dist/tribute.min.js index 11a74c00..13e0606a 100644 --- a/dist/tribute.min.js +++ b/dist/tribute.min.js @@ -1,2 +1,2 @@ - +!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{("undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this).Tribute=e()}}(function(){return function o(u,a,l){function s(t,e){if(!a[t]){if(!u[t]){var n="function"==typeof require&&require;if(!e&&n)return n(t,!0);if(c)return c(t,!0);var i=new Error("Cannot find module '"+t+"'");throw i.code="MODULE_NOT_FOUND",i}var r=a[t]={exports:{}};u[t][0].call(r.exports,function(e){return s(u[t][1][e]||e)},r,r.exports,o,u,a,l)}return a[t].exports}for(var c="function"==typeof require&&require,e=0;e",post:u.current.collection.searchOpts.post||"",skip:u.current.collection.searchOpts.skip,extract:function(e){if("string"==typeof u.current.collection.lookup)return e[u.current.collection.lookup];if("function"==typeof u.current.collection.lookup)return u.current.collection.lookup(e,u.current.mentionText);throw new Error("Invalid lookup attribute, lookup must be string or function.")}});u.current.collection.menuItemLimit&&(t=t.slice(0,u.current.collection.menuItemLimit)),u.current.filteredItems=t;var n=u.menu.querySelector("ul");if(u.range.positionMenuAtCaret(o),!t.length){var i=new CustomEvent("tribute-no-match",{detail:u.menu});return u.current.element.dispatchEvent(i),void("function"==typeof u.current.collection.noMatchTemplate&&!u.current.collection.noMatchTemplate()||!u.current.collection.noMatchTemplate?u.hideMenu():"function"==typeof u.current.collection.noMatchTemplate?n.innerHTML=u.current.collection.noMatchTemplate():n.innerHTML=u.current.collection.noMatchTemplate)}n.innerHTML="";var r=u.range.getDocument().createDocumentFragment();t.forEach(function(e,t){var n=u.range.getDocument().createElement("li");n.setAttribute("data-index",t),n.addEventListener("mousemove",function(e){var t=a(u._findLiTarget(e.target),2),n=(t[0],t[1]);0!==e.movementY&&u.events.setActiveLi(n)}),u.menuSelected===t&&(n.className=u.current.collection.selectClass),n.innerHTML=u.current.collection.menuItemTemplate(e),r.appendChild(n)}),n.appendChild(r)}};"function"==typeof this.current.collection.values?this.current.collection.values(this.current.mentionText,t):t(this.current.collection.values)}}},{key:"_findLiTarget",value:function(e){if(!e)return[];var t=e.getAttribute("data-index");return t?[e,t]:this._findLiTarget(e.parentNode)}},{key:"showMenuForCollection",value:function(e,t){e!==document.activeElement&&this.placeCaretAtEnd(e),this.current.collection=this.collection[t||0],this.current.externalTrigger=!0,(this.current.element=e).isContentEditable?this.insertTextAtCursor(this.current.collection.trigger):this.insertAtCaret(e,this.current.collection.trigger),this.showMenuFor(e)}},{key:"placeCaretAtEnd",value:function(e){if(e.focus(),void 0!==window.getSelection&&void 0!==document.createRange){var t=document.createRange();t.selectNodeContents(e),t.collapse(!1);var n=window.getSelection();n.removeAllRanges(),n.addRange(t)}else if(void 0!==document.body.createTextRange){var i=document.body.createTextRange();i.moveToElementText(e),i.collapse(!1),i.select()}}},{key:"insertTextAtCursor",value:function(e){var t,n;(n=(t=window.getSelection()).getRangeAt(0)).deleteContents();var i=document.createTextNode(e);n.insertNode(i),n.selectNodeContents(i),n.collapse(!1),t.removeAllRanges(),t.addRange(n)}},{key:"insertAtCaret",value:function(e,t){var n=e.scrollTop,i=e.selectionStart,r=e.value.substring(0,i),o=e.value.substring(e.selectionEnd,e.value.length);e.value=r+t+o,i+=t.length,e.selectionStart=i,e.selectionEnd=i,e.focus(),e.scrollTop=n}},{key:"hideMenu",value:function(){this.menu&&(this.menu.style.cssText="display: none;",this.isActive=!1,this.menuSelected=0,this.current={})}},{key:"selectItemAtIndex",value:function(e,t){if("number"==typeof(e=parseInt(e))&&!isNaN(e)){var n=this.current.filteredItems[e],i=this.current.collection.selectTemplate(n);null!==i&&this.replaceText(i,t,n)}}},{key:"replaceText",value:function(e,t,n){this.range.replaceTriggerText(e,!0,!0,t,n)}},{key:"_append",value:function(e,t,n){if("function"==typeof e.values)throw new Error("Unable to append to values, as it is a function.");e.values=n?t:e.values.concat(t)}},{key:"append",value:function(e,t,n){var i=parseInt(e);if("number"!=typeof i)throw new Error("please provide an index for the collection to update.");var r=this.collection[i];this._append(r,t,n)}},{key:"appendCurrent",value:function(e,t){if(!this.isActive)throw new Error("No active state. Please use append instead and pass an index.");this._append(this.current.collection,e,t)}},{key:"detach",value:function(e){if(!e)throw new Error("[Tribute] Must pass in a DOM node or NodeList.");if("undefined"!=typeof jQuery&&e instanceof jQuery&&(e=e.get()),e.constructor===NodeList||e.constructor===HTMLCollection||e.constructor===Array)for(var t=e.length,n=0;n'+(this.current.collection.trigger+e.original[this.current.collection.fillAttr])+"":this.current.collection.trigger+e.original[this.current.collection.fillAttr]}},{key:"defaultMenuItemTemplate",value:function(e){return e.string}},{key:"inputTypes",value:function(){return["TEXTAREA","INPUT"]}}]),q}();n.default=o,t.exports=n.default},{"./TributeEvents":2,"./TributeMenuEvents":3,"./TributeRange":4,"./TributeSearch":5,"./utils":7}],2:[function(e,t,n){"use strict";function i(e,t){for(var n=0;n container for the click");n.selectItemAtIndex(i.getAttribute("data-index"),t),n.hideMenu()}else n.current.element&&!n.current.externalTrigger&&(n.current.externalTrigger=!1,setTimeout(function(){return n.hideMenu()}))}},{key:"keyup",value:function(e,t){if(e.inputEvent&&(e.inputEvent=!1),e.updateSelection(this),27!==t.keyCode){if(!e.tribute.allowSpaces&&e.tribute.hasTrailingSpace)return e.tribute.hasTrailingSpace=!1,e.commandEvent=!0,void e.callbacks().space(t,this);if(!e.tribute.isActive)if(e.tribute.autocompleteMode)e.callbacks().triggerChar(t,this,"");else{var n=e.getKeyCode(e,this,t);if(isNaN(n)||!n)return;var i=e.tribute.triggers().find(function(e){return e.charCodeAt(0)===n});void 0!==i&&e.callbacks().triggerChar(t,this,i)}((e.tribute.current.trigger||e.tribute.autocompleteMode)&&!1===e.commandEvent||e.tribute.isActive&&8===t.keyCode)&&e.tribute.showMenuFor(this,!0)}}},{key:"shouldDeactivate",value:function(t){if(!this.tribute.isActive)return!1;if(0!==this.tribute.current.mentionText.length)return!1;var n=!1;return r.keys().forEach(function(e){t.keyCode===e.key&&(n=!0)}),!n}},{key:"getKeyCode",value:function(e,t,n){var i=e.tribute,r=i.range.getTriggerInfo(!1,i.hasTrailingSpace,!0,i.allowSpaces,i.autocompleteMode);return!!r&&r.mentionTriggerChar.charCodeAt(0)}},{key:"updateSelection",value:function(e){this.tribute.current.element=e;var t=this.tribute.range.getTriggerInfo(!1,this.tribute.hasTrailingSpace,!0,this.tribute.allowSpaces,this.tribute.autocompleteMode);t&&(this.tribute.current.selectedPath=t.mentionSelectedPath,this.tribute.current.mentionText=t.mentionText,this.tribute.current.selectedOffset=t.mentionSelectedOffset)}},{key:"callbacks",value:function(){var o=this;return{triggerChar:function(e,t,n){var i=o.tribute;i.current.trigger=n;var r=i.collection.find(function(e){return e.trigger===n});i.current.collection=r,i.inputEvent&&i.showMenuFor(t,!0)},enter:function(e,t){o.tribute.isActive&&o.tribute.current.filteredItems&&(e.preventDefault(),e.stopPropagation(),setTimeout(function(){o.tribute.selectItemAtIndex(o.tribute.menuSelected,e),o.tribute.hideMenu()},0))},escape:function(e,t){o.tribute.isActive&&(e.preventDefault(),e.stopPropagation(),o.tribute.isActive=!1,o.tribute.hideMenu())},tab:function(e,t){o.callbacks().enter(e,t)},space:function(e,t){o.tribute.isActive&&(o.tribute.spaceSelectsMatch?o.callbacks().enter(e,t):o.tribute.allowSpaces||(e.stopPropagation(),setTimeout(function(){o.tribute.hideMenu(),o.tribute.isActive=!1},0)))},up:function(e,t){if(o.tribute.isActive&&o.tribute.current.filteredItems){e.preventDefault(),e.stopPropagation();var n=o.tribute.current.filteredItems.length,i=o.tribute.menuSelected;i>>0;e&&(this.tribute.menuSelected=parseInt(e));for(var i=0;iu.bottom){var a=o.bottom-u.bottom;this.tribute.menu.scrollTop+=a}else if(o.tope.width&&(t.left||t.right),i=window.innerHeight>e.height&&(t.top||t.bottom);(n||i)&&(u.tribute.menu.style.cssText="display: none",u.positionMenuAtCaret(r))},0)}else this.tribute.menu.style.cssText="display: none"}},{key:"selectElement",value:function(e,t,n){var i,r=e;if(t)for(var o=0;oMath.ceil(o+n),bottom:s>Math.ceil(u+i),left:cparseInt(u.height)&&(o.overflowY="scroll")):o.overflow="hidden",r.textContent=e.value.substring(0,t),"INPUT"===e.nodeName&&(r.textContent=r.textContent.replace(/\s/g," "));var a=this.getDocument().createElement("span");a.textContent=e.value.substring(t)||".",r.appendChild(a);var l=e.getBoundingClientRect(),s=document.documentElement,c=(window.pageXOffset||s.scrollLeft)-(s.clientLeft||0),d=(window.pageYOffset||s.scrollTop)-(s.clientTop||0),f=0,h=0;this.menuContainerIsBody&&(f=l.top,h=l.left);var p={top:f+d+a.offsetTop+parseInt(u.borderTopWidth)+parseInt(u.fontSize)-e.scrollTop,left:h+c+a.offsetLeft+parseInt(u.borderLeftWidth)},v=window.innerWidth,m=window.innerHeight,g=this.getMenuDimensions(),b=this.isMenuOffScreen(p,g);b.right&&(p.right=v-p.left,p.left="auto");var y=this.tribute.menuContainer?this.tribute.menuContainer.offsetHeight:this.getDocument().body.offsetHeight;if(b.bottom){var w=y-(m-(this.tribute.menuContainer?this.tribute.menuContainer.getBoundingClientRect():this.getDocument().body.getBoundingClientRect()).top);p.bottom=w+(m-l.top-a.offsetTop),p.top="auto"}return(b=this.isMenuOffScreen(p,g)).left&&(p.left=v>g.width?c+v-g.width:c,delete p.right),b.top&&(p.top=m>g.height?d+m-g.height:d,delete p.bottom),this.getDocument().body.removeChild(r),p}},{key:"getContentEditableCaretPosition",value:function(e){var t,n,i="sel_".concat((new Date).getTime(),"_").concat(Math.random().toString().substr(2)),r=this.getWindowSelection(),o=r.getRangeAt(0);(n=this.getDocument().createRange()).setStart(r.anchorNode,e),n.setEnd(r.anchorNode,e),n.collapse(!1),(t=this.getDocument().createElement("span")).id=i,t.appendChild(this.getDocument().createTextNode("\ufeff")),n.insertNode(t),r.removeAllRanges(),r.addRange(o);var u=t.getBoundingClientRect(),a=document.documentElement,l=(window.pageXOffset||a.scrollLeft)-(a.clientLeft||0),s=(window.pageYOffset||a.scrollTop)-(a.clientTop||0),c=0,d=0;d=this.menuContainerIsBody?(c=u.left,u.top):(c=t.offsetLeft,t.offsetTop);var f={left:c+l,top:d+t.offsetHeight+s},h=window.innerWidth,p=window.innerHeight,v=this.getMenuDimensions(),m=this.isMenuOffScreen(f,v);m.right&&(f.left="auto",f.right=h-u.left-l);var g=this.tribute.menuContainer?this.tribute.menuContainer.offsetHeight:this.getDocument().body.offsetHeight;if(m.bottom){var b=g-(p-(this.tribute.menuContainer?this.tribute.menuContainer.getBoundingClientRect():this.getDocument().body.getBoundingClientRect()).top);f.top="auto",f.bottom=b+(p-u.top)}return(m=this.isMenuOffScreen(f,v)).left&&(f.left=h>v.width?l+h-v.width:l,delete f.right),m.top&&(f.top=p>v.height?s+p-v.height:s,delete f.bottom),t.parentNode.removeChild(t),f}},{key:"scrollIntoView",value:function(e){var t,n=this.menu;if(void 0!==n){for(;void 0===t||0===t.height;)if(0===(t=n.getBoundingClientRect()).height&&(void 0===(n=n.childNodes[0])||!n.getBoundingClientRect))return;var i=t.top,r=i+t.height;if(i<0)window.scrollTo(0,window.pageYOffset+t.top-20);else if(r>window.innerHeight){var o=window.pageYOffset+t.top-20;100e.length-n)){for(var o,u,a=t[i],l=e.indexOf(a,n);-1>>0,r=arguments[1],o=0;o',\n post: _this2.current.collection.searchOpts.post || '',\n skip: _this2.current.collection.searchOpts.skip,\n extract: function extract(el) {\n if (typeof _this2.current.collection.lookup === 'string') {\n return el[_this2.current.collection.lookup];\n } else if (typeof _this2.current.collection.lookup === 'function') {\n return _this2.current.collection.lookup(el, _this2.current.mentionText);\n } else {\n throw new Error('Invalid lookup attribute, lookup must be string or function.');\n }\n }\n });\n\n if (_this2.current.collection.menuItemLimit) {\n items = items.slice(0, _this2.current.collection.menuItemLimit);\n }\n\n _this2.current.filteredItems = items;\n\n var ul = _this2.menu.querySelector('ul');\n\n _this2.range.positionMenuAtCaret(scrollTo);\n\n if (!items.length) {\n var noMatchEvent = new CustomEvent('tribute-no-match', {\n detail: _this2.menu\n });\n\n _this2.current.element.dispatchEvent(noMatchEvent);\n\n if (typeof _this2.current.collection.noMatchTemplate === 'function' && !_this2.current.collection.noMatchTemplate() || !_this2.current.collection.noMatchTemplate) {\n _this2.hideMenu();\n } else {\n typeof _this2.current.collection.noMatchTemplate === 'function' ? ul.innerHTML = _this2.current.collection.noMatchTemplate() : ul.innerHTML = _this2.current.collection.noMatchTemplate;\n }\n\n return;\n }\n\n ul.innerHTML = '';\n\n var fragment = _this2.range.getDocument().createDocumentFragment();\n\n items.forEach(function (item, index) {\n var li = _this2.range.getDocument().createElement('li');\n\n li.setAttribute('data-index', index);\n li.addEventListener('mousemove', function (e) {\n var _this2$_findLiTarget = _this2._findLiTarget(e.target),\n _this2$_findLiTarget2 = _slicedToArray(_this2$_findLiTarget, 2),\n li = _this2$_findLiTarget2[0],\n index = _this2$_findLiTarget2[1];\n\n if (e.movementY !== 0) {\n _this2.events.setActiveLi(index);\n }\n });\n\n if (_this2.menuSelected === index) {\n li.className = _this2.current.collection.selectClass;\n }\n\n li.innerHTML = _this2.current.collection.menuItemTemplate(item);\n fragment.appendChild(li);\n });\n ul.appendChild(fragment);\n };\n\n if (typeof this.current.collection.values === 'function') {\n this.current.collection.values(this.current.mentionText, processValues);\n } else {\n processValues(this.current.collection.values);\n }\n }\n }, {\n key: \"_findLiTarget\",\n value: function _findLiTarget(el) {\n if (!el) return [];\n var index = el.getAttribute('data-index');\n return !index ? this._findLiTarget(el.parentNode) : [el, index];\n }\n }, {\n key: \"showMenuForCollection\",\n value: function showMenuForCollection(element, collectionIndex) {\n if (element !== document.activeElement) {\n this.placeCaretAtEnd(element);\n }\n\n this.current.collection = this.collection[collectionIndex || 0];\n this.current.externalTrigger = true;\n this.current.element = element;\n if (element.isContentEditable) this.insertTextAtCursor(this.current.collection.trigger);else this.insertAtCaret(element, this.current.collection.trigger);\n this.showMenuFor(element);\n } // TODO: make sure this works for inputs/textareas\n\n }, {\n key: \"placeCaretAtEnd\",\n value: function placeCaretAtEnd(el) {\n el.focus();\n\n if (typeof window.getSelection != \"undefined\" && typeof document.createRange != \"undefined\") {\n var range = document.createRange();\n range.selectNodeContents(el);\n range.collapse(false);\n var sel = window.getSelection();\n sel.removeAllRanges();\n sel.addRange(range);\n } else if (typeof document.body.createTextRange != \"undefined\") {\n var textRange = document.body.createTextRange();\n textRange.moveToElementText(el);\n textRange.collapse(false);\n textRange.select();\n }\n } // for contenteditable\n\n }, {\n key: \"insertTextAtCursor\",\n value: function insertTextAtCursor(text) {\n var sel, range, html;\n sel = window.getSelection();\n range = sel.getRangeAt(0);\n range.deleteContents();\n var textNode = document.createTextNode(text);\n range.insertNode(textNode);\n range.selectNodeContents(textNode);\n range.collapse(false);\n sel.removeAllRanges();\n sel.addRange(range);\n } // for regular inputs\n\n }, {\n key: \"insertAtCaret\",\n value: function insertAtCaret(textarea, text) {\n var scrollPos = textarea.scrollTop;\n var caretPos = textarea.selectionStart;\n var front = textarea.value.substring(0, caretPos);\n var back = textarea.value.substring(textarea.selectionEnd, textarea.value.length);\n textarea.value = front + text + back;\n caretPos = caretPos + text.length;\n textarea.selectionStart = caretPos;\n textarea.selectionEnd = caretPos;\n textarea.focus();\n textarea.scrollTop = scrollPos;\n }\n }, {\n key: \"hideMenu\",\n value: function hideMenu() {\n if (this.menu) {\n this.menu.style.cssText = 'display: none;';\n this.isActive = false;\n this.menuSelected = 0;\n this.current = {};\n }\n }\n }, {\n key: \"selectItemAtIndex\",\n value: function selectItemAtIndex(index, originalEvent) {\n index = parseInt(index);\n if (typeof index !== 'number' || isNaN(index)) return;\n var item = this.current.filteredItems[index];\n var content = this.current.collection.selectTemplate(item);\n if (content !== null) this.replaceText(content, originalEvent, item);\n }\n }, {\n key: \"replaceText\",\n value: function replaceText(content, originalEvent, item) {\n this.range.replaceTriggerText(content, true, true, originalEvent, item);\n }\n }, {\n key: \"_append\",\n value: function _append(collection, newValues, replace) {\n if (typeof collection.values === 'function') {\n throw new Error('Unable to append to values, as it is a function.');\n } else if (!replace) {\n collection.values = collection.values.concat(newValues);\n } else {\n collection.values = newValues;\n }\n }\n }, {\n key: \"append\",\n value: function append(collectionIndex, newValues, replace) {\n var index = parseInt(collectionIndex);\n if (typeof index !== 'number') throw new Error('please provide an index for the collection to update.');\n var collection = this.collection[index];\n\n this._append(collection, newValues, replace);\n }\n }, {\n key: \"appendCurrent\",\n value: function appendCurrent(newValues, replace) {\n if (this.isActive) {\n this._append(this.current.collection, newValues, replace);\n } else {\n throw new Error('No active state. Please use append instead and pass an index.');\n }\n }\n }, {\n key: \"detach\",\n value: function detach(el) {\n if (!el) {\n throw new Error('[Tribute] Must pass in a DOM node or NodeList.');\n } // Check if it is a jQuery collection\n\n\n if (typeof jQuery !== 'undefined' && el instanceof jQuery) {\n el = el.get();\n } // Is el an Array/Array-like object?\n\n\n if (el.constructor === NodeList || el.constructor === HTMLCollection || el.constructor === Array) {\n var length = el.length;\n\n for (var i = 0; i < length; ++i) {\n this._detach(el[i]);\n }\n } else {\n this._detach(el);\n }\n }\n }, {\n key: \"_detach\",\n value: function _detach(el) {\n var _this3 = this;\n\n this.events.unbind(el);\n\n if (el.tributeMenu) {\n this.menuEvents.unbind(el.tributeMenu);\n }\n\n setTimeout(function () {\n el.removeAttribute('data-tribute');\n _this3.isActive = false;\n\n if (el.tributeMenu) {\n el.tributeMenu.remove();\n }\n });\n }\n }], [{\n key: \"defaultSelectTemplate\",\n value: function defaultSelectTemplate(item) {\n if (typeof item === 'undefined') return null;\n\n if (this.range.isContentEditable(this.current.element)) {\n return '' + (this.current.collection.trigger + item.original[this.current.collection.fillAttr]) + '';\n }\n\n return this.current.collection.trigger + item.original[this.current.collection.fillAttr];\n }\n }, {\n key: \"defaultMenuItemTemplate\",\n value: function defaultMenuItemTemplate(matchItem) {\n return matchItem.string;\n }\n }, {\n key: \"inputTypes\",\n value: function inputTypes() {\n return ['TEXTAREA', 'INPUT'];\n }\n }]);\n\n return Tribute;\n}();\n\nvar _default = Tribute;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n},{\"./TributeEvents\":2,\"./TributeMenuEvents\":3,\"./TributeRange\":4,\"./TributeSearch\":5,\"./utils\":7}],2:[function(require,module,exports){\n\"use strict\";\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports[\"default\"] = void 0;\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nvar TributeEvents =\n/*#__PURE__*/\nfunction () {\n function TributeEvents(tribute) {\n _classCallCheck(this, TributeEvents);\n\n this.tribute = tribute;\n this.tribute.events = this;\n }\n\n _createClass(TributeEvents, [{\n key: \"bind\",\n value: function bind(element) {\n element.boundKeydown = this.keydown.bind(element, this);\n element.boundKeyup = this.keyup.bind(element, this);\n element.boundInput = this.input.bind(element, this);\n element.addEventListener('keydown', element.boundKeydown, false);\n element.addEventListener('keyup', element.boundKeyup, false);\n element.addEventListener('input', element.boundInput, false);\n }\n }, {\n key: \"unbind\",\n value: function unbind(element) {\n element.removeEventListener('keydown', element.boundKeydown, false);\n element.removeEventListener('keyup', element.boundKeyup, false);\n element.removeEventListener('input', element.boundInput, false);\n delete element.boundKeydown;\n delete element.boundKeyup;\n delete element.boundInput;\n }\n }, {\n key: \"keydown\",\n value: function keydown(instance, event) {\n if (instance.shouldDeactivate(event)) {\n instance.tribute.isActive = false;\n instance.tribute.hideMenu();\n }\n\n var element = this;\n instance.commandEvent = false;\n TributeEvents.keys().forEach(function (o) {\n if (o.key === event.keyCode) {\n instance.commandEvent = true;\n instance.callbacks()[o.value.toLowerCase()](event, element);\n }\n });\n }\n }, {\n key: \"input\",\n value: function input(instance, event) {\n instance.inputEvent = true;\n instance.keyup.call(this, instance, event);\n }\n }, {\n key: \"click\",\n value: function click(instance, event) {\n var tribute = instance.tribute;\n\n if (tribute.menu && tribute.menu.contains(event.target)) {\n var li = event.target;\n event.preventDefault();\n event.stopPropagation();\n\n while (li.nodeName.toLowerCase() !== 'li') {\n li = li.parentNode;\n\n if (!li || li === tribute.menu) {\n throw new Error('cannot find the
  • container for the click');\n }\n }\n\n tribute.selectItemAtIndex(li.getAttribute('data-index'), event);\n tribute.hideMenu(); // TODO: should fire with externalTrigger and target is outside of menu\n } else if (tribute.current.element && !tribute.current.externalTrigger) {\n tribute.current.externalTrigger = false;\n setTimeout(function () {\n return tribute.hideMenu();\n });\n }\n }\n }, {\n key: \"keyup\",\n value: function keyup(instance, event) {\n if (instance.inputEvent) {\n instance.inputEvent = false;\n }\n\n instance.updateSelection(this);\n if (event.keyCode === 27) return;\n\n if (!instance.tribute.allowSpaces && instance.tribute.hasTrailingSpace) {\n instance.tribute.hasTrailingSpace = false;\n instance.commandEvent = true;\n instance.callbacks()[\"space\"](event, this);\n return;\n }\n\n if (!instance.tribute.isActive) {\n if (instance.tribute.autocompleteMode) {\n instance.callbacks().triggerChar(event, this, '');\n } else {\n var keyCode = instance.getKeyCode(instance, this, event);\n if (isNaN(keyCode) || !keyCode) return;\n var trigger = instance.tribute.triggers().find(function (trigger) {\n return trigger.charCodeAt(0) === keyCode;\n });\n\n if (typeof trigger !== 'undefined') {\n instance.callbacks().triggerChar(event, this, trigger);\n }\n }\n }\n\n if ((instance.tribute.current.trigger || instance.tribute.autocompleteMode) && instance.commandEvent === false || instance.tribute.isActive && event.keyCode === 8) {\n instance.tribute.showMenuFor(this, true);\n }\n }\n }, {\n key: \"shouldDeactivate\",\n value: function shouldDeactivate(event) {\n if (!this.tribute.isActive) return false;\n\n if (this.tribute.current.mentionText.length === 0) {\n var eventKeyPressed = false;\n TributeEvents.keys().forEach(function (o) {\n if (event.keyCode === o.key) eventKeyPressed = true;\n });\n return !eventKeyPressed;\n }\n\n return false;\n }\n }, {\n key: \"getKeyCode\",\n value: function getKeyCode(instance, el, event) {\n var _char;\n\n var tribute = instance.tribute;\n var info = tribute.range.getTriggerInfo(false, tribute.hasTrailingSpace, true, tribute.allowSpaces, tribute.autocompleteMode);\n\n if (info) {\n return info.mentionTriggerChar.charCodeAt(0);\n } else {\n return false;\n }\n }\n }, {\n key: \"updateSelection\",\n value: function updateSelection(el) {\n this.tribute.current.element = el;\n var info = this.tribute.range.getTriggerInfo(false, this.tribute.hasTrailingSpace, true, this.tribute.allowSpaces, this.tribute.autocompleteMode);\n\n if (info) {\n this.tribute.current.selectedPath = info.mentionSelectedPath;\n this.tribute.current.mentionText = info.mentionText;\n this.tribute.current.selectedOffset = info.mentionSelectedOffset;\n }\n }\n }, {\n key: \"callbacks\",\n value: function callbacks() {\n var _this = this;\n\n return {\n triggerChar: function triggerChar(e, el, trigger) {\n var tribute = _this.tribute;\n tribute.current.trigger = trigger;\n var collectionItem = tribute.collection.find(function (item) {\n return item.trigger === trigger;\n });\n tribute.current.collection = collectionItem;\n if (tribute.inputEvent) tribute.showMenuFor(el, true);\n },\n enter: function enter(e, el) {\n // choose selection\n if (_this.tribute.isActive && _this.tribute.current.filteredItems) {\n e.preventDefault();\n e.stopPropagation();\n setTimeout(function () {\n _this.tribute.selectItemAtIndex(_this.tribute.menuSelected, e);\n\n _this.tribute.hideMenu();\n }, 0);\n }\n },\n escape: function escape(e, el) {\n if (_this.tribute.isActive) {\n e.preventDefault();\n e.stopPropagation();\n _this.tribute.isActive = false;\n\n _this.tribute.hideMenu();\n }\n },\n tab: function tab(e, el) {\n // choose first match\n _this.callbacks().enter(e, el);\n },\n space: function space(e, el) {\n if (_this.tribute.isActive) {\n if (_this.tribute.spaceSelectsMatch) {\n _this.callbacks().enter(e, el);\n } else if (!_this.tribute.allowSpaces) {\n e.stopPropagation();\n setTimeout(function () {\n _this.tribute.hideMenu();\n\n _this.tribute.isActive = false;\n }, 0);\n }\n }\n },\n up: function up(e, el) {\n // navigate up ul\n if (_this.tribute.isActive && _this.tribute.current.filteredItems) {\n e.preventDefault();\n e.stopPropagation();\n var count = _this.tribute.current.filteredItems.length,\n selected = _this.tribute.menuSelected;\n\n if (count > selected && selected > 0) {\n _this.tribute.menuSelected--;\n\n _this.setActiveLi();\n } else if (selected === 0) {\n _this.tribute.menuSelected = count - 1;\n\n _this.setActiveLi();\n\n _this.tribute.menu.scrollTop = _this.tribute.menu.scrollHeight;\n }\n }\n },\n down: function down(e, el) {\n // navigate down ul\n if (_this.tribute.isActive && _this.tribute.current.filteredItems) {\n e.preventDefault();\n e.stopPropagation();\n var count = _this.tribute.current.filteredItems.length - 1,\n selected = _this.tribute.menuSelected;\n\n if (count > selected) {\n _this.tribute.menuSelected++;\n\n _this.setActiveLi();\n } else if (count === selected) {\n _this.tribute.menuSelected = 0;\n\n _this.setActiveLi();\n\n _this.tribute.menu.scrollTop = 0;\n }\n }\n },\n \"delete\": function _delete(e, el) {\n if (_this.tribute.isActive && _this.tribute.current.mentionText.length < 1) {\n _this.tribute.hideMenu();\n } else if (_this.tribute.isActive) {\n _this.tribute.showMenuFor(el);\n }\n }\n };\n }\n }, {\n key: \"setActiveLi\",\n value: function setActiveLi(index) {\n var lis = this.tribute.menu.querySelectorAll('li'),\n length = lis.length >>> 0;\n if (index) this.tribute.menuSelected = parseInt(index);\n\n for (var i = 0; i < length; i++) {\n var li = lis[i];\n\n if (i === this.tribute.menuSelected) {\n li.classList.add(this.tribute.current.collection.selectClass);\n var liClientRect = li.getBoundingClientRect();\n var menuClientRect = this.tribute.menu.getBoundingClientRect();\n\n if (liClientRect.bottom > menuClientRect.bottom) {\n var scrollDistance = liClientRect.bottom - menuClientRect.bottom;\n this.tribute.menu.scrollTop += scrollDistance;\n } else if (liClientRect.top < menuClientRect.top) {\n var _scrollDistance = menuClientRect.top - liClientRect.top;\n\n this.tribute.menu.scrollTop -= _scrollDistance;\n }\n } else {\n li.classList.remove(this.tribute.current.collection.selectClass);\n }\n }\n }\n }, {\n key: \"getFullHeight\",\n value: function getFullHeight(elem, includeMargin) {\n var height = elem.getBoundingClientRect().height;\n\n if (includeMargin) {\n var style = elem.currentStyle || window.getComputedStyle(elem);\n return height + parseFloat(style.marginTop) + parseFloat(style.marginBottom);\n }\n\n return height;\n }\n }], [{\n key: \"keys\",\n value: function keys() {\n return [{\n key: 9,\n value: 'TAB'\n }, {\n key: 8,\n value: 'DELETE'\n }, {\n key: 13,\n value: 'ENTER'\n }, {\n key: 27,\n value: 'ESCAPE'\n }, {\n key: 32,\n value: 'SPACE'\n }, {\n key: 38,\n value: 'UP'\n }, {\n key: 40,\n value: 'DOWN'\n }];\n }\n }]);\n\n return TributeEvents;\n}();\n\nvar _default = TributeEvents;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n},{}],3:[function(require,module,exports){\n\"use strict\";\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports[\"default\"] = void 0;\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nvar TributeMenuEvents =\n/*#__PURE__*/\nfunction () {\n function TributeMenuEvents(tribute) {\n _classCallCheck(this, TributeMenuEvents);\n\n this.tribute = tribute;\n this.tribute.menuEvents = this;\n this.menu = this.tribute.menu;\n }\n\n _createClass(TributeMenuEvents, [{\n key: \"bind\",\n value: function bind(menu) {\n var _this = this;\n\n this.menuClickEvent = this.tribute.events.click.bind(null, this);\n this.menuContainerScrollEvent = this.debounce(function () {\n if (_this.tribute.isActive) {\n _this.tribute.showMenuFor(_this.tribute.current.element, false);\n }\n }, 300, false);\n this.windowResizeEvent = this.debounce(function () {\n if (_this.tribute.isActive) {\n _this.tribute.range.positionMenuAtCaret(true);\n }\n }, 300, false); // fixes IE11 issues with mousedown\n\n this.tribute.range.getDocument().addEventListener('MSPointerDown', this.menuClickEvent, false);\n this.tribute.range.getDocument().addEventListener('mousedown', this.menuClickEvent, false);\n window.addEventListener('resize', this.windowResizeEvent);\n\n if (this.menuContainer) {\n this.menuContainer.addEventListener('scroll', this.menuContainerScrollEvent, false);\n } else {\n window.addEventListener('scroll', this.menuContainerScrollEvent);\n }\n }\n }, {\n key: \"unbind\",\n value: function unbind(menu) {\n this.tribute.range.getDocument().removeEventListener('mousedown', this.menuClickEvent, false);\n this.tribute.range.getDocument().removeEventListener('MSPointerDown', this.menuClickEvent, false);\n window.removeEventListener('resize', this.windowResizeEvent);\n\n if (this.menuContainer) {\n this.menuContainer.removeEventListener('scroll', this.menuContainerScrollEvent, false);\n } else {\n window.removeEventListener('scroll', this.menuContainerScrollEvent);\n }\n }\n }, {\n key: \"debounce\",\n value: function debounce(func, wait, immediate) {\n var _this2 = this,\n _arguments = arguments;\n\n var timeout;\n return function () {\n var context = _this2,\n args = _arguments;\n\n var later = function later() {\n timeout = null;\n if (!immediate) func.apply(context, args);\n };\n\n var callNow = immediate && !timeout;\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n if (callNow) func.apply(context, args);\n };\n }\n }]);\n\n return TributeMenuEvents;\n}();\n\nvar _default = TributeMenuEvents;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n},{}],4:[function(require,module,exports){\n\"use strict\";\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports[\"default\"] = void 0;\n\nrequire(\"./utils\");\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nvar TributeRange =\n/*#__PURE__*/\nfunction () {\n function TributeRange(tribute) {\n _classCallCheck(this, TributeRange);\n\n this.tribute = tribute;\n this.tribute.range = this;\n }\n\n _createClass(TributeRange, [{\n key: \"getDocument\",\n value: function getDocument() {\n var iframe;\n\n if (this.tribute.current.collection) {\n iframe = this.tribute.current.collection.iframe;\n }\n\n if (!iframe) {\n return document;\n }\n\n return iframe.contentWindow.document;\n }\n }, {\n key: \"positionMenuAtCaret\",\n value: function positionMenuAtCaret(scrollTo) {\n var _this = this;\n\n var context = this.tribute.current,\n coordinates;\n var info = this.getTriggerInfo(false, this.tribute.hasTrailingSpace, true, this.tribute.allowSpaces, this.tribute.autocompleteMode);\n\n if (typeof info !== 'undefined') {\n if (!this.tribute.positionMenu) {\n this.tribute.menu.style.cssText = \"display: block;\";\n return;\n }\n\n if (!this.isContentEditable(context.element)) {\n coordinates = this.getTextAreaOrInputUnderlinePosition(this.tribute.current.element, info.mentionPosition);\n } else {\n coordinates = this.getContentEditableCaretPosition(info.mentionPosition);\n }\n\n this.tribute.menu.style.cssText = \"top: \".concat(coordinates.top, \"px;\\n left: \").concat(coordinates.left, \"px;\\n right: \").concat(coordinates.right, \"px;\\n bottom: \").concat(coordinates.bottom, \"px;\\n position: absolute;\\n display: block;\");\n\n if (coordinates.left === 'auto') {\n this.tribute.menu.style.left = 'auto';\n }\n\n if (coordinates.top === 'auto') {\n this.tribute.menu.style.top = 'auto';\n }\n\n if (scrollTo) this.scrollIntoView();\n window.setTimeout(function () {\n var menuDimensions = {\n width: _this.tribute.menu.offsetWidth,\n height: _this.tribute.menu.offsetHeight\n };\n\n var menuIsOffScreen = _this.isMenuOffScreen(coordinates, menuDimensions);\n\n var menuIsOffScreenHorizontally = window.innerWidth > menuDimensions.width && (menuIsOffScreen.left || menuIsOffScreen.right);\n var menuIsOffScreenVertically = window.innerHeight > menuDimensions.height && (menuIsOffScreen.top || menuIsOffScreen.bottom);\n\n if (menuIsOffScreenHorizontally || menuIsOffScreenVertically) {\n _this.tribute.menu.style.cssText = 'display: none';\n\n _this.positionMenuAtCaret(scrollTo);\n }\n }, 0);\n } else {\n this.tribute.menu.style.cssText = 'display: none';\n }\n }\n }, {\n key: \"selectElement\",\n value: function selectElement(targetElement, path, offset) {\n var range;\n var elem = targetElement;\n\n if (path) {\n for (var i = 0; i < path.length; i++) {\n elem = elem.childNodes[path[i]];\n\n if (elem === undefined) {\n return;\n }\n\n while (elem.length < offset) {\n offset -= elem.length;\n elem = elem.nextSibling;\n }\n\n if (elem.childNodes.length === 0 && !elem.length) {\n elem = elem.previousSibling;\n }\n }\n }\n\n var sel = this.getWindowSelection();\n range = this.getDocument().createRange();\n range.setStart(elem, offset);\n range.setEnd(elem, offset);\n range.collapse(true);\n\n try {\n sel.removeAllRanges();\n } catch (error) {}\n\n sel.addRange(range);\n targetElement.focus();\n }\n }, {\n key: \"replaceTriggerText\",\n value: function replaceTriggerText(text, requireLeadingSpace, hasTrailingSpace, originalEvent, item) {\n var info = this.getTriggerInfo(true, hasTrailingSpace, requireLeadingSpace, this.tribute.allowSpaces, this.tribute.autocompleteMode);\n\n if (info !== undefined) {\n var context = this.tribute.current;\n var replaceEvent = new CustomEvent('tribute-replaced', {\n detail: {\n item: item,\n instance: context,\n context: info,\n event: originalEvent\n }\n });\n\n if (!this.isContentEditable(context.element)) {\n var myField = this.tribute.current.element;\n var textSuffix = typeof this.tribute.replaceTextSuffix == 'string' ? this.tribute.replaceTextSuffix : ' ';\n text += textSuffix;\n var startPos = info.mentionPosition;\n var endPos = info.mentionPosition + info.mentionText.length + textSuffix.length;\n\n if (!this.tribute.autocompleteMode) {\n endPos += info.mentionTriggerChar.length - 1;\n }\n\n myField.value = myField.value.substring(0, startPos) + text + myField.value.substring(endPos, myField.value.length);\n myField.selectionStart = startPos + text.length;\n myField.selectionEnd = startPos + text.length;\n } else {\n // add a space to the end of the pasted text\n var _textSuffix = typeof this.tribute.replaceTextSuffix == 'string' ? this.tribute.replaceTextSuffix : '\\xA0';\n\n text += _textSuffix;\n\n var _endPos = info.mentionPosition + info.mentionText.length;\n\n if (!this.tribute.autocompleteMode) {\n _endPos += info.mentionTriggerChar.length;\n }\n\n this.pasteHtml(text, info.mentionPosition, _endPos);\n }\n\n context.element.dispatchEvent(new CustomEvent('input', {\n bubbles: true\n }));\n context.element.dispatchEvent(replaceEvent);\n }\n }\n }, {\n key: \"pasteHtml\",\n value: function pasteHtml(html, startPos, endPos) {\n var range, sel;\n sel = this.getWindowSelection();\n range = this.getDocument().createRange();\n range.setStart(sel.anchorNode, startPos);\n range.setEnd(sel.anchorNode, endPos);\n range.deleteContents();\n var el = this.getDocument().createElement('div');\n el.innerHTML = html;\n var frag = this.getDocument().createDocumentFragment(),\n node,\n lastNode;\n\n while (node = el.firstChild) {\n lastNode = frag.appendChild(node);\n }\n\n range.insertNode(frag); // Preserve the selection\n\n if (lastNode) {\n range = range.cloneRange();\n range.setStartAfter(lastNode);\n range.collapse(true);\n sel.removeAllRanges();\n sel.addRange(range);\n }\n }\n }, {\n key: \"getWindowSelection\",\n value: function getWindowSelection() {\n if (this.tribute.collection.iframe) {\n return this.tribute.collection.iframe.contentWindow.getSelection();\n }\n\n return window.getSelection();\n }\n }, {\n key: \"getNodePositionInParent\",\n value: function getNodePositionInParent(element) {\n if (element.parentNode === null) {\n return 0;\n }\n\n for (var i = 0; i < element.parentNode.childNodes.length; i++) {\n var node = element.parentNode.childNodes[i];\n\n if (node === element) {\n return i;\n }\n }\n }\n }, {\n key: \"getContentEditableSelectedPath\",\n value: function getContentEditableSelectedPath(ctx) {\n var sel = this.getWindowSelection();\n var selected = sel.anchorNode;\n var path = [];\n var offset;\n\n if (selected != null) {\n var i;\n var ce = selected.contentEditable;\n\n while (selected !== null && ce !== 'true') {\n i = this.getNodePositionInParent(selected);\n path.push(i);\n selected = selected.parentNode;\n\n if (selected !== null) {\n ce = selected.contentEditable;\n }\n }\n\n path.reverse(); // getRangeAt may not exist, need alternative\n\n offset = sel.getRangeAt(0).startOffset;\n return {\n selected: selected,\n path: path,\n offset: offset\n };\n }\n }\n }, {\n key: \"getTextPrecedingCurrentSelection\",\n value: function getTextPrecedingCurrentSelection() {\n var context = this.tribute.current,\n text = '';\n\n if (!this.isContentEditable(context.element)) {\n var textComponent = this.tribute.current.element;\n\n if (textComponent) {\n var startPos = textComponent.selectionStart;\n\n if (textComponent.value && startPos >= 0) {\n text = textComponent.value.substring(0, startPos);\n }\n }\n } else {\n var selectedElem = this.getWindowSelection().anchorNode;\n\n if (selectedElem != null) {\n var workingNodeContent = selectedElem.textContent;\n var selectStartOffset = this.getWindowSelection().getRangeAt(0).startOffset;\n\n if (workingNodeContent && selectStartOffset >= 0) {\n text = workingNodeContent.substring(0, selectStartOffset);\n }\n }\n }\n\n return text;\n }\n }, {\n key: \"getLastWordInText\",\n value: function getLastWordInText(text) {\n text = text.replace(/\\u00A0/g, ' '); // https://stackoverflow.com/questions/29850407/how-do-i-replace-unicode-character-u00a0-with-a-space-in-javascript\n\n var wordsArray = text.split(/\\s+/);\n var worldsCount = wordsArray.length - 1;\n return wordsArray[worldsCount].trim();\n }\n }, {\n key: \"getTriggerInfo\",\n value: function getTriggerInfo(menuAlreadyActive, hasTrailingSpace, requireLeadingSpace, allowSpaces, isAutocomplete) {\n var _this2 = this;\n\n var ctx = this.tribute.current;\n var selected, path, offset;\n\n if (!this.isContentEditable(ctx.element)) {\n selected = this.tribute.current.element;\n } else {\n var selectionInfo = this.getContentEditableSelectedPath(ctx);\n\n if (selectionInfo) {\n selected = selectionInfo.selected;\n path = selectionInfo.path;\n offset = selectionInfo.offset;\n }\n }\n\n var effectiveRange = this.getTextPrecedingCurrentSelection();\n var lastWordOfEffectiveRange = this.getLastWordInText(effectiveRange);\n\n if (isAutocomplete) {\n return {\n mentionPosition: effectiveRange.length - lastWordOfEffectiveRange.length,\n mentionText: lastWordOfEffectiveRange,\n mentionSelectedElement: selected,\n mentionSelectedPath: path,\n mentionSelectedOffset: offset\n };\n }\n\n if (effectiveRange !== undefined && effectiveRange !== null) {\n var mostRecentTriggerCharPos = -1;\n var triggerChar;\n this.tribute.collection.forEach(function (config) {\n var c = config.trigger;\n var idx = config.requireLeadingSpace ? _this2.lastIndexWithLeadingSpace(effectiveRange, c) : effectiveRange.lastIndexOf(c);\n\n if (idx > mostRecentTriggerCharPos) {\n mostRecentTriggerCharPos = idx;\n triggerChar = c;\n requireLeadingSpace = config.requireLeadingSpace;\n }\n });\n\n if (mostRecentTriggerCharPos >= 0 && (mostRecentTriggerCharPos === 0 || !requireLeadingSpace || /[\\xA0\\s]/g.test(effectiveRange.substring(mostRecentTriggerCharPos - 1, mostRecentTriggerCharPos)))) {\n var currentTriggerSnippet = effectiveRange.substring(mostRecentTriggerCharPos + triggerChar.length, effectiveRange.length);\n triggerChar = effectiveRange.substring(mostRecentTriggerCharPos, mostRecentTriggerCharPos + triggerChar.length);\n var firstSnippetChar = currentTriggerSnippet.substring(0, 1);\n var leadingSpace = currentTriggerSnippet.length > 0 && (firstSnippetChar === ' ' || firstSnippetChar === '\\xA0');\n\n if (hasTrailingSpace) {\n currentTriggerSnippet = currentTriggerSnippet.trim();\n }\n\n var regex = allowSpaces ? /[^\\S ]/g : /[\\xA0\\s]/g;\n this.tribute.hasTrailingSpace = regex.test(currentTriggerSnippet);\n\n if (!leadingSpace && (menuAlreadyActive || !regex.test(currentTriggerSnippet))) {\n return {\n mentionPosition: mostRecentTriggerCharPos,\n mentionText: currentTriggerSnippet,\n mentionSelectedElement: selected,\n mentionSelectedPath: path,\n mentionSelectedOffset: offset,\n mentionTriggerChar: triggerChar\n };\n }\n }\n }\n }\n }, {\n key: \"lastIndexWithLeadingSpace\",\n value: function lastIndexWithLeadingSpace(str, trigger) {\n var reversedStr = str.split('').reverse().join('');\n var index = -1;\n\n for (var cidx = 0, len = str.length; cidx < len; cidx++) {\n var firstChar = cidx === str.length - 1;\n var leadingSpace = /\\s/.test(reversedStr[cidx + 1]);\n var match = true;\n\n for (var triggerIdx = trigger.length - 1; triggerIdx >= 0; triggerIdx--) {\n if (trigger[triggerIdx] !== reversedStr[cidx - triggerIdx]) {\n match = false;\n break;\n }\n }\n\n if (match && (firstChar || leadingSpace)) {\n index = str.length - 1 - cidx;\n break;\n }\n }\n\n return index;\n }\n }, {\n key: \"isContentEditable\",\n value: function isContentEditable(element) {\n return element.nodeName !== 'INPUT' && element.nodeName !== 'TEXTAREA';\n }\n }, {\n key: \"isMenuOffScreen\",\n value: function isMenuOffScreen(coordinates, menuDimensions) {\n var windowWidth = window.innerWidth;\n var windowHeight = window.innerHeight;\n var doc = document.documentElement;\n var windowLeft = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);\n var windowTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);\n var menuTop = typeof coordinates.top === 'number' ? coordinates.top : windowTop + windowHeight - coordinates.bottom - menuDimensions.height;\n var menuRight = typeof coordinates.right === 'number' ? coordinates.right : coordinates.left + menuDimensions.width;\n var menuBottom = typeof coordinates.bottom === 'number' ? coordinates.bottom : coordinates.top + menuDimensions.height;\n var menuLeft = typeof coordinates.left === 'number' ? coordinates.left : windowLeft + windowWidth - coordinates.right - menuDimensions.width;\n return {\n top: menuTop < Math.floor(windowTop),\n right: menuRight > Math.ceil(windowLeft + windowWidth),\n bottom: menuBottom > Math.ceil(windowTop + windowHeight),\n left: menuLeft < Math.floor(windowLeft)\n };\n }\n }, {\n key: \"getMenuDimensions\",\n value: function getMenuDimensions() {\n // Width of the menu depends of its contents and position\n // We must check what its width would be without any obstruction\n // This way, we can achieve good positioning for flipping the menu\n var dimensions = {\n width: null,\n height: null\n };\n this.tribute.menu.style.cssText = \"top: 0px;\\n left: 0px;\\n position: fixed;\\n display: block;\\n visibility; hidden;\";\n dimensions.width = this.tribute.menu.offsetWidth;\n dimensions.height = this.tribute.menu.offsetHeight;\n this.tribute.menu.style.cssText = \"display: none;\";\n return dimensions;\n }\n }, {\n key: \"getTextAreaOrInputUnderlinePosition\",\n value: function getTextAreaOrInputUnderlinePosition(element, position, flipped) {\n var properties = ['direction', 'boxSizing', 'width', 'height', 'overflowX', 'overflowY', 'borderTopWidth', 'borderRightWidth', 'borderBottomWidth', 'borderLeftWidth', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'fontStyle', 'fontVariant', 'fontWeight', 'fontStretch', 'fontSize', 'fontSizeAdjust', 'lineHeight', 'fontFamily', 'textAlign', 'textTransform', 'textIndent', 'textDecoration', 'letterSpacing', 'wordSpacing'];\n var isFirefox = window.mozInnerScreenX !== null;\n var div = this.getDocument().createElement('div');\n div.id = 'input-textarea-caret-position-mirror-div';\n this.getDocument().body.appendChild(div);\n var style = div.style;\n var computed = window.getComputedStyle ? getComputedStyle(element) : element.currentStyle;\n style.whiteSpace = 'pre-wrap';\n\n if (element.nodeName !== 'INPUT') {\n style.wordWrap = 'break-word';\n } // position off-screen\n\n\n style.position = 'absolute';\n style.visibility = 'hidden'; // transfer the element's properties to the div\n\n properties.forEach(function (prop) {\n style[prop] = computed[prop];\n });\n\n if (isFirefox) {\n style.width = \"\".concat(parseInt(computed.width) - 2, \"px\");\n if (element.scrollHeight > parseInt(computed.height)) style.overflowY = 'scroll';\n } else {\n style.overflow = 'hidden';\n }\n\n div.textContent = element.value.substring(0, position);\n\n if (element.nodeName === 'INPUT') {\n div.textContent = div.textContent.replace(/\\s/g, ' ');\n }\n\n var span = this.getDocument().createElement('span');\n span.textContent = element.value.substring(position) || '.';\n div.appendChild(span);\n var rect = element.getBoundingClientRect();\n var doc = document.documentElement;\n var windowLeft = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);\n var windowTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);\n var top = 0;\n var left = 0;\n\n if (this.menuContainerIsBody) {\n top = rect.top;\n left = rect.left;\n }\n\n var coordinates = {\n top: top + windowTop + span.offsetTop + parseInt(computed.borderTopWidth) + parseInt(computed.fontSize) - element.scrollTop,\n left: left + windowLeft + span.offsetLeft + parseInt(computed.borderLeftWidth)\n };\n var windowWidth = window.innerWidth;\n var windowHeight = window.innerHeight;\n var menuDimensions = this.getMenuDimensions();\n var menuIsOffScreen = this.isMenuOffScreen(coordinates, menuDimensions);\n\n if (menuIsOffScreen.right) {\n coordinates.right = windowWidth - coordinates.left;\n coordinates.left = 'auto';\n }\n\n var parentHeight = this.tribute.menuContainer ? this.tribute.menuContainer.offsetHeight : this.getDocument().body.offsetHeight;\n\n if (menuIsOffScreen.bottom) {\n var parentRect = this.tribute.menuContainer ? this.tribute.menuContainer.getBoundingClientRect() : this.getDocument().body.getBoundingClientRect();\n var scrollStillAvailable = parentHeight - (windowHeight - parentRect.top);\n coordinates.bottom = scrollStillAvailable + (windowHeight - rect.top - span.offsetTop);\n coordinates.top = 'auto';\n }\n\n menuIsOffScreen = this.isMenuOffScreen(coordinates, menuDimensions);\n\n if (menuIsOffScreen.left) {\n coordinates.left = windowWidth > menuDimensions.width ? windowLeft + windowWidth - menuDimensions.width : windowLeft;\n delete coordinates.right;\n }\n\n if (menuIsOffScreen.top) {\n coordinates.top = windowHeight > menuDimensions.height ? windowTop + windowHeight - menuDimensions.height : windowTop;\n delete coordinates.bottom;\n }\n\n this.getDocument().body.removeChild(div);\n return coordinates;\n }\n }, {\n key: \"getContentEditableCaretPosition\",\n value: function getContentEditableCaretPosition(selectedNodePosition) {\n var markerTextChar = '';\n var markerEl,\n markerId = \"sel_\".concat(new Date().getTime(), \"_\").concat(Math.random().toString().substr(2));\n var range;\n var sel = this.getWindowSelection();\n var prevRange = sel.getRangeAt(0);\n range = this.getDocument().createRange();\n range.setStart(sel.anchorNode, selectedNodePosition);\n range.setEnd(sel.anchorNode, selectedNodePosition);\n range.collapse(false); // Create the marker element containing a single invisible character using DOM methods and insert it\n\n markerEl = this.getDocument().createElement('span');\n markerEl.id = markerId;\n markerEl.appendChild(this.getDocument().createTextNode(markerTextChar));\n range.insertNode(markerEl);\n sel.removeAllRanges();\n sel.addRange(prevRange);\n var rect = markerEl.getBoundingClientRect();\n var doc = document.documentElement;\n var windowLeft = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);\n var windowTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);\n var left = 0;\n var top = 0;\n\n if (this.menuContainerIsBody) {\n left = rect.left;\n top = rect.top;\n } else {\n left = markerEl.offsetLeft;\n top = markerEl.offsetTop;\n }\n\n var coordinates = {\n left: left + windowLeft,\n top: top + markerEl.offsetHeight + windowTop\n };\n var windowWidth = window.innerWidth;\n var windowHeight = window.innerHeight;\n var menuDimensions = this.getMenuDimensions();\n var menuIsOffScreen = this.isMenuOffScreen(coordinates, menuDimensions);\n\n if (menuIsOffScreen.right) {\n coordinates.left = 'auto';\n coordinates.right = windowWidth - rect.left - windowLeft;\n }\n\n var parentHeight = this.tribute.menuContainer ? this.tribute.menuContainer.offsetHeight : this.getDocument().body.offsetHeight;\n\n if (menuIsOffScreen.bottom) {\n var parentRect = this.tribute.menuContainer ? this.tribute.menuContainer.getBoundingClientRect() : this.getDocument().body.getBoundingClientRect();\n var scrollStillAvailable = parentHeight - (windowHeight - parentRect.top);\n coordinates.top = 'auto';\n coordinates.bottom = scrollStillAvailable + (windowHeight - rect.top);\n }\n\n menuIsOffScreen = this.isMenuOffScreen(coordinates, menuDimensions);\n\n if (menuIsOffScreen.left) {\n coordinates.left = windowWidth > menuDimensions.width ? windowLeft + windowWidth - menuDimensions.width : windowLeft;\n delete coordinates.right;\n }\n\n if (menuIsOffScreen.top) {\n coordinates.top = windowHeight > menuDimensions.height ? windowTop + windowHeight - menuDimensions.height : windowTop;\n delete coordinates.bottom;\n }\n\n markerEl.parentNode.removeChild(markerEl);\n return coordinates;\n }\n }, {\n key: \"scrollIntoView\",\n value: function scrollIntoView(elem) {\n var reasonableBuffer = 20,\n clientRect;\n var maxScrollDisplacement = 100;\n var e = this.menu;\n if (typeof e === 'undefined') return;\n\n while (clientRect === undefined || clientRect.height === 0) {\n clientRect = e.getBoundingClientRect();\n\n if (clientRect.height === 0) {\n e = e.childNodes[0];\n\n if (e === undefined || !e.getBoundingClientRect) {\n return;\n }\n }\n }\n\n var elemTop = clientRect.top;\n var elemBottom = elemTop + clientRect.height;\n\n if (elemTop < 0) {\n window.scrollTo(0, window.pageYOffset + clientRect.top - reasonableBuffer);\n } else if (elemBottom > window.innerHeight) {\n var maxY = window.pageYOffset + clientRect.top - reasonableBuffer;\n\n if (maxY - window.pageYOffset > maxScrollDisplacement) {\n maxY = window.pageYOffset + maxScrollDisplacement;\n }\n\n var targetY = window.pageYOffset - (window.innerHeight - elemBottom);\n\n if (targetY > maxY) {\n targetY = maxY;\n }\n\n window.scrollTo(0, targetY);\n }\n }\n }, {\n key: \"menuContainerIsBody\",\n get: function get() {\n return this.tribute.menuContainer === document.body || !this.tribute.menuContainer;\n }\n }]);\n\n return TributeRange;\n}();\n\nvar _default = TributeRange;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n},{\"./utils\":7}],5:[function(require,module,exports){\n\"use strict\";\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports[\"default\"] = void 0;\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\n// Thanks to https://github.com/mattyork/fuzzy\nvar TributeSearch =\n/*#__PURE__*/\nfunction () {\n function TributeSearch(tribute) {\n _classCallCheck(this, TributeSearch);\n\n this.tribute = tribute;\n this.tribute.search = this;\n }\n\n _createClass(TributeSearch, [{\n key: \"simpleFilter\",\n value: function simpleFilter(pattern, array) {\n var _this = this;\n\n return array.filter(function (string) {\n return _this.test(pattern, string);\n });\n }\n }, {\n key: \"test\",\n value: function test(pattern, string) {\n return this.match(pattern, string) !== null;\n }\n }, {\n key: \"match\",\n value: function match(pattern, string, opts) {\n opts = opts || {};\n var patternIdx = 0,\n result = [],\n len = string.length,\n totalScore = 0,\n currScore = 0,\n pre = opts.pre || '',\n post = opts.post || '',\n compareString = opts.caseSensitive && string || string.toLowerCase(),\n ch,\n compareChar;\n\n if (opts.skip) {\n return {\n rendered: string,\n score: 0\n };\n }\n\n pattern = opts.caseSensitive && pattern || pattern.toLowerCase();\n var patternCache = this.traverse(compareString, pattern, 0, 0, []);\n\n if (!patternCache) {\n return null;\n }\n\n return {\n rendered: this.render(string, patternCache.cache, pre, post),\n score: patternCache.score\n };\n }\n }, {\n key: \"traverse\",\n value: function traverse(string, pattern, stringIndex, patternIndex, patternCache) {\n // if the pattern search at end\n if (pattern.length === patternIndex) {\n // calculate score and copy the cache containing the indices where it's found\n return {\n score: this.calculateScore(patternCache),\n cache: patternCache.slice()\n };\n } // if string at end or remaining pattern > remaining string\n\n\n if (string.length === stringIndex || pattern.length - patternIndex > string.length - stringIndex) {\n return undefined;\n }\n\n var c = pattern[patternIndex];\n var index = string.indexOf(c, stringIndex);\n var best, temp;\n\n while (index > -1) {\n patternCache.push(index);\n temp = this.traverse(string, pattern, index + 1, patternIndex + 1, patternCache);\n patternCache.pop(); // if downstream traversal failed, return best answer so far\n\n if (!temp) {\n return best;\n }\n\n if (!best || best.score < temp.score) {\n best = temp;\n }\n\n index = string.indexOf(c, index + 1);\n }\n\n return best;\n }\n }, {\n key: \"calculateScore\",\n value: function calculateScore(patternCache) {\n var score = 0;\n var temp = 1;\n patternCache.forEach(function (index, i) {\n if (i > 0) {\n if (patternCache[i - 1] + 1 === index) {\n temp += temp + 1;\n } else {\n temp = 1;\n }\n }\n\n score += temp;\n });\n return score;\n }\n }, {\n key: \"render\",\n value: function render(string, indices, pre, post) {\n var rendered = string.substring(0, indices[0]);\n indices.forEach(function (index, i) {\n rendered += pre + string[index] + post + string.substring(index + 1, indices[i + 1] ? indices[i + 1] : string.length);\n });\n return rendered;\n }\n }, {\n key: \"filter\",\n value: function filter(pattern, arr, opts) {\n var _this2 = this;\n\n opts = opts || {};\n return arr.reduce(function (prev, element, idx, arr) {\n var str = element;\n\n if (opts.extract) {\n str = opts.extract(element);\n\n if (!str) {\n // take care of undefineds / nulls / etc.\n str = '';\n }\n }\n\n var rendered = _this2.match(pattern, str, opts);\n\n if (rendered != null) {\n prev[prev.length] = {\n string: rendered.rendered,\n score: rendered.score,\n index: idx,\n original: element\n };\n }\n\n return prev;\n }, []).sort(function (a, b) {\n var compare = b.score - a.score;\n if (compare) return compare;\n return a.index - b.index;\n });\n }\n }]);\n\n return TributeSearch;\n}();\n\nvar _default = TributeSearch;\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n},{}],6:[function(require,module,exports){\n\"use strict\";\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports[\"default\"] = void 0;\n\nvar _Tribute = _interopRequireDefault(require(\"./Tribute\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\n/**\n* Tribute.js\n* Native ES6 JavaScript @mention Plugin\n**/\nvar _default = _Tribute[\"default\"];\nexports[\"default\"] = _default;\nmodule.exports = exports.default;\n\n},{\"./Tribute\":1}],7:[function(require,module,exports){\n\"use strict\";\n\nif (!Array.prototype.find) {\n Array.prototype.find = function (predicate) {\n if (this === null) {\n throw new TypeError('Array.prototype.find called on null or undefined');\n }\n\n if (typeof predicate !== 'function') {\n throw new TypeError('predicate must be a function');\n }\n\n var list = Object(this);\n var length = list.length >>> 0;\n var thisArg = arguments[1];\n var value;\n\n for (var i = 0; i < length; i++) {\n value = list[i];\n\n if (predicate.call(thisArg, value, i, list)) {\n return value;\n }\n }\n\n return undefined;\n };\n}\n\nif (window && typeof window.CustomEvent !== \"function\") {\n var CustomEvent = function CustomEvent(event, params) {\n params = params || {\n bubbles: false,\n cancelable: false,\n detail: undefined\n };\n var evt = document.createEvent('CustomEvent');\n evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);\n return evt;\n };\n\n if (typeof window.Event !== 'undefined') {\n CustomEvent.prototype = window.Event.prototype;\n }\n\n window.CustomEvent = CustomEvent;\n}\n\n},{}]},{},[6])(6)\n});\n//# sourceMappingURL=tribute.js.map\n"]} \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 65be8e15..d5f95fbf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "tributejs", - "version": "4.1.0", + "version": "4.1.1", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 39288c6a..0607d296 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "tributejs", - "version": "4.1.0", + "version": "4.1.1", "description": "Native ES6 @mentions", "main": "dist/tribute.js", "types": "tributejs.d.ts", diff --git a/tributejs.d.ts b/tributejs.d.ts index 9134d839..440966bb 100644 --- a/tributejs.d.ts +++ b/tributejs.d.ts @@ -1,4 +1,4 @@ -// Type definitions for TributeJS v4.1.0 +// Type definitions for TributeJS v4.1.1 // Project: https://github.com/zurb/tribute // Definitions by: Jordan Humphreys