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

refactor(website): use mantine code blocks (#8512)

Browse Source
This commit is contained in:
Suneet Tipirneni
2022-08-17 16:38:11 -04:00
committed by GitHub
parent 20680efbc9
commit 0bf3df30da
4 changed files with 38 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
packages/website/src/components/DocContainer.tsx
View File

@@ -1,9 +1,8 @@
import { Group, Stack, Title, Text, Box } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks';
import { Prism } from '@mantine/prism';
import type { ReactNode } from 'react';
import { VscListSelection, VscSymbolParameter } from 'react-icons/vsc';
import { PrismAsyncLight as SyntaxHighlighter } from 'react-syntax-highlighter';
import { vscDarkPlus } from 'react-syntax-highlighter/dist/cjs/styles/prism';
import { HyperlinkedText } from './HyperlinkedText';
import { Section } from './Section';
import { TypeParamTable } from './TypeParamTable';
@@ -51,14 +50,9 @@ export function DocContainer({
</Section>
<Box px="xs" pb="xs">
<SyntaxHighlighter
wrapLongLines
language="typescript"
style={vscDarkPlus}
codeTagProps={{ style: { fontFamily: 'JetBrains Mono' } }}
>
<Prism language="typescript" colorScheme="dark">
{excerpt}
</SyntaxHighlighter>
</Prism>
</Box>
{extendsTokens?.length ? (

21
packages/website/src/components/tsdoc/TSDoc.tsx
View File

@@ -1,9 +1,9 @@
import { Anchor, Box, Text } from '@mantine/core';
import { Anchor, Box, Code, Text } from '@mantine/core';
import { Prism } from '@mantine/prism';
import { DocNodeKind, StandardTags } from '@microsoft/tsdoc';
import Link from 'next/link';
import type { Language } from 'prism-react-renderer';
import type { ReactNode } from 'react';
import { PrismAsyncLight as SyntaxHighlighter } from 'react-syntax-highlighter';
import { vscDarkPlus } from 'react-syntax-highlighter/dist/cjs/styles/prism';
import { BlockComment } from './BlockComment';
import type { DocBlockJSON } from '~/DocModel/comment/CommentBlock';
import type { AnyDocNodeJSON } from '~/DocModel/comment/CommentNode';
@@ -61,24 +61,17 @@ export function TSDoc({ node }: { node: AnyDocNodeJSON }): JSX.Element {
case DocNodeKind.CodeSpan: {
const { code } = node as DocFencedCodeJSON;
return (
<pre key={idx} className="inline">
<Code key={idx} className="inline text-sm font-mono">
{code}
</pre>
</Code>
);
}
case DocNodeKind.FencedCode: {
const { language, code } = node as DocFencedCodeJSON;
return (
<SyntaxHighlighter
key={idx}
wrapLines
wrapLongLines
language={language}
style={vscDarkPlus}
codeTagProps={{ style: { fontFamily: 'JetBrains Mono' } }}
>
<Prism key={idx} language={language as Language} withLineNumbers colorScheme="dark">
{code}
</SyntaxHighlighter>
</Prism>
);
}
case DocNodeKind.Block: {