From 66f901f75280262ec715da337b1a5a0efd7843fe Mon Sep 17 00:00:00 2001
From: Roger Gutierrez <94026278+roger-in-kiva@users.noreply.github.com>
Date: Wed, 22 Jan 2025 16:18:42 -0600
Subject: [PATCH] feat: esc key event added to side sheet component (#511)

---
 @kiva/kv-components/src/vue/KvSideSheet.vue | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/@kiva/kv-components/src/vue/KvSideSheet.vue b/@kiva/kv-components/src/vue/KvSideSheet.vue
index 0525a34e..b9239f75 100644
--- a/@kiva/kv-components/src/vue/KvSideSheet.vue
+++ b/@kiva/kv-components/src/vue/KvSideSheet.vue
@@ -120,6 +120,7 @@ export default {
 		const open = ref(false);
 		const initialStyles = ref({});
 		const modalStyles = ref({});
+		let onKeyUp = null;
 
 		const avoidBodyScroll = () => {
 			const bodyClasses = 'tw-overflow-hidden';
@@ -145,14 +146,24 @@ export default {
 			setTimeout(() => {
 				emit('side-sheet-closed');
 			}, '700');
+
+			document.removeEventListener('keyup', onKeyUp);
 		};
 
 		const goToLink = () => {
 			emit('go-to-link');
 		};
 
+		onKeyUp = (e) => {
+			if (!!e && e.key === 'Escape') {
+				closeSideSheet();
+			}
+		};
+
 		watch(visible, () => {
 			if (visible.value) {
+				document.addEventListener('keyup', onKeyUp);
+
 				setTimeout(() => {
 					open.value = true;
 					avoidBodyScroll();