Skip to content

geoffreylitt/automerge-slate-playground

Repository files navigation

Automerge Slate Playground

Try it out

A toy demo integration of Automerge with Slate

This builds on the new Automerge Cursors functionality to support adding annotations to text. Currently includes two demos:

  • A markdown doc, with inline comments
  • A minimal rich text doc with bold/italic formatting

A next demo to add might be broader rich text support for things like lists, blockquotes, images, etc.

Run locally

yarn

Manually build automerge dependency loaded from github (can probably remove this step by switching to official build):

yarn run build-automerge

yarn start

Open localhost:8181 to see the app

Run tests

yarn global add mocha ts-mocha

yarn run test

How it works

  • Automerge doc is the source of truth. The entire text content is stored as a single Automerge.Text string. Comments and rich text formatting are stored as an array of annotations, per the OAFS idea; also similar to atjson.
  • Doesn't meaningfully use Slate's tree representation. Just treats the doc as a single text node.
  • Intercepts insert/delete operations from the Slate editor, and converts to corresponding Automerge Text ops to edit

Todos

  • Add a second client window with option to enable/disable sync, for testing concurrent editing
  • Figure out TS types for Cursors