diff options
author | Fabio Berger <me@fabioberger.com> | 2018-03-13 22:29:12 +0800 |
---|---|---|
committer | Fabio Berger <me@fabioberger.com> | 2018-03-13 22:29:12 +0800 |
commit | ca25b816fabe15ce1ebc539c0316beba813683b8 (patch) | |
tree | 0e28bbc819cfccda1789192628c365ea54328103 /packages/react-shared/src/components/markdown_code_block.tsx | |
parent | df1968157c13a7bbe2e512cbc924190a414e6738 (diff) | |
download | dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.tar dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.tar.gz dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.tar.bz2 dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.tar.lz dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.tar.xz dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.tar.zst dexon-0x-contracts-ca25b816fabe15ce1ebc539c0316beba813683b8.zip |
move scripts to monorepro-scripts
Diffstat (limited to 'packages/react-shared/src/components/markdown_code_block.tsx')
-rw-r--r-- | packages/react-shared/src/components/markdown_code_block.tsx | 25 |
1 files changed, 25 insertions, 0 deletions
diff --git a/packages/react-shared/src/components/markdown_code_block.tsx b/packages/react-shared/src/components/markdown_code_block.tsx new file mode 100644 index 000000000..2070bb8e1 --- /dev/null +++ b/packages/react-shared/src/components/markdown_code_block.tsx @@ -0,0 +1,25 @@ +import * as _ from 'lodash'; +import * as React from 'react'; +import * as HighLight from 'react-highlight'; + +export interface MarkdownCodeBlockProps { + value: string; + language: string; +} + +export interface MarkdownCodeBlockState {} + +export class MarkdownCodeBlock extends React.Component<MarkdownCodeBlockProps, MarkdownCodeBlockState> { + // Re-rendering a codeblock causes any use selection to become de-selected. This is annoying when trying + // to copy-paste code examples. We therefore noop re-renders on this component if it's props haven't changed. + public shouldComponentUpdate(nextProps: MarkdownCodeBlockProps, nextState: MarkdownCodeBlockState) { + return nextProps.value !== this.props.value || nextProps.language !== this.props.language; + } + public render() { + return ( + <span style={{ fontSize: 14 }}> + <HighLight className={this.props.language || 'javascript'}>{this.props.value}</HighLight> + </span> + ); + } +} |