Components
Syntax Highlight
It is used to highlight code blocks in your content.
You can also use backticks to highlight code blocks in Markdown files, see Code Blocks for more information.
Types
type SyntaxHighlightProps = {
language?: string;
code?: string;
wrapLines?: boolean;
title?: string;
showCopy?: "hover" | "always" | "never";
showCopyText?: boolean;
children?: string;
showLanguageIndicator?: boolean;
noBackground?: boolean;
className?: string;
};tsUsage
You can either use children or code prop to pass the code to the component.
<SyntaxHighlight language="typescript">
for (let i = 0; i < Infinity; i++) {
console.log(i);
}
</SyntaxHighlight>tsxResult
for (let i = 0; i < Infinity; i++) {
console.log(i);
}