---

## CodeBlock
**Stability:** experimental — shipped to be used and judged, but the API may change in any release without notice.
Read-only code display with a one-click copy interaction: the copy
button swaps its icon and label to a confirmation for two seconds and fires `onCopy`.
Renders raw text only — no built-in syntax highlighting; a consumer or the
StreamingMarkdown renderer can layer highlighting in via a snippet. Used by
StreamingMarkdown for fenced code blocks, and standalone for any code snippet.
`variant="card"` (default) brings its own surface, outline and radius;
`variant="plain"` drops all three for embedding inside a parent that supplies
its own framing (as ToolCallCard does).

**Import:** `import { CodeBlock } from '@urbicon-ui/blocks';`

### Examples
```svelte
<CodeBlock lang="ts" code={`const x = 1;`} onCopy={(c) => track(c)} />
```

### Variants
- variant: card, plain (default: card)
- wrap: false, true (default: false)

### Api
| Prop | Type | Required | Default | Description |
| --- | --- | :---: | --- | --- |
| code | `string` | yes |  | The code to display and copy. Rendered as raw text (no highlighting). |
| ...CodeBlockVariants | `VariantProps` | no |  | Styling variants from CodeBlockVariants |
| ...HTMLAttributes<HTMLElement> | `HTMLAttributes` | no |  | HTML attributes (excluding: 'children' | 'class') |
| actions | `Snippet` | no |  | Extra header actions rendered in the header, just before the copy button. |
| class | `string` | no |  | Extra classes merged onto the root element. In the same Tailwind bucket `class` wins over the `slotClasses` entry for the element it lands on. Presets and provider defaults sit below both. |
| copiedLabel | `string` | no | 'Copied' | Label shown for two seconds after a successful copy. |
| copyFailedLabel | `string` | no | 'Copy failed' | Label shown for two seconds after a FAILED copy — e.g. a denied clipboard permission or a non-secure context. |
| copyLabel | `string` | no | 'Copy' | Accessible label / tooltip for the copy button at rest. These labels are plain English defaults rather than i18n-resolved, so this leaf stays out of the i18n registry. Pass your own strings to localise. |
| label | `string` | no |  | Header caption, shown instead of `lang`. For an embedded block, naming what the payload *is* ("Input", "Response body") is often clearer than the language it is serialised in. `lang` still names the scrollable region for screen readers when both are given. |
| lang | `string` | no |  | Language label shown in the header. Display-only — does not drive highlighting. |
| onCopy | `(code: string) => void` | no |  | Called with the copied code after a successful clipboard write. |
| onCopyError | `(error: unknown) => void` | no |  | Called with the thrown reason when the clipboard write fails. Without a handler the failure is logged; either way the button reports it. |
| preset | `string` | no |  | Apply a named preset registered via `<BlocksProvider presets={{ CodeBlock: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette. |
| showCopy | `boolean` | no |  | Show the copy button in the header. |
| slotClasses | `Partial<Record<CodeBlockSlots, string>>` | no |  | Per-slot class overrides. Slots: root | header | langLabel | copyButton | pre | code. Note `variant="plain"` deliberately leaves root/header/pre without surface, outline or padding — the embedding parent supplies those. In the same Tailwind bucket `class` wins over the `slotClasses` entry for the element it lands on. Presets and provider defaults sit below both. |
| unstyled | `boolean` | no |  | Remove all default tv classes. |
| wrap | `boolean` | no |  | Soft-wrap long lines. `false` (default) scrolls horizontally inside the block; `true` wraps with `whitespace-pre-wrap` + word breaking. |
| variant | `'card' | 'plain'` | no | card | Controls the visual style and presentation of the CodeBlock. Determines the component's visual treatment. Available options: card, plain. |

Inherited from:
- CodeBlockVariants (external)
- Omit<HTMLAttributes<HTMLElement>, 'children' | 'class'> (omit-pattern)

### Types
```ts
type SlotNames = keyof ReturnType<T> & string
```

```ts
type VariantProps = Omit<
  Exclude<Parameters<T>[0], undefined>,
  'class'
>
```

### Slots (slotClasses keys)
`root`, `header`, `langLabel`, `copyButton`, `pre`, `code`