code-mirror-linter

import { LitElement, html } from 'lit-element';
import '@advanced-rest-client/code-mirror/code-mirror.js';
import '@advanced-rest-client/code-mirror-linter/code-mirror-linter-json';
import linterStyles from '@advanced-rest-client/code-mirror-linter/lint-style.js';

class SampleElement extends PolymerElement {
  static get styles() {
    return [
      linterStyles,
      css`:host { ... }`
    ];
  }

  render() {
    const gutters = ['CodeMirror-lint-markers'];
    return html`
    <code-mirror
      mode="application/json"
      linenumbers
      .gutters="${gutters}"
      .lint="${CodeMirror.lint.json}">
      {
        "a": 'b',
        "value": true
      }
      </code-mirror>
    `;
  }

  _valueHandler(e) {
    this.value = e.detail.value;
  }
}
customElements.define('sample-element', SampleElement);