2019-03-12 18:46:44 +01:00
|
|
|
// @flow
|
|
|
|
|
import React from "react";
|
2019-10-17 12:07:20 +02:00
|
|
|
|
|
|
|
|
// TODO fix code splitting in production
|
|
|
|
|
// Storybook does not like the LightAsync import:
|
|
|
|
|
// import { LightAsync as ReactSyntaxHighlighter } from "react-syntax-highlighter";
|
|
|
|
|
// so we should use the default import for development and the LightAsync for production
|
|
|
|
|
import ReactSyntaxHighlighter from "react-syntax-highlighter";
|
2019-10-09 14:19:26 +02:00
|
|
|
import { arduinoLight } from "react-syntax-highlighter/dist/cjs/styles/hljs";
|
2019-03-12 18:46:44 +01:00
|
|
|
|
|
|
|
|
type Props = {
|
|
|
|
|
language: string,
|
|
|
|
|
value: string
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
class SyntaxHighlighter extends React.Component<Props> {
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
return (
|
|
|
|
|
<ReactSyntaxHighlighter
|
|
|
|
|
showLineNumbers="false"
|
|
|
|
|
language={this.props.language}
|
|
|
|
|
style={arduinoLight}
|
|
|
|
|
>
|
|
|
|
|
{this.props.value}
|
|
|
|
|
</ReactSyntaxHighlighter>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default SyntaxHighlighter;
|