Eingabegruppe

Eingabefeld mit Prefix-/Suffix-Addons im gemeinsamen Rahmen (€-Zeichen, Einheiten, Icons) — der Bootstrap-input-group-Fall für Preis- und Einheitenfelder

Im Builder nutzen

Nutzt: ui.icon

Beispiele

Preisfeld (€-Prefix)

Verkaufspreis€Brutto inkl. MwSt.

Einheit als Suffix

Gewichtkg

Suche mit Icon

Fehlerzustand

Rabatt%Maximal 100 % möglich.

Eigenschaften

Prop	Typ	Default	Builder-Label
label	string	""	Beschriftung
name	string	""	Feldname
value	string	""	Wert
placeholder	string	""	Platzhalter
type	string: text | number | search | email | url | tel	"text"	Typ
prefix	string	""	Prefix-Text (z. B. €)
suffix	string	""	Suffix-Text (z. B. kg)
prefixIcon	string	""	Prefix-Icon
suffixIcon	string	""	Suffix-Icon
disabled	boolean	false	Deaktiviert
invalid	boolean	false	Fehlerzustand
hint	string	""	Hinweis

* Pflicht-Prop

Stellschrauben (Komponenten-Tokens)

Ebene 3 — aus dem CSS generiert (Registry). Umverdrahtbar per Hüllen-Komposition, ohne Markup-Eingriff; künftige Regler-Quelle des Component Builders.

Token	Default
--input-group-border	var(--form-border, var(--color-border-default))
--input-group-background	var(--form-background, var(--color-surface-default))
--input-group-addon-background	var(--color-surface-sunken)
--input-group-radius	var(--radius-control)

Genutzte Design-Tokens

border.hairlinecolor.border.defaultcolor.border.errorcolor.status.dangercolor.surface.defaultcolor.surface.sunkencolor.text.defaultcolor.text.disabledcolor.text.mutedcolor.text.placeholderduration.fasteasing.standardfocus.ring-colorfocus.ring-offsetfocus.ring-widthfont.family.defaultform.backgroundform.borderradius.controlsize.1size.2size.3text.mdtext.smweight.semibold