feat(editor): add editor store (#9584)

blocksuite/affine/block-embed/src/common/render-linked-doc.ts

@@ -16,6 +16,7 @@ import {
   type DraftModel,
   type Query,
   Slice,
+  Store,
   Text,
 } from '@blocksuite/store';
 import { render, type TemplateResult } from 'lit';
@@ -197,8 +198,9 @@ async function renderNoteContent(
   };
   const previewDoc = doc.doc.getBlocks({ query });
   const previewSpec = SpecProvider.getInstance().getSpec('page:preview');
+  const store = new Store({ blocks: previewDoc });
   const previewStd = new BlockStdScope({
-    doc: previewDoc,
+    store,
     extensions: previewSpec.value,
   });
   const previewTemplate = previewStd.render();

blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-edgeless-synced-doc-block.ts

@@ -9,8 +9,9 @@ import {
   ThemeProvider,
 } from '@blocksuite/affine-shared/services';
 import { BlockSelection, BlockStdScope } from '@blocksuite/block-std';
-import { assertExists, Bound } from '@blocksuite/global/utils';
-import { html } from 'lit';
+import { Bound } from '@blocksuite/global/utils';
+import { Store } from '@blocksuite/store';
+import { html, nothing } from 'lit';
 import { choose } from 'lit/directives/choose.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { guard } from 'lit/directives/guard.js';
@@ -25,7 +26,12 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
   protected override _renderSyncedView = () => {
     const { syncedDoc, editorMode } = this;
 
-    assertExists(syncedDoc, 'Doc should exist');
+    if (!syncedDoc) {
+      console.error('Synced doc is not found');
+      return html`${nothing}`;
+    }
+
+    const store = new Store({ blocks: syncedDoc });
 
     let containerStyleMap = styleMap({
       position: 'relative',
@@ -64,7 +70,7 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
           () => html`
             <div class="affine-page-viewport" data-theme=${appTheme}>
               ${new BlockStdScope({
-                doc: syncedDoc,
+                store,
                 extensions: this._buildPreviewSpec('page:preview'),
               }).render()}
             </div>
@@ -75,7 +81,7 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
           () => html`
             <div class="affine-edgeless-viewport" data-theme=${edgelessTheme}>
               ${new BlockStdScope({
-                doc: syncedDoc,
+                store,
                 extensions: this._buildPreviewSpec('edgeless:preview'),
               }).render()}
             </div>

blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts

@@ -26,9 +26,14 @@ import {
 } from '@blocksuite/block-std';
 import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx';
 import { assertExists, Bound, getCommonBound } from '@blocksuite/global/utils';
-import { type GetBlocksOptions, type Query, Text } from '@blocksuite/store';
+import {
+  type GetBlocksOptions,
+  type Query,
+  Store,
+  Text,
+} from '@blocksuite/store';
 import { computed } from '@preact/signals-core';
-import { html, type PropertyValues } from 'lit';
+import { html, nothing, type PropertyValues } from 'lit';
 import { query, state } from 'lit/decorators.js';
 import { choose } from 'lit/directives/choose.js';
 import { classMap } from 'lit/directives/class-map.js';
@@ -146,7 +151,12 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
     const editorMode = this.editorMode;
     const isPageMode = this.isPageMode;
 
-    assertExists(syncedDoc);
+    if (!syncedDoc) {
+      console.error('Synced doc is not found');
+      return html`${nothing}`;
+    }
+
+    const store = new Store({ blocks: syncedDoc });
 
     if (isPageMode) {
       this.dataset.pageMode = '';
@@ -176,7 +186,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
           () => html`
             <div class="affine-page-viewport" data-theme=${appTheme}>
               ${new BlockStdScope({
-                doc: syncedDoc,
+                store,
                 extensions: this._buildPreviewSpec('page:preview'),
               }).render()}
             </div>
@@ -187,7 +197,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
           () => html`
             <div class="affine-edgeless-viewport" data-theme=${edgelessTheme}>
               ${new BlockStdScope({
-                doc: syncedDoc,
+                store,
                 extensions: this._buildPreviewSpec('edgeless:preview'),
               }).render()}
             </div>

blocksuite/affine/block-surface-ref/src/portal/note.ts

@@ -18,7 +18,7 @@ import {
   ShadowlessElement,
 } from '@blocksuite/block-std';
 import { deserializeXYWH, WithDisposable } from '@blocksuite/global/utils';
-import { type BlockModel, type Query } from '@blocksuite/store';
+import { type BlockModel, type Query, Store } from '@blocksuite/store';
 import { css, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
@@ -118,9 +118,10 @@ export class SurfaceRefNotePortal extends WithDisposable(ShadowlessElement) {
       query: this.query,
       readonly: true,
     });
+    const store = new Store({ blocks: doc });
     const previewSpec = SpecProvider.getInstance().getSpec('page:preview');
     return new BlockStdScope({
-      doc,
+      store,
       extensions: previewSpec.value.slice(),
     }).render();
   }

blocksuite/affine/block-surface-ref/src/surface-ref-block.ts

@@ -47,7 +47,7 @@ import {
   DisposableGroup,
   type SerializedXYWH,
 } from '@blocksuite/global/utils';
-import type { Blocks } from '@blocksuite/store';
+import { type Blocks, Store } from '@blocksuite/store';
 import { css, html, nothing, type TemplateResult } from 'lit';
 import { query, state } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
@@ -545,10 +545,15 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
     const _previewSpec = this._previewSpec.value;
 
     if (!this._viewportEditor) {
-      this._viewportEditor = new BlockStdScope({
-        doc: this._previewDoc!,
-        extensions: _previewSpec,
-      }).render();
+      if (this._previewDoc) {
+        const store = new Store({ blocks: this._previewDoc });
+        this._viewportEditor = new BlockStdScope({
+          store,
+          extensions: _previewSpec,
+        }).render();
+      } else {
+        console.error('Preview doc is not found');
+      }
     }
 
     return html`<div class="ref-content">

blocksuite/affine/widget-drag-handle/src/helpers/preview-helper.ts

@@ -5,7 +5,7 @@ import {
   type DndEventState,
 } from '@blocksuite/block-std';
 import { Point } from '@blocksuite/global/utils';
-import type { BlockViewType, Query } from '@blocksuite/store';
+import { type BlockViewType, type Query, Store } from '@blocksuite/store';
 
 import { DragPreview } from '../components/drag-preview.js';
 import type { AffineDragHandleWidget } from '../drag-handle.js';
@@ -82,8 +82,9 @@ export class PreviewHelper {
       const doc = this.widget.doc.doc.getBlocks({ query });
 
       const previewSpec = SpecProvider.getInstance().getSpec('page:preview');
+      const store = new Store({ blocks: doc });
       const previewStd = new BlockStdScope({
-        doc,
+        store,
         extensions: previewSpec.value,
       });
       const previewTemplate = previewStd.render();