31 lines
776 B
TypeScript
31 lines
776 B
TypeScript
import { ReactElement } from "react";
|
|
import SyntaxHighlighter from "react-syntax-highlighter";
|
|
import { atomOneDark } from "react-syntax-highlighter/dist/esm/styles/hljs";
|
|
import { jetbrainsMono } from "@/app/common/font/font";
|
|
|
|
type CodeBlockProps = {
|
|
/**
|
|
* The code to highlight.
|
|
*/
|
|
code: string;
|
|
};
|
|
|
|
export function CodeBlock({ code }: CodeBlockProps): ReactElement {
|
|
return (
|
|
<SyntaxHighlighter
|
|
className="!bg-transparent text-xs"
|
|
style={atomOneDark}
|
|
showLineNumbers
|
|
codeTagProps={{
|
|
style: {
|
|
fontFamily: jetbrainsMono.style.fontFamily,
|
|
fontWeight: jetbrainsMono.style.fontWeight,
|
|
fontStyle: jetbrainsMono.style.fontStyle,
|
|
},
|
|
}}
|
|
>
|
|
{code}
|
|
</SyntaxHighlighter>
|
|
);
|
|
}
|