diff --git a/packages/website/package.json b/packages/website/package.json
index d032176a8..b4161f693 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -54,7 +54,6 @@
"@mantine/hooks": "^5.1.6",
"@mantine/next": "^5.1.6",
"@mantine/nprogress": "^5.1.6",
- "@mantine/prism": "^5.1.6",
"@mantine/spotlight": "^5.1.6",
"@microsoft/api-extractor-model": "^7.23.0",
"@microsoft/tsdoc": "0.14.1",
@@ -91,7 +90,6 @@
"eslint-plugin-react-hooks": "^4.6.0",
"happy-dom": "^6.0.4",
"prettier": "^2.7.1",
- "prism-react-renderer": "^1.3.5",
"typescript": "^4.7.4",
"unocss": "^0.45.6",
"vercel": "^28.0.1",
diff --git a/packages/website/src/components/DocContainer.tsx b/packages/website/src/components/DocContainer.tsx
index df2d3229c..7a868a893 100644
--- a/packages/website/src/components/DocContainer.tsx
+++ b/packages/website/src/components/DocContainer.tsx
@@ -1,8 +1,9 @@
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';
@@ -50,9 +51,14 @@ export function DocContainer({
-
+
{excerpt}
-
+
{extendsTokens?.length ? (
diff --git a/packages/website/src/components/tsdoc/TSDoc.tsx b/packages/website/src/components/tsdoc/TSDoc.tsx
index a9e2170b4..cb705a50e 100644
--- a/packages/website/src/components/tsdoc/TSDoc.tsx
+++ b/packages/website/src/components/tsdoc/TSDoc.tsx
@@ -1,9 +1,9 @@
-import { Anchor, Box, Code, Text } from '@mantine/core';
-import { Prism } from '@mantine/prism';
+import { Anchor, Box, Text } from '@mantine/core';
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,17 +61,24 @@ export function TSDoc({ node }: { node: AnyDocNodeJSON }): JSX.Element {
case DocNodeKind.CodeSpan: {
const { code } = node as DocFencedCodeJSON;
return (
-
+
{code}
-
+
);
}
case DocNodeKind.FencedCode: {
const { language, code } = node as DocFencedCodeJSON;
return (
-
+
{code}
-
+
);
}
case DocNodeKind.Block: {
diff --git a/yarn.lock b/yarn.lock
index 2f2b991bd..7f03f5385 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1980,7 +1980,6 @@ __metadata:
"@mantine/hooks": ^5.1.6
"@mantine/next": ^5.1.6
"@mantine/nprogress": ^5.1.6
- "@mantine/prism": ^5.1.6
"@mantine/spotlight": ^5.1.6
"@microsoft/api-extractor-model": ^7.23.0
"@microsoft/tsdoc": 0.14.1
@@ -2010,7 +2009,6 @@ __metadata:
happy-dom: ^6.0.4
next: ^12.2.5
prettier: ^2.7.1
- prism-react-renderer: ^1.3.5
react: ^18.2.0
react-dom: ^18.2.0
react-icons: ^4.4.0
@@ -2760,21 +2758,6 @@ __metadata:
languageName: node
linkType: hard
-"@mantine/prism@npm:^5.1.6":
- version: 5.1.6
- resolution: "@mantine/prism@npm:5.1.6"
- dependencies:
- "@mantine/utils": 5.1.6
- prism-react-renderer: ^1.2.1
- peerDependencies:
- "@mantine/core": 5.1.6
- "@mantine/hooks": 5.1.6
- react: ">=16.8.0"
- react-dom: ">=16.8.0"
- checksum: 6fc07858c77b9b57a085e6b2b502612cdb5dcb3417f9c044a8974a5e113013dcb88bff4769853abcb830bd18e419d5c088800f634f6acfe0f67229122137e779
- languageName: node
- linkType: hard
-
"@mantine/spotlight@npm:^5.1.6":
version: 5.1.6
resolution: "@mantine/spotlight@npm:5.1.6"
@@ -12763,15 +12746,6 @@ __metadata:
languageName: node
linkType: hard
-"prism-react-renderer@npm:^1.2.1, prism-react-renderer@npm:^1.3.5":
- version: 1.3.5
- resolution: "prism-react-renderer@npm:1.3.5"
- peerDependencies:
- react: ">=0.14.9"
- checksum: c18806dcbc4c0b4fd6fd15bd06b4f7c0a6da98d93af235c3e970854994eb9b59e23315abb6cfc29e69da26d36709a47e25da85ab27fed81b6812f0a52caf6dfa
- languageName: node
- linkType: hard
-
"prismjs@npm:^1.27.0":
version: 1.28.0
resolution: "prismjs@npm:1.28.0"