refactor(editor): reduce dependency to doc collection (#9492)

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

@@ -57,12 +57,12 @@ import {
 import {
   type BlockSnapshot,
   BlockSnapshotSchema,
-  DocCollection,
   fromJSON,
   Job,
   type SliceSnapshot,
 } from '@blocksuite/store';
 import DOMPurify from 'dompurify';
+import * as Y from 'yjs';
 
 import { ExportManager } from '../../../_common/export-manager/export-manager.js';
 import { getRootByEditorHost } from '../../../_common/utils/query.js';
@@ -522,7 +522,7 @@ export class EdgelessClipboardController extends PageClipboard {
     newXYWH: SerializedXYWH
   ) {
     if (clipboardData.type === GROUP) {
-      const yMap = new DocCollection.Y.Map();
+      const yMap = new Y.Map();
       const children = clipboardData.children ?? {};
 
       for (const [key, value] of Object.entries(children)) {
@@ -536,7 +536,7 @@ export class EdgelessClipboardController extends PageClipboard {
       clipboardData.children = yMap;
       clipboardData.xywh = newXYWH;
     } else if (clipboardData.type === MINDMAP) {
-      const yMap = new DocCollection.Y.Map();
+      const yMap = new Y.Map();
       const children = clipboardData.children ?? {};
 
       for (const [oldKey, oldValue] of Object.entries(children)) {
@@ -1112,7 +1112,7 @@ export class EdgelessClipboardController extends PageClipboard {
       TextUtils.splitIntoLines(content).forEach((line, idx) => {
         this.crud.addBlock(
           'affine:paragraph',
-          { text: new DocCollection.Y.Text(line) },
+          { text: new Y.Text(line) },
           noteId,
           idx
         );

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

@@ -40,13 +40,13 @@ import {
   Vec,
   WithDisposable,
 } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
 import { consume } from '@lit/context';
 import { baseTheme } from '@toeverything/theme';
 import { css, html, LitElement, nothing, unsafeCSS } from 'lit';
 import { property } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
 import { styleMap } from 'lit/directives/style-map.js';
+import * as Y from 'yjs';
 
 import type { EdgelessRootBlockComponent } from '../../edgeless-root-block.js';
 import {
@@ -157,7 +157,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
     const id = this.crud.addBlock(
       'affine:frame',
       {
-        title: new DocCollection.Y.Text(`Frame ${frameIndex}`),
+        title: new Y.Text(`Frame ${frameIndex}`),
         xywh: serializeXYWH(...xywh),
         presentationIndex: frameMgr.generatePresentationIndex(),
       },
@@ -275,7 +275,7 @@ export class EdgelessAutoCompletePanel extends WithDisposable(LitElement) {
     } else {
       const textId = this.crud.addElement(CanvasElementType.TEXT, {
         xywh: bound.serialize(),
-        text: new DocCollection.Y.Text(),
+        text: new Y.Text(),
         textAlign: 'left',
         fontSize: 24,
         fontFamily: FontFamily.Inter,

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

@@ -18,7 +18,7 @@ import type { GfxController, GfxModel } from '@blocksuite/block-std/gfx';
 import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
 import type { XYWH } from '@blocksuite/global/utils';
 import { assertType, Bound } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
+import * as Y from 'yjs';
 
 import type { EdgelessRootBlockComponent } from '../../edgeless-root-block.js';
 import { type Shape, ShapeFactory } from '../../utils/tool-overlay.js';
@@ -284,7 +284,7 @@ export function createEdgelessElement(
   if (isShape(current)) {
     id = crud.addElement(current.type, {
       ...current.serialize(),
-      text: new DocCollection.Y.Text(),
+      text: new Y.Text(),
       xywh: bound.serialize(),
     });
     if (!id) return null;
@@ -340,7 +340,7 @@ export function createShapeElement(
   const id = crud.addElement('shape', {
     shapeType: getShapeType(targetType),
     radius: getShapeRadius(targetType),
-    text: new DocCollection.Y.Text(),
+    text: new Y.Text(),
   });
   if (!id) return null;
   const element = crud.getElementById(id);

blocksuite/blocks/src/root-block/edgeless/components/text/edgeless-connector-label-editor.ts

@@ -16,10 +16,10 @@ import {
   Vec,
   WithDisposable,
 } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
 import { css, html, nothing } from 'lit';
 import { property, query } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
+import * as Y from 'yjs';
 
 import type { EdgelessRootBlockComponent } from '../../edgeless-root-block.js';
 
@@ -187,7 +187,7 @@ export class EdgelessConnectorLabelEditor extends WithDisposable(
             } else if (len < text.length) {
               this.crud.updateElement(connector.id, {
                 // @TODO: trim in Y.Text?
-                text: new DocCollection.Y.Text(trimed),
+                text: new Y.Text(trimed),
               });
             }
           }

blocksuite/blocks/src/root-block/edgeless/components/text/edgeless-shape-text-editor.ts

@@ -18,10 +18,10 @@ import {
   Vec,
   WithDisposable,
 } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
 import { html, nothing } from 'lit';
 import { property, query } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
+import * as Y from 'yjs';
 
 import type { EdgelessRootBlockComponent } from '../../edgeless-root-block.js';
 
@@ -110,7 +110,7 @@ export class EdgelessShapeTextEditor extends WithDisposable(ShadowlessElement) {
       if (len === 0) {
         this.element.text = undefined;
       } else if (len < text.length) {
-        this.element.text = new DocCollection.Y.Text(trimed);
+        this.element.text = new Y.Text(trimed);
       }
     }
 

blocksuite/blocks/src/root-block/edgeless/components/toolbar/mindmap/basket-elements.ts

@@ -2,8 +2,8 @@ import { CanvasElementType } from '@blocksuite/affine-block-surface';
 import { type MindmapStyle, TextElementModel } from '@blocksuite/affine-model';
 import { TelemetryProvider } from '@blocksuite/affine-shared/services';
 import { assertInstanceOf, Bound } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
 import type { TemplateResult } from 'lit';
+import * as Y from 'yjs';
 
 import type { EdgelessRootBlockComponent } from '../../../edgeless-root-block.js';
 import type { EdgelessRootService } from '../../../edgeless-root-service.js';
@@ -114,7 +114,7 @@ export const textRender: DraggableTool['render'] = (
   } else {
     id = service.crud.addElement(CanvasElementType.TEXT, {
       xywh: new Bound(bound.x, vCenter - h / 2, w, h).serialize(),
-      text: new DocCollection.Y.Text(),
+      text: new Y.Text(),
     }) as string;
 
     edgeless.doc.captureSync();

blocksuite/blocks/src/root-block/edgeless/frame-manager.ts

@@ -20,7 +20,8 @@ import {
   type SerializedXYWH,
 } from '@blocksuite/global/utils';
 import type { Doc } from '@blocksuite/store';
-import { DocCollection, Text } from '@blocksuite/store';
+import { Text } from '@blocksuite/store';
+import * as Y from 'yjs';
 
 import type { FrameBlockModel, NoteBlockModel } from '../../index.js';
 import { areSetsEqual } from './utils/misc.js';
@@ -196,9 +197,7 @@ export class EdgelessFrameManager extends GfxExtension {
     const id = this.gfx.doc.addBlock(
       'affine:frame',
       {
-        title: new Text(
-          new DocCollection.Y.Text(`Frame ${this.frames.length + 1}`)
-        ),
+        title: new Text(new Y.Text(`Frame ${this.frames.length + 1}`)),
         xywh: bound.serialize(),
         index: this.gfx.layer.generateIndex(true),
         presentationIndex: this.generatePresentationIndex(),

blocksuite/blocks/src/root-block/edgeless/gfx-tool/frame-tool.ts

@@ -9,7 +9,8 @@ import {
 } from '@blocksuite/block-std/gfx';
 import type { IPoint, IVec } from '@blocksuite/global/utils';
 import { Bound, Vec } from '@blocksuite/global/utils';
-import { DocCollection, Text } from '@blocksuite/store';
+import { Text } from '@blocksuite/store';
+import * as Y from 'yjs';
 
 import type { EdgelessFrameManager, FrameOverlay } from '../frame-manager.js';
 
@@ -72,9 +73,7 @@ export class FrameTool extends BaseTool {
       const id = this.doc.addBlock(
         'affine:frame',
         {
-          title: new Text(
-            new DocCollection.Y.Text(`Frame ${frames.length + 1}`)
-          ),
+          title: new Text(new Y.Text(`Frame ${frames.length + 1}`)),
           xywh: Bound.fromPoints([this._startPoint, currentPoint]).serialize(),
           index: this.gfx.layer.generateIndex(true),
           presentationIndex: this.frameManager.generatePresentationIndex(),

blocksuite/blocks/src/root-block/edgeless/gfx-tool/text-tool.ts

@@ -3,7 +3,7 @@ import { TelemetryProvider } from '@blocksuite/affine-shared/services';
 import type { PointerEventState } from '@blocksuite/block-std';
 import { BaseTool, type GfxController } from '@blocksuite/block-std/gfx';
 import { Bound } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
+import * as Y from 'yjs';
 
 import type { EdgelessRootBlockComponent } from '../edgeless-root-block.js';
 import { mountTextElementEditor } from '../utils/text.js';
@@ -22,7 +22,7 @@ export function addText(gfx: GfxController, event: PointerEventState) {
     const id = gfx.surface.addElement({
       type: 'text',
       xywh: new Bound(modelX, modelY, 32, 32).serialize(),
-      text: new DocCollection.Y.Text(),
+      text: new Y.Text(),
     });
     gfx.doc.captureSync();
     const textElement = gfx.getElementById(id) as TextElementModel;

blocksuite/blocks/src/root-block/edgeless/services/template.ts

@@ -17,9 +17,8 @@ import {
   DocSnapshotSchema,
   Job,
   type SnapshotNode,
-  type Y,
 } from '@blocksuite/store';
-
+import type * as Y from 'yjs';
 /**
  * Those block contains other block's id
  * should defer the loading

blocksuite/blocks/src/root-block/edgeless/utils/text.ts

@@ -14,7 +14,7 @@ import type { PointerEventState } from '@blocksuite/block-std';
 import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
 import type { IVec } from '@blocksuite/global/utils';
 import { assertInstanceOf, Bound } from '@blocksuite/global/utils';
-import { DocCollection } from '@blocksuite/store';
+import * as Y from 'yjs';
 
 import { EdgelessConnectorLabelEditor } from '../components/text/edgeless-connector-label-editor.js';
 import { EdgelessFrameTitleEditor } from '../components/text/edgeless-frame-title-editor.js';
@@ -73,7 +73,7 @@ export function mountShapeTextEditor(
   }
 
   if (!shapeElement.text) {
-    const text = new DocCollection.Y.Text();
+    const text = new Y.Text();
     edgeless.std
       .get(EdgelessCRUDIdentifier)
       .updateElement(shapeElement.id, { text });
@@ -167,7 +167,7 @@ export function addText(
       .get(EdgelessCRUDIdentifier)
       .addElement(CanvasElementType.TEXT, {
         xywh: new Bound(modelX, modelY, 32, 32).serialize(),
-        text: new DocCollection.Y.Text(),
+        text: new Y.Text(),
       });
     if (!id) return;
     edgeless.doc.captureSync();
@@ -192,7 +192,7 @@ export function mountConnectorLabelEditor(
   }
 
   if (!connector.text) {
-    const text = new DocCollection.Y.Text();
+    const text = new Y.Text();
     const labelOffset = connector.labelOffset;
     let labelXYWH = connector.labelXYWH ?? [0, 0, 16, 16];
 

blocksuite/blocks/src/root-block/widgets/embed-card-toolbar/embed-card-toolbar.ts

@@ -53,7 +53,7 @@ import {
 } from '@blocksuite/affine-shared/services';
 import { getHostName, referenceToNode } from '@blocksuite/affine-shared/utils';
 import { type BlockStdScope, WidgetComponent } from '@blocksuite/block-std';
-import { type BlockModel, DocCollection } from '@blocksuite/store';
+import { type BlockModel } from '@blocksuite/store';
 import { autoUpdate, computePosition, flip, offset } from '@floating-ui/dom';
 import { html, nothing, type TemplateResult } from 'lit';
 import { query, state } from 'lit/decorators.js';
@@ -61,6 +61,7 @@ import { classMap } from 'lit/directives/class-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { join } from 'lit/directives/join.js';
 import { repeat } from 'lit/directives/repeat.js';
+import * as Y from 'yjs';
 
 import {
   isBookmarkBlock,
@@ -614,7 +615,7 @@ export class EmbedCardToolbar extends WidgetComponent<
     const parent = doc.getParent(targetModel);
     const index = parent?.children.indexOf(targetModel);
 
-    const yText = new DocCollection.Y.Text();
+    const yText = new Y.Text();
     const insert = title || caption || url;
     yText.insert(0, insert);
     yText.format(0, insert.length, { link: url });