Skip to content

Latest commit

 

History

History
38 lines (29 loc) · 1.46 KB

javascript-hooks.md

File metadata and controls

38 lines (29 loc) · 1.46 KB
Raw

JavaScript Hooks

JavaScript hooks allow you to run custom code at specific points in the preview modal lifecycle:

Event Description
peek:initializing Runs once, before the plugin is initialized.
peek:initialized Runs once, after the plugin is initialized.
peek:modal-initializing Runs once, before the Alpine component is initialized.
peek:modal-initialized Runs once, after the Alpine component is initialized.
peek:modal-opening Runs every time, before the preview modal opens.
peek:modal-opened Runs every time, after the preview modal opens.
peek:modal-closing Runs every time, before the preview modal closes.
peek:modal-closed Runs every time, after the preview modal closes.

Example:

document.addEventListener('peek:modal-closing', (e) => {
    console.log('The modal is closing...');

    // You can access the full modal instance in `e.detail.modal`
    if (e.detail.modal.withEditor) {
        console.log('I hope you enjoyed using the new Builder Preview!');
    }
});

Have a look at the Including Frontend Assets section of the Filament documentation to learn how to load custom JavaScript files into your admin pages.

Documentation