Code Block
A customizable code block component for displaying code snippets with syntax highlighting.
Installation
Usage
example.mdx
1import { CodeBlock } from '@/components/pumki-ui/codeblock';2 3<CodeBlock language="mdx" filename="example.mdx">Code to be shown in codeblock</CodeBlock>Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | string | - | The code to display inside the code block. |
language? | string | ”text” | Language for syntax highlighting. |
filename? | string | - | Optional filename to display in the header. |
highlight? | string | - | Lines or substring to highlight (e.g. “1,3-5” or “/text/“). |
copy? | boolean | true | Show copy-to-clipboard button. |
showLineNumbers? | boolean | true | Show line numbers. |
className? | string | - | Additional CSS classes for the code block container. |
Last updated on