CodeBlock Component

The CodeBlock component is used to display code snippets in a styled block. It includes a header with a language label and a copy-to-clipboard button for convenience.

Installation

Install with the following command

bash

npm i @anakin-gbit/code-block@latest

For syntax highlighting you must include a Highlight.js theme manually in your project, eg. in the root layout.tsx.

tsx

import 'highlight.js/styles/github.css'

Usage

tsx

import { CodeBlock } from '@anakin-gbit/code-block'

<CodeBlock 
  code={\`const greet = () => {\\n  console.log('Hello, world!');\\n}\`}/>`}
  language="language-javascript"
/>