From ae2cedbd70421b3bddd35b4bca676f9217a9e78b Mon Sep 17 00:00:00 2001
From: Pete Matsyburka <pete@docuseal.com>
Date: Fri, 18 Sep 2026 16:14:27 +0300
Subject: [PATCH] drawer close

---
 app/javascript/template_builder/mobile_drawer.vue | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/app/javascript/template_builder/mobile_drawer.vue b/app/javascript/template_builder/mobile_drawer.vue
index 32888086e..e794ff29e 100644
--- a/app/javascript/template_builder/mobile_drawer.vue
+++ b/app/javascript/template_builder/mobile_drawer.vue
@@ -14,6 +14,13 @@
       @dragenter="$emit('close')"
       @touchmove.prevent
     />
+    <div
+      class="absolute bottom-3 flex items-center justify-center w-10 h-10 rounded-full bg-base-100 shadow-lg pointer-events-none transition-opacity duration-300"
+      :class="open ? 'opacity-100' : 'opacity-0'"
+      :style="side === 'left' ? 'left: calc(min(82%, 340px) + 0.75rem)' : 'right: calc(min(82%, 340px) + 0.75rem)'"
+    >
+      <IconX class="w-5 h-5" />
+    </div>
     <div
       ref="panel"
       class="absolute top-0 bottom-0 bg-base-100 shadow-xl overflow-y-auto overflow-x-hidden overscroll-contain px-4 transition-transform duration-300 ease-out"
@@ -27,8 +34,13 @@
 </template>
 
 <script>
+import { IconX } from '@tabler/icons-vue'
+
 export default {
   name: 'MobileDrawer',
+  components: {
+    IconX
+  },
   props: {
     side: {
       type: String,