From 245db4e9927576806716b92709d1ae5f661e7001 Mon Sep 17 00:00:00 2001
From: L-Sun <zover.v@gmail.com>
Date: Tue, 6 May 2025 07:05:54 +0000
Subject: [PATCH] fix(editor): make selected and out-of-viewport block active
 (#12135)

This PR make out-of-viewport but selected edgeless block keep active, since the selected block may still have some user interactions on the DOM. For example, when hover on a selected note and scroll viewport by wheel to view its hidden content, the note should not be hidden (a.k.a idel).

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **Refactor**
  - Updated viewport logic to keep selected items visible instead of only those being edited. Visibility now depends on selection status rather than editing state.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 blocksuite/framework/std/src/gfx/viewport-element.ts | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/blocksuite/framework/std/src/gfx/viewport-element.ts b/blocksuite/framework/std/src/gfx/viewport-element.ts
index b10a660650..097582f026 100644
--- a/blocksuite/framework/std/src/gfx/viewport-element.ts
+++ b/blocksuite/framework/std/src/gfx/viewport-element.ts
@@ -66,13 +66,13 @@ export class GfxViewportElement extends WithDisposable(ShadowlessElement) {
     }
   `;
 
-  private readonly _hideOutsideNoEditingBlock = () => {
+  private readonly _hideOutsideAndNoSelectedBlock = () => {
     if (!this.host) return;
 
     const gfx = this.host.std.get(GfxControllerIdentifier);
     const nextVisibleModels = new Set([
       ...this.getModelsInViewport(),
-      ...this._getEditingModels(),
+      ...this._getSelectedModels(),
     ]);
 
     batch(() => {
@@ -106,7 +106,7 @@ export class GfxViewportElement extends WithDisposable(ShadowlessElement) {
   }[] = [];
 
   private readonly _refreshViewport = requestThrottledConnectedFrame(() => {
-    this._hideOutsideNoEditingBlock();
+    this._hideOutsideAndNoSelectedBlock();
   }, this);
 
   private _updatingChildrenFlag = false;
@@ -122,7 +122,7 @@ export class GfxViewportElement extends WithDisposable(ShadowlessElement) {
       delete this.scheduleUpdateChildren;
     }
 
-    this._hideOutsideNoEditingBlock();
+    this._hideOutsideAndNoSelectedBlock();
     this.disposables.add(
       this.viewport.viewportUpdated.subscribe(() => viewportUpdateCallback())
     );
@@ -169,12 +169,11 @@ export class GfxViewportElement extends WithDisposable(ShadowlessElement) {
     return promise;
   };
 
-  private _getEditingModels(): Set<GfxBlockElementModel> {
+  private _getSelectedModels(): Set<GfxBlockElementModel> {
     if (!this.host) return new Set();
     const gfx = this.host.std.get(GfxControllerIdentifier);
     return new Set(
       gfx.selection.surfaceSelections
-        .filter(s => s.editing)
         .flatMap(({ elements }) => elements)
         .map(id => gfx.getElementById(id))
         .filter(e => e instanceof GfxBlockElementModel)