tiptap-editor-codeveda 0.1.9 → 0.1.11

package/dist/index.d.ts

@@ -17,9 +17,10 @@ declare interface TiptapProps {
     }) => void;
 }
 
-export declare const TiptapViewer: ({ styles, editorContent, }: {
+export declare const TiptapViewer: ({ styles, editorContent, immediatelyRender, }: {
     styles?: string;
     editorContent?: string;
+    immediatelyRender?: boolean;
 }) => JSX.Element | null;
 
 export declare function useEditorContent(initial?: EditorContentPayload): {

package/dist/tiptap-editor-codeveda.es.js

@@ -8502,9 +8502,10 @@ const Ks = ({ editor: t, isReadOnly: e }) => {
   ] }) : null;
 }, ka = ({
   styles: t,
-  editorContent: e
+  editorContent: e,
+  immediatelyRender: n = !1
 }) => {
-  const [, n] = U({}), [r] = U(!0), o = yn({
+  const [, r] = U({}), [o] = U(!0), i = yn({
     extensions: [
       jn,
       Dn,
@@ -8546,22 +8547,23 @@ const Ks = ({ editor: t, isReadOnly: e }) => {
       })
     ],
     content: e || "<h1>Nothing on Canvas :(</h1>",
-    editable: !r,
+    editable: !o,
+    immediatelyRender: n,
     editorProps: {
       attributes: {
         class: `prose prose-sm sm:prose lg:prose-lg xl:prose-2xl mx-auto focus:outline-none min-h-[400px] p-4 ${t}`
       }
     },
     onUpdate: () => {
-      n({});
+      r({});
     },
     onSelectionUpdate: () => {
-      n({});
+      r({});
     }
   });
   return ge(() => {
-    o && o.setEditable(!r);
-  }, [o, r]), o ? /* @__PURE__ */ c.jsx("div", { className: "w-full max-w-6xl mx-auto p-4", children: /* @__PURE__ */ c.jsx(vn, { editor: o, className: "tiptap-editor" }) }) : null;
+    i && i.setEditable(!o);
+  }, [i, o]), i ? /* @__PURE__ */ c.jsx("div", { className: "w-full max-w-6xl mx-auto p-4", children: /* @__PURE__ */ c.jsx(vn, { editor: i, className: "tiptap-editor" }) }) : null;
 };
 function Ca(t) {
   const [e, n] = U(

package/dist/tiptap-editor-codeveda.umd.js

@@ -34,4 +34,4 @@ React keys must be passed directly to JSX without using spread:
         <li>And much more...</li>
       </ul>
       <p>Place your cursor at an empty line to see the floating menu, or select text to see formatting options in the bubble menu.</p>
-    `,editable:!l,editorProps:{attributes:{class:"prose prose-sm sm:prose lg:prose-lg xl:prose-2xl mx-auto focus:outline-none min-h-[400px] p-4"}},onUpdate:()=>{n?.({html:p.getHTML(),json:p.getJSON()}),a({})},onSelectionUpdate:()=>{n?.({html:p.getHTML(),json:p.getJSON()}),a({})}});k.useEffect(()=>{p&&p.setEditable(!l)},[p,l]),k.useEffect(()=>{if(!p)return;const v=()=>{if(p.isActive("table")&&!l){const{from:N}=p.state.selection;let C=null;const M=p.view.domAtPos(N);if(M.node&&M.node.parentElement){let T=M.node.parentElement;for(;T&&T!==p.view.dom;){if(T.tagName==="TABLE"){C=T;break}T=T.parentElement}}if(C){const T=C.getBoundingClientRect(),L=p.view.dom.getBoundingClientRect();w({top:T.top-L.top-60,left:T.left-L.left,show:!0})}}else w(N=>({...N,show:!1}))},x=()=>{v()};return p.on("selectionUpdate",x),p.on("update",x),()=>{p.off("selectionUpdate",x),p.off("update",x)}},[p]),k.useEffect(()=>{const v=x=>{x.target.closest(".image-input-container")||s(!1)};return o&&document.addEventListener("mousedown",v),()=>{document.removeEventListener("mousedown",v)}},[o]);const E=k.useCallback(async()=>{const v=document.createElement("input");v.type="file",v.accept="image/*",v.onchange=async x=>{const N=x.target.files?.[0];if(N&&t)try{f(!0);const C=await t(N);C&&p?.chain().focus().setImage({src:C}).run()}catch(C){console.error("Failed to upload image:",C),alert("Failed to upload image. Please try again.")}finally{f(!1)}},v.click()},[p,t]),y=k.useCallback(()=>{r.trim()&&(p?.chain().focus().setImage({src:r.trim()}).run(),i(""),s(!1))},[p,r]),S=k.useCallback(async()=>{const v=document.createElement("input");v.type="file",v.accept="video/*",v.onchange=async x=>{const N=x.target.files?.[0];if(N&&e)try{m(!0);const C=await e(N);if(C){console.log("Attempting to insert video:",{src:C,type:N.type,title:N.name});try{const M=p?.chain().focus().setVideo({src:C,type:N.type,title:N.name}).run();console.log("Video insertion result:",M)}catch(M){throw console.error("Error inserting video into editor:",M),M}}}catch(C){console.error("Failed to upload video:",C),console.error("Error details:",{message:C instanceof Error?C.message:"Unknown error",stack:C instanceof Error?C.stack:"No stack trace"}),alert(`Failed to upload video: ${C instanceof Error?C.message:"Unknown error"}`)}finally{m(!1)}else if(N&&!e){const C=new FileReader;C.onload=M=>{const T=M.target?.result;console.log("Attempting to insert base64 video:",{src:T.substring(0,100)+"...",type:N.type,title:N.name});try{const L=p?.chain().focus().setVideo({src:T,type:N.type,title:N.name}).run();console.log("Base64 video insertion result:",L)}catch(L){console.error("Error inserting base64 video into editor:",L)}},C.readAsDataURL(N)}},v.click()},[p,e]),R=k.useCallback(()=>{if(p)return Zo(p)},[p]);return p?c.jsxs("div",{className:"w-full max-w-6xl mx-auto p-4",children:[p&&c.jsx(Go,{editor:p}),c.jsx(Yo,{editor:p,isReadOnly:l,setIsReadOnly:d,onLogContent:R}),c.jsx(ki,{editor:p,isReadOnly:l,onImageUpload:E,onVideoUpload:S,isImageUploading:u,isVideoUploading:h,showImageInput:o,setShowImageInput:s,imageUrl:r,setImageUrl:i,handleImageUrlInsert:y,imageUploadFunction:t}),c.jsxs("div",{className:"relative border border-gray-300 border-t-1 rounded-t-lg rounded-b-lg min-h-[400px]",children:[c.jsx(G.EditorContent,{editor:p,className:"tiptap-editor"}),c.jsx(Wo,{editor:p,isReadOnly:l,onImageClick:()=>s(!o)}),c.jsx(qo,{editor:p,isReadOnly:l}),c.jsx(Ko,{editor:p,isReadOnly:l,position:b})]})]}):null},Qo=({styles:t,editorContent:e})=>{const[,n]=k.useState({}),[r]=k.useState(!0),i=G.useEditor({extensions:[Kt,Gt,Ut,Ft,Ht,Yt.configure({inline:!1,allowBase64:!0}),Zt.configure({openOnClick:!1,autolink:!0,defaultProtocol:"https"}),pn,mn,Xt,Qt.configure({types:["textStyle"]}),en.configure({multicolor:!0}),hn,gn,bn,wn,xn,yn,vn,En,Sn.configure({inline:!1,allowBase64:!0,HTMLAttributes:{class:"max-w-full h-auto rounded-lg shadow-sm"}})],content:e||"<h1>Nothing on Canvas :(</h1>",editable:!r,editorProps:{attributes:{class:`prose prose-sm sm:prose lg:prose-lg xl:prose-2xl mx-auto focus:outline-none min-h-[400px] p-4 ${t}`}},onUpdate:()=>{n({})},onSelectionUpdate:()=>{n({})}});return k.useEffect(()=>{i&&i.setEditable(!r)},[i,r]),i?c.jsx("div",{className:"w-full max-w-6xl mx-auto p-4",children:c.jsx(G.EditorContent,{editor:i,className:"tiptap-editor"})}):null};function es(t){const[e,n]=k.useState(t??{html:"",json:null}),r=k.useCallback(i=>{n(i)},[]);return{content:e,html:e.html,json:e.json,setContent:r}}j.TiptapEditor=Xo,j.TiptapViewer=Qo,j.useEditorContent=es,Object.defineProperty(j,Symbol.toStringTag,{value:"Module"})}));
+    `,editable:!l,editorProps:{attributes:{class:"prose prose-sm sm:prose lg:prose-lg xl:prose-2xl mx-auto focus:outline-none min-h-[400px] p-4"}},onUpdate:()=>{n?.({html:p.getHTML(),json:p.getJSON()}),a({})},onSelectionUpdate:()=>{n?.({html:p.getHTML(),json:p.getJSON()}),a({})}});k.useEffect(()=>{p&&p.setEditable(!l)},[p,l]),k.useEffect(()=>{if(!p)return;const v=()=>{if(p.isActive("table")&&!l){const{from:N}=p.state.selection;let C=null;const M=p.view.domAtPos(N);if(M.node&&M.node.parentElement){let T=M.node.parentElement;for(;T&&T!==p.view.dom;){if(T.tagName==="TABLE"){C=T;break}T=T.parentElement}}if(C){const T=C.getBoundingClientRect(),L=p.view.dom.getBoundingClientRect();w({top:T.top-L.top-60,left:T.left-L.left,show:!0})}}else w(N=>({...N,show:!1}))},x=()=>{v()};return p.on("selectionUpdate",x),p.on("update",x),()=>{p.off("selectionUpdate",x),p.off("update",x)}},[p]),k.useEffect(()=>{const v=x=>{x.target.closest(".image-input-container")||s(!1)};return o&&document.addEventListener("mousedown",v),()=>{document.removeEventListener("mousedown",v)}},[o]);const E=k.useCallback(async()=>{const v=document.createElement("input");v.type="file",v.accept="image/*",v.onchange=async x=>{const N=x.target.files?.[0];if(N&&t)try{f(!0);const C=await t(N);C&&p?.chain().focus().setImage({src:C}).run()}catch(C){console.error("Failed to upload image:",C),alert("Failed to upload image. Please try again.")}finally{f(!1)}},v.click()},[p,t]),y=k.useCallback(()=>{r.trim()&&(p?.chain().focus().setImage({src:r.trim()}).run(),i(""),s(!1))},[p,r]),S=k.useCallback(async()=>{const v=document.createElement("input");v.type="file",v.accept="video/*",v.onchange=async x=>{const N=x.target.files?.[0];if(N&&e)try{m(!0);const C=await e(N);if(C){console.log("Attempting to insert video:",{src:C,type:N.type,title:N.name});try{const M=p?.chain().focus().setVideo({src:C,type:N.type,title:N.name}).run();console.log("Video insertion result:",M)}catch(M){throw console.error("Error inserting video into editor:",M),M}}}catch(C){console.error("Failed to upload video:",C),console.error("Error details:",{message:C instanceof Error?C.message:"Unknown error",stack:C instanceof Error?C.stack:"No stack trace"}),alert(`Failed to upload video: ${C instanceof Error?C.message:"Unknown error"}`)}finally{m(!1)}else if(N&&!e){const C=new FileReader;C.onload=M=>{const T=M.target?.result;console.log("Attempting to insert base64 video:",{src:T.substring(0,100)+"...",type:N.type,title:N.name});try{const L=p?.chain().focus().setVideo({src:T,type:N.type,title:N.name}).run();console.log("Base64 video insertion result:",L)}catch(L){console.error("Error inserting base64 video into editor:",L)}},C.readAsDataURL(N)}},v.click()},[p,e]),R=k.useCallback(()=>{if(p)return Zo(p)},[p]);return p?c.jsxs("div",{className:"w-full max-w-6xl mx-auto p-4",children:[p&&c.jsx(Go,{editor:p}),c.jsx(Yo,{editor:p,isReadOnly:l,setIsReadOnly:d,onLogContent:R}),c.jsx(ki,{editor:p,isReadOnly:l,onImageUpload:E,onVideoUpload:S,isImageUploading:u,isVideoUploading:h,showImageInput:o,setShowImageInput:s,imageUrl:r,setImageUrl:i,handleImageUrlInsert:y,imageUploadFunction:t}),c.jsxs("div",{className:"relative border border-gray-300 border-t-1 rounded-t-lg rounded-b-lg min-h-[400px]",children:[c.jsx(G.EditorContent,{editor:p,className:"tiptap-editor"}),c.jsx(Wo,{editor:p,isReadOnly:l,onImageClick:()=>s(!o)}),c.jsx(qo,{editor:p,isReadOnly:l}),c.jsx(Ko,{editor:p,isReadOnly:l,position:b})]})]}):null},Qo=({styles:t,editorContent:e,immediatelyRender:n=!1})=>{const[,r]=k.useState({}),[i]=k.useState(!0),o=G.useEditor({extensions:[Kt,Gt,Ut,Ft,Ht,Yt.configure({inline:!1,allowBase64:!0}),Zt.configure({openOnClick:!1,autolink:!0,defaultProtocol:"https"}),pn,mn,Xt,Qt.configure({types:["textStyle"]}),en.configure({multicolor:!0}),hn,gn,bn,wn,xn,yn,vn,En,Sn.configure({inline:!1,allowBase64:!0,HTMLAttributes:{class:"max-w-full h-auto rounded-lg shadow-sm"}})],content:e||"<h1>Nothing on Canvas :(</h1>",editable:!i,immediatelyRender:n,editorProps:{attributes:{class:`prose prose-sm sm:prose lg:prose-lg xl:prose-2xl mx-auto focus:outline-none min-h-[400px] p-4 ${t}`}},onUpdate:()=>{r({})},onSelectionUpdate:()=>{r({})}});return k.useEffect(()=>{o&&o.setEditable(!i)},[o,i]),o?c.jsx("div",{className:"w-full max-w-6xl mx-auto p-4",children:c.jsx(G.EditorContent,{editor:o,className:"tiptap-editor"})}):null};function es(t){const[e,n]=k.useState(t??{html:"",json:null}),r=k.useCallback(i=>{n(i)},[]);return{content:e,html:e.html,json:e.json,setContent:r}}j.TiptapEditor=Xo,j.TiptapViewer=Qo,j.useEditorContent=es,Object.defineProperty(j,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tiptap-editor-codeveda",
   "private": false,
-  "version": "0.1.9",
+  "version": "0.1.11",
   "type": "module",
   "description": "A powerful, feature-rich WYSIWYG editor built with Tiptap, React, and TypeScript",
   "keywords": [