From 2f97bbe63a9a6e9d704bf3c746d09786c708e96f Mon Sep 17 00:00:00 2001
From: Vlad Osmianski <vlaosm@gmail.com>
Date: Mon, 16 Sep 2024 22:49:37 +0300
Subject: [PATCH 1/2] Dispatch an event to a modal being closed before closing
 it, so that the modal can prevent it based on its state

---
 resources/js/modal.js | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/resources/js/modal.js b/resources/js/modal.js
index e2fc6d1..29a00f0 100644
--- a/resources/js/modal.js
+++ b/resources/js/modal.js
@@ -16,6 +16,10 @@ window.LivewireUIModal = () => {
                 return;
             }
 
+            if (!this.closingModal('closingModalOnEscape')) {
+                return;
+            }
+
             let force = this.getActiveComponentModalAttribute('closeOnEscapeIsForceful') === true;
             this.closeModal(force);
         },
@@ -24,8 +28,24 @@ window.LivewireUIModal = () => {
                 return;
             }
 
+            if (!this.closingModal('closingModalOnClickAway')) {
+                return;
+            }
+
             this.closeModal(true);
         },
+        closingModal(eventName) {
+            const componentName = this.$wire.get('components')[this.activeComponent].name;
+
+            var params = {
+                id: this.activeComponent,
+                closing: true,
+            };
+
+            Livewire.dispatchTo(componentName, eventName, params);
+
+            return params.closing;
+        },
         closeModal(force = false, skipPreviousModals = 0, destroySkipped = false) {
             if(this.show === false) {
                 return;

From 54f827acb0e5bee36586f566f1c82dc2da4369a0 Mon Sep 17 00:00:00 2001
From: Vlad Osmianski <vlaosm@gmail.com>
Date: Sun, 6 Oct 2024 16:13:55 +0300
Subject: [PATCH 2/2] Update documentation

---
 README.md | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/README.md b/README.md
index 9ec924b..4a97773 100644
--- a/README.md
+++ b/README.md
@@ -306,6 +306,29 @@ By default, the modal will close when you click outside the modal. If you want t
  }
  ```
 
+## Preventing closing the modal on Escape or on click away based on the modal state
+
+When a modal is closed on Escape or click away, `closingModalOnEscape` and `closingModalOnClickAway` are issued. Handle these events to prevent closing a modal based on its state, for example, if there are uncommitted changes.
+
+For example, if a modal has a `isDirty` property, it could have the following handler:
+
+```
+@script
+<script>
+    $wire.on('closingModalOnEscape', data => {
+        if ($wire.isDirty && !confirm('{{ __('You have unsaved changes. Are you sure you want to close this dialog?') }}')) {
+            data.closing = false;
+        }
+    });
+    $wire.on('closingModalOnClickAway', data => {
+        if ($wire.isDirty && !confirm('{{ __('You have unsaved changes. Are you sure you want to close this dialog?') }}')) {
+            data.closing = false;
+        }
+    });
+</script>
+@endscript
+```
+
 ## Skipping previous modals
 In some cases you might want to skip previous modals. For example:
 1. Team overview modal