payload-richtext-tiptap 0.0.57 → 0.0.58

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VideoBlockView.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AACxD,OAAO,KAAkD,MAAM,OAAO,CAAC;AAIvE,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,IAAI,EAAE,IAAI,GAAG;QACX,KAAK,EAAE;YACL,GAAG,EAAE,MAAM,CAAC;YACZ,MAAM,EAAE,MAAM,CAAC;YACf,OAAO,EAAE,MAAM,CAAC;YAChB,WAAW,CAAC,EAAE,MAAM,CAAC;SACtB,CAAC;KACH,CAAC;IACF,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;CAC3D;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,IAAI,EAAE,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG;IACjB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,mBAAmB,sBA4ExD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"VideoBlockView.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AACxD,OAAO,KAAkD,MAAM,OAAO,CAAC;AAIvE,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,IAAI,EAAE,IAAI,GAAG;QACX,KAAK,EAAE;YACL,GAAG,EAAE,MAAM,CAAC;YACZ,MAAM,EAAE,MAAM,CAAC;YACf,OAAO,EAAE,MAAM,CAAC;YAChB,WAAW,CAAC,EAAE,MAAM,CAAC;SACtB,CAAC;KACH,CAAC;IACF,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;CAC3D;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,IAAI,EAAE,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG;IACjB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,mBAAmB,sBAmGxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.js

