From e57222b89af573a615ede193db57db3622a5c9b2 Mon Sep 17 00:00:00 2001 From: Saul-Mirone Date: Wed, 23 Apr 2025 01:16:07 +0000 Subject: [PATCH] feat(editor): surface ref extension (#11902) Closes: BS-3203 --- blocksuite/affine/all/package.json | 4 +- .../affine/all/src/__tests__/utils/store.ts | 2 + .../{surface-ref.ts => surface-ref/index.ts} | 0 .../all/src/blocks/surface-ref/store.ts | 1 + .../affine/all/src/blocks/surface-ref/view.ts | 1 + .../affine/all/src/extensions/effects.ts | 2 - .../affine/all/src/extensions/migrating.ts | 6 --- blocksuite/affine/all/src/extensions/store.ts | 2 - .../affine/blocks/edgeless-text/src/view.ts | 5 +- .../affine/blocks/surface-ref/package.json | 4 +- .../affine/blocks/surface-ref/src/store.ts | 14 ++++++ .../affine/blocks/surface-ref/src/view.ts | 49 +++++++++++++++++++ .../affine/ext-loader/src/view-provider.ts | 13 +++++ blocksuite/integration-test/src/store.ts | 2 + blocksuite/integration-test/src/view.ts | 3 ++ .../src/blocksuite/manager/migrating-store.ts | 2 + .../src/blocksuite/manager/migrating-view.ts | 2 + .../core/src/blocksuite/manager/store.ts | 38 -------------- .../core/src/blocksuite/manager/view.ts | 38 -------------- 19 files changed, 96 insertions(+), 92 deletions(-) rename blocksuite/affine/all/src/blocks/{surface-ref.ts => surface-ref/index.ts} (100%) create mode 100644 blocksuite/affine/all/src/blocks/surface-ref/store.ts create mode 100644 blocksuite/affine/all/src/blocks/surface-ref/view.ts create mode 100644 blocksuite/affine/blocks/surface-ref/src/store.ts create mode 100644 blocksuite/affine/blocks/surface-ref/src/view.ts delete mode 100644 packages/frontend/core/src/blocksuite/manager/store.ts delete mode 100644 packages/frontend/core/src/blocksuite/manager/view.ts diff --git a/blocksuite/affine/all/package.json b/blocksuite/affine/all/package.json index acc45d5f4..1ffa70a7e 100644 --- a/blocksuite/affine/all/package.json +++ b/blocksuite/affine/all/package.json @@ -135,7 +135,9 @@ "./blocks/paragraph/view": "./src/blocks/paragraph/view.ts", "./blocks/root": "./src/blocks/root.ts", "./blocks/surface": "./src/blocks/surface.ts", - "./blocks/surface-ref": "./src/blocks/surface-ref.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", "./blocks/table": "./src/blocks/table.ts", "./data-view": "./src/data-view/index.ts", "./data-view/effects": "./src/data-view/effects.ts", diff --git a/blocksuite/affine/all/src/__tests__/utils/store.ts b/blocksuite/affine/all/src/__tests__/utils/store.ts index 63354927b..dfe695a9a 100644 --- a/blocksuite/affine/all/src/__tests__/utils/store.ts +++ b/blocksuite/affine/all/src/__tests__/utils/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 { SurfaceRefStoreExtension } from '@blocksuite/affine-block-surface-ref/store'; import { StoreExtensionManager } from '@blocksuite/affine-ext-loader'; import { MigratingStoreExtension } from '../../extensions/store'; @@ -33,6 +34,7 @@ const manager = new StoreExtensionManager([ ListStoreExtension, NoteStoreExtension, ParagraphStoreExtension, + SurfaceRefStoreExtension, MigratingStoreExtension, ]); diff --git a/blocksuite/affine/all/src/blocks/surface-ref.ts b/blocksuite/affine/all/src/blocks/surface-ref/index.ts similarity index 100% rename from blocksuite/affine/all/src/blocks/surface-ref.ts rename to blocksuite/affine/all/src/blocks/surface-ref/index.ts diff --git a/blocksuite/affine/all/src/blocks/surface-ref/store.ts b/blocksuite/affine/all/src/blocks/surface-ref/store.ts new file mode 100644 index 000000000..651b2b7ee --- /dev/null +++ b/blocksuite/affine/all/src/blocks/surface-ref/store.ts @@ -0,0 +1 @@ +export * from '@blocksuite/affine-block-surface-ref/store'; diff --git a/blocksuite/affine/all/src/blocks/surface-ref/view.ts b/blocksuite/affine/all/src/blocks/surface-ref/view.ts new file mode 100644 index 000000000..c66c1099e --- /dev/null +++ b/blocksuite/affine/all/src/blocks/surface-ref/view.ts @@ -0,0 +1 @@ +export * from '@blocksuite/affine-block-surface-ref/view'; diff --git a/blocksuite/affine/all/src/extensions/effects.ts b/blocksuite/affine/all/src/extensions/effects.ts index b0a2d32c8..2c8ac16dc 100644 --- a/blocksuite/affine/all/src/extensions/effects.ts +++ b/blocksuite/affine/all/src/extensions/effects.ts @@ -1,6 +1,5 @@ import { effects as blockRootEffects } from '@blocksuite/affine-block-root/effects'; import { effects as blockSurfaceEffects } from '@blocksuite/affine-block-surface/effects'; -import { effects as blockSurfaceRefEffects } from '@blocksuite/affine-block-surface-ref/effects'; import { effects as blockTableEffects } from '@blocksuite/affine-block-table/effects'; import { BlockSelection } from '@blocksuite/affine-components/block-selection'; import { BlockZeroWidth } from '@blocksuite/affine-components/block-zero-width'; @@ -62,7 +61,6 @@ export function effects() { inlineMentionEffects(); blockSurfaceEffects(); - blockSurfaceRefEffects(); blockTableEffects(); blockRootEffects(); diff --git a/blocksuite/affine/all/src/extensions/migrating.ts b/blocksuite/affine/all/src/extensions/migrating.ts index 5e1e60e9f..63905c437 100644 --- a/blocksuite/affine/all/src/extensions/migrating.ts +++ b/blocksuite/affine/all/src/extensions/migrating.ts @@ -11,10 +11,6 @@ import { PageSurfaceBlockSpec, SurfaceBlockAdapterExtensions, } from '@blocksuite/affine-block-surface'; -import { - EdgelessSurfaceRefBlockSpec, - PageSurfaceRefBlockSpec, -} from '@blocksuite/affine-block-surface-ref'; import { TableBlockSpec } from '@blocksuite/affine-block-table'; import { brushToMarkdownAdapterMatcher, @@ -82,7 +78,6 @@ const CommonBlockSpecs: ExtensionType[] = [ const PageFirstPartyBlockSpecs: ExtensionType[] = [ CommonBlockSpecs, PageSurfaceBlockSpec, - PageSurfaceRefBlockSpec, ...SurfaceBlockAdapterExtensions, ].flat(); @@ -90,7 +85,6 @@ const PageFirstPartyBlockSpecs: ExtensionType[] = [ const EdgelessFirstPartyBlockSpecs: ExtensionType[] = [ CommonBlockSpecs, EdgelessSurfaceBlockSpec, - EdgelessSurfaceRefBlockSpec, ...EdgelessSurfaceBlockAdapterExtensions, ].flat(); diff --git a/blocksuite/affine/all/src/extensions/store.ts b/blocksuite/affine/all/src/extensions/store.ts index c9bf77d78..c3e5fe5aa 100644 --- a/blocksuite/affine/all/src/extensions/store.ts +++ b/blocksuite/affine/all/src/extensions/store.ts @@ -27,7 +27,6 @@ import { } from '@blocksuite/affine-inline-preset'; import { RootBlockSchemaExtension, - SurfaceRefBlockSchemaExtension, TableBlockSchemaExtension, TranscriptionBlockSchemaExtension, } from '@blocksuite/affine-model'; @@ -115,7 +114,6 @@ function getPlainTextAdapterExtensions(): ExtensionType[] { const MigratingStoreExtensions: ExtensionType[] = [ RootBlockSchemaExtension, SurfaceBlockSchemaExtension, - SurfaceRefBlockSchemaExtension, TableBlockSchemaExtension, TranscriptionBlockSchemaExtension, diff --git a/blocksuite/affine/blocks/edgeless-text/src/view.ts b/blocksuite/affine/blocks/edgeless-text/src/view.ts index 3e7cd2a41..afc7ae034 100644 --- a/blocksuite/affine/blocks/edgeless-text/src/view.ts +++ b/blocksuite/affine/blocks/edgeless-text/src/view.ts @@ -17,10 +17,7 @@ export class EdgelessTextViewExtension extends ViewExtensionProvider { override setup(context: ViewExtensionContext) { super.setup(context); - const isEdgeless = - context.scope === 'edgeless' || - context.scope === 'preview-edgeless' || - context.scope === 'mobile-edgeless'; + const isEdgeless = this.isEdgeless(context.scope); if (isEdgeless) { context.register([ diff --git a/blocksuite/affine/blocks/surface-ref/package.json b/blocksuite/affine/blocks/surface-ref/package.json index b57d48fac..13b42156d 100644 --- a/blocksuite/affine/blocks/surface-ref/package.json +++ b/blocksuite/affine/blocks/surface-ref/package.json @@ -36,7 +36,9 @@ }, "exports": { ".": "./src/index.ts", - "./effects": "./src/effects.ts" + "./effects": "./src/effects.ts", + "./store": "./src/store.ts", + "./view": "./src/view.ts" }, "files": [ "src", diff --git a/blocksuite/affine/blocks/surface-ref/src/store.ts b/blocksuite/affine/blocks/surface-ref/src/store.ts new file mode 100644 index 000000000..e5562cb0f --- /dev/null +++ b/blocksuite/affine/blocks/surface-ref/src/store.ts @@ -0,0 +1,14 @@ +import { + type StoreExtensionContext, + StoreExtensionProvider, +} from '@blocksuite/affine-ext-loader'; +import { SurfaceRefBlockSchemaExtension } from '@blocksuite/affine-model'; + +export class SurfaceRefStoreExtension extends StoreExtensionProvider { + override name = 'affine-surface-ref-block'; + + override setup(context: StoreExtensionContext) { + super.setup(context); + context.register(SurfaceRefBlockSchemaExtension); + } +} diff --git a/blocksuite/affine/blocks/surface-ref/src/view.ts b/blocksuite/affine/blocks/surface-ref/src/view.ts new file mode 100644 index 000000000..173a3c085 --- /dev/null +++ b/blocksuite/affine/blocks/surface-ref/src/view.ts @@ -0,0 +1,49 @@ +import { + type ViewExtensionContext, + ViewExtensionProvider, +} from '@blocksuite/affine-ext-loader'; +import { SurfaceRefBlockSchema } from '@blocksuite/affine-model'; +import { ToolbarModuleExtension } from '@blocksuite/affine-shared/services'; +import { + BlockFlavourIdentifier, + BlockViewExtension, + FlavourExtension, +} from '@blocksuite/std'; +import { literal } from 'lit/static-html.js'; + +import { SurfaceRefSlashMenuConfigExtension } from './configs/slash-menu'; +import { surfaceRefToolbarModuleConfig } from './configs/toolbar'; +import { effects } from './effects'; + +const flavour = SurfaceRefBlockSchema.model.flavour; + +export class SurfaceRefViewExtension extends ViewExtensionProvider { + override name = 'affine-surface-ref-block'; + + override effect(): void { + super.effect(); + effects(); + } + + override setup(context: ViewExtensionContext): void { + super.setup(context); + context.register([ + FlavourExtension(flavour), + SurfaceRefSlashMenuConfigExtension, + ]); + const isEdgeless = this.isEdgeless(context.scope); + if (isEdgeless) { + context.register([ + BlockViewExtension(flavour, literal`affine-edgeless-surface-ref`), + ]); + } else { + context.register([ + BlockViewExtension(flavour, literal`affine-surface-ref`), + ToolbarModuleExtension({ + id: BlockFlavourIdentifier(flavour), + config: surfaceRefToolbarModuleConfig, + }), + ]); + } + } +} diff --git a/blocksuite/affine/ext-loader/src/view-provider.ts b/blocksuite/affine/ext-loader/src/view-provider.ts index 978778468..2a6dd4d93 100644 --- a/blocksuite/affine/ext-loader/src/view-provider.ts +++ b/blocksuite/affine/ext-loader/src/view-provider.ts @@ -81,6 +81,19 @@ export class ViewExtensionProvider< */ effect(): void {} + /** + * Check if the scope is edgeless + * @param scope - The scope to check + * @returns True if the scope is edgeless, false otherwise + */ + isEdgeless = (scope: ViewScope) => { + return ( + scope === 'edgeless' || + scope === 'preview-edgeless' || + scope === 'mobile-edgeless' + ); + }; + override setup(context: ViewExtensionContext, options?: Options) { super.setup(context, options); const constructer = this.constructor as typeof ViewExtensionProvider; diff --git a/blocksuite/integration-test/src/store.ts b/blocksuite/integration-test/src/store.ts index 9369ab5d7..2f69bf5bb 100644 --- a/blocksuite/integration-test/src/store.ts +++ b/blocksuite/integration-test/src/store.ts @@ -13,6 +13,7 @@ import { LatexStoreExtension } from '@blocksuite/affine/blocks/latex/store'; import { ListStoreExtension } from '@blocksuite/affine/blocks/list/store'; import { NoteStoreExtension } from '@blocksuite/affine/blocks/note/store'; import { ParagraphStoreExtension } from '@blocksuite/affine/blocks/paragraph/store'; +import { SurfaceRefStoreExtension } from '@blocksuite/affine/blocks/surface-ref/store'; import { StoreExtensionManager } from '@blocksuite/affine/ext-loader'; import { MigratingStoreExtension } from '@blocksuite/affine/extensions/store'; @@ -32,6 +33,7 @@ const manager = new StoreExtensionManager([ ListStoreExtension, NoteStoreExtension, ParagraphStoreExtension, + SurfaceRefStoreExtension, MigratingStoreExtension, ]); diff --git a/blocksuite/integration-test/src/view.ts b/blocksuite/integration-test/src/view.ts index dc56a13a3..18e9a3cdd 100644 --- a/blocksuite/integration-test/src/view.ts +++ b/blocksuite/integration-test/src/view.ts @@ -13,12 +13,14 @@ import { LatexViewExtension } from '@blocksuite/affine/blocks/latex/view'; import { ListViewExtension } from '@blocksuite/affine/blocks/list/view'; import { NoteViewExtension } from '@blocksuite/affine/blocks/note/view'; import { ParagraphViewExtension } from '@blocksuite/affine/blocks/paragraph/view'; +import { SurfaceRefViewExtension } from '@blocksuite/affine/blocks/surface-ref/view'; import { ViewExtensionManager } from '@blocksuite/affine/ext-loader'; import { MigratingViewExtension } from '@blocksuite/affine/extensions/view'; export function getTestViewManager() { const manager = new ViewExtensionManager([ MigratingViewExtension, + AttachmentViewExtension, BookmarkViewExtension, CalloutViewExtension, @@ -34,6 +36,7 @@ export function getTestViewManager() { ListViewExtension, NoteViewExtension, ParagraphViewExtension, + SurfaceRefViewExtension, ]); return manager; } diff --git a/packages/frontend/core/src/blocksuite/manager/migrating-store.ts b/packages/frontend/core/src/blocksuite/manager/migrating-store.ts index 36bc30ec8..930cb1d6a 100644 --- a/packages/frontend/core/src/blocksuite/manager/migrating-store.ts +++ b/packages/frontend/core/src/blocksuite/manager/migrating-store.ts @@ -13,6 +13,7 @@ import { LatexStoreExtension } from '@blocksuite/affine/blocks/latex/store'; import { ListStoreExtension } from '@blocksuite/affine/blocks/list/store'; import { NoteStoreExtension } from '@blocksuite/affine/blocks/note/store'; import { ParagraphStoreExtension } from '@blocksuite/affine/blocks/paragraph/store'; +import { SurfaceRefStoreExtension } from '@blocksuite/affine/blocks/surface-ref/store'; import { type StoreExtensionContext, StoreExtensionManager, @@ -47,6 +48,7 @@ const manager = new StoreExtensionManager([ ListStoreExtension, NoteStoreExtension, ParagraphStoreExtension, + SurfaceRefStoreExtension, MigratingStoreExtension, MigratingAffineStoreExtension, diff --git a/packages/frontend/core/src/blocksuite/manager/migrating-view.ts b/packages/frontend/core/src/blocksuite/manager/migrating-view.ts index 679bfd36e..8fdb0f0af 100644 --- a/packages/frontend/core/src/blocksuite/manager/migrating-view.ts +++ b/packages/frontend/core/src/blocksuite/manager/migrating-view.ts @@ -15,6 +15,7 @@ import { ListViewExtension } from '@blocksuite/affine/blocks/list/view'; import { NoteViewExtension } from '@blocksuite/affine/blocks/note/view'; import { ParagraphBlockConfigExtension } from '@blocksuite/affine/blocks/paragraph'; import { ParagraphViewExtension } from '@blocksuite/affine/blocks/paragraph/view'; +import { SurfaceRefViewExtension } from '@blocksuite/affine/blocks/surface-ref/view'; import { type ViewExtensionContext, ViewExtensionManager, @@ -160,6 +161,7 @@ const manager = new ViewExtensionManager([ ListViewExtension, NoteViewExtension, ParagraphViewExtension, + SurfaceRefViewExtension, MigratingAffineViewExtension, ]); diff --git a/packages/frontend/core/src/blocksuite/manager/store.ts b/packages/frontend/core/src/blocksuite/manager/store.ts deleted file mode 100644 index 6b6c21a40..000000000 --- a/packages/frontend/core/src/blocksuite/manager/store.ts +++ /dev/null @@ -1,38 +0,0 @@ -import { AttachmentStoreExtension } from '@blocksuite/affine/blocks/attachment/store'; -import { BookmarkStoreExtension } from '@blocksuite/affine/blocks/bookmark/store'; -import { CalloutStoreExtension } from '@blocksuite/affine/blocks/callout/store'; -import { CodeStoreExtension } from '@blocksuite/affine/blocks/code/store'; -import { DataViewStoreExtension } from '@blocksuite/affine/blocks/data-view/store'; -import { DatabaseStoreExtension } from '@blocksuite/affine/blocks/database/store'; -import { DividerStoreExtension } from '@blocksuite/affine/blocks/divider/store'; -import { EdgelessTextStoreExtension } from '@blocksuite/affine/blocks/edgeless-text/store'; -import { EmbedStoreExtension } from '@blocksuite/affine/blocks/embed/store'; -import { FrameStoreExtension } from '@blocksuite/affine/blocks/frame/store'; -import { ImageStoreExtension } from '@blocksuite/affine/blocks/image/store'; -import { LatexStoreExtension } from '@blocksuite/affine/blocks/latex/store'; -import { ListStoreExtension } from '@blocksuite/affine/blocks/list/store'; -import { NoteStoreExtension } from '@blocksuite/affine/blocks/note/store'; -import { ParagraphStoreExtension } from '@blocksuite/affine/blocks/paragraph/store'; -import { StoreExtensionManager } from '@blocksuite/affine/ext-loader'; - -export function createStoreManager() { - const manager = new StoreExtensionManager([ - AttachmentStoreExtension, - BookmarkStoreExtension, - CalloutStoreExtension, - CodeStoreExtension, - DataViewStoreExtension, - DatabaseStoreExtension, - DividerStoreExtension, - EdgelessTextStoreExtension, - EmbedStoreExtension, - FrameStoreExtension, - ImageStoreExtension, - LatexStoreExtension, - ListStoreExtension, - NoteStoreExtension, - ParagraphStoreExtension, - ]); - - return manager; -} diff --git a/packages/frontend/core/src/blocksuite/manager/view.ts b/packages/frontend/core/src/blocksuite/manager/view.ts deleted file mode 100644 index 56112f966..000000000 --- a/packages/frontend/core/src/blocksuite/manager/view.ts +++ /dev/null @@ -1,38 +0,0 @@ -import { AttachmentViewExtension } from '@blocksuite/affine/blocks/attachment/view'; -import { BookmarkViewExtension } from '@blocksuite/affine/blocks/bookmark/view'; -import { CalloutViewExtension } from '@blocksuite/affine/blocks/callout/view'; -import { CodeBlockViewExtension } from '@blocksuite/affine/blocks/code/view'; -import { DataViewViewExtension } from '@blocksuite/affine/blocks/data-view/view'; -import { DatabaseViewExtension } from '@blocksuite/affine/blocks/database/view'; -import { DividerViewExtension } from '@blocksuite/affine/blocks/divider/view'; -import { EdgelessTextViewExtension } from '@blocksuite/affine/blocks/edgeless-text/view'; -import { EmbedViewExtension } from '@blocksuite/affine/blocks/embed/view'; -import { FrameViewExtension } from '@blocksuite/affine/blocks/frame/view'; -import { ImageViewExtension } from '@blocksuite/affine/blocks/image/view'; -import { LatexViewExtension } from '@blocksuite/affine/blocks/latex/view'; -import { ListViewExtension } from '@blocksuite/affine/blocks/list/view'; -import { NoteViewExtension } from '@blocksuite/affine/blocks/note/view'; -import { ParagraphViewExtension } from '@blocksuite/affine/blocks/paragraph/view'; -import { ViewExtensionManager } from '@blocksuite/affine/ext-loader'; - -export function createViewManager() { - const manager = new ViewExtensionManager([ - AttachmentViewExtension, - BookmarkViewExtension, - CalloutViewExtension, - CodeBlockViewExtension, - DataViewViewExtension, - DatabaseViewExtension, - DividerViewExtension, - EdgelessTextViewExtension, - EmbedViewExtension, - FrameViewExtension, - ImageViewExtension, - LatexViewExtension, - ListViewExtension, - NoteViewExtension, - ParagraphViewExtension, - ]); - - return manager; -}