close on escape

front/src/components/modals/Modal.vue

@@ -1,14 +1,25 @@
 <script setup>
 import { vOnClickOutside } from "@vueuse/components";
-import { defineEmits, defineProps } from "vue";
+import { defineEmits, defineProps, onMounted, onUnmounted } from "vue";
 
 const emit = defineEmits(["close-modal"]);
 const props = defineProps({ title: String });
 
-// todo close on escape
 function close() {
     emit("close-modal");
 }
+
+function keyUpHandler(e) {
+    if (e.key == "Escape") close();
+}
+
+onMounted(() => {
+    window.addEventListener("keyup", keyUpHandler);
+});
+
+onUnmounted(() => {
+    window.removeEventListener("keyup", keyUpHandler);
+});
 </script>
 
 <template>