Event Callbacks

CxJS provides utility functions for common event handling operations that can be used directly as event handlers.

stopPropagation

Stops event propagation. Pass directly as an event handler.

import { stopPropagation } from "cx/util";

// Button inside a clickable row
<tr onClick={handleRowClick}>
  <td>Data</td>
  <td>
    <button onClick={stopPropagation}>Delete</button>
  </td>
</tr>

preventDefault

Prevents the default browser action. Pass directly as an event handler.

import { preventDefault } from "cx/util";

// Prevent drag default behavior
<div onDragOver={preventDefault} onDrop={handleDrop}>
  Drop zone
</div>

API

stopPropagation

function stopPropagation(e: { stopPropagation(): void }): void;

preventDefault

function preventDefault(e: { preventDefault(): void }): void;

Both functions accept any event-like object with the corresponding method.