Json Reactor

Edit any JSON object - schema-bound or free-form!!!

A JSON Object Editor Pure Javascript. You know, that uncut sht.*

Powered by ReactJS

Preview

Size (gzipped+minified): ~100-150kB (plus ReactJS v15+ ~40kB)

Full Lib w/ Schema and UI bits

Summary

Edit JSON using a friendly Web GUI!

Commands

npm install
npm run build
npm start

Example

See spec/index.html

Demo/example:

const config = {
  selectable: true,
  sortable: true,
  defaultSort: 'name',
  columns: [
    {selection: true, multiple: true, toggleAll: true, classes: ['text-center', 'tbl-xs-2']},
    {title: 'Name',   render: 'name', cols: 4},
    {title: 'Number', render: 'number'},
    {title: 'Region', render: 'region'},
    {title: 'Type', sort: 'type', render: ({row}) => row.type && row.type.toLowerCase() || 'N/A'},
  ],
  data: Promise.resolve(data)
};
 
function init() {
  editor = JsonReactor.create(document.querySelector('.results-view'), config)
}