GET STARTED

Import

Use the canonical standalone export from its granular entry point.

import { NeuralTreeSelect, type NeuralTreeSelectValue } from '@neural-ng/core/tree-select';

@Component({ imports: [NeuralTreeSelect] })

Mapped hierarchical options

All option mappings accept nested property paths. Disabled nodes remain discoverable but cannot be selected.

Multiple and checkbox selection

Multiple values render removable chips. Checkbox mode also derives partial parent state while keeping an immutable value array.

Signal, reactive and template Forms

One typed value model works directly and through every Angular Forms adapter.

Loading, readonly, disabled and invalid

Readonly remains focusable and opens for inspection; disabled leaves the tab order. Field can supply required, invalid, pending and fluid state.

Typed node and value templates

Node context exposes selection and hierarchy metadata; value context exposes the typed value and resolved labels.

Virtual hierarchy

virtualScroll delegates large visible ranges to the Tree foundation without changing the Forms contract.

<neural-tree-select virtualScroll [options]="largeHierarchy" optionLabel="name" optionValue="id" />

Unstyled and typed slots

Combobox semantics, top-layer positioning, filtering and Tree behavior remain while Tailwind owns the surface.

Combobox and tree

The trigger exposes combobox state and controls a top-layer Tree with complete treeitem, group, expanded, selected and checked semantics.

Keyboard

Enter, Space or Arrow Down opens; Escape closes. Inside the panel, Tree owns arrows, Home/End, Enter/Space and typeahead.

Readonly and disabled

Readonly permits filtering and branch expansion but blocks value mutation. Disabled prevents opening and removes the trigger from sequential focus.

Focus and overlay

Popover matches trigger width, remains viewport-aware and restores focus. The filter receives focus only when enabled.

Forms, SSR and hydration

Stable generated IDs preserve hydration. Programmatic form writes do not emit user selection events; touch occurs on blur or panel close.

Component

Models and inputs

Events

Methods

Typed templates

Typed class slots

Public types

Compatibility alias

TreeSelectComponent is deprecated. New human and generated code must import NeuralTreeSelect.

Sizing

Surface