refactor: support multiple-editors

[AyushAgrawal-A2]

continuation of #5765

closes #5625
closes #5153

Changes:

1. Completed pending cleanup global querySelectors and events

2. UIEventDispatcher:
   I tried moving events from document to editorHost, but there were few events which will originate from the document only. In multiple editor scenario each editor needs to be aware whether it is active or not, and respond to events only is it active.

   I have added a static field on UIEventDispatcher, which stores which dispatcher and thus which editor is active. It will run event handlers only if it is active.

   • The editor gets activated when the selection changes to an element inside the editor or the user clicks inside the editor.
   • The editor gets deactivated If there is a selection change to an element outside the editor.
   • There are a few overlays appended to document.body. I have added class "blocksuite-overlay" to these elements. If the user interacts with any such element the state will not change, i.e. the previous active editor which created the overlay will remain active.

3. For ease of testing of all three scenarios, added examples of independent multiple editors - doc-doc, doc-edgeless & edgeless-edgeless at

   • /examples/multiple-editors/doc-doc/
   • /examples/multiple-editors/doc-edgeless/
   • /examples/multiple-editors/edgeless-edgeless/

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
blocksuite	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 29, 2023 6:55pm

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
blocksuite-docs	⬜️ Ignored (Inspect)	Visit Preview		Dec 29, 2023 6:55pm

[AyushAgrawal-A2]

The starter/init=multiple-editor works great! but here's my recording running the doc-doc one:

Screen.Recording.2023-12-30.at.02.13.12.mov

@doodlewind is the same issue occurring for doc-edgeless , edgeless-edgeless as well ?

[doodlewind]

@AyushAgrawal-A2 I double checked and all examples work now, that's awesome!

Generally LGTM but for some updates in block-std, I'd require @Saul-Mirone for better review.

These entries are also great, I also plan to use similar entry in the newly added https://blocksuite.io/doc-editor.html and https://blocksuite.io/edgeless-editor.html doc pages.

[doodlewind]

Should land this, happy new year!