Code-Block

Quelltext-Anzeige mit Kopfzeile (Dateiname/Sprache), optionalen Zeilennummern und Kopieren-Knopf — Syntax-Töne über Tokens, kein Highlighter zur Laufzeit

Im Builder nutzen

Nutzt: ui.icon

Beispiele

Mit Dateiname, Sprache, Zeilennummern und Kopieren

surface.jsonjsonKopieren

{
    "definition": "component.combobox",
    "props": {
        "label": "Team",
        "options": [{"label": "Vertrieb", "active": true}]
    }
}

Eigenschaften

Prop	Typ	Default	Builder-Label
code *	string	—	Quelltext
filename	string	""	Dateiname (Kopfzeile)
language	string	""	Sprache (Label)
lineNumbers	boolean	false	Zeilennummern
copyable	boolean	true	Kopieren-Knopf

* Pflicht-Prop

Events & Slots

Events: ⚡ copy — im Surface per on: {<event>: {action, params}} verdrahtbar.

Genutzte Design-Tokens

border.hairlinecolor.border.defaultcolor.surface.defaultcolor.surface.sunkencolor.text.defaultcolor.text.disabledcolor.text.mutedfont.family.defaultfont.family.monoleading.baseradius.fullradius.smradius.surfacesize.1size.2size.3size.4size.8text.smtext.xs