enh: esc to close floating buttons

This commit is contained in:
Timothy J. Baek 2024-10-06 20:29:30 -07:00
parent aaa4350eb4
commit 3686cf7365

View File

@ -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) { closeFloatingButtons();
buttonsContainerElement.style.display = 'none';
selectedText = '';
floatingInput = false;
floatingInputValue = '';
}
} }
}, 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}>