From 45cab917e72009ff231b4d49f40c8c64983a914c Mon Sep 17 00:00:00 2001
From: Matt Jennings <me@mattjennings.io>
Date: Sat, 2 Nov 2024 22:06:34 -0500
Subject: [PATCH] allow closing modals during transitions

---
 .../LegacyAnimatedInfiniteModal.svelte        |  3 ++-
 src/lib/modal.svelte.ts                       |  4 ----
 .../{modals.spec.ts => modal-context.spec.ts} | 20 +++++++++++++++++++
 3 files changed, 22 insertions(+), 5 deletions(-)
 rename src/tests/{modals.spec.ts => modal-context.spec.ts} (85%)

diff --git a/docs/lib/components/LegacyAnimatedInfiniteModal.svelte b/docs/lib/components/LegacyAnimatedInfiniteModal.svelte
index 90384cb..310eb20 100644
--- a/docs/lib/components/LegacyAnimatedInfiniteModal.svelte
+++ b/docs/lib/components/LegacyAnimatedInfiniteModal.svelte
@@ -1,7 +1,7 @@
 <script>
   import { createEventDispatcher } from 'svelte'
 
-  import { closeModal, modals } from 'svelte-modals/legacy'
+  import { closeAllModals, closeModal, modals } from 'svelte-modals/legacy'
   import { fade, fly } from 'svelte/transition'
 
   const dispatch = createEventDispatcher()
@@ -46,6 +46,7 @@
       <div class="modal-actions">
         <button on:click={openAnother}>Open</button>
         <button on:click={closeModal}>Close</button>
+        <button on:click={closeAllModals}>Close All</button>
       </div>
     </div>
   </div>
diff --git a/src/lib/modal.svelte.ts b/src/lib/modal.svelte.ts
index d28ffc8..0870389 100644
--- a/src/lib/modal.svelte.ts
+++ b/src/lib/modal.svelte.ts
@@ -64,10 +64,6 @@ export class Modal<R = any> {
   }
 
   close(...args: R extends void ? [] : [result: R]) {
-    if (this.modals.transitioning) {
-      return false
-    }
-
     if (this.onBeforeClose?.() === false) {
       return false
     }
diff --git a/src/tests/modals.spec.ts b/src/tests/modal-context.spec.ts
similarity index 85%
rename from src/tests/modals.spec.ts
rename to src/tests/modal-context.spec.ts
index 265a3bc..3b82d92 100644
--- a/src/tests/modals.spec.ts
+++ b/src/tests/modal-context.spec.ts
@@ -5,6 +5,7 @@ const FakeComponent = class {} as any as ModalComponent<ModalProps<{ foo: 'bar'
 
 afterEach(() => {
   modals.stack.length = 0
+  modals.transitioning = false
 })
 
 describe('open', () => {
@@ -55,6 +56,25 @@ describe('close', () => {
   })
 })
 
+describe('closeAll', () => {
+  test('removes all modals from the stack', () => {
+    modals.open(FakeComponent)
+    modals.open(FakeComponent)
+    modals.open(FakeComponent)
+    modals.closeAll()
+    expect(modals.stack).toHaveLength(0)
+  })
+
+  test('removes all modals from the stack even if transitioning', () => {
+    modals.open(FakeComponent)
+    modals.stack[0].exitBeforeEnter = true
+    modals.open(FakeComponent)
+    modals.open(FakeComponent)
+    modals.closeAll()
+    expect(modals.stack).toHaveLength(0)
+  })
+})
+
 describe('closeById', () => {
   test('removes a modal from the stack', () => {
     modals.open(FakeComponent)