DTL panel - click outside to close the panel

src/components/design-to-light/DTLPanel.vue

@@ -1,5 +1,5 @@
 <template>
-  <aside>
+  <aside @click="preventClose($event)">
     <button @click="emits('close')">X</button>
     <ul class="tabs">
       <li v-for="(proposal, index) in proposals">
@@ -55,15 +55,25 @@ proposals[0].isActive = true;
 const activeProposal = ref(proposals[0]);
 
 window.addEventListener("keyup", closeOnEscape);
+window.addEventListener("click", close);
 
 onBeforeUnmount(() => {
   window.removeEventListener("keyup", closeOnEscape);
+  window.removeEventListener("click", close);
 });
 
 // Functions
 function closeOnEscape(event) {
   if (event.key === "Escape") emits("close");
 }
+
+function close() {
+  emits("close");
+}
+
+function preventClose(event) {
+  event.stopImmediatePropagation();
+}
 </script>
 
 <style scoped>