@primer/doctocat-nextjs 0.0.0-20250904115752 → 0.0.0-20250904133213

package/CHANGELOG.md

@@ -1,16 +1,16 @@
 # @primer/doctocat-nextjs
 
-## 0.0.0-20250904115752
+## 0.0.0-20250904133213
 
 ### Patch Changes
 
 - Fake entry to force publishing
 
-## 0.0.0-20250904115750
+## 0.0.0-20250904133211
 
 ### Minor Changes
 
-- [`84ff648`](https://github.com/primer/doctocat-nextjs/commit/84ff648a8248712d61e13a7e6432ab2ab8e07435) Thanks [@rezrah](https://github.com/rezrah)! - Updated Next.js compatibility to v15.5.x, Nextra to v4, and fix React code block rendering
+- [#65](https://github.com/primer/doctocat-nextjs/pull/65) [`84ff648`](https://github.com/primer/doctocat-nextjs/commit/84ff648a8248712d61e13a7e6432ab2ab8e07435) Thanks [@rezrah](https://github.com/rezrah)! - Updated Next.js compatibility to v15.5.x, Nextra to v4, and fix React code block rendering
 
   - **Next.js v15.5.2**: Upgraded to latest stable version across all workspaces
   - **Nextra v4 compatibility**: Updated type definitions for `ReactNode` titles

package/components/layout/code-block/CodeBlock.tsx

@@ -37,26 +37,40 @@ export function CodeBlock(props: CodeBlockProps) {
     // Next.js v15.4+ will lazy render components on the server, which prevents us from
     // sending usable React nodes to the ReactCodeBlock component.
     // Workaround is to convert the code snippets to string on the client and pass to react-live.
-    try {
-      const childrenAsString = renderToStaticMarkup(<>{props.children}</>)
-
-      const textContent = childrenAsString.replace(/<[^>]*>/g, '')
-
-      // Restore escaped chars
-      const decodedText = textContent
-        .replace(/&lt;/g, '<')
-        .replace(/&gt;/g, '>')
-        .replace(/&quot;/g, '"')
-        .replace(/&#x27;/g, "'")
-        .replace(/&amp;/g, '&')
-
-      return <ReactCodeBlock {...props} code={decodedText} />
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.log('Error extracting code snippet. Forwarding children directly:', error)
-      // Fallback to original children-based approach
-      return <ReactCodeBlock {...props} />
+
+    // suppresses compilation warnings
+    if (typeof window !== 'undefined') {
+      try {
+        const childrenAsString = renderToStaticMarkup(<>{props.children}</>)
+
+        // Extract text content using browser's HTML parser (immune to regex bypass attacks)
+        const cleanHtmlTag = (str: string): string => {
+          const parser = new DOMParser()
+          const doc = parser.parseFromString(str, 'text/html')
+          return doc.body.textContent || doc.body.innerText || ''
+        }
+
+        const textContent = cleanHtmlTag(childrenAsString)
+
+        // Restore escaped chars
+        const decodedText = textContent
+          .replace(/&lt;/g, '<')
+          .replace(/&gt;/g, '>')
+          .replace(/&quot;/g, '"')
+          .replace(/&#x27;/g, "'")
+          .replace(/&amp;/g, '&')
+
+        return <ReactCodeBlock {...props} code={decodedText} />
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.log('Error extracting code snippet. Forwarding children directly:', error)
+        // Fallback to original children-based approach
+        return <ReactCodeBlock {...props} />
+      }
     }
+
+    // During SSR/build, use children-based approach
+    return <ReactCodeBlock {...props} />
   }
 
   return <Pre>{props.children}</Pre>

package/components/layout/related-content-links/getRelatedPages.tsx

@@ -1,5 +1,6 @@
 import {DocsItem, FrontMatter} from '../../../types'
 import {RelatedContentLink} from './RelatedContentLinks'
+import React from 'react'
 
 type GetRelatedPages = (
   route: string,
@@ -58,7 +59,17 @@ export const getRelatedPages: GetRelatedPages = (route, activeMetadata, flatDocs
 }
 
 function titleToString(title: React.ReactNode): string {
-  if (typeof title === 'string') return title
-  if (typeof title === 'number') return title.toString()
-  return ''
+  const children = React.Children.toArray(title)
+
+  return children
+    .map(child => {
+      if (typeof child === 'string' || typeof child === 'number') {
+        return child.toString()
+      }
+      if (React.isValidElement(child) && child.props.children) {
+        return titleToString(child.props.children)
+      }
+      return ''
+    })
+    .join('')
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/doctocat-nextjs",
-  "version": "0.0.0-20250904115752",
+  "version": "0.0.0-20250904133213",
   "description": "A Next.js theme for building Primer documentation sites",
   "main": "index.js",
   "type": "module",