Getting started with atjson

[mixmix]

I'm keen to learn how to use this - had spoken with @blaine about it at a recent p2p gathering. I've visited this repo a couple of times but got swamped reading the source.

Here's my current best attempt from reading and copying examples from in the code. It's not yet working / I don't know what it looks like when it is working:

import Document from '@atjson/document'

// Web components in the registry can't be redefined,
// so reload the page on every change
if (module.hot) {
  module.hot.dispose(() => {
    window.location.reload()
  })
}

document.addEventListener('DOMContentLoaded', () => {
  let editor = document.querySelector('offset-editor')

  let doc = new Document({
    content: 'Some text that is both bold and italic plus something after.',
    annotations: [
      { type: 'bold', display: 'inline', start: 23, end: 31 },
      { type: 'link', display: 'inline', start: 20, end: 24, attributes: { url: 'https://google.com' } },
      { type: 'italic', display: 'inline', start: 28, end: 38 },
      { type: 'underline', display: 'inline', start: 28, end: 38 },
      { type: 'paragraph', display: 'block', start: 0, end: 61 }
    ]
  })

  editor.setDocument(doc)

  console.log('done!')
})

I get an error:

TypeError: options.annotations is undefined

---

Are these modules still in use? Are they being deprecated?
I would love a demo repo showing me how to wire things together. My ideal use case is being able to have a rich accessible editor, a way to output the content/annotations, then a way to render content/annotations once it's "published" (to scuttlebutt).

I care about this because we need to move beyond markdown to be more accessible for a wider range of peers ... and the promise of tidy extensibility is really exciting.