From 77caf4b379c501922163c2c99076f1dfd46fe7f6 Mon Sep 17 00:00:00 2001
From: Balthasar Hofer <lebalz@outlook.com>
Date: Mon, 17 Mar 2025 09:16:52 +0100
Subject: [PATCH 1/2] allow ReactNode for CodeBlock title

---
 .../docusaurus-theme-classic/src/theme-classic.d.ts  |  2 +-
 .../_dogfooding/_pages tests/code-block-tests.mdx    | 12 ++++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/docusaurus-theme-classic/src/theme-classic.d.ts b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
index 78c25c3e48aa..323ef6effb24 100644
--- a/packages/docusaurus-theme-classic/src/theme-classic.d.ts
+++ b/packages/docusaurus-theme-classic/src/theme-classic.d.ts
@@ -410,7 +410,7 @@ declare module '@theme/CodeBlock' {
     readonly children: ReactNode;
     readonly className?: string;
     readonly metastring?: string;
-    readonly title?: string;
+    readonly title?: ReactNode;
     readonly language?: string;
     readonly showLineNumbers?: boolean | number;
   }
diff --git a/website/_dogfooding/_pages tests/code-block-tests.mdx b/website/_dogfooding/_pages tests/code-block-tests.mdx
index 83454500f7b2..de9a3dcdb63e 100644
--- a/website/_dogfooding/_pages tests/code-block-tests.mdx	
+++ b/website/_dogfooding/_pages tests/code-block-tests.mdx	
@@ -188,6 +188,18 @@ Multi-line text inside `pre` will turn into one-liner, but it's okay (https://gi
   <br />
 </CodeBlock>
 
+### Code blocks with `ReactNode` in title
+
+<CodeBlock 
+  className="language-yaml"
+  title={<span className="badge badge--primary">YAML</span>}
+>
+  link:{'\n'}
+  {'  '}title: front page{'\n'}
+  {'  '}path: /docs/{'\n'}
+</CodeBlock>
+
+
 ## Code blocks with line numbering tests
 
 ```jsx

From 156e542de7e4a2fedd20abddd990b43a6654a3e1 Mon Sep 17 00:00:00 2001
From: Balthasar Hofer <lebalz@outlook.com>
Date: Mon, 17 Mar 2025 08:55:39 +0000
Subject: [PATCH 2/2] fix example

---
 .../_pages tests/code-block-tests.mdx         | 30 ++++++++++++-------
 1 file changed, 20 insertions(+), 10 deletions(-)

diff --git a/website/_dogfooding/_pages tests/code-block-tests.mdx b/website/_dogfooding/_pages tests/code-block-tests.mdx
index de9a3dcdb63e..dfff4af5a345 100644
--- a/website/_dogfooding/_pages tests/code-block-tests.mdx	
+++ b/website/_dogfooding/_pages tests/code-block-tests.mdx	
@@ -188,18 +188,28 @@ Multi-line text inside `pre` will turn into one-liner, but it's okay (https://gi
   <br />
 </CodeBlock>
 
-### Code blocks with `ReactNode` in title
-
-<CodeBlock 
-  className="language-yaml"
-  title={<span className="badge badge--primary">YAML</span>}
->
-  link:{'\n'}
-  {'  '}title: front page{'\n'}
-  {'  '}path: /docs/{'\n'}
+## Code blocks with `ReactNode` in title
+
+<CodeBlock
+  language="yaml"
+  title={
+    <div
+      style={{
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+      }}>
+      <span>
+        <code>ReactNode</code> title
+      </span>{' '}
+      <span className="badge badge--primary">YAML</span>
+    </div>
+  }>
+  {`link:
+  title: front page
+  path: /docs/`}
 </CodeBlock>
 
-
 ## Code blocks with line numbering tests
 
 ```jsx