refactor: use rxjs to replace eventCenter

packages/core/package.json

@@ -66,6 +66,7 @@
         "plantuml-encoder": "^1.4.0",
         "popper.js": "^1.16.1",
         "prismjs": "^1.29.0",
+        "rxjs": "^7.8.1",
         "snabbdom": "^3.6.2",
         "snabbdom-to-html": "^7.1.0",
         "turndown": "^7.1.3",

packages/core/src/block/commonMark/codeBlock/code.ts

@@ -1,3 +1,4 @@
+import { fromEvent } from 'rxjs';
 import copyIcon from '../../../assets/icons/copy/2.png';
 import Parent from '../../base/parent';
 import { ScrollPage } from '../../scrollPage';
@@ -79,7 +80,11 @@ class Code extends Parent {
     }
 
     listen() {
-        const { eventCenter, editor } = this.muya;
+        const { editor } = this.muya;
+
+        if (this.domNode == null)
+            return;
+
         // Copy code content to clipboard.
         const clickHandler = (event: Event) => {
             event.preventDefault();
@@ -99,16 +104,11 @@ class Code extends Parent {
             event.preventDefault();
         };
 
-        eventCenter.attachDOMEvent(
-            this.domNode?.firstElementChild as HTMLElement,
-            'click',
-            clickHandler,
-        );
-        eventCenter.attachDOMEvent(
-            this.domNode?.firstElementChild as HTMLElement,
-            'mousedown',
-            mousedownHandler,
-        );
+        const clickObservable = fromEvent(this.domNode.firstElementChild!, 'click');
+        clickObservable.subscribe(clickHandler);
+
+        const mousedownObservable = fromEvent(this.domNode.firstElementChild!, 'mousedown');
+        mousedownObservable.subscribe(mousedownHandler);
     }
 }
 

packages/core/src/block/extra/diagram/diagramPreview.ts

@@ -1,3 +1,4 @@
+import { fromEvent } from 'rxjs';
 import Parent from '../../base/parent';
 import { PREVIEW_DOMPURIFY_CONFIG } from '../../../config';
 import type { Muya } from '../../../muya';
@@ -94,13 +95,8 @@ class DiagramPreview extends Parent {
     }
 
     attachDOMEvents() {
-        const { eventCenter } = this.muya;
-
-        eventCenter.attachDOMEvent(
-            this.domNode!,
-            'click',
-            this.clickHandler.bind(this),
-        );
+        const clickObservable = fromEvent(this.domNode!, 'click');
+        clickObservable.subscribe(this.clickHandler.bind(this));
     }
 
     clickHandler(event: Event) {

packages/core/src/block/extra/math/mathPreview.ts

@@ -1,4 +1,5 @@
 import katex from 'katex';
+import { fromEvent } from 'rxjs';
 import Parent from '../../base/parent';
 import type { Muya } from '../../../muya';
 import logger from '../../../utils/logger';
@@ -43,13 +44,8 @@ class MathPreview extends Parent {
     }
 
     attachDOMEvents() {
-        const { eventCenter } = this.muya;
-
-        eventCenter.attachDOMEvent(
-            this.domNode!,
-            'click',
-            this.clickHandler.bind(this),
-        );
+        const clickObservable = fromEvent(this.domNode!, 'click');
+        clickObservable.subscribe(this.clickHandler.bind(this));
     }
 
     clickHandler(event: Event) {

packages/core/src/block/gfm/table/index.ts

@@ -1,4 +1,5 @@
 import diff from 'fast-diff';
+import { fromEvent } from 'rxjs';
 import { LinkedList } from '../../base/linkedList/linkedList';
 import Parent from '../../base/parent';
 import type TableCellContent from '../../content/tableCell';
@@ -91,19 +92,20 @@ class Table extends Parent {
     }
 
     private _listenDomEvent() {
-        const { eventCenter } = this.muya;
         const { domNode } = this;
 
         // Fix: prevent cursor present at the end of table.
-        const clickHandler = (event: Event) => {
+        const mousedownHandler = (event: Event) => {
             if (event.target === domNode) {
                 event.preventDefault();
                 const cursorBlock = this.lastContentInDescendant()!;
                 const offset = cursorBlock.text.length;
                 cursorBlock.setCursor(offset, offset, true);
             }
         };
-        eventCenter.attachDOMEvent(domNode!, 'mousedown', clickHandler);
+
+        const mousedownObservable = fromEvent(domNode!, 'mousedown');
+        mousedownObservable.subscribe(mousedownHandler);
     }
 
     queryBlock(path: TBlockPath) {

packages/facade/README.md

@@ -0,0 +1 @@
+# Use to export facade APIs.