mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 13:17:00 +04:00
26 lines
810 B
Plaintext
26 lines
810 B
Plaintext
---
|
|
// Highlighted code block with a copy button — used by CodeDocs.
|
|
import Icon from '@ui/Icon.astro'
|
|
import { highlightCode } from '@shared/lib/code-example'
|
|
|
|
interface Props {
|
|
/** The code to display. */
|
|
code: string
|
|
/** Shiki language used for highlighting. */
|
|
lang: string
|
|
}
|
|
|
|
const { code, lang } = Astro.props
|
|
|
|
const highlighted = await highlightCode(code, lang)
|
|
---
|
|
|
|
<div class="position-relative">
|
|
<button type="button" class="btn btn-icon btn-dark position-absolute m-2 top-0 end-0 z-3" data-bs-toggle="clipboard" data-bs-text={code} aria-label="Copy code">
|
|
<Icon name="clipboard" class="clipboard-label" />
|
|
<Icon name="check" class="clipboard-feedback" />
|
|
<span class="clipboard-feedback visually-hidden">Copied</span>
|
|
</button>
|
|
<Fragment set:html={highlighted} />
|
|
</div>
|