payload-richtext-tiptap 0.0.126 → 0.0.128

package/dist/src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.d.ts

@@ -1,4 +1,4 @@
-declare module "@tiptap/core" {
+declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         insideLinks: {
             /**
@@ -14,6 +14,6 @@ declare module "@tiptap/core" {
         };
     }
 }
-import { Node } from "@tiptap/core";
+import { Node } from '@tiptap/core';
 export declare const InsideLinks: Node<any, any>;
 //# sourceMappingURL=insideLinks.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"insideLinks.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,WAAW,EAAE;YACX;;eAEG;YAEH,iBAAiB,EAAE,CAAC,EAClB,SAAS,EACT,KAAK,EACL,EAAE,EACF,IAAI,EACJ,GAAG,GACJ,EAAE;gBACD,SAAS,CAAC,EAAE,MAAM,CAAC;gBACnB,KAAK,CAAC,EAAE,MAAM,CAAC;gBACf,EAAE,CAAC,EAAE,MAAM,CAAC;gBACZ,IAAI,CAAC,EAAE,MAAM,CAAC;gBACd,GAAG,CAAC,EAAE,MAAM,CAAC;aACd,KAAK,UAAU,CAAC;SAClB,CAAC;KACH;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAC;AAIrD,eAAO,MAAM,WAAW,gBAmFtB,CAAC"}
+{"version":3,"file":"insideLinks.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,WAAW,EAAE;YACX;;eAEG;YAEH,iBAAiB,EAAE,CAAC,EAClB,SAAS,EACT,KAAK,EACL,EAAE,EACF,IAAI,EACJ,GAAG,GACJ,EAAE;gBACD,SAAS,CAAC,EAAE,MAAM,CAAA;gBAClB,KAAK,CAAC,EAAE,MAAM,CAAA;gBACd,EAAE,CAAC,EAAE,MAAM,CAAA;gBACX,IAAI,CAAC,EAAE,MAAM,CAAA;gBACb,GAAG,CAAC,EAAE,MAAM,CAAA;aACb,KAAK,UAAU,CAAA;SACjB,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,WAAW,gBAsMtB,CAAA"}

package/dist/src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.js

@@ -1,54 +1,154 @@
-import { Node, mergeAttributes } from "@tiptap/core";
-import { ReactNodeViewRenderer } from "@tiptap/react";
-import InsideLinksComponent from "./InsideLinksComponent.js";
+import { Node, mergeAttributes } from '@tiptap/core';
+import { ReactNodeViewRenderer } from '@tiptap/react';
+import InsideLinksComponent from './InsideLinksComponent.js';
 export const InsideLinks = Node.create({
-    name: "insideLinks",
-    group: "block",
-    content: "inline*",
+    name: 'insideLinks',
+    group: 'block',
+    content: 'inline*',
     draggable: true,
     // content: 'inline*',
     parseHTML () {
         return [
             {
-                tag: 'div[data-type="insideLinks"]'
+                tag: 'div[data-type="social-media-embed"]'
             }
         ];
     },
     addAttributes () {
         return {
-            thumbnail: {
+            id: {
                 default: null
             },
-            title: {
+            url: {
                 default: null
             },
-            id: {
-                default: null
+            title: {
+                default: ''
             },
-            type: {
-                default: null
+            thumbnail: {
+                default: ''
             },
-            url: {
+            draggable: {
+                default: true
+            },
+            type: {
                 default: null
             }
         };
     },
     addKeyboardShortcuts () {
         return {
-            "Mod-Enter": ()=>{
+            'Mod-Enter': ()=>{
                 return this.editor.chain().insertContentAt(this.editor.state.selection.head, {
                     type: this.type.name
                 }).focus().run();
             }
         };
     },
-    renderHTML ({ HTMLAttributes }) {
+    // renderHTML({ HTMLAttributes }) {
+    //   return [
+    //     "div",
+    //     mergeAttributes(HTMLAttributes, { "data-type": "insideLinks" }),
+    //     0,
+    //   ];
+    // },
+    // parseHTML() {
+    //   return [
+    //     {
+    //       tag: 'div[data-type="social-media-embed"]',
+    //     },
+    //   ];
+    // },
+    renderHTML ({ node, HTMLAttributes }) {
+        const { id, url, title, thumbnail, draggable } = node.attrs;
+        if (!id) {
+            return [
+                'div',
+                mergeAttributes(HTMLAttributes, {
+                    'data-type': 'social-media-embed',
+                    class: 'socialMediaContainer'
+                }),
+                [
+                    'div',
+                    {
+                        class: 'w-full bg-zinc-100 py-8 px-6 flex items-center justify-center gap-2 socialMediaCard',
+                        draggable: draggable ? 'true' : 'false',
+                        'data-drag-handle': ''
+                    },
+                    [
+                        'svg',
+                        {
+                            class: 'h-6 w-6'
+                        }
+                    ],
+                    [
+                        'p',
+                        {
+                            class: 'w-full flex items-center justify-start mt-0',
+                            style: 'margin-top: 0;'
+                        },
+                        'Add Internal Content Links'
+                    ]
+                ]
+            ];
+        }
         return [
-            "div",
+            'div',
             mergeAttributes(HTMLAttributes, {
-                "data-type": "insideLinks"
+                'data-type': 'social-media-embed',
+                class: 'socialMediaContainer'
             }),
-            0
+            [
+                'div',
+                {
+                    class: 'flex justify-center items-center w-full gap-x-6'
+                },
+                [
+                    'div',
+                    {
+                        class: 'flex justify-center items-center'
+                    },
+                    [
+                        'div',
+                        {
+                            class: 'w-[32px] h-[64px] bg-blue-400'
+                        }
+                    ],
+                    [
+                        'img',
+                        {
+                            src: thumbnail,
+                            width: '212',
+                            height: '120',
+                            alt: '',
+                            class: '-ml-6 !w-[212px] !h-[120px] object-cover'
+                        }
+                    ]
+                ],
+                [
+                    'div',
+                    {
+                        class: 'flex flex-col justify-start items-start font-trt gap-y-2'
+                    },
+                    [
+                        'a',
+                        {
+                            class: 'text-black dark:text-white text-lg capitalize w-full',
+                            href: url,
+                            dir: 'ltr'
+                        },
+                        'Read More'
+                    ],
+                    [
+                        'h3',
+                        {
+                            class: 'text-2xl font-bold !mt-0 w-full',
+                            dir: 'ltr'
+                        },
+                        title
+                    ]
+                ]
+            ]
         ];
     },
     addNodeView () {
@@ -58,7 +158,7 @@ export const InsideLinks = Node.create({
         return {
             insertInsideLinks: ({ thumbnail, title, id, type, url })=>({ commands, state })=>{
                     return commands.insertContent({
-                        type: "insideLinks",
+                        type: 'insideLinks',
                         attrs: {
                             thumbnail,
                             title,
@@ -78,7 +178,7 @@ function isValidHttpUrl(string) {
     } catch (_) {
         return false;
     }
-    return url.protocol === "http:" || url.protocol === "https:";
+    return url.protocol === 'http:' || url.protocol === 'https:';
 }
 
 //# sourceMappingURL=insideLinks.js.map

package/dist/src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.ts"],"sourcesContent":["declare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    insideLinks: {\n      /**\n       * Add an image\n       */\n\n      insertInsideLinks: ({\n        thumbnail,\n        title,\n        id,\n        type,\n        url,\n      }: {\n        thumbnail?: string;\n        title?: string;\n        id?: string;\n        type?: string;\n        url?: string;\n      }) => ReturnType;\n    };\n  }\n}\n\nimport { Node, mergeAttributes } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\nimport InsideLinksComponent from \"./InsideLinksComponent.js\";\n\nexport const InsideLinks = Node.create({\n  name: \"insideLinks\",\n\n  group: \"block\",\n  content: \"inline*\",\n  draggable: true,\n\n  // content: 'inline*',\n\n  parseHTML() {\n    return [\n      {\n        tag: 'div[data-type=\"insideLinks\"]',\n      },\n    ];\n  },\n\n  addAttributes() {\n    return {\n      thumbnail: { default: null },\n      title: { default: null },\n      id: { default: null },\n      type: { default: null },\n      url: { default: null },\n    };\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      \"Mod-Enter\": () => {\n        return this.editor\n          .chain()\n          .insertContentAt(this.editor.state.selection.head, {\n            type: this.type.name,\n          })\n          .focus()\n          .run();\n      },\n    };\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\n      \"div\",\n      mergeAttributes(HTMLAttributes, { \"data-type\": \"insideLinks\" }),\n      0,\n    ];\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(InsideLinksComponent);\n  },\n\n  addCommands() {\n    return {\n      insertInsideLinks:\n        ({\n          thumbnail,\n          title,\n          id,\n          type,\n          url,\n        }: {\n          thumbnail?: string;\n          title?: string;\n          id?: string;\n          type?: string;\n          url?: string;\n        }) =>\n        ({ commands, state }) => {\n          return commands.insertContent({\n            type: \"insideLinks\",\n            attrs: {\n              thumbnail,\n              title,\n              id,\n              type,\n              url,\n            },\n          });\n        },\n    };\n  },\n});\n\nfunction isValidHttpUrl(string: string) {\n  let url;\n\n  try {\n    url = new URL(string);\n  } catch (_) {\n    return false;\n  }\n\n  return url.protocol === \"http:\" || url.protocol === \"https:\";\n}\n"],"names":["Node","mergeAttributes","ReactNodeViewRenderer","InsideLinksComponent","InsideLinks","create","name","group","content","draggable","parseHTML","tag","addAttributes","thumbnail","default","title","id","type","url","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","focus","run","renderHTML","HTMLAttributes","addNodeView","addCommands","insertInsideLinks","commands","insertContent","attrs","isValidHttpUrl","string","URL","_","protocol"],"mappings":"AAwBA,SAASA,IAAI,EAAEC,eAAe,QAAQ,eAAe;AACrD,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,OAAOC,0BAA0B,4BAA4B;AAE7D,OAAO,MAAMC,cAAcJ,KAAKK,MAAM,CAAC;IACrCC,MAAM;IAENC,OAAO;IACPC,SAAS;IACTC,WAAW;IAEX,sBAAsB;IAEtBC;QACE,OAAO;YACL;gBACEC,KAAK;YACP;SACD;IACH;IAEAC;QACE,OAAO;YACLC,WAAW;gBAAEC,SAAS;YAAK;YAC3BC,OAAO;gBAAED,SAAS;YAAK;YACvBE,IAAI;gBAAEF,SAAS;YAAK;YACpBG,MAAM;gBAAEH,SAAS;YAAK;YACtBI,KAAK;gBAAEJ,SAAS;YAAK;QACvB;IACF;IAEAK;QACE,OAAO;YACL,aAAa;gBACX,OAAO,IAAI,CAACC,MAAM,CACfC,KAAK,GACLC,eAAe,CAAC,IAAI,CAACF,MAAM,CAACG,KAAK,CAACC,SAAS,CAACC,IAAI,EAAE;oBACjDR,MAAM,IAAI,CAACA,IAAI,CAACX,IAAI;gBACtB,GACCoB,KAAK,GACLC,GAAG;YACR;QACF;IACF;IAEAC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YACL;YACA5B,gBAAgB4B,gBAAgB;gBAAE,aAAa;YAAc;YAC7D;SACD;IACH;IAEAC;QACE,OAAO5B,sBAAsBC;IAC/B;IAEA4B;QACE,OAAO;YACLC,mBACE,CAAC,EACCnB,SAAS,EACTE,KAAK,EACLC,EAAE,EACFC,IAAI,EACJC,GAAG,EAOJ,GACD,CAAC,EAAEe,QAAQ,EAAEV,KAAK,EAAE;oBAClB,OAAOU,SAASC,aAAa,CAAC;wBAC5BjB,MAAM;wBACNkB,OAAO;4BACLtB;4BACAE;4BACAC;4BACAC;4BACAC;wBACF;oBACF;gBACF;QACJ;IACF;AACF,GAAG;AAEH,SAASkB,eAAeC,MAAc;IACpC,IAAInB;IAEJ,IAAI;QACFA,MAAM,IAAIoB,IAAID;IAChB,EAAE,OAAOE,GAAG;QACV,OAAO;IACT;IAEA,OAAOrB,IAAIsB,QAAQ,KAAK,WAAWtB,IAAIsB,QAAQ,KAAK;AACtD"}
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/InsideLinks/insideLinks.ts"],"sourcesContent":["declare module '@tiptap/core' {\n  interface Commands<ReturnType> {\n    insideLinks: {\n      /**\n       * Add an image\n       */\n\n      insertInsideLinks: ({\n        thumbnail,\n        title,\n        id,\n        type,\n        url,\n      }: {\n        thumbnail?: string\n        title?: string\n        id?: string\n        type?: string\n        url?: string\n      }) => ReturnType\n    }\n  }\n}\n\nimport { Node, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport InsideLinksComponent from './InsideLinksComponent.js'\n\nexport const InsideLinks = Node.create({\n  name: 'insideLinks',\n\n  group: 'block',\n  content: 'inline*',\n  draggable: true,\n\n  // content: 'inline*',\n\n  parseHTML() {\n    return [\n      {\n        tag: 'div[data-type=\"social-media-embed\"]',\n      },\n    ]\n  },\n\n  addAttributes() {\n    return {\n      id: {\n        default: null,\n      },\n      url: {\n        default: null,\n      },\n      title: {\n        default: '',\n      },\n      thumbnail: {\n        default: '',\n      },\n      draggable: {\n        default: true,\n      },\n      type: { default: null },\n    }\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      'Mod-Enter': () => {\n        return this.editor\n          .chain()\n          .insertContentAt(this.editor.state.selection.head, {\n            type: this.type.name,\n          })\n          .focus()\n          .run()\n      },\n    }\n  },\n\n  // renderHTML({ HTMLAttributes }) {\n  //   return [\n  //     \"div\",\n  //     mergeAttributes(HTMLAttributes, { \"data-type\": \"insideLinks\" }),\n  //     0,\n  //   ];\n  // },\n  // parseHTML() {\n  //   return [\n  //     {\n  //       tag: 'div[data-type=\"social-media-embed\"]',\n  //     },\n  //   ];\n  // },\n\n  renderHTML({ node, HTMLAttributes }) {\n    const { id, url, title, thumbnail, draggable } = node.attrs\n\n    if (!id) {\n      return [\n        'div',\n        mergeAttributes(HTMLAttributes, {\n          'data-type': 'social-media-embed',\n          class: 'socialMediaContainer',\n        }),\n        [\n          'div',\n          {\n            class:\n              'w-full bg-zinc-100 py-8 px-6 flex items-center justify-center gap-2 socialMediaCard',\n            draggable: draggable ? 'true' : 'false',\n            'data-drag-handle': '',\n          },\n          [\n            'svg',\n            {\n              class: 'h-6 w-6',\n              // SVG content for ExternalLinkIcon\n            },\n          ],\n          [\n            'p',\n            {\n              class: 'w-full flex items-center justify-start mt-0',\n              style: 'margin-top: 0;',\n            },\n            'Add Internal Content Links',\n          ],\n        ],\n      ]\n    }\n\n    return [\n      'div',\n      mergeAttributes(HTMLAttributes, {\n        'data-type': 'social-media-embed',\n        class: 'socialMediaContainer',\n      }),\n      [\n        'div',\n        {\n          class: 'flex justify-center items-center w-full gap-x-6',\n        },\n        [\n          'div',\n          {\n            class: 'flex justify-center items-center',\n          },\n          [\n            'div',\n            {\n              class: 'w-[32px] h-[64px] bg-blue-400',\n            },\n          ],\n          [\n            'img',\n            {\n              src: thumbnail,\n              width: '212',\n              height: '120',\n              alt: '',\n              class: '-ml-6 !w-[212px] !h-[120px] object-cover',\n            },\n          ],\n        ],\n        [\n          'div',\n          {\n            class: 'flex flex-col justify-start items-start font-trt gap-y-2',\n          },\n          [\n            'a',\n            {\n              class: 'text-black dark:text-white text-lg capitalize w-full',\n              href: url,\n              dir: 'ltr', // Adjust based on your i18n setup\n            },\n            'Read More', // Adjust based on your i18n setup\n          ],\n          [\n            'h3',\n            {\n              class: 'text-2xl font-bold !mt-0 w-full',\n              dir: 'ltr', // Adjust based on your i18n setup\n            },\n            title,\n          ],\n        ],\n      ],\n    ]\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(InsideLinksComponent)\n  },\n\n  addCommands() {\n    return {\n      insertInsideLinks:\n        ({\n          thumbnail,\n          title,\n          id,\n          type,\n          url,\n        }: {\n          thumbnail?: string\n          title?: string\n          id?: string\n          type?: string\n          url?: string\n        }) =>\n        ({ commands, state }) => {\n          return commands.insertContent({\n            type: 'insideLinks',\n            attrs: {\n              thumbnail,\n              title,\n              id,\n              type,\n              url,\n            },\n          })\n        },\n    }\n  },\n})\n\nfunction isValidHttpUrl(string: string) {\n  let url\n\n  try {\n    url = new URL(string)\n  } catch (_) {\n    return false\n  }\n\n  return url.protocol === 'http:' || url.protocol === 'https:'\n}\n"],"names":["Node","mergeAttributes","ReactNodeViewRenderer","InsideLinksComponent","InsideLinks","create","name","group","content","draggable","parseHTML","tag","addAttributes","id","default","url","title","thumbnail","type","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","focus","run","renderHTML","node","HTMLAttributes","attrs","class","style","src","width","height","alt","href","dir","addNodeView","addCommands","insertInsideLinks","commands","insertContent","isValidHttpUrl","string","URL","_","protocol"],"mappings":"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"}

package/dist/src/fields/TiptapEditor/extensions/Link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/Link/Link.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,gFA6Df,CAAA;AAEF,eAAe,IAAI,CAAA"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/Link/Link.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,gFAsFf,CAAA;AAEF,eAAe,IAAI,CAAA"}

package/dist/src/fields/TiptapEditor/extensions/Link/Link.js

@@ -20,9 +20,12 @@ export const Link = TiptapLink.extend({
         ];
     },
     addPasteRules () {
-        const twitterRegex = /^https:\/\/twitter\.com\/([a-zA-Z0-9_-]+)\/status\/(\d+)/g;
+        const twitterRegex = /^https:\/\/(twitter|x)\.com\/([a-zA-Z0-9_-]+)\/status\/(\d+)/g;
         const instagramRegex = /^https:\/\/www\.instagram\.com\/p\/([A-Za-z0-9_-]+)/g;
+        const instagramReelRegex = /^https:\/\/www\.instagram\.com\/reel\/([A-Za-z0-9_-]+)/g;
         const youtubeRegex = /^((?:https?:)?\/\/)?((?:www|m)\.)?((?:youtube(-nocookie)?\.com|youtu.be))(\/(?:[\w\-]+\?v=|embed\/|live\/|v\/)?)([\w\-]+)(\S+)?/g;
+        const facebookRegex = /^https:\/\/(?:www\.)?facebook\.com\/[a-zA-Z0-9.]+\/(?:posts|photos|videos)\/(?:[a-zA-Z0-9.]+\/)?(\d+)/g;
+        const tiktokRegex = /^https:\/\/(?:www\.)?tiktok\.com\/@[\w.-]+\/video\/(\d+)/g;
         return [
             new PasteRule({
                 find: twitterRegex,
@@ -38,12 +41,33 @@ export const Link = TiptapLink.extend({
                     chain().selectParentNode().deleteSelection().insertInstagram(matchUrl).run();
                 }
             }),
+            new PasteRule({
+                find: instagramReelRegex,
+                handler: ({ commands, match, state, pasteEvent, chain })=>{
+                    const matchUrl = match?.[0];
+                    chain().selectParentNode().deleteSelection().insertInstagram(matchUrl).run();
+                }
+            }),
             new PasteRule({
                 find: youtubeRegex,
                 handler: ({ commands, match, state, pasteEvent, chain })=>{
                     const matchUrl = match?.[0];
                     chain().selectParentNode().deleteSelection().insertYoutube(matchUrl).run();
                 }
+            }),
+            new PasteRule({
+                find: facebookRegex,
+                handler: ({ commands, match, state, pasteEvent, chain })=>{
+                    const matchUrl = match?.[0];
+                    chain().selectParentNode().deleteSelection().insertFacebook(matchUrl).run();
+                }
+            }),
+            new PasteRule({
+                find: tiktokRegex,
+                handler: ({ commands, match, state, pasteEvent, chain })=>{
+                    const matchUrl = match?.[0];
+                    chain().selectParentNode().deleteSelection().insertTiktok(matchUrl).run();
+                }
             })
         ];
     },

package/dist/src/fields/TiptapEditor/extensions/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/Link/Link.ts"],"sourcesContent":["import { PasteRule, mergeAttributes } from '@tiptap/core'\nimport TiptapLink from '@tiptap/extension-link'\nimport { Plugin } from '@tiptap/pm/state'\nimport { EditorView } from '@tiptap/pm/view'\n\nexport const Link = TiptapLink.extend({\n  inclusive: false,\n\n  parseHTML() {\n    return [{ tag: 'a[href]:not([data-type=\"button\"]):not([href *= \"javascript:\" i])' }]\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return ['a', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { class: 'link' }), 0]\n  },\n\n  addPasteRules() {\n    const twitterRegex = /^https:\\/\\/twitter\\.com\\/([a-zA-Z0-9_-]+)\\/status\\/(\\d+)/g\n    const instagramRegex = /^https:\\/\\/www\\.instagram\\.com\\/p\\/([A-Za-z0-9_-]+)/g\n    const youtubeRegex =\n      /^((?:https?:)?\\/\\/)?((?:www|m)\\.)?((?:youtube(-nocookie)?\\.com|youtu.be))(\\/(?:[\\w\\-]+\\?v=|embed\\/|live\\/|v\\/)?)([\\w\\-]+)(\\S+)?/g\n\n    return [\n      new PasteRule({\n        find: twitterRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertTwitter(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: instagramRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertInstagram(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: youtubeRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertYoutube(matchUrl).run()\n        },\n      }),\n    ]\n  },\n  addProseMirrorPlugins() {\n    const { editor } = this\n\n    return [\n      ...(this.parent?.() || []),\n      new Plugin({\n        props: {\n          handleKeyDown: (view: EditorView, event: KeyboardEvent) => {\n            const { selection } = editor.state\n\n            if (event.key === 'Escape' && selection.empty !== true) {\n              editor.commands.focus(selection.to, { scrollIntoView: false })\n            }\n\n            return false\n          },\n        },\n      }),\n    ]\n  },\n})\n\nexport default Link\n"],"names":["PasteRule","mergeAttributes","TiptapLink","Plugin","Link","extend","inclusive","parseHTML","tag","renderHTML","HTMLAttributes","options","class","addPasteRules","twitterRegex","instagramRegex","youtubeRegex","find","handler","commands","match","state","pasteEvent","chain","matchUrl","selectParentNode","deleteSelection","insertTwitter","run","insertInstagram","insertYoutube","addProseMirrorPlugins","editor","parent","props","handleKeyDown","view","event","selection","key","empty","focus","to","scrollIntoView"],"mappings":"AAAA,SAASA,SAAS,EAAEC,eAAe,QAAQ,eAAc;AACzD,OAAOC,gBAAgB,yBAAwB;AAC/C,SAASC,MAAM,QAAQ,mBAAkB;AAGzC,OAAO,MAAMC,OAAOF,WAAWG,MAAM,CAAC;IACpCC,WAAW;IAEXC;QACE,OAAO;YAAC;gBAAEC,KAAK;YAAmE;SAAE;IACtF;IAEAC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YAAC;YAAKT,gBAAgB,IAAI,CAACU,OAAO,CAACD,cAAc,EAAEA,gBAAgB;gBAAEE,OAAO;YAAO;YAAI;SAAE;IAClG;IAEAC;QACE,MAAMC,eAAe;QACrB,MAAMC,iBAAiB;QACvB,MAAMC,eACJ;QAEF,OAAO;YACL,IAAIhB,UAAU;gBACZiB,MAAMH;gBACNI,SAAS,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,KAAK,EAAEC,UAAU,EAAEC,KAAK,EAAE;oBACrD,MAAMC,WAAWJ,OAAO,CAAC,EAAE;oBAC3BG,QAAQE,gBAAgB,GAAGC,eAAe,GAAGC,aAAa,CAACH,UAAUI,GAAG;gBAC1E;YACF;YACA,IAAI5B,UAAU;gBACZiB,MAAMF;gBACNG,SAAS,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,KAAK,EAAEC,UAAU,EAAEC,KAAK,EAAE;oBACrD,MAAMC,WAAWJ,OAAO,CAAC,EAAE;oBAC3BG,QAAQE,gBAAgB,GAAGC,eAAe,GAAGG,eAAe,CAACL,UAAUI,GAAG;gBAC5E;YACF;YACA,IAAI5B,UAAU;gBACZiB,MAAMD;gBACNE,SAAS,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,KAAK,EAAEC,UAAU,EAAEC,KAAK,EAAE;oBACrD,MAAMC,WAAWJ,OAAO,CAAC,EAAE;oBAC3BG,QAAQE,gBAAgB,GAAGC,eAAe,GAAGI,aAAa,CAACN,UAAUI,GAAG;gBAC1E;YACF;SACD;IACH;IACAG;QACE,MAAM,EAAEC,MAAM,EAAE,GAAG,IAAI;QAEvB,OAAO;eACD,IAAI,CAACC,MAAM,QAAQ,EAAE;YACzB,IAAI9B,OAAO;gBACT+B,OAAO;oBACLC,eAAe,CAACC,MAAkBC;wBAChC,MAAM,EAAEC,SAAS,EAAE,GAAGN,OAAOX,KAAK;wBAElC,IAAIgB,MAAME,GAAG,KAAK,YAAYD,UAAUE,KAAK,KAAK,MAAM;4BACtDR,OAAOb,QAAQ,CAACsB,KAAK,CAACH,UAAUI,EAAE,EAAE;gCAAEC,gBAAgB;4BAAM;wBAC9D;wBAEA,OAAO;oBACT;gBACF;YACF;SACD;IACH;AACF,GAAE;AAEF,eAAevC,KAAI"}
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/Link/Link.ts"],"sourcesContent":["import { PasteRule, mergeAttributes } from '@tiptap/core'\nimport TiptapLink from '@tiptap/extension-link'\nimport { Plugin } from '@tiptap/pm/state'\nimport { EditorView } from '@tiptap/pm/view'\n\nexport const Link = TiptapLink.extend({\n  inclusive: false,\n\n  parseHTML() {\n    return [{ tag: 'a[href]:not([data-type=\"button\"]):not([href *= \"javascript:\" i])' }]\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return ['a', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { class: 'link' }), 0]\n  },\n\n  addPasteRules() {\n    const twitterRegex = /^https:\\/\\/(twitter|x)\\.com\\/([a-zA-Z0-9_-]+)\\/status\\/(\\d+)/g\n    const instagramRegex = /^https:\\/\\/www\\.instagram\\.com\\/p\\/([A-Za-z0-9_-]+)/g\n    const instagramReelRegex = /^https:\\/\\/www\\.instagram\\.com\\/reel\\/([A-Za-z0-9_-]+)/g\n    const youtubeRegex =\n      /^((?:https?:)?\\/\\/)?((?:www|m)\\.)?((?:youtube(-nocookie)?\\.com|youtu.be))(\\/(?:[\\w\\-]+\\?v=|embed\\/|live\\/|v\\/)?)([\\w\\-]+)(\\S+)?/g\n    const facebookRegex =\n      /^https:\\/\\/(?:www\\.)?facebook\\.com\\/[a-zA-Z0-9.]+\\/(?:posts|photos|videos)\\/(?:[a-zA-Z0-9.]+\\/)?(\\d+)/g\n    const tiktokRegex = /^https:\\/\\/(?:www\\.)?tiktok\\.com\\/@[\\w.-]+\\/video\\/(\\d+)/g\n\n    return [\n      new PasteRule({\n        find: twitterRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertTwitter(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: instagramRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertInstagram(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: instagramReelRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertInstagram(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: youtubeRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertYoutube(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: facebookRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertFacebook(matchUrl).run()\n        },\n      }),\n      new PasteRule({\n        find: tiktokRegex,\n        handler: ({ commands, match, state, pasteEvent, chain }) => {\n          const matchUrl = match?.[0]\n          chain().selectParentNode().deleteSelection().insertTiktok(matchUrl).run()\n        },\n      }),\n    ]\n  },\n  addProseMirrorPlugins() {\n    const { editor } = this\n\n    return [\n      ...(this.parent?.() || []),\n      new Plugin({\n        props: {\n          handleKeyDown: (view: EditorView, event: KeyboardEvent) => {\n            const { selection } = editor.state\n\n            if (event.key === 'Escape' && selection.empty !== true) {\n              editor.commands.focus(selection.to, { scrollIntoView: false })\n            }\n\n            return false\n          },\n        },\n      }),\n    ]\n  },\n})\n\nexport default Link\n"],"names":["PasteRule","mergeAttributes","TiptapLink","Plugin","Link","extend","inclusive","parseHTML","tag","renderHTML","HTMLAttributes","options","class","addPasteRules","twitterRegex","instagramRegex","instagramReelRegex","youtubeRegex","facebookRegex","tiktokRegex","find","handler","commands","match","state","pasteEvent","chain","matchUrl","selectParentNode","deleteSelection","insertTwitter","run","insertInstagram","insertYoutube","insertFacebook","insertTiktok","addProseMirrorPlugins","editor","parent","props","handleKeyDown","view","event","selection","key","empty","focus","to","scrollIntoView"],"mappings":"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"}

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.d.ts

@@ -1,4 +1,4 @@
-declare module "@tiptap/core" {
+declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         facebook: {
             /**
@@ -8,6 +8,6 @@ declare module "@tiptap/core" {
         };
     }
 }
-import { Node } from "@tiptap/core";
+import { Node } from '@tiptap/core';
 export declare const Facebook: Node<any, any>;
 //# sourceMappingURL=facebook.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"facebook.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,QAAQ,EAAE;YACR;;eAEG;YAEH,cAAc,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAC;SAClE,CAAC;KACH;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAC;AAIrD,eAAO,MAAM,QAAQ,gBA0DnB,CAAC"}
+{"version":3,"file":"facebook.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,QAAQ,EAAE;YACR;;eAEG;YAEH,cAAc,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SACjE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,QAAQ,gBA4FnB,CAAA"}

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.js

@@ -1,16 +1,16 @@
-import { Node, mergeAttributes } from "@tiptap/core";
-import { ReactNodeViewRenderer } from "@tiptap/react";
-import FacebookEmbed from "./FacebookEmbed.js";
+import { Node, mergeAttributes } from '@tiptap/core';
+import { ReactNodeViewRenderer } from '@tiptap/react';
+import FacebookEmbed from './FacebookEmbed.js';
 export const Facebook = Node.create({
-    name: "facebook",
-    group: "block",
-    content: "inline*",
+    name: 'facebook',
+    group: 'block',
+    content: 'inline*',
     draggable: true,
     // content: 'inline*',
     parseHTML () {
         return [
             {
-                tag: "facebook-component"
+                tag: 'div[data-type="facebook-post"]'
             }
         ];
     },
@@ -21,12 +21,21 @@ export const Facebook = Node.create({
             },
             class: {
                 default: null
+            },
+            src: {
+                default: null
+            },
+            width: {
+                default: '500'
+            },
+            showText: {
+                default: true
             }
         };
     },
     addKeyboardShortcuts () {
         return {
-            "Mod-Enter": ()=>{
+            'Mod-Enter': ()=>{
                 return this.editor.chain().insertContentAt(this.editor.state.selection.head, {
                     type: this.type.name
                 }).focus().run();
@@ -35,9 +44,29 @@ export const Facebook = Node.create({
     },
     renderHTML ({ HTMLAttributes }) {
         return [
-            "facebook-component",
-            mergeAttributes(HTMLAttributes),
-            0
+            'div',
+            mergeAttributes({
+                'data-type': 'facebook-post',
+                class: 'socialMediaContainer'
+            }, HTMLAttributes),
+            [
+                'div',
+                {
+                    class: 'fb-post',
+                    'data-href': HTMLAttributes.url,
+                    'data-width': HTMLAttributes.width,
+                    'data-show-text': HTMLAttributes.showText
+                }
+            ],
+            [
+                'script',
+                {
+                    async: true,
+                    defer: true,
+                    crossorigin: 'anonymous',
+                    src: 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v22.0&appId=990160422555057'
+                }
+            ]
         ];
     },
     addNodeView () {
@@ -47,10 +76,11 @@ export const Facebook = Node.create({
         return {
             insertFacebook: (url, className)=>({ commands, state })=>{
                     return commands.insertContent({
-                        type: "facebook",
+                        type: 'facebook',
                         attrs: {
                             url,
-                            class: className
+                            class: className,
+                            src: url
                         }
                     });
                 }
@@ -64,7 +94,7 @@ function isValidHttpUrl(string) {
     } catch (_) {
         return false;
     }
-    return url.protocol === "http:" || url.protocol === "https:";
+    return url.protocol === 'http:' || url.protocol === 'https:';
 }
 
 //# sourceMappingURL=facebook.js.map

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.ts"],"sourcesContent":["declare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    facebook: {\n      /**\n       * Add an image\n       */\n\n      insertFacebook: (url?: string, className?: string) => ReturnType;\n    };\n  }\n}\n\nimport { Node, mergeAttributes } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\nimport FacebookEmbed from \"./FacebookEmbed.js\";\n\nexport const Facebook = Node.create({\n  name: \"facebook\",\n  group: \"block\",\n  content: \"inline*\",\n  draggable: true,\n\n  // content: 'inline*',\n\n  parseHTML() {\n    return [\n      {\n        tag: \"facebook-component\",\n      },\n    ];\n  },\n  addAttributes() {\n    return {\n      url: { default: null },\n      class: { default: null },\n    };\n  },\n  addKeyboardShortcuts() {\n    return {\n      \"Mod-Enter\": () => {\n        return this.editor\n          .chain()\n          .insertContentAt(this.editor.state.selection.head, {\n            type: this.type.name,\n          })\n          .focus()\n          .run();\n      },\n    };\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\"facebook-component\", mergeAttributes(HTMLAttributes), 0];\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(FacebookEmbed);\n  },\n\n  addCommands() {\n    return {\n      insertFacebook:\n        (url, className) =>\n        ({ commands, state }) => {\n          return commands.insertContent({\n            type: \"facebook\",\n            attrs: {\n              url,\n              class: className,\n            },\n          });\n        },\n    };\n  },\n});\n\nfunction isValidHttpUrl(string: string) {\n  let url;\n\n  try {\n    url = new URL(string);\n  } catch (_) {\n    return false;\n  }\n\n  return url.protocol === \"http:\" || url.protocol === \"https:\";\n}\n"],"names":["Node","mergeAttributes","ReactNodeViewRenderer","FacebookEmbed","Facebook","create","name","group","content","draggable","parseHTML","tag","addAttributes","url","default","class","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","type","focus","run","renderHTML","HTMLAttributes","addNodeView","addCommands","insertFacebook","className","commands","insertContent","attrs","isValidHttpUrl","string","URL","_","protocol"],"mappings":"AAYA,SAASA,IAAI,EAAEC,eAAe,QAAQ,eAAe;AACrD,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,OAAOC,mBAAmB,qBAAqB;AAE/C,OAAO,MAAMC,WAAWJ,KAAKK,MAAM,CAAC;IAClCC,MAAM;IACNC,OAAO;IACPC,SAAS;IACTC,WAAW;IAEX,sBAAsB;IAEtBC;QACE,OAAO;YACL;gBACEC,KAAK;YACP;SACD;IACH;IACAC;QACE,OAAO;YACLC,KAAK;gBAAEC,SAAS;YAAK;YACrBC,OAAO;gBAAED,SAAS;YAAK;QACzB;IACF;IACAE;QACE,OAAO;YACL,aAAa;gBACX,OAAO,IAAI,CAACC,MAAM,CACfC,KAAK,GACLC,eAAe,CAAC,IAAI,CAACF,MAAM,CAACG,KAAK,CAACC,SAAS,CAACC,IAAI,EAAE;oBACjDC,MAAM,IAAI,CAACA,IAAI,CAACjB,IAAI;gBACtB,GACCkB,KAAK,GACLC,GAAG;YACR;QACF;IACF;IAEAC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YAAC;YAAsB1B,gBAAgB0B;YAAiB;SAAE;IACnE;IAEAC;QACE,OAAO1B,sBAAsBC;IAC/B;IAEA0B;QACE,OAAO;YACLC,gBACE,CAACjB,KAAKkB,YACN,CAAC,EAAEC,QAAQ,EAAEZ,KAAK,EAAE;oBAClB,OAAOY,SAASC,aAAa,CAAC;wBAC5BV,MAAM;wBACNW,OAAO;4BACLrB;4BACAE,OAAOgB;wBACT;oBACF;gBACF;QACJ;IACF;AACF,GAAG;AAEH,SAASI,eAAeC,MAAc;IACpC,IAAIvB;IAEJ,IAAI;QACFA,MAAM,IAAIwB,IAAID;IAChB,EAAE,OAAOE,GAAG;QACV,OAAO;IACT;IAEA,OAAOzB,IAAI0B,QAAQ,KAAK,WAAW1B,IAAI0B,QAAQ,KAAK;AACtD"}
+{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.ts"],"sourcesContent":["declare module '@tiptap/core' {\n  interface Commands<ReturnType> {\n    facebook: {\n      /**\n       * Add an image\n       */\n\n      insertFacebook: (url?: string, className?: string) => ReturnType\n    }\n  }\n}\n\nimport { Node, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport FacebookEmbed from './FacebookEmbed.js'\n\nexport const Facebook = Node.create({\n  name: 'facebook',\n  group: 'block',\n  content: 'inline*',\n  draggable: true,\n\n  // content: 'inline*',\n  parseHTML() {\n    return [\n      {\n        tag: 'div[data-type=\"facebook-post\"]',\n      },\n    ]\n  },\n\n  addAttributes() {\n    return {\n      url: { default: null },\n      class: { default: null },\n      src: {\n        default: null,\n      },\n      width: {\n        default: '500',\n      },\n      showText: {\n        default: true,\n      },\n    }\n  },\n  addKeyboardShortcuts() {\n    return {\n      'Mod-Enter': () => {\n        return this.editor\n          .chain()\n          .insertContentAt(this.editor.state.selection.head, {\n            type: this.type.name,\n          })\n          .focus()\n          .run()\n      },\n    }\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'div',\n      mergeAttributes(\n        { 'data-type': 'facebook-post', class: 'socialMediaContainer' },\n        HTMLAttributes,\n      ),\n      [\n        'div',\n        {\n          class: 'fb-post',\n          'data-href': HTMLAttributes.url,\n          'data-width': HTMLAttributes.width,\n          'data-show-text': HTMLAttributes.showText,\n        },\n      ],\n      [\n        'script',\n        {\n          async: true,\n          defer: true,\n          crossorigin: 'anonymous',\n          src: 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v22.0&appId=990160422555057',\n        },\n      ],\n    ]\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(FacebookEmbed)\n  },\n\n  addCommands() {\n    return {\n      insertFacebook:\n        (url, className) =>\n        ({ commands, state }) => {\n          return commands.insertContent({\n            type: 'facebook',\n            attrs: {\n              url,\n              class: className,\n              src: url,\n            },\n          })\n        },\n    }\n  },\n})\n\nfunction isValidHttpUrl(string: string) {\n  let url\n\n  try {\n    url = new URL(string)\n  } catch (_) {\n    return false\n  }\n\n  return url.protocol === 'http:' || url.protocol === 'https:'\n}\n"],"names":["Node","mergeAttributes","ReactNodeViewRenderer","FacebookEmbed","Facebook","create","name","group","content","draggable","parseHTML","tag","addAttributes","url","default","class","src","width","showText","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","type","focus","run","renderHTML","HTMLAttributes","async","defer","crossorigin","addNodeView","addCommands","insertFacebook","className","commands","insertContent","attrs","isValidHttpUrl","string","URL","_","protocol"],"mappings":"AAYA,SAASA,IAAI,EAAEC,eAAe,QAAQ,eAAc;AACpD,SAASC,qBAAqB,QAAQ,gBAAe;AACrD,OAAOC,mBAAmB,qBAAoB;AAE9C,OAAO,MAAMC,WAAWJ,KAAKK,MAAM,CAAC;IAClCC,MAAM;IACNC,OAAO;IACPC,SAAS;IACTC,WAAW;IAEX,sBAAsB;IACtBC;QACE,OAAO;YACL;gBACEC,KAAK;YACP;SACD;IACH;IAEAC;QACE,OAAO;YACLC,KAAK;gBAAEC,SAAS;YAAK;YACrBC,OAAO;gBAAED,SAAS;YAAK;YACvBE,KAAK;gBACHF,SAAS;YACX;YACAG,OAAO;gBACLH,SAAS;YACX;YACAI,UAAU;gBACRJ,SAAS;YACX;QACF;IACF;IACAK;QACE,OAAO;YACL,aAAa;gBACX,OAAO,IAAI,CAACC,MAAM,CACfC,KAAK,GACLC,eAAe,CAAC,IAAI,CAACF,MAAM,CAACG,KAAK,CAACC,SAAS,CAACC,IAAI,EAAE;oBACjDC,MAAM,IAAI,CAACA,IAAI,CAACpB,IAAI;gBACtB,GACCqB,KAAK,GACLC,GAAG;YACR;QACF;IACF;IAEAC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YACL;YACA7B,gBACE;gBAAE,aAAa;gBAAiBc,OAAO;YAAuB,GAC9De;YAEF;gBACE;gBACA;oBACEf,OAAO;oBACP,aAAae,eAAejB,GAAG;oBAC/B,cAAciB,eAAeb,KAAK;oBAClC,kBAAkBa,eAAeZ,QAAQ;gBAC3C;aACD;YACD;gBACE;gBACA;oBACEa,OAAO;oBACPC,OAAO;oBACPC,aAAa;oBACbjB,KAAK;gBACP;aACD;SACF;IACH;IAEAkB;QACE,OAAOhC,sBAAsBC;IAC/B;IAEAgC;QACE,OAAO;YACLC,gBACE,CAACvB,KAAKwB,YACN,CAAC,EAAEC,QAAQ,EAAEf,KAAK,EAAE;oBAClB,OAAOe,SAASC,aAAa,CAAC;wBAC5Bb,MAAM;wBACNc,OAAO;4BACL3B;4BACAE,OAAOsB;4BACPrB,KAAKH;wBACP;oBACF;gBACF;QACJ;IACF;AACF,GAAE;AAEF,SAAS4B,eAAeC,MAAc;IACpC,IAAI7B;IAEJ,IAAI;QACFA,MAAM,IAAI8B,IAAID;IAChB,EAAE,OAAOE,GAAG;QACV,OAAO;IACT;IAEA,OAAO/B,IAAIgC,QAAQ,KAAK,WAAWhC,IAAIgC,QAAQ,KAAK;AACtD"}

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.d.ts

@@ -1,4 +1,4 @@
-declare module "@tiptap/core" {
+declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         instagram: {
             /**
@@ -8,6 +8,6 @@ declare module "@tiptap/core" {
         };
     }
 }
-import { Node } from "@tiptap/core";
+import { Node } from '@tiptap/core';
 export declare const Instagram: Node<any, any>;
 //# sourceMappingURL=instagram.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"instagram.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,SAAS,EAAE;YACT;;eAEG;YAEH,eAAe,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAC;SACnE,CAAC;KACH;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAC;AAIrD,eAAO,MAAM,SAAS,gBA0DpB,CAAC"}
+{"version":3,"file":"instagram.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,SAAS,EAAE;YACT;;eAEG;YAEH,eAAe,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAClE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,SAAS,gBAgGpB,CAAA"}

package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.js

@@ -1,19 +1,12 @@
-import { Node, mergeAttributes } from "@tiptap/core";
-import { ReactNodeViewRenderer } from "@tiptap/react";
-import InstagramEmbed from "./InstagramEmbed.js";
+import { Node, mergeAttributes } from '@tiptap/core';
+import { ReactNodeViewRenderer } from '@tiptap/react';
+import InstagramEmbed from './InstagramEmbed.js';
 export const Instagram = Node.create({
-    name: "instagram",
-    group: "block",
-    content: "inline*",
+    name: 'instagram',
+    group: 'block',
+    content: 'inline*',
     draggable: true,
     // content: 'inline*',
-    parseHTML () {
-        return [
-            {
-                tag: "instagram-component"
-            }
-        ];
-    },
     addAttributes () {
         return {
             url: {
@@ -21,36 +14,81 @@ export const Instagram = Node.create({
             },
             class: {
                 default: null
+            },
+            src: {
+                default: null
+            },
+            width: {
+                default: '400'
+            },
+            height: {
+                default: '480'
+            },
+            frameborder: {
+                default: '0'
+            },
+            scrolling: {
+                default: 'no'
+            },
+            allowtransparency: {
+                default: 'true'
             }
         };
     },
+    parseHTML () {
+        return [
+            {
+                tag: 'div[data-type="instagram"]'
+            }
+        ];
+    },
+    renderHTML ({ HTMLAttributes }) {
+        return [
+            'div',
+            mergeAttributes({
+                'data-type': 'instagram',
+                class: 'socialMediaContainer'
+            }),
+            [
+                'iframe',
+                mergeAttributes({
+                    src: HTMLAttributes.src
+                }, HTMLAttributes)
+            ]
+        ];
+    },
     addKeyboardShortcuts () {
         return {
-            "Mod-Enter": ()=>{
+            'Mod-Enter': ()=>{
                 return this.editor.chain().insertContentAt(this.editor.state.selection.head, {
                     type: this.type.name
                 }).focus().run();
             }
         };
     },
-    renderHTML ({ HTMLAttributes }) {
-        return [
-            "instagram-component",
-            mergeAttributes(HTMLAttributes),
-            0
-        ];
-    },
     addNodeView () {
         return ReactNodeViewRenderer(InstagramEmbed);
     },
     addCommands () {
         return {
             insertInstagram: (url, className)=>({ commands, state })=>{
+                    let embedUrl = "";
+                    if (url) {
+                        // Convert URL to embed format
+                        const urlObj = new URL(url);
+                        const path = urlObj.pathname;
+                        const postId = path.split('/').filter(Boolean)[1] // Get the post ID after /p/
+                        ;
+                        if (postId) {
+                            embedUrl = `https://www.instagram.com/p/${postId}/embed/`;
+                        }
+                    }
                     return commands.insertContent({
-                        type: "instagram",
+                        type: 'instagram',
                         attrs: {
-                            url,
-                            class: className
+                            url: url,
+                            class: className,
+                            src: embedUrl
                         }
                     });
                 }
@@ -64,7 +102,7 @@ function isValidHttpUrl(string) {
     } catch (_) {
         return false;
     }
-    return url.protocol === "http:" || url.protocol === "https:";
+    return url.protocol === 'http:' || url.protocol === 'https:';
 }
 
 //# sourceMappingURL=instagram.js.map