docsify-chat/lib/docsify-chat.min.js

A docsify plugin for generate chat panel from markdown

var w="@media screen and (max-width: 768px){.controls{display:none !important}}.chat-panel{position:relative;border-radius:.5rem;margin:1rem auto;background-color:#f6f8fa;overflow:hidden}.chat-panel button{border:0;background:none;margin:0;padding:0;display:flex;align-items:center;justify-content:center}.chat-panel .title-bar{text-align:center}.chat-panel .title-bar.mac{display:flex;justify-content:center;padding:.9rem 1rem;width:100%}.chat-panel .title-bar.mac .title{font-weight:500;font-size:.9rem;line-height:.9rem;letter-spacing:.5px}.chat-panel .title-bar.mac .controls{position:absolute;top:1rem;left:1rem;display:grid;gap:.6rem;grid-template-columns:repeat(3, 0.8rem)}.chat-panel .title-bar.mac .controls svg{opacity:0}.chat-panel .title-bar.mac .controls:hover button{transform:scale(1.2)}.chat-panel .title-bar.mac .controls:hover svg{opacity:1}.chat-panel .title-bar.mac .controls .close{--bg-color: #ff5f56;--border-color: #e0443e}.chat-panel .title-bar.mac .controls .stretch{--bg-color: #27c93f;--border-color: #1aab29}.chat-panel .title-bar.mac .controls .stretch svg{transform:rotate(90deg)}.chat-panel .title-bar.mac .controls .minimize{--bg-color: #ffbd2e;--border-color: #dea123}.chat-panel .title-bar.mac .controls .circle{width:.8rem;height:.8rem;border-radius:50%;background-color:var(--bg-color);box-shadow:0 0 0 .5px var(--border-color);transition:transform .1s ease-in}.chat-panel .title-bar.windows{display:flex;flex-shrink:0;width:100%;height:28px;align-items:center;justify-content:center;position:relative;border-radius:6px 6px 0 0}.chat-panel .title-bar.windows .title{font-size:.8rem}.chat-panel .title-bar.windows .controls{height:100%;position:absolute;right:0;display:flex;align-items:center}.chat-panel .title-bar.windows .controls svg{width:12px;height:100%}.chat-panel .title-bar.windows .controls button{height:100%;padding:0 18px;transition:all ease-in-out 60ms}.chat-panel .title-bar.windows .controls button:hover{background:rgba(136,136,136,.2)}.chat-panel .title-bar.windows .controls button[class=close]:hover{background:rgba(255,0,0,.8)}.chat-panel .title-bar.windows .controls button[class=close]:hover svg{filter:invert(1)}.chat-panel .main-area{width:100%;min-height:auto}.chat-panel .main-area .chat-message{display:flex;position:relative;padding:1rem;opacity:0;transform:translate(-10%);transition:transform .4s ease-out,opacity .4s ease-in}.chat-panel .main-area .chat-message.self{transform:translate(10%);justify-content:flex-end}.chat-panel .main-area .chat-message.self .message-box{margin-left:0;margin-right:.5rem}.chat-panel .main-area .chat-message.self .nickname{text-align:right}.chat-panel .main-area .chat-message.show{opacity:1;transform:translate(0)}.chat-panel .main-area .chat-message .avatar{width:2.5rem;height:2.5rem;overflow:hidden;flex-shrink:0;border-radius:50%;line-height:2.5rem;color:#fff;text-align:center}.chat-panel .main-area .chat-message .avatar img{display:inline-flex;line-height:0;justify-content:center;align-items:center;color:#fff}.chat-panel .main-area .chat-message .message-box{display:inline-block;margin-left:.5rem;max-width:90%;vertical-align:top}.chat-panel .main-area .chat-message .message-box .nickname{font-size:.8rem;color:gray}.chat-panel .main-area .chat-message .message-box .message{position:relative;width:fit-content;font-size:.9rem;border-radius:.5rem;background-color:#fff;word-break:break-all;padding:.6rem .7rem;margin-top:.2rem;box-shadow:rgba(0,0,0,0) 0px 0px 0px 0px,rgba(0,0,0,0) 0px 0px 0px 0px,rgba(0,0,0,.05) 0px 1px 2px 0px}.chat-panel .main-area .chat-message .message-box .message .chat-text{min-height:1rem}.chat-panel .main-area .chat-message .message-box .message .chat-image{display:block;min-width:5rem;border-radius:.3rem;margin-bottom:.3rem}";var v="1.0.2";function y(r){let t=0,e="#";for(let i=0;i<r.length;i++)t=r.charCodeAt(i)+((t<<5)-t);for(let i=0;i<3;i++){let o=t>>i*8&255;e+=("00"+o.toString(16)).substr(-2)}return e}var k='<svg width="7" height="7" fill="none" xmlns="http://www.w3.org/2000/svg">\r<path stroke="#000" stroke-width="1.2" stroke-linecap="round" d="M1.182 5.99L5.99 1.182m0 4.95L1.182 1.323" />\r</svg>';var x='<svg width="6" height="1" fill="none" xmlns="http://www.w3.org/2000/svg">\r<path stroke="#000" stroke-width="2" stroke-linecap="round" d="M.61.703h5.8" />\r</svg>';var $='<svg viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">\r<path d="M4.871 3.553L9.37 8.098V3.553H4.871zm3.134 5.769L3.506 4.777v4.545h4.499z" />\r<circle cx="6.438" cy="6.438" r="6.438" fill="none" />\r</svg>';var z='<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000" preserveAspectRatio="xMidYMid meet">\r<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">\r<path d="M900 4272 c-46 -23 -75 -79 -65 -130 6 -33 98 -129 778 -809 l772 -773 -772 -772 c-849 -851 -807 -802 -767 -885 25 -51 77 -78 129 -69 36 7 110 78 813 779 l772 772 773 -772 c702 -701 776 -772 812 -779 52 -9 104 18 129 69 40 83 82 34 -767 885 l-772 772 772 773 c680 680 772 776 778 809 15 82 -61 158 -143 143 -33 -6 -129 -98 -810 -778 l-772 -772 -768 767 c-428 428 -779 772 -795 777 -39 15 -56 14 -97 -7z" />\r</g>\r</svg>';var M='<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000" preserveAspectRatio="xMidYMid meet">\r<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">\r<path d="M724 2751 c-105 -64 -109 -209 -8 -272 l39 -24 1805 0 1805 0 35 22 c101 63 104 194 6 267 l-27 21 -1812 3 c-1761 2 -1813 1 -1843 -17z" />\r</g>\r</svg>';var S='<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000" preserveAspectRatio="xMidYMid meet">\r<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">\r<path d="M1100 4464 c-218 -47 -399 -229 -445 -449 -22 -105 -22 -2805 0 -2910 47 -222 228 -403 450 -450 105 -22 2805 -22 2910 0 222 47 403 228 450 450 22 105 22 2805 0 2910 -47 222 -228 403 -450 450 -102 21 -2815 21 -2915 -1z m2870 -315 c58 -18 130 -78 159 -134 l26 -50 3 -1385 c2 -1001 0 -1396 -9 -1426 -16 -60 -76 -133 -134 -163 l-50 -26 -1405 0 -1405 0 -50 26 c-58 30 -118 103 -134 163 -9 30 -11 425 -9 1426 l3 1385 26 50 c28 53 100 116 153 133 46 15 2776 16 2826 1z" />\r</g>\r</svg>';var P=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"];function E(r){return P.includes(r)}function _(r){return r.replace(/([A-Z])/g,"-$1").toLowerCase()}function B(r){switch(!0){case typeof r==="number":return String(r);case!r:case typeof r==="boolean":return"";case Array.isArray(r):return r.map(B).join("");default:return String(r)}}function rr(r,t){switch(!0){case typeof t==="boolean":t="";break;case(r==="style"&&t&&typeof t==="object"):t=Object.entries(t).map(([e,i])=>`${_(e)}: ${i}`).join("; ");break;case(r==="class"&&Array.isArray(t)):t=t.join(" ");break;case(r==="class"&&t&&typeof t==="object"):t=Object.entries(t).filter(([,e])=>e).map(([e])=>e).join(" ");break;default:t=String(t);break}return`${r}="${t}"`}function f(r){return Array.isArray(r.children)?r.children.join(""):r.children}function L(r,t){if(typeof r==="function")return r({...t});let{children:e="",dangerouslySetInnerHTML:i,...o}=t,a=Object.entries(o).map((h)=>rr(...h)).join(" ");if(E(r))return a?`<${r} ${a} />`:`<${r} />`;let l=a?`<${r} ${a}>`:`<${r}>`,m=`</${r}>`,g=i?.__html??B(e);return`${l}${g}${m}`}var n=L,d=L;function tr(){return d(f,{children:[n("button",{class:"circle close",dangerouslySetInnerHTML:{__html:k}}),n("button",{class:"circle minimize",dangerouslySetInnerHTML:{__html:x}}),n("button",{class:"circle stretch",dangerouslySetInnerHTML:{__html:$}})]})}function or(){return d(f,{children:[n("button",{class:"minimize",dangerouslySetInnerHTML:{__html:M}}),n("button",{class:"stretch",dangerouslySetInnerHTML:{__html:S}}),n("button",{class:"close",dangerouslySetInnerHTML:{__html:z}})]})}function er(){let r=window.$docsify?.chat?.os;switch(r){case"mac":return n(tr,{});case"windows":return n(or,{});default:console.error(`os "${r}" is invalid argument`)}}function Y(r){let t=window.$docsify?.chat?.os;return d("header",{class:["title-bar",t],children:[n("div",{class:"controls",children:n(er,{})}),n("span",{class:"title",children:r.title})]})}function V(r){let{avatar:t,nickname:e}=r.user;if(t)return n("div",{class:t,children:n("img",{src:t})});else{let i=y(e),o=e.substring(0,1);return n("div",{class:"avatar",style:{backgroundColor:i},children:n("span",{children:o})})}}function D(r){let{user:t,content:e,self:i}=r;return d("div",{class:{"chat-message":!0,self:i},children:[!i&&n(V,{user:t}),d("div",{class:"message-box",children:[n("div",{class:"nickname",children:t.nickname}),n("div",{class:"message",children:e})]}),i&&n(V,{user:t})]})}var q=document.createElement("style");q.textContent=w;document.head.appendChild(q);var ir=/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform),I=/( *)(<!-+\s+chat:\s*?start\s+-+>)(?:(?!(<!-+\s+chat:\s*?(?:start|end)\s+-+>))[\s\S])*(<!-+\s+chat:\s*?end\s+-+>)/,u=/[\r\n]*(\s*)<!-+\s+title:\s*(.*)\s+-+>/,b=/[\r\n]*(\s*)<!-+\s+self:\s*(.*)\s+-+>/,Z=/[\r\n]*(\s*)#{1,6}\s*[*_]{2}\s*(.*[^\s])\s*[*_]{2}[\r\n]+([\s\S]*?)(?=#{1,6}\s*[*_]{2}|<!-+\s+chat:\s*?end\s+-+>)/m,c={animation:50,myself:null,self:null,os:ir?"mac":"windows",title:"Dialog",users:[],version:v};function ar(r){let t=/!\[(.*?)\]\((.*?)\)/;return r.trim().split(`
`).map((o)=>{if(t.test(o))return o.replace(t,'<img class="chat-image" src="$2" alt="$1" />');else{let s=`<div class="chat-text">${o}</div>`;return o.replace(o,s)}}).join("")}function nr(r,t){let e,i;while(e=I.exec(r)){let o=e[0],a=c.title,s=c.self||c.myself,l="",m="",g=u.test(o),h=b.test(o),J=Z.test(o);if(g)a=u.exec(o)[2],o=o.replace(u,"");let Q=n(Y,{title:a});if(h)s=b.exec(o)[2],o=o.replace(b,"");if(J){l=`<section class="chat-panel">${Q}<main class="main-area">`,m="</main></section>";while(i=Z.exec(o)){let p=i[2],G=ar(i[3]),H=c.users.find((N)=>N.nickname===p)??{nickname:p},F=s===p;o=o.replace(i[0],n(D,{user:H,content:G,self:F}))}}let W=e[2],X=e[4];o=o.replace(W,l),o=o.replace(X,m),o=o.replace(/(\s{2,}|\n)/g,""),r=r.replace(e[0],o)}return r}function sr(){return new ResizeObserver((r)=>{r.forEach((t)=>{let{target:e}=t,{offsetWidth:i}=e,o=e.getElementsByClassName("chat-image");for(let a=0;a<o.length;a++){let s=o[a];s.style.maxWidth=`calc((${i}px - 5rem) / 2)`}})})}function lr(){return new IntersectionObserver((r)=>{r.forEach((t)=>{let{target:e,isIntersecting:i}=t,o=e.getElementsByClassName("chat-message");for(let a=0;a<o.length;a++){let s=o[a];if(i)setTimeout(()=>s.classList.add("show"),a*c.animation);else s.classList.remove("show")}})})}function cr(r,t){let e,i=sr(),o=lr();r.beforeEach((a)=>{if(e=I.test(a),e)a=nr(a,t);return a}),r.doneEach(()=>{if(c.myself)console.warn('The "myself" attribute is about to be abandoned, it is recommended to replace it with "self".');if(i.disconnect(),o.disconnect(),!e)return;let a=document.getElementsByClassName("chat-panel");for(let s=0;s<a.length;s++){let l=a[s];i.observe(l),o.observe(l)}})}window.$docsify??={};window.$docsify.chat??={};window.$docsify.plugins??=[];window.$docsify.plugins.push(cr);Object.assign(c,window.$docsify.chat);