Add ProseMirror example

[hackerwins]

Description:

Add ProseMirror example.

Currently, we are providing Quill example for the RichText datatype. And Yjs also provides Prosemirror binding examples.

Why:

• Make it easy for users of ProseMirror to use Yorkie.
• We can easily replace CodePair's Markdown editor with the TUI Editor. https://github.com/yorkie-team/yorkie-codepair/issues/152

[blurfx]

I'll try on it!

[hackerwins]

ProseMirror's document is designed based on the tree structure, and it is necessary to record the position of the cursor in the tree as a simple number, so Resolved Positions was introduced.

ResolvedPositions seems to be a value calculated by adding depth from the root.

https://github.com/ProseMirror/prosemirror-model/blob/eef20c8c6dbf841b1d70859df5d59c21b5108a4f/src/resolvedpos.js#L229-L244

When the following text is entered into the editor, the left and right sides of each text will have the following scalar number.

// 3 paragraphs of 6 chars
AB
CD
EF

Since ProseMirror's document is a tree structure and RichText is designed based on a list, a simple conversion might cause some kind of impedance mismatch.

[blurfx]

I think we should think about our document model. Do we need to change it? If so, how should we change it? Can we support both text and tree structures?

[hackerwins]

@blurfx I haven't thought about it yet. Perhaps it would be better to research the Y.js approach.

[mojosoeun]

Can I take a look this issue as well?

[hackerwins]

@mojosoeun Of course. If you check the progress of development yorkie.Tree, refer to the below link.

https://codepair.yorkie.dev/5jnm2b#%23%23%23%206th%20Release%20v0.4.6%3A%20TBD

[SINHJ1]

Hello. Do you have a prosemirror example code?

[krapie]

@SINHJ1 You can check ProseMirror code in below link built with recently introduced yorkie.Tree structure.

https://github.com/yorkie-team/yorkie-js-sdk/blob/main/public/prosemirror.html

Also, I would be nice if you rewrite your question into English.