Code Block
0.2.2
The Code Block component displays a piece of code.
| Namn | Typ | Beskrivning |
|---|---|---|
code * | string | The code string to display and copy. |
color | "light" |
"dark" |
"auto" | Controls the visual appearance of the block.
- "light" — always renders the light variant.
- "dark" — always renders the dark variant.
- "auto" — follows the active theme mode automatically. |
customAttribute | { attribute: string; value: string |
number } | Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]". |
hasCopyCodeButton | boolean | Toggles the copy-code button visibility. |
hasSkipCodeButton | boolean | Toggles the skip-code-block button visibility. |
lang * | "sv" |
"en" | Language used for internal translations. |
language | string | Syntax language for highlighting. Accepts any Prism-supported language.
Common values: "typescript", "javascript", "json", "bash", "css", "html". |
npm install @sj-ab/component-library.ui.code-block