payload-richtext-tiptap 0.0.128 → 0.0.130
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.js +33 -21
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Facebook/facebook.js.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.js +37 -17
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.js.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.js +39 -16
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.js.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.js +50 -29
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.js.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Youtube/youtube.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Youtube/youtube.js +55 -31
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Youtube/youtube.js.map +1 -1
- package/dist/src/mobile.css +1 -1
- package/dist/src/styles.css +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1 +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,CAAA;SACjE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,QAAQ,
|
|
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,CAAA;SACjE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,QAAQ,gBAmGnB,CAAA"}
|
|
@@ -26,7 +26,7 @@ export const Facebook = Node.create({
|
|
|
26
26
|
default: null
|
|
27
27
|
},
|
|
28
28
|
width: {
|
|
29
|
-
default: '
|
|
29
|
+
default: '550'
|
|
30
30
|
},
|
|
31
31
|
showText: {
|
|
32
32
|
default: true
|
|
@@ -44,28 +44,40 @@ export const Facebook = Node.create({
|
|
|
44
44
|
},
|
|
45
45
|
renderHTML ({ HTMLAttributes }) {
|
|
46
46
|
return [
|
|
47
|
-
|
|
48
|
-
mergeAttributes({
|
|
49
|
-
|
|
50
|
-
class:
|
|
51
|
-
}
|
|
47
|
+
"div",
|
|
48
|
+
mergeAttributes(HTMLAttributes, {
|
|
49
|
+
"data-type": "facebook",
|
|
50
|
+
class: `react-renderer node-facebook ${HTMLAttributes.class ?? ""}`
|
|
51
|
+
}),
|
|
52
52
|
[
|
|
53
53
|
'div',
|
|
54
|
-
{
|
|
55
|
-
class: '
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
'
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
54
|
+
mergeAttributes({
|
|
55
|
+
class: 'socialMediaContainer'
|
|
56
|
+
}),
|
|
57
|
+
[
|
|
58
|
+
'div',
|
|
59
|
+
mergeAttributes({
|
|
60
|
+
class: 'rsme-embed rsme-facebook-embed'
|
|
61
|
+
}, HTMLAttributes),
|
|
62
|
+
[
|
|
63
|
+
'div',
|
|
64
|
+
{
|
|
65
|
+
class: 'fb-post',
|
|
66
|
+
'data-href': HTMLAttributes.src,
|
|
67
|
+
'data-width': HTMLAttributes.width,
|
|
68
|
+
'data-show-text': HTMLAttributes.showText
|
|
69
|
+
}
|
|
70
|
+
],
|
|
71
|
+
[
|
|
72
|
+
'script',
|
|
73
|
+
{
|
|
74
|
+
async: true,
|
|
75
|
+
defer: true,
|
|
76
|
+
crossorigin: 'anonymous',
|
|
77
|
+
src: 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v22.0&appId=990160422555057'
|
|
78
|
+
}
|
|
79
|
+
]
|
|
80
|
+
]
|
|
69
81
|
]
|
|
70
82
|
];
|
|
71
83
|
},
|
|
@@ -1 +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 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: '
|
|
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 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: '550',\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(HTMLAttributes, {\n \"data-type\": \"facebook\",\n class: `react-renderer node-facebook ${HTMLAttributes.class ?? \"\"}`,\n }), [\n 'div',\n mergeAttributes(\n { class: 'socialMediaContainer' },\n ),\n ['div', mergeAttributes({ class: 'rsme-embed rsme-facebook-embed', }, HTMLAttributes),\n\n [\n 'div',\n {\n class: 'fb-post',\n 'data-href': HTMLAttributes.src,\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\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,gBAAgB6B,gBAAgB;gBAC9B,aAAa;gBACbf,OAAO,CAAC,6BAA6B,EAAEe,eAAef,KAAK,IAAI,GAAG,CAAC;YACrE;YAAI;gBACF;gBACAd,gBACE;oBAAEc,OAAO;gBAAuB;gBAElC;oBAAC;oBAAOd,gBAAgB;wBAAEc,OAAO;oBAAkC,GAAGe;oBAEpE;wBACE;wBACA;4BACEf,OAAO;4BACP,aAAae,eAAed,GAAG;4BAC/B,cAAcc,eAAeb,KAAK;4BAClC,kBAAkBa,eAAeZ,QAAQ;wBAC3C;qBACD;oBACD;wBACE;wBACA;4BACEa,OAAO;4BACPC,OAAO;4BACPC,aAAa;4BACbjB,KAAK;wBACP;qBACD;iBACF;aACF;SAAC;IACN;IAEAkB;QACE,OAAOhC,sBAAsBC;IAC/B;IAEAgC;QACE,OAAO;YACLC,gBACE,CAACvB,KAAKwB,YACJ,CAAC,EAAEC,QAAQ,EAAEf,KAAK,EAAE;oBAClB,OAAOe,SAASC,aAAa,CAAC;wBAC5Bb,MAAM;wBACNc,OAAO;4BACL3B;4BACAE,OAAOsB;4BACPrB,KAAKH;wBACP;oBACF;gBACF;QACN;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"}
|
|
@@ -1 +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,CAAA;SAClE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,SAAS,
|
|
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,CAAA;SAClE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,SAAS,gBAkGpB,CAAA"}
|
|
@@ -19,10 +19,10 @@ export const Instagram = Node.create({
|
|
|
19
19
|
default: null
|
|
20
20
|
},
|
|
21
21
|
width: {
|
|
22
|
-
default: '
|
|
22
|
+
default: '328px'
|
|
23
23
|
},
|
|
24
24
|
height: {
|
|
25
|
-
default: '
|
|
25
|
+
default: '100%'
|
|
26
26
|
},
|
|
27
27
|
frameborder: {
|
|
28
28
|
default: '0'
|
|
@@ -44,16 +44,30 @@ export const Instagram = Node.create({
|
|
|
44
44
|
},
|
|
45
45
|
renderHTML ({ HTMLAttributes }) {
|
|
46
46
|
return [
|
|
47
|
-
|
|
48
|
-
mergeAttributes({
|
|
49
|
-
|
|
50
|
-
class:
|
|
47
|
+
"div",
|
|
48
|
+
mergeAttributes(HTMLAttributes, {
|
|
49
|
+
"data-type": "instagram",
|
|
50
|
+
class: `react-renderer node-instagram ${HTMLAttributes.class ?? ""}`
|
|
51
51
|
}),
|
|
52
52
|
[
|
|
53
|
-
'
|
|
53
|
+
'div',
|
|
54
54
|
mergeAttributes({
|
|
55
|
-
|
|
56
|
-
},
|
|
55
|
+
class: 'socialMediaContainer'
|
|
56
|
+
}),
|
|
57
|
+
[
|
|
58
|
+
'div',
|
|
59
|
+
mergeAttributes({
|
|
60
|
+
class: 'rsme-embed rsme-instagram-embed max-w-[328px]',
|
|
61
|
+
style: 'overflow: hidden; width: 328px; border-radius: 3px; position: relative;'
|
|
62
|
+
}),
|
|
63
|
+
[
|
|
64
|
+
'iframe',
|
|
65
|
+
mergeAttributes({
|
|
66
|
+
src: convertInstaUrlToEmbed(HTMLAttributes.url),
|
|
67
|
+
class: "instagram-media instagram-media-rendered"
|
|
68
|
+
}, HTMLAttributes)
|
|
69
|
+
]
|
|
70
|
+
]
|
|
57
71
|
]
|
|
58
72
|
];
|
|
59
73
|
},
|
|
@@ -74,14 +88,7 @@ export const Instagram = Node.create({
|
|
|
74
88
|
insertInstagram: (url, className)=>({ commands, state })=>{
|
|
75
89
|
let embedUrl = "";
|
|
76
90
|
if (url) {
|
|
77
|
-
|
|
78
|
-
const urlObj = new URL(url);
|
|
79
|
-
const path = urlObj.pathname;
|
|
80
|
-
const postId = path.split('/').filter(Boolean)[1] // Get the post ID after /p/
|
|
81
|
-
;
|
|
82
|
-
if (postId) {
|
|
83
|
-
embedUrl = `https://www.instagram.com/p/${postId}/embed/`;
|
|
84
|
-
}
|
|
91
|
+
embedUrl = convertInstaUrlToEmbed(url);
|
|
85
92
|
}
|
|
86
93
|
return commands.insertContent({
|
|
87
94
|
type: 'instagram',
|
|
@@ -95,6 +102,19 @@ export const Instagram = Node.create({
|
|
|
95
102
|
};
|
|
96
103
|
}
|
|
97
104
|
});
|
|
105
|
+
function convertInstaUrlToEmbed(url) {
|
|
106
|
+
if (!url) return undefined;
|
|
107
|
+
try {
|
|
108
|
+
// Convert URL to embed format
|
|
109
|
+
const urlObj = new URL(url);
|
|
110
|
+
const path = urlObj.pathname;
|
|
111
|
+
const postId = path.split('/').filter(Boolean)[1] // Get the post ID after /p/
|
|
112
|
+
;
|
|
113
|
+
return postId ? `https://www.instagram.com/p/${postId}/embed/` : undefined;
|
|
114
|
+
} catch {
|
|
115
|
+
return undefined;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
98
118
|
function isValidHttpUrl(string) {
|
|
99
119
|
let url;
|
|
100
120
|
try {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.ts"],"sourcesContent":["declare module '@tiptap/core' {\n interface Commands<ReturnType> {\n instagram: {\n /**\n * Add an image\n */\n\n insertInstagram: (url?: string, className?: string) => ReturnType\n }\n }\n}\n\nimport { Node, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport InstagramEmbed from './InstagramEmbed.js'\n\nexport const Instagram = Node.create({\n name: 'instagram',\n\n group: 'block',\n content: 'inline*',\n draggable: true,\n // content: 'inline*',\n\n addAttributes() {\n return {\n url: { default: null },\n class: { default: null },\n src: {\n default: null,\n },\n width: {\n default: '
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/instagram.ts"],"sourcesContent":["declare module '@tiptap/core' {\n interface Commands<ReturnType> {\n instagram: {\n /**\n * Add an image\n */\n\n insertInstagram: (url?: string, className?: string) => ReturnType\n }\n }\n}\n\nimport { Node, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport InstagramEmbed from './InstagramEmbed.js'\n\nexport const Instagram = Node.create({\n name: 'instagram',\n\n group: 'block',\n content: 'inline*',\n draggable: true,\n // content: 'inline*',\n\n addAttributes() {\n return {\n url: { default: null },\n class: { default: null },\n src: {\n default: null,\n },\n width: {\n default: '328px',\n },\n height: {\n default: '100%',\n },\n frameborder: {\n default: '0',\n },\n scrolling: {\n default: 'no',\n },\n allowtransparency: {\n default: 'true',\n },\n }\n },\n\n\n parseHTML() {\n return [\n {\n tag: 'div[data-type=\"instagram\"]',\n },\n ]\n },\n renderHTML({ HTMLAttributes }) {\n return [\n \"div\",\n mergeAttributes(HTMLAttributes, {\n \"data-type\": \"instagram\",\n class: `react-renderer node-instagram ${HTMLAttributes.class ?? \"\"}`,\n }), [\n 'div',\n mergeAttributes(\n { class: 'socialMediaContainer' },\n ),\n ['div', mergeAttributes({ class: 'rsme-embed rsme-instagram-embed max-w-[328px]', style: 'overflow: hidden; width: 328px; border-radius: 3px; position: relative;' }),\n\n ['iframe', mergeAttributes({ src: convertInstaUrlToEmbed(HTMLAttributes.url), class: \"instagram-media instagram-media-rendered\" }, HTMLAttributes)],\n ]\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 addNodeView() {\n return ReactNodeViewRenderer(InstagramEmbed)\n },\n\n addCommands() {\n return {\n insertInstagram:\n (url, className) =>\n ({ commands, state }) => {\n let embedUrl = \"\"\n if (url) {\n embedUrl = convertInstaUrlToEmbed(url)\n\n }\n return commands.insertContent({\n type: 'instagram',\n attrs: {\n url: url,\n class: className,\n src: embedUrl,\n },\n })\n },\n }\n },\n})\nfunction convertInstaUrlToEmbed(url: string): string | undefined {\n if (!url) return undefined;\n try {\n // Convert URL to embed format\n const urlObj = new URL(url)\n const path = urlObj.pathname\n const postId = path.split('/').filter(Boolean)[1] // Get the post ID after /p/\n return postId ? `https://www.instagram.com/p/${postId}/embed/` : undefined;\n } catch {\n return undefined;\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","InstagramEmbed","Instagram","create","name","group","content","draggable","addAttributes","url","default","class","src","width","height","frameborder","scrolling","allowtransparency","parseHTML","tag","renderHTML","HTMLAttributes","style","convertInstaUrlToEmbed","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","type","focus","run","addNodeView","addCommands","insertInstagram","className","commands","embedUrl","insertContent","attrs","undefined","urlObj","URL","path","pathname","postId","split","filter","Boolean","isValidHttpUrl","string","_","protocol"],"mappings":"AAYA,SAASA,IAAI,EAAEC,eAAe,QAAQ,eAAc;AACpD,SAASC,qBAAqB,QAAQ,gBAAe;AACrD,OAAOC,oBAAoB,sBAAqB;AAEhD,OAAO,MAAMC,YAAYJ,KAAKK,MAAM,CAAC;IACnCC,MAAM;IAENC,OAAO;IACPC,SAAS;IACTC,WAAW;IACX,sBAAsB;IAEtBC;QACE,OAAO;YACLC,KAAK;gBAAEC,SAAS;YAAK;YACrBC,OAAO;gBAAED,SAAS;YAAK;YACvBE,KAAK;gBACHF,SAAS;YACX;YACAG,OAAO;gBACLH,SAAS;YACX;YACAI,QAAQ;gBACNJ,SAAS;YACX;YACAK,aAAa;gBACXL,SAAS;YACX;YACAM,WAAW;gBACTN,SAAS;YACX;YACAO,mBAAmB;gBACjBP,SAAS;YACX;QACF;IACF;IAGAQ;QACE,OAAO;YACL;gBACEC,KAAK;YACP;SACD;IACH;IACAC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YACL;YACAtB,gBAAgBsB,gBAAgB;gBAC9B,aAAa;gBACbV,OAAO,CAAC,8BAA8B,EAAEU,eAAeV,KAAK,IAAI,GAAG,CAAC;YACtE;YAAI;gBACF;gBACAZ,gBACE;oBAAEY,OAAO;gBAAuB;gBAElC;oBAAC;oBAAOZ,gBAAgB;wBAAEY,OAAO;wBAAiDW,OAAO;oBAA0E;oBAEjK;wBAAC;wBAAUvB,gBAAgB;4BAAEa,KAAKW,uBAAuBF,eAAeZ,GAAG;4BAAGE,OAAO;wBAA2C,GAAGU;qBAAgB;iBACpJ;aACF;SACF;IACH;IACAG;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,CAAC3B,IAAI;gBACtB,GACC4B,KAAK,GACLC,GAAG;YACR;QACF;IACF;IAEAC;QACE,OAAOlC,sBAAsBC;IAC/B;IAEAkC;QACE,OAAO;YACLC,iBACE,CAAC3B,KAAK4B,YACJ,CAAC,EAAEC,QAAQ,EAAEV,KAAK,EAAE;oBAClB,IAAIW,WAAW;oBACf,IAAI9B,KAAK;wBACP8B,WAAWhB,uBAAuBd;oBAEpC;oBACA,OAAO6B,SAASE,aAAa,CAAC;wBAC5BT,MAAM;wBACNU,OAAO;4BACLhC,KAAKA;4BACLE,OAAO0B;4BACPzB,KAAK2B;wBACP;oBACF;gBACF;QACN;IACF;AACF,GAAE;AACF,SAAShB,uBAAuBd,GAAW;IACzC,IAAI,CAACA,KAAK,OAAOiC;IACjB,IAAI;QACF,8BAA8B;QAC9B,MAAMC,SAAS,IAAIC,IAAInC;QACvB,MAAMoC,OAAOF,OAAOG,QAAQ;QAC5B,MAAMC,SAASF,KAAKG,KAAK,CAAC,KAAKC,MAAM,CAACC,QAAQ,CAAC,EAAE,CAAC,4BAA4B;;QAC9E,OAAOH,SAAS,CAAC,4BAA4B,EAAEA,OAAO,OAAO,CAAC,GAAGL;IACnE,EAAE,OAAM;QACN,OAAOA;IACT;AACF;AAEA,SAASS,eAAeC,MAAc;IACpC,IAAI3C;IAEJ,IAAI;QACFA,MAAM,IAAImC,IAAIQ;IAChB,EAAE,OAAOC,GAAG;QACV,OAAO;IACT;IAEA,OAAO5C,IAAI6C,QAAQ,KAAK,WAAW7C,IAAI6C,QAAQ,KAAK;AACtD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tiktok.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,MAAM,EAAE;YACN;;eAEG;YAEH,YAAY,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAC/D,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"tiktok.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,MAAM,EAAE;YACN;;eAEG;YAEH,YAAY,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAC/D,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAIpD,eAAO,MAAM,MAAM,gBAoGjB,CAAA"}
|
|
@@ -19,7 +19,7 @@ export const Tiktok = Node.create({
|
|
|
19
19
|
default: null
|
|
20
20
|
},
|
|
21
21
|
width: {
|
|
22
|
-
default: '
|
|
22
|
+
default: '328px'
|
|
23
23
|
},
|
|
24
24
|
height: {
|
|
25
25
|
default: '100%'
|
|
@@ -44,16 +44,35 @@ export const Tiktok = Node.create({
|
|
|
44
44
|
},
|
|
45
45
|
renderHTML ({ HTMLAttributes }) {
|
|
46
46
|
return [
|
|
47
|
-
|
|
47
|
+
"div",
|
|
48
48
|
mergeAttributes({
|
|
49
|
-
|
|
50
|
-
class:
|
|
49
|
+
"data-type": "tiktok",
|
|
50
|
+
class: `react-renderer node-tiktok ${HTMLAttributes.class ?? ""}`
|
|
51
51
|
}),
|
|
52
52
|
[
|
|
53
|
-
'
|
|
53
|
+
'div',
|
|
54
54
|
mergeAttributes({
|
|
55
|
-
|
|
56
|
-
},
|
|
55
|
+
class: 'socialMediaContainer'
|
|
56
|
+
}),
|
|
57
|
+
[
|
|
58
|
+
'div',
|
|
59
|
+
mergeAttributes({
|
|
60
|
+
class: 'rsme-embed rsme-tiktok-embed',
|
|
61
|
+
style: 'overflow: hidden; border-radius: 8px;'
|
|
62
|
+
}),
|
|
63
|
+
[
|
|
64
|
+
'div',
|
|
65
|
+
{
|
|
66
|
+
class: 'tiktok-embed-container'
|
|
67
|
+
},
|
|
68
|
+
[
|
|
69
|
+
'iframe',
|
|
70
|
+
mergeAttributes({
|
|
71
|
+
src: convertTikTokUrlToEmbed(HTMLAttributes.url)
|
|
72
|
+
}, HTMLAttributes)
|
|
73
|
+
]
|
|
74
|
+
]
|
|
75
|
+
]
|
|
57
76
|
]
|
|
58
77
|
];
|
|
59
78
|
},
|
|
@@ -73,15 +92,8 @@ export const Tiktok = Node.create({
|
|
|
73
92
|
return {
|
|
74
93
|
insertTiktok: (url, className)=>({ commands, state })=>{
|
|
75
94
|
let embedUrl;
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
const path = urlObj.pathname;
|
|
79
|
-
const videoId = path.split('/').filter(Boolean)[2] // Get video ID from path
|
|
80
|
-
;
|
|
81
|
-
if (videoId) {
|
|
82
|
-
embedUrl = `https://www.tiktok.com/embed/v3/${videoId}`;
|
|
83
|
-
}
|
|
84
|
-
}
|
|
95
|
+
// Usage in the original location:
|
|
96
|
+
embedUrl = url ? convertTikTokUrlToEmbed(url) : undefined;
|
|
85
97
|
return commands.insertContent({
|
|
86
98
|
type: 'tiktok',
|
|
87
99
|
attrs: {
|
|
@@ -94,6 +106,17 @@ export const Tiktok = Node.create({
|
|
|
94
106
|
};
|
|
95
107
|
}
|
|
96
108
|
});
|
|
109
|
+
function convertTikTokUrlToEmbed(url) {
|
|
110
|
+
if (!url) return undefined;
|
|
111
|
+
try {
|
|
112
|
+
const urlObj = new URL(url);
|
|
113
|
+
const path = urlObj.pathname;
|
|
114
|
+
const videoId = path.split('/').filter(Boolean)[2];
|
|
115
|
+
return videoId ? `https://www.tiktok.com/embed/v3/${videoId}` : undefined;
|
|
116
|
+
} catch {
|
|
117
|
+
return undefined;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
97
120
|
function isValidHttpUrl(string) {
|
|
98
121
|
let url;
|
|
99
122
|
try {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.ts"],"sourcesContent":["declare module '@tiptap/core' {\n interface Commands<ReturnType> {\n tiktok: {\n /**\n * Add an image\n */\n\n insertTiktok: (url?: string, className?: string) => ReturnType\n }\n }\n}\n\nimport { Node, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport TiktokEmbed from './TiktokEmbed.js'\n\nexport const Tiktok = Node.create({\n name: 'tiktok',\n\n group: 'block',\n content: 'inline*',\n draggable: true,\n\n // content: 'inline*',\n\n addAttributes() {\n return {\n url: { default: null },\n class: { default: null },\n src: {\n default: null,\n },\n width: {\n default: '
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Tiktok/tiktok.ts"],"sourcesContent":["declare module '@tiptap/core' {\n interface Commands<ReturnType> {\n tiktok: {\n /**\n * Add an image\n */\n\n insertTiktok: (url?: string, className?: string) => ReturnType\n }\n }\n}\n\nimport { Node, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport TiktokEmbed from './TiktokEmbed.js'\n\nexport const Tiktok = Node.create({\n name: 'tiktok',\n\n group: 'block',\n content: 'inline*',\n draggable: true,\n\n // content: 'inline*',\n\n addAttributes() {\n return {\n url: { default: null },\n class: { default: null },\n src: {\n default: null,\n },\n width: {\n default: '328px',\n },\n height: {\n default: '100%',\n },\n frameborder: {\n default: '0',\n },\n scrolling: {\n default: 'no',\n },\n allowtransparency: {\n default: 'true',\n },\n }\n },\n parseHTML() {\n return [\n {\n tag: 'div[data-type=\"tiktok\"]',\n },\n ]\n },\n renderHTML({ HTMLAttributes }) {\n return [\n \"div\",\n mergeAttributes({\n \"data-type\": \"tiktok\",\n class: `react-renderer node-tiktok ${HTMLAttributes.class ?? \"\"}`,\n }), [\n 'div',\n mergeAttributes(\n { class: 'socialMediaContainer' },\n ),\n ['div', mergeAttributes({ class: 'rsme-embed rsme-tiktok-embed', style: 'overflow: hidden; border-radius: 8px;' }),\n ['div', { class: 'tiktok-embed-container' },\n ['iframe', mergeAttributes({ src: convertTikTokUrlToEmbed(HTMLAttributes.url) }, HTMLAttributes)],\n ]\n ]\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 addNodeView() {\n return ReactNodeViewRenderer(TiktokEmbed)\n },\n\n addCommands() {\n return {\n insertTiktok:\n (url, className) =>\n ({ commands, state }) => {\n\n\n let embedUrl\n\n\n // Usage in the original location:\n embedUrl = url ? convertTikTokUrlToEmbed(url) : undefined;\n return commands.insertContent({\n type: 'tiktok',\n attrs: {\n url,\n class: className,\n src: embedUrl,\n },\n })\n },\n }\n },\n})\n\nfunction convertTikTokUrlToEmbed(url: string): string | undefined {\n if (!url) return undefined;\n try {\n const urlObj = new URL(url);\n const path = urlObj.pathname;\n const videoId = path.split('/').filter(Boolean)[2];\n return videoId ? `https://www.tiktok.com/embed/v3/${videoId}` : undefined;\n } catch {\n return undefined;\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","TiktokEmbed","Tiktok","create","name","group","content","draggable","addAttributes","url","default","class","src","width","height","frameborder","scrolling","allowtransparency","parseHTML","tag","renderHTML","HTMLAttributes","style","convertTikTokUrlToEmbed","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","type","focus","run","addNodeView","addCommands","insertTiktok","className","commands","embedUrl","undefined","insertContent","attrs","urlObj","URL","path","pathname","videoId","split","filter","Boolean","isValidHttpUrl","string","_","protocol"],"mappings":"AAYA,SAASA,IAAI,EAAEC,eAAe,QAAQ,eAAc;AACpD,SAASC,qBAAqB,QAAQ,gBAAe;AACrD,OAAOC,iBAAiB,mBAAkB;AAE1C,OAAO,MAAMC,SAASJ,KAAKK,MAAM,CAAC;IAChCC,MAAM;IAENC,OAAO;IACPC,SAAS;IACTC,WAAW;IAEX,sBAAsB;IAEtBC;QACE,OAAO;YACLC,KAAK;gBAAEC,SAAS;YAAK;YACrBC,OAAO;gBAAED,SAAS;YAAK;YACvBE,KAAK;gBACHF,SAAS;YACX;YACAG,OAAO;gBACLH,SAAS;YACX;YACAI,QAAQ;gBACNJ,SAAS;YACX;YACAK,aAAa;gBACXL,SAAS;YACX;YACAM,WAAW;gBACTN,SAAS;YACX;YACAO,mBAAmB;gBACjBP,SAAS;YACX;QACF;IACF;IACAQ;QACE,OAAO;YACL;gBACEC,KAAK;YACP;SACD;IACH;IACAC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YACL;YACAtB,gBAAgB;gBACd,aAAa;gBACbY,OAAO,CAAC,2BAA2B,EAAEU,eAAeV,KAAK,IAAI,GAAG,CAAC;YACnE;YAAI;gBACF;gBACAZ,gBACE;oBAAEY,OAAO;gBAAuB;gBAElC;oBAAC;oBAAOZ,gBAAgB;wBAAEY,OAAO;wBAAgCW,OAAO;oBAAwC;oBAC9G;wBAAC;wBAAO;4BAAEX,OAAO;wBAAyB;wBACxC;4BAAC;4BAAUZ,gBAAgB;gCAAEa,KAAKW,wBAAwBF,eAAeZ,GAAG;4BAAE,GAAGY;yBAAgB;qBAClG;iBACF;aACF;SACF;IACH;IACAG;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,CAAC3B,IAAI;gBACtB,GACC4B,KAAK,GACLC,GAAG;YACR;QACF;IACF;IAEAC;QACE,OAAOlC,sBAAsBC;IAC/B;IAEAkC;QACE,OAAO;YACLC,cACE,CAAC3B,KAAK4B,YACJ,CAAC,EAAEC,QAAQ,EAAEV,KAAK,EAAE;oBAGlB,IAAIW;oBAGJ,kCAAkC;oBAClCA,WAAW9B,MAAMc,wBAAwBd,OAAO+B;oBAChD,OAAOF,SAASG,aAAa,CAAC;wBAC5BV,MAAM;wBACNW,OAAO;4BACLjC;4BACAE,OAAO0B;4BACPzB,KAAK2B;wBACP;oBACF;gBACF;QACN;IACF;AACF,GAAE;AAEF,SAAShB,wBAAwBd,GAAW;IAC1C,IAAI,CAACA,KAAK,OAAO+B;IACjB,IAAI;QACF,MAAMG,SAAS,IAAIC,IAAInC;QACvB,MAAMoC,OAAOF,OAAOG,QAAQ;QAC5B,MAAMC,UAAUF,KAAKG,KAAK,CAAC,KAAKC,MAAM,CAACC,QAAQ,CAAC,EAAE;QAClD,OAAOH,UAAU,CAAC,gCAAgC,EAAEA,QAAQ,CAAC,GAAGP;IAClE,EAAE,OAAM;QACN,OAAOA;IACT;AACF;AAEA,SAASW,eAAeC,MAAc;IACpC,IAAI3C;IAEJ,IAAI;QACFA,MAAM,IAAImC,IAAIQ;IAChB,EAAE,OAAOC,GAAG;QACV,OAAO;IACT;IAEA,OAAO5C,IAAI6C,QAAQ,KAAK,WAAW7C,IAAI6C,QAAQ,KAAK;AACtD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"twitter.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,OAAO,EAAE;YACP;;eAEG;YAEH,aAAa,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAChE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAA6C,MAAM,cAAc,CAAA;AAI9E,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"twitter.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,OAAO,EAAE;YACP;;eAEG;YAEH,aAAa,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAChE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAA6C,MAAM,cAAc,CAAA;AAI9E,eAAO,MAAM,OAAO,gBAsGlB,CAAA"}
|
|
@@ -44,33 +44,45 @@ export const Twitter = Node.create({
|
|
|
44
44
|
// ];
|
|
45
45
|
// },
|
|
46
46
|
renderHTML ({ HTMLAttributes }) {
|
|
47
|
-
console.log('HTMLAttributes', HTMLAttributes);
|
|
48
47
|
return [
|
|
49
|
-
|
|
50
|
-
mergeAttributes({
|
|
51
|
-
|
|
52
|
-
class:
|
|
53
|
-
}
|
|
48
|
+
"div",
|
|
49
|
+
mergeAttributes(HTMLAttributes, {
|
|
50
|
+
"data-type": "twitter",
|
|
51
|
+
class: `react-renderer node-twitter ${HTMLAttributes.class ?? ""}`
|
|
52
|
+
}),
|
|
54
53
|
[
|
|
55
|
-
'
|
|
56
|
-
{
|
|
57
|
-
class: '
|
|
58
|
-
},
|
|
54
|
+
'div',
|
|
55
|
+
mergeAttributes({
|
|
56
|
+
class: 'socialMediaContainer'
|
|
57
|
+
}),
|
|
59
58
|
[
|
|
60
|
-
'
|
|
61
|
-
{
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
59
|
+
'div',
|
|
60
|
+
mergeAttributes({
|
|
61
|
+
class: 'rsme-embed rsme-twitter-embed',
|
|
62
|
+
style: 'overflow: hidden; width: 325px; border-radius: 12px;'
|
|
63
|
+
}),
|
|
64
|
+
[
|
|
65
|
+
'blockquote',
|
|
66
|
+
{
|
|
67
|
+
class: 'twitter-tweet'
|
|
68
|
+
},
|
|
69
|
+
[
|
|
70
|
+
'a',
|
|
71
|
+
{
|
|
72
|
+
href: convertYoutubeUrlToEmbed(HTMLAttributes.url) ?? HTMLAttributes.src
|
|
73
|
+
},
|
|
74
|
+
''
|
|
75
|
+
]
|
|
76
|
+
],
|
|
77
|
+
[
|
|
78
|
+
'script',
|
|
79
|
+
{
|
|
80
|
+
async: true,
|
|
81
|
+
src: 'https://platform.twitter.com/widgets.js',
|
|
82
|
+
charset: 'utf-8'
|
|
83
|
+
}
|
|
84
|
+
]
|
|
65
85
|
]
|
|
66
|
-
],
|
|
67
|
-
[
|
|
68
|
-
'script',
|
|
69
|
-
{
|
|
70
|
-
async: true,
|
|
71
|
-
src: 'https://platform.twitter.com/widgets.js',
|
|
72
|
-
charset: 'utf-8'
|
|
73
|
-
}
|
|
74
86
|
]
|
|
75
87
|
];
|
|
76
88
|
},
|
|
@@ -82,13 +94,8 @@ export const Twitter = Node.create({
|
|
|
82
94
|
insertTwitter: (url, className)=>({ commands, state })=>{
|
|
83
95
|
let formattedUrl = url;
|
|
84
96
|
if (url) {
|
|
85
|
-
|
|
86
|
-
if (tweetMatch) {
|
|
87
|
-
const [_, username, tweetId] = tweetMatch;
|
|
88
|
-
formattedUrl = `https://twitter.com/${username}/status/${tweetId}`;
|
|
89
|
-
}
|
|
97
|
+
formattedUrl = convertYoutubeUrlToEmbed(url);
|
|
90
98
|
}
|
|
91
|
-
console.log('URL', url);
|
|
92
99
|
return commands.insertContent({
|
|
93
100
|
type: 'twitter',
|
|
94
101
|
attrs: {
|
|
@@ -101,6 +108,20 @@ export const Twitter = Node.create({
|
|
|
101
108
|
};
|
|
102
109
|
}
|
|
103
110
|
});
|
|
111
|
+
function convertYoutubeUrlToEmbed(url) {
|
|
112
|
+
if (!url) return undefined;
|
|
113
|
+
try {
|
|
114
|
+
let formattedUrl;
|
|
115
|
+
const tweetMatch = url.match(/(?:twitter\.com|x\.com)\/([^\/]+)\/status\/(\d+)/);
|
|
116
|
+
if (tweetMatch) {
|
|
117
|
+
const [_, username, tweetId] = tweetMatch;
|
|
118
|
+
formattedUrl = `https://twitter.com/${username}/status/${tweetId}`;
|
|
119
|
+
}
|
|
120
|
+
return formattedUrl ? formattedUrl : undefined;
|
|
121
|
+
} catch {
|
|
122
|
+
return undefined;
|
|
123
|
+
}
|
|
124
|
+
}
|
|
104
125
|
function isValidHttpUrl(string) {
|
|
105
126
|
let url;
|
|
106
127
|
try {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.ts"],"sourcesContent":["declare module '@tiptap/core' {\n interface Commands<ReturnType> {\n twitter: {\n /**\n * Add an image\n */\n\n insertTwitter: (url?: string, className?: string) => ReturnType\n }\n }\n}\n\nimport { Node, PasteRule, markPasteRule, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport TwitterEmbed from './TwitterEmbed.js'\n\nexport const Twitter = Node.create({\n name: 'twitter',\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=\"twitter\"]',\n },\n ]\n },\n\n addAttributes() {\n return {\n url: { default: null },\n src: { default: null },\n class: { 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\": \"twitter\" }),\n // 0,\n // ];\n // },\n renderHTML({ HTMLAttributes }) {\n
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Twitter/twitter.ts"],"sourcesContent":["declare module '@tiptap/core' {\n interface Commands<ReturnType> {\n twitter: {\n /**\n * Add an image\n */\n\n insertTwitter: (url?: string, className?: string) => ReturnType\n }\n }\n}\n\nimport { Node, PasteRule, markPasteRule, mergeAttributes } from '@tiptap/core'\nimport { ReactNodeViewRenderer } from '@tiptap/react'\nimport TwitterEmbed from './TwitterEmbed.js'\n\nexport const Twitter = Node.create({\n name: 'twitter',\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=\"twitter\"]',\n },\n ]\n },\n\n addAttributes() {\n return {\n url: { default: null },\n src: { default: null },\n class: { 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\": \"twitter\" }),\n // 0,\n // ];\n // },\n renderHTML({ HTMLAttributes }) {\n return [\n \"div\",\n mergeAttributes(HTMLAttributes, {\n \"data-type\": \"twitter\",\n class: `react-renderer node-twitter ${HTMLAttributes.class ?? \"\"}`,\n }), [\n 'div',\n mergeAttributes(\n { class: 'socialMediaContainer' },\n ),\n ['div', mergeAttributes({ class: 'rsme-embed rsme-twitter-embed', style: 'overflow: hidden; width: 325px; border-radius: 12px;' }),\n\n [\n 'blockquote',\n { class: 'twitter-tweet' },\n ['a', { href: convertYoutubeUrlToEmbed(HTMLAttributes.url) ?? HTMLAttributes.src }, ''],\n ],\n [\n 'script',\n {\n async: true,\n src: 'https://platform.twitter.com/widgets.js',\n charset: 'utf-8',\n },\n ],\n ]\n ]\n ]\n },\n\n addNodeView() {\n return ReactNodeViewRenderer(TwitterEmbed)\n },\n\n addCommands() {\n return {\n insertTwitter:\n (url, className) =>\n ({ commands, state }) => {\n let formattedUrl = url\n if (url) {\n\n formattedUrl = convertYoutubeUrlToEmbed(url)\n }\n return commands.insertContent({\n type: 'twitter',\n attrs: {\n url: url,\n class: className,\n src: formattedUrl,\n },\n })\n },\n }\n },\n})\n\nfunction convertYoutubeUrlToEmbed(url: string): string | undefined {\n if (!url) return undefined;\n try {\n let formattedUrl\n const tweetMatch = url.match(/(?:twitter\\.com|x\\.com)\\/([^\\/]+)\\/status\\/(\\d+)/)\n if (tweetMatch) {\n const [_, username, tweetId] = tweetMatch\n formattedUrl = `https://twitter.com/${username}/status/${tweetId}`\n }\n return formattedUrl ? formattedUrl : undefined;\n } catch {\n return undefined;\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","TwitterEmbed","Twitter","create","name","group","content","draggable","parseHTML","tag","addAttributes","url","default","src","class","addKeyboardShortcuts","editor","chain","insertContentAt","state","selection","head","type","focus","run","renderHTML","HTMLAttributes","style","href","convertYoutubeUrlToEmbed","async","charset","addNodeView","addCommands","insertTwitter","className","commands","formattedUrl","insertContent","attrs","undefined","tweetMatch","match","_","username","tweetId","isValidHttpUrl","string","URL","protocol"],"mappings":"AAYA,SAASA,IAAI,EAA4BC,eAAe,QAAQ,eAAc;AAC9E,SAASC,qBAAqB,QAAQ,gBAAe;AACrD,OAAOC,kBAAkB,oBAAmB;AAE5C,OAAO,MAAMC,UAAUJ,KAAKK,MAAM,CAAC;IACjCC,MAAM;IAENC,OAAO;IACPC,SAAS;IACTC,WAAW;IAEX,sBAAsB;IAEtBC;QACE,OAAO;YACL;gBACEC,KAAK;YACP;SACD;IACH;IAEAC;QACE,OAAO;YACLC,KAAK;gBAAEC,SAAS;YAAK;YACrBC,KAAK;gBAAED,SAAS;YAAK;YACrBE,OAAO;gBAAEF,SAAS;YAAK;QACzB;IACF;IAEAG;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,CAAClB,IAAI;gBACtB,GACCmB,KAAK,GACLC,GAAG;YACR;QACF;IACF;IAEA,mCAAmC;IACnC,aAAa;IACb,aAAa;IACb,mEAAmE;IACnE,SAAS;IACT,OAAO;IACP,KAAK;IACLC,YAAW,EAAEC,cAAc,EAAE;QAC3B,OAAO;YACL;YACA3B,gBAAgB2B,gBAAgB;gBAC9B,aAAa;gBACbZ,OAAO,CAAC,4BAA4B,EAAEY,eAAeZ,KAAK,IAAI,GAAG,CAAC;YACpE;YAAI;gBACF;gBACAf,gBACE;oBAAEe,OAAO;gBAAuB;gBAElC;oBAAC;oBAAOf,gBAAgB;wBAAEe,OAAO;wBAAiCa,OAAO;oBAAuD;oBAE9H;wBACE;wBACA;4BAAEb,OAAO;wBAAgB;wBACzB;4BAAC;4BAAK;gCAAEc,MAAMC,yBAAyBH,eAAef,GAAG,KAAKe,eAAeb,GAAG;4BAAC;4BAAG;yBAAG;qBACxF;oBACD;wBACE;wBACA;4BACEiB,OAAO;4BACPjB,KAAK;4BACLkB,SAAS;wBACX;qBACD;iBACF;aACF;SACF;IACH;IAEAC;QACE,OAAOhC,sBAAsBC;IAC/B;IAEAgC;QACE,OAAO;YACLC,eACE,CAACvB,KAAKwB,YACJ,CAAC,EAAEC,QAAQ,EAAEjB,KAAK,EAAE;oBAClB,IAAIkB,eAAe1B;oBACnB,IAAIA,KAAK;wBAEP0B,eAAeR,yBAAyBlB;oBAC1C;oBACA,OAAOyB,SAASE,aAAa,CAAC;wBAC5BhB,MAAM;wBACNiB,OAAO;4BACL5B,KAAKA;4BACLG,OAAOqB;4BACPtB,KAAKwB;wBACP;oBACF;gBACF;QACN;IACF;AACF,GAAE;AAEF,SAASR,yBAAyBlB,GAAW;IAC3C,IAAI,CAACA,KAAK,OAAO6B;IACjB,IAAI;QACF,IAAIH;QACJ,MAAMI,aAAa9B,IAAI+B,KAAK,CAAC;QAC7B,IAAID,YAAY;YACd,MAAM,CAACE,GAAGC,UAAUC,QAAQ,GAAGJ;YAC/BJ,eAAe,CAAC,oBAAoB,EAAEO,SAAS,QAAQ,EAAEC,QAAQ,CAAC;QACpE;QACA,OAAOR,eAAeA,eAAeG;IACvC,EAAE,OAAM;QACN,OAAOA;IACT;AACF;AACA,SAASM,eAAeC,MAAc;IACpC,IAAIpC;IAEJ,IAAI;QACFA,MAAM,IAAIqC,IAAID;IAChB,EAAE,OAAOJ,GAAG;QACV,OAAO;IACT;IAEA,OAAOhC,IAAIsC,QAAQ,KAAK,WAAWtC,IAAIsC,QAAQ,KAAK;AACtD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"youtube.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Youtube/youtube.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,OAAO,EAAE;YACP;;eAEG;YAEH,aAAa,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAChE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAA6C,MAAM,cAAc,CAAA;AAI9E,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"youtube.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Youtube/youtube.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,OAAO,EAAE;YACP;;eAEG;YAEH,aAAa,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAA;SAChE,CAAA;KACF;CACF;AAED,OAAO,EAAE,IAAI,EAA6C,MAAM,cAAc,CAAA;AAI9E,eAAO,MAAM,OAAO,gBAgGlB,CAAA"}
|