reactjs-tiptap-editor
Version:
A modern WYSIWYG rich text editor based on tiptap and shadcn ui for React
40 lines (36 loc) • 2.69 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("./clsx-CXbNJWDD.cjs"),l=require("react/jsx-runtime"),m=require("./index-BnVcq33n.cjs");require("react");require("./theme.cjs");function y(e,n){var u;const t=document.createElement("iframe");t.setAttribute("style","position: absolute; width: 0; height: 0; top: 0; left: 0;"),document.body.appendChild(t);const o=t.contentDocument||((u=t.contentWindow)==null?void 0:u.document);if(!o)return;const{paperSize:s,title:i="React Tiptap Editor",margins:{top:d,right:c,bottom:r,left:a}}=n,p=`
<!DOCTYPE html>
<html lang="en">
<head>
<title>${i}</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@media print {
@page {
size: ${s};
margin: ${d} ${c} ${r} ${a}; /* top, right, bottom, left */
}
body {
background: none;
margin: 0;
padding: 0;
}
.print-container {
width: 100%;
box-sizing: border-box;
}
.no-print {
display: none;
}
}
</style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reactjs-tiptap-editor@latest/lib/style.css">
</head>
<body>
<div class="print-container">
${e}
</div>
</body>
</html>
`;o.open(),o.write(p),o.close(),t.addEventListener("load",()=>{setTimeout(()=>{var f,h;try{(f=t.contentWindow)==null||f.focus(),(h=t.contentWindow)==null||h.print()}catch(x){console.error("Print failed",x)}setTimeout(()=>{document.body.removeChild(t)},100)},50)})}function g(e,n){const t=e.getHTML();return t?(y(t,n),!0):!1}function E(){const e=m.useButtonProps(b.name),{icon:n=void 0,tooltip:t=void 0,shortcutKeys:o=void 0,tooltipOptions:s={},action:i=void 0,isActive:d=void 0}=(e==null?void 0:e.componentProps)??{},{dataState:c,disabled:r,update:a}=m.useToggleActive(d),p=()=>{r||i&&(i(),a())};return e?l.jsx(m.ActionButton,{action:p,dataState:c,disabled:r,icon:n,shortcutKeys:o,tooltip:t,tooltipOptions:s}):l.jsx(l.Fragment,{})}const b=v.Extension.create({name:"exportPdf",addOptions(){var e;return{...(e=this.parent)==null?void 0:e.call(this),paperSize:"Letter",title:"Echo Editor",margins:{top:"0.4in",right:"0.4in",bottom:"0.4in",left:"0.4in"},button:({editor:n,extension:t,t:o})=>({componentProps:{action:()=>{g(n,t.options)},icon:"ExportPdf",tooltip:o("editor.exportPdf.tooltip"),isActive:()=>!1,disabled:!1}})}},addCommands(){return{exportToPdf:()=>({editor:e})=>g(e,this.options)}}});exports.ExportPdf=b;exports.RichTextExportPdf=E;