feat: Individual page export in Markdown and HTML formats (#80)

* fix maths node

* render default html width

* Add page export module
* with support for html and markdown exports

* Page export UI
* Add PDF print too

* remove unused import

packages/editor-ext/src/lib/image/image.ts

@@ -57,9 +57,9 @@ export const TiptapImage = Image.extend<ImageOptions>({
       },
       width: {
         default: "100%",
-        parseHTML: (element) => element.getAttribute("data-width"),
+        parseHTML: (element) => element.getAttribute("width"),
         renderHTML: (attributes: ImageAttributes) => ({
-          "data-width": attributes.width,
+          width: attributes.width,
         }),
       },
       align: {

packages/editor-ext/src/lib/math/math-block.ts

@@ -56,7 +56,7 @@ export const MathBlock = Node.create({
     return [
       "div",
       {},
-      ["div", { "data-katex": true }, `$${HTMLAttributes.text}$`],
+      ["div", { "data-katex": true }, `$$${HTMLAttributes.text}$$`],
     ];
   },
 
@@ -64,10 +64,6 @@ export const MathBlock = Node.create({
     return ReactNodeViewRenderer(this.options.view);
   },
 
-  renderText({ node }) {
-    return node.attrs.text;
-  },
-
   addCommands() {
     return {
       setMathBlock:

packages/editor-ext/src/lib/math/math-inline.ts

@@ -54,15 +54,7 @@ export const MathInline = Node.create<MathInlineOption>({
   },
 
   renderHTML({ HTMLAttributes }) {
-    return [
-      "div",
-      {},
-      ["span", { "data-katex": true }, `$${HTMLAttributes.text}$`],
-    ];
-  },
-
-  renderText({ node }) {
-    return node.attrs.text;
+    return ["span", { "data-katex": true }, `$${HTMLAttributes.text}$` || {}];
   },
 
   addNodeView() {

packages/editor-ext/src/lib/video/video.ts

@@ -62,9 +62,9 @@ export const TiptapVideo = Node.create<VideoOptions>({
       },
       width: {
         default: "100%",
-        parseHTML: (element) => element.getAttribute("data-width"),
+        parseHTML: (element) => element.getAttribute("width"),
         renderHTML: (attributes: VideoAttributes) => ({
-          "data-width": attributes.width,
+          width: attributes.width,
         }),
       },
       size: {