# Top Node

The <span style="color: rgb(230, 126, 35);">[Fusion node diagram](https://doc316en.candera.eu/books/fusion/page/fusion-editor-ui)</span> in the Fusion panel always starts with the top node. The **Top Node** serves as root node in the Fusion diagram and is fixed, meaning it cannot be deleted from the Fusion Editor.

The **Top Node** corresponds to the node selected in the scene tree. If Fusion is launched from within the State Machine Editor, it represents the State Machine Element (such as a State or Transition) that was selected when starting Fusion.

<div drawio-diagram="3530"><img src="https://doc316en.candera.eu/uploads/images/drawio/2023-05/drawing-4-1684829304.png" alt=""/></div>

#### Top Node Connector

The Top Node has a **single connector on its right side**, which is used to create and connect other Fusion Nodes.

For details on connecting Fusion Nodes, see [<span style="color: rgb(230, 126, 35);">Basic Operations</span>](https://doc316en.candera.eu/link/1060#bkmrk-adding-a-fusion-node).

<div drawio-diagram="3532"><img src="https://doc316en.candera.eu/uploads/images/drawio/2023-05/drawing-4-1684829402.png" alt=""/></div>

#### Selecting a Top Node

The following types of nodes can serve as the Top Node in a Fusion diagram:

- <span style="color: rgb(0, 0, 0);">[<span style="color: rgb(230, 126, 35);">Predefined</span> <span style="color: rgb(230, 126, 35);">CGI Control Templates</span>](https://doc316en.candera.eu/books/controls-and-behaviors/chapter/predefined-controls)</span>
- <span style="color: rgb(230, 126, 35);">[Custom User Controls](https://doc316en.candera.eu/books/controls-and-behaviors/page/create-controls)</span> and **Instantiated controls** with user defined properties
- <span style="color: rgb(230, 126, 35);">[Behavior Building Block Templates](https://doc316en.candera.eu/books/controls-and-behaviors/page/behavior-building-blocks-behavior-blocks)</span>
- <span style="color: rgb(230, 126, 35);">[State Machine Elements](https://doc316en.candera.eu/books/state-machine/page/components-in-state-machine)</span> (e.g. States, Transitions)
- 2D/3D Scene Nodes
- <span style="color: rgb(0, 0, 0);">Behavior Groups</span>

To select a Top Node:

1. In the Scene Tree, click the desired node.
2. The adjacent **Extra Scene Tree** lists the **Behaviors** and **Effects** of the node selected in the Scene Tree along with a **\[Fusion...\]** button.
3. Click the **\[Fusion...\]** button to open the Fusion Editor.
4. The Fusion Editor will display the selected node as the **Top Node** in the Fusion diagram.

<div drawio-diagram="7622"><img src="https://doc316en.candera.eu/uploads/images/drawio/2024-12/drawing-5-1733495849.png" alt=""/></div>

If the Fusion Editor is already open, selecting any node in the Scene Tree will automatically update the Fusion Editor to display the Fusion diagram for the corresponding node.

The choice of a Top Node depends on the specific use case. For example:

- It can be a **button** in the Scene Tree from which you want to detect click events.
- It could be a **scene node** whose property value you need to monitor to trigger an action.

Essentially, the **Top Node** is the element that acts as the **source or recipient of events or values** to be processed.

#### Fusion Node Categories

The following type of behaviors can be connected connected to the top node in Fusion:

- Action Fusion Node
- Condition Fusion Node
- Behavior Fusion Node
- Behavior Group Fusion Node (BehaviorBuildingBlock)

In addition to these, **reference Fusion nodes** within Action, Condition, Behavior Fusion node can also be connected.

<p class="callout info">The color of each Fusion node category - including the **Top Node** - as displayed in the Fusion Editor can be customized in <span style="color: rgb(230, 126, 35);">[Preferences](https://doc316en.candera.eu/books/preferences/page/fusion)</span>.</p>