refactor(editor): reorg block specs (#9421)

blocksuite/blocks/src/_specs/common.ts

@@ -2,52 +2,72 @@ import { AttachmentBlockSpec } from '@blocksuite/affine-block-attachment';
 import { BookmarkBlockSpec } from '@blocksuite/affine-block-bookmark';
 import { CodeBlockSpec } from '@blocksuite/affine-block-code';
 import { DividerBlockSpec } from '@blocksuite/affine-block-divider';
+import { EdgelessTextBlockSpec } from '@blocksuite/affine-block-edgeless-text';
 import { EmbedExtensions } from '@blocksuite/affine-block-embed';
+import { FrameBlockSpec } from '@blocksuite/affine-block-frame';
 import { ImageBlockSpec } from '@blocksuite/affine-block-image';
+import { LatexBlockSpec } from '@blocksuite/affine-block-latex';
 import { ListBlockSpec } from '@blocksuite/affine-block-list';
 import {
   EdgelessNoteBlockSpec,
   NoteBlockSpec,
 } from '@blocksuite/affine-block-note';
 import { ParagraphBlockSpec } from '@blocksuite/affine-block-paragraph';
-import { RichTextExtensions } from '@blocksuite/affine-components/rich-text';
-import { EditPropsStore } from '@blocksuite/affine-shared/services';
+import {
+  EdgelessSurfaceBlockSpec,
+  PageSurfaceBlockSpec,
+} from '@blocksuite/affine-block-surface';
+import {
+  RefNodeSlotsExtension,
+  RichTextExtensions,
+} from '@blocksuite/affine-components/rich-text';
+import {
+  EditPropsStore,
+  FontLoaderService,
+} from '@blocksuite/affine-shared/services';
 import type { ExtensionType } from '@blocksuite/block-std';
 
 import { AdapterFactoryExtensions } from '../_common/adapters/extension.js';
 import { DataViewBlockSpec } from '../data-view-block/data-view-spec.js';
 import { DatabaseBlockSpec } from '../database-block/database-spec.js';
+import {
+  EdgelessSurfaceRefBlockSpec,
+  PageSurfaceRefBlockSpec,
+} from '../surface-ref-block/surface-ref-spec.js';
 
-export const CommonFirstPartyBlockSpecs: ExtensionType[] = [
-  RichTextExtensions,
+export const CommonBlockSpecs: ExtensionType[] = [
+  RefNodeSlotsExtension,
   EditPropsStore,
+  RichTextExtensions,
+  LatexBlockSpec,
   ListBlockSpec,
-  NoteBlockSpec,
   DatabaseBlockSpec,
   DataViewBlockSpec,
   DividerBlockSpec,
+  BookmarkBlockSpec,
+  EmbedExtensions,
+  AttachmentBlockSpec,
+  AdapterFactoryExtensions,
   CodeBlockSpec,
   ImageBlockSpec,
   ParagraphBlockSpec,
-  BookmarkBlockSpec,
-  AttachmentBlockSpec,
-  EmbedExtensions,
-  AdapterFactoryExtensions,
+].flat();
+
+export const PageFirstPartyBlockSpecs: ExtensionType[] = [
+  ...CommonBlockSpecs,
+  NoteBlockSpec,
+  PageSurfaceBlockSpec,
+  PageSurfaceRefBlockSpec,
+  FontLoaderService,
 ].flat();
 
 export const EdgelessFirstPartyBlockSpecs: ExtensionType[] = [
-  RichTextExtensions,
-  EditPropsStore,
-  ListBlockSpec,
+  ...CommonBlockSpecs,
+
   EdgelessNoteBlockSpec,
-  DatabaseBlockSpec,
-  DataViewBlockSpec,
-  DividerBlockSpec,
-  CodeBlockSpec,
-  ImageBlockSpec,
-  ParagraphBlockSpec,
-  BookmarkBlockSpec,
-  AttachmentBlockSpec,
-  EmbedExtensions,
-  AdapterFactoryExtensions,
+  EdgelessSurfaceBlockSpec,
+  EdgelessSurfaceRefBlockSpec,
+  FrameBlockSpec,
+  EdgelessTextBlockSpec,
+  FontLoaderService,
 ].flat();

blocksuite/blocks/src/_specs/preset/edgeless-specs.ts

@@ -1,11 +1,4 @@
-import { EdgelessTextBlockSpec } from '@blocksuite/affine-block-edgeless-text';
-import { FrameBlockSpec } from '@blocksuite/affine-block-frame';
-import { LatexBlockSpec } from '@blocksuite/affine-block-latex';
-import {
-  ConnectionOverlay,
-  EdgelessSurfaceBlockSpec,
-} from '@blocksuite/affine-block-surface';
-import { FontLoaderService } from '@blocksuite/affine-shared/services';
+import { ConnectionOverlay } from '@blocksuite/affine-block-surface';
 import type { ExtensionType } from '@blocksuite/block-std';
 
 import { EdgelessRootBlockSpec } from '../../root-block/edgeless/edgeless-root-spec.js';
@@ -30,7 +23,6 @@ import { TemplateTool } from '../../root-block/edgeless/gfx-tool/template-tool.j
 import { TextTool } from '../../root-block/edgeless/gfx-tool/text-tool.js';
 import { EditPropsMiddlewareBuilder } from '../../root-block/edgeless/middlewares/base.js';
 import { EdgelessSnapManager } from '../../root-block/edgeless/utils/snap-manager.js';
-import { EdgelessSurfaceRefBlockSpec } from '../../surface-ref-block/surface-ref-spec.js';
 import { EdgelessFirstPartyBlockSpecs } from '../common.js';
 
 export const EdgelessToolExtension: ExtensionType[] = [
@@ -62,12 +54,6 @@ export const EdgelessBuiltInManager: ExtensionType[] = [
 export const EdgelessEditorBlockSpecs: ExtensionType[] = [
   EdgelessRootBlockSpec,
   ...EdgelessFirstPartyBlockSpecs,
-  EdgelessSurfaceBlockSpec,
-  EdgelessSurfaceRefBlockSpec,
-  FrameBlockSpec,
-  EdgelessTextBlockSpec,
-  LatexBlockSpec,
-  FontLoaderService,
   EdgelessToolExtension,
   EdgelessBuiltInManager,
 ].flat();

blocksuite/blocks/src/_specs/preset/page-specs.ts

@@ -1,17 +1,9 @@
-import { LatexBlockSpec } from '@blocksuite/affine-block-latex';
-import { PageSurfaceBlockSpec } from '@blocksuite/affine-block-surface';
-import { FontLoaderService } from '@blocksuite/affine-shared/services';
 import type { ExtensionType } from '@blocksuite/block-std';
 
 import { PageRootBlockSpec } from '../../root-block/page/page-root-spec.js';
-import { PageSurfaceRefBlockSpec } from '../../surface-ref-block/surface-ref-spec.js';
-import { CommonFirstPartyBlockSpecs } from '../common.js';
+import { PageFirstPartyBlockSpecs } from '../common.js';
 
 export const PageEditorBlockSpecs: ExtensionType[] = [
   PageRootBlockSpec,
-  ...CommonFirstPartyBlockSpecs,
-  PageSurfaceBlockSpec,
-  PageSurfaceRefBlockSpec,
-  LatexBlockSpec,
-  FontLoaderService,
+  ...PageFirstPartyBlockSpecs,
 ].flat();

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

@@ -1,64 +1,18 @@
-import { EdgelessTextBlockSpec } from '@blocksuite/affine-block-edgeless-text';
-import { FrameBlockSpec } from '@blocksuite/affine-block-frame';
-import { LatexBlockSpec } from '@blocksuite/affine-block-latex';
-import {
-  EdgelessSurfaceBlockSpec,
-  PageSurfaceBlockSpec,
-} from '@blocksuite/affine-block-surface';
-import { RefNodeSlotsExtension } from '@blocksuite/affine-components/rich-text';
-import {
-  DocDisplayMetaService,
-  DocModeService,
-  EmbedOptionService,
-  FontLoaderService,
-  ThemeService,
-} from '@blocksuite/affine-shared/services';
-import {
-  BlockViewExtension,
-  type ExtensionType,
-  FlavourExtension,
-} from '@blocksuite/block-std';
-import { literal } from 'lit/static-html.js';
+import type { ExtensionType } from '@blocksuite/block-std';
 
 import { PreviewEdgelessRootBlockSpec } from '../../root-block/edgeless/edgeless-root-spec.js';
-import { PageRootService } from '../../root-block/page/page-root-service.js';
+import { PreviewPageRootBlockSpec } from '../../root-block/page/page-root-spec.js';
 import {
-  EdgelessSurfaceRefBlockSpec,
-  PageSurfaceRefBlockSpec,
-} from '../../surface-ref-block/surface-ref-spec.js';
-import {
-  CommonFirstPartyBlockSpecs,
   EdgelessFirstPartyBlockSpecs,
+  PageFirstPartyBlockSpecs,
 } from '../common.js';
 
-const PreviewPageSpec: ExtensionType[] = [
-  FlavourExtension('affine:page'),
-  PageRootService,
-  DocModeService,
-  ThemeService,
-  EmbedOptionService,
-  BlockViewExtension('affine:page', literal`affine-preview-root`),
-  DocDisplayMetaService,
-];
-
 export const PreviewEdgelessEditorBlockSpecs: ExtensionType[] = [
   PreviewEdgelessRootBlockSpec,
-  ...EdgelessFirstPartyBlockSpecs,
-  EdgelessSurfaceBlockSpec,
-  EdgelessSurfaceRefBlockSpec,
-  FrameBlockSpec,
-  EdgelessTextBlockSpec,
-  LatexBlockSpec,
-  FontLoaderService,
-  RefNodeSlotsExtension(),
+  EdgelessFirstPartyBlockSpecs,
 ].flat();
 
-export const PreviewEditorBlockSpecs: ExtensionType[] = [
-  PreviewPageSpec,
-  ...CommonFirstPartyBlockSpecs,
-  PageSurfaceBlockSpec,
-  PageSurfaceRefBlockSpec,
-  LatexBlockSpec,
-  FontLoaderService,
-  RefNodeSlotsExtension(),
+export const PreviewPageEditorBlockSpecs: ExtensionType[] = [
+  PreviewPageRootBlockSpec,
+  PageFirstPartyBlockSpecs,
 ].flat();

blocksuite/blocks/src/_specs/register-specs.ts

@@ -1,16 +1,21 @@
 import { SpecProvider } from '@blocksuite/affine-shared/utils';
 
+import { CommonBlockSpecs } from './common.js';
 import { EdgelessEditorBlockSpecs } from './preset/edgeless-specs.js';
 import { PageEditorBlockSpecs } from './preset/page-specs.js';
 import {
   PreviewEdgelessEditorBlockSpecs,
-  PreviewEditorBlockSpecs,
+  PreviewPageEditorBlockSpecs,
 } from './preset/preview-specs.js';
 
 export function registerSpecs() {
+  SpecProvider.getInstance().addSpec('common', CommonBlockSpecs);
   SpecProvider.getInstance().addSpec('page', PageEditorBlockSpecs);
   SpecProvider.getInstance().addSpec('edgeless', EdgelessEditorBlockSpecs);
-  SpecProvider.getInstance().addSpec('page:preview', PreviewEditorBlockSpecs);
+  SpecProvider.getInstance().addSpec(
+    'page:preview',
+    PreviewPageEditorBlockSpecs
+  );
   SpecProvider.getInstance().addSpec(
     'edgeless:preview',
     PreviewEdgelessEditorBlockSpecs

blocksuite/blocks/src/root-block/page/page-root-spec.ts

@@ -64,19 +64,28 @@ export const pageRootWidgetViewMap = {
   [AFFINE_SCROLL_ANCHORING_WIDGET]: literal`${unsafeStatic(AFFINE_SCROLL_ANCHORING_WIDGET)}`,
 };
 
-export const PageRootBlockSpec: ExtensionType[] = [
+const PageCommonExtension: ExtensionType[] = [
   FlavourExtension('affine:page'),
   PageRootService,
   DocModeService,
   ThemeService,
   EmbedOptionService,
-  CommandExtension(commands),
+  DocDisplayMetaService,
+  PageViewportServiceExtension,
+];
+
+export const PageRootBlockSpec: ExtensionType[] = [
+  ...PageCommonExtension,
   BlockViewExtension('affine:page', literal`affine-page-root`),
+  CommandExtension(commands),
   WidgetViewMapExtension('affine:page', pageRootWidgetViewMap),
   ExportManagerExtension,
   DNDAPIExtension,
-  PageViewportServiceExtension,
-  DocDisplayMetaService,
   RootBlockAdapterExtensions,
   FileDropExtension,
 ].flat();
+
+export const PreviewPageRootBlockSpec: ExtensionType[] = [
+  ...PageCommonExtension,
+  BlockViewExtension('affine:page', literal`affine-preview-root`),
+];