fixed click popover

LiveDuo · Nov 8, 2023 · 48ceb9b · 48ceb9b
1 parent bad3a0a
commit 48ceb9b
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/lib/client/vanilla/editor.tsx b/lib/client/vanilla/editor.tsx
@@ -230,7 +230,6 @@ function Editor({ standaloneServer = false }) {
       popoverElementRef.current!.style.top = `${target.offsetTop}px`
       popoverElementRef.current!.style.left = `${target.offsetLeft}px`
     }
-    console.log('onCanvasMouseOver', target.tagName)
 
     // get hovered component
     const components = getComponents()
@@ -249,6 +248,12 @@ function Editor({ standaloneServer = false }) {
     }
   }
 
+  const onCanvasMouseOut = (e: React.MouseEvent<HTMLElement>) => {
+    if (!isEventOnElement(popoverElementRef.current!, e)) {
+      setHoveredElement(null)
+    }
+  }
+
   const onCanvasClickCapture = (e: React.MouseEvent<HTMLElement>) => {
     if (isPreview) return
 
@@ -427,6 +432,7 @@ function Editor({ standaloneServer = false }) {
                   ref={optionsRef}
                   onClick={() => {
                     // handle elements clicks
+                    setSelectedElement(hoveredElement)
                     if (hoveredElement?.tagName === 'BUTTON') {
                       setOpenButton(true)
                     } else if (hoveredElement?.tagName === 'A') {
@@ -479,6 +485,7 @@ function Editor({ standaloneServer = false }) {
             className="bg-white flex-1 ease-animation"
             onMouseOver={onCanvasMouseOver}
             onMouseLeave={onCanvasMouseLeave}
+            onMouseOut={onCanvasMouseOut}
             onDrop={onCanvasDrop}
             onDragOver={onCanvasDragOver}
             onDragLeave={onCanvasDragLeave}