DuxtCodeBlock
The card around a code block.
The frame every fence is drawn in: filename, language icon, copy button.
Usage
Called by ProsePre rather than by
hand, but usable directly:
<DuxtCodeBlock code="pnpm add -D @kirchdev/duxt" language="bash" />
API
Props
| Prop | Type | Notes |
|---|---|---|
code | string | Raw source, for the copy button and as the body |
language | string | Picks the icon |
filename | string | The label in the header |
Slots
| Slot | What goes in it |
|---|---|
default | Highlighted markup, when there is any |
Notes
Without a filename the copy button floats in the corner and appears on hover; with one it sits in the header, where it is always visible. A block that is always showing a button in the corner of the page is noisier than one that shows it when a reader goes looking.
Was this page helpful?