From 56e2b30f7c6a3bde3c61be1959754b47f4234cc8 Mon Sep 17 00:00:00 2001
From: Michael Silber <michael@cfxdesign.com>
Date: Mon, 26 Jun 2023 16:22:57 -0400
Subject: [PATCH] Add modal events to enable listeners for modal open/close

Add open event for 3rd party modals
---
 src/awesomeSezzle.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/awesomeSezzle.js b/src/awesomeSezzle.js
index ea1db8b6..a7cdbed8 100644
--- a/src/awesomeSezzle.js
+++ b/src/awesomeSezzle.js
@@ -728,6 +728,7 @@ class AwesomeSezzle {
 				} else {
 					document.querySelector('.sezzle-checkout-button-wrapper').focus();
 				}
+				document.dispatchEvent(new CustomEvent('sezzle:modal-close'));
 			}
 		})
 	}
@@ -1032,6 +1033,7 @@ class AwesomeSezzle {
 				} else {
 					document.querySelector('.sezzle-checkout-button-wrapper').focus();
 				}
+				document.dispatchEvent(new CustomEvent('sezzle:modal-close'));
 			});
 		});
 		let sezzleModal = document.getElementsByClassName('sezzle-modal')[0];
@@ -1064,6 +1066,7 @@ class AwesomeSezzle {
 				} else {
 					document.querySelector('.sezzle-checkout-button-wrapper').focus();
 				}
+				document.dispatchEvent(new CustomEvent('sezzle:modal-close'));
 			});
 		});
 		let sezzleModal = document.getElementsByClassName('sezzle-modal')[0];
@@ -1095,6 +1098,7 @@ class AwesomeSezzle {
 				} else {
 					document.querySelector('.sezzle-checkout-button-wrapper').focus();
 				}
+				document.dispatchEvent(new CustomEvent('sezzle:modal-close'));
 			});
 		});
 		let sezzleModal = document.getElementsByClassName('sezzle-modal')[0];
@@ -1126,6 +1130,7 @@ class AwesomeSezzle {
 				} else {
 					document.querySelector('.sezzle-checkout-button-wrapper').focus();
 				}
+				document.dispatchEvent(new CustomEvent('sezzle:modal-close'));
 			});
 		});
 		let sezzleModal = document.getElementsByClassName('sezzle-modal')[0];
@@ -1170,6 +1175,7 @@ class AwesomeSezzle {
 		var modalNode = document.getElementsByClassName('sezzle-checkout-modal-lightbox')[0];
 		modalNode.style.display = 'block';
 		modalNode.getElementsByClassName('sezzle-modal')[0].className = `sezzle-modal sezzle-modal${this.modalTheme === "grayscale" ? "-grayscale" : "-color"}`;
+		document.dispatchEvent(new CustomEvent('sezzle:modal-open'));
 	}
 
 	addClickEventForModal(sezzleElement) {
@@ -1183,6 +1189,7 @@ class AwesomeSezzle {
 					modalNode.getElementsByClassName('close-sezzle-modal')[0].focus();
 					modalNode.getElementsByClassName('sezzle-modal')[0].className = `sezzle-modal sezzle-modal${this.modalTheme === "grayscale" ? "-grayscale" : "-color"}`;
 					event.target.id = 'sezzle-modal-return';
+					document.dispatchEvent(new CustomEvent('sezzle:modal-open'));
 				}
 			}.bind(this));
 		}.bind(this));
@@ -1192,6 +1199,7 @@ class AwesomeSezzle {
 				document.getElementsByClassName('sezzle-ap-modal')[0].style.display = 'block';
 				document.getElementsByClassName('sezzle-ap-modal')[0].focus();
 				event.target.id = 'sezzle-modal-return';
+				document.dispatchEvent(new CustomEvent('sezzle:modal-open'));
 			}.bind(this));
 		}.bind(this));
 		var qpModalLinks = sezzleElement.getElementsByClassName('quadpay-modal-info-link');
@@ -1200,6 +1208,7 @@ class AwesomeSezzle {
 				document.getElementsByClassName('sezzle-qp-modal')[0].style.display = 'block';
 				document.getElementsByClassName('sezzle-qp-modal')[0].focus();
 				event.target.id = 'sezzle-modal-return';
+				document.dispatchEvent(new CustomEvent('sezzle:modal-open'));
 			}.bind(this));
 		}.bind(this));
 		var affirmModalLinks = sezzleElement.getElementsByClassName('affirm-modal-info-link');
@@ -1208,6 +1217,7 @@ class AwesomeSezzle {
 				document.getElementsByClassName('sezzle-affirm-modal')[0].style.display = 'block';
 				document.getElementsByClassName('sezzle-affirm-modal')[0].focus();
 				event.target.id = 'sezzle-modal-return';
+				document.dispatchEvent(new CustomEvent('sezzle:modal-open'));
 			}.bind(this));
 		}.bind(this));
 		var klarnaModalLinks = sezzleElement.getElementsByClassName('klarna-modal-info-link');
@@ -1216,6 +1226,7 @@ class AwesomeSezzle {
 				document.getElementsByClassName('sezzle-klarna-modal')[0].style.display = 'block';
 				document.getElementsByClassName('sezzle-klarna-modal')[0].focus();
 				event.target.id = 'sezzle-modal-return';
+				document.dispatchEvent(new CustomEvent('sezzle:modal-open'));
 			}.bind(this));
 		}.bind(this));
 	}
@@ -1266,4 +1277,4 @@ class AwesomeSezzle {
 	}
 }
 
-export default AwesomeSezzle;
\ No newline at end of file
+export default AwesomeSezzle;