diff options
| author | jackyzha0 <[email protected]> | 2021-03-05 16:53:52 -0800 |
|---|---|---|
| committer | jackyzha0 <[email protected]> | 2021-03-05 16:53:52 -0800 |
| commit | 0c2d38a59f890afed6466658e1ad0341656137c8 (patch) | |
| tree | 930fb412655daa5243e38f06b94757ce965a0892 /frontend/src/components/Editor.js | |
| parent | fix(typo): public api docs endpoint (diff) | |
| download | ctrl-v-0c2d38a59f890afed6466658e1ad0341656137c8.tar.xz ctrl-v-0c2d38a59f890afed6466658e1ad0341656137c8.zip | |
title refactor
Diffstat (limited to 'frontend/src/components/Editor.js')
| -rw-r--r-- | frontend/src/components/Editor.js | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/frontend/src/components/Editor.js b/frontend/src/components/Editor.js new file mode 100644 index 0000000..83d8464 --- /dev/null +++ b/frontend/src/components/Editor.js @@ -0,0 +1,29 @@ +import React from 'react'; +import Editor from 'react-simple-code-editor'; +import { highlight, languages } from 'prismjs/components/prism-core'; +import 'prismjs/components/prism-clike'; +import 'prismjs/components/prism-javascript'; + +const code = `function add(a, b) { + return a + b; +} +`; + +class App extends React.Component { + state = { code }; + + render() { + return ( + <Editor + value={this.state.code} + onValueChange={code => this.setState({ code })} + highlight={code => highlight(code, languages.js)} + padding={10} + style={{ + fontFamily: '"JetBrains Mono", monospace', + fontSize: 12, + }} + /> + ); + } +}
\ No newline at end of file |