payload-richtext-tiptap 0.0.41 → 0.0.42

package/dist/src/fields/TiptapEditor/extensions/AICommand/MenuList.js

@@ -0,0 +1,123 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { DropdownButton } from "../../features/ui/Dropdown/Dropdown.js";
+import { Surface } from "../../features/ui/Surface.js";
+import { Icon } from "../../features/ui/Icon.js";
+export const MenuList = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const scrollContainer = useRef(null);
+    const activeItem = useRef(null);
+    const [selectedGroupIndex, setSelectedGroupIndex] = useState(0);
+    const [selectedCommandIndex, setSelectedCommandIndex] = useState(0);
+    // Anytime the groups change, i.e. the user types to narrow it down, we want to
+    // reset the current selection to the first menu item
+    useEffect(()=>{
+        setSelectedGroupIndex(0);
+        setSelectedCommandIndex(0);
+    }, [
+        props.items
+    ]);
+    const selectItem = useCallback((groupIndex, commandIndex)=>{
+        const command = props.items[groupIndex].commands[commandIndex];
+        props.command(command);
+    }, [
+        props
+    ]);
+    React.useImperativeHandle(ref, ()=>({
+            onKeyDown: ({ event })=>{
+                if (event.key === "ArrowDown") {
+                    if (!props.items.length) {
+                        return false;
+                    }
+                    const commands = props.items[selectedGroupIndex].commands;
+                    let newCommandIndex = selectedCommandIndex + 1;
+                    let newGroupIndex = selectedGroupIndex;
+                    if (commands.length - 1 < newCommandIndex) {
+                        newCommandIndex = 0;
+                        newGroupIndex = selectedGroupIndex + 1;
+                    }
+                    if (props.items.length - 1 < newGroupIndex) {
+                        newGroupIndex = 0;
+                    }
+                    setSelectedCommandIndex(newCommandIndex);
+                    setSelectedGroupIndex(newGroupIndex);
+                    return true;
+                }
+                if (event.key === "ArrowUp") {
+                    if (!props.items.length) {
+                        return false;
+                    }
+                    let newCommandIndex = selectedCommandIndex - 1;
+                    let newGroupIndex = selectedGroupIndex;
+                    if (newCommandIndex < 0) {
+                        newGroupIndex = selectedGroupIndex - 1;
+                        newCommandIndex = props.items[newGroupIndex]?.commands.length - 1 || 0;
+                    }
+                    if (newGroupIndex < 0) {
+                        newGroupIndex = props.items.length - 1;
+                        newCommandIndex = props.items[newGroupIndex].commands.length - 1;
+                    }
+                    setSelectedCommandIndex(newCommandIndex);
+                    setSelectedGroupIndex(newGroupIndex);
+                    return true;
+                }
+                if (event.key === "Enter") {
+                    if (!props.items.length || selectedGroupIndex === -1 || selectedCommandIndex === -1) {
+                        return false;
+                    }
+                    selectItem(selectedGroupIndex, selectedCommandIndex);
+                    return true;
+                }
+                return false;
+            }
+        }));
+    useEffect(()=>{
+        if (activeItem.current && scrollContainer.current) {
+            const offsetTop = activeItem.current.offsetTop;
+            const offsetHeight = activeItem.current.offsetHeight;
+            scrollContainer.current.scrollTop = offsetTop - offsetHeight;
+        }
+    }, [
+        selectedCommandIndex,
+        selectedGroupIndex
+    ]);
+    const createCommandClickHandler = useCallback((groupIndex, commandIndex)=>{
+        return ()=>{
+            selectItem(groupIndex, commandIndex);
+        };
+    }, [
+        selectItem
+    ]);
+    if (!props.items.length) {
+        return null;
+    }
+    return /*#__PURE__*/ _jsx(Surface, {
+        ref: scrollContainer,
+        className: "text-black max-h-[min(80vh,24rem)] overflow-auto flex-wrap mb-8 p-2",
+        children: /*#__PURE__*/ _jsx("div", {
+            className: "grid grid-cols-1 gap-0.5",
+            children: props.items.map((group, groupIndex)=>/*#__PURE__*/ _jsxs(React.Fragment, {
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "text-neutral-500 text-[0.65rem] col-[1/-1] mx-2 mt-4 font-semibold tracking-wider select-none uppercase first:mt-0.5",
+                            children: group.title
+                        }, `${group.title}`),
+                        group.commands.map((command, commandIndex)=>/*#__PURE__*/ _jsxs(DropdownButton, {
+                                isActive: selectedGroupIndex === groupIndex && selectedCommandIndex === commandIndex,
+                                onClick: createCommandClickHandler(groupIndex, commandIndex),
+                                children: [
+                                    /*#__PURE__*/ _jsx(Icon, {
+                                        icon: command.icon,
+                                        className: "mr-1"
+                                    }),
+                                    command.label
+                                ]
+                            }, `${command.label}`))
+                    ]
+                }, `${group.title}-wrapper`))
+        })
+    });
+});
+MenuList.displayName = "MenuList";
+export default MenuList;
+
+//# sourceMappingURL=MenuList.js.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/MenuList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/MenuList.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { DropdownButton } from \"../../features/ui/Dropdown/Dropdown.js\";\nimport { Surface } from \"../../features/ui/Surface.js\";\nimport { Command, MenuListProps } from \"./types.js\";\n\nimport { Icon } from \"../../features/ui/Icon.js\";\n\nexport const MenuList = React.forwardRef((props: MenuListProps, ref) => {\n  const scrollContainer = useRef<HTMLDivElement>(null);\n  const activeItem = useRef<HTMLButtonElement>(null);\n  const [selectedGroupIndex, setSelectedGroupIndex] = useState(0);\n  const [selectedCommandIndex, setSelectedCommandIndex] = useState(0);\n\n  // Anytime the groups change, i.e. the user types to narrow it down, we want to\n  // reset the current selection to the first menu item\n  useEffect(() => {\n    setSelectedGroupIndex(0);\n    setSelectedCommandIndex(0);\n  }, [props.items]);\n\n  const selectItem = useCallback(\n    (groupIndex: number, commandIndex: number) => {\n      const command = props.items[groupIndex].commands[commandIndex];\n      props.command(command);\n    },\n    [props]\n  );\n\n  React.useImperativeHandle(ref, () => ({\n    onKeyDown: ({ event }: { event: React.KeyboardEvent }) => {\n      if (event.key === \"ArrowDown\") {\n        if (!props.items.length) {\n          return false;\n        }\n\n        const commands = props.items[selectedGroupIndex].commands;\n\n        let newCommandIndex = selectedCommandIndex + 1;\n        let newGroupIndex = selectedGroupIndex;\n\n        if (commands.length - 1 < newCommandIndex) {\n          newCommandIndex = 0;\n          newGroupIndex = selectedGroupIndex + 1;\n        }\n\n        if (props.items.length - 1 < newGroupIndex) {\n          newGroupIndex = 0;\n        }\n\n        setSelectedCommandIndex(newCommandIndex);\n        setSelectedGroupIndex(newGroupIndex);\n\n        return true;\n      }\n\n      if (event.key === \"ArrowUp\") {\n        if (!props.items.length) {\n          return false;\n        }\n\n        let newCommandIndex = selectedCommandIndex - 1;\n        let newGroupIndex = selectedGroupIndex;\n\n        if (newCommandIndex < 0) {\n          newGroupIndex = selectedGroupIndex - 1;\n          newCommandIndex =\n            props.items[newGroupIndex]?.commands.length - 1 || 0;\n        }\n\n        if (newGroupIndex < 0) {\n          newGroupIndex = props.items.length - 1;\n          newCommandIndex = props.items[newGroupIndex].commands.length - 1;\n        }\n\n        setSelectedCommandIndex(newCommandIndex);\n        setSelectedGroupIndex(newGroupIndex);\n\n        return true;\n      }\n\n      if (event.key === \"Enter\") {\n        if (\n          !props.items.length ||\n          selectedGroupIndex === -1 ||\n          selectedCommandIndex === -1\n        ) {\n          return false;\n        }\n\n        selectItem(selectedGroupIndex, selectedCommandIndex);\n\n        return true;\n      }\n\n      return false;\n    },\n  }));\n\n  useEffect(() => {\n    if (activeItem.current && scrollContainer.current) {\n      const offsetTop = activeItem.current.offsetTop;\n      const offsetHeight = activeItem.current.offsetHeight;\n\n      scrollContainer.current.scrollTop = offsetTop - offsetHeight;\n    }\n  }, [selectedCommandIndex, selectedGroupIndex]);\n\n  const createCommandClickHandler = useCallback(\n    (groupIndex: number, commandIndex: number) => {\n      return () => {\n        selectItem(groupIndex, commandIndex);\n      };\n    },\n    [selectItem]\n  );\n\n  if (!props.items.length) {\n    return null;\n  }\n\n  return (\n    <Surface\n      ref={scrollContainer}\n      className=\"text-black max-h-[min(80vh,24rem)] overflow-auto flex-wrap mb-8 p-2\"\n    >\n      <div className=\"grid grid-cols-1 gap-0.5\">\n        {props.items.map((group, groupIndex: number) => (\n          <React.Fragment key={`${group.title}-wrapper`}>\n            <div\n              className=\"text-neutral-500 text-[0.65rem] col-[1/-1] mx-2 mt-4 font-semibold tracking-wider select-none uppercase first:mt-0.5\"\n              key={`${group.title}`}\n            >\n              {group.title}\n            </div>\n            {group.commands.map((command: Command, commandIndex: number) => (\n              <DropdownButton\n                key={`${command.label}`}\n                isActive={\n                  selectedGroupIndex === groupIndex &&\n                  selectedCommandIndex === commandIndex\n                }\n                onClick={createCommandClickHandler(groupIndex, commandIndex)}\n              >\n                <Icon icon={command.icon} className=\"mr-1\" />\n                {command.label}\n              </DropdownButton>\n            ))}\n          </React.Fragment>\n        ))}\n      </div>\n    </Surface>\n  );\n});\n\nMenuList.displayName = \"MenuList\";\n\nexport default MenuList;\n"],"names":["React","useCallback","useEffect","useRef","useState","DropdownButton","Surface","Icon","MenuList","forwardRef","props","ref","scrollContainer","activeItem","selectedGroupIndex","setSelectedGroupIndex","selectedCommandIndex","setSelectedCommandIndex","items","selectItem","groupIndex","commandIndex","command","commands","useImperativeHandle","onKeyDown","event","key","length","newCommandIndex","newGroupIndex","current","offsetTop","offsetHeight","scrollTop","createCommandClickHandler","className","div","map","group","Fragment","title","isActive","onClick","icon","label","displayName"],"mappings":"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"}

