Attempt at Remirror + Yjs

CollaborativeEditor.js

import React from 'react'
import useErrorBoundary from 'use-error-boundary'
import styled from 'styled-components'

import { Remirror, useRemirror, useRemirrorContext } from '@remirror/react'
import { YjsExtension } from '@remirror/extension-yjs'
import { IndexeddbPersistence } from 'y-indexeddb'
import { WebrtcProvider } from 'y-webrtc'
import { WebsocketProvider } from 'y-websocket'
import { Doc } from 'yjs'


const Container = styled.div`
  width: 500px;
  height: 500px;
`

const Editor = () => {
  const { getRootProps } = useRemirrorContext()

  return (
    <Container {...getRootProps()} />
  )
}

const webrtcProvider = (roomName, ydoc) => new WebrtcProvider(roomName, ydoc)
const websocketProvider = (roomName, ydoc) => new WebsocketProvider('wss://demos.yjs.dev', roomName, ydoc)
const indexeddbProvider = (roomName, ydoc) => new IndexeddbPersistence(roomName, ydoc)

const CollaborativeEditor = ({ roomName, editable }) => {
  const { ErrorBoundary, didCatch, error } = useErrorBoundary()

  const ydoc = new Doc()
  const EXTENSIONS = () => [
    new YjsExtension({ getProvider: () => websocketProvider(roomName, ydoc) }),
    new YjsExtension({ getProvider: () => webrtcProvider(roomName, ydoc) }),
    new YjsExtension({ getProvider: () => indexeddbProvider(roomName, ydoc) })
  ]

  const extensionManager = useRemirror(EXTENSIONS)

  return (
    <>
      {
      didCatch
        ? (
          <p>An error has been caught: {error.message}</p>
          )
        : (
          <ErrorBoundary>
            <Remirror editable={editable} manager={extensionManager}>
              <Editor />
            </Remirror>
          </ErrorBoundary>
          )
      }
    </>
  )
}

export default CollaborativeEditor

Relevant dependencies and their versions:

    "@remirror/extension-yjs": "^0.0.0-pr706.5",
    "@remirror/pm": "^0.0.0-pr706.5",
    "@remirror/react": "^0.0.0-pr706.5",
    "react": "^17.0.1",
    "remirror": "^0.0.0-pr706.5",
    "typescript": "^4.1.5",
    "y-indexeddb": "^9.0.6",
    "y-prosemirror": "^1.0.6",
    "y-protocols": "^1.0.4",
    "y-webrtc": "^10.1.8",
    "y-websocket": "^1.3.11",
    "yjs": "^13.5.0"

Error info:

TypeError: manager.createEmptyDoc is not a function
useReactFramework
node_modules/@remirror/react-core/dist/remirror-react-core.browser.esm.js:969

  966 |     placeholder
  967 |   });
  968 | }, [placeholder, manager]);
> 969 | var fallback = manager.createEmptyDoc();
      | ^  970 | 
  971 | var _ref = isArray(props.initialContent) ? props.initialContent : [(_props$initialContent = props.initialContent) !== null && _props$initialContent !== void 0 ? _props$initialContent : fallback],
  972 |     _ref2 = _slicedToArray(_ref, 2),

Full version: