temp.js

  import {parse, stringify} from 'https://unpkg.com/cssomtools'

  function render(event) {
    localStorage[pluginName] = input.getSession().getValue()

    output.getSession().setValue(
      stringify(parse(localStorage[pluginName]))
    )
    //return beautify.beautify(output.session)
  }

  // Demo setup below
  const pluginName = 'cssomtoolsDemo'
  const input = ace.edit('input')
  const output = ace.edit('output')
  const beautify = ace.require('ace/ext/beautify')

  input.setOptions({
    theme: 'ace/theme/cobalt',
    mode: 'ace/mode/css',
    fontSize: 18,
    tabSize: 2,
    wrap: true,
    highlightActiveLine: true,
    highlightSelectedWord: true,
    displayIndentGuides: true,
    showPrintMargin: false,
    showInvisibles: true,
    useSoftTabs: true,
    useWorker: false,
  })
  input.container.style.lineHeight = 1.4
  input.renderer.setScrollMargin(10, 10)

  if (localStorage[pluginName] !== undefined) {
    input.getSession().setValue(localStorage[pluginName])
  }

  ['keyup', 'blur', 'paste'].forEach(evt =>
    input.textInput.getElement().addEventListener(evt, render)
  )

  output.setOptions({
    theme: 'ace/theme/cobalt',
    mode: 'ace/mode/css',
    fontSize: 18,
    tabSize: 2,
    wrap: true,
    highlightActiveLine: true,
    highlightSelectedWord: true,
    displayIndentGuides: true,
    showPrintMargin: false,
    showInvisibles: true,
    useSoftTabs: true,
    useWorker: false,
  })
  output.container.style.lineHeight = 1.4
  output.renderer.setScrollMargin(10, 10)

  window.addEventListener('load', render)