package/dist/src/fields/TiptapEditor/extensions/AICommand/groups.d.ts

@@ -0,0 +1,4 @@
+import { Group } from "./types.js";
+export declare const GROUPS: Group[];
+export default GROUPS;
+//# sourceMappingURL=groups.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/groups.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"groups.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/groups.ts"],"names":[],"mappings":"AAuBA,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,eAAO,MAAM,MAAM,EAAE,KAAK,EA8PzB,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/AICommand/groups.js

@@ -0,0 +1,260 @@
+import { Book, Columns2, Heading1, Heading2, Heading3, Image, Instagram, Link, List, ListOrdered, Minus, Quote, SquareCode, Table, Twitter, Youtube } from "lucide-react";
+export const GROUPS = [
+    {
+        name: "format",
+        title: "Format",
+        commands: [
+            {
+                name: "heading1",
+                label: "Heading 1",
+                icon: Heading1,
+                description: "High priority section title",
+                aliases: [
+                    "h1"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().setHeading({
+                        level: 1
+                    }).run();
+                }
+            },
+            {
+                name: "heading2",
+                label: "Heading 2",
+                icon: Heading2,
+                description: "Medium priority section title",
+                aliases: [
+                    "h2"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().setHeading({
+                        level: 2
+                    }).run();
+                }
+            },
+            {
+                name: "heading3",
+                label: "Heading 3",
+                icon: Heading3,
+                description: "Low priority section title",
+                aliases: [
+                    "h3"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().setHeading({
+                        level: 3
+                    }).run();
+                }
+            },
+            {
+                name: "bulletList",
+                label: "Bullet List",
+                icon: List,
+                description: "Unordered list of items",
+                aliases: [
+                    "ul"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().toggleBulletList().run();
+                }
+            },
+            {
+                name: "numberedList",
+                label: "Numbered List",
+                icon: ListOrdered,
+                description: "Ordered list of items",
+                aliases: [
+                    "ol"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().toggleOrderedList().run();
+                }
+            },
+            // {
+            //   name: 'taskList',
+            //   label: 'Task List',
+            //   icon: ListTodo,
+            //   description: 'Task list with todo items',
+            //   aliases: ['todo'],
+            //   action: (editor) => {
+            //     editor.chain().focus().toggleTaskList().run()
+            //   },
+            // },
+            {
+                name: "blockquote",
+                label: "Blockquote",
+                icon: Quote,
+                description: "Element for quoting",
+                action: (editor)=>{
+                    editor.chain().focus().setBlockquote().run();
+                }
+            },
+            {
+                name: "codeBlock",
+                label: "Code Block",
+                icon: SquareCode,
+                description: "Code block with syntax highlighting",
+                shouldBeHidden: (editor)=>editor.isActive("columns"),
+                action: (editor)=>{
+                    editor.chain().focus().setCodeBlock().run();
+                }
+            }
+        ]
+    },
+    {
+        name: "insert",
+        title: "Insert",
+        commands: [
+            {
+                name: "table",
+                label: "Table",
+                icon: Table,
+                description: "Insert a table",
+                shouldBeHidden: (editor)=>editor.isActive("columns"),
+                action: (editor)=>{
+                    editor.chain().focus().insertTable({
+                        rows: 3,
+                        cols: 3,
+                        withHeaderRow: false
+                    }).run();
+                }
+            },
+            {
+                name: "image",
+                label: "Image",
+                icon: Image,
+                description: "Insert an image",
+                aliases: [
+                    "img"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().setImageUpload().run();
+                }
+            },
+            {
+                name: "columns",
+                label: "Columns",
+                icon: Columns2,
+                description: "Add two column content",
+                aliases: [
+                    "cols"
+                ],
+                shouldBeHidden: (editor)=>editor.isActive("columns"),
+                action: (editor)=>{
+                    editor.chain().focus().setColumns().focus(editor.state.selection.head - 1).run();
+                }
+            },
+            {
+                name: "horizontalRule",
+                label: "Horizontal Rule",
+                icon: Minus,
+                description: "Insert a horizontal divider",
+                aliases: [
+                    "hr"
+                ],
+                action: (editor)=>{
+                    editor.chain().focus().setHorizontalRule().run();
+                }
+            },
+            {
+                name: "toc",
+                label: "Table of Contents",
+                icon: Book,
+                aliases: [
+                    "outline"
+                ],
+                description: "Insert a table of contents",
+                shouldBeHidden: (editor)=>editor.isActive("columns"),
+                action: (editor)=>{
+                    editor.chain().focus().insertTableOfContents().run();
+                }
+            }
+        ]
+    },
+    {
+        name: "embed",
+        title: "Embed",
+        commands: [
+            {
+                name: "iframe",
+                label: "IFrame",
+                icon: Link,
+                aliases: [
+                    "iframe"
+                ],
+                description: "Insert a iframe",
+                shouldBeHidden: (editor)=>editor.isActive("iframe"),
+                action: (editor)=>{
+                    editor.chain().focus().setHtml("<div>Embed your content here</div>").run();
+                }
+            },
+            {
+                name: "twitter",
+                label: "Twitter Embed",
+                icon: Twitter,
+                aliases: [
+                    "x",
+                    "twitter"
+                ],
+                description: "Insert a Twitter embed",
+                shouldBeHidden: (editor)=>editor.isActive("twitter"),
+                action: (editor)=>{
+                    editor.chain().focus().insertTwitter().run();
+                }
+            },
+            // {
+            //   name: 'facebook',
+            //   label: 'Facebook Embed',
+            //   icon: Facebook,
+            //   aliases: ['meta', 'facebook'],
+            //   description: 'Insert a Facebook embed',
+            //   shouldBeHidden: (editor) => editor.isActive('facebook'),
+            //   action: (editor) => {
+            //     editor.chain().focus().insertFacebook().run()
+            //   },
+            // },
+            {
+                name: "instagram",
+                label: "Instagram Embed",
+                icon: Instagram,
+                aliases: [
+                    "instagram"
+                ],
+                description: "Insert a Instagram embed",
+                shouldBeHidden: (editor)=>editor.isActive("instagram"),
+                action: (editor)=>{
+                    editor.chain().focus().insertInstagram().run();
+                }
+            },
+            {
+                name: "youtube",
+                label: "Youtube Embed",
+                icon: Youtube,
+                aliases: [
+                    "youtube"
+                ],
+                description: "Insert a Youtube embed",
+                shouldBeHidden: (editor)=>editor.isActive("youtube"),
+                action: (editor)=>{
+                    editor.chain().focus().insertYoutube().run();
+                }
+            },
+            {
+                name: "insideLinks",
+                label: "TRT Links",
+                icon: Youtube,
+                aliases: [
+                    "insideLinks"
+                ],
+                description: "Link internal content such as articles, videos, shows etc.",
+                shouldBeHidden: (editor)=>editor.isActive("insideLinks"),
+                action: (editor)=>{
+                    editor.chain().focus().insertInsideLinks({}).run();
+                }
+            }
+        ]
+    }
+];
+export default GROUPS;
+
+//# sourceMappingURL=groups.js.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/groups.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/groups.ts"],"sourcesContent":["import {\n  Book,\n  Columns2,\n  Facebook,\n  Heading1,\n  Heading2,\n  Heading3,\n  Image,\n  Instagram,\n  Link,\n  Linkedin,\n  List,\n  ListOrdered,\n  ListTodo,\n  Minus,\n  Music,\n  Quote,\n  SquareCode,\n  Table,\n  Twitch,\n  Twitter,\n  Youtube,\n} from \"lucide-react\";\nimport { Group } from \"./types.js\";\n\nexport const GROUPS: Group[] = [\n  {\n    name: \"format\",\n    title: \"Format\",\n    commands: [\n      {\n        name: \"heading1\",\n        label: \"Heading 1\",\n        icon: Heading1,\n        description: \"High priority section title\",\n        aliases: [\"h1\"],\n        action: (editor) => {\n          editor.chain().focus().setHeading({ level: 1 }).run();\n        },\n      },\n      {\n        name: \"heading2\",\n        label: \"Heading 2\",\n        icon: Heading2,\n        description: \"Medium priority section title\",\n        aliases: [\"h2\"],\n        action: (editor) => {\n          editor.chain().focus().setHeading({ level: 2 }).run();\n        },\n      },\n      {\n        name: \"heading3\",\n        label: \"Heading 3\",\n        icon: Heading3,\n        description: \"Low priority section title\",\n        aliases: [\"h3\"],\n        action: (editor) => {\n          editor.chain().focus().setHeading({ level: 3 }).run();\n        },\n      },\n      {\n        name: \"bulletList\",\n        label: \"Bullet List\",\n        icon: List,\n        description: \"Unordered list of items\",\n        aliases: [\"ul\"],\n        action: (editor) => {\n          editor.chain().focus().toggleBulletList().run();\n        },\n      },\n      {\n        name: \"numberedList\",\n        label: \"Numbered List\",\n        icon: ListOrdered,\n        description: \"Ordered list of items\",\n        aliases: [\"ol\"],\n        action: (editor) => {\n          editor.chain().focus().toggleOrderedList().run();\n        },\n      },\n      // {\n      //   name: 'taskList',\n      //   label: 'Task List',\n      //   icon: ListTodo,\n      //   description: 'Task list with todo items',\n      //   aliases: ['todo'],\n      //   action: (editor) => {\n      //     editor.chain().focus().toggleTaskList().run()\n      //   },\n      // },\n      {\n        name: \"blockquote\",\n        label: \"Blockquote\",\n        icon: Quote,\n        description: \"Element for quoting\",\n        action: (editor) => {\n          editor.chain().focus().setBlockquote().run();\n        },\n      },\n      {\n        name: \"codeBlock\",\n        label: \"Code Block\",\n        icon: SquareCode,\n        description: \"Code block with syntax highlighting\",\n        shouldBeHidden: (editor) => editor.isActive(\"columns\"),\n        action: (editor) => {\n          editor.chain().focus().setCodeBlock().run();\n        },\n      },\n    ],\n  },\n  {\n    name: \"insert\",\n    title: \"Insert\",\n    commands: [\n      {\n        name: \"table\",\n        label: \"Table\",\n        icon: Table,\n        description: \"Insert a table\",\n        shouldBeHidden: (editor) => editor.isActive(\"columns\"),\n        action: (editor) => {\n          editor\n            .chain()\n            .focus()\n            .insertTable({ rows: 3, cols: 3, withHeaderRow: false })\n            .run();\n        },\n      },\n      {\n        name: \"image\",\n        label: \"Image\",\n        icon: Image,\n        description: \"Insert an image\",\n        aliases: [\"img\"],\n        action: (editor) => {\n          editor.chain().focus().setImageUpload().run();\n        },\n      },\n      {\n        name: \"columns\",\n        label: \"Columns\",\n        icon: Columns2,\n        description: \"Add two column content\",\n        aliases: [\"cols\"],\n        shouldBeHidden: (editor) => editor.isActive(\"columns\"),\n        action: (editor) => {\n          editor\n            .chain()\n            .focus()\n            .setColumns()\n            .focus(editor.state.selection.head - 1)\n            .run();\n        },\n      },\n      {\n        name: \"horizontalRule\",\n        label: \"Horizontal Rule\",\n        icon: Minus,\n        description: \"Insert a horizontal divider\",\n        aliases: [\"hr\"],\n        action: (editor) => {\n          editor.chain().focus().setHorizontalRule().run();\n        },\n      },\n      {\n        name: \"toc\",\n        label: \"Table of Contents\",\n        icon: Book,\n        aliases: [\"outline\"],\n        description: \"Insert a table of contents\",\n        shouldBeHidden: (editor) => editor.isActive(\"columns\"),\n        action: (editor) => {\n          editor.chain().focus().insertTableOfContents().run();\n        },\n      },\n    ],\n  },\n  {\n    name: \"embed\",\n    title: \"Embed\",\n    commands: [\n      {\n        name: \"iframe\",\n        label: \"IFrame\",\n        icon: Link,\n        aliases: [\"iframe\"],\n        description: \"Insert a iframe\",\n        shouldBeHidden: (editor) => editor.isActive(\"iframe\"),\n        action: (editor) => {\n          editor\n            .chain()\n            .focus()\n            .setHtml(\"<div>Embed your content here</div>\")\n            .run();\n        },\n      },\n      {\n        name: \"twitter\",\n        label: \"Twitter Embed\",\n        icon: Twitter,\n        aliases: [\"x\", \"twitter\"],\n        description: \"Insert a Twitter embed\",\n        shouldBeHidden: (editor) => editor.isActive(\"twitter\"),\n        action: (editor) => {\n          editor.chain().focus().insertTwitter().run();\n        },\n      },\n      // {\n      //   name: 'facebook',\n      //   label: 'Facebook Embed',\n      //   icon: Facebook,\n      //   aliases: ['meta', 'facebook'],\n      //   description: 'Insert a Facebook embed',\n      //   shouldBeHidden: (editor) => editor.isActive('facebook'),\n      //   action: (editor) => {\n      //     editor.chain().focus().insertFacebook().run()\n      //   },\n      // },\n      {\n        name: \"instagram\",\n        label: \"Instagram Embed\",\n        icon: Instagram,\n        aliases: [\"instagram\"],\n        description: \"Insert a Instagram embed\",\n        shouldBeHidden: (editor) => editor.isActive(\"instagram\"),\n        action: (editor) => {\n          editor.chain().focus().insertInstagram().run();\n        },\n      },\n      {\n        name: \"youtube\",\n        label: \"Youtube Embed\",\n        icon: Youtube,\n        aliases: [\"youtube\"],\n        description: \"Insert a Youtube embed\",\n        shouldBeHidden: (editor) => editor.isActive(\"youtube\"),\n        action: (editor) => {\n          editor.chain().focus().insertYoutube().run();\n        },\n      },\n      {\n        name: \"insideLinks\",\n        label: \"TRT Links\",\n        icon: Youtube,\n        aliases: [\"insideLinks\"],\n        description:\n          \"Link internal content such as articles, videos, shows etc.\",\n        shouldBeHidden: (editor) => editor.isActive(\"insideLinks\"),\n        action: (editor) => {\n          editor.chain().focus().insertInsideLinks({}).run();\n        },\n      },\n      // {\n      //   name: 'linkedin',\n      //   label: 'Linkedin Embed',\n      //   icon: Linkedin,\n      //   aliases: ['linkedin'],\n      //   description: 'Insert a Linkedin embed',\n      //   shouldBeHidden: (editor) => editor.isActive('linkedin'),\n      //   action: (editor) => {\n\n      //     editor.chain().focus().insertLinkedin().run()\n      //   },\n      // },\n\n      // {\n      //   name: 'tiktok',\n      //   label: 'Tiktok Embed',\n      //   icon: Music,\n      //   aliases: ['tiktok'],\n      //   description: 'Insert a Tiktok embed',\n      //   shouldBeHidden: (editor) => editor.isActive('tiktok'),\n      //   action: (editor) => {\n      //     editor.chain().focus().insertTiktok().run()\n      //   },\n      // },\n    ],\n  },\n];\n\nexport default GROUPS;\n"],"names":["Book","Columns2","Heading1","Heading2","Heading3","Image","Instagram","Link","List","ListOrdered","Minus","Quote","SquareCode","Table","Twitter","Youtube","GROUPS","name","title","commands","label","icon","description","aliases","action","editor","chain","focus","setHeading","level","run","toggleBulletList","toggleOrderedList","setBlockquote","shouldBeHidden","isActive","setCodeBlock","insertTable","rows","cols","withHeaderRow","setImageUpload","setColumns","state","selection","head","setHorizontalRule","insertTableOfContents","setHtml","insertTwitter","insertInstagram","insertYoutube","insertInsideLinks"],"mappings":"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"}

