{({ className, style, tokens, getLineProps, getTokenProps }) => (
{tokens.map((line, i) => (
@@ -123,6 +125,36 @@ It doesn't render anything itself, it just calls the render function and renders
["Use a render prop!"](https://cdb.reacttraining.com/use-a-render-prop-50de598f11ce)!
`{highlight => /* your JSX here! */
}`
+### Inline Code
+> Note: backticks will break the inline code highlighting
+
+```jsx
+import React from "react";
+import { render } from "react-dom";
+import Highlight, { defaultProps } from "prism-react-renderer";
+
+const exampleInlineCode = `const ohDeerVar = "Stringly"`;
+
+render((
+
+ {({ className, style, tokens, getLineProps, getTokenProps }) =>
+ tokens.map((line, i) => (
+
+ {line.map((token, key) => (
+
+ ))}
+
+ ))
+ }
+ ,
+ document.getElementById('root')
+);
+```
+
### Line Numbers
Add line numbers to your highlighted code blocks using the `index` parameter in your `line.map` function: