feat: selection extension

packages/affine/block-surface/src/surface-spec.ts

@@ -1,3 +1,4 @@
+import { HighlightSelectionExtension } from '@blocksuite/affine-shared/selection';
 import {
   BlockViewExtension,
   CommandExtension,
@@ -13,6 +14,7 @@ const CommonSurfaceBlockSpec: ExtensionType[] = [
   FlavourExtension('affine:surface'),
   SurfaceBlockService,
   CommandExtension(commands),
+  HighlightSelectionExtension,
 ];
 
 export const PageSurfaceBlockSpec: ExtensionType[] = [

packages/affine/data-view/src/core/common/selection.ts

@@ -1,4 +1,4 @@
-import { BaseSelection } from '@blocksuite/block-std';
+import { BaseSelection, SelectionExtension } from '@blocksuite/block-std';
 import { z } from 'zod';
 
 import type { DataViewSelection, GetDataViewSelection } from '../types.js';
@@ -129,3 +129,5 @@ declare global {
     }
   }
 }
+
+export const DatabaseSelectionExtension = SelectionExtension(DatabaseSelection);

packages/affine/shared/src/selection/hightlight.ts

@@ -2,7 +2,7 @@ import {
   type ReferenceParams,
   ReferenceParamsSchema,
 } from '@blocksuite/affine-model';
-import { BaseSelection } from '@blocksuite/block-std';
+import { BaseSelection, SelectionExtension } from '@blocksuite/block-std';
 
 export class HighlightSelection extends BaseSelection {
   static override group = 'scene';
@@ -57,3 +57,6 @@ declare global {
     }
   }
 }
+
+export const HighlightSelectionExtension =
+  SelectionExtension(HighlightSelection);

packages/affine/shared/src/selection/image.ts

@@ -1,4 +1,4 @@
-import { BaseSelection } from '@blocksuite/block-std';
+import { BaseSelection, SelectionExtension } from '@blocksuite/block-std';
 import z from 'zod';
 
 const ImageSelectionSchema = z.object({
@@ -37,3 +37,5 @@ declare global {
     }
   }
 }
+
+export const ImageSelectionExtension = SelectionExtension(ImageSelection);

packages/affine/shared/src/selection/index.ts

@@ -1,2 +1,5 @@
-export { HighlightSelection } from './hightlight.js';
-export { ImageSelection } from './image.js';
+export {
+  HighlightSelection,
+  HighlightSelectionExtension,
+} from './hightlight.js';
+export { ImageSelection, ImageSelectionExtension } from './image.js';

packages/affine/widget-scroll-anchoring/src/scroll-anchoring.ts

@@ -1,6 +1,5 @@
 import type { DocMode } from '@blocksuite/affine-model';
 