package/dist/src/fields/TiptapEditor/extensions/AICommand/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./AICommand.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/AICommand/index.js

@@ -0,0 +1,3 @@
+export * from "./AICommand.js";
+
+//# sourceMappingURL=index.js.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/index.ts"],"sourcesContent":["export * from \"./AICommand.js\";\n"],"names":[],"mappings":"AAAA,cAAc,iBAAiB"}

package/dist/src/fields/TiptapEditor/extensions/AICommand/types.d.ts

@@ -0,0 +1,22 @@
+import { Editor } from "@tiptap/core";
+import { LucideIcon } from "lucide-react";
+export interface Group {
+    name: string;
+    title: string;
+    commands: Command[];
+}
+export interface Command {
+    name: string;
+    label: string;
+    description: string;
+    aliases?: string[];
+    icon: LucideIcon;
+    action: (editor: Editor) => void;
+    shouldBeHidden?: (editor: Editor) => boolean;
+}
+export interface AIMenuListProps {
+    editor: Editor;
+    items: Group[];
+    command: (command: Command) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,WAAW,KAAK;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,EAAE,CAAC;CACrB;AAED,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC;CAC9C;AAED,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,OAAO,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CACrC"}

package/dist/src/fields/TiptapEditor/extensions/AICommand/types.js

@@ -0,0 +1,3 @@
+export { };
+
+//# sourceMappingURL=types.js.map

package/dist/src/fields/TiptapEditor/extensions/AICommand/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/AICommand/types.ts"],"sourcesContent":["import { Editor } from \"@tiptap/core\";\nimport { LucideIcon } from \"lucide-react\";\n\nexport interface Group {\n  name: string;\n  title: string;\n  commands: Command[];\n}\n\nexport interface Command {\n  name: string;\n  label: string;\n  description: string;\n  aliases?: string[];\n  icon: LucideIcon;\n  action: (editor: Editor) => void;\n  shouldBeHidden?: (editor: Editor) => boolean;\n}\n\nexport interface AIMenuListProps {\n  editor: Editor;\n  items: Group[];\n  command: (command: Command) => void;\n}\n"],"names":[],"mappings":"AAmBA,WAIC"}

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

