fix link input position (#45), and setNodeSelection before inserting …

…image (fixes #41, #44)
Prototypr · Jun 23, 2024 · 36df237 · 36df237
1 parent 3bc04dc
commit 36df237
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 5 deletions.
diff --git a/components/Editor/Menus/FloatingMenu.jsx b/components/Editor/Menus/FloatingMenu.jsx
@@ -170,14 +170,14 @@ const uploadMedia = (event, editor, user, setLoading, setIsOpen) => {
             const url = response?.data?.url;
             // editor.chain().focus().setFigure({src: url, caption:'enter caption'}).run()
             // editor.chain().focus().setImage({ src: url }).run();
-            editor.commands.setFigure({
+            editor.chain().setNodeSelection(placeholderPos).setFigure({
               figureType: "image",
               position: placeholderPos,
               src: url,
               alt: "",
               figcaption: "",
               class: "",
-            });
+            }).run();
             removePlaceholder(editor);
           })
           .catch(function (error) {

diff --git a/components/Editor/Menus/MenuButtons/ImagePopoverButton/ImagePopoverButton.jsx b/components/Editor/Menus/MenuButtons/ImagePopoverButton/ImagePopoverButton.jsx
@@ -211,7 +211,7 @@ const toggleModal = () =>{
           ALT
         </IconButton>
     </DialogTrigger>
-    <LinkInput isFigure={true} marginLeft={-20} showRemove={true} editor={editor} />
+    <LinkInput isFigure={true} marginLeft={268} showRemove={true} editor={editor} />
       {/* <IconButton onClick={()=>setModal('link')} className={' hover:bg-gray-800 hover:text-white'} aria-label="Update link">
           <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18.364 15.536L16.95 14.12l1.414-1.414a5 5 0 1 0-7.071-7.071L9.879 7.05 8.464 5.636 9.88 4.222a7 7 0 0 1 9.9 9.9l-1.415 1.414zm-2.828 2.828l-1.415 1.414a7 7 0 0 1-9.9-9.9l1.415-1.414L7.05 9.88l-1.414 1.414a5 5 0 1 0 7.071 7.071l1.414-1.414 1.415 1.414zm-.708-10.607l1.415 1.415-7.071 7.07-1.415-1.414 7.071-7.07z" fill="currentColor"/></svg>
         </IconButton> */}

diff --git a/components/Editor/Menus/MenuButtons/LinkDropdown/LinkButtonRadix.jsx b/components/Editor/Menus/MenuButtons/LinkDropdown/LinkButtonRadix.jsx
@@ -152,7 +152,9 @@ const togglePopup =()=>{
 
 return(
   <Collapsible open={open}>
-    <CollapsibleTrigger  onClick={togglePopup} asChild>
+    <CollapsibleTrigger  
+    // onClick={togglePopup}
+     asChild>
       {/* <IconButton className={open?'bg-gray-800':' hover:bg-gray-800 hover:text-white'} aria-label="Update link"> */}
       <IconButton id="link-btn" className={`
        ${editor.isActive("link")?'bg-gray-800':'bg-gray-900'}
@@ -162,7 +164,7 @@ return(
       </IconButton>
     </CollapsibleTrigger>
     <CollapsibleContent 
-    css={{pointerEvents:'all',marginLeft:marginLeft?marginLeft:'', marginTop:-1, height:47}}
+    css={{pointerEvents:'all',marginLeft:marginLeft?marginLeft:'', marginTop:-58, height:47}}
     id="link-form-content"
     onPointerDownOutside={()=>setIsOpen(false)} onEscapeKeyDown={()=>setIsOpen(false)} sideOffset={5} >
       <Flex css={{ justifyContent:'space-between', gap: 10, marginTop:2, }}>