From 3686cf7365564662a739c1862b77e1ac9aa16e81 Mon Sep 17 00:00:00 2001
From: "Timothy J. Baek" <timothyjrbeck@gmail.com>
Date: Sun, 6 Oct 2024 20:29:30 -0700
Subject: [PATCH] enh: esc to close floating buttons

---
 .../chat/Messages/ContentRenderer.svelte      | 36 +++++++++----------
 1 file changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/lib/components/chat/Messages/ContentRenderer.svelte b/src/lib/components/chat/Messages/ContentRenderer.svelte
index 9efeeb4aa..0aede0065 100644
--- a/src/lib/components/chat/Messages/ContentRenderer.svelte
+++ b/src/lib/components/chat/Messages/ContentRenderer.svelte
@@ -62,16 +62,20 @@
 					buttonsContainerElement.style.top = `${top + 5}px`; // +5 to add some spacing
 				}
 			} else {
-				if (buttonsContainerElement) {
-					buttonsContainerElement.style.display = 'none';
-					selectedText = '';
-					floatingInput = false;
-					floatingInputValue = '';
-				}
+				closeFloatingButtons();
 			}
 		}, 0);
 	};
 
+	const closeFloatingButtons = () => {
+		if (buttonsContainerElement) {
+			buttonsContainerElement.style.display = 'none';
+			selectedText = '';
+			floatingInput = false;
+			floatingInputValue = '';
+		}
+	};
+
 	const selectAskHandler = () => {
 		dispatch('select', {
 			type: 'ask',
@@ -88,10 +92,17 @@
 		buttonsContainerElement.style.display = 'none';
 	};
 
+	const keydownHandler = (e) => {
+		if (e.key === 'Escape') {
+			closeFloatingButtons();
+		}
+	};
+
 	onMount(() => {
 		if (floatingButtons) {
 			contentContainerElement?.addEventListener('mouseup', updateButtonPosition);
 			document.addEventListener('mouseup', updateButtonPosition);
+			document.addEventListener('keydown', keydownHandler);
 		}
 	});
 
@@ -99,20 +110,9 @@
 		if (floatingButtons) {
 			contentContainerElement?.removeEventListener('mouseup', updateButtonPosition);
 			document.removeEventListener('mouseup', updateButtonPosition);
+			document.removeEventListener('keydown', keydownHandler);
 		}
 	});
-
-	// $: if (floatingButtons) {
-	// 	if (buttonsContainerElement) {
-	// 		document.body.appendChild(buttonsContainerElement);
-	// 	}
-	// }
-
-	// onDestroy(() => {
-	// 	if (buttonsContainerElement) {
-	// 		document.body.removeChild(buttonsContainerElement);
-	// 	}
-	// });
 </script>
 
 <div bind:this={contentContainerElement}>