boost_js_modal_typescript_initialization_and_programmatic_open.ts

1import Modal from 'boost-js-modal';
2
3// Select the trigger element and the modal element
4const trigger = document.querySelector<HTMLElement>('[data-modal-trigger]');
5const modalElement = document.querySelector<HTMLElement>('#my-modal');
6
7if (trigger && modalElement) {
8  // Initialize the modal
9  const myModal = new Modal(modalElement, {
10    // Optional configuration settings
11    closeOnEsc: true,
12    closeOnOverlayClick: true,
13    onOpen: (el: HTMLElement) => {
14      console.log('Modal opened:', el);
15    },
16    onClose: (el: HTMLElement) => {
17      console.log('Modal closed:', el);
18    }
19  });
20
21  // Example: Open the modal via script
22  myModal.open();
23}