@cyberyozh/text-editor 0.1.11 → 0.1.13

package/dist/render.mjs

@@ -628,8 +628,9 @@ var BaseFigure = Image.extend({
   isolating: true,
   selectable: false,
   addOptions() {
+    const parentOptions = this.parent?.() || {};
     return {
-      HTMLAttributes: {},
+      ...parentOptions,
       getImageById: void 0,
       onFigureClick: void 0
     };
@@ -1562,9 +1563,8 @@ function getRenderExtensions() {
     BasePromptContent,
     BaseVideo,
     BaseFigure,
-    // Need to update
     TableKit.configure({
-      table: { resizable: false }
+      table: { resizable: false, renderWrapper: true }
     }),
     Mathematics.configure({
       katexOptions: {
@@ -2245,51 +2245,6 @@ var PromptContent = ({ children, isEmpty, placeholder }) => /* @__PURE__ */ jsx6
   }
 ) });
 
-// src/extensions/views/components/table.tsx
-import { useEffect, useRef, useState } from "react";
-import { jsx as jsx67, jsxs as jsxs21 } from "react/jsx-runtime";
-function Table({ children }) {
-  const wrapperRef = useRef(null);
-  const [undefinedColWidth, setUndefinedColWidth] = useState(void 0);
-  let colWidths = [];
-  if (Array.isArray(children) && children.length > 0) {
-    const firstRow = children[0];
-    if (firstRow?.props?.children) {
-      const cells = Array.isArray(firstRow.props.children) ? firstRow.props.children : [firstRow.props.children];
-      colWidths = cells.map((cell) => cell?.props?.node?.attrs?.colwidth?.[0]);
-    }
-  }
-  const definedWidths = colWidths.filter((w) => w !== void 0);
-  const totalDefinedWidth = definedWidths.reduce((total, width) => total + width, 0);
-  const undefinedCount = colWidths.filter((w) => w === void 0).length;
-  useEffect(() => {
-    if (wrapperRef.current && undefinedCount > 0) {
-      const containerWidth = wrapperRef.current.clientWidth;
-      const remainingSpace = containerWidth - totalDefinedWidth - 2;
-      const calculatedWidth = Math.floor(remainingSpace / undefinedCount);
-      setUndefinedColWidth(calculatedWidth > 0 ? calculatedWidth : void 0);
-    }
-  }, [totalDefinedWidth, undefinedCount]);
-  const tableWidth = undefinedCount > 0 && undefinedColWidth ? totalDefinedWidth + undefinedColWidth * undefinedCount + 2 : totalDefinedWidth > 0 ? totalDefinedWidth + 2 : void 0;
-  return /* @__PURE__ */ jsx67(
-    "div",
-    {
-      ref: wrapperRef,
-      className: "tableWrapper",
-      children: /* @__PURE__ */ jsxs21("table", { style: tableWidth ? { width: `${tableWidth}px` } : void 0, children: [
-        colWidths.length > 0 && /* @__PURE__ */ jsx67("colgroup", { children: colWidths.map((width, index) => /* @__PURE__ */ jsx67(
-          "col",
-          {
-            style: width ? { width: `${width}px` } : undefinedColWidth ? { width: `${undefinedColWidth}px` } : void 0
-          },
-          index
-        )) }),
-        /* @__PURE__ */ jsx67("tbody", { children })
-      ] })
-    }
-  );
-}
-
 // src/utils/detect-video-hosting.ts
 var VIDEO_PATTERNS = {
   youtube: /(?:https?:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=|shorts\/)?([a-zA-Z0-9_-]{11})/,
@@ -2362,22 +2317,22 @@ var detectVideoHosting = (src) => {
 };
 
 // src/extensions/views/components/video.tsx
-import { jsx as jsx68, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs21 } from "react/jsx-runtime";
 var Video = ({ src, children }) => {
   const videoInfo = detectVideoHosting(src);
   if (!videoInfo?.embedUrl) {
-    return /* @__PURE__ */ jsxs22("div", { className: "video-node", children: [
-      /* @__PURE__ */ jsx68("div", { className: "video-error", children: /* @__PURE__ */ jsx68("span", { children: "Unsupported or invalid video URL" }) }),
+    return /* @__PURE__ */ jsxs21("div", { className: "video-node", children: [
+      /* @__PURE__ */ jsx67("div", { className: "video-error", children: /* @__PURE__ */ jsx67("span", { children: "Unsupported or invalid video URL" }) }),
       children
     ] });
   }
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs21(
     "div",
     {
       className: "video-node",
       "data-video": "",
       children: [
-        /* @__PURE__ */ jsx68("div", { className: "video-player-wrapper", children: /* @__PURE__ */ jsx68(
+        /* @__PURE__ */ jsx67("div", { className: "video-player-wrapper", children: /* @__PURE__ */ jsx67(
           "iframe",
           {
             className: "video-iframe",
@@ -2394,10 +2349,10 @@ var Video = ({ src, children }) => {
 };
 
 // src/render/static-renderer-config.tsx
-import { jsx as jsx69 } from "react/jsx-runtime";
+import { jsx as jsx68 } from "react/jsx-runtime";
 var getNodeMapping = (getImageById) => ({
   callout({ node, children }) {
-    return /* @__PURE__ */ jsx69(Callout, { ...node.attrs, children });
+    return /* @__PURE__ */ jsx68(Callout, { ...node.attrs, children });
   },
   codeBlock({ node, children }) {
     const language = node.attrs.language || "";
@@ -2421,41 +2376,38 @@ var getNodeMapping = (getImageById) => ({
       console.warn(`Failed to highlight code for language "${language}":`, error);
       highlightedHtml = codeText.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
     }
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx68(
       CodeBlock,
       {
         language,
         isEditable: false,
-        children: /* @__PURE__ */ jsx69("code", { dangerouslySetInnerHTML: { __html: highlightedHtml } })
+        children: /* @__PURE__ */ jsx68("code", { dangerouslySetInnerHTML: { __html: highlightedHtml } })
       }
     );
   },
   customQuote({ children }) {
-    return /* @__PURE__ */ jsx69(CustomQuote, { children });
+    return /* @__PURE__ */ jsx68(CustomQuote, { children });
   },
   customQuoteText({ children }) {
-    return /* @__PURE__ */ jsx69(CustomQuoteText, { children });
+    return /* @__PURE__ */ jsx68(CustomQuoteText, { children });
   },
   customQuoteAuthor({ children }) {
-    return /* @__PURE__ */ jsx69(CustomQuoteAuthor, { children });
+    return /* @__PURE__ */ jsx68(CustomQuoteAuthor, { children });
   },
   customQuoteSign({ children }) {
-    return /* @__PURE__ */ jsx69(CustomQuoteSign, { children });
+    return /* @__PURE__ */ jsx68(CustomQuoteSign, { children });
   },
   promptHeader({ children }) {
-    return /* @__PURE__ */ jsx69(PromptHeader, { children });
+    return /* @__PURE__ */ jsx68(PromptHeader, { children });
   },
   promptContent({ children }) {
-    return /* @__PURE__ */ jsx69(PromptContent, { children });
+    return /* @__PURE__ */ jsx68(PromptContent, { children });
   },
   video({ node }) {
-    return /* @__PURE__ */ jsx69(Video, { src: node.attrs.src });
-  },
-  table({ children }) {
-    return /* @__PURE__ */ jsx69(Table, { children });
+    return /* @__PURE__ */ jsx68(Video, { src: node.attrs.src });
   },
   figure({ node }) {
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx68(
       Figure,
       {
         ...node.attrs,
@@ -2464,7 +2416,7 @@ var getNodeMapping = (getImageById) => ({
     );
   },
   image({ node }) {
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx68(
       Figure,
       {
         ...node.attrs,
@@ -2483,7 +2435,7 @@ var getNodeMapping = (getImageById) => ({
     } catch (error) {
       console.warn("KaTeX rendering error for inline math:", error);
     }
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx68(
       "span",
       {
         className: "react-renderer node-inlineMath",
@@ -2504,7 +2456,7 @@ var getNodeMapping = (getImageById) => ({
     } catch (error) {
       console.warn("KaTeX rendering error for block math:", error);
     }
-    return /* @__PURE__ */ jsx69("div", { className: "react-renderer node-blockMath", children: /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx68("div", { className: "react-renderer node-blockMath", children: /* @__PURE__ */ jsx68(
       "div",
       {
         className: "tiptap-mathematics-render",
@@ -2525,7 +2477,7 @@ var getNodeMapping = (getImageById) => ({
     } catch (error) {
       console.warn("KaTeX rendering error for inline latex:", error);
     }
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx68(
       "span",
       {
         className: "react-renderer node-inlineLatex inline-latex",
@@ -2538,33 +2490,33 @@ var getNodeMapping = (getImageById) => ({
   */
   calloutAlert({ node, children }) {
     const type = node.attrs.type || "info";
-    return /* @__PURE__ */ jsx69(Callout, { type, children });
+    return /* @__PURE__ */ jsx68(Callout, { type, children });
   },
   calloutTip({ node, children }) {
     const type = node.attrs.type || "info";
-    return /* @__PURE__ */ jsx69(Callout, { type, children });
+    return /* @__PURE__ */ jsx68(Callout, { type, children });
   },
   customQuoteV2({ children }) {
-    return /* @__PURE__ */ jsx69(CustomQuote, { children });
+    return /* @__PURE__ */ jsx68(CustomQuote, { children });
   },
   promptV2Header({ children }) {
-    return /* @__PURE__ */ jsx69(PromptHeader, { children });
+    return /* @__PURE__ */ jsx68(PromptHeader, { children });
   },
   promptV2Content({ children }) {
-    return /* @__PURE__ */ jsx69(PromptContent, { children });
+    return /* @__PURE__ */ jsx68(PromptContent, { children });
   }
 });
 var nodeMapping = getNodeMapping();
 var markMapping = {
   "copyable-text"({ children }) {
-    return /* @__PURE__ */ jsx69(CopyableText2, { children });
+    return /* @__PURE__ */ jsx68(CopyableText2, { children });
   }
 };
 
 // src/render/tiptap-render.tsx
 import "highlight.js/styles/github-dark.css";
 import "katex/dist/katex.min.css";
-import { jsx as jsx70 } from "react/jsx-runtime";
+import { jsx as jsx69 } from "react/jsx-runtime";
 function renderTiptapToReact(content, getImageById) {
   let parsedContent;
   try {
@@ -2585,7 +2537,7 @@ function renderTiptapToReact(content, getImageById) {
       markMapping
     }
   });
-  return /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx69(
     "div",
     {
       className: "tiptap",
@@ -2597,7 +2549,39 @@ function renderTiptapToReact(content, getImageById) {
 function TiptapRender({ content, getImageById }) {
   return renderTiptapToReact(content, getImageById);
 }
+
+// src/utils/html-to-tiptap-content.ts
+import { generateJSON } from "@tiptap/core";
+function isJSONContent(value) {
+  return typeof value === "object" && value !== null && "type" in value && typeof value.type === "string";
+}
+function htmlToTiptapContent(content) {
+  if (isJSONContent(content)) {
+    return content;
+  }
+  if (typeof content === "string") {
+    try {
+      const parsed = JSON.parse(content);
+      if (isJSONContent(parsed)) {
+        return parsed;
+      }
+    } catch {
+    }
+  }
+  if (!content || content.trim() === "") {
+    return { type: "doc", content: [{ type: "paragraph" }] };
+  }
+  const sharedExtensions = getSharedExtensions();
+  const extensions = [...sharedExtensions, BaseFigure];
+  try {
+    return generateJSON(content, extensions);
+  } catch (error) {
+    console.error("Failed to convert HTML to Tiptap content:", error);
+    return { type: "doc", content: [{ type: "paragraph" }] };
+  }
+}
 export {
-  TiptapRender
+  TiptapRender,
+  htmlToTiptapContent
 };
 //# sourceMappingURL=render.mjs.map