feat: bump blocksuite (#7603)

## Features
- toeverything/blocksuite#7717 @L-Sun
- toeverything/blocksuite#7691 @L-Sun

## Bugfix
- toeverything/blocksuite#7720 @akumatus
- toeverything/blocksuite#7719 @doouding

## Refactor
- toeverything/blocksuite#7703 @donteatfriedrice
- toeverything/blocksuite#7694 @doouding
- toeverything/blocksuite#7700 @L-Sun
- toeverything/blocksuite#7716 @doodlewind

## Misc

packages/common/env/package.json

@@ -3,8 +3,8 @@
   "private": true,
   "type": "module",
   "devDependencies": {
-    "@blocksuite/global": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/store": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/global": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/store": "0.16.0-canary-202407250137-267cd23",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "vitest": "1.6.0"

packages/common/infra/package.json

@@ -14,10 +14,10 @@
     "@affine/debug": "workspace:*",
     "@affine/env": "workspace:*",
     "@affine/templates": "workspace:*",
-    "@blocksuite/blocks": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/global": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/presets": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/store": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/blocks": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/global": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/presets": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/store": "0.16.0-canary-202407250137-267cd23",
     "@datastructures-js/binary-search-tree": "^5.3.2",
     "foxact": "^0.2.33",
     "fuse.js": "^7.0.0",
@@ -34,8 +34,8 @@
   "devDependencies": {
     "@affine-test/fixtures": "workspace:*",
     "@affine/templates": "workspace:*",
-    "@blocksuite/block-std": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/presets": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/block-std": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/presets": "0.16.0-canary-202407250137-267cd23",
     "@testing-library/react": "^16.0.0",
     "async-call-rpc": "^6.4.0",
     "fake-indexeddb": "^6.0.0",

packages/frontend/component/package.json

@@ -78,12 +78,12 @@
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@blocksuite/block-std": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/blocks": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/global": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/block-std": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/blocks": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/global": "0.16.0-canary-202407250137-267cd23",
     "@blocksuite/icons": "2.1.59",
-    "@blocksuite/presets": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/store": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/presets": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/store": "0.16.0-canary-202407250137-267cd23",
     "@storybook/addon-actions": "^7.6.17",
     "@storybook/addon-essentials": "^7.6.17",
     "@storybook/addon-interactions": "^7.6.17",

packages/frontend/core/package.json

@@ -19,13 +19,13 @@
     "@affine/graphql": "workspace:*",
     "@affine/i18n": "workspace:*",
     "@affine/templates": "workspace:*",
-    "@blocksuite/block-std": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/blocks": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/global": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/block-std": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/blocks": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/global": "0.16.0-canary-202407250137-267cd23",
     "@blocksuite/icons": "2.1.59",
-    "@blocksuite/inline": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/presets": "0.16.0-canary-202407230727-128fc57",
-    "@blocksuite/store": "0.16.0-canary-202407230727-128fc57",
+    "@blocksuite/inline": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/presets": "0.16.0-canary-202407250137-267cd23",
+    "@blocksuite/store": "0.16.0-canary-202407250137-267cd23",
     "@dnd-kit/core": "^6.1.0",
     "@dnd-kit/modifiers": "^7.0.0",
     "@dnd-kit/sortable": "^8.0.0",

packages/frontend/core/src/blocksuite/presets/ai/actions/edgeless-handler.ts

@@ -63,7 +63,7 @@ function actionToRenderer<T extends keyof BlockSuitePresets.AIActions>(
   if (id === 'brainstormMindmap') {
     const selectedElements = ctx.get()[
       'selectedElements'
-    ] as BlockSuite.EdgelessModelType[];
+    ] as BlockSuite.EdgelessModel[];
 
     if (
       isMindMapRoot(selectedElements[0] || isMindmapChild(selectedElements[0]))
@@ -123,7 +123,7 @@ async function getContentFromHubBlockModel(
 
 export async function getContentFromSelected(
   host: EditorHost,
-  selected: BlockSuite.EdgelessModelType[]
+  selected: BlockSuite.EdgelessModel[]
 ) {
   type RemoveUndefinedKey<T, K extends keyof T> = T & {
     [P in K]-?: Exclude<T[P], undefined>;

packages/frontend/core/src/blocksuite/presets/ai/actions/edgeless-response.ts

@@ -317,7 +317,7 @@ export const responses: {
 
     const elements = ctx.get()[
       'selectedElements'
-    ] as BlockSuite.EdgelessModelType[];
+    ] as BlockSuite.EdgelessModel[];
     const data = ctx.get() as {
       node: MindMapNode;
     };
@@ -371,7 +371,7 @@ export const responses: {
     ) as SurfaceBlockModel[];
     const elements = ctx.get()[
       'selectedElements'
-    ] as BlockSuite.EdgelessModelType[];
+    ] as BlockSuite.EdgelessModel[];
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const data = ctx.get() as any;
     let newGenerated = true;

packages/frontend/core/src/blocksuite/presets/ai/actions/types.ts

@@ -70,7 +70,7 @@ declare global {
 
       // internal context
       host: EditorHost;
-      models?: (BlockModel | BlockSuite.SurfaceElementModelType)[];
+      models?: (BlockModel | BlockSuite.SurfaceElementModel)[];
       control: TrackerControl;
       where: TrackerWhere;
     }

packages/frontend/core/src/blocksuite/presets/ai/entries/slash-menu/setup-slash-menu.ts

@@ -30,27 +30,27 @@ export function setupSlashMenuEntry(slashMenu: AffineSlashMenuWidget) {
 
   const showWhenWrapper =
     (item?: AIItemConfig) =>
-    ({ rootElement }: AffineSlashMenuContext) => {
-      const affineAIPanelWidget = rootElement.host.view.getWidget(
+    ({ rootComponent }: AffineSlashMenuContext) => {
+      const affineAIPanelWidget = rootComponent.host.view.getWidget(
         AFFINE_AI_PANEL_WIDGET,
-        rootElement.model.id
+        rootComponent.model.id
       );
       if (affineAIPanelWidget === null) return false;
 
-      const chain = rootElement.host.command.chain();
-      const editorMode = rootElement.service.docModeService.getMode(
-        rootElement.doc.id
+      const chain = rootComponent.host.command.chain();
+      const editorMode = rootComponent.service.docModeService.getMode(
+        rootComponent.doc.id
       );
 
-      return item?.showWhen?.(chain, editorMode, rootElement.host) ?? true;
+      return item?.showWhen?.(chain, editorMode, rootComponent.host) ?? true;
     };
 
   const actionItemWrapper = (
     item: AIItemConfig
   ): AffineSlashMenuActionItem => ({
     ...basicItemConfig(item),
-    action: ({ rootElement }: AffineSlashMenuContext) => {
-      item?.handler?.(rootElement.host);
+    action: ({ rootComponent }: AffineSlashMenuContext) => {
+      item?.handler?.(rootComponent.host);
     },
   });
 
@@ -61,7 +61,7 @@ export function setupSlashMenuEntry(slashMenu: AffineSlashMenuWidget) {
       subMenu: item.subItem.map<AffineSlashMenuActionItem>(
         ({ type, handler }) => ({
           name: type,
-          action: ({ rootElement }) => handler?.(rootElement.host),
+          action: ({ rootComponent }) => handler?.(rootComponent.host),
         })
       ),
     };
@@ -81,11 +81,11 @@ export function setupSlashMenuEntry(slashMenu: AffineSlashMenuWidget) {
     name: 'Ask AI',
     icon: AIStarIcon,
     showWhen: showWhenWrapper(),
-    action: ({ rootElement }) => {
-      const view = rootElement.host.view;
+    action: ({ rootComponent }) => {
+      const view = rootComponent.host.view;
       const affineAIPanelWidget = view.getWidget(
         AFFINE_AI_PANEL_WIDGET,
-        rootElement.model.id
+        rootComponent.model.id
       ) as AffineAIPanelWidget;
       assertExists(affineAIPanelWidget);
       assertExists(AIProvider.actions.chat);

packages/frontend/core/src/blocksuite/presets/ai/utils/edgeless.ts

@@ -29,13 +29,13 @@ export function mindMapToMarkdown(mindmap: MindmapElementModel) {
   return markdownStr;
 }
 
-export function isMindMapRoot(ele: BlockSuite.EdgelessModelType) {
+export function isMindMapRoot(ele: BlockSuite.EdgelessModel) {
   const group = ele?.group;
 
   return group instanceof MindmapElementModel && group.tree.element === ele;
 }
 
-export function isMindmapChild(ele: BlockSuite.EdgelessModelType) {
+export function isMindmapChild(ele: BlockSuite.EdgelessModel) {
   return ele?.group instanceof MindmapElementModel && !isMindMapRoot(ele);
 }
 

packages/frontend/core/src/blocksuite/presets/ai/utils/selection-utils.ts

@@ -271,7 +271,7 @@ export const getSelectedNoteAnchor = (host: EditorHost, id: string) => {
 
 export function getCopilotSelectedElems(
   host: EditorHost
-): BlockSuite.EdgelessModelType[] {
+): BlockSuite.EdgelessModel[] {
   const service = getService(host);
   const copilotWidget = getEdgelessCopilotWidget(host);
 

packages/frontend/core/src/bootstrap/preload.ts

@@ -1,5 +1,4 @@
 import '@affine/env/constant';
-import './register-blocksuite-components';
 import './edgeless-template';
 
 import { setupGlobal } from '@affine/env/global';

packages/frontend/core/src/components/blocksuite/block-suite-editor/ai/tracker.ts

@@ -4,7 +4,7 @@ import type { EditorHost } from '@blocksuite/block-std';
 import type { BlockModel } from '@blocksuite/store';
 import { lowerCase, omit } from 'lodash-es';
 
-type ElementModel = BlockSuite.SurfaceElementModelType;
+type ElementModel = BlockSuite.SurfaceElementModel;
 
 type AIActionEventName =
   | 'AI action invoked'

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx

@@ -20,7 +20,7 @@ import {
 } from '@affine/core/modules/quicksearch';
 import { mixpanel } from '@affine/core/utils';
 import { DebugLogger } from '@affine/debug';
-import type { BlockSpec, WidgetElement } from '@blocksuite/block-std';
+import type { BlockSpec, WidgetComponent } from '@blocksuite/block-std';
 import {
   type AffineReference,
   AffineSlashMenuWidget,
@@ -53,7 +53,7 @@ function patchSpecService<Spec extends BlockSpec>(
       ? BlockService
       : never
   ) => (() => void) | void,
-  onWidgetConnected?: (component: WidgetElement) => void
+  onWidgetConnected?: (component: WidgetComponent) => void
 ) {
   const oldSetup = spec.setup;
   spec.setup = (slots, disposableGroup) => {
@@ -435,19 +435,20 @@ export function patchQuickSearchService(
         },
       };
     },
-    (component: WidgetElement) => {
+    (component: WidgetComponent) => {
       if (component instanceof AffineSlashMenuWidget) {
         component.config.items.forEach(item => {
           if (
             'action' in item &&
             (item.name === 'Linked Doc' || item.name === 'Link')
           ) {
             const oldAction = item.action;
-            item.action = async ({ model, rootElement }) => {
-              const { host, service, std } = rootElement;
+            item.action = async ({ model, rootComponent }) => {
+              const { host, service, std } = rootComponent;
               const { quickSearchService } = service;
 
-              if (!quickSearchService) return oldAction({ model, rootElement });
+              if (!quickSearchService)
+                return oldAction({ model, rootComponent });
 
               const result = await quickSearchService.searchDoc({});
               if (result === null) return;
@@ -463,7 +464,7 @@ export function patchQuickSearchService(
                   },
                 ]);
                 const isEdgeless =
-                  rootElement instanceof EdgelessRootBlockComponent;
+                  rootComponent instanceof EdgelessRootBlockComponent;
                 if (result.isNewDoc) {
                   mixpanel.track('DocCreated', {
                     control: 'linked doc',

packages/frontend/core/src/components/page-detail-editor.tsx

@@ -80,7 +80,7 @@ const PageDetailEditorMain = memo(function PageDetailEditorMain({
       if (onLoad) {
         // Invoke onLoad once the editor has been mounted to the DOM.
         editor.updateComplete
-          .then(() => editor.host.updateComplete)
+          .then(() => editor.host?.updateComplete)
           .then(() => {
             disposableGroup.add(onLoad(page, editor));
           })

packages/frontend/core/src/hooks/use-register-workspace-commands.ts

@@ -24,7 +24,7 @@ import { useNavigateHelper } from './use-navigate-helper';
 function hasLinkPopover(editor: AffineEditorContainer | null) {
   const textSelection = editor?.host?.std.selection.find('text');
   if (editor && textSelection && textSelection.from.length > 0) {
-    const formatBar = editor.host.querySelector('affine-format-bar-widget');
+    const formatBar = editor.host?.querySelector('affine-format-bar-widget');
     if (formatBar) {
       return true;
     }

packages/frontend/core/src/modules/peek-view/view/doc-preview/doc-peek-view.tsx

@@ -26,6 +26,10 @@ function fitViewport(
   xywh?: `[${number},${number},${number},${number}]`
 ) {
   try {
+    if (!editor.host) {
+      throw new Error('editor host is not ready');
+    }
+
     const rootService =
       editor.host.std.spec.getService<EdgelessRootService>('affine:page');
     rootService.viewport.onResize();
@@ -113,6 +117,10 @@ export function DocPeekPreview({
     if (editor) {
       editor.updateComplete
         .then(() => {
+          if (!editor.host) {
+            return;
+          }
+
           const rootService = editor.host.std.spec.getService('affine:page');
           // doc change event inside peek view should be handled by peek view
           disposableGroup.add(

packages/frontend/core/src/pages/workspace/detail-page/detail-page.tsx

@@ -160,7 +160,7 @@ const DetailPageImpl = memo(function DetailPageImpl() {
       const editorHost = editor.host;
 
       // provide image proxy endpoint to blocksuite
-      editorHost.std.clipboard.use(
+      editorHost?.std.clipboard.use(
         customImageProxyMiddleware(runtimeConfig.imageProxyUrl)
       );
       ImageBlockService.setImageProxyURL(runtimeConfig.imageProxyUrl);
@@ -179,22 +179,24 @@ const DetailPageImpl = memo(function DetailPageImpl() {
 
       // provide page mode and updated date to blocksuite
       const pageService =
-        editorHost.std.spec.getService<PageRootService>('affine:page');
+        editorHost?.std.spec.getService<PageRootService>('affine:page');
       const disposable = new DisposableGroup();
 
       doc.setMode(mode);
-      disposable.add(
-        pageService.slots.docLinkClicked.on(({ docId, blockId }) => {
-          return blockId
-            ? jumpToPageBlock(docCollection.id, docId, blockId)
-            : openPage(docCollection.id, docId);
-        })
-      );
-      disposable.add(
-        pageService.slots.tagClicked.on(({ tagId }) => {
-          jumpToTag(workspace.id, tagId);
-        })
-      );
+      if (pageService) {
+        disposable.add(
+          pageService.slots.docLinkClicked.on(({ docId, blockId }) => {
+            return blockId
+              ? jumpToPageBlock(docCollection.id, docId, blockId)
+              : openPage(docCollection.id, docId);
+          })
+        );
+        disposable.add(
+          pageService.slots.tagClicked.on(({ tagId }) => {
+            jumpToTag(workspace.id, tagId);
+          })
+        );
+      }
 
       setEditor(editor);