@dooherceg/tiptap-controlled-editor-with-table 0.0.11 → 0.0.12

package/dist/components/tiptap-templates/simple/simple-editor.d.ts

@@ -10,4 +10,4 @@ export interface SimpleEditorProps extends Omit<Partial<EditorOptions>, "content
 export interface SimpleEditorRef {
     getEditor: () => Editor | null;
 }
-export declare function SimpleEditor({ themeMode, content, onContentChange, placeholder, ref, }: SimpleEditorProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SimpleEditor({ themeMode, content, onContentChange, placeholder, ref, autofocus, onFocus, onBlur, }: SimpleEditorProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/tiptap-templates/simple/simple-editor.js

@@ -1,7 +1,7 @@
 import { jsx as p, jsxs as w, Fragment as at } from "react/jsx-runtime";
 import { useEditor as Ct, EditorContext as Lt, EditorContent as wt } from "@tiptap/react";
 import { useState as vt, useRef as q, useEffect as D, useImperativeHandle as Mt } from "react";
-import { Mark as Q, markPasteRule as xt, markInputRule as At, mergeAttributes as k, Node as L, nodeInputRule as It, ResizableNodeView as St, wrappingInputRule as S, renderNestedMarkdownContent as lt, Extension as C, parseIndentedBlocks as F, isNodeActive as _, isAtStartOfNode as Ht, isAtEndOfNode as Et, getNodeType as ut, getNodeAtPosition as $t, textInputRule as y, callOrReturn as dt, getExtensionField as ct, isNodeEmpty as Nt, isNodeSelection as Rt, findParentNodeClosestToPos as Pt } from "@tiptap/core";
+import { Mark as Q, markPasteRule as xt, markInputRule as At, mergeAttributes as T, Node as L, nodeInputRule as It, ResizableNodeView as St, wrappingInputRule as S, renderNestedMarkdownContent as lt, Extension as C, parseIndentedBlocks as F, isNodeActive as _, isAtStartOfNode as Ht, isAtEndOfNode as Et, getNodeType as ut, getNodeAtPosition as $t, textInputRule as y, callOrReturn as dt, getExtensionField as ct, isNodeEmpty as Nt, isNodeSelection as Rt, findParentNodeClosestToPos as Pt } from "@tiptap/core";
 import { Plugin as H, PluginKey as E, TextSelection as Bt } from "prosemirror-state";
 import { dropCursor as Ot } from "prosemirror-dropcursor";
 import { DecorationSet as B, Decoration as K } from "prosemirror-view";
@@ -83,7 +83,7 @@ import '../../../assets/simple-editor.css';var xe = /(?:^|\s)(==(?!\s+==)((?:[^=
     ];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["mark", k(this.options.HTMLAttributes, t), 0];
+    return ["mark", T(this.options.HTMLAttributes, t), 0];
   },
   renderMarkdown: (t, e) => `==${e.renderChildren(t)}==`,
   parseMarkdown: (t, e) => e.applyMark("highlight", e.parseInline(t.tokens || [])),
@@ -176,7 +176,7 @@ import '../../../assets/simple-editor.css';var xe = /(?:^|\s)(==(?!\s+==)((?:[^=
     ];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["img", k(this.options.HTMLAttributes, t)];
+    return ["img", T(this.options.HTMLAttributes, t)];
   },
   parseMarkdown: (t, e) => e.createNode("image", {
     src: t.href,
@@ -194,14 +194,14 @@ import '../../../assets/simple-editor.css';var xe = /(?:^|\s)(==(?!\s+==)((?:[^=
     const { directions: t, minWidth: e, minHeight: r, alwaysPreserveAspectRatio: n } = this.options.resize;
     return ({ node: s, getPos: i, HTMLAttributes: a }) => {
       const o = document.createElement("img");
-      Object.entries(a).forEach(([d, u]) => {
-        if (u != null)
-          switch (d) {
+      Object.entries(a).forEach(([u, d]) => {
+        if (d != null)
+          switch (u) {
             case "width":
             case "height":
               break;
             default:
-              o.setAttribute(d, u);
+              o.setAttribute(u, d);
               break;
           }
       }), o.src = a.src;
@@ -209,17 +209,17 @@ import '../../../assets/simple-editor.css';var xe = /(?:^|\s)(==(?!\s+==)((?:[^=
         element: o,
         node: s,
         getPos: i,
-        onResize: (d, u) => {
-          o.style.width = `${d}px`, o.style.height = `${u}px`;
+        onResize: (u, d) => {
+          o.style.width = `${u}px`, o.style.height = `${d}px`;
         },
-        onCommit: (d, u) => {
-          const h = i();
-          h !== void 0 && this.editor.chain().setNodeSelection(h).updateAttributes(this.name, {
-            width: d,
-            height: u
+        onCommit: (u, d) => {
+          const f = i();
+          f !== void 0 && this.editor.chain().setNodeSelection(f).updateAttributes(this.name, {
+            width: u,
+            height: d
           }).run();
         },
-        onUpdate: (d, u, h) => d.type === s.type,
+        onUpdate: (u, d, f) => u.type === s.type,
         options: {
           directions: t,
           min: {
@@ -275,7 +275,7 @@ import '../../../assets/simple-editor.css';var xe = /(?:^|\s)(==(?!\s+==)((?:[^=
     return [{ tag: "ul" }];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["ul", k(this.options.HTMLAttributes, t), 0];
+    return ["ul", T(this.options.HTMLAttributes, t), 0];
   },
   markdownTokenName: "list",
   parseMarkdown: (t, e) => t.type !== "list" || t.ordered ? [] : {
@@ -330,7 +330,7 @@ import '../../../assets/simple-editor.css';var xe = /(?:^|\s)(==(?!\s+==)((?:[^=
     ];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["li", k(this.options.HTMLAttributes, t), 0];
+    return ["li", T(this.options.HTMLAttributes, t), 0];
   },
   markdownTokenName: "list_item",
   parseMarkdown: (t, e) => {
@@ -425,14 +425,14 @@ var $ = (t, e) => {
     return !1;
   if (!_(t.state, e) && ht(t.state, e, r)) {
     const { $anchor: o } = t.state.selection, c = t.state.doc.resolve(o.before() - 1), l = [];
-    c.node().descendants((h, m) => {
-      h.type.name === e && l.push({ node: h, pos: m });
+    c.node().descendants((f, b) => {
+      f.type.name === e && l.push({ node: f, pos: b });
     });
-    const d = l.at(-1);
-    if (!d)
+    const u = l.at(-1);
+    if (!u)
       return !1;
-    const u = t.state.doc.resolve(c.start() + d.pos + 1);
-    return t.chain().cut({ from: o.start() - 1, to: o.end() + 1 }, u.end()).joinForward().run();
+    const d = t.state.doc.resolve(c.start() + u.pos + 1);
+    return t.chain().cut({ from: o.start() - 1, to: o.end() + 1 }, d.end()).joinForward().run();
   }
   if (!_(t.state, e) || !Ht(t.state))
     return !1;
@@ -509,28 +509,28 @@ function ze(t) {
     if (!i)
       break;
     const [, a, o, c] = i, l = a.length;
-    let d = c, u = r + 1;
-    const h = [s];
-    for (; u < t.length; ) {
-      const m = t[u];
-      if (m.match(et))
+    let u = c, d = r + 1;
+    const f = [s];
+    for (; d < t.length; ) {
+      const b = t[d];
+      if (b.match(et))
         break;
-      if (m.trim() === "")
-        h.push(m), d += `
-`, u += 1;
-      else if (m.match(_e))
-        h.push(m), d += `
-${m.slice(l + 2)}`, u += 1;
+      if (b.trim() === "")
+        f.push(b), u += `
+`, d += 1;
+      else if (b.match(_e))
+        f.push(b), u += `
+${b.slice(l + 2)}`, d += 1;
       else
         break;
     }
     e.push({
       indent: l,
       number: parseInt(o, 10),
-      content: d.trim(),
-      raw: h.join(`
+      content: u.trim(),
+      raw: f.join(`
 `)
-    }), n = u, r = u;
+    }), n = d, r = d;
   }
   return [e, n];
 }
@@ -548,24 +548,24 @@ function yt(t, e, r) {
         raw: c,
         tokens: r.inlineTokens(c)
       });
-      const d = o.slice(1).join(`
+      const u = o.slice(1).join(`
 `).trim();
-      if (d) {
-        const m = r.blockTokens(d);
-        l.push(...m);
+      if (u) {
+        const b = r.blockTokens(u);
+        l.push(...b);
       }
-      let u = i + 1;
-      const h = [];
-      for (; u < t.length && t[u].indent > e; )
-        h.push(t[u]), u += 1;
-      if (h.length > 0) {
-        const m = Math.min(...h.map((b) => b.indent)), f = yt(h, m, r);
+      let d = i + 1;
+      const f = [];
+      for (; d < t.length && t[d].indent > e; )
+        f.push(t[d]), d += 1;
+      if (f.length > 0) {
+        const b = Math.min(...f.map((g) => g.indent)), h = yt(f, b, r);
         l.push({
           type: "list",
           ordered: !0,
-          start: h[0].number,
-          items: f,
-          raw: h.map((b) => b.raw).join(`
+          start: f[0].number,
+          items: h,
+          raw: f.map((g) => g.raw).join(`
 `)
         });
       }
@@ -573,7 +573,7 @@ function yt(t, e, r) {
         type: "list_item",
         raw: a.raw,
         tokens: l
-      }), i = u;
+      }), i = d;
     } else
       i += 1;
   }
@@ -638,7 +638,7 @@ var je = "listItem", rt = "textStyle", nt = /^(\d+)\.\s$/, Qe = L.create({
   },
   renderHTML({ HTMLAttributes: t }) {
     const { start: e, ...r } = t;
-    return e === 1 ? ["ol", k(this.options.HTMLAttributes, r), 0] : ["ol", k(this.options.HTMLAttributes, t), 0];
+    return e === 1 ? ["ol", T(this.options.HTMLAttributes, r), 0] : ["ol", T(this.options.HTMLAttributes, t), 0];
   },
   markdownTokenName: "list",
   parseMarkdown: (t, e) => {
@@ -750,7 +750,7 @@ var je = "listItem", rt = "textStyle", nt = /^(\d+)\.\s$/, Qe = L.create({
   renderHTML({ node: t, HTMLAttributes: e }) {
     return [
       "li",
-      k(this.options.HTMLAttributes, e, {
+      T(this.options.HTMLAttributes, e, {
         "data-type": this.name
       }),
       [
@@ -792,34 +792,34 @@ var je = "listItem", rt = "textStyle", nt = /^(\d+)\.\s$/, Qe = L.create({
   },
   addNodeView() {
     return ({ node: t, HTMLAttributes: e, getPos: r, editor: n }) => {
-      const s = document.createElement("li"), i = document.createElement("label"), a = document.createElement("span"), o = document.createElement("input"), c = document.createElement("div"), l = (d) => {
-        var u, h;
-        o.ariaLabel = ((h = (u = this.options.a11y) == null ? void 0 : u.checkboxLabel) == null ? void 0 : h.call(u, d, o.checked)) || `Task item checkbox for ${d.textContent || "empty task item"}`;
+      const s = document.createElement("li"), i = document.createElement("label"), a = document.createElement("span"), o = document.createElement("input"), c = document.createElement("div"), l = (u) => {
+        var d, f;
+        o.ariaLabel = ((f = (d = this.options.a11y) == null ? void 0 : d.checkboxLabel) == null ? void 0 : f.call(d, u, o.checked)) || `Task item checkbox for ${u.textContent || "empty task item"}`;
       };
-      return l(t), i.contentEditable = "false", o.type = "checkbox", o.addEventListener("mousedown", (d) => d.preventDefault()), o.addEventListener("change", (d) => {
+      return l(t), i.contentEditable = "false", o.type = "checkbox", o.addEventListener("mousedown", (u) => u.preventDefault()), o.addEventListener("change", (u) => {
         if (!n.isEditable && !this.options.onReadOnlyChecked) {
           o.checked = !o.checked;
           return;
         }
-        const { checked: u } = d.target;
-        n.isEditable && typeof r == "function" && n.chain().focus(void 0, { scrollIntoView: !1 }).command(({ tr: h }) => {
-          const m = r();
-          if (typeof m != "number")
+        const { checked: d } = u.target;
+        n.isEditable && typeof r == "function" && n.chain().focus(void 0, { scrollIntoView: !1 }).command(({ tr: f }) => {
+          const b = r();
+          if (typeof b != "number")
             return !1;
-          const f = h.doc.nodeAt(m);
-          return h.setNodeMarkup(m, void 0, {
-            ...f?.attrs,
-            checked: u
+          const h = f.doc.nodeAt(b);
+          return f.setNodeMarkup(b, void 0, {
+            ...h?.attrs,
+            checked: d
           }), !0;
-        }).run(), !n.isEditable && this.options.onReadOnlyChecked && (this.options.onReadOnlyChecked(t, u) || (o.checked = !o.checked));
-      }), Object.entries(this.options.HTMLAttributes).forEach(([d, u]) => {
-        s.setAttribute(d, u);
-      }), s.dataset.checked = t.attrs.checked, o.checked = t.attrs.checked, i.append(o, a), s.append(i, c), Object.entries(e).forEach(([d, u]) => {
-        s.setAttribute(d, u);
+        }).run(), !n.isEditable && this.options.onReadOnlyChecked && (this.options.onReadOnlyChecked(t, d) || (o.checked = !o.checked));
+      }), Object.entries(this.options.HTMLAttributes).forEach(([u, d]) => {
+        s.setAttribute(u, d);
+      }), s.dataset.checked = t.attrs.checked, o.checked = t.attrs.checked, i.append(o, a), s.append(i, c), Object.entries(e).forEach(([u, d]) => {
+        s.setAttribute(u, d);
       }), {
         dom: s,
         contentDOM: c,
-        update: (d) => d.type !== this.type ? !1 : (s.dataset.checked = d.attrs.checked, o.checked = d.attrs.checked, l(d), !0)
+        update: (u) => u.type !== this.type ? !1 : (s.dataset.checked = u.attrs.checked, o.checked = u.attrs.checked, l(u), !0)
       };
     };
   },
@@ -855,7 +855,7 @@ var je = "listItem", rt = "textStyle", nt = /^(\d+)\.\s$/, Qe = L.create({
     ];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["ul", k(this.options.HTMLAttributes, t, { "data-type": this.name }), 0];
+    return ["ul", T(this.options.HTMLAttributes, t, { "data-type": this.name }), 0];
   },
   parseMarkdown: (t, e) => e.createNode("taskList", {}, e.parseChildren(t.items || [])),
   renderMarkdown: (t, e) => t.content ? e.renderChildren(t.content, `
@@ -975,7 +975,7 @@ var Ve = Q.create({
     ];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["sub", k(this.options.HTMLAttributes, t), 0];
+    return ["sub", T(this.options.HTMLAttributes, t), 0];
   },
   addCommands() {
     return {
@@ -1010,7 +1010,7 @@ var Ve = Q.create({
     ];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["sup", k(this.options.HTMLAttributes, t), 0];
+    return ["sup", T(this.options.HTMLAttributes, t), 0];
   },
   addCommands() {
     return {
@@ -1226,8 +1226,8 @@ C.create({
             return !0;
           if (s > n && i > n && i > s || !e.getMeta("paste"))
             return !1;
-          const o = e.selection.$head.pos, c = i - n, l = o - c, d = o;
-          return e.deleteRange(l, d), !(this.storage.characters({ node: e.doc }) > n);
+          const o = e.selection.$head.pos, c = i - n, l = o - c, u = o;
+          return e.deleteRange(l, u), !(this.storage.characters({ node: e.doc }) > n);
         }
       })
     ];
@@ -1331,10 +1331,10 @@ var br = C.create({
             return t.descendants((a, o) => {
               const c = n >= o && n <= o + a.nodeSize, l = !a.isLeaf && Nt(a);
               if ((c || !this.options.showOnlyCurrent) && l) {
-                const d = [this.options.emptyNodeClass];
-                i && d.push(this.options.emptyEditorClass);
-                const u = K.node(o, o + a.nodeSize, {
-                  class: d.join(" "),
+                const u = [this.options.emptyNodeClass];
+                i && u.push(this.options.emptyEditorClass);
+                const d = K.node(o, o + a.nodeSize, {
+                  class: u.join(" "),
                   "data-placeholder": typeof this.options.placeholder == "function" ? this.options.placeholder({
                     editor: this.editor,
                     node: a,
@@ -1342,7 +1342,7 @@ var br = C.create({
                     hasAnchor: c
                   }) : this.options.placeholder
                 });
-                s.push(u);
+                s.push(d);
               }
               return this.options.includeChildren;
             }), B.create(t, s);
@@ -1394,9 +1394,9 @@ C.create({
       new H({
         key: e,
         appendTransaction: (s, i, a) => {
-          const { doc: o, tr: c, schema: l } = a, d = e.getState(a), u = o.content.size, h = l.nodes[r];
-          if (d)
-            return c.insert(u, h.create());
+          const { doc: o, tr: c, schema: l } = a, u = e.getState(a), d = o.content.size, f = l.nodes[r];
+          if (u)
+            return c.insert(d, f.create());
         },
         state: {
           init: (s, i) => {
@@ -1481,7 +1481,7 @@ var kr = L.create({
     return [{ tag: "td" }];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["td", k(this.options.HTMLAttributes, t), 0];
+    return ["td", T(this.options.HTMLAttributes, t), 0];
   }
 }), Tr = L.create({
   name: "tableHeader",
@@ -1514,7 +1514,7 @@ var kr = L.create({
     return [{ tag: "th" }];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["th", k(this.options.HTMLAttributes, t), 0];
+    return ["th", T(this.options.HTMLAttributes, t), 0];
   }
 }), Cr = L.create({
   name: "tableRow",
@@ -1529,7 +1529,7 @@ var kr = L.create({
     return [{ tag: "tr" }];
   },
   renderHTML({ HTMLAttributes: t }) {
-    return ["tr", k(this.options.HTMLAttributes, t), 0];
+    return ["tr", T(this.options.HTMLAttributes, t), 0];
   }
 });
 function j(t, e) {
@@ -1538,30 +1538,30 @@ function j(t, e) {
 function it(t, e, r, n, s, i) {
   var a;
   let o = 0, c = !0, l = e.firstChild;
-  const d = t.firstChild;
-  if (d !== null)
-    for (let h = 0, m = 0; h < d.childCount; h += 1) {
-      const { colspan: f, colwidth: b } = d.child(h).attrs;
-      for (let g = 0; g < f; g += 1, m += 1) {
-        const T = s === m ? i : b && b[g], v = T ? `${T}px` : "";
-        if (o += T || n, T || (c = !1), l) {
+  const u = t.firstChild;
+  if (u !== null)
+    for (let f = 0, b = 0; f < u.childCount; f += 1) {
+      const { colspan: h, colwidth: g } = u.child(f).attrs;
+      for (let m = 0; m < h; m += 1, b += 1) {
+        const k = s === b ? i : g && g[m], v = k ? `${k}px` : "";
+        if (o += k || n, k || (c = !1), l) {
           if (l.style.width !== v) {
-            const [I, N] = j(n, T);
+            const [I, N] = j(n, k);
             l.style.setProperty(I, N);
           }
           l = l.nextSibling;
         } else {
-          const I = document.createElement("col"), [N, O] = j(n, T);
+          const I = document.createElement("col"), [N, O] = j(n, k);
           I.style.setProperty(N, O), e.appendChild(I);
         }
       }
     }
   for (; l; ) {
-    const h = l.nextSibling;
-    (a = l.parentNode) == null || a.removeChild(l), l = h;
+    const f = l.nextSibling;
+    (a = l.parentNode) == null || a.removeChild(l), l = f;
   }
-  const u = t.attrs.style && typeof t.attrs.style == "string" && /\bwidth\s*:/i.test(t.attrs.style);
-  c && !u ? (r.style.width = `${o}px`, r.style.minWidth = "") : (r.style.width = "", r.style.minWidth = `${o}px`);
+  const d = t.attrs.style && typeof t.attrs.style == "string" && /\bwidth\s*:/i.test(t.attrs.style);
+  c && !d ? (r.style.width = `${o}px`, r.style.minWidth = "") : (r.style.width = "", r.style.minWidth = `${o}px`);
 }
 var Lr = class {
   constructor(t, e) {
@@ -1580,13 +1580,13 @@ function wr(t, e, r, n) {
   const a = [], o = t.firstChild;
   if (!o)
     return {};
-  for (let u = 0, h = 0; u < o.childCount; u += 1) {
-    const { colspan: m, colwidth: f } = o.child(u).attrs;
-    for (let b = 0; b < m; b += 1, h += 1) {
-      const g = r === h ? n : f && f[b];
-      s += g || e, g || (i = !1);
-      const [T, v] = j(e, g);
-      a.push(["col", { style: `${T}: ${v}` }]);
+  for (let d = 0, f = 0; d < o.childCount; d += 1) {
+    const { colspan: b, colwidth: h } = o.child(d).attrs;
+    for (let g = 0; g < b; g += 1, f += 1) {
+      const m = r === f ? n : h && h[g];
+      s += m || e, m || (i = !1);
+      const [k, v] = j(e, m);
+      a.push(["col", { style: `${k}: ${v}` }]);
     }
   }
   const c = i ? `${s}px` : "", l = i ? "" : `${s}px`;
@@ -1607,10 +1607,10 @@ function vr(t) {
 function Mr(t, e, r, n, s) {
   const i = vr(t), a = [], o = [];
   for (let l = 0; l < r; l += 1) {
-    const d = ot(i.cell);
-    if (d && o.push(d), n) {
-      const u = ot(i.header_cell);
-      u && a.push(u);
+    const u = ot(i.cell);
+    if (u && o.push(u), n) {
+      const d = ot(i.header_cell);
+      d && a.push(d);
     }
   }
   const c = [];
@@ -1642,36 +1642,36 @@ function Sr(t, e, r = {}) {
   if (!t || !t.content || t.content.length === 0)
     return "";
   const i = [];
-  t.content.forEach((f) => {
-    const b = [];
-    f.content && f.content.forEach((g) => {
-      let T = "";
-      g.content && Array.isArray(g.content) && g.content.length > 1 ? T = g.content.map((O) => e.renderChildren(O)).join(s) : T = g.content ? e.renderChildren(g.content) : "";
-      const v = Ir(T), I = g.type === "tableHeader";
-      b.push({ text: v, isHeader: I });
-    }), i.push(b);
+  t.content.forEach((h) => {
+    const g = [];
+    h.content && h.content.forEach((m) => {
+      let k = "";
+      m.content && Array.isArray(m.content) && m.content.length > 1 ? k = m.content.map((O) => e.renderChildren(O)).join(s) : k = m.content ? e.renderChildren(m.content) : "";
+      const v = Ir(k), I = m.type === "tableHeader";
+      g.push({ text: v, isHeader: I });
+    }), i.push(g);
   });
-  const a = i.reduce((f, b) => Math.max(f, b.length), 0);
+  const a = i.reduce((h, g) => Math.max(h, g.length), 0);
   if (a === 0)
     return "";
   const o = new Array(a).fill(0);
-  i.forEach((f) => {
-    var b;
-    for (let g = 0; g < a; g += 1) {
-      const v = (((b = f[g]) == null ? void 0 : b.text) || "").length;
-      v > o[g] && (o[g] = v), o[g] < 3 && (o[g] = 3);
+  i.forEach((h) => {
+    var g;
+    for (let m = 0; m < a; m += 1) {
+      const v = (((g = h[m]) == null ? void 0 : g.text) || "").length;
+      v > o[m] && (o[m] = v), o[m] < 3 && (o[m] = 3);
     }
   });
-  const c = (f, b) => f + " ".repeat(Math.max(0, b - f.length)), l = i[0], d = l.some((f) => f.isHeader);
-  let u = `
+  const c = (h, g) => h + " ".repeat(Math.max(0, g - h.length)), l = i[0], u = l.some((h) => h.isHeader);
+  let d = `
 `;
-  const h = new Array(a).fill(0).map((f, b) => d && l[b] && l[b].text || "");
-  return u += `| ${h.map((f, b) => c(f, o[b])).join(" | ")} |
-`, u += `| ${o.map((f) => "-".repeat(Math.max(3, f))).join(" | ")} |
-`, (d ? i.slice(1) : i).forEach((f) => {
-    u += `| ${new Array(a).fill(0).map((b, g) => c(f[g] && f[g].text || "", o[g])).join(" | ")} |
+  const f = new Array(a).fill(0).map((h, g) => u && l[g] && l[g].text || "");
+  return d += `| ${f.map((h, g) => c(h, o[g])).join(" | ")} |
+`, d += `| ${o.map((h) => "-".repeat(Math.max(3, h))).join(" | ")} |
+`, (u ? i.slice(1) : i).forEach((h) => {
+    d += `| ${new Array(a).fill(0).map((g, m) => c(h[m] && h[m].text || "", o[m])).join(" | ")} |
 `;
-  }), u;
+  }), d;
 }
 var Hr = Sr, Er = L.create({
   name: "table",
@@ -1703,7 +1703,7 @@ var Hr = Sr, Er = L.create({
     }
     const o = [
       "table",
-      k(this.options.HTMLAttributes, e, {
+      T(this.options.HTMLAttributes, e, {
         style: a()
       }),
       r,
@@ -1874,13 +1874,19 @@ function _n({
   content: e,
   onContentChange: r,
   placeholder: n = "",
-  ref: s
+  ref: s,
+  autofocus: i,
+  onFocus: a,
+  onBlur: o
 }) {
-  const i = de(), { height: a } = ce(), [o, c] = vt(
+  const c = de(), { height: l } = ce(), [u, d] = vt(
     "main"
-  ), l = q(null), d = q(!1), u = Ct({
+  ), f = q(null), b = q(!1), h = Ct({
     immediatelyRender: !1,
     shouldRerenderOnTransaction: !1,
+    autofocus: i,
+    onFocus: a,
+    onBlur: o,
     editorProps: {
       attributes: {
         autocomplete: "off",
@@ -1926,49 +1932,49 @@ function _n({
     ],
     content: e,
     onUpdate: ({ editor: m }) => {
-      if (!d.current && r) {
-        const f = m.getHTML();
-        r(f);
+      if (!b.current && r) {
+        const k = m.getHTML();
+        r(k);
       }
     }
-  }), h = ue({
-    editor: u,
-    overlayHeight: l.current?.getBoundingClientRect().height ?? 0
+  }), g = ue({
+    editor: h,
+    overlayHeight: f.current?.getBoundingClientRect().height ?? 0
   });
   return D(() => {
-    !i && o !== "main" && c("main");
-  }, [i, o]), D(() => {
-    u && e !== void 0 && u.getHTML() !== e && (d.current = !0, u.commands.setContent(e, { emitUpdate: !1 }), d.current = !1);
-  }, [e, u]), D(() => {
+    !c && u !== "main" && d("main");
+  }, [c, u]), D(() => {
+    h && e !== void 0 && h.getHTML() !== e && (b.current = !0, h.commands.setContent(e, { emitUpdate: !1 }), b.current = !1);
+  }, [e, h]), D(() => {
     document.documentElement.classList.toggle("dark", t === "dark");
   }, [t]), Mt(
     s,
     () => ({
-      getEditor: () => u
+      getEditor: () => h
     }),
-    [u]
-  ), u ? /* @__PURE__ */ p("div", { className: "simple-editor-wrapper", children: /* @__PURE__ */ w(Lt.Provider, { value: { editor: u }, children: [
+    [h]
+  ), h ? /* @__PURE__ */ p("div", { className: "simple-editor-wrapper", children: /* @__PURE__ */ w(Lt.Provider, { value: { editor: h }, children: [
     /* @__PURE__ */ p(
       Kt,
       {
-        ref: l,
+        ref: f,
         style: {
-          ...i ? {
-            bottom: `calc(100% - ${a - h.y}px)`
+          ...c ? {
+            bottom: `calc(100% - ${l - g.y}px)`
           } : {}
         },
-        children: o === "main" ? /* @__PURE__ */ p(
+        children: u === "main" ? /* @__PURE__ */ p(
           Nr,
           {
-            onHighlighterClick: () => c("highlighter"),
-            onLinkClick: () => c("link"),
-            isMobile: i
+            onHighlighterClick: () => d("highlighter"),
+            onLinkClick: () => d("link"),
+            isMobile: c
           }
         ) : /* @__PURE__ */ p(
           Rr,
           {
-            type: o === "highlighter" ? "highlighter" : "link",
-            onBack: () => c("main")
+            type: u === "highlighter" ? "highlighter" : "link",
+            onBack: () => d("main")
           }
         )
       }
@@ -1977,7 +1983,7 @@ function _n({
     /* @__PURE__ */ p(
       wt,
       {
-        editor: u,
+        editor: h,
         role: "presentation",
         className: "simple-editor-content"
       }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@dooherceg/tiptap-controlled-editor-with-table",
   "private": false,
   "baseUrl": "./",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",