payload-richtext-tiptap 0.0.29 → 0.0.31
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/Instagram/InstagramEmbed.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.js +2 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.js.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.js +3 -2
- package/dist/src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.js.map +1 -1
- package/dist/src/fields/TiptapEditor/features/BlockEditor/BlockEditor.d.ts +0 -1
- package/dist/src/fields/TiptapEditor/features/BlockEditor/BlockEditor.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/features/BlockEditor/BlockEditor.js +0 -1
- package/dist/src/fields/TiptapEditor/features/BlockEditor/BlockEditor.js.map +1 -1
- package/dist/src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.js +5 -4
- package/dist/src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.js.map +1 -1
- package/dist/src/styles.css +2126 -2648
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InstagramEmbed.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"InstagramEmbed.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.tsx"],"names":[],"mappings":"gCAKuB;IAAE,IAAI,EAAE;QAAE,KAAK,EAAE;YAAE,GAAG,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAA;CAAE;AAA5D,wBAeE"}
|
|
@@ -2,13 +2,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { Instagram } from "lucide-react";
|
|
3
3
|
import { InstagramEmbed } from "react-social-media-embed";
|
|
4
4
|
import SocialMediaEmbed from "../SocialMediaEmbed.js";
|
|
5
|
+
import { twj } from "tw-to-css";
|
|
5
6
|
export default ((props)=>{
|
|
6
7
|
return /*#__PURE__*/ _jsx(SocialMediaEmbed, {
|
|
7
8
|
props: props,
|
|
8
9
|
Icon: Instagram,
|
|
9
10
|
text: "Embed a post from Instagram",
|
|
10
11
|
children: /*#__PURE__*/ _jsx(InstagramEmbed, {
|
|
11
|
-
|
|
12
|
+
style: twj("max-w-[328px]"),
|
|
12
13
|
url: props?.node?.attrs?.url ?? "",
|
|
13
14
|
width: 328,
|
|
14
15
|
captioned: true
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.tsx"],"sourcesContent":["import { Instagram } from \"lucide-react\";\nimport { InstagramEmbed } from \"react-social-media-embed\";\nimport SocialMediaEmbed from \"../SocialMediaEmbed.js\";\n\nexport default (props: { node: { attrs: { url?: string } } }) => {\n return (\n <SocialMediaEmbed\n props={props}\n Icon={Instagram}\n text={\"Embed a post from Instagram\"}\n >\n <InstagramEmbed\n
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/Instagram/InstagramEmbed.tsx"],"sourcesContent":["import { Instagram } from \"lucide-react\";\nimport { InstagramEmbed } from \"react-social-media-embed\";\nimport SocialMediaEmbed from \"../SocialMediaEmbed.js\";\nimport { twj } from \"tw-to-css\";\n\nexport default (props: { node: { attrs: { url?: string } } }) => {\n return (\n <SocialMediaEmbed\n props={props}\n Icon={Instagram}\n text={\"Embed a post from Instagram\"}\n >\n <InstagramEmbed\n style={twj(\"max-w-[328px]\")}\n url={props?.node?.attrs?.url ?? \"\"}\n width={328}\n captioned\n />\n </SocialMediaEmbed>\n );\n};\n"],"names":["Instagram","InstagramEmbed","SocialMediaEmbed","twj","props","Icon","text","style","url","node","attrs","width","captioned"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,SAAS,QAAQ,eAAe;AACzC,SAASC,cAAc,QAAQ,2BAA2B;AAC1D,OAAOC,sBAAsB,yBAAyB;AACtD,SAASC,GAAG,QAAQ,YAAY;AAEhC,eAAe,CAAA,CAACC;IACd,qBACE,KAACF;QACCE,OAAOA;QACPC,MAAML;QACNM,MAAM;kBAEN,cAAA,KAACL;YACCM,OAAOJ,IAAI;YACXK,KAAKJ,OAAOK,MAAMC,OAAOF,OAAO;YAChCG,OAAO;YACPC,SAAS;;;AAIjB,CAAA,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SocialMediaEmbed.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SocialMediaEmbed.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.tsx"],"names":[],"mappings":"0DAGiD,GAAG;AAApD,wBA6CE"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { NodeViewContent, NodeViewWrapper } from "@tiptap/react";
|
|
3
|
+
import { twj } from "tw-to-css";
|
|
3
4
|
export default (({ props, children, Icon, text })=>{
|
|
4
5
|
return /*#__PURE__*/ _jsx(NodeViewWrapper, {
|
|
5
6
|
className: "react-component",
|
|
@@ -16,7 +17,7 @@ export default (({ props, children, Icon, text })=>{
|
|
|
16
17
|
width: "100%"
|
|
17
18
|
},
|
|
18
19
|
children: !props?.node?.attrs?.url ?? "" ? /*#__PURE__*/ _jsxs("div", {
|
|
19
|
-
|
|
20
|
+
style: twj("w-full bg-zinc-100 py-8 px-6 flex items-center justify-center gap-2 socialMediaCard"),
|
|
20
21
|
draggable: "true",
|
|
21
22
|
"data-drag-handle": "",
|
|
22
23
|
contentEditable: "false",
|
|
@@ -25,8 +26,8 @@ export default (({ props, children, Icon, text })=>{
|
|
|
25
26
|
size: 24
|
|
26
27
|
}),
|
|
27
28
|
/*#__PURE__*/ _jsx("p", {
|
|
28
|
-
className: "w-full flex items-center justify-start mt-0",
|
|
29
29
|
style: {
|
|
30
|
+
...twj("w-full flex items-center justify-start mt-0"),
|
|
30
31
|
marginTop: 0
|
|
31
32
|
},
|
|
32
33
|
children: text
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.tsx"],"sourcesContent":["import { NodeViewContent, NodeViewWrapper } from \"@tiptap/react\";\n\nexport default ({ props, children, Icon, text }: any) => {\n return (\n <NodeViewWrapper\n className=\"react-component\"\n onClick={() => {\n props.editor.commands.setNodeSelection(props.getPos());\n }}\n >\n <NodeViewContent contentEditable=\"false\" className=\"socialMediaContainer\">\n {props?.node.type.spec.draggable ? (\n <div draggable=\"true\" data-drag-handle=\"\" style={{ width: \"100%\" }}>\n {!props?.node?.attrs?.url ?? \"\" ? (\n <div\n
|
|
1
|
+
{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/SocialMedia/SocialMediaEmbed.tsx"],"sourcesContent":["import { NodeViewContent, NodeViewWrapper } from \"@tiptap/react\";\nimport { twj } from \"tw-to-css\";\n\nexport default ({ props, children, Icon, text }: any) => {\n return (\n <NodeViewWrapper\n className=\"react-component\"\n onClick={() => {\n props.editor.commands.setNodeSelection(props.getPos());\n }}\n >\n <NodeViewContent contentEditable=\"false\" className=\"socialMediaContainer\">\n {props?.node.type.spec.draggable ? (\n <div draggable=\"true\" data-drag-handle=\"\" style={{ width: \"100%\" }}>\n {!props?.node?.attrs?.url ?? \"\" ? (\n <div\n style={twj(\n \"w-full bg-zinc-100 py-8 px-6 flex items-center justify-center gap-2 socialMediaCard\"\n )}\n draggable=\"true\"\n data-drag-handle=\"\"\n contentEditable=\"false\"\n >\n <Icon size={24} />\n <p\n style={{\n ...twj(\"w-full flex items-center justify-start mt-0\"),\n marginTop: 0,\n }}\n >\n {text}\n </p>\n </div>\n ) : (\n <div\n style={{ display: \"flex\", justifyContent: \"center\" }}\n draggable=\"true\"\n data-drag-handle=\"\"\n contentEditable=\"false\"\n >\n {children}\n </div>\n )}\n </div>\n ) : null}\n </NodeViewContent>\n </NodeViewWrapper>\n );\n};\n"],"names":["NodeViewContent","NodeViewWrapper","twj","props","children","Icon","text","className","onClick","editor","commands","setNodeSelection","getPos","contentEditable","node","type","spec","draggable","div","data-drag-handle","style","width","attrs","url","size","p","marginTop","display","justifyContent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,eAAe,EAAEC,eAAe,QAAQ,gBAAgB;AACjE,SAASC,GAAG,QAAQ,YAAY;AAEhC,eAAe,CAAA,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,IAAI,EAAO;IAClD,qBACE,KAACL;QACCM,WAAU;QACVC,SAAS;YACPL,MAAMM,MAAM,CAACC,QAAQ,CAACC,gBAAgB,CAACR,MAAMS,MAAM;QACrD;kBAEA,cAAA,KAACZ;YAAgBa,iBAAgB;YAAQN,WAAU;sBAChDJ,OAAOW,KAAKC,KAAKC,KAAKC,0BACrB,KAACC;gBAAID,WAAU;gBAAOE,oBAAiB;gBAAGC,OAAO;oBAAEC,OAAO;gBAAO;0BAC9D,CAAClB,OAAOW,MAAMQ,OAAOC,OAAO,mBAC3B,MAACL;oBACCE,OAAOlB,IACL;oBAEFe,WAAU;oBACVE,oBAAiB;oBACjBN,iBAAgB;;sCAEhB,KAACR;4BAAKmB,MAAM;;sCACZ,KAACC;4BACCL,OAAO;gCACL,GAAGlB,IAAI,8CAA8C;gCACrDwB,WAAW;4BACb;sCAECpB;;;mCAIL,KAACY;oBACCE,OAAO;wBAAEO,SAAS;wBAAQC,gBAAgB;oBAAS;oBACnDX,WAAU;oBACVE,oBAAiB;oBACjBN,iBAAgB;8BAEfT;;iBAIL;;;AAIZ,CAAA,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlockEditor.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/features/BlockEditor/BlockEditor.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"BlockEditor.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/features/BlockEditor/BlockEditor.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAIzC,eAAO,MAAM,WAAW,8BAA+B,WAAW,gCA+FjE,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -15,7 +15,6 @@ import { useBlockEditor } from "../../hooks/useBlockEditor.js";
|
|
|
15
15
|
import { ContentItemMenu } from "../menus/ContentItemMenu/ContentItemMenu.js";
|
|
16
16
|
import { TextMenu } from "../menus/TextMenu/TextMenu.js";
|
|
17
17
|
import { LinkMenu } from "../menus/index.js";
|
|
18
|
-
import "../../../../styles.css";
|
|
19
18
|
import { twj } from "tw-to-css";
|
|
20
19
|
export const BlockEditor = ({ handleChange, content })=>{
|
|
21
20
|
const menuContainerRef = useRef(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/features/BlockEditor/BlockEditor.tsx"],"sourcesContent":["\"use client\";\nimport { EditorContent } from \"@tiptap/react\";\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport { useLocale } from \"@payloadcms/ui/providers/Locale\";\nimport { useTranslation } from \"@payloadcms/ui/providers/Translation\";\nimport { EditorContext } from \"../../context/EditorContext.js\";\nimport { IframeMenu } from \"../../extensions/Iframe/menus/index.js\";\nimport ImageBlockMenu from \"../../extensions/ImageBlock/components/ImageBlockMenu.js\";\nimport { InsideLinksMenu } from \"../../extensions/InsideLinks/menus/index.js\";\nimport { ColumnsMenu } from \"../../extensions/MultiColumn/menus/ColumnsMenu.js\";\nimport { SocialMediaMenu } from \"../../extensions/SocialMedia/menus/index.js\";\nimport {\n TableColumnMenu,\n TableRowMenu,\n} from \"../../extensions/Table/menus/index.js\";\nimport { useBlockEditor } from \"../../hooks/useBlockEditor.js\";\nimport { Sidebar } from \"../Sidebar/Sidebar.js\";\nimport { ContentItemMenu } from \"../menus/ContentItemMenu/ContentItemMenu.js\";\nimport { TextMenu } from \"../menus/TextMenu/TextMenu.js\";\nimport { LinkMenu } from \"../menus/index.js\";\nimport { TiptapProps } from \"./types.js\";\n\nimport
|
|
1
|
+
{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/features/BlockEditor/BlockEditor.tsx"],"sourcesContent":["\"use client\";\nimport { EditorContent } from \"@tiptap/react\";\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport { useLocale } from \"@payloadcms/ui/providers/Locale\";\nimport { useTranslation } from \"@payloadcms/ui/providers/Translation\";\nimport { EditorContext } from \"../../context/EditorContext.js\";\nimport { IframeMenu } from \"../../extensions/Iframe/menus/index.js\";\nimport ImageBlockMenu from \"../../extensions/ImageBlock/components/ImageBlockMenu.js\";\nimport { InsideLinksMenu } from \"../../extensions/InsideLinks/menus/index.js\";\nimport { ColumnsMenu } from \"../../extensions/MultiColumn/menus/ColumnsMenu.js\";\nimport { SocialMediaMenu } from \"../../extensions/SocialMedia/menus/index.js\";\nimport {\n TableColumnMenu,\n TableRowMenu,\n} from \"../../extensions/Table/menus/index.js\";\nimport { useBlockEditor } from \"../../hooks/useBlockEditor.js\";\nimport { Sidebar } from \"../Sidebar/Sidebar.js\";\nimport { ContentItemMenu } from \"../menus/ContentItemMenu/ContentItemMenu.js\";\nimport { TextMenu } from \"../menus/TextMenu/TextMenu.js\";\nimport { LinkMenu } from \"../menus/index.js\";\nimport { TiptapProps } from \"./types.js\";\n\nimport { twj } from \"tw-to-css\";\n\nexport const BlockEditor = ({ handleChange, content }: TiptapProps) => {\n const menuContainerRef = useRef(null);\n const editorRef = useRef<HTMLDivElement>(null);\n\n const { editor, users, characterCount, leftSidebar } = useBlockEditor({\n content: content,\n handleChange: handleChange,\n });\n\n const { code } = useLocale();\n\n const displayedUsers = users.slice(0, 3);\n\n const providerValue = useMemo(() => {\n return {};\n }, []);\n\n useEffect(() => {\n if (code === \"ar\" || code === \"fa\") {\n editor?.commands?.setTextDirection(\"rtl\");\n editor?.commands?.setContent(\"dwa\");\n }\n }, [code]);\n\n if (!editor) {\n return null;\n }\n const { i18n } = useTranslation();\n\n // Define the content for different languages\n const contentEn = \"للكتابة...\"; // Content for English or default language\n const contentAr = \"انقر هنا للكتابة...\"; // Content for Arabic language\n const contentFa = \"اینجا کلیک کنید تا شروع به نوشتن کنید...\";\n\n /*switch (i18n.language) {\n case 'ar':\n editor.commands.setContent(contentAr)\n break\n case 'fa':\n editor.commands.setContent(contentFa)\n break\n default:\n editor.commands.setContent(contentEn)\n }*/\n\n return (\n <EditorContext.Provider value={providerValue}>\n <div\n lang={i18n.language}\n style={twj(\"flex h-full overflow-visible editor-tiptap\")}\n ref={menuContainerRef}\n >\n {/* <Sidebar\n isOpen={leftSidebar.isOpen}\n onClose={leftSidebar.close}\n editor={editor}\n /> */}\n <div\n style={twj(\n \"relative flex flex-col flex-1 h-full justify-center items-center \"\n )}\n >\n {/* <EditorHeader\n characters={characterCount.characters()}\n users={displayedUsers}\n words={characterCount.words()}\n isSidebarOpen={leftSidebar.isOpen}\n toggleSidebar={leftSidebar.toggle}\n /> */}\n <EditorContent\n editor={editor}\n ref={editorRef}\n lang={i18n.language}\n style={{\n ...twj(\n \"flex-1 overflow-y-visible w-full h-full outline-none outline-offset-0\"\n ),\n outline: \"none\",\n }}\n />\n <ContentItemMenu editor={editor} />\n <LinkMenu editor={editor} appendTo={menuContainerRef} />\n\n <TextMenu editor={editor} />\n <IframeMenu editor={editor} appendTo={menuContainerRef} />\n <SocialMediaMenu editor={editor} appendTo={menuContainerRef} />\n <InsideLinksMenu editor={editor} appendTo={menuContainerRef} />\n <ColumnsMenu editor={editor} appendTo={menuContainerRef} />\n <TableRowMenu editor={editor} appendTo={menuContainerRef} />\n <TableColumnMenu editor={editor} appendTo={menuContainerRef} />\n <ImageBlockMenu editor={editor} appendTo={menuContainerRef} />\n </div>\n </div>\n </EditorContext.Provider>\n );\n};\n\nexport default BlockEditor;\n"],"names":["EditorContent","useEffect","useMemo","useRef","useLocale","useTranslation","EditorContext","IframeMenu","ImageBlockMenu","InsideLinksMenu","ColumnsMenu","SocialMediaMenu","TableColumnMenu","TableRowMenu","useBlockEditor","ContentItemMenu","TextMenu","LinkMenu","twj","BlockEditor","handleChange","content","menuContainerRef","editorRef","editor","users","characterCount","leftSidebar","code","displayedUsers","slice","providerValue","commands","setTextDirection","setContent","i18n","contentEn","contentAr","contentFa","Provider","value","div","lang","language","style","ref","outline","appendTo"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,aAAa,QAAQ,gBAAgB;AAC9C,SAASC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAQ;AAEnD,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,cAAc,QAAQ,uCAAuC;AACtE,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,UAAU,QAAQ,yCAAyC;AACpE,OAAOC,oBAAoB,2DAA2D;AACtF,SAASC,eAAe,QAAQ,8CAA8C;AAC9E,SAASC,WAAW,QAAQ,oDAAoD;AAChF,SAASC,eAAe,QAAQ,8CAA8C;AAC9E,SACEC,eAAe,EACfC,YAAY,QACP,wCAAwC;AAC/C,SAASC,cAAc,QAAQ,gCAAgC;AAE/D,SAASC,eAAe,QAAQ,8CAA8C;AAC9E,SAASC,QAAQ,QAAQ,gCAAgC;AACzD,SAASC,QAAQ,QAAQ,oBAAoB;AAG7C,SAASC,GAAG,QAAQ,YAAY;AAEhC,OAAO,MAAMC,cAAc,CAAC,EAAEC,YAAY,EAAEC,OAAO,EAAe;IAChE,MAAMC,mBAAmBnB,OAAO;IAChC,MAAMoB,YAAYpB,OAAuB;IAEzC,MAAM,EAAEqB,MAAM,EAAEC,KAAK,EAAEC,cAAc,EAAEC,WAAW,EAAE,GAAGb,eAAe;QACpEO,SAASA;QACTD,cAAcA;IAChB;IAEA,MAAM,EAAEQ,IAAI,EAAE,GAAGxB;IAEjB,MAAMyB,iBAAiBJ,MAAMK,KAAK,CAAC,GAAG;IAEtC,MAAMC,gBAAgB7B,QAAQ;QAC5B,OAAO,CAAC;IACV,GAAG,EAAE;IAELD,UAAU;QACR,IAAI2B,SAAS,QAAQA,SAAS,MAAM;YAClCJ,QAAQQ,UAAUC,iBAAiB;YACnCT,QAAQQ,UAAUE,WAAW;QAC/B;IACF,GAAG;QAACN;KAAK;IAET,IAAI,CAACJ,QAAQ;QACX,OAAO;IACT;IACA,MAAM,EAAEW,IAAI,EAAE,GAAG9B;IAEjB,6CAA6C;IAC7C,MAAM+B,YAAY,cAAc,0CAA0C;IAC1E,MAAMC,YAAY,uBAAuB,8BAA8B;IACvE,MAAMC,YAAY;IAElB;;;;;;;;;GASC,GAED,qBACE,KAAChC,cAAciC,QAAQ;QAACC,OAAOT;kBAC7B,cAAA,KAACU;YACCC,MAAMP,KAAKQ,QAAQ;YACnBC,OAAO1B,IAAI;YACX2B,KAAKvB;sBAOL,cAAA,MAACmB;gBACCG,OAAO1B,IACL;;kCAUF,KAAClB;wBACCwB,QAAQA;wBACRqB,KAAKtB;wBACLmB,MAAMP,KAAKQ,QAAQ;wBACnBC,OAAO;4BACL,GAAG1B,IACD,wEACD;4BACD4B,SAAS;wBACX;;kCAEF,KAAC/B;wBAAgBS,QAAQA;;kCACzB,KAACP;wBAASO,QAAQA;wBAAQuB,UAAUzB;;kCAEpC,KAACN;wBAASQ,QAAQA;;kCAClB,KAACjB;wBAAWiB,QAAQA;wBAAQuB,UAAUzB;;kCACtC,KAACX;wBAAgBa,QAAQA;wBAAQuB,UAAUzB;;kCAC3C,KAACb;wBAAgBe,QAAQA;wBAAQuB,UAAUzB;;kCAC3C,KAACZ;wBAAYc,QAAQA;wBAAQuB,UAAUzB;;kCACvC,KAACT;wBAAaW,QAAQA;wBAAQuB,UAAUzB;;kCACxC,KAACV;wBAAgBY,QAAQA;wBAAQuB,UAAUzB;;kCAC3C,KAACd;wBAAegB,QAAQA;wBAAQuB,UAAUzB;;;;;;AAKpD,EAAE;AAEF,eAAeH,YAAY"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IframeLinkEditorPanel.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"IframeLinkEditorPanel.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAOrD,MAAM,MAAM,0BAA0B,GAAG;IACvC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,eAAO,MAAM,kBAAkB,+BAG5B,0BAA0B;;;sBAIjB,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC;sBAS1C,KAAK,CAAC,SAAS;CAetB,CAAC;AAEF,eAAO,MAAM,qBAAqB,oDAI/B,0BAA0B,sBAuC5B,CAAC"}
|
package/dist/src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.js
CHANGED
|
@@ -4,6 +4,7 @@ import { Link } from "lucide-react";
|
|
|
4
4
|
import { Button } from "../../ui/Button/Button.js";
|
|
5
5
|
import { Icon } from "../../ui/Icon.js";
|
|
6
6
|
import { Surface } from "../../ui/Surface.js";
|
|
7
|
+
import { twj } from "tw-to-css";
|
|
7
8
|
export const useLinkEditorState = ({ initialSrc, onSetLink })=>{
|
|
8
9
|
const [url, setUrl] = useState(initialSrc || "");
|
|
9
10
|
const onChange = useCallback((event)=>{
|
|
@@ -33,19 +34,19 @@ export const IframeLinkEditorPanel = ({ onSetLink, initialOpenInNewTab, initialS
|
|
|
33
34
|
initialSrc
|
|
34
35
|
});
|
|
35
36
|
return /*#__PURE__*/ _jsx(Surface, {
|
|
36
|
-
|
|
37
|
+
style: twj("p-2"),
|
|
37
38
|
children: /*#__PURE__*/ _jsxs("div", {
|
|
38
|
-
|
|
39
|
+
style: twj("flex items-center gap-2"),
|
|
39
40
|
children: [
|
|
40
41
|
/*#__PURE__*/ _jsxs("label", {
|
|
41
|
-
|
|
42
|
+
style: twj("flex items-center gap-2 p-2 rounded-lg bg-neutral-100 dark:bg-neutral-900 cursor-text"),
|
|
42
43
|
children: [
|
|
43
44
|
/*#__PURE__*/ _jsx(Icon, {
|
|
44
45
|
icon: Link,
|
|
45
46
|
className: "flex-none text-black dark:text-white"
|
|
46
47
|
}),
|
|
47
48
|
/*#__PURE__*/ _jsx("textarea", {
|
|
48
|
-
|
|
49
|
+
style: twj("flex-1 bg-transparent outline-none min-w-[12rem] text-black text-sm dark:text-white"),
|
|
49
50
|
placeholder: "Enter Embed Code",
|
|
50
51
|
value: state.url,
|
|
51
52
|
onChange: state.onChange
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { Link } from \"lucide-react\";\nimport { Button } from \"../../ui/Button/Button.js\";\nimport { Icon } from \"../../ui/Icon.js\";\nimport { Surface } from \"../../ui/Surface.js\";\n\nexport type IframeLinkEditorPanelProps = {\n initialSrc?: string;\n initialOpenInNewTab?: boolean;\n onSetLink: (src: string) => void;\n};\n\nexport const useLinkEditorState = ({\n initialSrc,\n onSetLink,\n}: IframeLinkEditorPanelProps) => {\n const [url, setUrl] = useState(initialSrc || \"\");\n\n const onChange = useCallback(\n (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n setUrl(event.target.value);\n },\n []\n );\n\n // const isValidUrl = useMemo(() => /^(\\S+):(\\/\\/)?\\S+$/.test(url), [url]);\n\n const handleSubmit = useCallback(\n (e: React.FormEvent) => {\n e.preventDefault();\n // if (isValidUrl) {\n onSetLink(url);\n // }\n },\n [url, onSetLink]\n );\n\n return {\n url,\n setUrl,\n onChange,\n handleSubmit,\n };\n};\n\nexport const IframeLinkEditorPanel = ({\n onSetLink,\n initialOpenInNewTab,\n initialSrc,\n}: IframeLinkEditorPanelProps) => {\n const state = useLinkEditorState({\n onSetLink,\n initialOpenInNewTab,\n initialSrc,\n });\n\n return (\n <Surface
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/features/panels/IframeLinkEditorPanel/IframeLinkEditorPanel.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { Link } from \"lucide-react\";\nimport { Button } from \"../../ui/Button/Button.js\";\nimport { Icon } from \"../../ui/Icon.js\";\nimport { Surface } from \"../../ui/Surface.js\";\nimport { twj } from \"tw-to-css\";\n\nexport type IframeLinkEditorPanelProps = {\n initialSrc?: string;\n initialOpenInNewTab?: boolean;\n onSetLink: (src: string) => void;\n};\n\nexport const useLinkEditorState = ({\n initialSrc,\n onSetLink,\n}: IframeLinkEditorPanelProps) => {\n const [url, setUrl] = useState(initialSrc || \"\");\n\n const onChange = useCallback(\n (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n setUrl(event.target.value);\n },\n []\n );\n\n // const isValidUrl = useMemo(() => /^(\\S+):(\\/\\/)?\\S+$/.test(url), [url]);\n\n const handleSubmit = useCallback(\n (e: React.FormEvent) => {\n e.preventDefault();\n // if (isValidUrl) {\n onSetLink(url);\n // }\n },\n [url, onSetLink]\n );\n\n return {\n url,\n setUrl,\n onChange,\n handleSubmit,\n };\n};\n\nexport const IframeLinkEditorPanel = ({\n onSetLink,\n initialOpenInNewTab,\n initialSrc,\n}: IframeLinkEditorPanelProps) => {\n const state = useLinkEditorState({\n onSetLink,\n initialOpenInNewTab,\n initialSrc,\n });\n\n return (\n <Surface style={twj(\"p-2\")}>\n <div style={twj(\"flex items-center gap-2\")}>\n <label\n style={twj(\n \"flex items-center gap-2 p-2 rounded-lg bg-neutral-100 dark:bg-neutral-900 cursor-text\"\n )}\n >\n <Icon icon={Link} className=\"flex-none text-black dark:text-white\" />\n <textarea\n style={twj(\n \"flex-1 bg-transparent outline-none min-w-[12rem] text-black text-sm dark:text-white\"\n )}\n placeholder=\"Enter Embed Code\"\n value={state.url}\n onChange={state.onChange}\n />\n </label>\n <Button\n variant=\"primary\"\n buttonSize=\"small\"\n type=\"button\"\n onClick={(e) => {\n state.handleSubmit(e);\n }}\n // disabled={!state.isValidUrl}\n >\n Set Link\n </Button>\n </div>\n </Surface>\n );\n};\n"],"names":["React","useCallback","useState","Link","Button","Icon","Surface","twj","useLinkEditorState","initialSrc","onSetLink","url","setUrl","onChange","event","target","value","handleSubmit","e","preventDefault","IframeLinkEditorPanel","initialOpenInNewTab","state","style","div","label","icon","className","textarea","placeholder","variant","buttonSize","type","onClick"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,OAAOA,SAASC,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AACrD,SAASC,IAAI,QAAQ,eAAe;AACpC,SAASC,MAAM,QAAQ,4BAA4B;AACnD,SAASC,IAAI,QAAQ,mBAAmB;AACxC,SAASC,OAAO,QAAQ,sBAAsB;AAC9C,SAASC,GAAG,QAAQ,YAAY;AAQhC,OAAO,MAAMC,qBAAqB,CAAC,EACjCC,UAAU,EACVC,SAAS,EACkB;IAC3B,MAAM,CAACC,KAAKC,OAAO,GAAGV,SAASO,cAAc;IAE7C,MAAMI,WAAWZ,YACf,CAACa;QACCF,OAAOE,MAAMC,MAAM,CAACC,KAAK;IAC3B,GACA,EAAE;IAGJ,2EAA2E;IAE3E,MAAMC,eAAehB,YACnB,CAACiB;QACCA,EAAEC,cAAc;QAChB,oBAAoB;QACpBT,UAAUC;IACV,IAAI;IACN,GACA;QAACA;QAAKD;KAAU;IAGlB,OAAO;QACLC;QACAC;QACAC;QACAI;IACF;AACF,EAAE;AAEF,OAAO,MAAMG,wBAAwB,CAAC,EACpCV,SAAS,EACTW,mBAAmB,EACnBZ,UAAU,EACiB;IAC3B,MAAMa,QAAQd,mBAAmB;QAC/BE;QACAW;QACAZ;IACF;IAEA,qBACE,KAACH;QAAQiB,OAAOhB,IAAI;kBAClB,cAAA,MAACiB;YAAID,OAAOhB,IAAI;;8BACd,MAACkB;oBACCF,OAAOhB,IACL;;sCAGF,KAACF;4BAAKqB,MAAMvB;4BAAMwB,WAAU;;sCAC5B,KAACC;4BACCL,OAAOhB,IACL;4BAEFsB,aAAY;4BACZb,OAAOM,MAAMX,GAAG;4BAChBE,UAAUS,MAAMT,QAAQ;;;;8BAG5B,KAACT;oBACC0B,SAAQ;oBACRC,YAAW;oBACXC,MAAK;oBACLC,SAAS,CAACf;wBACRI,MAAML,YAAY,CAACC;oBACrB;8BAED;;;;;AAMT,EAAE"}
|