(function(e){function a(a){for(var u,i,r=a[0],o=a[1],d=a[2],l=0,f=[];l\?@\[\]\^_{|}~\$/,w=/\x09-\x0D\x20\x85\xA0\u1680\u180E\u2000-\u200A\u2028\u2029\u202F\u205F\u3000/,_=/[0-9]+/,P=/(?:xn--[\-0-9a-z]+)/,U=/[a-z0-9!?\*'@\(\);:&=\+\$\/%#\[\]\-_\.,~|]/i,A=/[a-z0-9\-_&=#\/]/i,$=n(/[a-z#{cyrillicLettersAndMarks}0-9!*';:=+,.$/%#[\]\-\u2013_~@|&#{latinAccentChars}]/i,{cyrillicLettersAndMarks:g,latinAccentChars:C}),B=n("\\((?:#{validGeneralUrlPathChars}+|(?:#{validGeneralUrlPathChars}*\\(#{validGeneralUrlPathChars}+\\)#{validGeneralUrlPathChars}*))\\)",{validGeneralUrlPathChars:$},"i"),D=n(/[+\-a-z#{cyrillicLettersAndMarks}0-9=_#/#{latinAccentChars}]|(?:#{validUrlBalancedParens})/i,{cyrillicLettersAndMarks:g,latinAccentChars:C,validUrlBalancedParens:B}),z=n(/(?:[^A-Za-z0-9@＠$#＃#{invalidCharsGroup}]|[#{directionalMarkersGroup}]|^)/,{invalidCharsGroup:y,directionalMarkersGroup:b}),j=c("#{punct}#{spacesGroup}#{invalidCharsGroup}#{directionalMarkersGroup}",{punct:k,spacesGroup:w,invalidCharsGroup:y,directionalMarkersGroup:b}),S=n(/[^#{invalidDomainChars}]/,{invalidDomainChars:j}),F=n(/(?:(?:#{validDomainChars}(?:-|#{validDomainChars})*)?#{validDomainChars}\.)/,{validDomainChars:S}),W=n(/(?:(?:#{validDomainChars}(?:[_-]|#{validDomainChars})*)?#{validDomainChars}\.)/,{validDomainChars:S}),E=n(/(?:#{validSubdomain}*#{validDomainName}(?:#{validGTLD}|#{validCCTLD}|#{validPunycode}))/,{validDomainName:F,validSubdomain:W,validGTLD:d,validCCTLD:r,validPunycode:P}),L=n("(?:(?:#{validGeneralUrlPathChars}*(?:#{validUrlBalancedParens}#{validGeneralUrlPathChars}*)*#{validUrlPathEndingChars})|(?:@#{validGeneralUrlPathChars}+/))",{validGeneralUrlPathChars:$,validUrlBalancedParens:B,validUrlPathEndingChars:D},"i"),T=n(/(?:[#{bmpLetterAndMarks}]|(?=#{nonBmpCodePairs})(?:#{astralLetterAndMarks}))/,{bmpLetterAndMarks:h,nonBmpCodePairs:x,astralLetterAndMarks:l}),M=n(/(?:[#{bmpLetterAndMarks}#{bmpNumerals}#{hashtagSpecialChars}]|(?=#{nonBmpCodePairs})(?:#{astralLetterAndMarks}|#{astralNumerals}))/,{bmpLetterAndMarks:h,bmpNumerals:p,hashtagSpecialChars:v,nonBmpCodePairs:x,astralLetterAndMarks:l,astralNumerals:f}),N=n(/(?:^|\uFE0E|\uFE0F|$|(?!#{hashtagAlphaNumeric}|&)#{codePoint})/,{codePoint:m,hashtagAlphaNumeric:M}),G=/(?:^|[^a-zA-Z0-9_!#$%&*@＠]|(?:^|[^a-zA-Z0-9_+~.-])(?:rt|RT|rT|Rt):?)/,H=n("((#{validUrlPrecedingChars})((https?:\\/\\/)?(#{validDomain})(?::(#{validPortNumber}))?(\\/#{validUrlPath}*)?(\\?#{validUrlQueryChars}*#{validUrlQueryEndingChars})?))",{validUrlPrecedingChars:z,validDomain:E,validPortNumber:_,validUrlPath:L,validUrlQueryChars:U,validUrlQueryEndingChars:A},"gi"),O=n(/(?:(?:[-a-z0-9#{latinAccentChars}]+)\.)+(?:#{validGTLD}|#{validCCTLD}|#{validPunycode})/gi,{latinAccentChars:C,validGTLD:d,validCCTLD:r,validPunycode:P}),R=(n(/^https?:\/\/t\.co\/([a-z0-9]+)(?:\?#{validUrlQueryChars}*#{validUrlQueryEndingChars})?/,{validUrlQueryChars:U,validUrlQueryEndingChars:A},"i"),/[#＃]/),q=n(/^(?:#{hashSigns}|:\/\/)/,{hashSigns:R}),V=n(/(#{hashtagBoundary})(#{hashSigns})(?!\uFE0F|\u20E3)(#{hashtagAlphaNumeric}*#{hashtagAlpha}#{hashtagAlphaNumeric}*)/gi,{hashtagBoundary:N,hashSigns:R,hashtagAlphaNumeric:M,hashtagAlpha:T}),Q=/[@＠]/,Z=n(/^(?:#{atSigns}|[#{latinAccentChars}]|:\/\/)/,{atSigns:Q,latinAccentChars:C}),I=n("(#{validMentionPrecedingChars})(#{atSigns})([a-zA-Z0-9_]{1,20})",{validMentionPrecedingChars:G,atSigns:Q},"g"),J=n("(#{validMentionPrecedingChars})(#{atSigns})([a-zA-Z0-9_.]{1,20})",{validMentionPrecedingChars:G,atSigns:Q},"g");var K=function(e,a){if(!e||!e.match(Q))return[];const t=[],u=a.mentionsWithDots?J:I;return e.replace(u,(function(e,a,u,s,n,i){const r=i.slice(n+e.length);if(!r.match(Z)){const e=n+a.length,u=e+s.length+1;t.push({username:s,indices:[e,u]})}})),t},X=function(e){if(!e||!e.match(R))return[];let a=[];return e.replace(V,(function(e,t,u,s,n,i){const r=i.slice(n+e.length);if(r.match(q))return;const o=n+t.length,d=o+s.length+1;a.push({hashtag:s,indices:[o,d]})})),a},Y=t("1985"),ee=t.n(Y);const ae=63,te="xn--",ue={toAscii:function(e){if(e.substring(0,4)===te&&!e.match(O))return;const a=e.split(".");for(let t=0;tae)return}return a.join(".")}};var se=ue;const ne="https://",ie={extractUrlsWithoutProtocol:!0},re=4096,oe=/[-_./]$/;function de(e,a,t){let u=e.length;const s=se.toAscii(t);return!(!s||!s.length)&&(u=u+s.length-t.length,a.length+u<=re)}const ce=function(e,a=ie){if(!e||(a.extractUrlsWithoutProtocol?!e.match(/\./):!e.match(/:/)))return[];const t=[];while(H.exec(e)){const e=RegExp.$2;let u=RegExp.$3;const s=RegExp.$4,n=RegExp.$5,i=RegExp.$7;let r=H.lastIndex;const o=r-u.length;if(de(u,s||ne,n))if(s)t.push({url:u,indices:[o,r]});else{if(!a.extractUrlsWithoutProtocol||e.match(oe))continue;let s=null,d=0;if(n.replace(O,(function(e){const a=n.indexOf(e,d);d=a+e.length,s={url:e,indices:[o+a,o+d]},t.push(s)})),null==s)continue;i&&(s.url=u.replace(n,s.url),s.indices[1]=r)}}return t};var le=ce,fe=function(e){e.sort((function(e,a){return e.indices[0]-a.indices[0]}));let a=e[0];for(let t=1;te[t].indices[0]?(e.splice(t,1),t--):a=e[t]},he=function(e,a){const t=le(e,a).concat(K(e,a)).concat(X(e));return 0===t.length?[]:(fe(t),t)};const pe={"&":"&",">":">","<":"<",'"':""","'":"'"};function me(e){return e&&e.replace(/[&"'><]/g,(function(e){return pe[e]}))}function ge(e){const a={};for(const t in e)e.hasOwnProperty(t)&&(a[t]=e[t]);return a}function be(e,a){return e.replace(/#\{(\w+)\}/g,(function(e,t){return a[t]||""}))}const ve={disabled:!0,readonly:!0,multiple:!0,checked:!0},ye={urlClass:!0,usernameClass:!0,hashtagClass:!0,usernameUrlBase:!0,hashtagUrlBase:!0,targetBlank:!0,urlTarget:!0,invisibleTagAttrs:!0,linkAttributeBlock:!0,htmlEscapeNonEntities:!0,extractUrlsWithoutProtocol:!0,mentionsWithDots:!0};var Ce=function(e){const a={};for(const t in e){let u=e[t];ye[t]||(ve[t]&&(u=u?t:null),null!=u&&(a[t]=u))}return a};const xe={disabled:!0,readonly:!0,multiple:!0,checked:!0};function ke(e){let a="";for(const t in e){let u=e[t];xe[t]&&(u=u?t:null),null!=u&&(a+=` ${me(t)}="${me(u.toString())}"`)}return a}var we=function(e,a,t,u){const s={text:a,attr:ke(t)};return be("#{text}",s)};const _e=/^https?:\/\//i;var Pe=function(e,a,t){let u=e.url;const s=u;let n=me(s);const i=ge(t.htmlAttrs||{});return u.match(_e)||(u=`http://${u}`),i.href=u,t.targetBlank&&(i.target="_blank"),t.urlClass&&(i["class"]=t.urlClass),t.urlTarget&&(i.target=t.urlTarget),we(e,n,i,t)},Ue=function(e,a,t){const u=a.substring(e.indices[0],e.indices[0]+1),s=me(e.username),n=ge(t.htmlAttrs||{});return n.href=t.usernameUrlBase+s,n.title=`@${s}`,n["class"]=t.usernameClass,n["data-username"]=s,we(e,`${u}${s}`,n,t)};const Ae=/[\u0600-\u06FF]|[\u0750-\u077F]|[\u0590-\u05FF]|[\uFE70-\uFEFF]/gm;var $e=function(e,a,t){const u=a.substring(e.indices[0],e.indices[0]+1),s=me(e.hashtag),n=ge(t.htmlAttrs||{});return n.href=t.hashtagUrlBase+s,n.title=`#${s}`,n["class"]=t.hashtagClass,n["data-hashtag"]=s,s.charAt(0).match(Ae)&&(n["class"]+=" rtl"),we(e,`${u}${s}`,n,t)};const Be="highlights username",De="highlights hashtag",ze="highlights url";var je=function(e,a,t){let u=ge(t||{});u.usernameClass=u.usernameClass||Be,u.usernameUrlBase=u.usernameUrlBase||"/",u.hashtagClass=u.hashtagClass||De,u.hashtagUrlBase=u.hashtagUrlBase||"/hashtag/",u.urlClass=u.urlClass||ze,u.htmlAttrs=Ce(u),u.invisibleTagAttrs=u.invisibleTagAttrs||"style='position:absolute;left:-9999px;'";let s="",n=0;a.sort((function(e,a){return e.indices[0]-a.indices[0]}));for(let i=0;i#{text}",t)}const Te={targetBlank:!0,extractUrlsWithoutProtocol:!0,mentionsWithDots:!1};function Me(e,a=Te){const t=he(e,a);return je(e,t,a)}function Ne(e,a=Te){const t=he(e,a);return Ee(e,t,a)}function Ge(e,a,t){if(t||(t=document.createRange(),t.selectNode(e),t.setStart(e,0)),0===a.count)t.setEnd(e,a.count);else if(e&&a.count>0)if(3===e.nodeType)e.textContent.length=0){const t=Ge(e,{count:a}),u=window.getSelection();t&&(t.collapse(!1),u.removeAllRanges(),u.addRange(t))}}function Oe(e,a){return Ne(e,a)}function Re(e,a){return Me(e,a)}var qe={name:"VueHighlights",props:{extractUrlsWithoutProtocol:{type:Boolean,default:!0},mentionsWithDots:{type:Boolean,default:!1},caretColor:{type:String,default:"#ccc"},placeholder:{type:String,default:"What's Happening?"},value:String},data(){return{focused:!1,body:""}},computed:{showPlaceholder(){return!this.body.replace(/^\s*\n/gm,"").length},computedBody(){return Ne(this.body,{extractUrlsWithoutProtocol:this.extractUrlsWithoutProtocol,mentionsWithDots:this.mentionsWithDots})}},methods:{getCaretPos(){const e=this.$refs.mbody,a=window.getSelection();let t=a.focusNode,u=a.focusOffset;while(t){if(t===e)break;if(t.previousSibling)t=t.previousSibling,u+=t.textContent.length;else if(t=t.parentNode,null===t)break}return u},setCaretPos(e){He(this.$refs.mbody,e)},clear(){this.$refs.mbody.innerText="",this.body=""},onKeyUp(e){const a=["Shift","Meta","Control","Alt","ArrowUp","ArrowDown","ArrowLeft","ArrowRight"];if(a.includes(e.key))return;let t=this.getCaretPos();"Enter"===e.key&&t++,this.body=e.target.innerText,this.$emit("input",this.body),this.$nextTick(()=>{this.setCaretPos(t)})},onFocus(e){this.focused=!0,this.$emit("focus",e)},onBlur(e){this.focused=!1,this.$emit("blur",e)}},render(e){const a=this.showPlaceholder?e("div",{attrs:{id:"mplaceholder"},staticClass:"highlights__placeholder"},this.placeholder):null,t={ref:"mbody",staticClass:"highlights__body",style:{"text-align":"initial",outline:"currentcolor none medium","user-select":"text","white-space":"pre-wrap","overflow-wrap":"break-word","caret-color":`${this.caretColor}`},attrs:{"aria-label":this.placeHolder,"aria-autocomplete":"list","aria-describedby":"mplaceholder","aria-multiline":"true",contenteditable:!0,role:"textbox",spellCheck:!0,tabindex:0},domProps:{innerHTML:this.computedBody},on:{focus:this.onFocus,blur:this.onBlur,keyup:this.onKeyUp}};return e("div",{staticClass:"highlights__container",style:{position:"relative"}},[e("div",{staticClass:"highlights__content"},[a,e("div",{staticClass:"highlights__body-container"},[e("div",t)])])])}},Ve=function(){var e=this,a=e.$createElement,u=e._self._c||a;return u("div",{attrs:{id:"app"}},[u("nav",{attrs:{id:"nav"}},[u("div",{staticClass:"flex vcenter between container"},[u("div",{staticClass:"flex vcenter"},[u("img",{staticClass:"mr-sm",attrs:{alt:"Vue logo",src:t("bd36")}}),u("router-link",{attrs:{to:"/"}},[u("h1",[e._v("vue-highlights")])])],1),u("div",{staticClass:"flex vcenter"},[u("router-link",{staticClass:"nav-item",attrs:{to:{name:"home"}}},[e._v(" Home ")]),u("router-link",{staticClass:"nav-item",attrs:{to:{name:"docs"}}},[e._v(" Documentation ")]),u("a",{staticClass:"nav-item",attrs:{href:"https://github.com/pggalaviz/vue-highlights",title:"Github",target:"_blank"}},[u("div",{staticClass:"nav-icon"},[u("svg",{attrs:{viewBox:"0 0 16 16"}},[u("path",{attrs:{d:"M7.999,0.431c-4.285,0-7.76,3.474-7.76,7.761 c0,3.428,2.223,6.337,5.307,7.363c0.388,0.071,0.53-0.168,0.53-0.374c0-0.184-0.007-0.672-0.01-1.32 c-2.159,0.469-2.614-1.04-2.614-1.04c-0.353-0.896-0.862-1.135-0.862-1.135c-0.705-0.481,0.053-0.472,0.053-0.472 c0.779,0.055,1.189,0.8,1.189,0.8c0.692,1.186,1.816,0.843,2.258,0.645c0.071-0.502,0.271-0.843,0.493-1.037 C4.86,11.425,3.049,10.76,3.049,7.786c0-0.847,0.302-1.54,0.799-2.082C3.768,5.507,3.501,4.718,3.924,3.65 c0,0,0.652-0.209,2.134,0.796C6.677,4.273,7.34,4.187,8,4.184c0.659,0.003,1.323,0.089,1.943,0.261 c1.482-1.004,2.132-0.796,2.132-0.796c0.423,1.068,0.157,1.857,0.077,2.054c0.497,0.542,0.798,1.235,0.798,2.082 c0,2.981-1.814,3.637-3.543,3.829c0.279,0.24,0.527,0.713,0.527,1.437c0,1.037-0.01,1.874-0.01,2.129 c0,0.208,0.14,0.449,0.534,0.373c3.081-1.028,5.302-3.935,5.302-7.362C15.76,3.906,12.285,0.431,7.999,0.431z"}})])])])],1)])]),u("router-view"),e._m(0)],1)},Qe=[function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("footer",{staticClass:"flex center py-md mt-lg",attrs:{id:"footer"}},[t("div",{staticClass:"text-center"},[t("div",[e._v(" © 2019 Pedro G. Galaviz ")]),t("a",{staticClass:"text-sm",attrs:{href:"http://pggalaviz.com"}},[e._v("pggalaviz.com")])])])}],Ze={name:"App"},Ie=Ze,Je=(t("9805"),t("2877")),Ke=Object(Je["a"])(Ie,Ve,Qe,!1,null,null,null),Xe=Ke.exports,Ye=function(){var e=this,a=e.$createElement,u=e._self._c||a;return u("div",{staticClass:"text-center",attrs:{id:"home"}},[u("img",{attrs:{id:"logo",alt:"Vue logo",src:t("bd36")}}),u("h1",[e._v("vue-highlights")]),e._m(0),e._m(1),u("div",{staticClass:"flex center text-md"},[u("vue-highlights",{staticClass:"content-container",attrs:{placeholder:e.placeholder,caretColor:e.caretColor,extractUrlsWithoutProtocol:e.options.extractUrlsWithoutProtocol,mentionsWithDots:e.options.mentionsWithDots},model:{value:e.text,callback:function(a){e.text=a},expression:"text"}})],1),u("div",{staticClass:"flex center my-md"},[u("div",{staticClass:"content-container",attrs:{id:"options"}},[u("h4",[e._v("Options (props)")]),u("div",{staticClass:"flex center"},[u("label",{staticClass:"cursor-pointer",attrs:{for:"ep"}},[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.extractUrlsWithoutProtocol,expression:"options.extractUrlsWithoutProtocol"}],attrs:{id:"ep",type:"checkbox"},domProps:{checked:Array.isArray(e.options.extractUrlsWithoutProtocol)?e._i(e.options.extractUrlsWithoutProtocol,null)>-1:e.options.extractUrlsWithoutProtocol},on:{change:function(a){var t=e.options.extractUrlsWithoutProtocol,u=a.target,s=!!u.checked;if(Array.isArray(t)){var n=null,i=e._i(t,n);u.checked?i<0&&e.$set(e.options,"extractUrlsWithoutProtocol",t.concat([n])):i>-1&&e.$set(e.options,"extractUrlsWithoutProtocol",t.slice(0,i).concat(t.slice(i+1)))}else e.$set(e.options,"extractUrlsWithoutProtocol",s)}}}),e._v(" extractUrlsWithoutProtocol ")]),u("label",{staticClass:"mx-lg cursor-pointer",attrs:{for:"tb"}},[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.targetBlank,expression:"options.targetBlank"}],attrs:{id:"tb",type:"checkbox"},domProps:{checked:Array.isArray(e.options.targetBlank)?e._i(e.options.targetBlank,null)>-1:e.options.targetBlank},on:{change:function(a){var t=e.options.targetBlank,u=a.target,s=!!u.checked;if(Array.isArray(t)){var n=null,i=e._i(t,n);u.checked?i<0&&e.$set(e.options,"targetBlank",t.concat([n])):i>-1&&e.$set(e.options,"targetBlank",t.slice(0,i).concat(t.slice(i+1)))}else e.$set(e.options,"targetBlank",s)}}}),e._v(" targetBlank ")]),u("label",{staticClass:"cursor-pointer",attrs:{for:"md"}},[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.mentionsWithDots,expression:"options.mentionsWithDots"}],attrs:{id:"md",type:"checkbox"},domProps:{checked:Array.isArray(e.options.mentionsWithDots)?e._i(e.options.mentionsWithDots,null)>-1:e.options.mentionsWithDots},on:{change:function(a){var t=e.options.mentionsWithDots,u=a.target,s=!!u.checked;if(Array.isArray(t)){var n=null,i=e._i(t,n);u.checked?i<0&&e.$set(e.options,"mentionsWithDots",t.concat([n])):i>-1&&e.$set(e.options,"mentionsWithDots",t.slice(0,i).concat(t.slice(i+1)))}else e.$set(e.options,"mentionsWithDots",s)}}}),e._v(" mentionsWithDots ")])]),u("div",{staticClass:"flex center mt-sm text-left relative"},[u("div",{staticClass:"mr-md col-50"},[u("label",{staticClass:"label cursor-pointer",attrs:{for:"uc"}},[e._v(" usernameClass ")]),u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.usernameClass,expression:"options.usernameClass"}],staticClass:"input",attrs:{id:"uc",type:"text"},domProps:{value:e.options.usernameClass},on:{input:function(a){a.target.composing||e.$set(e.options,"usernameClass",a.target.value)}}})]),u("div",{staticClass:"col-50"},[u("label",{staticClass:"label cursor-pointer",attrs:{for:"ut"}},[e._v(" usernameUrlBase ")]),u("div",[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.usernameUrlBase,expression:"options.usernameUrlBase"}],staticClass:"input",attrs:{id:"ut",type:"text"},domProps:{value:e.options.usernameUrlBase},on:{input:function(a){a.target.composing||e.$set(e.options,"usernameUrlBase",a.target.value)}}})])])]),u("div",{staticClass:"flex center mt-sm text-left"},[u("div",{staticClass:"mr-md col-50"},[u("label",{staticClass:"label cursor-pointer",attrs:{for:"hc"}},[e._v(" hashtagClass ")]),u("div",[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.hashtagClass,expression:"options.hashtagClass"}],staticClass:"input",attrs:{id:"hc",type:"text"},domProps:{value:e.options.hashtagClass},on:{input:function(a){a.target.composing||e.$set(e.options,"hashtagClass",a.target.value)}}})])]),u("div",{staticClass:"col-50"},[u("label",{staticClass:"label cursor-pointer",attrs:{for:"ht"}},[e._v(" hashtagUrlBase ")]),u("div",[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.hashtagUrlBase,expression:"options.hashtagUrlBase"}],staticClass:"input",attrs:{id:"ht",type:"text"},domProps:{value:e.options.hashtagUrlBase},on:{input:function(a){a.target.composing||e.$set(e.options,"hashtagUrlBase",a.target.value)}}})])])]),u("div",{staticClass:"flex center mt-sm text-left"},[u("div",{staticClass:"mr-md col-50"},[u("label",{staticClass:"label cursor-pointer",attrs:{for:"urc"}},[e._v(" urlClass ")]),u("div",[u("input",{directives:[{name:"model",rawName:"v-model",value:e.options.urlClass,expression:"options.urlClass"}],staticClass:"input",attrs:{id:"urc",type:"text"},domProps:{value:e.options.urlClass},on:{input:function(a){a.target.composing||e.$set(e.options,"urlClass",a.target.value)}}})])]),u("div",{staticClass:"col-50"},[u("label",{staticClass:"label cursor-pointer",attrs:{for:"cc"}},[e._v(" caretColor ")]),u("div",[u("input",{directives:[{name:"model",rawName:"v-model",value:e.caretColor,expression:"caretColor"}],staticClass:"input",attrs:{id:"cc",type:"text"},domProps:{value:e.caretColor},on:{input:function(a){a.target.composing||(e.caretColor=a.target.value)}}})])])])])]),u("div",{staticClass:"column center vcenter"},[u("div",{staticClass:"content-container"},[u("div",{staticClass:"mb-md"},[u("h4",[e._v("HTML with links:")]),u("div",{staticClass:"text-md",domProps:{innerHTML:e._s(e.$autoLink(e.text,e.options))}})]),u("div",{staticClass:"mb-md"},[u("h4",[e._v("Text with links:")]),u("div",{staticClass:"text-center"},[u("div",{},[e._v(" "+e._s(e.$autoLink(e.text,e.options)))])])]),u("div",{staticClass:"mb-md"},[u("h4",[e._v("Model text:")]),u("div",{},[e._v(" "+e._s(e.text))])])])])])},ea=[function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{staticClass:"mb-md",attrs:{id:"description"}},[t("b",[e._v("Easy mention, hashtag and URL highlight for Vue 2.x")])])},function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{staticClass:"flex center mb-md text-sm"},[t("div",{staticClass:"pa-md font-mono content-container",attrs:{id:"install"}},[e._v(" npm install --save vue-highlights ")])])}],aa={name:"Home",data:function(){return{placeholder:"Write something here, include @mentions, #hashtags and URLs...",text:"Hi there! @pggalaviz #vue pggalaviz.com",caretColor:"#ff3b8e",options:{targetBlank:!0,extractUrlsWithoutProtocol:!0,mentionsWithDots:!1,usernameClass:"highlights username",usernameUrlBase:"#/",hashtagClass:"highlights hashtag",hashtagUrlBase:"#/hashtag/",urlClass:"highlights url"}}}},ta=aa,ua=(t("4bd6"),Object(Je["a"])(ta,Ye,ea,!1,null,null,null)),sa=ua.exports,na=function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{attrs:{id:"docs"}},[t("div",{staticClass:"container"},[t("h2",[e._v("Documentation")]),t("h3",[e._v("Installation")]),t("p",[e._v("You can install via npm or yarn:")]),t("CodeSnippet",{attrs:{lang:"shell",code:e.code1}}),t("p",[e._v("And then import the component in your app:")]),t("CodeSnippet",{attrs:{lang:"js",code:e.code2}}),t("h3",[e._v("Usage")]),t("p",[e._v("Let's create our first component:")]),t("CodeSnippet",{attrs:{lang:"js",code:e.code3}}),t("p",[e._v("As you can see, the component accepts some props:")]),e._m(0),t("p",[e._v(" The exported component (vue-highlights) renders a text input that highlights all username, hashtag and URL matches. In order to work with this input some CSS classes should be attended, here's an example: ")]),t("CodeSnippet",{attrs:{lang:"css",code:e.code4}}),t("p",[e._v("With this we should get a working example.")]),e._m(1),e._m(2),t("h5",[e._v("Examples")]),t("CodeSnippet",{attrs:{lang:"js",code:e.code5}}),t("p",[e._v("Now we can render our linked/highlighted text anywhere we like:")]),t("CodeSnippet",{attrs:{lang:"js",code:e.code6}})],1)])},ia=[function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("table",{staticClass:"text-sm",staticStyle:{width:"100%"}},[t("thead",{staticClass:"mb-sm"},[t("tr",[t("th",[e._v("Prop")]),t("th",{staticClass:"px-sm"},[e._v("Type")]),t("th",{attrs:{colspan:"2"}},[e._v("Description")])])]),t("tbody",[t("tr",[t("td",{staticClass:"props-name-col"},[t("div",{staticClass:"props-name"},[e._v(" extractUrlsWithoutProtocol ")])]),t("td",{staticClass:"props-type-col px-sm"},[t("div",{staticClass:"props-type"},[e._v(" Boolean ")])]),t("td",{staticClass:"props-desc-col"},[t("div",{staticClass:"props-desc"},[e._v(" As the name says, when active, the compoponet will try to match URLs even when a protocol (http://, https://) is not found. "),t("b",[e._v("Defaults to true")])])])]),t("tr",[t("td",{staticClass:"props-name-col"},[t("div",{staticClass:"props-name"},[e._v(" caretColor ")])]),t("td",{staticClass:"props-type-col px-sm"},[t("div",{staticClass:"props-type"},[e._v(" String ")])]),t("td",{staticClass:"props-desc-col"},[t("div",{staticClass:"props-desc"},[e._v(" A valid HEX color (eg. #ccc, #ff4545). ")])])]),t("tr",[t("td",{staticClass:"props-name-col"},[t("div",{staticClass:"props-name"},[e._v(" placeholder ")])]),t("td",{staticClass:"props-type-col px-sm"},[t("div",{staticClass:"props-type"},[e._v(" String ")])]),t("td",{staticClass:"props-desc-col"},[t("div",{staticClass:"props-desc"},[e._v(" A placeholder to show when no text is entered. ")])])]),t("tr",[t("td",{staticClass:"props-name-col"},[t("div",{staticClass:"props-name"},[e._v(" usernameClass ")])]),t("td",{staticClass:"props-type-col px-sm"},[t("div",{staticClass:"props-type"},[e._v(" String ")])]),t("td",{staticClass:"props-desc-col"},[t("div",{staticClass:"props-desc"},[e._v(" The CSS class(es) that will be added to a @username match. ")])])]),t("tr",[t("td",{staticClass:"props-name-col"},[t("div",{staticClass:"props-name"},[e._v(" hashtagClass ")])]),t("td",{staticClass:"props-type-col px-sm"},[t("div",{staticClass:"props-type"},[e._v(" String ")])]),t("td",{staticClass:"props-desc-col"},[t("div",{staticClass:"props-desc"},[e._v(" The CSS class(es) that will be added to a #hashtag match. ")])])]),t("tr",[t("td",{staticClass:"props-name-col"},[t("div",{staticClass:"props-name"},[e._v(" urlClass ")])]),t("td",{staticClass:"props-type-col px-sm"},[t("div",{staticClass:"props-type"},[e._v(" String ")])]),t("td",{staticClass:"props-desc-col"},[t("div",{staticClass:"props-desc"},[e._v(" The CSS class(es) that will be added to a URL match. ")])])])])])},function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("p",[e._v("As you can see when we first imported the package, 2 functions are also exported: "),t("b",[e._v("autoLink")]),e._v(" and "),t("b",[e._v("autoHighlight")]),e._v(". ")])},function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("p",[e._v(" Both return a "),t("b",[e._v("String")]),e._v(" value which contains our highlighted text. "),t("b",[e._v("autoLink")]),e._v(" returns the matches found between "),t("b",[e._v("anchor")]),e._v(" tags for links. "),t("b",[e._v("autoHighlight")]),e._v(" returns the matches found between "),t("b",[e._v("span")]),e._v(" tags for highlight only. ")])}],ra=function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{staticClass:"code-snippet box relative flex"},[t("div",{staticClass:"language"},[e._v(e._s(e.lang))]),t("div",{staticClass:"line-numbers"},e._l(e.lineCount,(function(a){return t("div",{key:a,staticClass:"line-number"},[e._v(e._s(a))])})),0),t("div",{staticClass:"render",domProps:{innerHTML:e._s(e.result)}})])},oa=[],da=(t("498a"),t("1487")),ca=t.n(da),la={name:"CodeSnippet",props:{code:String,lang:String},computed:{result:function(){var e=ca.a.highlight(this.lang,this.code.trim());return e.value},lineCount:function(){for(var e=this.result,a=0,t=0;t\n"),va="\n.highlights__content {\n position: relative;\n}\n\n.highlights__placeholder {\n color: #ccc;\n position: absolute;\n top: 16px;\n left: 16px;\n z-index: -1;\n}\n\n.highlights__body-container {\n border-radius: 5px;\n border: 1px solid #eaeaea;\n padding: 16px;\n}\n\n.highlights__body {\n min-height: 60px;\n}\n\n.highlights {\n color: #ff3b8e;\n}\n",ya='\nimport { autoLink, autoHighlight } from \'vue-highlights\'\n\nconst text = \'my @username, my #hashtag and myurl.com\'\n\nconst autoLinked = autoLink(text, {\n extractUrlsWithoutProtocol: true, // Defaults to true\n targetBlank: true, // Defauls to true, applies only in URLs\n usernameClass: \'username-class\',\n usernameUrlBase: \'/users/\',\n hashtagClass: \'hashtag-class\',\n hashtagUrlBase: \'/myhashtags/\',\n urlClass: \'url-class\'\n})\n\n/*\nautoLinked:\nmy @username, my #hashtag\nand myurl.com\n*/\n\nconst autoHighlighted = autoHighlight(text, {\n extractUrlsWithoutProtocol: true, // Defaults to true\n usernameClass: \'username-class\',\n hashtagClass: \'hashtag-class\',\n urlClass: \'url-class\'\n})\n\n/*\nautoHighlighted:\nmy @username, my \n#hashtag and myurl.com\n*/\n',Ca="\n\n\n