From 0d561bfbb0fc3742ad7d33060f8fc5ed6601eea7 Mon Sep 17 00:00:00 2001 From: SonMooSans Date: Sun, 10 Sep 2023 15:40:20 +0800 Subject: [PATCH] Update rehype-pretty-code --- .../content/docs/ui/components/codeblock.mdx | 2 +- packages/next-docs-ui/css/styles.css | 12 ++-- .../next-docs-ui/src/components/mdx/pre.tsx | 10 +--- packages/next-docs/package.json | 2 +- .../src/mdx-plugins/rehype-next-docs.js | 18 ++---- pnpm-lock.yaml | 57 +++++++++---------- 6 files changed, 42 insertions(+), 59 deletions(-) diff --git a/apps/docs/content/docs/ui/components/codeblock.mdx b/apps/docs/content/docs/ui/components/codeblock.mdx index 7d18876b7..8d5c4d879 100644 --- a/apps/docs/content/docs/ui/components/codeblock.mdx +++ b/apps/docs/content/docs/ui/components/codeblock.mdx @@ -60,7 +60,7 @@ module.exports = withContentlayer(config) ## Example -```js title="next.config.js" {10} +```js title="next.config.js" {10} /config/ /** @type {import('next').NextConfig} */ const config = { pageExtensions: ['ts', 'tsx', 'js', 'jsx', 'md', 'mdx'], diff --git a/packages/next-docs-ui/css/styles.css b/packages/next-docs-ui/css/styles.css index b45493520..e24d12dd7 100644 --- a/packages/next-docs-ui/css/styles.css +++ b/packages/next-docs-ui/css/styles.css @@ -12,16 +12,16 @@ body { @apply nd-bg-background nd-text-foreground; } -[data-rehype-pretty-code-fragment] code { - @apply nd-grid nd-py-4; +[data-line] { + @apply nd-px-4 nd-border-l-2 nd-border-transparent; } -[data-rehype-pretty-code-fragment] .line { - @apply nd-pl-4 nd-pr-8; +[data-highlighted-line] { + @apply nd-border-primary nd-bg-primary/10; } -[data-rehype-pretty-code-fragment] .line-highlighted { - @apply nd-border-l-2 nd-border-l-primary nd-bg-primary/10; +[data-highlighted-chars] { + @apply nd-bg-primary/10 nd-border-b-2 nd-border-primary; } [data-rmiz-modal-overlay='visible'] { diff --git a/packages/next-docs-ui/src/components/mdx/pre.tsx b/packages/next-docs-ui/src/components/mdx/pre.tsx index 4db12e40d..a9b9122d1 100644 --- a/packages/next-docs-ui/src/components/mdx/pre.tsx +++ b/packages/next-docs-ui/src/components/mdx/pre.tsx @@ -21,7 +21,7 @@ export function Pre({ title, allowCopy = true, ...props }: PreProps) { return (
{title && (
@@ -30,16 +30,12 @@ export function Pre({ title, allowCopy = true, ...props }: PreProps) { )} {allowCopy && ( )} - 
+        
           {props.children}
         

       
diff --git a/packages/next-docs/package.json b/packages/next-docs/package.json
index 4a6443603..14584db94 100644
--- a/packages/next-docs/package.json
+++ b/packages/next-docs/package.json
@@ -100,7 +100,7 @@
     "negotiator": "^0.6.3",
     "react-remove-scroll": "^2.5.6",
     "rehype-img-size": "^1.0.1",
-    "rehype-pretty-code": "^0.9.5",
+    "rehype-pretty-code": "^0.10.1",
     "remark": "^14.0.3",
     "remark-gfm": "^3.0.1",
     "remark-mdx": "^2.3.0",
diff --git a/packages/next-docs/src/mdx-plugins/rehype-next-docs.js b/packages/next-docs/src/mdx-plugins/rehype-next-docs.js
index 290a98bdc..941866b3e 100644
--- a/packages/next-docs/src/mdx-plugins/rehype-next-docs.js
+++ b/packages/next-docs/src/mdx-plugins/rehype-next-docs.js
@@ -12,20 +12,13 @@ const customMetaRegex = /custom="([^"]+)"/
  */
 const rehypePrettyCodeOptions = {
   theme: 'css-variables',
-  keepBackground: false,
-  onVisitLine(node) {
-    if (node.children.length === 0) {
-      node.children = [{ type: 'text', value: ' ' }]
-    }
+  defaultLang: {
+    block: 'text'
   },
+  grid: true,
+  keepBackground: false,
   filterMetaString(s) {
     return s.replace(customMetaRegex, '')
-  },
-  onVisitHighlightedLine(node) {
-    node.properties.className.push('line-highlighted')
-  },
-  onVisitHighlightedWord(node) {
-    node.properties.className = ['word-highlighted']
   }
 }
 
@@ -51,9 +44,6 @@ export const rehypeNextDocs = () => async tree => {
       if (typeof codeEl.data?.meta === 'string') {
         node.nd_custom = codeEl.data.meta.match(customMetaRegex)?.[1]
       }
-
-      // Add default language `text` for code-blocks
-      codeEl.properties.className ||= ['language-text']
     }
   })
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index fffe8b8cd..e2c8505c1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -265,8 +265,8 @@ importers:
         specifier: ^1.0.1
         version: 1.0.1
       rehype-pretty-code:
