blob: 019709a9f07a4c01d26db0c0c5948912d6c679c1 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
import { JSX, useLayoutEffect, useState } from "react";
import { type BundledLanguage, highlight } from "../../highlight";
type Props = {
code: string;
language: BundledLanguage;
};
export default function CodeBlock({ code, language }: Props) {
const [nodes, setNodes] = useState<JSX.Element | null>(null);
useLayoutEffect(() => {
highlight(code, language).then(setNodes);
}, [code, language]);
return (
<pre className="h-full w-full p-2 bg-gray-50 rounded-lg border border-gray-300 whitespace-pre-wrap break-words">
{nodes === null ? <code>{code}</code> : nodes}
</pre>
);
}
|
