feat(editor): surface block extension (#11961)

Closes: BS-3204

blocksuite/affine/all/package.json

@@ -134,7 +134,9 @@
     "./blocks/paragraph/store": "./src/blocks/paragraph/store.ts",
     "./blocks/paragraph/view": "./src/blocks/paragraph/view.ts",
     "./blocks/root": "./src/blocks/root.ts",
-    "./blocks/surface": "./src/blocks/surface.ts",
+    "./blocks/surface": "./src/blocks/surface/index.ts",
+    "./blocks/surface/store": "./src/blocks/surface/store.ts",
+    "./blocks/surface/view": "./src/blocks/surface/view.ts",
     "./blocks/surface-ref": "./src/blocks/surface-ref/index.ts",
     "./blocks/surface-ref/store": "./src/blocks/surface-ref/store.ts",
     "./blocks/surface-ref/view": "./src/blocks/surface-ref/view.ts",

blocksuite/affine/all/src/blocks/surface/store.ts

@@ -0,0 +1 @@
+export * from '@blocksuite/affine-block-surface/store';

blocksuite/affine/all/src/blocks/surface/view.ts

@@ -0,0 +1 @@
+export * from '@blocksuite/affine-block-surface/view';

blocksuite/affine/all/src/extensions/effects.ts

@@ -1,5 +1,4 @@
 import { effects as blockRootEffects } from '@blocksuite/affine-block-root/effects';
-import { effects as blockSurfaceEffects } from '@blocksuite/affine-block-surface/effects';
 import { BlockSelection } from '@blocksuite/affine-components/block-selection';
 import { BlockZeroWidth } from '@blocksuite/affine-components/block-zero-width';
 import { effects as componentCaptionEffects } from '@blocksuite/affine-components/caption';
@@ -46,7 +45,6 @@ export function effects() {
   dataViewEffects();
   richTextEffects();
 
-  blockSurfaceEffects();
   blockRootEffects();
 
   componentCaptionEffects();

blocksuite/affine/all/src/extensions/migrating-store.ts

@@ -4,7 +4,6 @@ import {
   RootBlockMarkdownAdapterExtension,
   RootBlockNotionHtmlAdapterExtension,
 } from '@blocksuite/affine-block-root';
-import { SurfaceBlockSchemaExtension } from '@blocksuite/affine-block-surface';
 import {
   type StoreExtensionContext,
   StoreExtensionProvider,
@@ -69,7 +68,6 @@ function getNotionHtmlAdapterExtensions(): ExtensionType[] {
 
 const MigratingStoreExtensions: ExtensionType[] = [
   RootBlockSchemaExtension,
-  SurfaceBlockSchemaExtension,
   TranscriptionBlockSchemaExtension,
 
   BlockSelectionExtension,

blocksuite/affine/all/src/extensions/migrating.ts

@@ -5,13 +5,6 @@ import {
   PreviewPageRootBlockSpec,
   ReadOnlyClipboard,
 } from '@blocksuite/affine-block-root';
-import {
-  EdgelessSurfaceBlockAdapterExtensions,
-  EdgelessSurfaceBlockSpec,
-  PageSurfaceBlockSpec,
-  SurfaceBlockAdapterExtensions,
-} from '@blocksuite/affine-block-surface';
-import { inlinePresetExtensions } from '@blocksuite/affine-inline-preset';
 import {
   DefaultOpenDocExtension,
   DocDisplayMetaService,
@@ -21,45 +14,30 @@ import {
 import type { ExtensionType } from '@blocksuite/store';
 
 const CommonBlockSpecs: ExtensionType[] = [
-  inlinePresetExtensions,
   DocDisplayMetaService,
   EditPropsStore,
   DefaultOpenDocExtension,
   FontLoaderService,
 ].flat();
 
-const PageFirstPartyBlockSpecs: ExtensionType[] = [
-  CommonBlockSpecs,
-  PageSurfaceBlockSpec,
-
-  ...SurfaceBlockAdapterExtensions,
-].flat();
-
-const EdgelessFirstPartyBlockSpecs: ExtensionType[] = [
-  CommonBlockSpecs,
-  EdgelessSurfaceBlockSpec,
-
-  ...EdgelessSurfaceBlockAdapterExtensions,
-].flat();
-
 export const MigratingEdgelessEditorBlockSpecs: ExtensionType[] = [
   EdgelessBuiltInSpecs,
-  EdgelessFirstPartyBlockSpecs,
+  CommonBlockSpecs,
 ].flat();
 
 export const MigratingPageEditorBlockSpecs: ExtensionType[] = [
   PageRootBlockSpec,
-  PageFirstPartyBlockSpecs,
+  CommonBlockSpecs,
 ].flat();
 
 export const MigratingPreviewEdgelessEditorBlockSpecs: ExtensionType[] = [
   PreviewEdgelessRootBlockSpec,
-  EdgelessFirstPartyBlockSpecs,
+  CommonBlockSpecs,
   ReadOnlyClipboard,
 ].flat();
 
 export const MigratingPreviewPageEditorBlockSpecs: ExtensionType[] = [
   PreviewPageRootBlockSpec,
-  PageFirstPartyBlockSpecs,
+  CommonBlockSpecs,
   ReadOnlyClipboard,
 ].flat();

blocksuite/affine/all/src/extensions/store.ts

@@ -13,6 +13,7 @@ import { LatexStoreExtension } from '@blocksuite/affine-block-latex/store';
 import { ListStoreExtension } from '@blocksuite/affine-block-list/store';
 import { NoteStoreExtension } from '@blocksuite/affine-block-note/store';
 import { ParagraphStoreExtension } from '@blocksuite/affine-block-paragraph/store';
+import { SurfaceStoreExtension } from '@blocksuite/affine-block-surface/store';
 import { SurfaceRefStoreExtension } from '@blocksuite/affine-block-surface-ref/store';
 import { TableStoreExtension } from '@blocksuite/affine-block-table/store';
 import { BrushStoreExtension } from '@blocksuite/affine-gfx-brush/store';
@@ -48,6 +49,7 @@ export function getInternalStoreExtensions() {
     ParagraphStoreExtension,
     SurfaceRefStoreExtension,
     TableStoreExtension,
+    SurfaceStoreExtension,
 
     FootnoteStoreExtension,
     LinkStoreExtension,

blocksuite/affine/all/src/extensions/view.ts

@@ -13,6 +13,7 @@ import { LatexViewExtension } from '@blocksuite/affine-block-latex/view';
 import { ListViewExtension } from '@blocksuite/affine-block-list/view';
 import { NoteViewExtension } from '@blocksuite/affine-block-note/view';
 import { ParagraphViewExtension } from '@blocksuite/affine-block-paragraph/view';
+import { SurfaceViewExtension } from '@blocksuite/affine-block-surface/view';
 import { SurfaceRefViewExtension } from '@blocksuite/affine-block-surface-ref/view';
 import { TableViewExtension } from '@blocksuite/affine-block-table/view';
 import { BrushViewExtension } from '@blocksuite/affine-gfx-brush/view';
@@ -62,6 +63,7 @@ export function getInternalViewExtensions() {
     ParagraphViewExtension,
     SurfaceRefViewExtension,
     TableViewExtension,
+    SurfaceViewExtension,
 
     // Inline
     FootnoteViewExtension,

blocksuite/affine/blocks/surface/package.json

@@ -11,6 +11,7 @@
   "license": "MIT",
   "dependencies": {
     "@blocksuite/affine-components": "workspace:*",
+    "@blocksuite/affine-ext-loader": "workspace:*",
     "@blocksuite/affine-model": "workspace:*",
     "@blocksuite/affine-rich-text": "workspace:*",
     "@blocksuite/affine-shared": "workspace:*",
@@ -36,7 +37,9 @@
   },
   "exports": {
     ".": "./src/index.ts",
-    "./effects": "./src/effects.ts"
+    "./effects": "./src/effects.ts",
+    "./store": "./src/store.ts",
+    "./view": "./src/view.ts"
   },
   "files": [
     "src",

blocksuite/affine/blocks/surface/src/store.ts

@@ -0,0 +1,17 @@
+import {
+  type StoreExtensionContext,
+  StoreExtensionProvider,
+} from '@blocksuite/affine-ext-loader';
+
+import { EdgelessSurfaceBlockAdapterExtensions } from './adapters';
+import { SurfaceBlockSchemaExtension } from './surface-model';
+
+export class SurfaceStoreExtension extends StoreExtensionProvider {
+  override name = 'affine-surface-block';
+
+  override setup(context: StoreExtensionContext) {
+    super.setup(context);
+    context.register(SurfaceBlockSchemaExtension);
+    context.register(EdgelessSurfaceBlockAdapterExtensions);
+  }
+}

blocksuite/affine/blocks/surface/src/view.ts

@@ -0,0 +1,41 @@
+import {
+  type ViewExtensionContext,
+  ViewExtensionProvider,
+} from '@blocksuite/affine-ext-loader';
+import { BlockViewExtension, FlavourExtension } from '@blocksuite/std';
+import { literal } from 'lit/static-html.js';
+
+import { effects } from './effects';
+import {
+  EdgelessCRUDExtension,
+  EdgelessLegacySlotExtension,
+} from './extensions';
+import { ExportManagerExtension } from './extensions/export-manager/export-manager';
+
+export class SurfaceViewExtension extends ViewExtensionProvider {
+  override name = 'affine-surface-block';
+
+  override effect() {
+    super.effect();
+    effects();
+  }
+
+  override setup(context: ViewExtensionContext) {
+    super.setup(context);
+    context.register([
+      FlavourExtension('affine:surface'),
+      EdgelessCRUDExtension,
+      EdgelessLegacySlotExtension,
+      ExportManagerExtension,
+    ]);
+    if (this.isEdgeless(context.scope)) {
+      context.register(
+        BlockViewExtension('affine:surface', literal`affine-surface`)
+      );
+    } else {
+      context.register(
+        BlockViewExtension('affine:surface', literal`affine-surface-void`)
+      );
+    }
+  }
+}

blocksuite/affine/blocks/surface/tsconfig.json

@@ -8,6 +8,7 @@
   "include": ["./src"],
   "references": [
     { "path": "../../components" },
+    { "path": "../../ext-loader" },
     { "path": "../../model" },
     { "path": "../../rich-text" },
     { "path": "../../shared" },

tools/utils/src/workspace.gen.ts

@@ -364,6 +364,7 @@ export const PackageList = [
     name: '@blocksuite/affine-block-surface',
     workspaceDependencies: [
       'blocksuite/affine/components',
+      'blocksuite/affine/ext-loader',
       'blocksuite/affine/model',
       'blocksuite/affine/rich-text',
       'blocksuite/affine/shared',

yarn.lock

@@ -2914,6 +2914,7 @@ __metadata:
   resolution: "@blocksuite/affine-block-surface@workspace:blocksuite/affine/blocks/surface"
   dependencies:
     "@blocksuite/affine-components": "workspace:*"
+    "@blocksuite/affine-ext-loader": "workspace:*"
     "@blocksuite/affine-model": "workspace:*"
     "@blocksuite/affine-rich-text": "workspace:*"
     "@blocksuite/affine-shared": "workspace:*"