@@ -1 +1 @@
-{"version":3,"file":"ImageUpload.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/ImageUpload.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAyB,MAAM,eAAe,CAAC;AAG5D,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,WAAW,EAAE;YACX,cAAc,EAAE,MAAM,UAAU,CAAC;SAClC,CAAC;KACH;CACF;AAED,eAAO,MAAM,WAAW,gBAuCtB,CAAC;AAEH,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ImageUpload.d.ts","sourceRoot":"","sources":["../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/ImageUpload.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAyB,MAAM,eAAe,CAAC;AAI5D,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,WAAW,EAAE;YACX,cAAc,EAAE,MAAM,UAAU,CAAC;SAClC,CAAC;KACH;CACF;AAED,eAAO,MAAM,WAAW,gBAyCtB,CAAC;AAEH,eAAe,WAAW,CAAC"}

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

@@ -1,5 +1,5 @@
 import { Node, ReactNodeViewRenderer } from "@tiptap/react";
-import { ImageUpload as ImageUploadComponent } from "./view/ImageUpload.js";
+import { ImageUploadBuilder } from "./view/ImageUpload.js";
 export const ImageUpload = Node.create({
     name: "imageUpload",
     isolating: true,
@@ -29,7 +29,8 @@ export const ImageUpload = Node.create({
         };
     },
     addNodeView () {
-        return ReactNodeViewRenderer(ImageUploadComponent);
+        const openAssetHQHandler = this.options.openAssetHQHandler;
+        return ReactNodeViewRenderer(ImageUploadBuilder(openAssetHQHandler));
     }
 });
 export default ImageUpload;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/ImageUpload.ts"],"sourcesContent":["import { Node, ReactNodeViewRenderer } from \"@tiptap/react\";\nimport { ImageUpload as ImageUploadComponent } from \"./view/ImageUpload.js\";\n\ndeclare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    imageUpload: {\n      setImageUpload: () => ReturnType;\n    };\n  }\n}\n\nexport const ImageUpload = Node.create({\n  name: \"imageUpload\",\n\n  isolating: true,\n\n  defining: true,\n\n  group: \"block\",\n\n  draggable: true,\n\n  selectable: true,\n\n  inline: false,\n\n  parseHTML() {\n    return [\n      {\n        tag: `div[data-type=\"${this.name}\"]`,\n      },\n    ];\n  },\n\n  renderHTML() {\n    return [\"div\", { \"data-type\": this.name }];\n  },\n\n  addCommands() {\n    return {\n      setImageUpload:\n        () =>\n        ({ commands }) =>\n          commands.insertContent(`<div data-type=\"${this.name}\"></div>`),\n    };\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(ImageUploadComponent);\n  },\n});\n\nexport default ImageUpload;\n"],"names":["Node","ReactNodeViewRenderer","ImageUpload","ImageUploadComponent","create","name","isolating","defining","group","draggable","selectable","inline","parseHTML","tag","renderHTML","addCommands","setImageUpload","commands","insertContent","addNodeView"],"mappings":"AAAA,SAASA,IAAI,EAAEC,qBAAqB,QAAQ,gBAAgB;AAC5D,SAASC,eAAeC,oBAAoB,QAAQ,wBAAwB;AAU5E,OAAO,MAAMD,cAAcF,KAAKI,MAAM,CAAC;IACrCC,MAAM;IAENC,WAAW;IAEXC,UAAU;IAEVC,OAAO;IAEPC,WAAW;IAEXC,YAAY;IAEZC,QAAQ;IAERC;QACE,OAAO;YACL;gBACEC,KAAK,CAAC,eAAe,EAAE,IAAI,CAACR,IAAI,CAAC,EAAE,CAAC;YACtC;SACD;IACH;IAEAS;QACE,OAAO;YAAC;YAAO;gBAAE,aAAa,IAAI,CAACT,IAAI;YAAC;SAAE;IAC5C;IAEAU;QACE,OAAO;YACLC,gBACE,IACA,CAAC,EAAEC,QAAQ,EAAE,GACXA,SAASC,aAAa,CAAC,CAAC,gBAAgB,EAAE,IAAI,CAACb,IAAI,CAAC,QAAQ,CAAC;QACnE;IACF;IAEAc;QACE,OAAOlB,sBAAsBE;IAC/B;AACF,GAAG;AAEH,eAAeD,YAAY"}
