ember-json-editor-for

Ember component for @josdejong's JSON editor.

Usage no npm install needed!

<script type="module">
  import emberJsonEditorFor from 'https://cdn.skypack.dev/ember-json-editor-for';
</script>

README

ember-json-editor-for

Ember component for @josdejong's JSON editor.

Installation

$ ember install ember-json-editor-for

Usage

See the demo and code.

{{!-- default use --}}
{{json-editor-for json}}

{{!-- mode is updated via DDAU --}}
{{json-editor-for json mode=mode onModeChange=(action (mut mode))}}

{{!-- use ember-component-inbound-actions for fetching JSON --}}
{{json-editor-for json actionReceiver=jsonEditorFor}}

// inside controller/component
this.get('jsonEditorFor').send('getJSON', json => { /* ...  */ })

API

Background

Please read JSON editor's docs first.

Options

This addon abstracts away some JSON editor options for cleanliness. Supported options:

Option Notes
ace
ajv
onEditable configuration function
onError use an Ember action
onModeChange use an Ember action
escapeUnicode
history
mode
modes modified default is ['tree', 'view', 'form', 'code', 'text']
name
schema
search
indentation
theme

Inbound actions

This addon uses inbound actions to mirror JSON editor's methods and to avoid editor jumpiness. Supported inbound actions:

Usage Description
.send('collapseAll') collapses JSON editor when in tree, view, or form mode
.send('expandAll') expands JSON editor when in tree, view, or form mode
.send('focus') set focus on JSON editor
.send('getJSON', json => { /* ... */ }) fetch JSON

Badges

GitHub @nucleartide  ·  Twitter @nucleartide