Vue CRDT

📦 Install

npm i vue-crdt

🦄 Usage

import { reactive, ref } from 'vue'
import { defineStore, useHistory } from 'vue-crdt'

const useEditorStore = defineStore(doc => {
  // use y-webrtc
  //
  // new WebrtcProvider(
  //  'your-room-name',
  //  doc,
  //  { password: 'optional-room-password' },
  // )

  return {
    workspace: reactive({
      pages: { a: 'b' },
      activePage: null,
    }),
    width: ref(800),
    height: ref(600),
  }
})

const { workspace, width, height } = useEditorStore()

const history = useHistory(workspace)

workspace.activePage = 123
history.stopCapturing()
workspace.activePage = 456
history.undo()

console.log(workspace)