quill-mention - npm Package Compare versions

Comparing version 2.1.4 to 2.1.5

dist/quill.mention.min.js

@@ -1,1 +0,1 @@
-!function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e){t.exports=Quill},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},o=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),s=r(n(0)),a=r(n(2));function r(t){return t&&t.__esModule?t:{default:t}}n(5),n(3);var l=n(4),h=function(){function t(e,n){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.isOpen=!1,this.itemIndex=0,this.mentionCharPos=null,this.cursorPos=null,this.values=[],this.suspendMouseEnter=!1,this.quill=e,this.options={source:null,renderItem:function(t,e){return""+t.value},onSelect:function(t,e){e(t)},mentionDenotationChars:["@"],showDenotationChar:!0,allowedChars:/^[a-zA-Z0-9_]*$/,minChars:0,maxChars:31,offsetTop:2,offsetLeft:0,isolateCharacter:!1,fixMentionsToQuill:!1,defaultMenuOrientation:"bottom",dataAttributes:["id","value","denotationChar","link","target"],linkTarget:"_blank",onOpen:function(){return!0},onClose:function(){return!0},listItemClass:"ql-mention-list-item",mentionContainerClass:"ql-mention-list-container",mentionListClass:"ql-mention-list"},i(this.options,n,{dataAttributes:Array.isArray(n.dataAttributes)?this.options.dataAttributes.concat(n.dataAttributes):this.options.dataAttributes}),this.mentionContainer=document.createElement("div"),this.mentionContainer.className=this.options.mentionContainerClass?this.options.mentionContainerClass:"",this.mentionContainer.style.cssText="display: none; position: absolute;",this.mentionContainer.onmousemove=this.onContainerMouseMove.bind(this),this.options.fixMentionsToQuill&&(this.mentionContainer.style.width="auto"),this.mentionList=document.createElement("ul"),this.mentionList.className=this.options.mentionListClass?this.options.mentionListClass:"",this.mentionContainer.appendChild(this.mentionList),this.quill.container.appendChild(this.mentionContainer),e.on("text-change",this.onTextChange.bind(this)),e.on("selection-change",this.onSelectionChange.bind(this)),e.keyboard.addBinding({key:a.default.TAB},this.selectHandler.bind(this)),e.keyboard.bindings[9].unshift(e.keyboard.bindings[9].pop()),e.keyboard.addBinding({key:a.default.ENTER},this.selectHandler.bind(this)),e.keyboard.bindings[13].unshift(e.keyboard.bindings[13].pop()),e.keyboard.addBinding({key:a.default.ESCAPE},this.escapeHandler.bind(this)),e.keyboard.addBinding({key:a.default.UP},this.upHandler.bind(this)),e.keyboard.addBinding({key:a.default.DOWN},this.downHandler.bind(this))}return o(t,[{key:"selectHandler",value:function(){return!this.isOpen||(this.selectItem(),!1)}},{key:"escapeHandler",value:function(){return!this.isOpen||(this.hideMentionList(),!1)}},{key:"upHandler",value:function(){return!this.isOpen||(this.prevItem(),!1)}},{key:"downHandler",value:function(){return!this.isOpen||(this.nextItem(),!1)}},{key:"showMentionList",value:function(){this.mentionContainer.style.visibility="hidden",this.mentionContainer.style.display="",this.setMentionContainerPosition(),this.setIsOpen(!0)}},{key:"hideMentionList",value:function(){this.mentionContainer.style.display="none",this.setIsOpen(!1)}},{key:"highlightItem",value:function(){for(var t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],e=0;e<this.mentionList.childNodes.length;e+=1)this.mentionList.childNodes[e].classList.remove("selected");if(this.mentionList.childNodes[this.itemIndex].classList.add("selected"),t){var n=this.mentionList.childNodes[this.itemIndex].offsetHeight,i=this.itemIndex*n,o=this.mentionContainer.scrollTop,s=o+this.mentionContainer.offsetHeight;i<o?this.mentionContainer.scrollTop=i:i>s-n&&(this.mentionContainer.scrollTop+=i-s+n)}}},{key:"getItemData",value:function(){var t=this.mentionList.childNodes[this.itemIndex].dataset.link,e=void 0!==t,n=this.mentionList.childNodes[this.itemIndex].dataset.target;return e&&(this.mentionList.childNodes[this.itemIndex].dataset.value='<a href="'+t+'" target='+(n||this.options.linkTarget)+">"+this.mentionList.childNodes[this.itemIndex].dataset.value),this.mentionList.childNodes[this.itemIndex].dataset}},{key:"onContainerMouseMove",value:function(){this.suspendMouseEnter=!1}},{key:"selectItem",value:function(){var t=this,e=this.getItemData();this.options.onSelect(e,function(e){t.insertItem(e)}),this.hideMentionList()}},{key:"insertItem",value:function(t){var e=t;if(null!==e){this.options.showDenotationChar||(e.denotationChar="");var n=this.mentionCharPos;this.quill.deleteText(this.mentionCharPos,this.cursorPos-this.mentionCharPos,s.default.sources.USER),this.quill.insertEmbed(n,"mention",e,s.default.sources.USER),this.quill.insertText(n+1," ",s.default.sources.USER),this.quill.setSelection(n+2,s.default.sources.USER),this.hideMentionList()}}},{key:"onItemMouseEnter",value:function(t){if(!this.suspendMouseEnter){var e=Number(t.target.dataset.index);l(e)||e===this.itemIndex||(this.itemIndex=e,this.highlightItem(!1))}}},{key:"onItemClick",value:function(t){t.stopImmediatePropagation(),t.preventDefault(),this.itemIndex=t.currentTarget.dataset.index,this.highlightItem(),this.selectItem()}},{key:"attachDataValues",value:function(t,e){var n=this,i=t;return Object.keys(e).forEach(function(t){n.options.dataAttributes.indexOf(t)>-1?i.dataset[t]=e[t]:delete i.dataset[t]}),i}},{key:"renderList",value:function(t,e,n){if(e&&e.length>0){this.values=e,this.mentionList.innerHTML="";for(var i=0;i<e.length;i+=1){var o=document.createElement("li");o.className=this.options.listItemClass?this.options.listItemClass:"",o.dataset.index=i,o.innerHTML=this.options.renderItem(e[i],n),o.onmouseenter=this.onItemMouseEnter.bind(this),o.dataset.denotationChar=t,o.onclick=this.onItemClick.bind(this),this.mentionList.appendChild(this.attachDataValues(o,e[i]))}this.itemIndex=0,this.highlightItem(),this.showMentionList()}else this.hideMentionList()}},{key:"nextItem",value:function(){this.itemIndex=(this.itemIndex+1)%this.values.length,this.suspendMouseEnter=!0,this.highlightItem()}},{key:"prevItem",value:function(){this.itemIndex=(this.itemIndex+this.values.length-1)%this.values.length,this.suspendMouseEnter=!0,this.highlightItem()}},{key:"hasValidChars",value:function(t){return this.options.allowedChars.test(t)}},{key:"containerBottomIsNotVisible",value:function(t,e){return t+this.mentionContainer.offsetHeight+e.top>window.pageYOffset+window.innerHeight}},{key:"containerRightIsNotVisible",value:function(t,e){return!this.options.fixMentionsToQuill&&t+this.mentionContainer.offsetWidth+e.left>window.pageXOffset+document.documentElement.clientWidth}},{key:"setIsOpen",value:function(t){this.isOpen!==t&&(t?this.options.onOpen():this.options.onClose(),this.isOpen=t)}},{key:"setMentionContainerPosition",value:function(){var t=this.quill.container.getBoundingClientRect(),e=this.quill.getBounds(this.mentionCharPos),n=this.mentionContainer.offsetHeight,i=this.options.offsetTop,o=this.options.offsetLeft;if(this.options.fixMentionsToQuill?this.mentionContainer.style.right="0px":o+=e.left,this.containerRightIsNotVisible(o,t)){var s=this.mentionContainer.offsetWidth+this.options.offsetLeft;o=t.width-s}if("top"===this.options.defaultMenuOrientation){if((i=this.options.fixMentionsToQuill?-1*(n+this.options.offsetTop):e.top-(n+this.options.offsetTop))+t.top<=0){var a=this.options.offsetTop;this.options.fixMentionsToQuill?a+=t.height:a+=e.bottom,i=a}}else if(this.options.fixMentionsToQuill?i+=t.height:i+=e.bottom,this.containerBottomIsNotVisible(i,t)){var r=-1*this.options.offsetTop;this.options.fixMentionsToQuill||(r+=e.top),i=r-n}i>=0?(this.mentionContainer.classList.add(this.options.mentionContainerClass+"-bottom"),this.mentionContainer.classList.remove(this.options.mentionContainerClass+"-top")):(this.mentionContainer.classList.add(this.options.mentionContainerClass+"-top"),this.mentionContainer.classList.remove(this.options.mentionContainerClass+"-bottom")),this.mentionContainer.style.top=i+"px",this.mentionContainer.style.left=o+"px",this.mentionContainer.style.visibility="visible"}},{key:"onSomethingChange",value:function(){var t=this.quill.getSelection();if(null!=t){this.cursorPos=t.index;var e=Math.max(0,this.cursorPos-this.options.maxChars),n=this.quill.getText(e,this.cursorPos-e),i=this.options.mentionDenotationChars.reduce(function(t,e){var i=t,o=n.lastIndexOf(e);return o>i?o:i},-1);if(i>-1){if(this.options.isolateCharacter&&0!==i&&!n[i-1].match(/\s/g))return void this.hideMentionList();var o=this.cursorPos-(n.length-i);this.mentionCharPos=o;var s=n.substring(i+1);if(s.length>=this.options.minChars&&this.hasValidChars(s)){var a=n[i];this.options.source(s,this.renderList.bind(this,a),a)}else this.hideMentionList()}else this.hideMentionList()}}},{key:"onTextChange",value:function(t,e,n){"user"===n&&this.onSomethingChange()}},{key:"onSelectionChange",value:function(t){t&&0===t.length?this.onSomethingChange():this.hideMentionList()}}]),t}();s.default.register("modules/mention",h),e.default=h},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={TAB:9,ENTER:13,ESCAPE:27,UP:38,DOWN:40}},function(t,e,n){"use strict";var i=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),o=function(t){return t&&t.__esModule?t:{default:t}}(n(0)),s=o.default.import("blots/embed"),a=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}(e,s),i(e,null,[{key:"create",value:function(t){var n=function t(e,n,i){null===e&&(e=Function.prototype);var o=Object.getOwnPropertyDescriptor(e,n);if(void 0===o){var s=Object.getPrototypeOf(e);return null===s?void 0:t(s,n,i)}if("value"in o)return o.value;var a=o.get;return void 0!==a?a.call(i):void 0}(e.__proto__||Object.getPrototypeOf(e),"create",this).call(this),i=document.createElement("span");return i.className="ql-mention-denotation-char",i.innerHTML=t.denotationChar,n.appendChild(i),n.innerHTML+=t.value,e.setDataValues(n,t)}},{key:"setDataValues",value:function(t,e){var n=t;return Object.keys(e).forEach(function(t){n.dataset[t]=e[t]}),n}},{key:"value",value:function(t){return t.dataset}}]),e}();a.blotName="mention",a.tagName="span",a.className="mention",o.default.register(a)},function(t,e,n){"use strict";t.exports=function(t){return t!=t}},function(t,e){}]);
+!function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e){t.exports=Quill},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},o=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),s=r(n(0)),a=r(n(2));function r(t){return t&&t.__esModule?t:{default:t}}n(5),n(3);var l=n(4),h=function(){function t(e,n){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.isOpen=!1,this.itemIndex=0,this.mentionCharPos=null,this.cursorPos=null,this.values=[],this.suspendMouseEnter=!1,this.quill=e,this.options={source:null,renderItem:function(t,e){return""+t.value},onSelect:function(t,e){e(t)},mentionDenotationChars:["@"],showDenotationChar:!0,allowedChars:/^[a-zA-Z0-9_]*$/,minChars:0,maxChars:31,offsetTop:2,offsetLeft:0,isolateCharacter:!1,fixMentionsToQuill:!1,defaultMenuOrientation:"bottom",dataAttributes:["id","value","denotationChar","link","target"],linkTarget:"_blank",onOpen:function(){return!0},onClose:function(){return!0},listItemClass:"ql-mention-list-item",mentionContainerClass:"ql-mention-list-container",mentionListClass:"ql-mention-list",spaceAfterInsert:!0},i(this.options,n,{dataAttributes:Array.isArray(n.dataAttributes)?this.options.dataAttributes.concat(n.dataAttributes):this.options.dataAttributes}),this.mentionContainer=document.createElement("div"),this.mentionContainer.className=this.options.mentionContainerClass?this.options.mentionContainerClass:"",this.mentionContainer.style.cssText="display: none; position: absolute;",this.mentionContainer.onmousemove=this.onContainerMouseMove.bind(this),this.options.fixMentionsToQuill&&(this.mentionContainer.style.width="auto"),this.mentionList=document.createElement("ul"),this.mentionList.className=this.options.mentionListClass?this.options.mentionListClass:"",this.mentionContainer.appendChild(this.mentionList),this.quill.container.appendChild(this.mentionContainer),e.on("text-change",this.onTextChange.bind(this)),e.on("selection-change",this.onSelectionChange.bind(this)),e.keyboard.addBinding({key:a.default.TAB},this.selectHandler.bind(this)),e.keyboard.bindings[9].unshift(e.keyboard.bindings[9].pop()),e.keyboard.addBinding({key:a.default.ENTER},this.selectHandler.bind(this)),e.keyboard.bindings[13].unshift(e.keyboard.bindings[13].pop()),e.keyboard.addBinding({key:a.default.ESCAPE},this.escapeHandler.bind(this)),e.keyboard.addBinding({key:a.default.UP},this.upHandler.bind(this)),e.keyboard.addBinding({key:a.default.DOWN},this.downHandler.bind(this))}return o(t,[{key:"selectHandler",value:function(){return!this.isOpen||(this.selectItem(),!1)}},{key:"escapeHandler",value:function(){return!this.isOpen||(this.hideMentionList(),!1)}},{key:"upHandler",value:function(){return!this.isOpen||(this.prevItem(),!1)}},{key:"downHandler",value:function(){return!this.isOpen||(this.nextItem(),!1)}},{key:"showMentionList",value:function(){this.mentionContainer.style.visibility="hidden",this.mentionContainer.style.display="",this.setMentionContainerPosition(),this.setIsOpen(!0)}},{key:"hideMentionList",value:function(){this.mentionContainer.style.display="none",this.setIsOpen(!1)}},{key:"highlightItem",value:function(){for(var t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],e=0;e<this.mentionList.childNodes.length;e+=1)this.mentionList.childNodes[e].classList.remove("selected");if(this.mentionList.childNodes[this.itemIndex].classList.add("selected"),t){var n=this.mentionList.childNodes[this.itemIndex].offsetHeight,i=this.itemIndex*n,o=this.mentionContainer.scrollTop,s=o+this.mentionContainer.offsetHeight;i<o?this.mentionContainer.scrollTop=i:i>s-n&&(this.mentionContainer.scrollTop+=i-s+n)}}},{key:"getItemData",value:function(){var t=this.mentionList.childNodes[this.itemIndex].dataset.link,e=void 0!==t,n=this.mentionList.childNodes[this.itemIndex].dataset.target;return e&&(this.mentionList.childNodes[this.itemIndex].dataset.value='<a href="'+t+'" target='+(n||this.options.linkTarget)+">"+this.mentionList.childNodes[this.itemIndex].dataset.value),this.mentionList.childNodes[this.itemIndex].dataset}},{key:"onContainerMouseMove",value:function(){this.suspendMouseEnter=!1}},{key:"selectItem",value:function(){var t=this,e=this.getItemData();this.options.onSelect(e,function(e){t.insertItem(e)}),this.hideMentionList()}},{key:"insertItem",value:function(t){var e=t;if(null!==e){this.options.showDenotationChar||(e.denotationChar="");var n=this.mentionCharPos;this.quill.deleteText(this.mentionCharPos,this.cursorPos-this.mentionCharPos,s.default.sources.USER),this.quill.insertEmbed(n,"mention",e,s.default.sources.USER),this.options.spaceAfterInsert?(this.quill.insertText(n+1," ",s.default.sources.USER),this.quill.setSelection(n+2,s.default.sources.USER)):this.quill.setSelection(n+1,s.default.sources.USER),this.hideMentionList()}}},{key:"onItemMouseEnter",value:function(t){if(!this.suspendMouseEnter){var e=Number(t.target.dataset.index);l(e)||e===this.itemIndex||(this.itemIndex=e,this.highlightItem(!1))}}},{key:"onItemClick",value:function(t){t.stopImmediatePropagation(),t.preventDefault(),this.itemIndex=t.currentTarget.dataset.index,this.highlightItem(),this.selectItem()}},{key:"attachDataValues",value:function(t,e){var n=this,i=t;return Object.keys(e).forEach(function(t){n.options.dataAttributes.indexOf(t)>-1?i.dataset[t]=e[t]:delete i.dataset[t]}),i}},{key:"renderList",value:function(t,e,n){if(e&&e.length>0){this.values=e,this.mentionList.innerHTML="";for(var i=0;i<e.length;i+=1){var o=document.createElement("li");o.className=this.options.listItemClass?this.options.listItemClass:"",o.dataset.index=i,o.innerHTML=this.options.renderItem(e[i],n),o.onmouseenter=this.onItemMouseEnter.bind(this),o.dataset.denotationChar=t,o.onclick=this.onItemClick.bind(this),this.mentionList.appendChild(this.attachDataValues(o,e[i]))}this.itemIndex=0,this.highlightItem(),this.showMentionList()}else this.hideMentionList()}},{key:"nextItem",value:function(){this.itemIndex=(this.itemIndex+1)%this.values.length,this.suspendMouseEnter=!0,this.highlightItem()}},{key:"prevItem",value:function(){this.itemIndex=(this.itemIndex+this.values.length-1)%this.values.length,this.suspendMouseEnter=!0,this.highlightItem()}},{key:"hasValidChars",value:function(t){return this.options.allowedChars.test(t)}},{key:"containerBottomIsNotVisible",value:function(t,e){return t+this.mentionContainer.offsetHeight+e.top>window.pageYOffset+window.innerHeight}},{key:"containerRightIsNotVisible",value:function(t,e){return!this.options.fixMentionsToQuill&&t+this.mentionContainer.offsetWidth+e.left>window.pageXOffset+document.documentElement.clientWidth}},{key:"setIsOpen",value:function(t){this.isOpen!==t&&(t?this.options.onOpen():this.options.onClose(),this.isOpen=t)}},{key:"setMentionContainerPosition",value:function(){var t=this.quill.container.getBoundingClientRect(),e=this.quill.getBounds(this.mentionCharPos),n=this.mentionContainer.offsetHeight,i=this.options.offsetTop,o=this.options.offsetLeft;if(this.options.fixMentionsToQuill?this.mentionContainer.style.right="0px":o+=e.left,this.containerRightIsNotVisible(o,t)){var s=this.mentionContainer.offsetWidth+this.options.offsetLeft;o=t.width-s}if("top"===this.options.defaultMenuOrientation){if((i=this.options.fixMentionsToQuill?-1*(n+this.options.offsetTop):e.top-(n+this.options.offsetTop))+t.top<=0){var a=this.options.offsetTop;this.options.fixMentionsToQuill?a+=t.height:a+=e.bottom,i=a}}else if(this.options.fixMentionsToQuill?i+=t.height:i+=e.bottom,this.containerBottomIsNotVisible(i,t)){var r=-1*this.options.offsetTop;this.options.fixMentionsToQuill||(r+=e.top),i=r-n}i>=0?(this.mentionContainer.classList.add(this.options.mentionContainerClass+"-bottom"),this.mentionContainer.classList.remove(this.options.mentionContainerClass+"-top")):(this.mentionContainer.classList.add(this.options.mentionContainerClass+"-top"),this.mentionContainer.classList.remove(this.options.mentionContainerClass+"-bottom")),this.mentionContainer.style.top=i+"px",this.mentionContainer.style.left=o+"px",this.mentionContainer.style.visibility="visible"}},{key:"onSomethingChange",value:function(){var t=this.quill.getSelection();if(null!=t){this.cursorPos=t.index;var e=Math.max(0,this.cursorPos-this.options.maxChars),n=this.quill.getText(e,this.cursorPos-e),i=this.options.mentionDenotationChars.reduce(function(t,e){var i=t,o=n.lastIndexOf(e);return o>i?o:i},-1);if(i>-1){if(this.options.isolateCharacter&&0!==i&&!n[i-1].match(/\s/g))return void this.hideMentionList();var o=this.cursorPos-(n.length-i);this.mentionCharPos=o;var s=n.substring(i+1);if(s.length>=this.options.minChars&&this.hasValidChars(s)){var a=n[i];this.options.source(s,this.renderList.bind(this,a),a)}else this.hideMentionList()}else this.hideMentionList()}}},{key:"onTextChange",value:function(t,e,n){"user"===n&&this.onSomethingChange()}},{key:"onSelectionChange",value:function(t){t&&0===t.length?this.onSomethingChange():this.hideMentionList()}}]),t}();s.default.register("modules/mention",h),e.default=h},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={TAB:9,ENTER:13,ESCAPE:27,UP:38,DOWN:40}},function(t,e,n){"use strict";var i=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),o=function(t){return t&&t.__esModule?t:{default:t}}(n(0)),s=o.default.import("blots/embed"),a=function(t){function e(){return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}(e,s),i(e,null,[{key:"create",value:function(t){var n=function t(e,n,i){null===e&&(e=Function.prototype);var o=Object.getOwnPropertyDescriptor(e,n);if(void 0===o){var s=Object.getPrototypeOf(e);return null===s?void 0:t(s,n,i)}if("value"in o)return o.value;var a=o.get;return void 0!==a?a.call(i):void 0}(e.__proto__||Object.getPrototypeOf(e),"create",this).call(this),i=document.createElement("span");return i.className="ql-mention-denotation-char",i.innerHTML=t.denotationChar,n.appendChild(i),n.innerHTML+=t.value,e.setDataValues(n,t)}},{key:"setDataValues",value:function(t,e){var n=t;return Object.keys(e).forEach(function(t){n.dataset[t]=e[t]}),n}},{key:"value",value:function(t){return t.dataset}}]),e}();a.blotName="mention",a.tagName="span",a.className="mention",o.default.register(a)},function(t,e,n){"use strict";t.exports=function(t){return t!=t}},function(t,e){}]);

