md-editor-rt
Version:
Markdown editor for react, developed in jsx and typescript, dark theme、beautify content by prettier、render articles directly、paste or clip the picture and upload it...
2 lines (1 loc) • 6.87 kB
JavaScript
;const j=require("@vavt/copy2clipboard"),i=require("./config.cjs"),q={copy:`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy ${i.prefix}-icon"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>`,"collapse-tips":`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-chevron-left ${i.prefix}-icon"><circle cx="12" cy="12" r="10"/><path d="m14 16-4-4 4-4"/></svg>`,pin:`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pin ${i.prefix}-icon"><path d="M12 17v5"/><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"/></svg>`,"pin-off":`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pin-off ${i.prefix}-icon"><path d="M12 17v5"/><path d="M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89"/><path d="m2 2 20 20"/><path d="M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11"/></svg>`,check:`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check ${i.prefix}-icon"><path d="M20 6 9 17l-5-5"/></svg>`},p=(d,c)=>typeof c[d]=="string"?c[d]:q[d],A=(d,c)=>{const e=s=>{const t=d.parentElement||document.body,n=t.offsetWidth,r=t.offsetHeight,{clientWidth:l,clientHeight:u}=document.documentElement,a=s.offsetX,w=s.offsetY,g=y=>{let h=y.x+document.body.scrollLeft-document.body.clientLeft-a,m=y.y+document.body.scrollTop-document.body.clientTop-w;h=h<1?1:h<l-n-1?h:l-n-1,m=m<1?1:m<u-r-1?m:u-r-1,c?c(h,m):(t.style.left=h+"px",t.style.top=m+"px")};document.addEventListener("mousemove",g);const f=()=>{document.removeEventListener("mousemove",g),document.removeEventListener("mouseup",f)};document.addEventListener("mouseup",f)};return d.addEventListener("mousedown",e),()=>{d.removeEventListener("mousedown",e)}},X=(d,c,e="")=>{const s=document.getElementById(c.id);if(s)e!==""&&(Reflect.get(window,e)?c.onload?.call(s,new Event("load")):c.onload&&s.addEventListener("load",c.onload));else{const t={...c};t.onload=null;const n=B(d,t);c.onload&&n.addEventListener("load",c.onload),document.head.appendChild(n)}},D=(d,c)=>{document.getElementById(c.id)?.remove(),X(d,c)},B=(d,c)=>{const e=document.createElement(d);return Object.keys(c).forEach(s=>{c[s]!==void 0&&(e[s]=c[s])}),e},z=(d,c)=>{const e=new Map;return d?.forEach(s=>{let t=s.querySelector(`.${i.prefix}-mermaid-action`);t?t.querySelector(`.${i.prefix}-mermaid-copy`)||t.insertAdjacentHTML("beforeend",`<span class="${i.prefix}-mermaid-copy">${p("copy",c.customIcon)}</span>`):(s.insertAdjacentHTML("beforeend",`<div class="${i.prefix}-mermaid-action"><span class="${i.prefix}-mermaid-copy">${p("copy",c.customIcon)}</span></div>`),t=s.querySelector(`.${i.prefix}-mermaid-action`));const n=t.querySelector(`.${i.prefix}-mermaid-copy`);let r=-1;const l=()=>{clearTimeout(r),j(s.dataset.content||"").then(()=>{n.innerHTML=p("check",c.customIcon)}).catch(()=>{n.innerHTML=p("copy",c.customIcon)}).finally(()=>{r=window.setTimeout(()=>{n.innerHTML=p("copy",c.customIcon)},1500)})};n.addEventListener("click",l),e.set(s,{removeClick:()=>{n.removeEventListener("click",l)}})}),()=>{e.forEach(({removeClick:s})=>{s?.()}),e.clear()}},b=(()=>{const d=e=>{if(!e)return()=>{};const s=e.firstChild;let t=1,n=0,r=0,l=!1,u,a,w,g=1;const f=()=>{s.style.transform=`translate(${n}px, ${r}px) scale(${t})`},y=o=>{o.touches.length===1?(l=!0,u=o.touches[0].clientX-n,a=o.touches[0].clientY-r):o.touches.length===2&&(w=Math.hypot(o.touches[0].clientX-o.touches[1].clientX,o.touches[0].clientY-o.touches[1].clientY),g=t)},h=o=>{if(o.preventDefault(),l&&o.touches.length===1)n=o.touches[0].clientX-u,r=o.touches[0].clientY-a,f();else if(o.touches.length===2){const E=Math.hypot(o.touches[0].clientX-o.touches[1].clientX,o.touches[0].clientY-o.touches[1].clientY)/w,v=t;t=g*(1+(E-1));const x=(o.touches[0].clientX+o.touches[1].clientX)/2,M=(o.touches[0].clientY+o.touches[1].clientY)/2,Y=s.getBoundingClientRect(),S=(x-Y.left)/v,I=(M-Y.top)/v;n-=S*(t-v),r-=I*(t-v),f()}},m=()=>{l=!1},k=o=>{o.preventDefault();const L=.02,E=t;o.deltaY<0?t+=L:t=Math.max(.1,t-L);const v=s.getBoundingClientRect(),x=o.clientX-v.left,M=o.clientY-v.top;n-=x/E*(t-E),r-=M/E*(t-E),f()},$=o=>{l=!0,u=o.clientX-n,a=o.clientY-r},C=o=>{l&&(n=o.clientX-u,r=o.clientY-a,f())},H=()=>{l=!1},T=()=>{l=!1};return e.addEventListener("touchstart",y,{passive:!1}),e.addEventListener("touchmove",h,{passive:!1}),e.addEventListener("touchend",m),e.addEventListener("wheel",k,{passive:!1}),e.addEventListener("mousedown",$),e.addEventListener("mousemove",C),e.addEventListener("mouseup",H),e.addEventListener("mouseleave",T),()=>{e.removeEventListener("touchstart",y),e.removeEventListener("touchmove",h),e.removeEventListener("touchend",m),e.removeEventListener("wheel",k),e.removeEventListener("mousedown",$),e.removeEventListener("mousemove",C),e.removeEventListener("mouseup",H),e.removeEventListener("mouseleave",T)}};return(e,s)=>{const t=new Map;return e?.forEach(n=>{let r=n.querySelector(`.${i.prefix}-mermaid-action`);r?r.querySelector(`.${i.prefix}-mermaid-zoom`)||r.insertAdjacentHTML("beforeend",`<span class="${i.prefix}-mermaid-zoom">${p("pin-off",s.customIcon)}</span>`):(n.insertAdjacentHTML("beforeend",`<div class="${i.prefix}-mermaid-action"><span class="${i.prefix}-mermaid-zoom">${p("pin-off",s.customIcon)}</span></div>`),r=n.querySelector(`.${i.prefix}-mermaid-action`));const l=r.querySelector(`.${i.prefix}-mermaid-zoom`),u=()=>{const a=t.get(n);if(a?.removeEvent)a.removeEvent(),n.removeAttribute("data-grab"),t.set(n,{removeClick:a.removeClick}),l.innerHTML=p("pin-off",s.customIcon);else{const w=d(n);n.setAttribute("data-grab",""),t.set(n,{removeEvent:w,removeClick:a?.removeClick}),l.innerHTML=p("pin",s.customIcon)}};l.addEventListener("click",u),t.set(n,{removeClick:()=>l.removeEventListener("click",u)})}),()=>{t.forEach(({removeEvent:n,removeClick:r})=>{n?.(),r?.()}),t.clear()}}})();exports.StrIcon=p;exports.appendHandler=X;exports.copyMermaid=z;exports.keyMove=A;exports.updateHandler=D;exports.zoomMermaid=b;