Code Block

1import { Button } from '@adila-sh/ui';2
3export function SaveButton() {4const label = 'Salvar alterações';5return <Button>{label}</Button>;6}

Instalação

bun add @adila-sh/ui

Uso

import { CodeBlock } from "@adila-sh/ui";

export function Example() {
  return (
    <CodeBlock
      code={`const greeting = 'Olá, mundo!';`}
      language="typescript"
      filename="example.ts"
      showLineNumbers
      highlightLines={[1]}
    />
  );
}

Linguagens

O highlighter reconhece JavaScript, TypeScript, JSX, TSX, JSON, Bash, Shell, CSS, HTML, SVG, XML e MDX. Linguagens não reconhecidas recebem a formatação base sem comprometer a legibilidade.

Linhas em destaque

Passe números de linha em highlightLines para chamar atenção para mudanças ou trechos importantes.