I'm working with Bootstrap 5's Modal component and wanted to implement the following code from the documentation into TypeScript which I am new to instead of JavaScript.
var exampleModal = document.getElementById('exampleModal')
exampleModal.addEventListener('show.bs.modal', function (event) {
// Button that triggered the modal
var button = event.relatedTarget
// Extract info from data-bs-* attributes
var recipient = button.getAttribute('data-bs-whatever')
// If necessary, you could initiate an AJAX request here
// and then do the updating in a callback.
//
// Update the modal's content.
var modalTitle = exampleModal.querySelector('.modal-title')
var modalBodyInput = exampleModal.querySelector('.modal-body input')
modalTitle.textContent = 'New message to ' + recipient
modalBodyInput.value = recipient
})
Example originates from here
The hurdle I can't seem to get around is the property relatedTarget
not being defined since it is a custom property from the Bootstrap code. I'm not sure if there is an appropriate interface I can use and the compiler will recognize (maybe there's a package that does that already), or if I need to make a global declaration to avoid the issue beforehand.