package.json

 {
   "name": "quill-mention",
-  "version": "2.1.4",
+  "version": "2.1.5",
   "description": "@mentions for the Quill rich text editor",
@@ -5,0 +5,0 @@ "main": "src/quill.mention.js",

README.md

@@ -24,4 +24,18 @@ ![Quill Mention](static/quill-mention.png "Quill Mention")
 
+### Import package
+```javascript
+import 'quill-mention';
+// or
+require('quill-mention');
+```
+
+Importing quill-mention automagically adds it to Quill modules.
+
+Now you only need to pass quill-mention config to quill.
+
 ### Example
 ```javascript
+
+import 'quill-mention';
+
 const atValues = [
@@ -36,2 +50,67 @@ { id: 1, value: 'Fredrik Sundqvist' },
 const quill = new Quill('#editor', {
+  modules: {
+    mention: {
+      allowedChars: /^[A-Za-z\sÅÄÖåäö]*$/,
+      mentionDenotationChars: ["@", "#"],
+      source: function (searchTerm, renderList, mentionChar) {
+        let values;
+
+        if (mentionChar === "@") {
+          values = atValues;
+        } else {
+          values = hashValues;
+        }
+
+        if (searchTerm.length === 0) {
+          renderList(values, searchTerm);
+        } else {
+          const matches = [];
+          for (let i = 0; i < values.length; i++)
+            if (~values[i].value.toLowerCase().indexOf(searchTerm.toLowerCase())) matches.push(values[i]);
+          renderList(matches, searchTerm);
+        }
+      },
+    },
+  }
+});
+```
+
+### Async example
+```javascript
+async function suggestPeople(searchTerm) {
+  const allPeople = [
+    {
+      id: 1,
+      value: 'Fredrik Sundqvist'
+    },
+    {
+      id: 2,
+      value: 'Patrik Sjölin'
+    }
+  ];
+  return allPeople.filter((person) => person.value.includes(searchTerm));
+}
+
+const quill = new Quill('#editor', {
+  modules: {
+    mention: {
+      allowedChars: /^[A-Za-z\sÅÄÖåäö]*$/,
+      mentionDenotationChars: ["@", "#"],
+      source: async function (searchTerm, renderList) {
+        const matchedPeople = await suggestPeople(searchTerm);
+        renderList(matchedPeople);
+      },
+    },
+  }
+});
+```
+
+**Note**: if you whitelist quill formats via ["formats" option](https://quilljs.com/docs/configuration/#formats),
+you need to add "mention" format there. Another way quill-mention won't work.
+Here's an example with whitelisted formats:
+
+```javascript
+const quill = new Quill('#editor', {
+      formats: ["bold", "italic", "mention"],
+      // note "mention" format above
       modules: {
@@ -42,18 +121,3 @@ mention: {
           source: function (searchTerm, renderList, mentionChar) {
-            let values;
-
-            if (mentionChar === "@") {
-              values = atValues;
-            } else {
-              values = hashValues;
-            }
-
-            if (searchTerm.length === 0) {
-              renderList(values, searchTerm);
-            } else {
-              const matches = [];
-              for (i = 0; i < values.length; i++)
-                if (~values[i].value.toLowerCase().indexOf(searchTerm.toLowerCase())) matches.push(values[i]);
-              renderList(matches, searchTerm);
-            }
+            // some source implementation
           },
@@ -88,2 +152,3 @@ },
 | `mentionListClass` |  `'ql-mention-list'` |  Style class to be used for the mention list (may be null)
+| `spaceAfterInsert`   | `true`        | Whether or not insert 1 space after mention block in text
 
@@ -90,0 +155,0 @@ ### Styling

src/blots/mention.js

@@ -0,0 +0,0 @@ import Quill from 'quill';

src/imports/numberisnan.js

@@ -0,0 +0,0 @@ 'use strict';

src/quill.mention.js

@@ -49,2 +49,3 @@ import Quill from 'quill';
       mentionListClass: 'ql-mention-list',
+      spaceAfterInsert: true,
     };
@@ -201,4 +202,9 @@
     this.quill.insertEmbed(prevMentionCharPos, 'mention', render, Quill.sources.USER);
-    this.quill.insertText(prevMentionCharPos + 1, ' ', Quill.sources.USER);
-    this.quill.setSelection(prevMentionCharPos + 2, Quill.sources.USER);
+    if (this.options.spaceAfterInsert) {
+      this.quill.insertText(prevMentionCharPos + 1, ' ', Quill.sources.USER);
+      // setSelection here sets cursor position
+      this.quill.setSelection(prevMentionCharPos + 2, Quill.sources.USER);
+    } else {
+      this.quill.setSelection(prevMentionCharPos + 1, Quill.sources.USER);
+    }
     this.hideMentionList();
@@ -205,0 +211,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39069

increased by5.8%

Lines of code

446

increased by1.83%

Number of lines in readme file

163

increased by66.33%

No dependency changes