refactor(editor): rename doc to store on block components (#12173)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **Refactor**
  - Unified internal data access by replacing all references from `doc` to `store` across all components, blocks, widgets, and utilities. This affects how readonly state, block operations, and service retrieval are handled throughout the application.
- **Tests**
  - Updated all test utilities and test cases to use `store` instead of `doc` for document-related operations.
- **Chores**
  - Updated context providers and property names to reflect the change from `doc` to `store` for improved consistency and maintainability.

No user-facing features or behaviors have changed.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

blocksuite/affine/blocks/attachment/src/attachment-block.ts

@@ -79,7 +79,7 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
   };
 
   copy = () => {
-    const slice = Slice.fromModels(this.doc, [this.model]);
+    const slice = Slice.fromModels(this.store, [this.model]);
     this.std.clipboard.copySlice(slice).catch(console.error);
     toast(this.host, 'Copied to clipboard');
   };
@@ -133,9 +133,9 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
 
     this.refreshData();
 
-    if (!this.model.props.style && !this.doc.readonly) {
+    if (!this.model.props.style && !this.store.readonly) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
-        this.doc.updateBlock(this.model, {
+        this.store.updateBlock(this.model, {
           style: AttachmentBlockStyles[1],
         });
       });

blocksuite/affine/blocks/bookmark/src/bookmark-block.ts

@@ -127,7 +127,10 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc
   handleClick = (event: MouseEvent) => {
     event.stopPropagation();
 
-    if (this.model.parent?.flavour !== 'affine:surface' && !this.doc.readonly) {
+    if (
+      this.model.parent?.flavour !== 'affine:surface' &&
+      !this.store.readonly
+    ) {
       this.selectBlock();
     }
   };
@@ -184,7 +187,7 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc
     ) {
       // When the doc is readonly, and the preview data not provided
       // We should fetch the preview data and update the local link preview data
-      if (this.doc.readonly) {
+      if (this.store.readonly) {
         this._updateLocalLinkPreview();
         return;
       }

blocksuite/affine/blocks/bookmark/src/components/bookmark-card.ts

@@ -61,7 +61,7 @@ export class BookmarkCard extends SignalWatcher(
 
     const theme = this.bookmark.std.get(ThemeProvider).theme;
     const { LoadingIcon, EmbedCardBannerIcon } = getEmbedCardIcons(theme);
-    const imageProxyService = this.bookmark.doc.get(ImageProxyService);
+    const imageProxyService = this.bookmark.store.get(ImageProxyService);
 
     const titleIcon = this.loading
       ? LoadingIcon

blocksuite/affine/blocks/bookmark/src/configs/slash-menu.ts

@@ -26,7 +26,7 @@ const bookmarkSlashMenuConfig: SlashMenuConfig = {
         model.store.schema.flavourSchemaMap.has('affine:bookmark'),
       action: ({ std, model }) => {
         const { host } = std;
-        const parentModel = host.doc.getParent(model);
+        const parentModel = host.store.getParent(model);
         if (!parentModel) {
           return;
         }

blocksuite/affine/blocks/bookmark/src/utils.ts

@@ -15,7 +15,7 @@ export async function refreshBookmarkUrlData(
   try {
     bookmarkElement.loading = true;
 
-    const linkPreviewer = bookmarkElement.doc.get(LinkPreviewerService);
+    const linkPreviewer = bookmarkElement.store.get(LinkPreviewerService);
     const bookmarkUrlData = await linkPreviewer.query(
       bookmarkElement.model.props.url,
       signal
@@ -32,7 +32,7 @@ export async function refreshBookmarkUrlData(
 
     if (signal?.aborted) return;
 
-    bookmarkElement.doc.updateBlock(bookmarkElement.model, {
+    bookmarkElement.store.updateBlock(bookmarkElement.model, {
       title,
       description,
       icon,

blocksuite/affine/blocks/code/src/code-block.ts

@@ -68,7 +68,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
   }
 
   get readonly() {
-    return this.doc.readonly;
+    return this.store.readonly;
   }
 
   get langs() {
@@ -226,7 +226,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
         return;
       },
       Tab: ctx => {
-        if (this.doc.readonly) return;
+        if (this.store.readonly) return;
         const state = ctx.get('keyboardState');
         const event = state.raw;
         const inlineEditor = this.inlineEditor;
@@ -337,7 +337,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
         return;
       },
       Enter: () => {
-        this.doc.captureSync();
+        this.store.captureSync();
         return true;
       },
       'Mod-Enter': () => {
@@ -348,11 +348,16 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
         if (!inlineRange || !inlineEditor) return;
         const isEnd = model.props.text.length === inlineRange.index;
         if (!isEnd) return;
-        const parent = this.doc.getParent(model);
+        const parent = this.store.getParent(model);
         if (!parent) return;
         const index = parent.children.indexOf(model);
         if (index === -1) return;
-        const id = this.doc.addBlock('affine:paragraph', {}, parent, index + 1);
+        const id = this.store.addBlock(
+          'affine:paragraph',
+          {},
+          parent,
+          index + 1
+        );
         focusTextModel(std, id);
         return true;
       },
@@ -406,10 +411,10 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
           })}
           .yText=${this.model.props.text.yText}
           .inlineEventSource=${this.topContenteditableElement ?? nothing}
-          .undoManager=${this.doc.history}
+          .undoManager=${this.store.history}
           .attributesSchema=${this.inlineManager.getSchema()}
           .attributeRenderer=${this.inlineManager.getRenderer()}
-          .readonly=${this.doc.readonly}
+          .readonly=${this.store.readonly}
           .inlineRangeProvider=${this._inlineRangeProvider}
           .enableClipboard=${false}
           .enableUndoRedo=${false}
@@ -442,7 +447,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
   }
 
   setWrap(wrap: boolean) {
-    this.doc.updateBlock(this.model, { wrap });
+    this.store.updateBlock(this.model, { wrap });
   }
 
   @query('rich-text')

blocksuite/affine/blocks/code/src/code-toolbar/components/lang-button.ts

@@ -49,7 +49,7 @@ export class LanguageListButton extends WithDisposable(
   private _abortController?: AbortController;
 
   private readonly _clickLangBtn = () => {
-    if (this.blockComponent.doc.readonly) return;
+    if (this.blockComponent.store.readonly) return;
     if (this._abortController) {
       // Close the language list if it's already opened.
       this._abortController.abort();
@@ -71,7 +71,7 @@ export class LanguageListButton extends WithDisposable(
           sortedBundledLanguages.splice(index, 1);
           sortedBundledLanguages.unshift(item);
         }
-        this.blockComponent.doc.transact(() => {
+        this.blockComponent.store.transact(() => {
           this.blockComponent.model.props.language$.value = item.name;
         });
       },
@@ -134,10 +134,10 @@ export class LanguageListButton extends WithDisposable(
       </div>`}
       height="24px"
       @click=${this._clickLangBtn}
-      ?disabled=${this.blockComponent.doc.readonly}
+      ?disabled=${this.blockComponent.store.readonly}
     >
       <span class="lang-button-icon" slot="suffix">
-        ${!this.blockComponent.doc.readonly ? ArrowDownIcon : nothing}
+        ${!this.blockComponent.store.readonly ? ArrowDownIcon : nothing}
       </span>
     </icon-button> `;
   }

blocksuite/affine/blocks/code/src/code-toolbar/components/preview-button.ts

@@ -50,9 +50,9 @@ export class PreviewButton extends WithDisposable(SignalWatcher(LitElement)) {
   `;
 
   private readonly _toggle = (value: boolean) => {
-    if (this.blockComponent.doc.readonly) return;
+    if (this.blockComponent.store.readonly) return;
 
-    this.blockComponent.doc.updateBlock(this.blockComponent.model, {
+    this.blockComponent.store.updateBlock(this.blockComponent.model, {
       preview: value,
     });
   };

blocksuite/affine/blocks/code/src/code-toolbar/context.ts

@@ -8,7 +8,7 @@ export class CodeBlockToolbarContext extends MenuContext {
   };
 
   get doc() {
-    return this.blockComponent.doc;
+    return this.blockComponent.store;
   }
 
   get host() {

blocksuite/affine/blocks/data-view/src/configs/slash-menu.ts

@@ -26,16 +26,16 @@ export const dataViewSlashMenuConfig: SlashMenuConfig = {
 
       action: ({ model, std }) => {
         const { host } = std;
-        const parent = host.doc.getParent(model);
+        const parent = host.store.getParent(model);
         if (!parent) return;
         const index = parent.children.indexOf(model);
-        const id = host.doc.addBlock(
+        const id = host.store.addBlock(
           'affine:data-view',
           {},
-          host.doc.getParent(model),
+          host.store.getParent(model),
           index + 1
         );
-        const dataViewModel = host.doc.getBlock(id)!;
+        const dataViewModel = host.store.getBlock(id)!;
 
         const dataView = std.view.getBlock(
           dataViewModel.id

blocksuite/affine/blocks/data-view/src/data-source.ts

@@ -60,7 +60,7 @@ export class BlockQueryDataSource extends DataSourceBase {
   }
 
   get workspace() {
-    return this.host.doc.workspace;
+    return this.host.store.workspace;
   }
 
   constructor(

blocksuite/affine/blocks/data-view/src/data-view-block.ts

@@ -104,7 +104,7 @@ export class DataViewBlockComponent extends CaptionedBlockComponent<DataViewBloc
             prefix: CopyIcon,
             name: 'Copy',
             select: () => {
-              const slice = Slice.fromModels(this.doc, [this.model]);
+              const slice = Slice.fromModels(this.store, [this.model]);
               this.std.clipboard.copySlice(slice).catch(console.error);
             },
           }),
@@ -119,9 +119,9 @@ export class DataViewBlockComponent extends CaptionedBlockComponent<DataViewBloc
                 name: 'Delete Database',
                 select: () => {
                   this.model.children.slice().forEach(block => {
-                    this.doc.deleteBlock(block);
+                    this.store.deleteBlock(block);
                   });
-                  this.doc.deleteBlock(this.model);
+                  this.store.deleteBlock(this.model);
                 },
               }),
             ],
@@ -237,7 +237,7 @@ export class DataViewBlockComponent extends CaptionedBlockComponent<DataViewBloc
   }
 
   private renderDatabaseOps() {
-    if (this.doc.readonly) {
+    if (this.store.readonly) {
       return nothing;
     }
     return html` <div class="database-ops" @click="${this._clickDatabaseOps}">

blocksuite/affine/blocks/database/src/data-source.ts

@@ -568,20 +568,20 @@ export const convertToDatabase = (host: EditorHost, viewType: string) => {
   const firstModel = selectedModels?.[0];
   if (!firstModel) return;
 
-  host.doc.captureSync();
+  host.store.captureSync();
 
-  const parentModel = host.doc.getParent(firstModel);
+  const parentModel = host.store.getParent(firstModel);
   if (!parentModel) {
     return;
   }
 
-  const id = host.doc.addBlock(
+  const id = host.store.addBlock(
     'affine:database',
     {},
     parentModel,
     parentModel.children.indexOf(firstModel)
   );
-  const databaseModel = host.doc.getBlock(id)?.model as
+  const databaseModel = host.store.getBlock(id)?.model as
     | DatabaseBlockModel
     | undefined;
   if (!databaseModel) {
@@ -589,7 +589,7 @@ export const convertToDatabase = (host: EditorHost, viewType: string) => {
   }
   const datasource = new DatabaseBlockDataSource(databaseModel);
   datasource.viewManager.viewAdd(viewType);
-  host.doc.moveBlocks(selectedModels, databaseModel);
+  host.store.moveBlocks(selectedModels, databaseModel);
 
   const selectionManager = host.selection;
   selectionManager.clear();

blocksuite/affine/blocks/database/src/database-block.ts

@@ -120,7 +120,7 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
           prefix: CopyIcon(),
           name: 'Copy',
           select: () => {
-            const slice = Slice.fromModels(this.doc, [this.model]);
+            const slice = Slice.fromModels(this.store, [this.model]);
             this.std.clipboard
               .copySlice(slice)
               .then(() => {
@@ -139,9 +139,9 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
               name: 'Delete Database',
               select: () => {
                 this.model.children.slice().forEach(block => {
-                  this.doc.deleteBlock(block);
+                  this.store.deleteBlock(block);
                 });
-                this.doc.deleteBlock(this.model);
+                this.store.deleteBlock(this.model);
               },
             }),
           ],
@@ -258,18 +258,18 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
       );
       return () => {
         this.indicator.remove();
-        const model = this.doc.getBlock(id)?.model;
+        const model = this.store.getBlock(id)?.model;
         const target = result.modelState.model;
-        let parent = this.doc.getParent(target.id);
+        let parent = this.store.getParent(target.id);
         const shouldInsertIn = result.placement === 'in';
         if (shouldInsertIn) {
           parent = target;
         }
         if (model && target && parent) {
           if (shouldInsertIn) {
-            this.doc.moveBlocks([model], parent);
+            this.store.moveBlocks([model], parent);
           } else {
-            this.doc.moveBlocks(
+            this.store.moveBlocks(
               [model],
               parent,
               target,

blocksuite/affine/blocks/database/src/detail-panel/block-renderer.ts

@@ -74,7 +74,7 @@ export class BlockRenderer
   }
 
   get model() {
-    return this.host?.doc.getBlock(this.rowId)?.model;
+    return this.host?.store.getBlock(this.rowId)?.model;
   }
 
   override connectedCallback() {

blocksuite/affine/blocks/edgeless-text/src/edgeless-text-block.ts

@@ -44,7 +44,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
   `;
 
   private readonly _resizeObserver = new ResizeObserver(() => {
-    if (this.doc.readonly) {
+    if (this.store.readonly) {
       return;
     }
 
@@ -60,7 +60,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
     const rect = this._textContainer.getBoundingClientRect();
     bound.h = rect.height / this.gfx.viewport.zoom;
 
-    this.doc.updateBlock(this.model, {
+    this.store.updateBlock(this.model, {
       xywh: bound.serialize(),
     });
   }
@@ -73,7 +73,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
       EDGELESS_TEXT_BLOCK_MIN_WIDTH * this.gfx.viewport.zoom
     );
 
-    this.doc.updateBlock(this.model, {
+    this.store.updateBlock(this.model, {
       xywh: bound.serialize(),
     });
   }
@@ -169,7 +169,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
           !firstChild ||
           !matchModels(firstChild, [ListBlockModel, ParagraphBlockModel])
         ) {
-          newParagraphId = this.doc.addBlock(
+          newParagraphId = this.store.addBlock(
             'affine:paragraph',
             {},
             this.model.id,
@@ -182,7 +182,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
           !lastChild ||
           !matchModels(lastChild, [ListBlockModel, ParagraphBlockModel])
         ) {
-          newParagraphId = this.doc.addBlock(
+          newParagraphId = this.store.addBlock(
             'affine:paragraph',
             {},
             this.model.id
@@ -284,7 +284,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
           }
 
           if (this.model.children.length === 0) {
-            const blockId = this.doc.addBlock(
+            const blockId = this.store.addBlock(
               'affine:paragraph',
               { type: 'text' },
               this.model.id
@@ -339,7 +339,7 @@ export class EdgelessTextBlockComponent extends GfxBlockComponent<EdgelessTextBl
       minWidth: !hasMaxWidth ? '220px' : undefined,
     };
 
-    this.contentEditable = String(editing && !this.doc.readonly$.value);
+    this.contentEditable = String(editing && !this.store.readonly$.value);
 
     return html`
       <div

blocksuite/affine/blocks/embed-doc/src/embed-linked-doc-block/configs/slash-menu.ts

@@ -25,7 +25,7 @@ const linkedDocSlashMenuConfig: SlashMenuConfig = {
       when: ({ model }) =>
         model.store.schema.flavourSchemaMap.has('affine:embed-linked-doc'),
       action: ({ std, model }) => {
-        const newDoc = createDefaultDoc(std.host.doc.workspace);
+        const newDoc = createDefaultDoc(std.host.store.workspace);
         insertContent(std, model, REFERENCE_NODE, {
           reference: {
             type: 'LinkedPage',

blocksuite/affine/blocks/embed-doc/src/embed-linked-doc-block/embed-linked-doc-block.ts

@@ -49,7 +49,7 @@ import { styles } from './styles.js';
 import { getEmbedLinkedDocIcons } from './utils.js';
 
 @Peekable({
-  enableOn: ({ doc }: EmbedLinkedDocBlockComponent) => !doc.readonly,
+  enableOn: ({ store }: EmbedLinkedDocBlockComponent) => !store.readonly,
 })
 export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinkedDocModel> {
   static override styles = styles;
@@ -124,7 +124,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
   };
 
   private readonly _setDocUpdatedAt = () => {
-    const meta = this.doc.workspace.meta.getDocMeta(this.model.props.pageId);
+    const meta = this.store.workspace.meta.getDocMeta(this.model.props.pageId);
     if (meta) {
       const date = meta.updatedDate || meta.createDate;
       this._docUpdatedAt = new Date(date);
@@ -249,7 +249,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
   }
 
   get readonly() {
-    return this.doc.readonly;
+    return this.store.readonly;
   }
 
   get isCitation() {
@@ -504,7 +504,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
 
       this._setDocUpdatedAt();
       this.disposables.add(
-        this.doc.workspace.slots.docListUpdated.subscribe(() => {
+        this.store.workspace.slots.docListUpdated.subscribe(() => {
           this._setDocUpdatedAt();
         })
       );
@@ -563,8 +563,8 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
     if (linkedDoc && style === 'horizontalThin') {
       bound.w = EMBED_CARD_WIDTH.horizontal;
       bound.h = EMBED_CARD_HEIGHT.horizontal;
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
-        this.doc.updateBlock(this.model, {
+        this.store.updateBlock(this.model, {
           xywh: bound.serialize(),
           style: 'horizontal',
         });
@@ -572,8 +572,8 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
     } else if (!linkedDoc && style === 'horizontal') {
       bound.w = EMBED_CARD_WIDTH.horizontalThin;
       bound.h = EMBED_CARD_HEIGHT.horizontalThin;
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
-        this.doc.updateBlock(this.model, {
+        this.store.updateBlock(this.model, {
           xywh: bound.serialize(),
           style: 'horizontalThin',
         });

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

@@ -48,7 +48,7 @@ import type { EmbedSyncedDocCard } from './components/embed-synced-doc-card.js';
 import { blockStyles } from './styles.js';
 
 @Peekable({
-  enableOn: ({ doc }: EmbedSyncedDocBlockComponent) => !doc.readonly,
+  enableOn: ({ store }: EmbedSyncedDocBlockComponent) => !store.readonly,
 })
 export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSyncedDocModel> {
   static override styles = blockStyles;
@@ -348,7 +348,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
 
   open = (event?: Partial<DocLinkClickedEvent>) => {
     const pageId = this.model.props.pageId;
-    if (pageId === this.doc.id) return;
+    if (pageId === this.store.id) return;
 
     this.std
       .getOptional(RefNodeSlotsProvider)
@@ -413,7 +413,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
     let editorHost: EditorHost | null = this.host;
     while (editorHost && !this._cycle) {
       this._cycle =
-        !!editorHost && editorHost.doc.id === this.model.props.pageId;
+        !!editorHost && editorHost.store.id === this.model.props.pageId;
       editorHost = editorHost.parentElement?.closest('editor-host') ?? null;
     }
   }
@@ -482,7 +482,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
   }
 
   private _setDocUpdatedAt() {
-    const meta = this.doc.workspace.meta.getDocMeta(this.model.props.pageId);
+    const meta = this.store.workspace.meta.getDocMeta(this.model.props.pageId);
     if (meta) {
       const date = meta.updatedDate || meta.createDate;
       this._docUpdatedAt = new Date(date);
@@ -518,7 +518,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
 
     this._setDocUpdatedAt();
     this.disposables.add(
-      this.doc.workspace.slots.docListUpdated.subscribe(() => {
+      this.store.workspace.slots.docListUpdated.subscribe(() => {
         this._setDocUpdatedAt();
       })
     );

blocksuite/affine/blocks/embed/src/common/insert-embed-card.ts

@@ -46,10 +46,10 @@ export function insertEmbedCard(
   if (blockId) {
     const block = host.view.getBlock(blockId);
     if (!block) return;
-    const parent = host.doc.getParent(block.model);
+    const parent = host.store.getParent(block.model);
     if (!parent) return;
     const index = parent.children.indexOf(block.model);
-    const cardId = host.doc.addBlock(
+    const cardId = host.store.addBlock(
       flavour as never,
       props,
       parent,

blocksuite/affine/blocks/embed/src/embed-figma-block/configs/slash-menu.ts

@@ -22,7 +22,7 @@ export const embedFigmaSlashMenuConfig: SlashMenuConfig = {
       action: ({ std, model }) => {
         (async () => {
           const { host } = std;
-          const parentModel = host.doc.getParent(model);
+          const parentModel = host.store.getParent(model);
           if (!parentModel) {
             return;
           }

blocksuite/affine/blocks/embed/src/embed-figma-block/embed-figma-block.ts

@@ -49,8 +49,8 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<EmbedFigmaMode
     this._cardStyle = this.model.props.style;
 
     if (!this.model.props.title) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
-        this.doc.updateBlock(this.model, {
+        this.store.updateBlock(this.model, {
           title: 'Figma',
         });
       });

blocksuite/affine/blocks/embed/src/embed-github-block/configs/slash-menu.ts

@@ -22,7 +22,7 @@ export const embedGithubSlashMenuConfig: SlashMenuConfig = {
       action: ({ std, model }) => {
         (async () => {
           const { host } = std;
-          const parentModel = host.doc.getParent(model);
+          const parentModel = host.store.getParent(model);
           if (!parentModel) {
             return;
           }

blocksuite/affine/blocks/embed/src/embed-github-block/embed-github-block.ts

@@ -83,12 +83,12 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
       !this.model.props.repo ||
       !this.model.props.githubId
     ) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
         const url = this.model.props.url;
         const urlMatch = url.match(githubUrlRegex);
         if (urlMatch) {
           const [, owner, repo, githubType, githubId] = urlMatch;
-          this.doc.updateBlock(this.model, {
+          this.store.updateBlock(this.model, {
             owner,
             repo,
             githubType: githubType === 'issue' ? 'issue' : 'pr',
@@ -98,7 +98,7 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
       });
     }
 
-    this.doc.withoutTransact(() => {
+    this.store.withoutTransact(() => {
       if (!this.model.props.description && !this.model.props.title) {
         this.refreshData();
       } else {
@@ -132,7 +132,7 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
 
     const loading = this.loading;
     const theme = this.std.get(ThemeProvider).theme;
-    const imageProxyService = this.doc.get(ImageProxyService);
+    const imageProxyService = this.store.get(ImageProxyService);
     const { LoadingIcon, EmbedCardBannerIcon } = getEmbedCardIcons(theme);
     const titleIcon = loading ? LoadingIcon : GithubIcon;
     const statusIcon = status

blocksuite/affine/blocks/embed/src/embed-github-block/utils.ts

@@ -110,7 +110,7 @@ export async function refreshEmbedGithubUrlData(
 
     if (signal?.aborted) return;
 
-    embedGithubElement.doc.updateBlock(embedGithubElement.model, {
+    embedGithubElement.store.updateBlock(embedGithubElement.model, {
       image,
       status,
       statusReason,
@@ -144,7 +144,7 @@ export async function refreshEmbedGithubStatus(
 
   if (!githubApiData.status || signal?.aborted) return;
 
-  embedGithubElement.doc.updateBlock(embedGithubElement.model, {
+  embedGithubElement.store.updateBlock(embedGithubElement.model, {
     status: githubApiData.status,
     statusReason: githubApiData.statusReason,
     createdAt: githubApiData.createdAt,

blocksuite/affine/blocks/embed/src/embed-iframe-block/commands/insert-embed-iframe-with-url.ts

@@ -56,10 +56,10 @@ export const insertEmbedIframeWithUrlCommand: Command<
   if (selectedBlockId) {
     const block = host.view.getBlock(selectedBlockId);
     if (!block) return;
-    const parent = host.doc.getParent(block.model);
+    const parent = host.store.getParent(block.model);
     if (!parent) return;
     const index = parent.children.indexOf(block.model);
-    newBlockId = host.doc.addBlock(flavour, props, parent, index + 1);
+    newBlockId = host.store.addBlock(flavour, props, parent, index + 1);
   } else {
     // When there is no selected block and in edgeless mode
     // We should insert the embed iframe block to surface

blocksuite/affine/blocks/embed/src/embed-iframe-block/embed-iframe-block.ts

@@ -177,7 +177,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
 
       // update model
       const iframeUrl = this._getIframeUrl(embedData) ?? currentIframeUrl;
-      this.doc.updateBlock(this.model, {
+      this.store.updateBlock(this.model, {
         iframeUrl,
         title: embedData?.title || previewData?.title,
         description: embedData?.description || previewData?.description,
@@ -373,7 +373,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
 
     // if the iframe url is not set, refresh the data to get the iframe url
     if (!this.model.props.iframeUrl) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
         this.refreshData().catch(console.error);
       });
     } else {
@@ -452,7 +452,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
   };
 
   get readonly() {
-    return this.doc.readonly;
+    return this.store.readonly;
   }
 
   get selectionManager() {

blocksuite/affine/blocks/embed/src/embed-loom-block/configs/slash-menu.ts

@@ -22,7 +22,7 @@ export const embedLoomSlashMenuConfig: SlashMenuConfig = {
       action: ({ std, model }) => {
         (async () => {
           const { host } = std;
-          const parentModel = host.doc.getParent(model);
+          const parentModel = host.store.getParent(model);
           if (!parentModel) {
             return;
           }

blocksuite/affine/blocks/embed/src/embed-loom-block/embed-loom-block.ts

@@ -60,12 +60,12 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
     this._cardStyle = this.model.props.style;
 
     if (!this.model.props.videoId) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
         const url = this.model.props.url;
         const urlMatch = url.match(loomUrlRegex);
         if (urlMatch) {
           const [, videoId] = urlMatch;
-          this.doc.updateBlock(this.model, {
+          this.store.updateBlock(this.model, {
             videoId,
           });
         }
@@ -73,7 +73,7 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
     }
 
     if (!this.model.props.description && !this.model.props.title) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
         this.refreshData();
       });
     }
@@ -93,7 +93,7 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
 
     const loading = this.loading;
     const theme = this.std.get(ThemeProvider).theme;
-    const imageProxyService = this.doc.get(ImageProxyService);
+    const imageProxyService = this.store.get(ImageProxyService);
     const { LoadingIcon, EmbedCardBannerIcon } = getEmbedCardIcons(theme);
     const titleIcon = loading ? LoadingIcon : LoomIcon;
     const titleText = loading ? 'Loading...' : title;

blocksuite/affine/blocks/embed/src/embed-loom-block/utils.ts

@@ -62,7 +62,7 @@ export async function refreshEmbedLoomUrlData(
 
     if (signal?.aborted) return;
 
-    embedLoomElement.doc.updateBlock(embedLoomElement.model, {
+    embedLoomElement.store.updateBlock(embedLoomElement.model, {
       title,
       description,
       image,

blocksuite/affine/blocks/embed/src/embed-youtube-block/configs/slash-menu.ts

@@ -22,7 +22,7 @@ export const embedYoutubeSlashMenuConfig: SlashMenuConfig = {
       action: ({ std, model }) => {
         (async () => {
           const { host } = std;
-          const parentModel = host.doc.getParent(model);
+          const parentModel = host.store.getParent(model);
           if (!parentModel) {
             return;
           }

blocksuite/affine/blocks/embed/src/embed-youtube-block/embed-youtube-block.ts

@@ -63,12 +63,12 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
     this._cardStyle = this.model.props.style;
 
     if (!this.model.props.videoId) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
         const url = this.model.props.url;
         const urlMatch = url.match(youtubeUrlRegex);
         if (urlMatch) {
           const [, videoId] = urlMatch;
-          this.doc.updateBlock(this.model, {
+          this.store.updateBlock(this.model, {
             videoId,
           });
         }
@@ -76,7 +76,7 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
     }
 
     if (!this.model.props.description && !this.model.props.title) {
-      this.doc.withoutTransact(() => {
+      this.store.withoutTransact(() => {
         this.refreshData();
       });
     }
@@ -107,7 +107,7 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
 
     const loading = this.loading;
     const theme = this.std.get(ThemeProvider).theme;
-    const imageProxyService = this.doc.get(ImageProxyService);
+    const imageProxyService = this.store.get(ImageProxyService);
     const { LoadingIcon, EmbedCardBannerIcon } = getEmbedCardIcons(theme);
     const titleIcon = loading ? LoadingIcon : YoutubeIcon;
     const titleText = loading ? 'Loading...' : title;

blocksuite/affine/blocks/embed/src/embed-youtube-block/utils.ts

@@ -97,7 +97,7 @@ export async function refreshEmbedYoutubeUrlData(
 
     if (signal?.aborted) return;
 
-    embedYoutubeElement.doc.updateBlock(embedYoutubeElement.model, {
+    embedYoutubeElement.store.updateBlock(embedYoutubeElement.model, {
       image,
       title,
       description,

blocksuite/affine/blocks/frame/src/edgeless-toolbar/presentation-toolbar.ts

@@ -176,7 +176,7 @@ export class PresentationToolbar extends EdgelessToolbarToolMixin(
   private _exitPresentation() {
     // When exit presentation mode, we need to set the tool to default or pan
     // And exit fullscreen
-    if (this.edgeless.doc.readonly) {
+    if (this.edgeless.store.readonly) {
       this.setEdgelessTool(PanTool, { panning: false });
     } else {
       this.setEdgelessTool(DefaultTool);
@@ -316,7 +316,7 @@ export class PresentationToolbar extends EdgelessToolbarToolMixin(
           this.edgelessTool.toolType === PresentTool &&
           this._fullScreenMode
         ) {
-          if (this.edgeless.doc.readonly) {
+          if (this.edgeless.store.readonly) {
             this.setEdgelessTool(PanTool, { panning: false });
           } else {
             this.setEdgelessTool(DefaultTool);

blocksuite/affine/blocks/frame/src/edgeless-toolbar/quick-tool.ts

@@ -10,7 +10,7 @@ export const frameQuickTool = QuickToolExtension('frame', ({ block, gfx }) => {
       .edgeless=${block}
     ></edgeless-frame-tool-button>`,
     menu: buildFrameDenseMenu(block, gfx),
-    enable: !block.doc.readonly,
+    enable: !block.store.readonly,
     priority: 90,
   };
 });

blocksuite/affine/blocks/frame/src/frame-block.ts

@@ -13,7 +13,7 @@ export class FrameBlockComponent extends GfxBlockComponent<FrameBlockModel> {
     super.connectedCallback();
 
     this._disposables.add(
-      this.doc.slots.blockUpdated.subscribe(({ type, id }) => {
+      this.store.slots.blockUpdated.subscribe(({ type, id }) => {
         if (id === this.model.id && type === 'update') {
           this.requestUpdate();
         }

blocksuite/affine/blocks/frame/src/present/frame-order-button.ts

@@ -38,7 +38,7 @@ export class EdgelessFrameOrderButton extends WithDisposable(LitElement) {
   }
 
   protected override render() {
-    const { readonly } = this.edgeless.doc;
+    const { readonly } = this.edgeless.store;
     return html`
       <style>
         .edgeless-frame-order-button svg {

blocksuite/affine/blocks/frame/src/present/frame-order-menu.ts

@@ -193,7 +193,7 @@ export class EdgelessFrameOrderMenu extends SignalWatcher(
           this.crud.updateElement(frame.id, {
             presentationIndex: generateKeyBetweenV2(before, after),
           });
-          this.edgeless.doc.captureSync();
+          this.edgeless.store.captureSync();
 
           this.requestUpdate();
         }

blocksuite/affine/blocks/image/src/components/page-image-block.ts

@@ -65,7 +65,7 @@ export class ImageBlockPageComponent extends WithDisposable(ShadowlessElement) {
   private _isDragging = false;
 
   private get _doc() {
-    return this.block.doc;
+    return this.block.store;
   }
 
   private get _host() {
@@ -128,21 +128,21 @@ export class ImageBlockPageComponent extends WithDisposable(ShadowlessElement) {
         return true;
       },
       Delete: ctx => {
-        if (this._host.doc.readonly || !this._isSelected) return;
+        if (this._host.store.readonly || !this._isSelected) return;
 
         addParagraph(ctx);
         this._doc.deleteBlock(this._model);
         return true;
       },
       Backspace: ctx => {
-        if (this._host.doc.readonly || !this._isSelected) return;
+        if (this._host.store.readonly || !this._isSelected) return;
 
         addParagraph(ctx);
         this._doc.deleteBlock(this._model);
         return true;
       },
       Enter: ctx => {
-        if (this._host.doc.readonly || !this._isSelected) return;
+        if (this._host.store.readonly || !this._isSelected) return;
 
         addParagraph(ctx);
         return true;

blocksuite/affine/blocks/image/src/utils.ts

@@ -108,7 +108,7 @@ export async function resetImageSize(
   const xywh = bound.serialize();
   const props: Partial<ImageBlockProps> = { ...imageSize, xywh };
 
-  block.doc.updateBlock(model, props);
+  block.store.updateBlock(model, props);
 }
 
 function convertToPng(blob: Blob): Promise<Blob | null> {
@@ -193,7 +193,7 @@ export async function copyImageBlob(
 export async function turnImageIntoCardView(
   block: ImageBlockComponent | ImageEdgelessBlockComponent
 ) {
-  const doc = block.doc;
+  const doc = block.store;
   if (!doc.schema.flavourSchemaMap.has('affine:attachment')) {
     console.error('The attachment flavour is not supported!');
     return;

blocksuite/affine/blocks/latex/src/latex-block.ts

@@ -77,7 +77,7 @@ export class LatexBlockComponent extends CaptionedBlockComponent<LatexBlockModel
 
     this.disposables.addFromEvent(this, 'click', () => {
       // should not open editor or select block in readonly mode
-      if (this.doc.readonly) {
+      if (this.store.readonly) {
         return;
       }
 

blocksuite/affine/blocks/list/src/commands/convert-to-numbered-list.ts

@@ -13,12 +13,12 @@ export const convertToNumberedListCommand: Command<
 > = (ctx, next) => {
   const { std, id, order, stopCapturing = true } = ctx;
   const host = std.host as EditorHost;
-  const doc = host.doc;
+  const doc = host.store;
 
   const model = doc.getBlock(id)?.model;
   if (!model || !model.text) return;
 
-  if (stopCapturing) host.doc.captureSync();
+  if (stopCapturing) host.store.captureSync();
 
   const listConvertedId = toNumberedList(std, model, order);
 

blocksuite/affine/blocks/list/src/commands/split-list.ts

@@ -15,7 +15,7 @@ export const splitListCommand: Command<{
 }> = (ctx, next) => {
   const { blockId, inlineIndex, std } = ctx;
   const host = std.host as EditorHost;
-  const doc = host.doc;
+  const doc = host.store;
 
   const model = doc.getBlock(blockId)?.model;
   if (!model || !matchModels(model, [ListBlockModel])) {

blocksuite/affine/blocks/list/src/list-block.ts

@@ -39,22 +39,22 @@ export class ListBlockComponent extends CaptionedBlockComponent<ListBlockModel>
     e.preventDefault();
 
     if (this.model.props.type === 'toggle') {
-      if (this.doc.readonly) {
+      if (this.store.readonly) {
         this._readonlyCollapsed = !this._readonlyCollapsed;
       } else {
-        this.doc.captureSync();
+        this.store.captureSync();
-        this.doc.updateBlock(this.model, {
+        this.store.updateBlock(this.model, {
           collapsed: !this.model.props.collapsed,
         });
       }
 
       return;
     } else if (this.model.props.type === 'todo') {
-      if (this.doc.readonly) return;
+      if (this.store.readonly) return;
 
-      this.doc.captureSync();
+      this.store.captureSync();
       const checkedPropObj = { checked: !this.model.props.checked };
-      this.doc.updateBlock(this.model, checkedPropObj);
+      this.store.updateBlock(this.model, checkedPropObj);
       if (this.model.props.checked) {
         const checkEl = this.querySelector('.affine-list-block__todo-prefix');
         if (checkEl) {
@@ -120,7 +120,7 @@ export class ListBlockComponent extends CaptionedBlockComponent<ListBlockModel>
         const order = this.model.props.order$.value;
         // old numbered list has no order
         if (type === 'numbered' && !Number.isInteger(order)) {
-          correctNumberedListsOrderToPrev(this.doc, this.model, false);
+          correctNumberedListsOrderToPrev(this.store, this.model, false);
         }
         // if list is not numbered, order should be null
         if (type !== 'numbered' && order !== null) {
@@ -138,7 +138,7 @@ export class ListBlockComponent extends CaptionedBlockComponent<ListBlockModel>
 
   override renderBlock(): TemplateResult<1> {
     const { model, _onClickIcon } = this;
-    const collapsed = this.doc.readonly
+    const collapsed = this.store.readonly
       ? this._readonlyCollapsed
       : model.props.collapsed;
 
@@ -169,11 +169,11 @@ export class ListBlockComponent extends CaptionedBlockComponent<ListBlockModel>
                 <blocksuite-toggle-button
                   .collapsed=${collapsed}
                   .updateCollapsed=${(value: boolean) => {
-                    if (this.doc.readonly) {
+                    if (this.store.readonly) {
                       this._readonlyCollapsed = value;
                     } else {
-                      this.doc.captureSync();
+                      this.store.captureSync();
-                      this.doc.updateBlock(this.model, {
+                      this.store.updateBlock(this.model, {
                         collapsed: value,
                       });
                     }
@@ -185,12 +185,12 @@ export class ListBlockComponent extends CaptionedBlockComponent<ListBlockModel>
           <rich-text
             .yText=${this.model.props.text.yText}
             .inlineEventSource=${this.topContenteditableElement ?? nothing}
-            .undoManager=${this.doc.history}
+            .undoManager=${this.store.history}
             .attributeRenderer=${this.attributeRenderer}
             .attributesSchema=${this.attributesSchema}
             .markdownMatches=${this.inlineManager?.markdownMatches}
             .embedChecker=${this.embedChecker}
-            .readonly=${this.doc.readonly}
+            .readonly=${this.store.readonly}
             .inlineRangeProvider=${this._inlineRangeProvider}
             .enableClipboard=${false}
             .enableUndoRedo=${false}

blocksuite/affine/blocks/note/src/commands/block-type.ts

@@ -68,7 +68,7 @@ export const updateBlockType: Command<
 
   const blockModels = selectedBlocks.map(ele => ele.model);
 
-  const hasSameDoc = selectedBlocks.every(block => block.doc === doc);
+  const hasSameDoc = selectedBlocks.every(block => block.store === doc);
   if (!hasSameDoc) {
     // doc check
     console.error(

blocksuite/affine/blocks/note/src/components/edgeless-note-background.ts

@@ -66,7 +66,7 @@ export class EdgelessNoteBackground extends SignalWatcher(
   }
 
   get doc() {
-    return this.std.host.doc;
+    return this.std.host.store;
   }
 
   private _tryAddParagraph(x: number, y: number) {
@@ -137,7 +137,7 @@ export class EdgelessNoteBackground extends SignalWatcher(
     const y = clamp(e.y, rect.top + offsetY, rect.bottom - offsetY);
     handleNativeRangeAtPoint(x, y);
 
-    if (this.std.host.doc.readonly) return;
+    if (this.std.host.store.readonly) return;
 
     this._tryAddParagraph(x, y);
   }

blocksuite/affine/blocks/note/src/note-edgeless-block.ts

@@ -298,7 +298,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
               .note=${this.model}
             ></edgeless-page-block-title>
             <div
-              contenteditable=${String(!this.doc.readonly$.value)}
+              contenteditable=${String(!this.store.readonly$.value)}
               class="edgeless-note-page-content"
             >
               ${this.renderPageContent()}
@@ -362,7 +362,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
           }
 
           if (this.model.children.length === 0) {
-            const blockId = this.doc.addBlock(
+            const blockId = this.store.addBlock(
               'affine:paragraph',
               { type: 'text' },
               this.model.id

blocksuite/affine/blocks/paragraph/src/paragraph-block.ts

@@ -125,7 +125,7 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
     this.disposables.add(
       effect(() => {
         const composing = this._composing.value;
-        if (composing || this.doc.readonly) {
+        if (composing || this.store.readonly) {
           this._displayPlaceholder.value = false;
           return;
         }
@@ -197,7 +197,7 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
             nearestHeading &&
             nearestHeading.props.type.startsWith('h') &&
             nearestHeading.props.collapsed &&
-            !this.doc.readonly
+            !this.store.readonly
           ) {
             nearestHeading.props.collapsed = false;
           }
@@ -215,7 +215,7 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
 
   override renderBlock(): TemplateResult<1> {
     const { type$ } = this.model.props;
-    const collapsed = this.doc.readonly
+    const collapsed = this.store.readonly
       ? this._readonlyCollapsed
       : this.model.props.collapsed;
     const collapsedSiblings = this.collapsedSiblings;
@@ -278,11 +278,11 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
                 <blocksuite-toggle-button
                   .collapsed=${collapsed}
                   .updateCollapsed=${(value: boolean) => {
-                    if (this.doc.readonly) {
+                    if (this.store.readonly) {
                       this._readonlyCollapsed = value;
                     } else {
-                      this.doc.captureSync();
+                      this.store.captureSync();
-                      this.doc.updateBlock(this.model, {
+                      this.store.updateBlock(this.model, {
                         collapsed: value,
                       });
                     }
@@ -293,12 +293,12 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
           <rich-text
             .yText=${this.model.props.text.yText}
             .inlineEventSource=${this.topContenteditableElement ?? nothing}
-            .undoManager=${this.doc.history}
+            .undoManager=${this.store.history}
             .attributesSchema=${this.attributesSchema}
             .attributeRenderer=${this.attributeRenderer}
             .markdownMatches=${this.inlineManager?.markdownMatches}
             .embedChecker=${this.embedChecker}
-            .readonly=${this.doc.readonly}
+            .readonly=${this.store.readonly}
             .inlineRangeProvider=${this._inlineRangeProvider}
             .enableClipboard=${false}
             .enableUndoRedo=${false}

blocksuite/affine/blocks/root/src/edgeless/components/auto-complete/auto-complete-panel.ts

@@ -174,7 +174,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
       presentationIndex: frameMgr.generatePresentationIndex(),
     });
     const id = this.crud.addBlock('affine:frame', props, surfaceBlockModel);
-    edgeless.doc.captureSync();
+    edgeless.store.captureSync();
     const frame = this.crud.getElementById(id);
     if (!frame) return;
 
@@ -190,7 +190,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
   }
 
   private _addNote() {
-    const { doc } = this.edgeless;
+    const { store } = this.edgeless;
     const target = this._getTargetXYWH(
       DEFAULT_NOTE_WIDTH,
       DEFAULT_NOTE_OVERLAY_HEIGHT
@@ -203,13 +203,13 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
       {
         xywh: serializeXYWH(...xywh),
       },
-      doc.root?.id
+      store.root?.id
     );
-    const note = doc.getBlock(id)?.model;
+    const note = store.getBlock(id)?.model;
     if (!matchModels(note, [NoteBlockModel])) {
       return;
     }
-    doc.addBlock('affine:paragraph', { type: 'text' }, id);
+    store.addBlock('affine:paragraph', { type: 'text' }, id);
     const group = this.currentSource.group;
 
     if (group instanceof GroupElementModel) {
@@ -251,7 +251,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
       elements: [id],
       editing: true,
     });
-    edgeless.doc.captureSync();
+    edgeless.store.captureSync();
   }
 
   private _addText() {
@@ -260,7 +260,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
     const { xywh, position } = target;
     const bound = Bound.fromXYWH(xywh);
 
-    const textFlag = this.edgeless.doc
+    const textFlag = this.edgeless.store
       .get(FeatureFlagService)
       .getFlag('enable_edgeless_text');
     if (textFlag) {
@@ -287,7 +287,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
         elements: [textId],
         editing: false,
       });
-      this.edgeless.doc.captureSync();
+      this.edgeless.store.captureSync();
     } else {
       const textId = this.crud.addElement(CanvasElementType.TEXT, {
         xywh: bound.serialize(),
@@ -316,7 +316,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
         elements: [textId],
         editing: false,
       });
-      this.edgeless.doc.captureSync();
+      this.edgeless.store.captureSync();
 
       mountTextElementEditor(textElement, this.edgeless);
     }

blocksuite/affine/blocks/root/src/edgeless/components/auto-complete/edgeless-auto-complete.ts

@@ -371,7 +371,7 @@ export class EdgelessAutoComplete extends WithDisposable(LitElement) {
   }
 
   private _generateElementOnClick(type: Direction) {
-    const { doc } = this.edgeless;
+    const { store } = this.edgeless;
     const bound = this._computeNextBound(type);
     const id = createEdgelessElement(this.edgeless, this.current, bound);
     if (!id) return;
@@ -393,7 +393,7 @@ export class EdgelessAutoComplete extends WithDisposable(LitElement) {
         this.edgeless
       );
     } else {
-      const model = doc.getModelById(id);
+      const model = store.getModelById(id);
       if (!model) {
         return;
       }

blocksuite/affine/blocks/root/src/edgeless/components/auto-complete/utils.ts

@@ -288,8 +288,8 @@ export function createEdgelessElement(
     if (!id) return null;
     element = crud.getElementById(id);
   } else {
-    const { doc } = edgeless;
+    const { store } = edgeless;
-    id = doc.addBlock(
+    id = store.addBlock(
       'affine:note',
       {
         background: current.props.background,
@@ -299,7 +299,7 @@ export function createEdgelessElement(
       },
       edgeless.model.id
     );
-    const note = doc.getBlock(id)?.model;
+    const note = store.getBlock(id)?.model;
     if (!note) {
       throw new BlockSuiteError(
         ErrorCode.GfxBlockElementError,
@@ -307,10 +307,10 @@ export function createEdgelessElement(
       );
     }
     assertType<NoteBlockModel>(note);
-    doc.updateBlock(note, () => {
+    store.updateBlock(note, () => {
       note.props.edgeless.collapse = true;
     });
-    doc.addBlock('affine:paragraph', {}, note.id);
+    store.addBlock('affine:paragraph', {}, note.id);
 
     element = note;
   }

blocksuite/affine/blocks/root/src/edgeless/components/note-slicer/index.ts

@@ -152,7 +152,7 @@ export class NoteSlicer extends WidgetComponent<RootBlockModel> {
 
   private _sliceNote() {
     if (!this._anchorNote || !this._noteBlockIds.length) return;
-    const doc = this.doc;
+    const doc = this.store;
 
     const {
       index: originalIndex,
@@ -177,7 +177,7 @@ export class NoteSlicer extends WidgetComponent<RootBlockModel> {
     const sliceVerticalPos =
       this._divingLinePositions[this._activeSlicerIndex].y;
     const newY = this.gfx.viewport.toModelCoord(x, sliceVerticalPos)[1];
-    const newNoteId = this.doc.addBlock(
+    const newNoteId = this.store.addBlock(
       'affine:note',
       {
         background,
@@ -364,7 +364,7 @@ export class NoteSlicer extends WidgetComponent<RootBlockModel> {
 
   override render() {
     if (
-      this.doc.readonly ||
+      this.store.readonly ||
       this._hidden ||
       this._isResizing ||
       !this._anchorNote ||

blocksuite/affine/blocks/root/src/edgeless/components/rects/edgeless-selected-rect.ts

@@ -477,7 +477,7 @@ export class EdgelessSelectedRectWidget extends WidgetComponent<
   private readonly _onDragEnd = () => {
     this.slots.dragEnd.next();
 
-    this.doc.transact(() => {
+    this.store.transact(() => {
       this._dragEndCallback.forEach(cb => cb());
     });
 
@@ -1210,7 +1210,7 @@ export class EdgelessSelectedRectWidget extends WidgetComponent<
     this._isHeightLimit = bound.h === NOTE_MIN_HEIGHT * scale;
 
     if (bound.h > NOTE_MIN_HEIGHT * scale) {
-      this.doc.updateBlock(element, () => {
+      this.store.updateBlock(element, () => {
         element.props.edgeless.collapse = true;
         element.props.edgeless.collapsedHeight = bound.h / scale;
       });
@@ -1393,7 +1393,7 @@ export class EdgelessSelectedRectWidget extends WidgetComponent<
     }
 
     _disposables.add(
-      this.doc.slots.blockUpdated.subscribe(this._updateOnElementChange)
+      this.store.slots.blockUpdated.subscribe(this._updateOnElementChange)
     );
 
     _disposables.add(
@@ -1464,14 +1464,14 @@ export class EdgelessSelectedRectWidget extends WidgetComponent<
     const {
       block,
       gfx,
-      doc,
+      store,
       resizeMode,
       _resizeManager,
       _selectedRect,
       _updateCursor,
     } = this;
 
-    const hasResizeHandles = !selection.editing && !doc.readonly;
+    const hasResizeHandles = !selection.editing && !store.readonly;
     const inoperable = selection.inoperable;
     const hasElementLocked = elements.some(element => element.isLocked());
     const handlers = [];
@@ -1578,7 +1578,7 @@ export class EdgelessSelectedRectWidget extends WidgetComponent<
         }
       </style>
 
-      ${!doc.readonly && !inoperable && this._canAutoComplete()
+      ${!store.readonly && !inoperable && this._canAutoComplete()
         ? html`<edgeless-auto-complete
             .current=${this.selection.selectedElements[0]}
             .edgeless=${block}

blocksuite/affine/blocks/root/src/edgeless/configs/toolbar/render-linked-doc.ts

@@ -52,8 +52,8 @@ export function createLinkedDocFromEdgelessElements(
   elements: GfxModel[],
   docTitle?: string
 ) {
-  const _doc = host.doc.workspace.createDoc();
+  const _doc = host.store.workspace.createDoc();
-  const transformer = host.doc.getTransformer();
+  const transformer = host.store.getTransformer();
   const linkedDoc = _doc.getStore();
   linkedDoc.load(() => {
     const rootId = linkedDoc.addBlock('affine:page', {

blocksuite/affine/blocks/root/src/edgeless/edgeless-keyboard.ts

@@ -465,7 +465,7 @@ export class EdgelessPageKeyboardManager extends PageKeyboardManager {
           !event.metaKey
         ) {
           const elements = selection.selectedElements;
-          const doc = this.rootComponent.doc;
+          const doc = this.rootComponent.store;
 
           if (isSingleMindMapNode(elements)) {
             const target = gfx.getElementById(

blocksuite/affine/blocks/root/src/edgeless/edgeless-root-block.ts

@@ -407,7 +407,7 @@ export class EdgelessRootBlockComponent extends BlockComponent<
               elements[0].id
             ) as ShapeElementModel;
             if (target.text) {
-              this.doc.transact(() => {
+              this.store.transact(() => {
                 target.text!.delete(0, target.text!.length);
                 target.text!.insert(0, key);
               });
@@ -467,7 +467,7 @@ export class EdgelessRootBlockComponent extends BlockComponent<
     this._initPanEvent();
     this._initPinchEvent();
 
-    if (this.doc.readonly) {
+    if (this.store.readonly) {
       this.gfx.tool.setTool(PanTool, { panning: true });
     } else {
       this.gfx.tool.setTool(DefaultTool);

blocksuite/affine/blocks/root/src/edgeless/utils/crud.ts

@@ -25,10 +25,10 @@ export function deleteElements(
 
   set.forEach(element => {
     if (isNoteBlock(element)) {
-      const children = edgeless.doc.root?.children ?? [];
+      const children = edgeless.store.root?.children ?? [];
       // FIXME: should always keep at least 1 note
       if (children.length > 1) {
-        edgeless.doc.deleteBlock(element);
+        edgeless.store.deleteBlock(element);
       }
     } else {
       service.removeElement(element.id);

blocksuite/affine/blocks/root/src/keyboard/keyboard-manager.ts

@@ -74,7 +74,7 @@ export class PageKeyboardManager {
   }
 
   private get _doc() {
-    return this.rootComponent.doc;
+    return this.rootComponent.store;
   }
 
   private get _selection() {
@@ -143,7 +143,7 @@ export class PageKeyboardManager {
       return;
     }
 
-    const doc = rootComponent.host.doc;
+    const doc = rootComponent.host.store;
     const autofill = getTitleFromSelectedModels(
       selectedModels.map(toDraftModel)
     );

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

@@ -117,7 +117,7 @@ export class PageRootBlockComponent extends BlockComponent<RootBlockModel> {
       focusTextModel(this.std, firstText.id);
       return { id: firstText.id, created: false };
     } else {
-      const newFirstParagraphId = this.doc.addBlock(
+      const newFirstParagraphId = this.store.addBlock(
         'affine:paragraph',
         {},
         defaultNote,
@@ -131,7 +131,7 @@ export class PageRootBlockComponent extends BlockComponent<RootBlockModel> {
   keyboardManager: PageKeyboardManager | null = null;
 
   prependParagraphWithText = (text: Text) => {
-    const newFirstParagraphId = this.doc.addBlock(
+    const newFirstParagraphId = this.store.addBlock(
       'affine:paragraph',
       { text },
       this._getDefaultNoteBlock(),
@@ -157,16 +157,17 @@ export class PageRootBlockComponent extends BlockComponent<RootBlockModel> {
   }
 
   private _createDefaultNoteBlock() {
-    const { doc } = this;
+    const { store } = this;
 
-    const noteId = doc.addBlock('affine:note', {}, doc.root?.id);
+    const noteId = store.addBlock('affine:note', {}, store.root?.id);
-    return doc.getModelById(noteId) as NoteBlockModel;
+    return store.getModelById(noteId) as NoteBlockModel;
   }
 
   private _getDefaultNoteBlock() {
     return (
-      this.doc.root?.children.find(child => child.flavour === 'affine:note') ??
+      this.store.root?.children.find(
-      this._createDefaultNoteBlock()
+        child => child.flavour === 'affine:note'
+      ) ?? this._createDefaultNoteBlock()
     );
   }
 
@@ -230,16 +231,16 @@ export class PageRootBlockComponent extends BlockComponent<RootBlockModel> {
         );
         if (!sel) return;
         let model: BlockModel | null = null;
-        let current = this.doc.getModelById(sel.blockId);
+        let current = this.store.getModelById(sel.blockId);
         while (current && !model) {
           if (current.flavour === 'affine:note') {
             model = current;
           } else {
-            current = this.doc.getParent(current);
+            current = this.store.getParent(current);
           }
         }
         if (!model) return;
-        const prevNote = this.doc.getPrev(model);
+        const prevNote = this.store.getPrev(model);
         if (!prevNote || prevNote.flavour !== 'affine:note') {
           const isFirstText = sel.is(TextSelection) && sel.start.index === 0;
           const isBlock = sel.is(BlockSelection);
@@ -248,7 +249,7 @@ export class PageRootBlockComponent extends BlockComponent<RootBlockModel> {
           }
           return;
         }
-        const notes = this.doc.getModelsByFlavour('affine:note');
+        const notes = this.store.getModelsByFlavour('affine:note');
         const index = notes.indexOf(prevNote);
         if (index !== 0) return;
 
@@ -409,7 +410,7 @@ export class PageRootBlockComponent extends BlockComponent<RootBlockModel> {
       return !(isNote && displayOnEdgeless);
     });
 
-    this.contentEditable = String(!this.doc.readonly$.value);
+    this.contentEditable = String(!this.store.readonly$.value);
 
     return html`
       <div class="affine-page-root-block-container">${children} ${widgets}</div>

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

@@ -146,14 +146,14 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
   private _initHotkey() {
     const selection = this.host.selection;
     const addParagraph = () => {
-      if (!this.doc.getParent(this.model)) return;
+      if (!this.store.getParent(this.model)) return;
 
-      const [paragraphId] = this.doc.addSiblingBlocks(this.model, [
+      const [paragraphId] = this.store.addSiblingBlocks(this.model, [
         {
           flavour: 'affine:paragraph',
         },
       ]);
-      const model = this.doc.getModelById(paragraphId);
+      const model = this.store.getModelById(paragraphId);
       if (!model) return;
 
       requestConnectedFrame(() => {
@@ -185,7 +185,7 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
 
   private _initReferencedModel() {
     const findReferencedModel = (): [GfxModel | null, string] => {
-      if (!this.model.props.reference) return [null, this.doc.id];
+      if (!this.model.props.reference) return [null, this.store.id];
       const referenceId = this.model.props.reference;
 
       const find = (doc: Store): [GfxModel | null, string] => {
@@ -203,7 +203,7 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
       };
 
       // find current doc first
-      let result = find(this.doc);
+      let result = find(this.store);
       if (result[0]) return result;
 
       for (const doc of this.std.workspace.docs.values()) {
@@ -211,7 +211,7 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
         if (result[0]) return result;
       }
 
-      return [null, this.doc.id];
+      return [null, this.store.id];
     };
 
     const init = () => {
@@ -220,7 +220,7 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
       this._referencedModel =
         referencedModel && referencedModel.xywh ? referencedModel : null;
       // TODO(@L-Sun): clear query cache
-      const doc = this.doc.workspace.getDoc(docId);
+      const doc = this.store.workspace.getDoc(docId);
       this._previewDoc = doc?.getStore({ readonly: true }) ?? null;
     };
 
@@ -249,7 +249,7 @@ export class SurfaceRefBlockComponent extends BlockComponent<SurfaceRefBlockMode
 
     if (this._referencedModel instanceof GfxBlockElementModel) {
       this._disposables.add(
-        this.doc.slots.blockUpdated.subscribe(({ type, id }) => {
+        this.store.slots.blockUpdated.subscribe(({ type, id }) => {
           if (type === 'delete' && id === this.model.props.reference) {
             init();
           }

blocksuite/affine/blocks/surface/src/extensions/export-manager/export-manager.ts

@@ -542,7 +542,7 @@ type RootBlockComponent = BlockComponent & {
 function getRootByEditorHost(
   editorHost: EditorHost
 ): RootBlockComponent | null {
-  const model = editorHost.doc.root;
+  const model = editorHost.store.root;
   if (!model) return null;
   const root = editorHost.view.getBlock(model.id);
   return root as RootBlockComponent | null;

blocksuite/affine/components/src/block-zero-width/index.ts

@@ -17,12 +17,13 @@ export class BlockZeroWidth extends LitElement {
 
   _handleClick = (e: MouseEvent) => {
     stopPropagation(e);
-    if (this.block.doc.readonly) return;
+    if (this.block.store.readonly) return;
-    const nextBlock = this.block.doc.getNext(this.block.model);
+    const nextBlock = this.block.store.getNext(this.block.model);
     if (nextBlock?.flavour !== 'affine:paragraph') {
-      const [paragraphId] = this.block.doc.addSiblingBlocks(this.block.model, [
+      const [paragraphId] = this.block.store.addSiblingBlocks(
-        { flavour: 'affine:paragraph' },
+        this.block.model,
-      ]);
+        [{ flavour: 'affine:paragraph' }]
+      );
       const std = this.block.std;
       std.selection.setGroup('note', [
         std.selection.create(TextSelection, {

blocksuite/affine/components/src/caption/block-caption.ts

@@ -3,10 +3,10 @@ import { stopPropagation } from '@blocksuite/affine-shared/utils';
 import { WithDisposable } from '@blocksuite/global/lit';
 import type { BlockStdScope } from '@blocksuite/std';
 import {
-  docContext,
   modelContext,
   ShadowlessElement,
   stdContext,
+  storeContext,
   TextSelection,
 } from '@blocksuite/std';
 import { RANGE_SYNC_EXCLUDE_ATTR } from '@blocksuite/std/inline';
@@ -168,7 +168,7 @@ export class BlockCaptionEditor<
   @state()
   accessor display = false;
 
-  @consume({ context: docContext })
+  @consume({ context: storeContext })
   accessor doc!: Store;
 
   @query('.block-caption-editor')

blocksuite/affine/components/src/caption/captioned-block-component.ts

@@ -62,7 +62,7 @@ export class CaptionedBlockComponent<
             .selected=${this.selected$.value}
           ></affine-block-selection>`
         : null}
-      ${this.useZeroWidth && !this.doc.readonly
+      ${this.useZeroWidth && !this.store.readonly
         ? html`<block-zero-width .block=${this}></block-zero-width>`
         : nothing}
     </div>`;

blocksuite/affine/components/src/embed-card-modal/embed-card-create-modal.ts

@@ -46,7 +46,7 @@ export class EmbedCardCreateModal extends SignalWatcher(
         flavour = embedOptions.flavour;
       }
 
-      this.host.doc.addBlock(
+      this.host.store.addBlock(
         flavour as never,
         {
           url,

blocksuite/affine/components/src/toast/create.ts

@@ -18,11 +18,11 @@ export const createToastContainer = (editorHost: EditorHost) => {
   `;
   const template = html`<div class="toast-container" style="${styles}"></div>`;
   const element = htmlToElement<HTMLDivElement>(template);
-  const { std, doc } = editorHost;
+  const { std, store } = editorHost;
 
   let container = document.body;
-  if (doc.root) {
+  if (store.root) {
-    const rootComponent = std.view.getBlock(doc.root.id) as BlockComponent & {
+    const rootComponent = std.view.getBlock(store.root.id) as BlockComponent & {
       viewportElement: HTMLElement;
     };
     if (rootComponent) {

blocksuite/affine/fragments/frame-panel/src/body/frame-panel-body.ts

@@ -156,7 +156,7 @@ export class FramePanelBody extends SignalWatcher(
   };
 
   get frames() {
-    const frames = this.editorHost.doc
+    const frames = this.editorHost.store
       .getBlocksByFlavour('affine:frame')
       .map(block => block.model as FrameBlockModel);
     return frames.sort(compare);
@@ -318,7 +318,7 @@ export class FramePanelBody extends SignalWatcher(
         before = newIndex;
       });
 
-      this.editorHost.doc.captureSync();
+      this.editorHost.store.captureSync();
       this._updateFrames();
     }
   }
@@ -392,9 +392,9 @@ export class FramePanelBody extends SignalWatcher(
 
   override updated(_changedProperties: PropertyValues) {
     if (_changedProperties.has('editorHost') && this.editorHost) {
-      this._setDocDisposables(this.editorHost.doc);
+      this._setDocDisposables(this.editorHost.store);
       // after switch to edgeless mode, should update the selection
-      if (this.editorHost.doc.id === this._lastEdgelessRootId) {
+      if (this.editorHost.store.id === this._lastEdgelessRootId) {
         this._gfx.selection.set({
           elements: this._selected,
           editing: false,
@@ -402,7 +402,7 @@ export class FramePanelBody extends SignalWatcher(
       } else {
         this._selected = this._selected.length ? [] : this._selected;
       }
-      this._lastEdgelessRootId = this.editorHost.doc.id;
+      this._lastEdgelessRootId = this.editorHost.store.id;
     }
   }
 

blocksuite/affine/fragments/outline/src/body/outline-notice.ts

@@ -31,7 +31,7 @@ export class OutlineNotice extends SignalWatcher(
         }
 
         const shouldShowNotice =
-          getNotesFromDoc(this._context.editor$.value.doc, [
+          getNotesFromDoc(this._context.editor$.value.store, [
             NoteDisplayMode.DocOnly,
           ]).length > 0;
 

blocksuite/affine/fragments/outline/src/body/outline-panel-body.ts

@@ -92,7 +92,7 @@ export class OutlinePanelBody extends SignalWatcher(
   }
 
   private get doc() {
-    return this.editor.doc;
+    return this.editor.store;
   }
 
   get viewportPadding(): [number, number, number, number] {
@@ -262,14 +262,14 @@ export class OutlinePanelBody extends SignalWatcher(
 
   private _watchSelectedNotes() {
     return effect(() => {
-      const { std, doc } = this.editor;
+      const { std, store } = this.editor;
       const docModeService = this.editor.std.get(DocModeProvider);
       const mode = docModeService.getEditorMode();
       if (mode !== 'edgeless') return;
 
       const currSelectedNotes = std.selection
         .filter(SurfaceSelection)
-        .map(({ blockId }) => doc.getBlock(blockId)?.model)
+        .map(({ blockId }) => store.getBlock(blockId)?.model)
         .filter(model => {
           return !!model && matchModels(model, [NoteBlockModel]);
         });

blocksuite/affine/fragments/outline/src/mobile-outline-panel.ts

@@ -168,10 +168,10 @@ export class MobileOutlineMenu extends SignalWatcher(
   override render() {
     const docModeService = this.editor.std.get(DocModeProvider);
     const mode = docModeService.getEditorMode();
-    if (this.editor.doc.root === null || mode === 'edgeless') return nothing;
+    if (this.editor.store.root === null || mode === 'edgeless') return nothing;
 
     const headingBlocks = getHeadingBlocksFromDoc(
-      this.editor.doc,
+      this.editor.store,
       [NoteDisplayMode.DocAndEdgeless, NoteDisplayMode.DocOnly],
       true
     );
@@ -179,7 +179,7 @@ export class MobileOutlineMenu extends SignalWatcher(
     if (headingBlocks.length === 0) return nothing;
 
     const items = [
-      ...(this.editor.doc.meta?.title !== '' ? [this.editor.doc.root] : []),
+      ...(this.editor.store.meta?.title !== '' ? [this.editor.store.root] : []),
       ...headingBlocks,
     ];
 

blocksuite/affine/fragments/outline/src/outline-viewer.ts

@@ -201,7 +201,7 @@ export class OutlineViewer extends SignalWatcher(
     );
 
     this.disposables.add(
-      this.editor.doc.workspace.meta.docMetaUpdated.subscribe(() => {
+      this.editor.store.workspace.meta.docMetaUpdated.subscribe(() => {
         this.requestUpdate();
       })
     );
@@ -223,10 +223,10 @@ export class OutlineViewer extends SignalWatcher(
   override render() {
     const docModeService = this.editor.std.get(DocModeProvider);
     const mode = docModeService.getEditorMode();
-    if (this.editor.doc.root === null || mode === 'edgeless') return nothing;
+    if (this.editor.store.root === null || mode === 'edgeless') return nothing;
 
     const headingBlocks = getHeadingBlocksFromDoc(
-      this.editor.doc,
+      this.editor.store,
       [NoteDisplayMode.DocAndEdgeless, NoteDisplayMode.DocOnly],
       true
     );
@@ -234,7 +234,7 @@ export class OutlineViewer extends SignalWatcher(
     if (headingBlocks.length === 0) return nothing;
 
     const items = [
-      ...(this.editor.doc.meta?.title !== '' ? [this.editor.doc.root] : []),
+      ...(this.editor.store.meta?.title !== '' ? [this.editor.store.root] : []),
       ...headingBlocks,
     ];
 

blocksuite/affine/fragments/outline/src/utils/scroll.ts

@@ -13,7 +13,7 @@ export function scrollToBlock(host: EditorHost, blockId: string) {
   const mode = docModeService.getEditorMode();
   if (mode === 'edgeless') return;
 
-  if (host.doc.root?.id === blockId) {
+  if (host.store.root?.id === blockId) {
     const docTitle = getDocTitleByEditorHost(host);
     if (!docTitle) return;
 
@@ -60,12 +60,12 @@ export const observeActiveHeadingDuringScroll = (
     const host = getEditor();
 
     const headings = getHeadingBlocksFromDoc(
-      host.doc,
+      host.store,
       [NoteDisplayMode.DocAndEdgeless, NoteDisplayMode.DocOnly],
       true
     );
 
-    let activeHeadingId = host.doc.root?.id ?? null;
+    let activeHeadingId = host.store.root?.id ?? null;
     headings.forEach(heading => {
       if (isBlockBeforeViewportCenter(heading.id, host)) {
         activeHeadingId = heading.id;
@@ -87,7 +87,7 @@ let highlightTimeoutId: ReturnType<typeof setTimeout> | null = null;
 function highlightBlock(host: EditorHost, blockId: string) {
   const emptyClear = () => {};
 
-  if (host.doc.root?.id === blockId) return emptyClear;
+  if (host.store.root?.id === blockId) return emptyClear;
 
   const rootComponent = host.querySelector<
     HTMLElement & { viewport: Viewport }

blocksuite/affine/gfx/brush/src/toolbar/components/pen/pen-menu.ts

@@ -163,7 +163,7 @@ export class EdgelessPenMenu extends EdgelessToolbarToolMixin(
             .theme=${theme}
             .palettes=${DefaultTheme.StrokeColorShortPalettes}
             .shouldKeepColor=${true}
-            .hasTransparent=${!this.edgeless.doc
+            .hasTransparent=${!this.edgeless.store
               .get(FeatureFlagService)
               .getFlag('enable_color_picker')}
           ></edgeless-color-panel>

blocksuite/affine/gfx/connector/src/components/connector-handle.ts

@@ -9,8 +9,8 @@ import { WithDisposable } from '@blocksuite/global/lit';
 import {
   type BlockComponent,
   type BlockStdScope,
-  docContext,
   stdContext,
+  storeContext,
 } from '@blocksuite/std';
 import { GfxControllerIdentifier } from '@blocksuite/std/gfx';
 import type { Store } from '@blocksuite/store';
@@ -154,7 +154,7 @@ export class EdgelessConnectorHandle extends WithDisposable(LitElement) {
   accessor connector!: ConnectorElementModel;
 
   @consume({
-    context: docContext,
+    context: storeContext,
   })
   accessor doc!: Store;
 

blocksuite/affine/gfx/connector/src/toolbar/connector-menu.ts

@@ -137,7 +137,7 @@ export class EdgelessConnectorMenu extends EdgelessToolbarToolMixin(
             .value=${stroke}
             .theme=${this._theme$.value}
             .palettes=${DefaultTheme.StrokeColorShortPalettes}
-            .hasTransparent=${!this.edgeless.doc
+            .hasTransparent=${!this.edgeless.store
               .get(FeatureFlagService)
               .getFlag('enable_color_picker')}
             @select=${(e: ColorEvent) =>

blocksuite/affine/gfx/mindmap/src/toolbar/basket-elements.ts

@@ -115,7 +115,7 @@ export const textRender: DraggableTool['render'] = async (bound, edgeless) => {
   const w = 100;
   const h = 32;
 
-  const flag = edgeless.doc
+  const flag = edgeless.store
     .get(FeatureFlagService)
     .getFlag('enable_edgeless_text');
   let id: string;
@@ -135,7 +135,7 @@ export const textRender: DraggableTool['render'] = async (bound, edgeless) => {
       text: new Y.Text(),
     }) as string;
 
-    edgeless.doc.captureSync();
+    edgeless.store.captureSync();
     const textElement = crud.getElementById(id);
     if (!(textElement instanceof TextElementModel)) {
       console.error('Cannot mount text editor on a non-text element');

blocksuite/affine/gfx/shape/src/draggable/shape-menu.ts

@@ -194,7 +194,7 @@ export class EdgelessShapeMenu extends SignalWatcher(
             .value=${fillColor}
             .theme=${this._theme$.value}
             .palettes=${DefaultTheme.FillColorShortPalettes}
-            .hasTransparent=${!this.edgeless.doc
+            .hasTransparent=${!this.edgeless.store
               .get(FeatureFlagService)
               .getFlag('enable_color_picker')}
             @select=${(e: ColorEvent) => this._setFillColor(e.detail)}

blocksuite/affine/gfx/text/src/commands/insert-edgeless-text.ts

@@ -24,7 +24,7 @@ export const insertEdgelessTextCommand: Command<
 > = (ctx, next) => {
   const { std, x, y } = ctx;
   const host = std.host;
-  const doc = host.doc;
+  const doc = host.store;
   const surface = getSurfaceBlock(doc);
   if (!surface) {
     next();

blocksuite/affine/gfx/text/src/edgeless-text-editor.ts

@@ -83,7 +83,7 @@ export function addText(edgeless: BlockComponent, event: PointerEventState) {
       });
     if (!id) return;
 
-    edgeless.doc.captureSync();
+    edgeless.store.captureSync();
     const textElement = crud.getElementById(id);
     if (!textElement) return;
     if (textElement instanceof TextElementModel) {

blocksuite/affine/inlines/latex/src/markdown.ts

@@ -34,7 +34,7 @@ export const LatexExtension = InlineMarkdownExtension<AffineTextAttributes>({
         inlineEditor.rootElement.closest<BlockComponent>('[data-block-id]');
       if (!blockComponent) return;
 
-      const doc = blockComponent.doc;
+      const doc = blockComponent.store;
       const parentComponent = blockComponent.parentComponent;
       if (!parentComponent) return;
 

blocksuite/affine/shared/src/__tests__/commands/block-crud/get-first-block.unit.spec.ts

@@ -73,7 +73,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         flavour: 'affine:list',
@@ -93,7 +93,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         flavour: ['affine:list', 'affine:code'],
@@ -114,7 +114,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         role: 'content',
         flavour: 'affine:list',
@@ -153,7 +153,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         role: 'hub',
@@ -173,7 +173,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         role: 'hub',
@@ -193,7 +193,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         flavour: 'affine:list',
@@ -217,7 +217,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-2')?.model;
+      const note = host.store.getBlock('note-2')?.model;
 
       const [_, { firstBlock }] = host.command.exec(getFirstBlockCommand, {
         role: 'content',

blocksuite/affine/shared/src/__tests__/commands/block-crud/get-last-block.unit.spec.ts

@@ -73,7 +73,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         flavour: 'affine:list',
@@ -93,7 +93,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         flavour: ['affine:list', 'affine:code'],
@@ -114,7 +114,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         role: 'content',
         flavour: 'affine:list',
@@ -153,7 +153,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         role: 'hub',
@@ -173,7 +173,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         role: 'hub',
@@ -193,7 +193,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-1')?.model;
+      const note = host.store.getBlock('note-1')?.model;
 
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         flavour: 'affine:list',
@@ -217,7 +217,7 @@ describe('commands/block-crud', () => {
         </affine-page>
       `;
 
-      const note = host.doc.getBlock('note-2')?.model;
+      const note = host.store.getBlock('note-2')?.model;
 
       const [_, { lastBlock }] = host.command.exec(getLastBlockCommand, {
         role: 'content',

blocksuite/affine/shared/src/__tests__/helpers/affine-template.unit.spec.ts

@@ -12,17 +12,17 @@ describe('helpers/affine-template', () => {
       </affine-page>
     `;
 
-    expect(host.doc).toBeDefined();
+    expect(host.store).toBeDefined();
 
-    const pageBlock = host.doc.getBlock('page');
+    const pageBlock = host.store.getBlock('page');
     expect(pageBlock).toBeDefined();
     expect(pageBlock?.flavour).toBe('affine:page');
 
-    const noteBlock = host.doc.getBlock('note');
+    const noteBlock = host.store.getBlock('note');
     expect(noteBlock).toBeDefined();
     expect(noteBlock?.flavour).toBe('affine:note');
 
-    const paragraphBlock = host.doc.getBlock('paragraph-1');
+    const paragraphBlock = host.store.getBlock('paragraph-1');
     expect(paragraphBlock).toBeDefined();
     expect(paragraphBlock?.flavour).toBe('affine:paragraph');
   });
@@ -38,16 +38,17 @@ describe('helpers/affine-template', () => {
       </affine-page>
     `;
 
-    const noteBlocks = host.doc.getBlocksByFlavour('affine:note');
+    const noteBlocks = host.store.getBlocksByFlavour('affine:note');
-    const paragraphBlocks = host.doc.getBlocksByFlavour('affine:paragraph');
+    const paragraphBlocks = host.store.getBlocksByFlavour('affine:paragraph');
-    const listBlocks = host.doc.getBlocksByFlavour('affine:list');
+    const listBlocks = host.store.getBlocksByFlavour('affine:list');
 
     expect(noteBlocks.length).toBe(1);
     expect(paragraphBlocks.length).toBe(2);
     expect(listBlocks.length).toBe(1);
 
     const noteBlock = noteBlocks[0];
-    const noteChildren = host.doc.getBlock(noteBlock.id)?.model.children || [];
+    const noteChildren =
+      host.store.getBlock(noteBlock.id)?.model.children || [];
     expect(noteChildren.length).toBe(3);
 
     expect(noteChildren[0].flavour).toBe('affine:paragraph');
@@ -64,10 +65,10 @@ describe('helpers/affine-template', () => {
       </affine-page>
     `;
 
-    const paragraphBlocks = host.doc.getBlocksByFlavour('affine:paragraph');
+    const paragraphBlocks = host.store.getBlocksByFlavour('affine:paragraph');
     expect(paragraphBlocks.length).toBe(1);
 
-    const paragraphBlock = host.doc.getBlock(paragraphBlocks[0].id);
+    const paragraphBlock = host.store.getBlock(paragraphBlocks[0].id);
     const paragraphText = paragraphBlock?.model.text?.toString() || '';
     expect(paragraphText).toBe('');
   });

blocksuite/affine/shared/src/__tests__/helpers/create-test-host.ts

@@ -229,10 +229,10 @@ export function createTestHost(doc: Store): EditorHost {
   };
 
   const host = {
-    doc: doc,
+    store: doc,
     std: std as any,
   };
-  host.doc = doc;
+  host.store = doc;
   host.std = std as any;
 
   std.host = host;

blocksuite/affine/shared/src/commands/block-crud/get-first-content-block.ts

@@ -23,7 +23,7 @@ export const getFirstBlockCommand: Command<
     firstBlock: BlockModel | null;
   }
 > = (ctx, next) => {
-  const root = ctx.root || ctx.std.host.doc.root;
+  const root = ctx.root || ctx.std.host.store.root;
   if (!root) {
     next({
       firstBlock: null,

blocksuite/affine/shared/src/commands/block-crud/get-last-content-block.ts

@@ -23,7 +23,7 @@ export const getLastBlockCommand: Command<
     lastBlock: BlockModel | null;
   }
 > = (ctx, next) => {
-  const root = ctx.root || ctx.std.host.doc.root;
+  const root = ctx.root || ctx.std.host.store.root;
   if (!root) {
     next({
       lastBlock: null,

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

@@ -35,13 +35,13 @@ export class PreviewHelper {
         if (!selectedIds.includes(parent)) {
           ids.push({ viewType: 'bypass', id: parent });
         }
-        parent = this.widget.doc.getParent(parent)?.id ?? null;
+        parent = this.widget.store.getParent(parent)?.id ?? null;
       } while (parent && !ids.map(({ id }) => id).includes(parent));
     });
 
     // The children of the selected blocks should be rendered as Display
     const addChildren = (id: string) => {
-      const model = this.widget.doc.getBlock(id)?.model;
+      const model = this.widget.store.getBlock(id)?.model;
       if (!model) {
         return;
       }
@@ -68,7 +68,7 @@ export class PreviewHelper {
     const docModeService = std.get(DocModeProvider);
     const editorSetting = std.get(EditorSettingProvider);
     const query = this._calculateQuery(blockIds as string[]);
-    const store = widget.doc.doc.getStore({ query });
+    const store = widget.store.doc.getStore({ query });
     let previewSpec = widget.std
       .get(ViewExtensionManagerIdentifier)
       .get('preview-page');

blocksuite/affine/widgets/drag-handle/src/utils.ts

@@ -79,7 +79,7 @@ export const containChildBlock = (
       if (currentBlock.id === block.model.id) {
         return true;
       }
-      currentBlock = block.doc.getParent(currentBlock.id);
+      currentBlock = block.store.getParent(currentBlock.id);
     }
     return false;
   });

blocksuite/affine/widgets/drag-handle/src/watchers/drag-event-watcher.ts

@@ -501,7 +501,7 @@ export class DragEventWatcher {
       // can't drop edgeless content on the same doc
       if (
         dragPayload.bsEntity?.fromMode === 'gfx' &&
-        dragPayload.from?.docId === this.widget.doc.id
+        dragPayload.from?.docId === this.widget.store.id
       ) {
         return;
       }
@@ -550,7 +550,7 @@ export class DragEventWatcher {
 
     // drop on the same place, do nothing
     if (
-      (dragPayload.from?.docId === this.widget.doc.id &&
+      (dragPayload.from?.docId === this.widget.store.id &&
         result.placement === 'after' &&
         parent.children[index]?.id === snapshot.content[0].id) ||
       (result.placement === 'before' &&
@@ -566,7 +566,7 @@ export class DragEventWatcher {
     ) {
       snapshot.content = snapshot.content.filter(
         block =>
-          dragPayload.from?.docId !== this.widget.doc.id ||
+          dragPayload.from?.docId !== this.widget.store.id ||
           block.id !== parent.id
       );
       if (snapshot.content.length) {
@@ -590,7 +590,7 @@ export class DragEventWatcher {
       matchModels(parent, [NoteBlockModel])
     ) {
       // if the snapshot comes from the same doc, just create a surface-ref block
-      if (dragPayload.from?.docId === this.widget.doc.id) {
+      if (dragPayload.from?.docId === this.widget.store.id) {
         let largestElem!: {
           size: number;
           id: string;
@@ -1194,7 +1194,7 @@ export class DragEventWatcher {
         };
 
         this._rewriteSnapshotXYWH(pageSnapshot, point, true);
-        this._dropToModel(pageSnapshot, this.widget.doc.root!.id)
+        this._dropToModel(pageSnapshot, this.widget.store.root!.id)
           .then(slices => {
             slices?.content.forEach((block, idx) => {
               if (block.flavour === 'affine:embed-iframe') {
@@ -1259,7 +1259,7 @@ export class DragEventWatcher {
               DEFAULT_NOTE_HEIGHT
             ).serialize(),
           },
-          this.widget.doc.root!
+          this.widget.store.root!
         );
 
         this._dropToModel(
@@ -1508,7 +1508,7 @@ export class DragEventWatcher {
            */
           if (source.data.bsEntity?.type === 'blocks') {
             return (
-              source.data.from?.docId !== widget.doc.id ||
+              source.data.from?.docId !== widget.store.id ||
               source.data.bsEntity.modelIds.every(id => id !== view.model.id)
             );
           }

blocksuite/affine/widgets/drag-handle/src/watchers/edgeless-watcher.ts

@@ -91,7 +91,7 @@ export class EdgelessWatcher {
 
   updateAnchorElement = () => {
     if (!this.widget.isConnected) return;
-    if (this.widget.doc.readonly || this.widget.mode === 'page') {
+    if (this.widget.store.readonly || this.widget.mode === 'page') {
       this.widget.hide();
       return;
     }
@@ -100,7 +100,11 @@ export class EdgelessWatcher {
     const editing = selection.editing;
     const selectedElements = selection.selectedElements;
 
-    if (editing || selectedElements.length !== 1 || this.widget.doc.readonly) {
+    if (
+      editing ||
+      selectedElements.length !== 1 ||
+      this.widget.store.readonly
+    ) {
       this.widget.hide();
       return;
     }

blocksuite/affine/widgets/drag-handle/src/watchers/page-watcher.ts

@@ -13,7 +13,7 @@ export class PageWatcher {
     const { disposables } = this.widget;
 
     disposables.add(
-      this.widget.doc.slots.blockUpdated.subscribe(() => this.widget.hide())
+      this.widget.store.slots.blockUpdated.subscribe(() => this.widget.hide())
     );
 
     disposables.add(

blocksuite/affine/widgets/drag-handle/src/watchers/pointer-event-watcher.ts

@@ -41,7 +41,7 @@ export class PointerEventWatcher {
   }
 
   private readonly _canEditing = (noteBlock: BlockComponent) => {
-    if (noteBlock.doc.id !== this.widget.doc.id) return false;
+    if (noteBlock.store.id !== this.widget.store.id) return false;
 
     if (this.widget.mode === 'page') return true;
 
@@ -178,7 +178,7 @@ export class PointerEventWatcher {
 
     this.widget.anchorBlockId.value = blockId;
 
-    if (insideDatabaseTable(closestBlock) || this.widget.doc.readonly) {
+    if (insideDatabaseTable(closestBlock) || this.widget.store.readonly) {
       this.widget.hide();
       return;
     }
@@ -226,7 +226,7 @@ export class PointerEventWatcher {
     ctx => {
       if (this._isPointerDown) return;
       if (
-        this.widget.doc.readonly ||
+        this.widget.store.readonly ||
         this.widget.dragging ||
         !this.widget.isConnected
       ) {

blocksuite/affine/widgets/edgeless-auto-connect/src/index.ts

@@ -317,7 +317,7 @@ export class EdgelessAutoConnectWidget extends WidgetComponent<RootBlockModel> {
       })
     );
     this._disposables.add(
-      this.doc.slots.blockUpdated.subscribe(payload => {
+      this.store.slots.blockUpdated.subscribe(payload => {
         if (payload.flavour === 'affine:surface-ref') {
           switch (payload.type) {
             case 'add':
@@ -585,7 +585,7 @@ export class EdgelessAutoConnectWidget extends WidgetComponent<RootBlockModel> {
   }
 
   override render() {
-    const advancedVisibilityEnabled = this.doc
+    const advancedVisibilityEnabled = this.store
       .get(FeatureFlagService)
       .getFlag('enable_advanced_block_visibility');
 

blocksuite/affine/widgets/edgeless-toolbar/src/edgeless-toolbar.ts

@@ -660,7 +660,7 @@ export class EdgelessToolbarWidget extends WidgetComponent<RootBlockModel> {
 
   override render() {
     const type = this.edgelessTool;
-    if (this.doc.readonly && type !== 'frameNavigator') {
+    if (this.store.readonly && type !== 'frameNavigator') {
       return nothing;
     }
 

blocksuite/affine/widgets/frame-title/src/affine-frame-title-widget.ts

@@ -10,7 +10,7 @@ export const AFFINE_FRAME_TITLE_WIDGET = 'affine-frame-title-widget';
 
 export class AffineFrameTitleWidget extends WidgetComponent<RootBlockModel> {
   private get _frames() {
-    return Object.values(this.doc.blocks.value)
+    return Object.values(this.store.blocks.value)
       .map(({ model }) => model)
       .filter(model => model instanceof FrameBlockModel);
   }

blocksuite/affine/widgets/frame-title/src/edgeless-frame-title-editor.ts

@@ -120,7 +120,7 @@ export class EdgelessFrameTitleEditor extends WithDisposable(
   }
 
   override render() {
-    const rootBlockId = this.editorHost.doc.root?.id;
+    const rootBlockId = this.editorHost.store.root?.id;
     if (!rootBlockId) return nothing;
 
     const viewport = this.gfx.viewport;

blocksuite/affine/widgets/keyboard-toolbar/src/widget.ts

@@ -110,9 +110,9 @@ export class AffineKeyboardToolbarWidget extends WidgetComponent<RootBlockModel>
 
   override render() {
     if (
-      this.doc.readonly ||
+      this.store.readonly ||
       !IS_MOBILE ||
-      !this.doc
+      !this.store
         .get(FeatureFlagService)
         .getFlag('enable_mobile_keyboard_toolbar')
     )

blocksuite/affine/widgets/linked-doc/src/config.ts

@@ -78,7 +78,7 @@ export function createLinkedDocMenuGroup(
   editorHost: EditorHost,
   inlineEditor: AffineInlineEditor
 ) {
-  const doc = editorHost.doc;
+  const doc = editorHost.store;
   const { docMetas } = doc.workspace.meta;
   const filteredDocList = docMetas
     .filter(({ id }) => id !== doc.id)
@@ -122,7 +122,7 @@ export function createNewDocMenuGroup(
   editorHost: EditorHost,
   inlineEditor: AffineInlineEditor
 ): LinkedMenuGroup {
-  const doc = editorHost.doc;
+  const doc = editorHost.store;
   const docName = query || DEFAULT_DOC_NAME;
   const displayDocName =
     docName.slice(0, DISPLAY_NAME_LENGTH) +

blocksuite/affine/widgets/linked-doc/src/widget.ts

@@ -307,7 +307,7 @@ export class AffineLinkedDocWidget extends WidgetComponent<RootBlockModel> {
 
     this._updateInputRects();
 
-    const enableMobile = this.doc
+    const enableMobile = this.store
       .get(FeatureFlagService)
       .getFlag('enable_mobile_linked_doc_menu');
     this._mode$.value = enableMobile ? mode : 'desktop';

blocksuite/affine/widgets/page-dragging-area/src/utils.ts

@@ -118,7 +118,7 @@ export function getSelectingBlockPaths(
   // eslint-disable-next-line @typescript-eslint/prefer-for-of
   for (let i = 0; i < blocks.length; i++) {
     const block = blocks[i];
-    const parent = blocks[i].element.doc.getParent(block.element.model);
+    const parent = blocks[i].element.store.getParent(block.element.model);
     const parentId = parent?.id;
     if (parentId) {
       const isParentInBlocks = blocks.some(