Skip to content

Commit 579bb5a

Browse files
authored
fix(theme): CodeBlock should accept title of ReactNode type (#10999)
* allow ReactNode for CodeBlock title * fix example
1 parent 7d36e2a commit 579bb5a

File tree

2 files changed

+23
-1
lines changed

2 files changed

+23
-1
lines changed

packages/docusaurus-theme-classic/src/theme-classic.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -410,7 +410,7 @@ declare module '@theme/CodeBlock' {
410410
readonly children: ReactNode;
411411
readonly className?: string;
412412
readonly metastring?: string;
413-
readonly title?: string;
413+
readonly title?: ReactNode;
414414
readonly language?: string;
415415
readonly showLineNumbers?: boolean | number;
416416
}

website/_dogfooding/_pages tests/code-block-tests.mdx

+22
Original file line numberDiff line numberDiff line change
@@ -188,6 +188,28 @@ Multi-line text inside `pre` will turn into one-liner, but it's okay (https://gi
188188
<br />
189189
</CodeBlock>
190190

191+
## Code blocks with `ReactNode` in title
192+
193+
<CodeBlock
194+
language="yaml"
195+
title={
196+
<div
197+
style={{
198+
display: 'flex',
199+
justifyContent: 'space-between',
200+
alignItems: 'center',
201+
}}>
202+
<span>
203+
<code>ReactNode</code> title
204+
</span>{' '}
205+
<span className="badge badge--primary">YAML</span>
206+
</div>
207+
}>
208+
{`link:
209+
title: front page
210+
path: /docs/`}
211+
</CodeBlock>
212+
191213
## Code blocks with line numbering tests
192214

193215
```jsx

0 commit comments

Comments
 (0)