Lexical text editor

Show
1

Saw on Twitter a new text editor library has emerged.

They have yjs bindings :eyes:

3 Likes
2

Thanks for sharing :slight_smile:

I like the mutable approach of this editor quite a lot. I feel this is a very good match for Yjs.

3

Got this working after some diving into undocumented code. Here’s an example plugin instantiation:

{/* import { CollaborationPlugin } from "@lexical/react/LexicalCollaborationPlugin"; */}
<CollaborationPlugin
  id="test1"
  providerFactory={(id, yjsDocMap) => {
    
    const doc = new Y.Doc();
    yjsDocMap.set(id, doc);

    // const provider = new WebrtcProvider(id, doc);
    const provider = new WebsocketProvider(
      "ws://localhost:1234",
      id,
      doc
    );

    return provider;
  }}
  shouldBootstrap={true}
/>
4 Likes
4

Got a PR up to add your example to the lexical docs Add collaboration example with yjs by kdawgwilk · Pull Request #1995 · facebook/lexical · GitHub

3 Likes
5

Awesome, thank you for the example @rchrd2 and @kdawgwilk for extending the docs :heart:

1 Like