1409

import React from "react"
import { EditorInterface } from "./EditorInterface"
import MonacoEditor from "./MonacoEditor"

type Props = EditorInterface

type State = {
  value: string
}

const monacoOptions = {
  minimap: { enabled: false }
}

export class ProgramEditor extends React.Component<Props, State> {
  constructor(props: any) {
    super(props)
    this.state = {
      value: props.initialValue
    }
  }

  render() {
    const { fontScale, onChange, theme } = this.props
    const { language, ...options } = this.props.options || {
      language: "javascript"
    }
    const { value } = this.state

    return (
      <MonacoEditor
        width="100%"
        height="100%"
        language={language || "javascript"}
        value={value}
        options={{
          ...monacoOptions,
          fontSize: fontScale * 12,
          theme: theme === "dark" ? "vs-dark" : null,
          tabSize: 2,
          insertSpaces: true,
          ...options
        }}
        onChange={(newValue: string, e: Event) => {
          this.setState({ value: newValue })
          onChange(this.state.value)
        }}
        editorDidMount={(editor: any, _monaco: any) => {
          editor.focus()
        }}
      />
    )
  }
}

1	import React from "react"	×
2	import { EditorInterface } from "./EditorInterface"
3	import MonacoEditor from "./MonacoEditor"	×
4
5	type Props = EditorInterface
6
7	type State = {
8	value: string
9	}
10
11	const monacoOptions = {	×
12	minimap: { enabled: false }
13	}
14
15	export class ProgramEditor extends React.Component<Props, State> {	×
16	constructor(props: any) {
17	super(props)	×
18	this.state = {	×
19	value: props.initialValue
20	}
21	}
22
23	render() {
24	const { fontScale, onChange, theme } = this.props	×
25	const { language, ...options } = this.props.options \|\| {	×
26	language: "javascript"
27	}
28	const { value } = this.state	×
29
30	return (	×
31	<MonacoEditor
32	width="100%"
33	height="100%"
34	language={language \|\| "javascript"}	×
35	value={value}
36	options={{
37	...monacoOptions,
38	fontSize: fontScale * 12,
39	theme: theme === "dark" ? "vs-dark" : null,	×
40	tabSize: 2,
41	insertSpaces: true,
42	...options
43	}}
44	onChange={(newValue: string, e: Event) => {
45	this.setState({ value: newValue })	×
46	onChange(this.state.value)	×
47	}}
48	editorDidMount={(editor: any, _monaco: any) => {
49	editor.focus()	×
50	}}
51	/>
52	)
53	}
54	}

mizchi / next-editor / 1409

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous