Nomchy/discord.js
1
0
Fork 0
mirror of https://github.com/discordjs/discord.js.git synced 2026-03-13 18:13:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(website): render syntax and mdx on the server (#9086)

Browse Source
This commit is contained in:
Suneet Tipirneni
2023-03-23 17:17:41 -04:00
committed by GitHub
parent bc641fa936
commit ee5169e0aa
91 changed files with 820 additions and 1688 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
apps/website/src/components/SyntaxHighlighter.tsx
View File

@@ -1,32 +1,15 @@
'use client';
import { Code } from 'bright';
import { PrismAsyncLight } from 'react-syntax-highlighter';
import { vscDarkPlus, prism } from 'react-syntax-highlighter/dist/cjs/styles/prism';
export function SyntaxHighlighter({ language = 'typescript', code }: { code: string; language?: string }) {
export function SyntaxHighlighter(props: typeof Code) {
return (
<>
<div data-theme="dark">
<PrismAsyncLight
codeTagProps={{ style: { fontFamily: 'JetBrains Mono' } }}
language={language}
style={vscDarkPlus}
wrapLines
wrapLongLines
>
{code}
</PrismAsyncLight>
{/* @ts-expect-error async component */}
<Code codeClassName="font-mono" lang={props.lang ?? 'typescript'} {...props} theme="github-dark-dimmed" />
</div>
<div data-theme="light">
<PrismAsyncLight
codeTagProps={{ style: { fontFamily: 'JetBrains Mono' } }}
language={language}
style={prism}
wrapLines
wrapLongLines
>
{code}
</PrismAsyncLight>
{/* @ts-expect-error async component */}
<Code codeClassName="font-mono" lang={props.lang ?? 'typescript'} {...props} theme="min-light" />
</div>
</>
);