> For the complete documentation index, see [llms.txt](https://enhancio.gitbook.io/reactflow-for-bubble.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://enhancio.gitbook.io/reactflow-for-bubble.io/element-reference/events.md).

# Events

## Summary

### Element events

| Name                                              | Summary                                                                                                                                                                                                                   |
| ------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [node clicked](#node-clicked)                     | Fired when a node is clicked by the user. Use this event to trigger workflows when users interact with nodes.                                                                                                             |
| [node changed position](#node-changed-position)   | Fired when one or more nodes are moved to new positions. Use with updated nodes states to get details about which nodes moved and their new coordinates.                                                                  |
| [node removed](#node-removed)                     | Fired when one or more nodes are deleted from the chart. Use with removed nodes ID state to get details about which nodes were deleted.                                                                                   |
| [edge added](#edge-added)                         | Fired when one or more edges (connections) are created in the chart. Use with added edges states to get details about which edges were added and their source/target nodes.                                               |
| [edge removed](#edge-removed)                     | Fired when one or more edges (connections) are deleted from the chart. Use with removed edges IDs state to get details about which edges were removed.                                                                    |
| [edge clicked](#edge-clicked)                     | Fired when an edge (connection) is clicked by the user. Use with clicked edge ID state to identify which edge was selected.                                                                                               |
| [edge dropped on canvas](#edge-dropped-on-canvas) | Fired when user starts dragging an edge from a node but drops it on empty canvas space instead of connecting to another node. Use with dropped edge source ID and mouse flow coordinates to create new nodes dynamically. |

***

## Element events

### node clicked

Fired when a node is clicked by the user. Use this event to trigger workflows when users interact with nodes.

***

### node changed position

Fired when one or more nodes are moved to new positions. Use with updated nodes states to get details about which nodes moved and their new coordinates.

***

### node removed

Fired when one or more nodes are deleted from the chart. Use with removed nodes ID state to get details about which nodes were deleted.

***

### edge added

Fired when one or more edges (connections) are created in the chart. Use with added edges states to get details about which edges were added and their source/target nodes.

***

### edge removed

Fired when one or more edges (connections) are deleted from the chart. Use with removed edges IDs state to get details about which edges were removed.

***

### edge clicked

Fired when an edge (connection) is clicked by the user. Use with clicked edge ID state to identify which edge was selected.

***

### edge dropped on canvas

Fired when user starts dragging an edge from a node but drops it on empty canvas space instead of connecting to another node. Use with dropped edge source ID and mouse flow coordinates to create new nodes dynamically.

***