Просмотр исходного кода

enh: esc to close floating buttons

Timothy J. Baek 7 месяцев назад
Родитель
Сommit
3686cf7365
1 измененных файлов с 18 добавлено и 18 удалено
  1. 18 18
      src/lib/components/chat/Messages/ContentRenderer.svelte

+ 18 - 18
src/lib/components/chat/Messages/ContentRenderer.svelte

@@ -62,16 +62,20 @@
 					buttonsContainerElement.style.top = `${top + 5}px`; // +5 to add some spacing
 					buttonsContainerElement.style.top = `${top + 5}px`; // +5 to add some spacing
 				}
 				}
 			} else {
 			} else {
-				if (buttonsContainerElement) {
-					buttonsContainerElement.style.display = 'none';
-					selectedText = '';
-					floatingInput = false;
-					floatingInputValue = '';
-				}
+				closeFloatingButtons();
 			}
 			}
 		}, 0);
 		}, 0);
 	};
 	};
 
 
+	const closeFloatingButtons = () => {
+		if (buttonsContainerElement) {
+			buttonsContainerElement.style.display = 'none';
+			selectedText = '';
+			floatingInput = false;
+			floatingInputValue = '';
+		}
+	};
+
 	const selectAskHandler = () => {
 	const selectAskHandler = () => {
 		dispatch('select', {
 		dispatch('select', {
 			type: 'ask',
 			type: 'ask',
@@ -88,10 +92,17 @@
 		buttonsContainerElement.style.display = 'none';
 		buttonsContainerElement.style.display = 'none';
 	};
 	};
 
 
+	const keydownHandler = (e) => {
+		if (e.key === 'Escape') {
+			closeFloatingButtons();
+		}
+	};
+
 	onMount(() => {
 	onMount(() => {
 		if (floatingButtons) {
 		if (floatingButtons) {
 			contentContainerElement?.addEventListener('mouseup', updateButtonPosition);
 			contentContainerElement?.addEventListener('mouseup', updateButtonPosition);
 			document.addEventListener('mouseup', updateButtonPosition);
 			document.addEventListener('mouseup', updateButtonPosition);
+			document.addEventListener('keydown', keydownHandler);
 		}
 		}
 	});
 	});
 
 
@@ -99,20 +110,9 @@
 		if (floatingButtons) {
 		if (floatingButtons) {
 			contentContainerElement?.removeEventListener('mouseup', updateButtonPosition);
 			contentContainerElement?.removeEventListener('mouseup', updateButtonPosition);
 			document.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>
 </script>
 
 
 <div bind:this={contentContainerElement}>
 <div bind:this={contentContainerElement}>