# EuiTreeComponent

**Type:** component



The eui-tree can be used to display hierarchy data with optional added behavior inside node templates and interactions
that could affect the rendered data such as expand, collapse, direct actions, extra menu actions, etc.



**Selector:** `eui-tree`

## Inputs
- **autoTranslate**: `boolean` - Whether i18n key can be passed to be translated with `TranslateService`.
- **collapsedSvgIconClass**: `string` - Icon to display when a node is opened
- **customNodeSelectFn**: `CustomNodeSelectFn` - 
- **e2eAttr**: `string` - 
- **expandedSvgIconClass**: `string` - Icon to display when a node is closed
- **highlightPath**: `boolean` - Whether all parents till the selected are highlighted in bold.
- **isClickTogglingNode**: `boolean` - Whether the full node display can be clicked to toggle the node.
- **isMultiselect**: `boolean` - Whether multiple nodes can be selected.
- **isRecursiveParentSelection**: `boolean` - In combination with `isMultiselect`. Whether the selection of all children will automatically select the parent.
- **isRecursiveSelection**: `boolean` - In combination with `isMultiselect`. Whether the selection of a node will automatically select its children.
- **isSingleSelect**: `boolean` - Whether only one node can be selected. Select one will unselect the previous selected.
- **nodeContentMetadataTemplateRef**: `TemplateRef<any>` - 
- **nodes**: `TreeDataModel` - Hierarchy of data to display in the tree
- **nodeTemplateRef**: `TemplateRef<any>` - Reference to the `ng-template` used to render node item
- **rightContextMenuTemplateRef**: `TemplateRef<any>` - 
- **showLines**: `boolean` - Whether the lines are displayed on the left of nodes.
- **showUnderlinedLinks**: `boolean` - Whether the links are underlined on hiver in the tree.
- **virtualScrollPageSize**: `number` - Size of the virtaul scroll pages
- **virtualScrollThreshold**: `number` - Treshold for the virtual scroll to be activated

## Outputs
- **nodeClick**: `EventEmitter` - 
- **nodeToggle**: `EventEmitter` - 
- **selectionChange**: `EventEmitter` - 
