> ## Documentation Index
> Fetch the complete documentation index at: https://docs.borntocraftstudio.net/llms.txt
> Use this file to discover all available pages before exploring further.

# Skill Tree Connections

> Learn how to create professional skill trees with automatic linking, directional arrowheads, and edge-snapping.

Advanced Menus now features a powerful Skill Tree engine. This system allows you to create hierarchical menus where nodes are automatically connected by lines (rods) and directional arrows.

## Automatic Linking

Instead of manually defining every link in a `links` array, you can now use the `parent` property on any element.

<ResponseField name="parent" type="String">
  The unique ID of another element (Button or Decoration) to link from.
  A line will automatically be drawn from the parent to this element.
</ResponseField>

```json theme={null}
{
  "id": "skill_node_2",
  "parent": "skill_node_1",
  ...
}
```

## Advanced Connection Styling

When defining links (either via the global `links` array or through the `style` field of an auto-link template), you have access to new precision controls.

### Edge Snapping & Margins

To prevent lines from overlapping your icons or text, the engine calculates the exact intersection with the node's edge.

<ResponseField name="margin" type="Double">
  The empty space (in menu units) between the node edge and the start/end of the link.
  Higher values create a "small gap" effect.
</ResponseField>

### Directional Arrowheads

You can add stylized arrowheads to indicate the flow of a skill tree.

<ResponseField name="arrowhead" type="Object">
  Configuration for the arrowhead display.

  <Expandable title="Properties">
    <ResponseField name="material" type="String">
      Minecraft material (e.g., `ARROW`, `FLINT`).
    </ResponseField>

    <ResponseField name="customModelData" type="Int">
      Custom model ID for the arrowhead.
    </ResponseField>

    <ResponseField name="scale" type="Double">
      Visual scale of the head.
    </ResponseField>

    <ResponseField name="layerOffset" type="Double">
      Pushes the arrow slightly forward or backward relative to the line (default: 0).
    </ResponseField>
  </Expandable>
</ResponseField>

## 3D Orientation

All links and arrowheads are rendered in a **Flat-to-Menu** orientation. This means they are aligned with the menu plane (X-Y) rather than constantly facing the player's camera. This ensures that perspective shifts during movement look professional and integrated.

## Conditional Visibility

You can hide arrowheads specifically based on criteria (e.g., only show the arrow if the parent is unlocked).

<ResponseField name="arrowCriteria" type="Ref<FactEntry>">
  The condition required to display the arrowhead entity.
</ResponseField>