-import { HighlightSelection } from '@blocksuite/affine-shared/selection';
 import { WidgetComponent } from '@blocksuite/block-std';
 import {
   GfxControllerIdentifier,
@@ -181,8 +180,6 @@ export class AffineScrollAnchoringWidget extends WidgetComponent {
   override connectedCallback() {
     super.connectedCallback();
 
-    this.std.selection.register(HighlightSelection);
-
     this.#resizeObserver.observe(this.offsetParent!);
     this.handleEvent('wheel', this.#requestUpdateFn);
     this.disposables.addFromEvent(window, 'resize', this.#requestUpdateFn);

packages/blocks/src/database-block/database-service.ts

@@ -5,7 +5,6 @@ import {
   DatabaseBlockSchema,
 } from '@blocksuite/affine-model';
 import { BlockService } from '@blocksuite/block-std';
-import { DatabaseSelection } from '@blocksuite/data-view';
 import { viewPresets } from '@blocksuite/data-view/view-presets';
 
 import {
@@ -58,9 +57,4 @@ export class DatabaseBlockService extends BlockService {
     }
     applyPropertyUpdate(blockModel);
   }
-
-  override mounted(): void {
-    super.mounted();
-    this.selectionManager.register(DatabaseSelection);
-  }
 }

packages/blocks/src/database-block/database-spec.ts

@@ -3,6 +3,7 @@ import {
   type ExtensionType,
   FlavourExtension,
 } from '@blocksuite/block-std';
+import { DatabaseSelectionExtension } from '@blocksuite/data-view';
 import { literal } from 'lit/static-html.js';
 
 import { DatabaseDragHandleOption } from './config.js';
@@ -13,4 +14,5 @@ export const DatabaseBlockSpec: ExtensionType[] = [
   DatabaseBlockService,
   BlockViewExtension('affine:database', literal`affine-database`),
   DatabaseDragHandleOption,
+  DatabaseSelectionExtension,
 ];

packages/blocks/src/image-block/image-service.ts

@@ -1,5 +1,4 @@
 import { ImageBlockSchema } from '@blocksuite/affine-model';
-import { ImageSelection } from '@blocksuite/affine-shared/selection';
 import {
   DragHandleConfigExtension,
   TelemetryProvider,
@@ -79,8 +78,6 @@ export class ImageBlockService extends BlockService {
   override mounted(): void {
     super.mounted();
 
-    this.selectionManager.register(ImageSelection);
-
     this.fileDropManager = new FileDropManager(this, this._fileDropOptions);
   }
 }

packages/blocks/src/image-block/image-spec.ts

@@ -1,3 +1,4 @@
+import { ImageSelectionExtension } from '@blocksuite/affine-shared/selection';
 import {
   BlockViewExtension,
   CommandExtension,
@@ -27,4 +28,5 @@ export const ImageBlockSpec: ExtensionType[] = [
     imageToolbar: literal`affine-image-toolbar-widget`,
   }),
   ImageDragHandleOption,
+  ImageSelectionExtension,
 ];

packages/framework/block-std/src/effects.ts

@@ -1,7 +1,31 @@
+import type {
+  BlockSelection,
+  CursorSelection,
+  SurfaceSelection,
+  TextSelection,
+} from './selection/index.js';
+
 import { GfxViewportElement } from './gfx/viewport-element.js';
 import { EditorHost } from './view/index.js';
 
 export function effects() {
   customElements.define('editor-host', EditorHost);
   customElements.define('gfx-viewport', GfxViewportElement);
 }
+
+declare global {
+  namespace BlockSuite {
+    interface Selection {
+      block: typeof BlockSelection;
+      cursor: typeof CursorSelection;
+      surface: typeof SurfaceSelection;
+      text: typeof TextSelection;
+    }
+
+    type SelectionType = keyof Selection;
+
+    type SelectionInstance = {
+      [P in SelectionType]: InstanceType<Selection[P]>;
+    };
+  }
+}

packages/framework/block-std/src/extension/index.ts

@@ -5,6 +5,7 @@ export * from './extension.js';
 export * from './flavour.js';
 export * from './keymap.js';
 export * from './lifecycle-watcher.js';
+export * from './selection.js';
 export * from './service.js';
 export * from './service-watcher.js';
 export * from './widget-view-map.js';

packages/framework/block-std/src/extension/selection.ts

@@ -0,0 +1,14 @@
+import type { SelectionConstructor } from '../selection/index.js';
+import type { ExtensionType } from './extension.js';
+
+import { SelectionIdentifier } from '../identifier.js';
+
+export function SelectionExtension(
+  selectionCtor: SelectionConstructor
+): ExtensionType {
+  return {
+    setup: di => {
+      di.addImpl(SelectionIdentifier(selectionCtor.type), () => selectionCtor);
+    },
+  };
+}

packages/framework/block-std/src/identifier.ts

@@ -4,6 +4,7 @@ import type { Command } from './command/index.js';
 import type { EventOptions, UIEventHandler } from './event/index.js';
 import type { BlockService, LifeCycleWatcher } from './extension/index.js';
 import type { BlockStdScope } from './scope/index.js';
+import type { SelectionConstructor } from './selection/index.js';
 import type { BlockViewType, WidgetViewMapType } from './spec/type.js';
 
 export const BlockServiceIdentifier =
@@ -32,3 +33,6 @@ export const KeymapIdentifier = createIdentifier<{
   getter: (std: BlockStdScope) => Record<string, UIEventHandler>;
   options?: EventOptions;
 }>('Keymap');
+
+export const SelectionIdentifier =
+  createIdentifier<SelectionConstructor>('Selection');

packages/framework/block-std/src/scope/block-std-scope.ts

@@ -18,7 +18,13 @@ import {
   StdIdentifier,
 } from '../identifier.js';
 import { RangeManager } from '../range/index.js';
-import { SelectionManager } from '../selection/index.js';
+import {
+  BlockSelectionExtension,
+  CursorSelectionExtension,
+  SelectionManager,
+  SurfaceSelectionExtension,
+  TextSelectionExtension,
+} from '../selection/index.js';
 import { ServiceManager } from '../service/index.js';
 import { EditorHost } from '../view/element/index.js';
 import { ViewStore } from '../view/view-store.js';
@@ -37,6 +43,10 @@ const internalExtensions = [
   ViewStore,
   Clipboard,
   GfxController,
+  BlockSelectionExtension,
+  TextSelectionExtension,
+  SurfaceSelectionExtension,
+  CursorSelectionExtension,
 ];
 
 export class BlockStdScope {

packages/framework/block-std/src/selection/manager.ts

@@ -7,14 +7,9 @@ import type { BlockStdScope } from '../scope/index.js';
 import type { BaseSelection } from './base.js';
 
 import { LifeCycleWatcher } from '../extension/index.js';
-import {
-  BlockSelection,
-  CursorSelection,
-  SurfaceSelection,
-  TextSelection,
-} from './variants/index.js';
-
-interface SelectionConstructor {
+import { SelectionIdentifier } from '../identifier.js';
+
+export interface SelectionConstructor {
   type: string;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   new (...args: any[]): BaseSelection;
@@ -133,12 +128,9 @@ export class SelectionManager extends LifeCycleWatcher {
   }
 
   private _setupDefaultSelections() {
-    this.register([
-      TextSelection,
-      BlockSelection,
-      SurfaceSelection,
-      CursorSelection,
-    ]);
+    this.std.provider.getAll(SelectionIdentifier).forEach(ctor => {
+      this.register(ctor);
+    });
   }
 
   clear(types?: string[]) {

packages/framework/block-std/src/selection/variants/block.ts

@@ -1,5 +1,6 @@
 import z from 'zod';
 
+import { SelectionExtension } from '../../extension/selection.js';
 import { BaseSelection } from '../base.js';
 
 const BlockSelectionSchema = z.object({
@@ -31,10 +32,4 @@ export class BlockSelection extends BaseSelection {
   }
 }
 
-declare global {
-  namespace BlockSuite {
-    interface Selection {
-      block: typeof BlockSelection;
-    }
-  }
-}
+export const BlockSelectionExtension = SelectionExtension(BlockSelection);

packages/framework/block-std/src/selection/variants/cursor.ts

@@ -1,5 +1,6 @@
 import z from 'zod';
 
+import { SelectionExtension } from '../../extension/selection.js';
 import { BaseSelection } from '../base.js';
 
 const CursorSelectionSchema = z.object({
@@ -43,10 +44,4 @@ export class CursorSelection extends BaseSelection {
   }
 }
 
-declare global {
-  namespace BlockSuite {
-    interface Selection {
-      cursor: typeof CursorSelection;
-    }
-  }
-}
+export const CursorSelectionExtension = SelectionExtension(CursorSelection);

packages/framework/block-std/src/selection/variants/index.ts

@@ -2,13 +2,3 @@ export * from './block.js';
 export * from './cursor.js';
 export * from './surface.js';
 export * from './text.js';
-
-declare global {
-  namespace BlockSuite {
-    type SelectionType = keyof Selection;
-
-    type SelectionInstance = {
-      [P in SelectionType]: InstanceType<Selection[P]>;
-    };
-  }
-}

packages/framework/block-std/src/selection/variants/surface.ts

@@ -1,5 +1,6 @@
 import z from 'zod';
 
+import { SelectionExtension } from '../../extension/selection.js';
 import { BaseSelection } from '../base.js';
 
 const SurfaceSelectionSchema = z.object({
@@ -68,10 +69,4 @@ export class SurfaceSelection extends BaseSelection {
   }
 }
 
-declare global {
-  namespace BlockSuite {
-    interface Selection {
-      surface: typeof SurfaceSelection;
-    }
-  }
-}
+export const SurfaceSelectionExtension = SelectionExtension(SurfaceSelection);

packages/framework/block-std/src/selection/variants/text.ts

@@ -1,5 +1,6 @@
 import z from 'zod';
 
+import { SelectionExtension } from '../../extension/selection.js';
 import { BaseSelection } from '../base.js';
 
 export type TextRangePoint = {
@@ -113,10 +114,4 @@ export class TextSelection extends BaseSelection {
   }
 }
 
-declare global {
-  namespace BlockSuite {
-    interface Selection {
-      text: typeof TextSelection;
-    }
-  }
-}
+export const TextSelectionExtension = SelectionExtension(TextSelection);