How to react to custom events?

[danielniccoli]

I'm using Bootstrap modals (LiveDemo). They fire custom events like hidden.bs.modal. I don't get it to work to react to those events. For example:

<div x-data
     @hidden.bs.modal="console.log('Modal is closed')"
     id="exampleModal"
     class="modal fade" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    ....
</div>

I know that I can just add a script block es per the example, but I'd rather try to do it Alpine-style. Can you help?

[ekwoka]

https://alpinejs.dev/directives/on#dot