Custom Events

Create global, reusable event handlers that extend the standard on- directive.

The PawaCustomEvent API allows you to define complex event logic (like swipe gestures, long presses, or keyboard combos) once and use them anywhere in your HTML templates.

js 

                 
import { PawaCustomEvent } from 'pawajs';

// Register a 'longpress' custom event
PawaCustomEvent('longpress', (el, modifiers, options, execute) => {
    let timer;
    
    el.addEventListener('mousedown', () => {
        timer = setTimeout(execute, 1000); // Trigger after 1s
    }, options);

    el.addEventListener('mouseup', () => clearTimeout(timer), options);
});

Usage in Templates

html 

                 
<button on-longpress="deleteAccount()">
    Hold to Delete
</button>