feat(editor): replace slot with rxjs subject (#10768)

blocksuite/affine/gfx/text/package.json

@@ -31,6 +31,7 @@
     "lit": "^3.2.0",
     "lodash-es": "^4.17.21",
     "minimatch": "^10.0.1",
+    "rxjs": "^7.8.1",
     "yjs": "^13.6.21",
     "zod": "^3.23.8"
   },

blocksuite/affine/gfx/text/src/edgeless-text-editor.ts

@@ -178,19 +178,19 @@ export class EdgelessTextEditor extends WithDisposable(ShadowlessElement) {
     this.updateComplete
       .then(() => {
         if (!this.inlineEditor) return;
-        this.inlineEditor.slots.renderComplete.on(() => {
+        this.inlineEditor.slots.renderComplete.subscribe(() => {
           this._updateRect();
           this.requestUpdate();
         });
 
         this.disposables.add(
-          surface.elementUpdated.on(({ id }) => {
+          surface.elementUpdated.subscribe(({ id }) => {
             if (id === element.id) this.requestUpdate();
           })
         );
 
         this.disposables.add(
-          this.gfx.viewport.viewportUpdated.on(() => {
+          this.gfx.viewport.viewportUpdated.subscribe(() => {
             this.requestUpdate();
           })
         );

blocksuite/affine/gfx/turbo-renderer/package.json

@@ -17,6 +17,7 @@
     "@blocksuite/global": "workspace:*",
     "@types/lodash-es": "^4.17.12",
     "lodash-es": "^4.17.21",
+    "rxjs": "^7.8.1",
     "tweakpane": "^4.0.5"
   },
   "exports": {

blocksuite/affine/gfx/turbo-renderer/src/turbo-renderer.ts

@@ -8,7 +8,7 @@ import {
   type GfxViewportElement,
 } from '@blocksuite/block-std/gfx';
 import type { Container, ServiceIdentifier } from '@blocksuite/global/di';
-import { DisposableGroup } from '@blocksuite/global/slot';
+import { DisposableGroup } from '@blocksuite/global/disposable';
 import debounce from 'lodash-es/debounce';
 
 import {
@@ -46,16 +46,17 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
       initTweakpane(this, mountPoint as HTMLElement);
     }
 
-    this.viewport.elementReady.once(element => {
+    const subscription = this.viewport.elementReady.subscribe(element => {
+      subscription.unsubscribe();
       this.viewportElement = element;
       syncCanvasSize(this.canvas, this.std.host);
       this.setState('pending');
 
       this.disposables.add(
-        this.viewport.sizeUpdated.on(() => this.handleResize())
+        this.viewport.sizeUpdated.subscribe(() => this.handleResize())
       );
       this.disposables.add(
-        this.viewport.viewportUpdated.on(() => {
+        this.viewport.viewportUpdated.subscribe(() => {
           this.refresh().catch(console.error);
         })
       );
@@ -74,10 +75,10 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
     });
 
     this.disposables.add(
-      this.selection.slots.updated.on(() => this.invalidate())
+      this.selection.slots.updated.subscribe(() => this.invalidate())
     );
     this.disposables.add(
-      this.std.store.slots.blockUpdated.on(() => this.invalidate())
+      this.std.store.slots.blockUpdated.subscribe(() => this.invalidate())
     );
   }