From 6e8e0454e4bf82dfc93121ea19d16aa4708c6871 Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Sun, 6 Oct 2024 22:55:10 -0700 Subject: [PATCH] refac: floating buttons --- .../chat/Messages/ContentRenderer.svelte | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/src/lib/components/chat/Messages/ContentRenderer.svelte b/src/lib/components/chat/Messages/ContentRenderer.svelte index f0660d5230..ccbc3fd270 100644 --- a/src/lib/components/chat/Messages/ContentRenderer.svelte +++ b/src/lib/components/chat/Messages/ContentRenderer.svelte @@ -23,14 +23,18 @@ let floatingInputValue = ''; const updateButtonPosition = (event) => { + if ( + !contentContainerElement?.contains(event.target) && + !buttonsContainerElement?.contains(event.target) + ) { + closeFloatingButtons(); + return; + } + setTimeout(async () => { await tick(); - // Check if the event target is within the content container - if (!contentContainerElement?.contains(event.target)) { - closeFloatingButtons(); - return; - } + if (!contentContainerElement?.contains(event.target)) return; let selection = window.getSelection(); @@ -51,8 +55,9 @@ // Calculate space available on the right const spaceOnRight = parentRect.width - (left + buttonsContainerElement.offsetWidth); - if (spaceOnRight < 0) { - // Not enough space on the right, position using 'right' + let thirdScreenWidth = window.innerWidth / 3; + + if (spaceOnRight < thirdScreenWidth) { const right = parentRect.right - rect.right; buttonsContainerElement.style.right = `${right}px`; buttonsContainerElement.style.left = 'auto'; // Reset left