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

blocksuite/affine/widgets/widget-drag-handle/src/drag-handle.ts

@@ -7,8 +7,8 @@ import {
 } from '@blocksuite/affine-shared/utils';
 import { type BlockComponent, WidgetComponent } from '@blocksuite/block-std';
 import type { GfxModel } from '@blocksuite/block-std/gfx';
+import { DisposableGroup } from '@blocksuite/global/disposable';
 import type { IVec, Point, Rect } from '@blocksuite/global/gfx';
-import { DisposableGroup } from '@blocksuite/global/slot';
 import { computed, type ReadonlySignal, signal } from '@preact/signals-core';
 import { html, nothing } from 'lit';
 import { query, state } from 'lit/decorators.js';
@@ -100,10 +100,12 @@ export class AffineDragHandleWidget extends WidgetComponent<RootBlockModel> {
 
     this._anchorModelDisposables = new DisposableGroup();
     this._anchorModelDisposables.add(
-      blockModel.propsUpdated.on(() => this.hide())
+      blockModel.propsUpdated.subscribe(() => this.hide())
     );
 
-    this._anchorModelDisposables.add(blockModel.deleted.on(() => this.hide()));
+    this._anchorModelDisposables.add(
+      blockModel.deleted.subscribe(() => this.hide())
+    );
   };
 
   hide = (force = false) => {

blocksuite/affine/widgets/widget-drag-handle/src/helpers/preview-helper.ts

@@ -144,7 +144,7 @@ export class PreviewHelper {
             return;
           }
 
-          this.std.view.viewUpdated.on(payload => {
+          this.std.view.viewUpdated.subscribe(payload => {
             if (payload.type !== 'block') return;
 
             if (payload.view.model.flavour === 'affine:page') {

blocksuite/affine/widgets/widget-drag-handle/src/middleware/blocks-filter.ts

@@ -40,7 +40,7 @@ export const gfxBlocksFilter = (
   }
 
   return ({ slots, transformerConfigs }) => {
-    slots.beforeExport.on(payload => {
+    slots.beforeExport.subscribe(payload => {
       if (payload.type !== 'block') {
         return;
       }
@@ -54,7 +54,7 @@ export const gfxBlocksFilter = (
       }
     });
 
-    slots.afterExport.on(payload => {
+    slots.afterExport.subscribe(payload => {
       if (payload.type !== 'block') {
         return;
       }

blocksuite/affine/widgets/widget-drag-handle/src/middleware/new-id-cross-doc.ts

@@ -9,7 +9,7 @@ export const newIdCrossDoc =
     let samePage = false;
     const oldToNewIdMap = new Map<string, string>();
 
-    slots.beforeImport.on(payload => {
+    slots.beforeImport.subscribe(payload => {
       if (payload.type === 'slice') {
         samePage = payload.snapshot.pageId === std.store.id;
       }
@@ -21,7 +21,7 @@ export const newIdCrossDoc =
       }
     });
 
-    slots.afterImport.on(payload => {
+    slots.afterImport.subscribe(payload => {
       if (
         !samePage &&
         payload.type === 'block' &&

blocksuite/affine/widgets/widget-drag-handle/src/middleware/reorder-list.ts

@@ -7,7 +7,7 @@ import type { TransformerMiddleware } from '@blocksuite/store';
 export const reorderList =
   (std: BlockStdScope): TransformerMiddleware =>
   ({ slots }) => {
-    slots.afterImport.on(payload => {
+    slots.afterImport.subscribe(payload => {
       if (payload.type === 'block') {
         const model = payload.model;
         if (matchModels(model, [ListBlockModel]) && model.type === 'numbered') {

blocksuite/affine/widgets/widget-drag-handle/src/watchers/drag-event-watcher.ts

@@ -1624,7 +1624,7 @@ export class DragEventWatcher {
     disposables.add(this._monitorBlockDrag());
 
     disposables.add(
-      std.view.viewUpdated.on(payload => {
+      std.view.viewUpdated.subscribe(payload => {
         if (payload.type !== 'block') {
           return;
         }

blocksuite/affine/widgets/widget-drag-handle/src/watchers/edgeless-watcher.ts

@@ -177,23 +177,23 @@ export class EdgelessWatcher {
     const edgelessSlots = std.get(EdgelessLegacySlotIdentifier);
 
     disposables.add(
-      viewport.viewportUpdated.on(this._handleEdgelessViewPortUpdated)
+      viewport.viewportUpdated.subscribe(this._handleEdgelessViewPortUpdated)
     );
 
     disposables.add(
-      selection.slots.updated.on(() => {
+      selection.slots.updated.subscribe(() => {
         this.updateAnchorElement();
       })
     );
 
     disposables.add(
-      edgelessSlots.readonlyUpdated.on(() => {
+      edgelessSlots.readonlyUpdated.subscribe(() => {
         this.updateAnchorElement();
       })
     );
 
     disposables.add(
-      edgelessSlots.elementResizeEnd.on(() => {
+      edgelessSlots.elementResizeEnd.subscribe(() => {
         this.updateAnchorElement();
       })
     );
@@ -207,14 +207,14 @@ export class EdgelessWatcher {
     );
 
     disposables.add(
-      edgelessSlots.elementResizeStart.on(() => {
+      edgelessSlots.elementResizeStart.subscribe(() => {
         this.widget.hide();
       })
     );
 
     if (surface) {
       disposables.add(
-        surface.elementUpdated.on(() => {
+        surface.elementUpdated.subscribe(() => {
           if (this.widget.isGfxDragHandleVisible) {
             this._showDragHandle().catch(console.error);
           }

blocksuite/affine/widgets/widget-drag-handle/src/watchers/page-watcher.ts

@@ -13,11 +13,11 @@ export class PageWatcher {
     const { disposables } = this.widget;
 
     disposables.add(
-      this.widget.doc.slots.blockUpdated.on(() => this.widget.hide())
+      this.widget.doc.slots.blockUpdated.subscribe(() => this.widget.hide())
     );
 
     disposables.add(
-      this.pageViewportService.on(() => {
+      this.pageViewportService.subscribe(() => {
         this.widget.hide();
       })
     );