feat: extension API and service extension (#8094)

packages/affine/block-list/src/list-service.ts

@@ -1,4 +1,3 @@
-import type { ListBlockModel } from '@blocksuite/affine-model';
 import type { BlockComponent } from '@blocksuite/block-std';
 
 import {
@@ -17,7 +16,9 @@ import { correctNumberedListsOrderToPrev } from './commands/utils.js';
 import { listPrefix, toggleStyles } from './styles.js';
 import { getListIcon } from './utils/get-list-icon.js';
 
-export class ListBlockService extends BlockService<ListBlockModel> {
+export class ListBlockService extends BlockService {
+  static override readonly flavour = ListBlockSchema.model.flavour;
+
   readonly inlineManager = new InlineManager<AffineTextAttributes>();
 
   readonly referenceNodeConfig = new ReferenceNodeConfig();

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

@@ -1,6 +1,5 @@
-import type { BlockSpec } from '@blocksuite/block-std';
-
 import { ListBlockSchema } from '@blocksuite/affine-model';
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import { commands } from './commands/index.js';
@@ -12,5 +11,5 @@ export const ListBlockSpec: BlockSpec = {
     component: literal`affine-list`,
   },
   commands,
-  service: ListBlockService,
+  extensions: [FlavourExtension('affine:list'), ListBlockService],
 };

packages/affine/block-paragraph/src/paragraph-service.ts

@@ -1,5 +1,3 @@
-import type { ParagraphBlockModel } from '@blocksuite/affine-model';
-
 import {
   type AffineTextAttributes,
   InlineManager,
@@ -8,9 +6,15 @@ import {
   getAffineInlineSpecsWithReference,
   textKeymap,
 } from '@blocksuite/affine-components/rich-text';
+import {
+  type ParagraphBlockModel,
+  ParagraphBlockSchema,
+} from '@blocksuite/affine-model';
 import { BlockService } from '@blocksuite/block-std';
 
-export class ParagraphBlockService extends BlockService<ParagraphBlockModel> {
+export class ParagraphBlockService extends BlockService {
+  static override readonly flavour = ParagraphBlockSchema.model.flavour;
+
   readonly inlineManager = new InlineManager<AffineTextAttributes>();
 
   placeholderGenerator: (model: ParagraphBlockModel) => string = model => {

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

@@ -1,6 +1,5 @@
-import type { BlockSpec } from '@blocksuite/block-std';
-
 import { ParagraphBlockSchema } from '@blocksuite/affine-model';
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import { commands } from './commands/index.js';
@@ -12,5 +11,5 @@ export const ParagraphBlockSpec: BlockSpec = {
     component: literal`affine-paragraph`,
   },
   commands,
-  service: ParagraphBlockService,
+  extensions: [FlavourExtension('affine:paragraph'), ParagraphBlockService],
 };

packages/affine/components/src/peek/controller.ts

@@ -1,5 +1,4 @@
 import type { BlockService } from '@blocksuite/block-std';
-import type { BlockModel } from '@blocksuite/store';
 import type { TemplateResult } from 'lit';
 
 import type { PeekViewService, PeekableClass } from './type.js';
@@ -8,7 +7,7 @@ export class PeekableController<T extends PeekableClass> {
   private _getPeekViewService = (): PeekViewService | null => {
     if ('peekViewService' in this.getRootService()) {
       return this.getRootService<
-        BlockService<BlockModel> & { peekViewService: PeekViewService }
+        BlockService & { peekViewService: PeekViewService }
       >().peekViewService;
     }
     return null;

packages/affine/components/src/rich-text/inline/presets/nodes/link-node/link-popup/link-popup.ts

@@ -1,4 +1,3 @@
-import type { RootBlockModel } from '@blocksuite/affine-model';
 import type { EmbedOptions } from '@blocksuite/affine-shared/types';
 import type { BlockService } from '@blocksuite/block-std';
 import type { BlockComponent } from '@blocksuite/block-std';
@@ -411,7 +410,7 @@ export class LinkPopup extends WithDisposable(LitElement) {
   private get _rootService() {
     return this.std?.spec.getService('affine:page') as
       | null
-      | (BlockService<RootBlockModel> & {
+      | (BlockService & {
           getEmbedBlockOptions(link: string): EmbedOptions;
         });
   }

packages/affine/shared/src/services/doc-mode-service.ts

@@ -1,6 +1,7 @@
-import type { BlockStdScope } from '@blocksuite/block-std';
+import type { Container } from '@blocksuite/global/di';
 
 import { DocMode } from '@blocksuite/affine-model';
+import { BlockStdScope, Extension } from '@blocksuite/block-std';
 import { createIdentifier } from '@blocksuite/global/di';
 import { type Disposable, Slot } from '@blocksuite/global/utils';
 
@@ -23,8 +24,14 @@ export const DocModeProvider = createIdentifier<DocModeProvider>(
 const modeMap = new Map<string, DocMode>();
 const slotMap = new Map<string, Slot<DocMode>>();
 
-export class DocModeService implements DocModeProvider {
-  constructor(public std: BlockStdScope) {}
+export class DocModeService extends Extension implements DocModeProvider {
+  constructor(public std: BlockStdScope) {
+    super();
+  }
+
+  static override setup(di: Container) {
+    di.addImpl(DocModeProvider, DocModeService, [BlockStdScope]);
+  }
 
   getMode(id: string = this.std.doc.id) {
     return modeMap.get(id) ?? DEFAULT_MODE;

packages/blocks/src/_specs/preset/preview-specs.ts

@@ -1,9 +1,6 @@
 import { RootBlockSchema } from '@blocksuite/affine-model';
-import {
-  DocModeProvider,
-  DocModeService,
-} from '@blocksuite/affine-shared/services';
-import { type BlockSpec, BlockStdScope } from '@blocksuite/block-std';
+import { DocModeService } from '@blocksuite/affine-shared/services';
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import { PageRootService } from '../../root-block/page/page-root-service.js';
@@ -13,13 +10,14 @@ import { CommonFirstPartyBlockSpecs } from '../common.js';
 
 const PreviewPageSpec: BlockSpec = {
   schema: RootBlockSchema,
-  service: PageRootService,
   view: {
     component: literal`affine-preview-root`,
   },
-  setup: (_slots, _disposableGroup, di) => {
-    di.addImpl(DocModeProvider, DocModeService, [BlockStdScope]);
-  },
+  extensions: [
+    FlavourExtension('affine:page'),
+    PageRootService,
+    DocModeService,
+  ],
 };
 
 export const PreviewEditorBlockSpecs: BlockSpec[] = [

packages/blocks/src/_specs/utils/spec-builder.ts

@@ -1,5 +1,5 @@
-import type { BlockSpec, BlockSpecSlots } from '@blocksuite/block-std';
-import type { DisposableGroup } from '@blocksuite/global/utils';
+import type { ExtensionType } from '@blocksuite/block-std';
+import type { BlockSpec } from '@blocksuite/block-std';
 
 import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
 
@@ -10,12 +10,9 @@ export class SpecBuilder {
     this._value = [...spec];
   }
 
-  setup<Flavour extends BlockSuite.ServiceKeys>(
+  extend<Flavour extends BlockSuite.Flavour>(
     flavour: Flavour,
-    setup: (
-      slots: BlockSpecSlots<BlockSuite.BlockServices[Flavour]>,
-      disposableGroup: DisposableGroup
-    ) => void
+    extensions: ExtensionType[]
   ) {
     const specIndex = this._value.findIndex(
       s => s.schema.model.flavour === flavour
@@ -33,15 +30,9 @@ export class SpecBuilder {
     };
 
     const spec = this._value[specIndex];
-    const oldSetup = spec.setup;
+    const prevExtensions = spec.extensions || [];
 
-    spec.setup = (slots, disposableGroup, di) => {
-      oldSetup?.(slots, disposableGroup, di);
-      setup(
-        slots as unknown as BlockSpecSlots<BlockSuite.BlockServices[Flavour]>,
-        disposableGroup
-      );
-    };
+    spec.extensions = [...prevExtensions, ...extensions];
   }
 
   get value() {

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

@@ -1,7 +1,4 @@
-import {
-  type AttachmentBlockModel,
-  AttachmentBlockSchema,
-} from '@blocksuite/affine-model';
+import { AttachmentBlockSchema } from '@blocksuite/affine-model';
 import {
   isInsideEdgelessEditor,
   matchFlavours,
@@ -34,7 +31,7 @@ import {
 import { AttachmentEdgelessBlockComponent } from './attachment-edgeless-block.js';
 import { addSiblingAttachmentBlocks } from './utils.js';
 
-export class AttachmentBlockService extends BlockService<AttachmentBlockModel> {
+export class AttachmentBlockService extends BlockService {
   private _dragHandleOption: DragHandleOption = {
     flavour: AttachmentBlockSchema.model.flavour,
     edgeless: true,
@@ -176,6 +173,8 @@ export class AttachmentBlockService extends BlockService<AttachmentBlockModel> {
     },
   };
 
+  static override readonly flavour = AttachmentBlockSchema.model.flavour;
+
   fileDropManager!: FileDropManager;
 
   maxFileSize = 10 * 1000 * 1000; // 10MB (default)

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

@@ -1,6 +1,5 @@
-import type { BlockSpec } from '@blocksuite/block-std';
-
 import { AttachmentBlockSchema } from '@blocksuite/affine-model';
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import './attachment-edgeless-block.js';
@@ -15,5 +14,5 @@ export const AttachmentBlockSpec: BlockSpec = {
         : literal`affine-attachment`;
     },
   },
-  service: AttachmentBlockService,
+  extensions: [FlavourExtension('affine:attachment'), AttachmentBlockService],
 };

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

@@ -1,7 +1,4 @@
-import {
-  type BookmarkBlockModel,
-  BookmarkBlockSchema,
-} from '@blocksuite/affine-model';
+import { BookmarkBlockSchema } from '@blocksuite/affine-model';
 import { matchFlavours } from '@blocksuite/affine-shared/utils';
 import { BlockService } from '@blocksuite/block-std';
 import { Bound, Point } from '@blocksuite/global/utils';
@@ -24,7 +21,7 @@ import {
 } from '../root-block/widgets/drag-handle/utils.js';
 import { BookmarkEdgelessBlockComponent } from './bookmark-edgeless-block.js';
 
-export class BookmarkBlockService extends BlockService<BookmarkBlockModel> {
+export class BookmarkBlockService extends BlockService {
   private _dragHandleOption: DragHandleOption = {
     flavour: BookmarkBlockSchema.model.flavour,
     edgeless: true,
@@ -123,6 +120,8 @@ export class BookmarkBlockService extends BlockService<BookmarkBlockModel> {
 
   private static readonly linkPreviewer = new LinkPreviewer();
 
+  static override readonly flavour = BookmarkBlockSchema.model.flavour;
+
   static setLinkPreviewEndpoint =
     BookmarkBlockService.linkPreviewer.setEndpoint;
 

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

@@ -1,6 +1,5 @@
-import type { BlockSpec } from '@blocksuite/block-std';
-
 import { BookmarkBlockSchema } from '@blocksuite/affine-model';
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import './bookmark-edgeless-block.js';
@@ -16,5 +15,5 @@ export const BookmarkBlockSpec: BlockSpec = {
         : literal`affine-bookmark`,
   },
   commands,
-  service: BookmarkBlockService,
+  extensions: [FlavourExtension('affine:bookmark'), BookmarkBlockService],
 };

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

@@ -2,7 +2,7 @@ import {
   InlineManager,
   textKeymap,
 } from '@blocksuite/affine-components/rich-text';
-import { type CodeBlockModel, ColorScheme } from '@blocksuite/affine-model';
+import { CodeBlockSchema, ColorScheme } from '@blocksuite/affine-model';
 import { ThemeObserver } from '@blocksuite/affine-shared/theme';
 import { BlockService } from '@blocksuite/block-std';
 import { type Signal, signal } from '@lit-labs/preact-signals';
@@ -23,11 +23,13 @@ import {
   CODE_BLOCK_DEFAULT_LIGHT_THEME,
 } from './highlight/const.js';
 
-export class CodeBlockService extends BlockService<CodeBlockModel> {
+export class CodeBlockService extends BlockService {
   private _darkThemeKey: string | undefined;
 
   private _lightThemeKey: string | undefined;
 
+  static override readonly flavour = CodeBlockSchema.model.flavour;
+
   highlighter$: Signal<HighlighterCore | null> = signal(null);
 
   readonly inlineManager = new InlineManager<CodeBlockTextAttributes>();

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

@@ -1,6 +1,5 @@
-import type { BlockSpec } from '@blocksuite/block-std';
-
 import { CodeBlockSchema } from '@blocksuite/affine-model';
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import type { CodeBlockConfig } from './code-block-config.js';
@@ -9,8 +8,7 @@ import { CodeBlockService } from './code-block-service.js';
 
 export const CodeBlockSpec: BlockSpec<
   'codeToolbar' | 'codeLangList',
-  CodeBlockConfig,
-  CodeBlockService
+  CodeBlockConfig
 > = {
   schema: CodeBlockSchema,
   view: {
@@ -20,5 +18,5 @@ export const CodeBlockSpec: BlockSpec<
       codeLangList: literal`affine-code-language-list-widget`,
     },
   },
-  service: CodeBlockService,
+  extensions: [FlavourExtension('affine:code'), CodeBlockService],
 };

packages/blocks/src/data-view-block/data-view-spec.ts

@@ -1,14 +1,13 @@
-import type { BlockSpec } from '@blocksuite/block-std';
-
+import { type BlockSpec, FlavourExtension } from '@blocksuite/block-std';
 import { literal } from 'lit/static-html.js';
 
 import { DataViewBlockSchema } from './data-view-model.js';
 import { DataViewBlockService } from './database-service.js';
 
 export const DataViewBlockSpec: BlockSpec = {
   schema: DataViewBlockSchema,
-  service: DataViewBlockService,
   view: {
     component: literal`affine-data-view`,
   },
+  extensions: [FlavourExtension('affine:data-view'), DataViewBlockService],
 };

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

@@ -6,11 +6,12 @@ import {
 } from '@blocksuite/affine-components/rich-text';
 import { BlockService } from '@blocksuite/block-std';
 
-import type { DataViewBlockModel } from './data-view-model.js';
-
 import { DatabaseSelection } from '../database-block/data-view/index.js';
+import { DataViewBlockSchema } from './data-view-model.js';
+
+export class DataViewBlockService extends BlockService {
+  static override readonly flavour = DataViewBlockSchema.model.flavour;
 
-export class DataViewBlockService extends BlockService<DataViewBlockModel> {
   readonly inlineManager = new InlineManager();
 
   readonly referenceNodeConfig = new ReferenceNodeConfig();

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

@@ -1,4 +1,3 @@
-import type { DatabaseBlockModel } from '@blocksuite/affine-model';
 import type { BlockModel, Doc } from '@blocksuite/store';
 
 import {
@@ -7,6 +6,10 @@ import {
   affineInlineMarkdownMatches,
   getAffineInlineSpecsWithReference,
 } from '@blocksuite/affine-components/rich-text';
+import {
+  type DatabaseBlockModel,
+  DatabaseBlockSchema,
+} from '@blocksuite/affine-model';
 import { BlockService } from '@blocksuite/block-std';
 import { assertExists } from '@blocksuite/global/utils';
 
@@ -24,7 +27,9 @@ import {
   updateView,
 } from './utils.js';
 
-export class DatabaseBlockService extends BlockService<DatabaseBlockModel> {
+export class DatabaseBlockService extends BlockService {
+  static override readonly flavour = DatabaseBlockSchema.model.flavour;
+
   addColumn = addColumn;
 
   applyColumnUpdate = applyColumnUpdate;