diff --git a/.changeset/forty-cameras-peel.md b/.changeset/forty-cameras-peel.md new file mode 100644 index 00000000..3aa81db2 --- /dev/null +++ b/.changeset/forty-cameras-peel.md @@ -0,0 +1,5 @@ +--- +"@primer/gatsby-theme-doctocat": minor +--- + +Add syntax highlighting support for `ruby` and `erb` code examples diff --git a/theme/package.json b/theme/package.json index ec3e4d22..095aafbe 100644 --- a/theme/package.json +++ b/theme/package.json @@ -53,7 +53,8 @@ "pkg-up": "^3.1.0", "pluralize": "^8.0.0", "preval.macro": "^3.0.0", - "prism-react-renderer": "^0.1.7", + "prism-react-renderer": "^1.2.0", + "prismjs": "^1.22.0", "react-addons-text-content": "^0.0.4", "react-element-to-jsx-string": "^14.0.3", "react-focus-on": "^3.3.0", diff --git a/theme/src/components/code.js b/theme/src/components/code.js index 9155136e..75cbc056 100644 --- a/theme/src/components/code.js +++ b/theme/src/components/code.js @@ -1,6 +1,7 @@ -import {Absolute, Box, Relative, Text} from '@primer/components' -import Highlight, {defaultProps} from 'prism-react-renderer' -import githubTheme from 'prism-react-renderer/themes/github' +import { Absolute, Box, Relative, Text } from '@primer/components' +import Highlight, { defaultProps } from 'prism-react-renderer' +import Prism from '../prism' +import githubTheme from '../github' import React from 'react' import ClipboardCopy from './clipboard-copy' import LiveCode from './live-code' @@ -20,6 +21,7 @@ function Code({className, children, live, noinline}) {