SusDropdown

Popup list picker — open list is the identity (unlike closed-field Select).

Package

SusKit · Atoms (commercial)

Open in Playground

SusKit · Atoms

Props

Name	Type	Default
Model	Prop<object>	null	v-model
Label	Prop<string>	""	v-model
ItemTitle	Prop<string>	""	v-model
ItemValue	Prop<string>	""	v-model
Searchable	Prop<bool>	false	v-model
SearchText	Prop<string>	""	v-model
NoDataText	Prop<string>	"Nothing found"	v-model
Disabled	Prop<bool>	false	v-model
IsOpen	Prop<bool>	false	v-model
Variant	Prop<string>	"outlined"	v-model

Slots

Name
prepend
selection
item

Events

Name	Field	Payload
Change	OnChange	object
Open	OnOpen	—
Close	OnClose	—

Style hooks

USS class contract — override appearance without touching C#. States toggle via these classes:

• density-comfortable
• density-compact
• keyboard-focus
• sus-dropdown
• sus-dropdown__item
• sus-dropdown__item--highlighted
• sus-dropdown__item--selected
• sus-dropdown__list
• sus-dropdown__popup
• sus-dropdown__search
• sus-dropdown__search-input
• sus-dropdown__trigger
• sus-dropdown--disabled
• sus-dropdown--filled
• sus-dropdown--open
• sus-dropdown--outlined
• sus-dropdown--underlined

Usage

Items is a List<object> (strings or POCOs). Use ItemTitle / ItemValue when items are objects.

var dropdown = new SusDropdown();
dropdown.Label.Value = "Difficulty";
dropdown.Items.Value = new List<object> { "Easy", "Normal", "Hard" };
dropdown.Model.Value = "Normal";
dropdown.IsOpen.Value = true;
dropdown.Variant.Value = "outlined";
dropdown.OnChange += value => { /* … */ };

Prop	Role
Items	Options (List<object>)
Model	Current selection
ItemTitle / ItemValue	Property names when items are objects
Searchable / SearchText	Filter the open list
IsOpen	Show / hide the popup

Variant

filled · outlined · underlined · plain · solo · solo-inverted · solo-filled