+{"version":3,"sources":["../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/ImageUpload.ts"],"sourcesContent":["import { Node, ReactNodeViewRenderer } from \"@tiptap/react\";\nimport { openAssetHQType } from \"../../types.js\";\nimport { ImageUploadBuilder } from \"./view/ImageUpload.js\";\n\ndeclare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    imageUpload: {\n      setImageUpload: () => ReturnType;\n    };\n  }\n}\n\nexport const ImageUpload = Node.create({\n  name: \"imageUpload\",\n\n  isolating: true,\n\n  defining: true,\n\n  group: \"block\",\n\n  draggable: true,\n\n  selectable: true,\n\n  inline: false,\n\n  parseHTML() {\n    return [\n      {\n        tag: `div[data-type=\"${this.name}\"]`,\n      },\n    ];\n  },\n\n  renderHTML() {\n    return [\"div\", { \"data-type\": this.name }];\n  },\n\n  addCommands() {\n    return {\n      setImageUpload:\n        () =>\n        ({ commands }) =>\n          commands.insertContent(`<div data-type=\"${this.name}\"></div>`),\n    };\n  },\n\n  addNodeView() {\n    const openAssetHQHandler = this.options\n      .openAssetHQHandler as openAssetHQType;\n    return ReactNodeViewRenderer(ImageUploadBuilder(openAssetHQHandler));\n  },\n});\n\nexport default ImageUpload;\n"],"names":["Node","ReactNodeViewRenderer","ImageUploadBuilder","ImageUpload","create","name","isolating","defining","group","draggable","selectable","inline","parseHTML","tag","renderHTML","addCommands","setImageUpload","commands","insertContent","addNodeView","openAssetHQHandler","options"],"mappings":"AAAA,SAASA,IAAI,EAAEC,qBAAqB,QAAQ,gBAAgB;AAE5D,SAASC,kBAAkB,QAAQ,wBAAwB;AAU3D,OAAO,MAAMC,cAAcH,KAAKI,MAAM,CAAC;IACrCC,MAAM;IAENC,WAAW;IAEXC,UAAU;IAEVC,OAAO;IAEPC,WAAW;IAEXC,YAAY;IAEZC,QAAQ;IAERC;QACE,OAAO;YACL;gBACEC,KAAK,CAAC,eAAe,EAAE,IAAI,CAACR,IAAI,CAAC,EAAE,CAAC;YACtC;SACD;IACH;IAEAS;QACE,OAAO;YAAC;YAAO;gBAAE,aAAa,IAAI,CAACT,IAAI;YAAC;SAAE;IAC5C;IAEAU;QACE,OAAO;YACLC,gBACE,IACA,CAAC,EAAEC,QAAQ,EAAE,GACXA,SAASC,aAAa,CAAC,CAAC,gBAAgB,EAAE,IAAI,CAACb,IAAI,CAAC,QAAQ,CAAC;QACnE;IACF;IAEAc;QACE,MAAMC,qBAAqB,IAAI,CAACC,OAAO,CACpCD,kBAAkB;QACrB,OAAOnB,sBAAsBC,mBAAmBkB;IAClD;AACF,GAAG;AAEH,eAAejB,YAAY"}

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.d.ts

