# Cascader

Source: https://lumeo.nativ.sh/components/cascader

# Cascader

A multi-level dropdown for selecting hierarchical data like categories or locations.

## Installation

.NET CLI PackageReference Lumeo CLI

dotnet add package Lumeo

One-time app setup (`AddLumeo()`, CSS & JS) is covered in the [installation guide](docs/introduction).

## Usage

@using Lumeo

<Cascader />

## When to Use

-   Hierarchical selection like country, state, and city pickers
-   Category drill-down for product catalogs or file systems
-   Location pickers with multi-level geography data
-   Any nested data structure where users select a path from root to leaf

Preview Code

Basic Cascader

Select location...

Preview Code

Clearable

Select...

Preview Code

Disabled

Disabled

## API Reference

### Cascader

Property

Type

Default

Description

Options

List<CascaderOption>?

—

Hierarchical options tree.

Value

List<string>?

—

Selected value path (root to leaf).

Clearable

bool

false

Show clear button.

Placeholder

string?

"Select..."

Placeholder text.

Disabled

bool

false

Disable the cascader.

ShowSearch

bool

false

Show a search input to filter options.

ValueChanged

EventCallback<List<string>>

—

Callback for two-way binding when the selected path changes.

Required

bool

false

Marks the field as required. Syncs with a parent FormField.

Invalid

bool

false

Applies error styling. Syncs with a parent FormField.

ErrorText

string?

null

Error message displayed below the field when Invalid is true.

HelperText

string?

null

Helper text shown below the field when not invalid.

Label

string?

null

Label rendered above the field (standalone, without FormField).

Name

string?

null

HTML name attribute for form submission.

FormField

FormField.FormFieldContext?

null

Cascaded context from a parent FormField; wires label, validation, and required state automatically.

## Related Components

-   [Select](/components/select) — Single-level dropdown for flat option lists
-   [Combobox](/components/combobox) — Searchable dropdown for flat option lists with filtering
-   [Breadcrumb](/components/breadcrumb) — Display the selected hierarchical path as a breadcrumb trail
