diff --git a/resources/assets/src/scripts/modal.ts b/resources/assets/src/scripts/modal.ts
index 87a2297a..c74e94c8 100644
--- a/resources/assets/src/scripts/modal.ts
+++ b/resources/assets/src/scripts/modal.ts
@@ -41,6 +41,11 @@ export function showModal(options: ModalOptions = {}): Promise<ModalResult> {
       }),
     }).$mount(container)
 
-    $(instance.$el).modal('show')
+    $(instance.$el)
+      .modal('show')
+      .on('hidden.bs.modal', () => {
+        instance.$el.remove()
+        instance.$destroy()
+      })
   })
 }
diff --git a/resources/assets/tests/scripts/modal.test.ts b/resources/assets/tests/scripts/modal.test.ts
index 769db26b..e47e529c 100644
--- a/resources/assets/tests/scripts/modal.test.ts
+++ b/resources/assets/tests/scripts/modal.test.ts
@@ -1,3 +1,4 @@
+import $ from 'jquery'
 import { showModal } from '@/scripts/modal'
 
 test('show modal', async () => {
@@ -9,4 +10,7 @@ test('show modal', async () => {
   })
   const { value } = await showModal()
   expect(value).toBe('')
+
+  $('.modal').trigger('hidden.bs.modal')
+  expect(document.querySelector('.modal')).toBeNull()
 })