@@ -1,7 +1,7 @@
 import { Editor } from "@tiptap/react";
-export declare const ImageUpload: ({ getPos, editor, }: {
+import { openAssetHQType } from "src/fields/TiptapEditor/types.js";
+export declare const ImageUploadBuilder: (openAssetHQHandler: openAssetHQType) => ({ getPos, editor, }: {
     getPos: () => number;
     editor: Editor;
 }) => import("react").JSX.Element;
-export default ImageUpload;
 //# sourceMappingURL=ImageUpload.d.ts.map

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImageUpload.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AAGxD,eAAO,MAAM,WAAW,wBAGrB;IACD,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,gCAsCA,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ImageUpload.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAmB,MAAM,eAAe,CAAC;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACnE,eAAO,MAAM,kBAAkB,uBAAwB,eAAe,2BAIjE;IACD,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,gCAiEF,CAAC"}

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.js

@@ -1,27 +1,44 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { NodeViewWrapper } from "@tiptap/react";
 import { useCallback } from "react";
-export const ImageUpload = ({ getPos, editor })=>{
-    const onUpload = useCallback((url)=>{
-        if (url) {
-            editor.chain().setImageBlock({
-                src: url
-            }).deleteRange({
-                from: getPos(),
-                to: getPos()
-            }).focus().run();
-        }
-    }, [
-        getPos,
-        editor
-    ]);
-    return /*#__PURE__*/ _jsx(NodeViewWrapper, {
-        children: /*#__PURE__*/ _jsx("div", {
-            className: "p-0 m-0",
-            "data-drag-handle": true
-        })
-    });
+export const ImageUploadBuilder = (openAssetHQHandler)=>{
+    const ImageUpload = ({ getPos, editor })=>{
+        const onUpload = useCallback((url)=>{
+            if (url) {
+                editor.chain().focus().setImageBlock({
+                    src: url
+                }).deleteRange({
+                    from: getPos(),
+                    to: getPos()
+                }).focus().run();
+            }
+        }, [
+            getPos,
+            editor
+        ]);
+        return /*#__PURE__*/ _jsx(NodeViewWrapper, {
+            children: /*#__PURE__*/ _jsx("div", {
+                className: "p-0 m-0",
+                "data-drag-handle": true,
+                children: /*#__PURE__*/ _jsx("a", {
+                    href: "#",
+                    style: {
+                        padding: 5,
+                        borderRadius: 5,
+                        backgroundColor: "blue",
+                        color: "white",
+                        cursor: "pointer"
+                    },
+                    onClick: (e)=>{
+                        e.preventDefault();
+                        openAssetHQHandler(onUpload);
+                    },
+                    children: "Upload Image"
+                })
+            })
+        });
+    };
+    return ImageUpload;
 };
-export default ImageUpload;
 
 //# sourceMappingURL=ImageUpload.js.map

package/dist/src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"sourcesContent":["import { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport { useCallback } from \"react\";\n\nexport const ImageUpload = ({\n  getPos,\n  editor,\n}: {\n  getPos: () => number;\n  editor: Editor;\n}) => {\n  const onUpload = useCallback(\n    (url: string) => {\n      if (url) {\n        editor\n          .chain()\n          .setImageBlock({ src: url })\n          .deleteRange({ from: getPos(), to: getPos() })\n          .focus()\n          .run();\n      }\n    },\n    [getPos, editor]\n  );\n\n  return (\n    <NodeViewWrapper>\n      <div className=\"p-0 m-0\" data-drag-handle>\n        {/* <RenderFields\n          fieldMap={[\n            {\n              name: 'thumbnail',\n              type: 'upload',\n\n            },\n          ]}\n          path=\"media\"\n          readOnly={false}\n          schemaPath=\"\"\n          // fieldTypes={fieldTypes}\n          // fields={sidebarFields}\n          // permissions={permissions.fields}\n          // readOnly={!hasSavePermission}\n        /> */}\n        {/* <ImageUploader onUpload={onUpload} /> */}\n      </div>\n    </NodeViewWrapper>\n  );\n};\n\nexport default ImageUpload;\n"],"names":["NodeViewWrapper","useCallback","ImageUpload","getPos","editor","onUpload","url","chain","setImageBlock","src","deleteRange","from","to","focus","run","div","className","data-drag-handle"],"mappings":";AAAA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,SAASC,WAAW,QAAQ,QAAQ;AAEpC,OAAO,MAAMC,cAAc,CAAC,EAC1BC,MAAM,EACNC,MAAM,EAIP;IACC,MAAMC,WAAWJ,YACf,CAACK;QACC,IAAIA,KAAK;YACPF,OACGG,KAAK,GACLC,aAAa,CAAC;gBAAEC,KAAKH;YAAI,GACzBI,WAAW,CAAC;gBAAEC,MAAMR;gBAAUS,IAAIT;YAAS,GAC3CU,KAAK,GACLC,GAAG;QACR;IACF,GACA;QAACX;QAAQC;KAAO;IAGlB,qBACE,KAACJ;kBACC,cAAA,KAACe;YAAIC,WAAU;YAAUC,kBAAgB;;;AAqB/C,EAAE;AAEF,eAAef,YAAY"}
+{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/extensions/ImageUpload/view/ImageUpload.tsx"],"sourcesContent":["import { Editor, NodeViewWrapper } from \"@tiptap/react\";\nimport { useCallback } from \"react\";\nimport { openAssetHQType } from \"src/fields/TiptapEditor/types.js\";\nexport const ImageUploadBuilder = (openAssetHQHandler: openAssetHQType) => {\n  const ImageUpload = ({\n    getPos,\n    editor,\n  }: {\n    getPos: () => number;\n    editor: Editor;\n  }) => {\n    const onUpload = useCallback(\n      (url: string) => {\n        if (url) {\n          editor\n            .chain()\n            .focus()\n            .setImageBlock({ src: url })\n            .deleteRange({ from: getPos(), to: getPos() })\n            .focus()\n            .run();\n        }\n      },\n      [getPos, editor]\n    );\n\n    return (\n      <NodeViewWrapper>\n        <div className=\"p-0 m-0\" data-drag-handle>\n          {/* <RenderFields\n          fieldMap={[\n            {\n              name: \"media\",\n              type: \"upload\",\n              cellComponentProps: {\n                name: \"media\",\n                schemaPath: \"media\",\n              },\n              fieldComponentProps: {},\n              fieldIsPresentational: true,\n              isFieldAffectingData: false,\n              localized: false,\n            },\n          ]}\n          path=\"media\"\n          readOnly={false}\n          schemaPath=\"\"\n          // fieldTypes={fieldTypes}\n          // fields={sidebarFields}\n          // permissions={permissions.fields}\n          // readOnly={!hasSavePermission}\n        /> */}\n          <a\n            href=\"#\"\n            style={{\n              padding: 5,\n              borderRadius: 5,\n              backgroundColor: \"blue\",\n              color: \"white\",\n              cursor: \"pointer\",\n            }}\n            onClick={(e) => {\n              e.preventDefault();\n              openAssetHQHandler(onUpload);\n            }}\n          >\n            Upload Image\n          </a>\n          {/* <ImageUploader onUpload={onUpload} /> */}\n        </div>\n      </NodeViewWrapper>\n    );\n  };\n\n  return ImageUpload;\n};\n"],"names":["NodeViewWrapper","useCallback","ImageUploadBuilder","openAssetHQHandler","ImageUpload","getPos","editor","onUpload","url","chain","focus","setImageBlock","src","deleteRange","from","to","run","div","className","data-drag-handle","a","href","style","padding","borderRadius","backgroundColor","color","cursor","onClick","e","preventDefault"],"mappings":";AAAA,SAAiBA,eAAe,QAAQ,gBAAgB;AACxD,SAASC,WAAW,QAAQ,QAAQ;AAEpC,OAAO,MAAMC,qBAAqB,CAACC;IACjC,MAAMC,cAAc,CAAC,EACnBC,MAAM,EACNC,MAAM,EAIP;QACC,MAAMC,WAAWN,YACf,CAACO;YACC,IAAIA,KAAK;gBACPF,OACGG,KAAK,GACLC,KAAK,GACLC,aAAa,CAAC;oBAAEC,KAAKJ;gBAAI,GACzBK,WAAW,CAAC;oBAAEC,MAAMT;oBAAUU,IAAIV;gBAAS,GAC3CK,KAAK,GACLM,GAAG;YACR;QACF,GACA;YAACX;YAAQC;SAAO;QAGlB,qBACE,KAACN;sBACC,cAAA,KAACiB;gBAAIC,WAAU;gBAAUC,kBAAgB;0BAwBvC,cAAA,KAACC;oBACCC,MAAK;oBACLC,OAAO;wBACLC,SAAS;wBACTC,cAAc;wBACdC,iBAAiB;wBACjBC,OAAO;wBACPC,QAAQ;oBACV;oBACAC,SAAS,CAACC;wBACRA,EAAEC,cAAc;wBAChB3B,mBAAmBI;oBACrB;8BACD;;;;IAOT;IAEA,OAAOH;AACT,EAAE"}