@@ -39,6 +39,16 @@ export const VideoBlockView = (props)=>{
     ]);
     const videoJsOptions = useMemo(()=>{
         if (playlistContent == undefined) return {};
+        if (playlistContent.items.some((item)=>item.type === "application/x-mpegURL" || item.type === "application/vnd.apple.mpegurl")) {
+            return {
+                sources: playlistContent.items.filter((item)=>item.type === "application/x-mpegURL" || item.type === "application/vnd.apple.mpegurl").map((item)=>({
+                        src: item.src,
+                        type: item.type,
+                        label: item.label
+                    })),
+                poster: playlistContent.poster
+            };
+        }
         return {
             sources: playlistContent.items.map((item)=>({
                     src: item.src,

package/dist/src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.tsx"],"sourcesContent":["import { Node } from \"@tiptap/pm/model\";\nimport { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport React, { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../../lib/utils/index.js\";\nimport VideoPlayer from \"./videojs/VideoPlayer.js\";\n\ninterface VideoBlockViewProps {\n  editor: Editor;\n  getPos: () => number;\n  node: Node & {\n    attrs: {\n      src: string;\n      poster: string;\n      assetId: string;\n      playlistUrl?: string;\n    };\n  };\n  updateAttributes: (attrs: Record<string, string>) => void;\n}\n\nexport type Playlist = {\n  id: string;\n  title: string;\n  description: string;\n  poster: string;\n  items: Item[];\n};\n\nexport type Item = {\n  src: string;\n  type: string;\n  label: string;\n  width: number;\n  height: number;\n};\n\nexport const VideoBlockView = (props: VideoBlockViewProps) => {\n  const { editor, getPos, node } = props;\n  const videoWrapperRef = useRef<HTMLDivElement>(null);\n  const { src, poster, playlistUrl, caption } = node.attrs;\n  const [playlistContent, setPlaylistContent] = React.useState<\n    Playlist | undefined\n  >();\n  const [error, setError] = React.useState();\n\n  useEffect(() => {\n    async function getPlaylistContent() {\n      const res = await fetch(playlistUrl, {\n        cache: \"no-cache\",\n      });\n      return await res.json();\n    }\n\n    if (playlistUrl) {\n      try {\n        getPlaylistContent()\n          .then((data) => {\n            setPlaylistContent(data);\n          })\n          .catch((err) => {\n            setError(err);\n          });\n      } catch (error) {\n        setError(error);\n      }\n    }\n  }, [playlistUrl]);\n\n  const wrapperClassName = cn(\n    node.attrs.align === \"left\" ? \"ml-0\" : \"ml-auto\",\n    node.attrs.align === \"right\" ? \"mr-0\" : \"mr-auto\",\n    node.attrs.align === \"center\" && \"mx-auto\"\n  );\n\n  const onClick = useCallback(() => {\n    editor.commands.setNodeSelection(getPos());\n  }, [getPos, editor.commands]);\n\n  const videoJsOptions = useMemo(() => {\n    if (playlistContent == undefined) return {};\n    return {\n      sources: playlistContent.items.map((item) => ({\n        src: item.src,\n        type: item.type,\n        label: item.label,\n      })),\n      poster: playlistContent.poster,\n    };\n  }, [playlistContent]);\n  return (\n    <NodeViewWrapper>\n      <div className={wrapperClassName} style={{ width: node.attrs.width }}>\n        <div contentEditable={false} ref={videoWrapperRef}>\n          {error && <div>{error}</div>}\n          {/* <video\n            controls\n            className=\"block\"\n            src={src}\n            poster={poster}\n            title=\"\"\n            onClick={onClick}\n          /> */}\n          {playlistContent && <VideoPlayer options={videoJsOptions} />}\n          {caption && playlistContent?.title && (\n            <caption className=\"text-center block text-sm text-gray-500\">\n              {playlistContent?.title}\n            </caption>\n          )}\n        </div>\n      </div>\n    </NodeViewWrapper>\n  );\n};\n\nexport default VideoBlockView;\n"],"names":["NodeViewWrapper","React","useCallback","useEffect","useMemo","useRef","cn","VideoPlayer","VideoBlockView","props","editor","getPos","node","videoWrapperRef","src","poster","playlistUrl","caption","attrs","playlistContent","setPlaylistContent","useState","error","setError","getPlaylistContent","res","fetch","cache","json","then","data","catch","err","wrapperClassName","align","onClick","commands","setNodeSelection","videoJsOptions","undefined","sources","items","map","item","type","label","div","className","style","width","contentEditable","ref","options","title"],"mappings":";AACA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAQ;AACvE,SAASC,EAAE,QAAQ,8BAA8B;AACjD,OAAOC,iBAAiB,2BAA2B;AAgCnD,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGH;IACjC,MAAMI,kBAAkBR,OAAuB;IAC/C,MAAM,EAAES,GAAG,EAAEC,MAAM,EAAEC,WAAW,EAAEC,OAAO,EAAE,GAAGL,KAAKM,KAAK;IACxD,MAAM,CAACC,iBAAiBC,mBAAmB,GAAGnB,MAAMoB,QAAQ;IAG5D,MAAM,CAACC,OAAOC,SAAS,GAAGtB,MAAMoB,QAAQ;IAExClB,UAAU;QACR,eAAeqB;YACb,MAAMC,MAAM,MAAMC,MAAMV,aAAa;gBACnCW,OAAO;YACT;YACA,OAAO,MAAMF,IAAIG,IAAI;QACvB;QAEA,IAAIZ,aAAa;YACf,IAAI;gBACFQ,qBACGK,IAAI,CAAC,CAACC;oBACLV,mBAAmBU;gBACrB,GACCC,KAAK,CAAC,CAACC;oBACNT,SAASS;gBACX;YACJ,EAAE,OAAOV,OAAO;gBACdC,SAASD;YACX;QACF;IACF,GAAG;QAACN;KAAY;IAEhB,MAAMiB,mBAAmB3B,GACvBM,KAAKM,KAAK,CAACgB,KAAK,KAAK,SAAS,SAAS,WACvCtB,KAAKM,KAAK,CAACgB,KAAK,KAAK,UAAU,SAAS,WACxCtB,KAAKM,KAAK,CAACgB,KAAK,KAAK,YAAY;IAGnC,MAAMC,UAAUjC,YAAY;QAC1BQ,OAAO0B,QAAQ,CAACC,gBAAgB,CAAC1B;IACnC,GAAG;QAACA;QAAQD,OAAO0B,QAAQ;KAAC;IAE5B,MAAME,iBAAiBlC,QAAQ;QAC7B,IAAIe,mBAAmBoB,WAAW,OAAO,CAAC;QAC1C,OAAO;YACLC,SAASrB,gBAAgBsB,KAAK,CAACC,GAAG,CAAC,CAACC,OAAU,CAAA;oBAC5C7B,KAAK6B,KAAK7B,GAAG;oBACb8B,MAAMD,KAAKC,IAAI;oBACfC,OAAOF,KAAKE,KAAK;gBACnB,CAAA;YACA9B,QAAQI,gBAAgBJ,MAAM;QAChC;IACF,GAAG;QAACI;KAAgB;IACpB,qBACE,KAACnB;kBACC,cAAA,KAAC8C;YAAIC,WAAWd;YAAkBe,OAAO;gBAAEC,OAAOrC,KAAKM,KAAK,CAAC+B,KAAK;YAAC;sBACjE,cAAA,MAACH;gBAAII,iBAAiB;gBAAOC,KAAKtC;;oBAC/BS,uBAAS,KAACwB;kCAAKxB;;oBASfH,iCAAmB,KAACZ;wBAAY6C,SAASd;;oBACzCrB,WAAWE,iBAAiBkC,uBAC3B,KAACpC;wBAAQ8B,WAAU;kCAChB5B,iBAAiBkC;;;;;;AAOhC,EAAE;AAEF,eAAe7C,eAAe"}
+{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/VideoBlock/components/VideoBlockView.tsx"],"sourcesContent":["import { Node } from \"@tiptap/pm/model\";\nimport { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport React, { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../../lib/utils/index.js\";\nimport VideoPlayer from \"./videojs/VideoPlayer.js\";\n\ninterface VideoBlockViewProps {\n  editor: Editor;\n  getPos: () => number;\n  node: Node & {\n    attrs: {\n      src: string;\n      poster: string;\n      assetId: string;\n      playlistUrl?: string;\n    };\n  };\n  updateAttributes: (attrs: Record<string, string>) => void;\n}\n\nexport type Playlist = {\n  id: string;\n  title: string;\n  description: string;\n  poster: string;\n  items: Item[];\n};\n\nexport type Item = {\n  src: string;\n  type: string;\n  label: string;\n  width: number;\n  height: number;\n};\n\nexport const VideoBlockView = (props: VideoBlockViewProps) => {\n  const { editor, getPos, node } = props;\n  const videoWrapperRef = useRef<HTMLDivElement>(null);\n  const { src, poster, playlistUrl, caption } = node.attrs;\n  const [playlistContent, setPlaylistContent] = React.useState<\n    Playlist | undefined\n  >();\n  const [error, setError] = React.useState();\n\n  useEffect(() => {\n    async function getPlaylistContent() {\n      const res = await fetch(playlistUrl, {\n        cache: \"no-cache\",\n      });\n      return await res.json();\n    }\n\n    if (playlistUrl) {\n      try {\n        getPlaylistContent()\n          .then((data) => {\n            setPlaylistContent(data);\n          })\n          .catch((err) => {\n            setError(err);\n          });\n      } catch (error) {\n        setError(error);\n      }\n    }\n  }, [playlistUrl]);\n\n  const wrapperClassName = cn(\n    node.attrs.align === \"left\" ? \"ml-0\" : \"ml-auto\",\n    node.attrs.align === \"right\" ? \"mr-0\" : \"mr-auto\",\n    node.attrs.align === \"center\" && \"mx-auto\"\n  );\n\n  const onClick = useCallback(() => {\n    editor.commands.setNodeSelection(getPos());\n  }, [getPos, editor.commands]);\n\n  const videoJsOptions = useMemo(() => {\n    if (playlistContent == undefined) return {};\n\n    if (\n      playlistContent.items.some(\n        (item) =>\n          item.type === \"application/x-mpegURL\" ||\n          item.type === \"application/vnd.apple.mpegurl\"\n      )\n    ) {\n      return {\n        sources: playlistContent.items\n          .filter(\n            (item) =>\n              item.type === \"application/x-mpegURL\" ||\n              item.type === \"application/vnd.apple.mpegurl\"\n          )\n          .map((item) => ({\n            src: item.src,\n            type: item.type,\n            label: item.label,\n          })),\n        poster: playlistContent.poster,\n      };\n    }\n    return {\n      sources: playlistContent.items.map((item) => ({\n        src: item.src,\n        type: item.type,\n        label: item.label,\n      })),\n      poster: playlistContent.poster,\n    };\n  }, [playlistContent]);\n  return (\n    <NodeViewWrapper>\n      <div className={wrapperClassName} style={{ width: node.attrs.width }}>\n        <div contentEditable={false} ref={videoWrapperRef}>\n          {error && <div>{error}</div>}\n          {/* <video\n            controls\n            className=\"block\"\n            src={src}\n            poster={poster}\n            title=\"\"\n            onClick={onClick}\n          /> */}\n          {playlistContent && <VideoPlayer options={videoJsOptions} />}\n          {caption && playlistContent?.title && (\n            <caption className=\"text-center block text-sm text-gray-500\">\n              {playlistContent?.title}\n            </caption>\n          )}\n        </div>\n      </div>\n    </NodeViewWrapper>\n  );\n};\n\nexport default VideoBlockView;\n"],"names":["NodeViewWrapper","React","useCallback","useEffect","useMemo","useRef","cn","VideoPlayer","VideoBlockView","props","editor","getPos","node","videoWrapperRef","src","poster","playlistUrl","caption","attrs","playlistContent","setPlaylistContent","useState","error","setError","getPlaylistContent","res","fetch","cache","json","then","data","catch","err","wrapperClassName","align","onClick","commands","setNodeSelection","videoJsOptions","undefined","items","some","item","type","sources","filter","map","label","div","className","style","width","contentEditable","ref","options","title"],"mappings":";AACA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAQ;AACvE,SAASC,EAAE,QAAQ,8BAA8B;AACjD,OAAOC,iBAAiB,2BAA2B;AAgCnD,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGH;IACjC,MAAMI,kBAAkBR,OAAuB;IAC/C,MAAM,EAAES,GAAG,EAAEC,MAAM,EAAEC,WAAW,EAAEC,OAAO,EAAE,GAAGL,KAAKM,KAAK;IACxD,MAAM,CAACC,iBAAiBC,mBAAmB,GAAGnB,MAAMoB,QAAQ;IAG5D,MAAM,CAACC,OAAOC,SAAS,GAAGtB,MAAMoB,QAAQ;IAExClB,UAAU;QACR,eAAeqB;YACb,MAAMC,MAAM,MAAMC,MAAMV,aAAa;gBACnCW,OAAO;YACT;YACA,OAAO,MAAMF,IAAIG,IAAI;QACvB;QAEA,IAAIZ,aAAa;YACf,IAAI;gBACFQ,qBACGK,IAAI,CAAC,CAACC;oBACLV,mBAAmBU;gBACrB,GACCC,KAAK,CAAC,CAACC;oBACNT,SAASS;gBACX;YACJ,EAAE,OAAOV,OAAO;gBACdC,SAASD;YACX;QACF;IACF,GAAG;QAACN;KAAY;IAEhB,MAAMiB,mBAAmB3B,GACvBM,KAAKM,KAAK,CAACgB,KAAK,KAAK,SAAS,SAAS,WACvCtB,KAAKM,KAAK,CAACgB,KAAK,KAAK,UAAU,SAAS,WACxCtB,KAAKM,KAAK,CAACgB,KAAK,KAAK,YAAY;IAGnC,MAAMC,UAAUjC,YAAY;QAC1BQ,OAAO0B,QAAQ,CAACC,gBAAgB,CAAC1B;IACnC,GAAG;QAACA;QAAQD,OAAO0B,QAAQ;KAAC;IAE5B,MAAME,iBAAiBlC,QAAQ;QAC7B,IAAIe,mBAAmBoB,WAAW,OAAO,CAAC;QAE1C,IACEpB,gBAAgBqB,KAAK,CAACC,IAAI,CACxB,CAACC,OACCA,KAAKC,IAAI,KAAK,2BACdD,KAAKC,IAAI,KAAK,kCAElB;YACA,OAAO;gBACLC,SAASzB,gBAAgBqB,KAAK,CAC3BK,MAAM,CACL,CAACH,OACCA,KAAKC,IAAI,KAAK,2BACdD,KAAKC,IAAI,KAAK,iCAEjBG,GAAG,CAAC,CAACJ,OAAU,CAAA;wBACd5B,KAAK4B,KAAK5B,GAAG;wBACb6B,MAAMD,KAAKC,IAAI;wBACfI,OAAOL,KAAKK,KAAK;oBACnB,CAAA;gBACFhC,QAAQI,gBAAgBJ,MAAM;YAChC;QACF;QACA,OAAO;YACL6B,SAASzB,gBAAgBqB,KAAK,CAACM,GAAG,CAAC,CAACJ,OAAU,CAAA;oBAC5C5B,KAAK4B,KAAK5B,GAAG;oBACb6B,MAAMD,KAAKC,IAAI;oBACfI,OAAOL,KAAKK,KAAK;gBACnB,CAAA;YACAhC,QAAQI,gBAAgBJ,MAAM;QAChC;IACF,GAAG;QAACI;KAAgB;IACpB,qBACE,KAACnB;kBACC,cAAA,KAACgD;YAAIC,WAAWhB;YAAkBiB,OAAO;gBAAEC,OAAOvC,KAAKM,KAAK,CAACiC,KAAK;YAAC;sBACjE,cAAA,MAACH;gBAAII,iBAAiB;gBAAOC,KAAKxC;;oBAC/BS,uBAAS,KAAC0B;kCAAK1B;;oBASfH,iCAAmB,KAACZ;wBAAY+C,SAAShB;;oBACzCrB,WAAWE,iBAAiBoC,uBAC3B,KAACtC;wBAAQgC,WAAU;kCAChB9B,iBAAiBoC;;;;;;AAOhC,EAAE;AAEF,eAAe/C,eAAe"}

package/dist/src/fields/TiptapEditor/hooks/useBlockEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useBlockEditor.d.ts","sourceRoot":"","sources":["../../../../../src/fields/TiptapEditor/hooks/useBlockEditor.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAa,MAAM,eAAe,CAAC;AASlD,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;KACvB;CACF;AAED,eAAO,MAAM,cAAc,sEAKxB;IACD,OAAO,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,GAAG,CAAA;KAAE,CAAC;IACrC,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAClC,kBAAkB,EAAE,eAAe,CAAC;IACpC,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACzC;;;;;CA+FA,CAAC"}
+{"version":3,"file":"useBlockEditor.d.ts","sourceRoot":"","sources":["../../../../../src/fields/TiptapEditor/hooks/useBlockEditor.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAa,MAAM,eAAe,CAAC;AASlD,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;KACvB;CACF;AAED,eAAO,MAAM,cAAc,sEAKxB;IACD,OAAO,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,GAAG,CAAA;KAAE,CAAC;IACrC,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAClC,kBAAkB,EAAE,eAAe,CAAC;IACpC,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACzC;;;;;CAgGA,CAAC"}

package/dist/src/fields/TiptapEditor/hooks/useBlockEditor.js

@@ -20,6 +20,7 @@ export const useBlockEditor = ({ content, handleChange, openAssetHQHandler, addi
     const { t, i18n } = useTranslation();
     const editor = useEditor({
         content: content?.json ?? content ?? {},
+        immediatelyRender: false,
         autofocus: true,
         onCreate: ({ editor })=>{
         // provider?.on('synced', () => {

package/dist/src/fields/TiptapEditor/hooks/useBlockEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/fields/TiptapEditor/hooks/useBlockEditor.ts"],"sourcesContent":["\"use client\";\nimport { useEffect, useMemo } from \"react\";\n\nimport { Editor, useEditor } from \"@tiptap/react\";\n\nimport ExtensionKit from \"../extensions/extension-kit.js\";\nimport { EditorUser } from \"../features/BlockEditor/types.js\";\nimport { useSidebar } from \"./useSidebar.js\";\n\nimport { useTranslation } from \"@payloadcms/ui/providers/Translation\";\nimport TurndownService from \"turndown\";\nimport { gfm } from \"turndown-plugin-gfm\";\nimport { openAssetHQType } from \"../types.js\";\ndeclare global {\n  interface Window {\n    editor: Editor | null;\n  }\n}\n\nexport const useBlockEditor = ({\n  content,\n  handleChange,\n  openAssetHQHandler,\n  additionalContext,\n}: {\n  content: { html: string; json: any };\n  handleChange: (data: any) => void;\n  openAssetHQHandler: openAssetHQType;\n  additionalContext?: Record<string, any>;\n}) => {\n  const leftSidebar = useSidebar();\n\n  const turndownService = new TurndownService({});\n  // Use the gfm plugin\n  turndownService.use(gfm);\n  turndownService.addRule(\"twitter\", {\n    filter: \"div\",\n    replacement: function (content) {\n      return \"\\n\\n\" + content + \"\\n\\n\";\n    },\n  });\n  const { t, i18n } = useTranslation();\n\n  const editor = useEditor(\n    {\n      content: content?.json ?? content ?? {},\n      autofocus: true,\n      onCreate: ({ editor }) => {\n        // provider?.on('synced', () => {\n        //   if (editor.isEmpty) {\n        //     editor.commands.setContent(initialContent)\n        //   }\n        // })\n      },\n      extensions: [\n        ...ExtensionKit({\n          openAssetHQHandler,\n          // provider,\n        }),\n        // Collaboration.configure({\n        //   document: ydoc,\n        // }),\n        // CollaborationCursor.configure({\n        //   provider,\n        //   user: {\n        //     name: randomElement(userNames),\n        //     color: randomElement(userColors),\n        //   },\n        // }),\n      ],\n      editorProps: {\n        attributes: {\n          languages: i18n.language,\n          autocomplete: \"off\",\n          autocorrect: \"off\",\n          autocapitalize: \"off\",\n          class: \"min-h-full\",\n        },\n      },\n      onUpdate: ({ editor }) => {\n        handleChange(editor?.getJSON() ?? {});\n      },\n    },\n    []\n  );\n\n  useEffect(() => {\n    if (editor?.storage?.aiCommand) {\n      editor.storage.aiCommand.title = additionalContext?.title ?? \"\";\n      editor.storage.aiCommand.language = additionalContext?.language ?? \"\";\n    }\n  }, [editor, additionalContext]);\n\n  const users = useMemo(() => {\n    if (!editor?.storage?.collaborationCursor?.users) {\n      return [];\n    }\n\n    return editor?.storage?.collaborationCursor?.users.map(\n      (user: EditorUser) => {\n        const names = user.name?.split(\" \");\n        const firstName = names?.[0];\n        const lastName = names?.[names.length - 1];\n        const initials = `${firstName?.[0] || \"?\"}${lastName?.[0] || \"?\"}`;\n\n        return { ...user, initials: initials.length ? initials : \"?\" };\n      }\n    );\n  }, [editor?.storage.collaborationCursor?.users]);\n\n  const characterCount = editor?.storage.characterCount || {\n    characters: () => 0,\n    words: () => 0,\n  };\n\n  // useEffect(() => {\n  //   provider?.on('status', (event: { status: WebSocketStatus }) => {\n  //     setCollabState(event.status)\n  //   })\n  // }, [provider])\n\n  if (typeof window != \"undefined\") window.editor = editor;\n\n  return { editor, users, characterCount, leftSidebar };\n};\n"],"names":["useEffect","useMemo","useEditor","ExtensionKit","useSidebar","useTranslation","TurndownService","gfm","useBlockEditor","content","handleChange","openAssetHQHandler","additionalContext","leftSidebar","turndownService","use","addRule","filter","replacement","t","i18n","editor","json","autofocus","onCreate","extensions","editorProps","attributes","languages","language","autocomplete","autocorrect","autocapitalize","class","onUpdate","getJSON","storage","aiCommand","title","users","collaborationCursor","map","user","names","name","split","firstName","lastName","length","initials","characterCount","characters","words","window"],"mappings":"AAAA;AACA,SAASA,SAAS,EAAEC,OAAO,QAAQ,QAAQ;AAE3C,SAAiBC,SAAS,QAAQ,gBAAgB;AAElD,OAAOC,kBAAkB,iCAAiC;AAE1D,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,cAAc,QAAQ,uCAAuC;AACtE,OAAOC,qBAAqB,WAAW;AACvC,SAASC,GAAG,QAAQ,sBAAsB;AAQ1C,OAAO,MAAMC,iBAAiB,CAAC,EAC7BC,OAAO,EACPC,YAAY,EACZC,kBAAkB,EAClBC,iBAAiB,EAMlB;IACC,MAAMC,cAAcT;IAEpB,MAAMU,kBAAkB,IAAIR,gBAAgB,CAAC;IAC7C,qBAAqB;IACrBQ,gBAAgBC,GAAG,CAACR;IACpBO,gBAAgBE,OAAO,CAAC,WAAW;QACjCC,QAAQ;QACRC,aAAa,SAAUT,OAAO;YAC5B,OAAO,SAASA,UAAU;QAC5B;IACF;IACA,MAAM,EAAEU,CAAC,EAAEC,IAAI,EAAE,GAAGf;IAEpB,MAAMgB,SAASnB,UACb;QACEO,SAASA,SAASa,QAAQb,WAAW,CAAC;QACtCc,WAAW;QACXC,UAAU,CAAC,EAAEH,MAAM,EAAE;QACnB,iCAAiC;QACjC,0BAA0B;QAC1B,iDAAiD;QACjD,MAAM;QACN,KAAK;QACP;QACAI,YAAY;eACPtB,aAAa;gBACdQ;YAEF;SAWD;QACDe,aAAa;YACXC,YAAY;gBACVC,WAAWR,KAAKS,QAAQ;gBACxBC,cAAc;gBACdC,aAAa;gBACbC,gBAAgB;gBAChBC,OAAO;YACT;QACF;QACAC,UAAU,CAAC,EAAEb,MAAM,EAAE;YACnBX,aAAaW,QAAQc,aAAa,CAAC;QACrC;IACF,GACA,EAAE;IAGJnC,UAAU;QACR,IAAIqB,QAAQe,SAASC,WAAW;YAC9BhB,OAAOe,OAAO,CAACC,SAAS,CAACC,KAAK,GAAG1B,mBAAmB0B,SAAS;YAC7DjB,OAAOe,OAAO,CAACC,SAAS,CAACR,QAAQ,GAAGjB,mBAAmBiB,YAAY;QACrE;IACF,GAAG;QAACR;QAAQT;KAAkB;IAE9B,MAAM2B,QAAQtC,QAAQ;QACpB,IAAI,CAACoB,QAAQe,SAASI,qBAAqBD,OAAO;YAChD,OAAO,EAAE;QACX;QAEA,OAAOlB,QAAQe,SAASI,qBAAqBD,MAAME,IACjD,CAACC;YACC,MAAMC,QAAQD,KAAKE,IAAI,EAAEC,MAAM;YAC/B,MAAMC,YAAYH,OAAO,CAAC,EAAE;YAC5B,MAAMI,WAAWJ,OAAO,CAACA,MAAMK,MAAM,GAAG,EAAE;YAC1C,MAAMC,WAAW,CAAC,EAAEH,WAAW,CAAC,EAAE,IAAI,IAAI,EAAEC,UAAU,CAAC,EAAE,IAAI,IAAI,CAAC;YAElE,OAAO;gBAAE,GAAGL,IAAI;gBAAEO,UAAUA,SAASD,MAAM,GAAGC,WAAW;YAAI;QAC/D;IAEJ,GAAG;QAAC5B,QAAQe,QAAQI,qBAAqBD;KAAM;IAE/C,MAAMW,iBAAiB7B,QAAQe,QAAQc,kBAAkB;QACvDC,YAAY,IAAM;QAClBC,OAAO,IAAM;IACf;IAEA,oBAAoB;IACpB,qEAAqE;IACrE,mCAAmC;IACnC,OAAO;IACP,iBAAiB;IAEjB,IAAI,OAAOC,UAAU,aAAaA,OAAOhC,MAAM,GAAGA;IAElD,OAAO;QAAEA;QAAQkB;QAAOW;QAAgBrC;IAAY;AACtD,EAAE"}
+{"version":3,"sources":["../../../../../src/fields/TiptapEditor/hooks/useBlockEditor.ts"],"sourcesContent":["\"use client\";\nimport { useEffect, useMemo } from \"react\";\n\nimport { Editor, useEditor } from \"@tiptap/react\";\n\nimport ExtensionKit from \"../extensions/extension-kit.js\";\nimport { EditorUser } from \"../features/BlockEditor/types.js\";\nimport { useSidebar } from \"./useSidebar.js\";\n\nimport { useTranslation } from \"@payloadcms/ui/providers/Translation\";\nimport TurndownService from \"turndown\";\nimport { gfm } from \"turndown-plugin-gfm\";\nimport { openAssetHQType } from \"../types.js\";\ndeclare global {\n  interface Window {\n    editor: Editor | null;\n  }\n}\n\nexport const useBlockEditor = ({\n  content,\n  handleChange,\n  openAssetHQHandler,\n  additionalContext,\n}: {\n  content: { html: string; json: any };\n  handleChange: (data: any) => void;\n  openAssetHQHandler: openAssetHQType;\n  additionalContext?: Record<string, any>;\n}) => {\n  const leftSidebar = useSidebar();\n\n  const turndownService = new TurndownService({});\n  // Use the gfm plugin\n  turndownService.use(gfm);\n  turndownService.addRule(\"twitter\", {\n    filter: \"div\",\n    replacement: function (content) {\n      return \"\\n\\n\" + content + \"\\n\\n\";\n    },\n  });\n  const { t, i18n } = useTranslation();\n\n  const editor = useEditor(\n    {\n      content: content?.json ?? content ?? {},\n      immediatelyRender: false,\n      autofocus: true,\n      onCreate: ({ editor }) => {\n        // provider?.on('synced', () => {\n        //   if (editor.isEmpty) {\n        //     editor.commands.setContent(initialContent)\n        //   }\n        // })\n      },\n      extensions: [\n        ...ExtensionKit({\n          openAssetHQHandler,\n          // provider,\n        }),\n        // Collaboration.configure({\n        //   document: ydoc,\n        // }),\n        // CollaborationCursor.configure({\n        //   provider,\n        //   user: {\n        //     name: randomElement(userNames),\n        //     color: randomElement(userColors),\n        //   },\n        // }),\n      ],\n      editorProps: {\n        attributes: {\n          languages: i18n.language,\n          autocomplete: \"off\",\n          autocorrect: \"off\",\n          autocapitalize: \"off\",\n          class: \"min-h-full\",\n        },\n      },\n      onUpdate: ({ editor }) => {\n        handleChange(editor?.getJSON() ?? {});\n      },\n    },\n    []\n  );\n\n  useEffect(() => {\n    if (editor?.storage?.aiCommand) {\n      editor.storage.aiCommand.title = additionalContext?.title ?? \"\";\n      editor.storage.aiCommand.language = additionalContext?.language ?? \"\";\n    }\n  }, [editor, additionalContext]);\n\n  const users = useMemo(() => {\n    if (!editor?.storage?.collaborationCursor?.users) {\n      return [];\n    }\n\n    return editor?.storage?.collaborationCursor?.users.map(\n      (user: EditorUser) => {\n        const names = user.name?.split(\" \");\n        const firstName = names?.[0];\n        const lastName = names?.[names.length - 1];\n        const initials = `${firstName?.[0] || \"?\"}${lastName?.[0] || \"?\"}`;\n\n        return { ...user, initials: initials.length ? initials : \"?\" };\n      }\n    );\n  }, [editor?.storage.collaborationCursor?.users]);\n\n  const characterCount = editor?.storage.characterCount || {\n    characters: () => 0,\n    words: () => 0,\n  };\n\n  // useEffect(() => {\n  //   provider?.on('status', (event: { status: WebSocketStatus }) => {\n  //     setCollabState(event.status)\n  //   })\n  // }, [provider])\n\n  if (typeof window != \"undefined\") window.editor = editor;\n\n  return { editor, users, characterCount, leftSidebar };\n};\n"],"names":["useEffect","useMemo","useEditor","ExtensionKit","useSidebar","useTranslation","TurndownService","gfm","useBlockEditor","content","handleChange","openAssetHQHandler","additionalContext","leftSidebar","turndownService","use","addRule","filter","replacement","t","i18n","editor","json","immediatelyRender","autofocus","onCreate","extensions","editorProps","attributes","languages","language","autocomplete","autocorrect","autocapitalize","class","onUpdate","getJSON","storage","aiCommand","title","users","collaborationCursor","map","user","names","name","split","firstName","lastName","length","initials","characterCount","characters","words","window"],"mappings":"AAAA;AACA,SAASA,SAAS,EAAEC,OAAO,QAAQ,QAAQ;AAE3C,SAAiBC,SAAS,QAAQ,gBAAgB;AAElD,OAAOC,kBAAkB,iCAAiC;AAE1D,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,cAAc,QAAQ,uCAAuC;AACtE,OAAOC,qBAAqB,WAAW;AACvC,SAASC,GAAG,QAAQ,sBAAsB;AAQ1C,OAAO,MAAMC,iBAAiB,CAAC,EAC7BC,OAAO,EACPC,YAAY,EACZC,kBAAkB,EAClBC,iBAAiB,EAMlB;IACC,MAAMC,cAAcT;IAEpB,MAAMU,kBAAkB,IAAIR,gBAAgB,CAAC;IAC7C,qBAAqB;IACrBQ,gBAAgBC,GAAG,CAACR;IACpBO,gBAAgBE,OAAO,CAAC,WAAW;QACjCC,QAAQ;QACRC,aAAa,SAAUT,OAAO;YAC5B,OAAO,SAASA,UAAU;QAC5B;IACF;IACA,MAAM,EAAEU,CAAC,EAAEC,IAAI,EAAE,GAAGf;IAEpB,MAAMgB,SAASnB,UACb;QACEO,SAASA,SAASa,QAAQb,WAAW,CAAC;QACtCc,mBAAmB;QACnBC,WAAW;QACXC,UAAU,CAAC,EAAEJ,MAAM,EAAE;QACnB,iCAAiC;QACjC,0BAA0B;QAC1B,iDAAiD;QACjD,MAAM;QACN,KAAK;QACP;QACAK,YAAY;eACPvB,aAAa;gBACdQ;YAEF;SAWD;QACDgB,aAAa;YACXC,YAAY;gBACVC,WAAWT,KAAKU,QAAQ;gBACxBC,cAAc;gBACdC,aAAa;gBACbC,gBAAgB;gBAChBC,OAAO;YACT;QACF;QACAC,UAAU,CAAC,EAAEd,MAAM,EAAE;YACnBX,aAAaW,QAAQe,aAAa,CAAC;QACrC;IACF,GACA,EAAE;IAGJpC,UAAU;QACR,IAAIqB,QAAQgB,SAASC,WAAW;YAC9BjB,OAAOgB,OAAO,CAACC,SAAS,CAACC,KAAK,GAAG3B,mBAAmB2B,SAAS;YAC7DlB,OAAOgB,OAAO,CAACC,SAAS,CAACR,QAAQ,GAAGlB,mBAAmBkB,YAAY;QACrE;IACF,GAAG;QAACT;QAAQT;KAAkB;IAE9B,MAAM4B,QAAQvC,QAAQ;QACpB,IAAI,CAACoB,QAAQgB,SAASI,qBAAqBD,OAAO;YAChD,OAAO,EAAE;QACX;QAEA,OAAOnB,QAAQgB,SAASI,qBAAqBD,MAAME,IACjD,CAACC;YACC,MAAMC,QAAQD,KAAKE,IAAI,EAAEC,MAAM;YAC/B,MAAMC,YAAYH,OAAO,CAAC,EAAE;YAC5B,MAAMI,WAAWJ,OAAO,CAACA,MAAMK,MAAM,GAAG,EAAE;YAC1C,MAAMC,WAAW,CAAC,EAAEH,WAAW,CAAC,EAAE,IAAI,IAAI,EAAEC,UAAU,CAAC,EAAE,IAAI,IAAI,CAAC;YAElE,OAAO;gBAAE,GAAGL,IAAI;gBAAEO,UAAUA,SAASD,MAAM,GAAGC,WAAW;YAAI;QAC/D;IAEJ,GAAG;QAAC7B,QAAQgB,QAAQI,qBAAqBD;KAAM;IAE/C,MAAMW,iBAAiB9B,QAAQgB,QAAQc,kBAAkB;QACvDC,YAAY,IAAM;QAClBC,OAAO,IAAM;IACf;IAEA,oBAAoB;IACpB,qEAAqE;IACrE,mCAAmC;IACnC,OAAO;IACP,iBAAiB;IAEjB,IAAI,OAAOC,UAAU,aAAaA,OAAOjC,MAAM,GAAGA;IAElD,OAAO;QAAEA;QAAQmB;QAAOW;QAAgBtC;IAAY;AACtD,EAAE"}

package/dist/src/styles.css

@@ -1095,7 +1095,6 @@ select {
 .prose :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
   width: 100%;
   table-layout: auto;
-  text-align: start;
   margin-top: 2em;
   margin-bottom: 2em;
   font-size: 0.875em;
@@ -1138,6 +1137,10 @@ select {
   vertical-align: top;
 }
 
+.prose :where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  text-align: start;
+}
+
 .prose :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
   margin-top: 0;
   margin-bottom: 0;