Combobox (Select mit Suche) — component.combobox
Einzelauswahl mit Suchfilter und Options-Panel: Tastatur-Navigation (Pfeile/Enter), Escape/Außenklick schließen, optionale Beschreibungen pro Option
Componentv1.0.0Formulareweb.documentweb.applicationdesktop.shellbuilder.preview
Beispiele
Einzelauswahl mit Suche und Beschreibungen (Pfeiltasten + Enter)
Zuständiges Team
Keine Treffer
Eigenschaften
| Prop | Typ | Default |
|---|---|---|
label | string | "" |
placeholder | string | "Auswählen …" |
searchPlaceholder | string | "Suchen …" |
options * | array | — |
Events & Slots
Events: change
Stellschrauben (Komponenten-Tokens)
| Token | Default |
|---|---|
--combobox-action-primary | var(--color-action-primary) |
--combobox-border-default | var(--color-border-default) |
--combobox-elevation-overlay | var(--elevation-overlay) |
--combobox-focus-ring-color | var(--focus-ring-color) |
--combobox-focus-ring-offset | var(--focus-ring-offset) |
--combobox-focus-ring-width | var(--focus-ring-width) |
--combobox-form-background | var(--form-background) |
--combobox-form-border | var(--form-border) |
--combobox-form-border-hover | var(--form-border-hover) |
--combobox-form-placeholder | var(--form-placeholder) |
--combobox-radius-control | var(--radius-control) |
--combobox-radius-sm | var(--radius-sm) |
--combobox-surface-overlay | var(--color-surface-overlay) |
--combobox-surface-sunken | var(--color-surface-sunken) |
--combobox-text-default | var(--color-text-default) |
--combobox-text-muted | var(--color-text-muted) |
Genutzte Design-Tokens
border.hairline color.action.primary color.border.default color.surface.overlay color.surface.sunken color.text.default color.text.muted elevation.overlay focus.ring-color focus.ring-offset focus.ring-width font.family.default form.background form.border form.border-hover form.placeholder layer.dropdown radius.control radius.sm size.1 size.2 size.3 size.32 text.md text.sm weight.medium