-        specifier: ^0.9.5
-        version: 0.9.5(shiki@0.14.3)
+        specifier: ^0.10.1
+        version: 0.10.1(shiki@0.14.3)
       remark:
         specifier: ^14.0.3
         version: 14.0.3
@@ -2656,7 +2656,7 @@ packages:
   /@types/hast@2.3.4:
     resolution: {integrity: sha512-wLEm0QvaoawEDoTRwzTXp4b4jpwiJDvR5KMnFnVodm3scufTlBOWRD6N1OBf9TZMhjlNsSfcO5V+7AF4+Vy+9g==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 3.0.0
 
   /@types/hast@3.0.0:
     resolution: {integrity: sha512-SoytUJRuf68HXYqcXicQIhCrLQjqeYU2anikr4G3p3Iz+OZO5QDQpDj++gv+RenHsnUBwNZ2dumBArF8VLSk2Q==}
@@ -2688,7 +2688,7 @@ packages:
   /@types/mdast@3.0.11:
     resolution: {integrity: sha512-Y/uImid8aAwrEA24/1tcRZwpxX3pIFTSilcNDKSPn+Y2iDywSEachzRuvgAYYLR3wpGXAsMbv5lvKLDZLeYPAw==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 3.0.0
 
   /@types/mdast@3.0.12:
     resolution: {integrity: sha512-DT+iNIRNX884cx0/Q1ja7NyUPpZuv0KPyL5rGNxm1WC1OtHstl7n4Jb7nk+xacNShQMbczJjt8uFzznpp6kYBg==}
@@ -2749,15 +2749,11 @@ packages:
     resolution: {integrity: sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw==}
     dev: true
 
-  /@types/unist@2.0.6:
-    resolution: {integrity: sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==}
-
   /@types/unist@2.0.7:
     resolution: {integrity: sha512-cputDpIbFgLUaGQn6Vqg3/YsJwxUwHLO13v3i5ouxT4lat0khip9AEWxtERujXV9wxIB1EyF97BSJFt6vpdI8g==}
 
   /@types/unist@3.0.0:
     resolution: {integrity: sha512-MFETx3tbTjE7Uk6vvnWINA/1iJ7LuMdO4fcq8UfF0pRbj01aGLduVvQcRyswuACJdpnHgg8E3rQLhaRdNEJS0w==}
-    dev: false
 
   /@typescript-eslint/eslint-plugin@6.4.0(@typescript-eslint/parser@6.4.0)(eslint@8.47.0)(typescript@5.2.2):
     resolution: {integrity: sha512-62o2Hmc7Gs3p8SLfbXcipjWAa6qk2wZGChXG2JbBtYpwSRmti/9KHLqfbLs9uDigOexG+3PaQ9G2g3201FWLKg==}
@@ -4385,7 +4381,7 @@ packages:
     resolution: {integrity: sha512-Nz7FfPBuljzsN3tCQ4kCBKqdNhQE2l0Tn+X1ubgKBPRoiDIu1mL08Cfw4k7q71+Duyaw7DXDN+VTAp4Vh3oCOw==}
     dependencies:
       '@types/hast': 2.3.4
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       hastscript: 7.2.0
       property-information: 6.2.0
       vfile: 5.3.7
@@ -4396,7 +4392,7 @@ packages:
     resolution: {integrity: sha512-O1bKah6mhgEq2WtVMk+Ta5K7pPMqsBBlmzysLdcwKVrqzZQ0CHqUPiIVspNhAG1rvxpvJjtGee17XfauZYKqVA==}
     dependencies:
       '@types/hast': 2.3.4
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
     dev: false
 
   /hast-util-parse-selector@3.1.1:
@@ -4425,7 +4421,7 @@ packages:
       '@types/estree': 1.0.1
       '@types/estree-jsx': 1.0.0
       '@types/hast': 2.3.4
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       comma-separated-tokens: 2.0.3
       estree-util-attach-comments: 2.1.1
       estree-util-is-identifier-name: 2.1.0
@@ -4444,7 +4440,7 @@ packages:
     resolution: {integrity: sha512-4tpQTUOr9BMjtYyNlt0P50mH7xj0Ks2xpo8M943Vykljf99HW6EzulIoJP1N3eKOSScEHzyzi9dm7/cn0RfGwA==}
     dependencies:
       '@types/hast': 2.3.4
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       ccount: 2.0.1
       comma-separated-tokens: 2.0.3
       hast-util-raw: 7.2.3
@@ -4475,7 +4471,7 @@ packages:
     resolution: {integrity: sha512-tcllLfp23dJJ+ju5wCCZHVpzsQQ43+moJbqVX3jNWPB7z/KFC4FyZD6R7y94cHL6MQ33YtMZL8Z0aIXXI4XFTw==}
     dependencies:
       '@types/hast': 2.3.4
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       hast-util-is-element: 2.1.3
       unist-util-find-after: 4.0.1
     dev: false
@@ -5107,7 +5103,7 @@ packages:
     resolution: {integrity: sha512-8SVPMuHqlPME/z3gqVwWY4zVXn8lqKv/pAhC57FuJ40ImXyBpmO5ukh98zB2v7Blql2FiHjHv9LVztSIqjY+MA==}
     dependencies:
       '@types/mdast': 3.0.11
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       unist-util-visit: 4.1.2
 
   /mdast-util-find-and-replace@2.2.2:
@@ -5123,7 +5119,7 @@ packages:
     resolution: {integrity: sha512-HN3W1gRIuN/ZW295c7zi7g9lVBllMgZE40RxCX37wrTPWXCWtpvOZdfnuK+1WNpvZje6XuJeI3Wnb4TJEUem+g==}
     dependencies:
       '@types/mdast': 3.0.11
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       decode-named-character-reference: 1.0.2
       mdast-util-to-string: 3.2.0
       micromark: 3.1.0(supports-color@8.1.1)
@@ -5281,7 +5277,7 @@ packages:
     resolution: {integrity: sha512-bbv7TPv/WC49thZPg3jXuqzuvI45IL2EVAr/KxF0BSdHsU0ceFHOmwQn6evxAh1GaoK/6GQ1wp4R4oW2+LFL/A==}
     dependencies:
       '@types/mdast': 3.0.11
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       longest-streak: 3.1.0
       mdast-util-phrasing: 3.0.1
       mdast-util-to-string: 3.2.0
@@ -6694,12 +6690,13 @@ packages:
       unist-util-visit: 4.1.2
     dev: false
 
-  /rehype-pretty-code@0.9.5(shiki@0.14.3):
-    resolution: {integrity: sha512-TYA4oDxxn4z/YZ6ZNz7BX5BuyeJzi7D6XxI44T/eqUOBYypwwOd7RZ+IBb1NkERpian/k7sZ1+KsdIbWDRenQw==}
-    engines: {node: ^12.16.0 || >=13.2.0}
+  /rehype-pretty-code@0.10.1(shiki@0.14.3):
+    resolution: {integrity: sha512-WHjRvGlqPXG8BVRB9mK0255WvIOnzvHivAWhFkA2OG+NTkQWtTbCULZMokOHLf3Yy8q8I8/F8QNjDSQBhjMK5w==}
+    engines: {node: '>=16'}
     peerDependencies:
-      shiki: '*'
+      shiki: 0.x
     dependencies:
+      '@types/hast': 2.3.4
       hash-obj: 4.0.0
       parse-numeric-range: 1.3.0
       shiki: 0.14.3
@@ -7634,7 +7631,7 @@ packages:
   /unified@10.1.2:
     resolution: {integrity: sha512-pUSWAi/RAnVy1Pif2kAoeWNBa3JVrx0MId2LASj8G+7AiHWoKZNTomq6LG326T68U7/e263X6fTdcXIy7XnF7Q==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       bail: 2.0.2
       extend: 3.0.2
       is-buffer: 2.0.5
@@ -7645,7 +7642,7 @@ packages:
   /unist-util-find-after@4.0.1:
     resolution: {integrity: sha512-QO/PuPMm2ERxC6vFXEPtmAutOopy5PknD+Oq64gGwxKtk4xwo9Z97t9Av1obPmGU0IyTa6EKYUfTrK2QJS3Ozw==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       unist-util-is: 5.2.1
     dev: false
 
@@ -7666,23 +7663,23 @@ packages:
   /unist-util-position-from-estree@1.1.2:
     resolution: {integrity: sha512-poZa0eXpS+/XpoQwGwl79UUdea4ol2ZuCYguVaJS4qzIOMDzbqz8a3erUCOmubSZkaOuGamb3tX790iwOIROww==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
 
   /unist-util-position@4.0.4:
     resolution: {integrity: sha512-kUBE91efOWfIVBo8xzh/uZQ7p9ffYRtUbMRZBNFYwf0RK8koUMx6dGUfwylLOKmaT2cs4wSW96QoYUSXAyEtpg==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
 
   /unist-util-remove-position@4.0.2:
     resolution: {integrity: sha512-TkBb0HABNmxzAcfLf4qsIbFbaPDvMO6wa3b3j4VcEzFVaw1LBKwnW4/sRJ/atSLSzoIg41JWEdnE7N6DIhGDGQ==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       unist-util-visit: 4.1.2
 
   /unist-util-stringify-position@3.0.3:
     resolution: {integrity: sha512-k5GzIBZ/QatR8N5X2y+drfpWG8IDBzdnVj6OInRNWm1oXrzydiaAT2OQiA8DPRRZyAKb9b6I2a6PxYklZD0gKg==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
 
   /unist-util-visit-parents@5.1.3:
     resolution: {integrity: sha512-x6+y8g7wWMyQhL1iZfhIPhDAs7Xwbn9nRosDXl7qoPTSCy0yNxnKc+hWokFifWQIDGi154rdUqKvbCa4+1kLhg==}
@@ -7700,7 +7697,7 @@ packages:
   /unist-util-visit@4.1.2:
     resolution: {integrity: sha512-MSd8OUGISqHdVvfY9TPhyK2VdUrPgxkUtWSuMHF6XAAFuL4LokseigBnZtPnJMu+FbynTkFNnFlyjxpVKujMRg==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       unist-util-is: 5.2.1
       unist-util-visit-parents: 5.1.3
 
@@ -7826,19 +7823,19 @@ packages:
   /vfile-location@4.1.0:
     resolution: {integrity: sha512-YF23YMyASIIJXpktBa4vIGLJ5Gs88UB/XePgqPmTa7cDA+JeO3yclbpheQYCHjVHBn/yePzrXuygIL+xbvRYHw==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       vfile: 5.3.7
 
   /vfile-message@3.1.4:
     resolution: {integrity: sha512-fa0Z6P8HUrQN4BZaX05SIVXic+7kE3b05PWAtPuYP9QLHsLKYR7/AlLW3NtOrpXRLeawpDLMsVkmk5DG0NXgWw==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       unist-util-stringify-position: 3.0.3
 
   /vfile@5.3.7:
     resolution: {integrity: sha512-r7qlzkgErKjobAmyNIkkSpizsFPYiUPuJb5pNW1RB4JcYVZhs4lIbVqk8XPk033CV/1z8ss5pkax8SuhGpcG8g==}
     dependencies:
-      '@types/unist': 2.0.6
+      '@types/unist': 2.0.7
       is-buffer: 2.0.5
       unist-util-stringify-position: 3.0.3
       vfile-message: 3.1.4