@datlas/react-ace
TypeScript icon, indicating that this package has built-in type declarations

6.5.0 • Public • Published

React-Ace

logo

Backers on Open Collective Sponsors on Open Collective Greenkeeper badge

npm version Build Status CDNJS Coverage Status

Buy Me A Coffee

A set of react components for Ace / Brace

DEMO of React Ace

DEMO of React Ace Split Editor

DEMO of React Ace Diff Editor

Install

npm install react-ace

Basic Usage

import React from 'react';
import { render } from 'react-dom';
import brace from 'brace';
import AceEditor from 'react-ace';

import 'brace/mode/java';
import 'brace/theme/github';

function onChange(newValue) {
  console.log('change',newValue);
}

// Render editor
render(
  <AceEditor
    mode="java"
    theme="github"
    onChange={onChange}
    name="UNIQUE_ID_OF_DIV"
    editorProps={{$blockScrolling: true}}
  />,
  document.getElementById('example')
);

Examples

Checkout the example directory for a working example using webpack.

Documentation

Ace Editor

Split View Editor

Diff Editor

How to add modes, themes and keyboard handlers

Frequently Asked Questions

Backers

Support us with a monthly donation and help us continue our activities. [Become a backer]

Sponsors

Become a sponsor and get your logo on our README on Github with a link to your site. [Become a sponsor]

Versions

Current Tags

  • Version
    Downloads (Last 7 Days)
    • Tag
  • 6.5.0
    3
    • latest

Version History

  • Version
    Downloads (Last 7 Days)
    • Published
  • 6.5.0
    3

Package Sidebar

Install

npm i @datlas/react-ace

Weekly Downloads

3

Version

6.5.0

License

MIT

Unpacked Size

1.71 MB

Total Files

37

Last publish

Collaborators

  • maicedata