37 lines
911 B
TypeScript
37 lines
911 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;
|
|
|
|
/**
|
|
* The language of the code.
|
|
*/
|
|
language: string;
|
|
};
|
|
|
|
export function CodeBlock({ code, language }: CodeBlockProps): ReactElement {
|
|
return (
|
|
<SyntaxHighlighter
|
|
className="!bg-transparent text-xs"
|
|
style={atomOneDark}
|
|
language={language == "text" ? "plaintext" : language}
|
|
showLineNumbers
|
|
codeTagProps={{
|
|
style: {
|
|
fontFamily: jetbrainsMono.style.fontFamily,
|
|
fontWeight: jetbrainsMono.style.fontWeight,
|
|
fontStyle: jetbrainsMono.style.fontStyle,
|
|
},
|
|
}}
|
|
>
|
|
{code}
|
|
</SyntaxHighlighter>
|
|
);
|
|
}
|