react-code-editor-editable v0.6.3

React code editor

Functionalities

• 191 languages highlighting with Highlight.js.
• 97 themes/styles.
• Scrollable.
• Tab support.
• Optional line numbers on editor.

Installation

npm i react-code-editor-editable or yarn add react-code-editor-editable

Usage

import React, { useState } from 'react'

import { CodeEditorEditable } from 'react-code-editor-editable'
import 'highlight.js/styles/dracula.css';

const App = () => {
  const [value, setValue] = useState('<div></div>')

  return (
    <div className='center'>
      <CodeEditorEditable
        value={value}
        setValue={setValue}
        width='50vw'
        height='50vh'
        language='html'
        inlineNumbers
      />
    </div>
  )
}

export default App

Props

Styles