Add support for custom options and cancelable $dispatch

[nicolagianelli]

Proposal: Extend $dispatch functionality

Hello everyone,
While working with AlpineJS to build a UI library for Laravel, I noticed some limitations in the magic function $dispatch. Specifically:

1. It doesn't allow extended options.
2. It doesn’t support proper cancellation via preventDefault.

These limitations can lead to issues when building modular, event-driven components. Below, I explain the motivation and propose a minimal enhancement.

Problem Overview

1. Lack of Extendable Options
   Currently, it's not possible to customize event behavior (e.g., disabling bubbles). This becomes problematic in cases like:

A modal and a dropdown both dispatching an event named closed.
When used together, the parent modal might unintentionally respond to the dropdown's event, causing conflicts.

Yes, we could rename events (e.g., modal:closed vs. dropdown:closed), but this doesn't solve issues with nested modals or more complex component structures.

2. Non-Cancelable in Practice
   Although dispatched events are marked as cancelable: true, the function does not return the created CustomEvent.
   As a result, it's not possible to check whether preventDefault() was called.

This prevents useful patterns like:

const event = $dispatch('close');
if (event) {
    // Proceed to close the modal
}

This kind of control is useful for building modular components.

Proposed Solution

The required change is minimal:

1. Add support for a third parameter in $dispatch for passing native CustomEvent options (like bubbles, etc.).
2. Return the CustomEvent instance from $dispatch so developers can inspect and control event behavior.

Benefits

• Prevents event conflicts across nested or reused components.
• Enables advanced workflows like conditional UI actions based on event handling.
• Maintains backward compatibility while giving developers more flexibility and control.