You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: fern/products/docs/pages/component-library/default-components/code-blocks.mdx
+31-28Lines changed: 31 additions & 28 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,7 @@
1
1
---
2
2
title: 'Code Blocks'
3
3
description: 'Learn how to enhance your documentation with customizable code blocks featuring syntax highlighting, line highlighting, focusing, and more.'
4
+
max-toc-depth: 2
4
5
---
5
6
6
7
Fern uses [Shiki](https://shiki.matsu.io/) for syntax highlighting in code blocks.
@@ -303,7 +304,7 @@ To disable scrolling and wrap overflow onto the next line, use the `wordWrap` pr
303
304
</Tabs>
304
305
305
306
306
-
## Deep-linking
307
+
## Deeplinking
307
308
308
309
You can make specific text within code blocks clickable by defining a `links` map. This is useful for linking to documentation, API references, or related resources directly from your code examples.
309
310
@@ -345,55 +346,57 @@ The `links` property accepts a map where keys are matching patterns (exact strin
345
346
```
346
347
</CodeBlock>
347
348
````
348
-
349
-
<Note>
350
-
The `links` property uses JSON format. Each key in the map is matched exactly against text in the code block, and matching text becomes a clickable link to the corresponding URL.
351
-
</Note>
352
349
</Tab>
353
350
</Tabs>
354
351
352
+
<Note>
353
+
The `links` property uses JSON format. Each key in the map is matched exactly against text in the Code Block, and matching text becomes a clickable link to the corresponding URL.
354
+
</Note>
355
+
355
356
### Regex pattern matching
356
357
357
-
You can use regex patterns for more flexible matching. This is useful when you want to link multiple variations or patterns of text.
358
+
You can use regex patterns for more flexible matching. This is useful when you want to link multiple variations or patterns of text.
359
+
360
+
In the example below, the pattern `/get\\w+/` matches both `getPlant` and `getGarden`, while `/Plant(Store|Client)/` matches both `PlantStore` and `PlantClient`.
0 commit comments