Bypass inline code (#233)

.changeset/perfect-onions-dream.md

@@ -0,0 +1,5 @@
+---
+"rehype-pretty-code": minor
+---
+
+Adds an option to bypass inline code blocks

docs/src/content/docs/index.mdx

@@ -220,6 +220,7 @@ interface Options {
   grid?: boolean;
   theme?: Theme | Record<string, Theme>;
   keepBackground?: boolean;
+  bypassInlineCode?: boolean;
   defaultLang?: string | { block?: string; inline?: string };
   tokensMap?: Record<string, string>;
   transformers?: ShikiTransformer[];
@@ -277,6 +278,16 @@ const options = {
 };
 ```
 
+### `bypassInlineCode`
+
+Skip inline code highlighting:
+
+```js
+const options = {
+  bypassInlineCode: true,
+};
+```
+
 ### `defaultLang`
 
 When no code language is specified, inline code or code blocks will not be

examples/next/src/app/index.mdx

@@ -94,6 +94,7 @@ Inline ANSI: `> Local: http://localhost:3000/{:ansi}`
   - [grid](#grid)
   - [theme](#theme)
   - [keepBackground](#keepbackground)
+  - [bypassInlineCode](#bypassInlineCode)
   - [defaultLang](#defaultlang)
   - [transformers](#transformers)
 - [Meta Strings](#meta-strings)

packages/core/src/index.ts

@@ -177,6 +177,7 @@ export function rehypePrettyCode(
     grid = true,
     theme = 'github-dark-dimmed',
     keepBackground = true,
+    bypassInlineCode = false,
     defaultLang = '',
     tokensMap = {},
     filterMetaString = (v) => v,
@@ -235,7 +236,7 @@ export function rehypePrettyCode(
 
     // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: <explanation>
     visit(tree, 'element', (element, _, parent) => {
-      if (isInlineCode(element, parent)) {
+      if (isInlineCode(element, parent, bypassInlineCode)) {
         const textElement = element.children[0];
         if (!isText(textElement)) return;
         const value = textElement.value;
@@ -280,7 +281,7 @@ export function rehypePrettyCode(
 
     // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: <explanation>
     visit(tree, 'element', (element, _, parent) => {
-      if (isInlineCode(element, parent)) {
+      if (isInlineCode(element, parent, bypassInlineCode)) {
         const textElement = element.children[0];
         if (!isText(textElement)) return;
         const value = textElement.value;

packages/core/src/types.ts

@@ -24,6 +24,7 @@ export interface Options {
   grid?: boolean;
   theme?: Theme | Record<string, Theme>;
   keepBackground?: boolean;
+  bypassInlineCode?: boolean;
   defaultLang?: string | { block?: string; inline?: string };
   tokensMap?: Record<string, string>;
   transformers?: Array<ShikiTransformer>;

packages/core/src/utils.ts

@@ -20,7 +20,11 @@ export function isText(value: ElementContent | null): value is Text {
 export function isInlineCode(
   element: Element,
   parent: Element | Root | undefined,
+  bypass = false,
 ): element is Element {
+  if (bypass) {
+    return false;
+  }
   return (
     (element.tagName === 'code' &&
       isElement(parent) &&