fix: allow to drop inside the note block in edgeless mode (#10255)

blocksuite/affine/block-note/src/components/edgeless-note-mask.ts

@@ -55,7 +55,7 @@ export class EdgelessNoteMask extends SignalWatcher(
           bottom: `${-extra}px`,
           right: `${-extra}px`,
           zIndex: '1',
-          pointerEvents: this.editing ? 'none' : 'auto',
+          pointerEvents: this.editing || this.disableMask ? 'none' : 'auto',
           borderRadius: `${
             this.model.edgeless.style.borderRadius * this.zoom
           }px`,
@@ -64,6 +64,9 @@ export class EdgelessNoteMask extends SignalWatcher(
     `;
   }
 
+  @property({ attribute: false })
+  accessor disableMask!: boolean;
+
   @property({ attribute: false })
   accessor editing!: boolean;
 

blocksuite/affine/block-note/src/note-edgeless-block.ts

@@ -260,6 +260,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
           .model=${this.model}
           .host=${this.host}
           .zoom=${this.gfx.viewport.zoom ?? 1}
+          .disableMask=${this.hideMask}
           .editing=${this._editing}
         ></edgeless-note-mask>
 
@@ -297,6 +298,9 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
   @state()
   private accessor _noteFullHeight = 0;
 
+  @state()
+  accessor hideMask = false;
+
   @query(`.${styles.clipContainer} > div`)
   private accessor _noteContent: HTMLElement | null = null;
 

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

@@ -1328,6 +1328,7 @@ export class DragEventWatcher {
 
   private _makeDropTarget(view: BlockComponent) {
     const isUnderNote = this._isUnderNoteBlock(view.model);
+    const isNote = matchModels(view.model, [NoteBlockModel]);
 
     if (
       // affine:surface block can't be drop target in any modes
@@ -1372,6 +1373,16 @@ export class DragEventWatcher {
 
           return false;
         },
+        onDragEnter: () => {
+          if (isNote && 'hideMask' in view) {
+            view.hideMask = true;
+          }
+        },
+        onDragLeave: () => {
+          if (isNote && 'hideMask' in view) {
+            view.hideMask = false;
+          }
+        },
         setDropData: () => {
           return {
             modelId: view.model.id,