fix: according to graphite-app's suggestions

feat: implement textAlign property for paragraph blocks, image blocks, list blocks, and table blocks
2026-07-03 02:30:36 +08:00 · 2025-04-29 17:32:46 +08:00 · 2025-04-29 17:32:46 +08:00
1678 changed files with 23736 additions and 45235 deletions
@@ -123,6 +123,32 @@
        }
      }
    },
+    "websocket": {
+      "type": "object",
+      "description": "Configuration for websocket module",
+      "properties": {
+        "transports": {
+          "type": "array",
+          "description": "The enabled transports for accepting websocket traffics.\n@default [\"websocket\",\"polling\"]\n@link https://docs.nestjs.com/websockets/gateways#transports",
+          "items": {
+            "type": "string",
+            "enum": [
+              "websocket",
+              "polling"
+            ]
+          },
+          "default": [
+            "websocket",
+            "polling"
+          ]
+        },
+        "maxHttpBufferSize": {
+          "type": "number",
+          "description": "How many bytes or characters a message can be, before closing the session (to avoid DoS).\n@default 100000000",
+          "default": 100000000
+        }
+      }
+    },
    "auth": {
      "type": "object",
      "description": "Configuration for auth module",
@@ -475,32 +501,6 @@
        }
      }
    },
-    "websocket": {
-      "type": "object",
-      "description": "Configuration for websocket module",
-      "properties": {
-        "transports": {
-          "type": "array",
-          "description": "The enabled transports for accepting websocket traffics.\n@default [\"websocket\",\"polling\"]\n@link https://docs.nestjs.com/websockets/gateways#transports",
-          "items": {
-            "type": "string",
-            "enum": [
-              "websocket",
-              "polling"
-            ]
-          },
-          "default": [
-            "websocket",
-            "polling"
-          ]
-        },
-        "maxHttpBufferSize": {
-          "type": "number",
-          "description": "How many bytes or characters a message can be, before closing the session (to avoid DoS).\n@default 100000000",
-          "default": 100000000
-        }
-      }
-    },
    "server": {
      "type": "object",
      "description": "Configuration for server module",
@@ -634,13 +634,6 @@
            "apiKey": ""
          }
        },
-        "providers.anthropic": {
-          "type": "object",
-          "description": "The config for the anthropic provider.\n@default {\"apiKey\":\"\"}",
-          "default": {
-            "apiKey": ""
-          }
-        },
        "unsplash": {
          "type": "object",
          "description": "The config for the unsplash key.\n@default {\"key\":\"\"}",
@@ -648,13 +641,6 @@
            "key": ""
          }
        },
-        "exa": {
-          "type": "object",
-          "description": "The config for the exa web search key.\n@default {\"key\":\"\"}",
-          "default": {
-            "key": ""
-          }
-        },
        "storage": {
          "type": "object",
          "description": "The config for the storage provider.\n@default {\"provider\":\"fs\",\"bucket\":\"copilot\",\"config\":{\"path\":\"~/.affine/storage\"}}",
@@ -136,8 +136,6 @@ jobs:
          extra-flags: workspaces focus @affine/server-native
      - name: Build Rust
        uses: ./.github/actions/build-rust
-        env:
-          AFFINE_PRO_PUBLIC_KEY: ${{ secrets.AFFINE_PRO_PUBLIC_KEY }}
        with:
          target: ${{ matrix.targets.name }}
          package: '@affine/server-native'
@@ -255,9 +253,6 @@ jobs:
      - name: Generate Prisma client
        run: yarn workspace @affine/server prisma generate

-      - name: Mv node_modules
-        run: mv ./node_modules ./packages/backend/server
-
      - name: Setup Version
        id: version
        uses: ./.github/actions/setup-version
@@ -157,7 +157,6 @@ jobs:
    runs-on: ubuntu-latest
    needs:
      - optimize_ci
-      - build-server-native
    if: needs.optimize_ci.outputs.skip == 'false'
    steps:
      - uses: actions/checkout@v4
@@ -166,20 +165,13 @@ jobs:
        with:
          full-cache: true

-      - name: Download server-native.node
-        uses: actions/download-artifact@v4
-        with:
-          name: server-native.node
-          path: ./packages/backend/native
-
      - name: Run Check
        run: |
          yarn affine init
          yarn affine gql build
          yarn affine i18n build
-          yarn affine server genconfig
          git status --porcelain | grep . && {
-            echo "Run 'yarn affine init && yarn affine gql build && yarn affine i18n build && yarn affine server genconfig' and make sure all changes are submitted"
+            echo "Run 'yarn affine init && yarn affine gql build && yarn affine i18n build' and make sure all changes are submitted"
            exit 1
          } || {
            echo "All changes are submitted"
@@ -156,7 +156,7 @@ jobs:
          BLOCKSUITE_REPO_PATH: ${{ github.workspace }}/blocksuite
      - name: Post Failed event to a Slack channel
        id: failed-slack
-        uses: slackapi/slack-github-action@v2.1.0
+        uses: slackapi/slack-github-action@v2.0.0
        if: ${{ always() && contains(needs.*.result, 'failure') }}
        with:
          method: chat.postMessage
@@ -171,7 +171,7 @@ jobs:
                  text: "<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}|Backend deploy failed `${{ github.event.inputs.flavor }}`>"
      - name: Post Cancel event to a Slack channel
        id: cancel-slack
-        uses: slackapi/slack-github-action@v2.1.0
+        uses: slackapi/slack-github-action@v2.0.0
        if: ${{ always() && contains(needs.*.result, 'cancelled') && !contains(needs.*.result, 'failure') }}
        with:
          token: ${{ secrets.SLACK_BOT_TOKEN }}
@@ -19,7 +19,6 @@
    "@blocksuite/affine-block-divider": "workspace:*",
    "@blocksuite/affine-block-edgeless-text": "workspace:*",
    "@blocksuite/affine-block-embed": "workspace:*",
-    "@blocksuite/affine-block-embed-doc": "workspace:*",
    "@blocksuite/affine-block-frame": "workspace:*",
    "@blocksuite/affine-block-image": "workspace:*",
    "@blocksuite/affine-block-latex": "workspace:*",
@@ -122,9 +121,6 @@
    "./blocks/embed": "./src/blocks/embed/index.ts",
    "./blocks/embed/store": "./src/blocks/embed/store.ts",
    "./blocks/embed/view": "./src/blocks/embed/view.ts",
-    "./blocks/embed-doc": "./src/blocks/embed-doc/index.ts",
-    "./blocks/embed-doc/store": "./src/blocks/embed-doc/store.ts",
-    "./blocks/embed-doc/view": "./src/blocks/embed-doc/view.ts",
    "./blocks/frame": "./src/blocks/frame/index.ts",
    "./blocks/frame/store": "./src/blocks/frame/store.ts",
    "./blocks/frame/view": "./src/blocks/frame/view.ts",
@@ -143,9 +139,7 @@
    "./blocks/paragraph": "./src/blocks/paragraph/index.ts",
    "./blocks/paragraph/store": "./src/blocks/paragraph/store.ts",
    "./blocks/paragraph/view": "./src/blocks/paragraph/view.ts",
-    "./blocks/root": "./src/blocks/root/index.ts",
-    "./blocks/root/store": "./src/blocks/root/store.ts",
-    "./blocks/root/view": "./src/blocks/root/view.ts",
+    "./blocks/root": "./src/blocks/root.ts",
    "./blocks/surface": "./src/blocks/surface/index.ts",
    "./blocks/surface/store": "./src/blocks/surface/store.ts",
    "./blocks/surface/view": "./src/blocks/surface/view.ts",
@@ -198,12 +192,9 @@
    "./widgets/viewport-overlay/view": "./src/widgets/viewport-overlay/view.ts",
    "./widgets/page-dragging-area": "./src/widgets/page-dragging-area/index.ts",
    "./widgets/page-dragging-area/view": "./src/widgets/page-dragging-area/view.ts",
-    "./fragments/doc-title": "./src/fragments/doc-title/index.ts",
-    "./fragments/doc-title/view": "./src/fragments/doc-title/view.ts",
-    "./fragments/frame-panel": "./src/fragments/frame-panel/index.ts",
-    "./fragments/frame-panel/view": "./src/fragments/frame-panel/view.ts",
-    "./fragments/outline": "./src/fragments/outline/index.ts",
-    "./fragments/outline/view": "./src/fragments/outline/view.ts",
+    "./fragments/doc-title": "./src/fragments/doc-title.ts",
+    "./fragments/frame-panel": "./src/fragments/frame-panel.ts",
+    "./fragments/outline": "./src/fragments/outline.ts",
    "./gfx/text": "./src/gfx/text/index.ts",
    "./gfx/text/store": "./src/gfx/text/store.ts",
    "./gfx/text/view": "./src/gfx/text/view.ts",
@@ -258,7 +249,6 @@
    "./components/toolbar": "./src/components/toolbar.ts",
    "./components/view-dropdown-menu": "./src/components/view-dropdown-menu.ts",
    "./components/tooltip-content-with-shortcut": "./src/components/tooltip-content-with-shortcut.ts",
-    "./components/resource": "./src/components/resource.ts",
    "./rich-text": "./src/rich-text/index.ts",
    "./rich-text/effects": "./src/rich-text/effects.ts",
    "./shared/adapters": "./src/shared/adapters.ts",
@@ -274,9 +264,7 @@
    "./model": "./src/model/index.ts",
    "./sync": "./src/sync/index.ts",
    "./extensions/store": "./src/extensions/store.ts",
-    "./extensions/view": "./src/extensions/view.ts",
-    "./foundation/store": "./src/foundation/store.ts",
-    "./foundation/view": "./src/foundation/view.ts"
+    "./extensions/view": "./src/extensions/view.ts"
  },
  "files": [
    "src",
@@ -287,6 +275,6 @@
  "version": "0.21.0",
  "devDependencies": {
    "@vanilla-extract/vite-plugin": "^5.0.0",
-    "vitest": "3.1.3"
+    "vitest": "3.1.1"
  }
 }
@@ -2448,121 +2448,6 @@ World!
    });
    expect(target.file).toBe(markdown);
  });
-
-  test('callout', async () => {
-    const blockSnapshot: BlockSnapshot = {
-      type: 'block',
-      id: 'block:vu6SK6WJpW',
-      flavour: 'affine:page',
-      props: {
-        title: {
-          '$blocksuite:internal:text$': true,
-          delta: [],
-        },
-      },
-      children: [
-        {
-          type: 'block',
-          id: 'block:Tk4gSPocAt',
-          flavour: 'affine:surface',
-          props: {
-            elements: {},
-          },
-          children: [],
-        },
-        {
-          type: 'block',
-          id: 'block:WfnS5ZDCJT',
-          flavour: 'affine:note',
-          props: {
-            xywh: '[0,0,800,95]',
-            background: DefaultTheme.noteBackgrounColor,
-            index: 'a0',
-            hidden: false,
-            displayMode: NoteDisplayMode.DocAndEdgeless,
-          },
-          children: [
-            {
-              type: 'block',
-              id: 'block:8hOLxad5Fv',
-              flavour: 'affine:callout',
-              props: {
-                emoji: '💡',
-              },
-              children: [
-                {
-                  type: 'block',
-                  id: 'block:8hOLxad5Fv',
-                  flavour: 'affine:paragraph',
-                  props: {
-                    type: 'text',
-                    text: {
-                      '$blocksuite:internal:text$': true,
-                      delta: [{ insert: 'First callout' }],
-                    },
-                  },
-                  children: [],
-                },
-              ],
-            },
-            {
-              type: 'block',
-              id: 'block:8hOLxadvdv',
-              flavour: 'affine:callout',
-              props: {
-                emoji: '',
-              },
-              children: [
-                {
-                  type: 'block',
-                  id: 'block:8hOLxad5Fv',
-                  flavour: 'affine:paragraph',
-                  props: {
-                    type: 'text',
-                    text: {
-                      '$blocksuite:internal:text$': true,
-                      delta: [{ insert: 'Second callout without emoji' }],
-                    },
-                  },
-                  children: [],
-                },
-              ],
-            },
-            {
-              type: 'block',
-              id: 'block:8hOLxbfdb',
-              flavour: 'affine:paragraph',
-              props: {
-                type: 'quote',
-                text: {
-                  '$blocksuite:internal:text$': true,
-                  delta: [{ insert: 'This is a regular blockquote' }],
-                },
-              },
-              children: [],
-            },
-          ],
-        },
-      ],
-    };
-
-    const markdown = `> \\[!💡]
->
-> First callout
-
-> \\[!]
->
-> Second callout without emoji
-
-> This is a regular blockquote
-`;
-
-    const mdAdapter = new MarkdownAdapter(createJob(), provider);
-    const target = await mdAdapter.fromBlockSnapshot({
-      snapshot: blockSnapshot,
-    });
-    expect(target.file).toBe(markdown);
-  });
 });

 describe('markdown to snapshot', () => {
@@ -3703,7 +3588,7 @@ bbb
      props: {
        xywh: '[0,0,800,95]',
        background: {
-          dark: '#252525',
+          dark: '#000000',
          light: '#ffffff',
        },
        index: 'a0',
@@ -4297,62 +4182,4 @@ hhh
    });
    expect(nanoidReplacement(rawSliceSnapshot!)).toEqual(sliceSnapshot);
  });
-
-  describe('callout', () => {
-    const calloutBlockSnapshot: BlockSnapshot = {
-      type: 'block',
-      id: 'matchesReplaceMap[0]',
-      flavour: 'affine:note',
-      props: {
-        xywh: '[0,0,800,95]',
-        background: DefaultTheme.noteBackgrounColor,
-        index: 'a0',
-        hidden: false,
-        displayMode: NoteDisplayMode.DocAndEdgeless,
-      },
-      children: [
-        {
-          type: 'block',
-          id: 'matchesReplaceMap[1]',
-          flavour: 'affine:callout',
-          props: {
-            emoji: '💬',
-          },
-          children: [
-            {
-              type: 'block',
-              id: 'matchesReplaceMap[2]',
-              flavour: 'affine:paragraph',
-              props: {
-                type: 'text',
-                text: {
-                  '$blocksuite:internal:text$': true,
-                  delta: [{ insert: 'This is a callout' }],
-                },
-              },
-              children: [],
-            },
-          ],
-        },
-      ],
-    };
-
-    test('callout start with escape character', async () => {
-      const markdown = '> \\[!💬]\n> This is a callout';
-      const mdAdapter = new MarkdownAdapter(createJob(), provider);
-      const rawBlockSnapshot = await mdAdapter.toBlockSnapshot({
-        file: markdown,
-      });
-      expect(nanoidReplacement(rawBlockSnapshot)).toEqual(calloutBlockSnapshot);
-    });
-
-    test('callout start without escape character', async () => {
-      const markdown = '> [!💬]\n> This is a callout';
-      const mdAdapter = new MarkdownAdapter(createJob(), provider);
-      const rawBlockSnapshot = await mdAdapter.toBlockSnapshot({
-        file: markdown,
-      });
-      expect(nanoidReplacement(rawBlockSnapshot)).toEqual(calloutBlockSnapshot);
-    });
-  });
 });
@@ -106,65 +106,4 @@ describe('notion-text to snapshot', () => {
    });
    expect(nanoidReplacement(target!)).toEqual(sliceSnapshot);
  });
-
-  test('notion text with empty styles array', () => {
-    const notionText =
-      '{"blockType":"text","editing":[["a "],["bold text",[["b"]]],[" hello world"]],"selection":{"startIndex":0,"endIndex":23},"action":"copy"}';
-
-    const sliceSnapshot: SliceSnapshot = {
-      type: 'slice',
-      content: [
-        {
-          type: 'block',
-          id: 'matchesReplaceMap[0]',
-          flavour: 'affine:note',
-          props: {
-            xywh: '[0,0,800,95]',
-            background: DefaultTheme.noteBackgrounColor,
-            index: 'a0',
-            hidden: false,
-            displayMode: 'both',
-          },
-          children: [
-            {
-              type: 'block',
-              id: 'matchesReplaceMap[1]',
-              flavour: 'affine:paragraph',
-              props: {
-                type: 'text',
-                text: {
-                  '$blocksuite:internal:text$': true,
-                  delta: [
-                    {
-                      insert: 'a ',
-                    },
-                    {
-                      insert: 'bold text',
-                      attributes: {
-                        bold: true,
-                      },
-                    },
-                    {
-                      insert: ' hello world',
-                    },
-                  ],
-                },
-              },
-              children: [],
-            },
-          ],
-        },
-      ],
-      workspaceId: '',
-      pageId: '',
-    };
-
-    const ntAdapter = new NotionTextAdapter(createJob(), provider);
-    const target = ntAdapter.toSliceSnapshot({
-      file: notionText,
-      workspaceId: '',
-      pageId: '',
-    });
-    expect(nanoidReplacement(target!)).toEqual(sliceSnapshot);
-  });
 });
@@ -0,0 +1,65 @@
+import {
+  HtmlInlineToDeltaAdapterExtensions,
+  InlineDeltaToHtmlAdapterExtensions,
+  InlineDeltaToMarkdownAdapterExtensions,
+  MarkdownInlineToDeltaAdapterExtensions,
+  NotionHtmlInlineToDeltaAdapterExtensions,
+} from '@blocksuite/affine-inline-preset';
+import {
+  AttachmentAdapterFactoryExtension,
+  HtmlAdapterFactoryExtension,
+  ImageAdapterFactoryExtension,
+  MarkdownAdapterFactoryExtension,
+  MixTextAdapterFactoryExtension,
+  NotionHtmlAdapterFactoryExtension,
+  NotionTextAdapterFactoryExtension,
+  PlainTextAdapterFactoryExtension,
+} from '@blocksuite/affine-shared/adapters';
+import type { ExtensionType } from '@blocksuite/store';
+
+import { defaultBlockHtmlAdapterMatchers } from './html/block-matcher';
+import { defaultBlockMarkdownAdapterMatchers } from './markdown/block-matcher';
+import { defaultMarkdownPreprocessors } from './markdown/preprocessor';
+import { defaultBlockNotionHtmlAdapterMatchers } from './notion-html/block-matcher';
+import { defaultBlockPlainTextAdapterMatchers } from './plain-text/block-matcher';
+
+export function getAdapterFactoryExtensions(): ExtensionType[] {
+  return [
+    AttachmentAdapterFactoryExtension,
+    ImageAdapterFactoryExtension,
+    MarkdownAdapterFactoryExtension,
+    PlainTextAdapterFactoryExtension,
+    HtmlAdapterFactoryExtension,
+    NotionTextAdapterFactoryExtension,
+    NotionHtmlAdapterFactoryExtension,
+    MixTextAdapterFactoryExtension,
+  ];
+}
+
+export function getHtmlAdapterExtensions(): ExtensionType[] {
+  return [
+    ...HtmlInlineToDeltaAdapterExtensions,
+    ...defaultBlockHtmlAdapterMatchers,
+    ...InlineDeltaToHtmlAdapterExtensions,
+  ];
+}
+
+export function getMarkdownAdapterExtensions(): ExtensionType[] {
+  return [
+    ...MarkdownInlineToDeltaAdapterExtensions,
+    ...defaultBlockMarkdownAdapterMatchers,
+    ...InlineDeltaToMarkdownAdapterExtensions,
+    ...defaultMarkdownPreprocessors,
+  ];
+}
+
+export function getNotionHtmlAdapterExtensions(): ExtensionType[] {
+  return [
+    ...NotionHtmlInlineToDeltaAdapterExtensions,
+    ...defaultBlockNotionHtmlAdapterMatchers,
+  ];
+}
+
+export function getPlainTextAdapterExtensions(): ExtensionType[] {
+  return [...defaultBlockPlainTextAdapterMatchers];
+}
@@ -0,0 +1,37 @@
+import { BookmarkBlockHtmlAdapterExtension } from '@blocksuite/affine-block-bookmark';
+import { CodeBlockHtmlAdapterExtension } from '@blocksuite/affine-block-code';
+import { DatabaseBlockHtmlAdapterExtension } from '@blocksuite/affine-block-database';
+import { DividerBlockHtmlAdapterExtension } from '@blocksuite/affine-block-divider';
+import {
+  EmbedFigmaBlockHtmlAdapterExtension,
+  EmbedGithubBlockHtmlAdapterExtension,
+  EmbedIframeBlockHtmlAdapterExtension,
+  EmbedLinkedDocHtmlAdapterExtension,
+  EmbedLoomBlockHtmlAdapterExtension,
+  EmbedSyncedDocBlockHtmlAdapterExtension,
+  EmbedYoutubeBlockHtmlAdapterExtension,
+} from '@blocksuite/affine-block-embed';
+import { ImageBlockHtmlAdapterExtension } from '@blocksuite/affine-block-image';
+import { ListBlockHtmlAdapterExtension } from '@blocksuite/affine-block-list';
+import { ParagraphBlockHtmlAdapterExtension } from '@blocksuite/affine-block-paragraph';
+import { RootBlockHtmlAdapterExtension } from '@blocksuite/affine-block-root';
+import { TableBlockHtmlAdapterExtension } from '@blocksuite/affine-block-table';
+
+export const defaultBlockHtmlAdapterMatchers = [
+  ListBlockHtmlAdapterExtension,
+  ParagraphBlockHtmlAdapterExtension,
+  CodeBlockHtmlAdapterExtension,
+  DividerBlockHtmlAdapterExtension,
+  ImageBlockHtmlAdapterExtension,
+  RootBlockHtmlAdapterExtension,
+  EmbedYoutubeBlockHtmlAdapterExtension,
+  EmbedFigmaBlockHtmlAdapterExtension,
+  EmbedLoomBlockHtmlAdapterExtension,
+  EmbedGithubBlockHtmlAdapterExtension,
+  EmbedIframeBlockHtmlAdapterExtension,
+  BookmarkBlockHtmlAdapterExtension,
+  DatabaseBlockHtmlAdapterExtension,
+  TableBlockHtmlAdapterExtension,
+  EmbedLinkedDocHtmlAdapterExtension,
+  EmbedSyncedDocBlockHtmlAdapterExtension,
+];
@@ -0,0 +1,6 @@
+export * from './extension.js';
+export * from './html/block-matcher.js';
+export * from './markdown/block-matcher.js';
+export * from './markdown/preprocessor.js';
+export * from './notion-html/block-matcher.js';
+export * from './plain-text/block-matcher.js';
@@ -0,0 +1,43 @@
+import { AttachmentBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-attachment';
+import { BookmarkBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-bookmark';
+import { CodeBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-code';
+import { DatabaseBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-database';
+import { DividerBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-divider';
+import {
+  EmbedFigmaMarkdownAdapterExtension,
+  EmbedGithubMarkdownAdapterExtension,
+  EmbedIframeBlockMarkdownAdapterExtension,
+  EmbedLinkedDocMarkdownAdapterExtension,
+  EmbedLoomMarkdownAdapterExtension,
+  EmbedSyncedDocMarkdownAdapterExtension,
+  EmbedYoutubeMarkdownAdapterExtension,
+} from '@blocksuite/affine-block-embed';
+import { ImageBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-image';
+import { LatexBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-latex';
+import { ListBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-list';
+import { DocNoteBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-note';
+import { ParagraphBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-paragraph';
+import { RootBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-root';
+import { TableBlockMarkdownAdapterExtension } from '@blocksuite/affine-block-table';
+
+export const defaultBlockMarkdownAdapterMatchers = [
+  RootBlockMarkdownAdapterExtension,
+  DocNoteBlockMarkdownAdapterExtension,
+  EmbedFigmaMarkdownAdapterExtension,
+  EmbedGithubMarkdownAdapterExtension,
+  EmbedLinkedDocMarkdownAdapterExtension,
+  EmbedLoomMarkdownAdapterExtension,
+  EmbedSyncedDocMarkdownAdapterExtension,
+  EmbedYoutubeMarkdownAdapterExtension,
+  EmbedIframeBlockMarkdownAdapterExtension,
+  ListBlockMarkdownAdapterExtension,
+  ParagraphBlockMarkdownAdapterExtension,
+  BookmarkBlockMarkdownAdapterExtension,
+  CodeBlockMarkdownAdapterExtension,
+  DatabaseBlockMarkdownAdapterExtension,
+  TableBlockMarkdownAdapterExtension,
+  DividerBlockMarkdownAdapterExtension,
+  ImageBlockMarkdownAdapterExtension,
+  LatexBlockMarkdownAdapterExtension,
+  AttachmentBlockMarkdownAdapterExtension,
+];
@@ -0,0 +1,9 @@
+import { BookmarkBlockMarkdownPreprocessorExtension } from '@blocksuite/affine-block-bookmark';
+import { CodeMarkdownPreprocessorExtension } from '@blocksuite/affine-block-code';
+import { LatexMarkdownPreprocessorExtension } from '@blocksuite/affine-block-latex';
+
+export const defaultMarkdownPreprocessors = [
+  LatexMarkdownPreprocessorExtension,
+  CodeMarkdownPreprocessorExtension,
+  BookmarkBlockMarkdownPreprocessorExtension,
+];
@@ -0,0 +1,34 @@
+import { AttachmentBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-attachment';
+import { BookmarkBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-bookmark';
+import { CodeBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-code';
+import { DatabaseBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-database';
+import { DividerBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-divider';
+import {
+  EmbedFigmaBlockNotionHtmlAdapterExtension,
+  EmbedGithubBlockNotionHtmlAdapterExtension,
+  EmbedLoomBlockNotionHtmlAdapterExtension,
+  EmbedYoutubeBlockNotionHtmlAdapterExtension,
+} from '@blocksuite/affine-block-embed';
+import { ImageBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-image';
+import { LatexBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-latex';
+import { ListBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-list';
+import { ParagraphBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-paragraph';
+import { RootBlockNotionHtmlAdapterExtension } from '@blocksuite/affine-block-root';
+import type { ExtensionType } from '@blocksuite/store';
+
+export const defaultBlockNotionHtmlAdapterMatchers: ExtensionType[] = [
+  ListBlockNotionHtmlAdapterExtension,
+  ParagraphBlockNotionHtmlAdapterExtension,
+  CodeBlockNotionHtmlAdapterExtension,
+  DividerBlockNotionHtmlAdapterExtension,
+  ImageBlockNotionHtmlAdapterExtension,
+  RootBlockNotionHtmlAdapterExtension,
+  BookmarkBlockNotionHtmlAdapterExtension,
+  DatabaseBlockNotionHtmlAdapterExtension,
+  LatexBlockNotionHtmlAdapterExtension,
+  EmbedYoutubeBlockNotionHtmlAdapterExtension,
+  EmbedFigmaBlockNotionHtmlAdapterExtension,
+  EmbedGithubBlockNotionHtmlAdapterExtension,
+  EmbedLoomBlockNotionHtmlAdapterExtension,
+  AttachmentBlockNotionHtmlAdapterExtension,
+];
@@ -0,0 +1,34 @@
+import { BookmarkBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-bookmark';
+import { CodeBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-code';
+import { DatabaseBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-database';
+import { DividerBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-divider';
+import {
+  EmbedFigmaBlockPlainTextAdapterExtension,
+  EmbedGithubBlockPlainTextAdapterExtension,
+  EmbedIframeBlockPlainTextAdapterExtension,
+  EmbedLinkedDocBlockPlainTextAdapterExtension,
+  EmbedLoomBlockPlainTextAdapterExtension,
+  EmbedSyncedDocBlockPlainTextAdapterExtension,
+  EmbedYoutubeBlockPlainTextAdapterExtension,
+} from '@blocksuite/affine-block-embed';
+import { LatexBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-latex';
+import { ListBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-list';
+import { ParagraphBlockPlainTextAdapterExtension } from '@blocksuite/affine-block-paragraph';
+import type { ExtensionType } from '@blocksuite/store';
+
+export const defaultBlockPlainTextAdapterMatchers: ExtensionType[] = [
+  ParagraphBlockPlainTextAdapterExtension,
+  ListBlockPlainTextAdapterExtension,
+  DividerBlockPlainTextAdapterExtension,
+  CodeBlockPlainTextAdapterExtension,
+  BookmarkBlockPlainTextAdapterExtension,
+  EmbedFigmaBlockPlainTextAdapterExtension,
+  EmbedGithubBlockPlainTextAdapterExtension,
+  EmbedLoomBlockPlainTextAdapterExtension,
+  EmbedYoutubeBlockPlainTextAdapterExtension,
+  EmbedLinkedDocBlockPlainTextAdapterExtension,
+  EmbedSyncedDocBlockPlainTextAdapterExtension,
+  EmbedIframeBlockPlainTextAdapterExtension,
+  LatexBlockPlainTextAdapterExtension,
+  DatabaseBlockPlainTextAdapterExtension,
+];
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-block-embed-doc';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-block-embed-doc/store';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-block-embed-doc/view';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-block-root/store';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-block-root/view';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-components/citation';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-components/resource';
@@ -1,24 +1,92 @@
-import { type effects as blockRootEffects } from '@blocksuite/affine-block-root/effects';
-import { type effects as componentCaptionEffects } from '@blocksuite/affine-components/caption';
-import { type effects as componentColorPickerEffects } from '@blocksuite/affine-components/color-picker';
-import { type effects as componentContextMenuEffects } from '@blocksuite/affine-components/context-menu';
-import { type effects as componentDatePickerEffects } from '@blocksuite/affine-components/date-picker';
-import { type effects as componentDropIndicatorEffects } from '@blocksuite/affine-components/drop-indicator';
-import { type effects as componentEmbedCardModalEffects } from '@blocksuite/affine-components/embed-card-modal';
-import { type effects as componentHighlightDropdownMenuEffects } from '@blocksuite/affine-components/highlight-dropdown-menu';
-import { type effects as componentLinkPreviewEffects } from '@blocksuite/affine-components/link-preview';
-import { type effects as componentLinkedDocTitleEffects } from '@blocksuite/affine-components/linked-doc-title';
-import { type effects as componentPortalEffects } from '@blocksuite/affine-components/portal';
-import { type effects as componentToggleButtonEffects } from '@blocksuite/affine-components/toggle-button';
-import { type effects as componentToolbarEffects } from '@blocksuite/affine-components/toolbar';
-import { type effects as componentViewDropdownMenuEffects } from '@blocksuite/affine-components/view-dropdown-menu';
-import { type effects as richTextEffects } from '@blocksuite/affine-rich-text/effects';
-import { type effects as stdEffects } from '@blocksuite/std/effects';
+import { effects as blockAttachmentEffects } from '@blocksuite/affine-block-attachment/effects';
+import { effects as blockBookmarkEffects } from '@blocksuite/affine-block-bookmark/effects';
+import { effects as blockCalloutEffects } from '@blocksuite/affine-block-callout/effects';
+import { effects as blockCodeEffects } from '@blocksuite/affine-block-code/effects';
+import { effects as blockDataViewEffects } from '@blocksuite/affine-block-data-view/effects';
+import { effects as blockDatabaseEffects } from '@blocksuite/affine-block-database/effects';
+import { effects as blockDividerEffects } from '@blocksuite/affine-block-divider/effects';
+import { effects as blockEdgelessTextEffects } from '@blocksuite/affine-block-edgeless-text/effects';
+import { effects as blockEmbedEffects } from '@blocksuite/affine-block-embed/effects';
+import { effects as blockFrameEffects } from '@blocksuite/affine-block-frame/effects';
+import { effects as blockImageEffects } from '@blocksuite/affine-block-image/effects';
+import { effects as blockLatexEffects } from '@blocksuite/affine-block-latex/effects';
+import { effects as blockListEffects } from '@blocksuite/affine-block-list/effects';
+import { effects as blockNoteEffects } from '@blocksuite/affine-block-note/effects';
+import { effects as blockParagraphEffects } from '@blocksuite/affine-block-paragraph/effects';
+import { effects as blockRootEffects } from '@blocksuite/affine-block-root/effects';
+import { effects as blockSurfaceEffects } from '@blocksuite/affine-block-surface/effects';
+import { effects as blockSurfaceRefEffects } from '@blocksuite/affine-block-surface-ref/effects';
+import { effects as blockTableEffects } from '@blocksuite/affine-block-table/effects';
+import { BlockSelection } from '@blocksuite/affine-components/block-selection';
+import { BlockZeroWidth } from '@blocksuite/affine-components/block-zero-width';
+import { effects as componentCaptionEffects } from '@blocksuite/affine-components/caption';
+import { effects as componentCardStyleDropdownMenuEffects } from '@blocksuite/affine-components/card-style-dropdown-menu';
+import { effects as componentCitationEffects } from '@blocksuite/affine-components/citation';
+import { effects as componentColorPickerEffects } from '@blocksuite/affine-components/color-picker';
+import { effects as componentContextMenuEffects } from '@blocksuite/affine-components/context-menu';
+import { effects as componentDatePickerEffects } from '@blocksuite/affine-components/date-picker';
+import { effects as componentDropIndicatorEffects } from '@blocksuite/affine-components/drop-indicator';
+import { effects as componentEdgelessLineStylesEffects } from '@blocksuite/affine-components/edgeless-line-styles-panel';
+import { effects as componentEdgelessLineWidthEffects } from '@blocksuite/affine-components/edgeless-line-width-panel';
+import { effects as componentEdgelessShapeColorPickerEffects } from '@blocksuite/affine-components/edgeless-shape-color-picker';
+import { effects as componentEmbedCardModalEffects } from '@blocksuite/affine-components/embed-card-modal';
+import { FilterableListComponent } from '@blocksuite/affine-components/filterable-list';
+import { effects as componentHighlightDropdownMenuEffects } from '@blocksuite/affine-components/highlight-dropdown-menu';
+import { IconButton } from '@blocksuite/affine-components/icon-button';
+import { effects as componentLinkPreviewEffects } from '@blocksuite/affine-components/link-preview';
+import { effects as componentLinkedDocTitleEffects } from '@blocksuite/affine-components/linked-doc-title';
+import { effects as componentOpenDocDropdownMenuEffects } from '@blocksuite/affine-components/open-doc-dropdown-menu';
+import { effects as componentPortalEffects } from '@blocksuite/affine-components/portal';
+import { effects as componentSizeDropdownMenuEffects } from '@blocksuite/affine-components/size-dropdown-menu';
+import { SmoothCorner } from '@blocksuite/affine-components/smooth-corner';
+import { effects as componentToggleButtonEffects } from '@blocksuite/affine-components/toggle-button';
+import { ToggleSwitch } from '@blocksuite/affine-components/toggle-switch';
+import { effects as componentToolbarEffects } from '@blocksuite/affine-components/toolbar';
+import { effects as componentTooltipContentWithShortcutEffects } from '@blocksuite/affine-components/tooltip-content-with-shortcut';
+import { effects as componentViewDropdownMenuEffects } from '@blocksuite/affine-components/view-dropdown-menu';
+import { effects as fragmentDocTitleEffects } from '@blocksuite/affine-fragment-doc-title/effects';
+import { effects as fragmentFramePanelEffects } from '@blocksuite/affine-fragment-frame-panel/effects';
+import { effects as fragmentOutlineEffects } from '@blocksuite/affine-fragment-outline/effects';
+import { effects as inlineFootnoteEffects } from '@blocksuite/affine-inline-footnote/effects';
+import { effects as inlineLatexEffects } from '@blocksuite/affine-inline-latex/effects';
+import { effects as inlineLinkEffects } from '@blocksuite/affine-inline-link/effects';
+import { effects as inlineMentionEffects } from '@blocksuite/affine-inline-mention';
+import { effects as inlinePresetEffects } from '@blocksuite/affine-inline-preset/effects';
+import { effects as inlineReferenceEffects } from '@blocksuite/affine-inline-reference/effects';
+import { effects as richTextEffects } from '@blocksuite/affine-rich-text/effects';
+import { effects as widgetDragHandleEffects } from '@blocksuite/affine-widget-drag-handle/effects';
+import { effects as widgetEdgelessAutoConnectEffects } from '@blocksuite/affine-widget-edgeless-auto-connect/effects';
+import { effects as widgetFrameTitleEffects } from '@blocksuite/affine-widget-frame-title/effects';
+import { effects as widgetRemoteSelectionEffects } from '@blocksuite/affine-widget-remote-selection/effects';
+import { effects as widgetScrollAnchoringEffects } from '@blocksuite/affine-widget-scroll-anchoring/effects';
+import { effects as widgetSlashMenuEffects } from '@blocksuite/affine-widget-slash-menu/effects';
+import { effects as widgetToolbarEffects } from '@blocksuite/affine-widget-toolbar/effects';
+import { effects as dataViewEffects } from '@blocksuite/data-view/effects';
+import { effects as stdEffects } from '@blocksuite/std/effects';

 export declare const _GLOBAL_:
  | typeof stdEffects
+  | typeof dataViewEffects
  | typeof richTextEffects
+  | typeof blockNoteEffects
+  | typeof blockAttachmentEffects
+  | typeof blockBookmarkEffects
+  | typeof blockFrameEffects
+  | typeof blockListEffects
+  | typeof blockParagraphEffects
+  | typeof blockEmbedEffects
+  | typeof blockSurfaceEffects
+  | typeof blockImageEffects
+  | typeof blockDatabaseEffects
+  | typeof blockSurfaceRefEffects
+  | typeof blockLatexEffects
+  | typeof blockEdgelessTextEffects
+  | typeof blockDividerEffects
+  | typeof blockDataViewEffects
+  | typeof blockCodeEffects
+  | typeof blockTableEffects
  | typeof blockRootEffects
+  | typeof blockCalloutEffects
  | typeof componentCaptionEffects
  | typeof componentContextMenuEffects
  | typeof componentDatePickerEffects
@@ -31,4 +99,89 @@ export declare const _GLOBAL_:
  | typeof componentToolbarEffects
  | typeof componentToggleButtonEffects
  | typeof componentColorPickerEffects
-  | typeof componentViewDropdownMenuEffects;
+  | typeof componentViewDropdownMenuEffects
+  | typeof widgetScrollAnchoringEffects
+  | typeof widgetFrameTitleEffects
+  | typeof widgetRemoteSelectionEffects
+  | typeof widgetDragHandleEffects
+  | typeof widgetEdgelessAutoConnectEffects
+  | typeof widgetToolbarEffects
+  | typeof widgetSlashMenuEffects
+  | typeof fragmentDocTitleEffects
+  | typeof fragmentFramePanelEffects
+  | typeof fragmentOutlineEffects;
+
+export function effects() {
+  stdEffects();
+
+  dataViewEffects();
+  richTextEffects();
+
+  inlineReferenceEffects();
+  inlinePresetEffects();
+  inlineLinkEffects();
+  inlineFootnoteEffects();
+  inlineLatexEffects();
+  inlineMentionEffects();
+
+  blockNoteEffects();
+  blockAttachmentEffects();
+  blockBookmarkEffects();
+  blockFrameEffects();
+  blockListEffects();
+  blockParagraphEffects();
+  blockEmbedEffects();
+  blockSurfaceEffects();
+  blockImageEffects();
+  blockDatabaseEffects();
+  blockSurfaceRefEffects();
+  blockLatexEffects();
+  blockEdgelessTextEffects();
+  blockDividerEffects();
+  blockDataViewEffects();
+  blockCodeEffects();
+  blockTableEffects();
+  blockRootEffects();
+  blockCalloutEffects();
+
+  componentCaptionEffects();
+  componentContextMenuEffects();
+  componentDatePickerEffects();
+  componentPortalEffects();
+  componentToolbarEffects();
+  componentDropIndicatorEffects();
+  componentToggleButtonEffects();
+  componentColorPickerEffects();
+  componentEmbedCardModalEffects();
+  componentLinkPreviewEffects();
+  componentLinkedDocTitleEffects();
+  componentCitationEffects();
+  componentCardStyleDropdownMenuEffects();
+  componentHighlightDropdownMenuEffects();
+  componentViewDropdownMenuEffects();
+  componentTooltipContentWithShortcutEffects();
+  componentSizeDropdownMenuEffects();
+  componentEdgelessLineWidthEffects();
+  componentEdgelessLineStylesEffects();
+  componentEdgelessShapeColorPickerEffects();
+  componentOpenDocDropdownMenuEffects();
+
+  widgetScrollAnchoringEffects();
+  widgetFrameTitleEffects();
+  widgetRemoteSelectionEffects();
+  widgetDragHandleEffects();
+  widgetEdgelessAutoConnectEffects();
+  widgetSlashMenuEffects();
+  widgetToolbarEffects();
+
+  fragmentDocTitleEffects();
+  fragmentFramePanelEffects();
+  fragmentOutlineEffects();
+
+  customElements.define('icon-button', IconButton);
+  customElements.define('smooth-corner', SmoothCorner);
+  customElements.define('toggle-switch', ToggleSwitch);
+  customElements.define('affine-filterable-list', FilterableListComponent);
+  customElements.define('block-zero-width', BlockZeroWidth);
+  customElements.define('affine-block-selection', BlockSelection);
+}
@@ -0,0 +1,12 @@
+import { effects as blockRootEffects } from '@blocksuite/affine-block-root/effects';
+import { effects as fragmentDocTitleEffects } from '@blocksuite/affine-fragment-doc-title/effects';
+import { effects as fragmentFramePanelEffects } from '@blocksuite/affine-fragment-frame-panel/effects';
+import { effects as fragmentOutlineEffects } from '@blocksuite/affine-fragment-outline/effects';
+
+export function effects() {
+  blockRootEffects();
+
+  fragmentDocTitleEffects();
+  fragmentFramePanelEffects();
+  fragmentOutlineEffects();
+}
@@ -0,0 +1,48 @@
+import {
+  RootBlockHtmlAdapterExtension,
+  RootBlockMarkdownAdapterExtension,
+  RootBlockNotionHtmlAdapterExtension,
+} from '@blocksuite/affine-block-root';
+import {
+  type StoreExtensionContext,
+  StoreExtensionProvider,
+} from '@blocksuite/affine-ext-loader';
+import { RootBlockSchemaExtension } from '@blocksuite/affine-model';
+import type { ExtensionType } from '@blocksuite/store';
+
+const defaultBlockHtmlAdapterMatchers = [RootBlockHtmlAdapterExtension];
+
+const defaultBlockMarkdownAdapterMatchers = [RootBlockMarkdownAdapterExtension];
+
+const defaultBlockNotionHtmlAdapterMatchers: ExtensionType[] = [
+  RootBlockNotionHtmlAdapterExtension,
+];
+
+function getHtmlAdapterExtensions(): ExtensionType[] {
+  return [...defaultBlockHtmlAdapterMatchers];
+}
+
+function getMarkdownAdapterExtensions(): ExtensionType[] {
+  return [...defaultBlockMarkdownAdapterMatchers];
+}
+
+function getNotionHtmlAdapterExtensions(): ExtensionType[] {
+  return [...defaultBlockNotionHtmlAdapterMatchers];
+}
+
+const MigratingStoreExtensions: ExtensionType[] = [
+  RootBlockSchemaExtension,
+
+  getHtmlAdapterExtensions(),
+  getMarkdownAdapterExtensions(),
+  getNotionHtmlAdapterExtensions(),
+].flat();
+
+export class MigratingStoreExtension extends StoreExtensionProvider {
+  override name = 'migrating';
+
+  override setup(context: StoreExtensionContext) {
+    super.setup(context);
+    context.register(MigratingStoreExtensions);
+  }
+}
@@ -0,0 +1,42 @@
+import {
+  type ViewExtensionContext,
+  ViewExtensionProvider,
+} from '@blocksuite/affine-ext-loader';
+
+import { effects } from './effects';
+import {
+  MigratingEdgelessEditorBlockSpecs,
+  MigratingPageEditorBlockSpecs,
+  MigratingPreviewEdgelessEditorBlockSpecs,
+  MigratingPreviewPageEditorBlockSpecs,
+} from './migrating';
+
+export class MigratingViewExtension extends ViewExtensionProvider {
+  override name = 'migrating';
+
+  override effect() {
+    super.effect();
+    effects();
+  }
+
+  override setup(context: ViewExtensionContext) {
+    super.setup(context);
+    const scope = context.scope;
+    if (scope === 'preview-page') {
+      context.register(MigratingPreviewPageEditorBlockSpecs);
+      return;
+    }
+    if (scope === 'preview-edgeless') {
+      context.register(MigratingPreviewEdgelessEditorBlockSpecs);
+      return;
+    }
+    if (scope === 'page' || scope === 'mobile-page') {
+      context.register(MigratingPageEditorBlockSpecs);
+      return;
+    }
+    if (scope === 'edgeless' || scope === 'mobile-edgeless') {
+      context.register(MigratingEdgelessEditorBlockSpecs);
+      return;
+    }
+  }
+}
@@ -0,0 +1,26 @@
+import {
+  EdgelessBuiltInSpecs,
+  PageRootBlockSpec,
+  PreviewEdgelessRootBlockSpec,
+  PreviewPageRootBlockSpec,
+  ReadOnlyClipboard,
+} from '@blocksuite/affine-block-root';
+import type { ExtensionType } from '@blocksuite/store';
+
+export const MigratingEdgelessEditorBlockSpecs: ExtensionType[] = [
+  EdgelessBuiltInSpecs,
+].flat();
+
+export const MigratingPageEditorBlockSpecs: ExtensionType[] = [
+  PageRootBlockSpec,
+].flat();
+
+export const MigratingPreviewEdgelessEditorBlockSpecs: ExtensionType[] = [
+  PreviewEdgelessRootBlockSpec,
+  ReadOnlyClipboard,
+].flat();
+
+export const MigratingPreviewPageEditorBlockSpecs: ExtensionType[] = [
+  PreviewPageRootBlockSpec,
+  ReadOnlyClipboard,
+].flat();
@@ -7,14 +7,12 @@ import { DatabaseStoreExtension } from '@blocksuite/affine-block-database/store'
 import { DividerStoreExtension } from '@blocksuite/affine-block-divider/store';
 import { EdgelessTextStoreExtension } from '@blocksuite/affine-block-edgeless-text/store';
 import { EmbedStoreExtension } from '@blocksuite/affine-block-embed/store';
-import { EmbedDocStoreExtension } from '@blocksuite/affine-block-embed-doc/store';
 import { FrameStoreExtension } from '@blocksuite/affine-block-frame/store';
 import { ImageStoreExtension } from '@blocksuite/affine-block-image/store';
 import { LatexStoreExtension } from '@blocksuite/affine-block-latex/store';
 import { ListStoreExtension } from '@blocksuite/affine-block-list/store';
 import { NoteStoreExtension } from '@blocksuite/affine-block-note/store';
 import { ParagraphStoreExtension } from '@blocksuite/affine-block-paragraph/store';
-import { RootStoreExtension } from '@blocksuite/affine-block-root/store';
 import { SurfaceStoreExtension } from '@blocksuite/affine-block-surface/store';
 import { SurfaceRefStoreExtension } from '@blocksuite/affine-block-surface-ref/store';
 import { TableStoreExtension } from '@blocksuite/affine-block-table/store';
@@ -31,6 +29,8 @@ import { LinkStoreExtension } from '@blocksuite/affine-inline-link/store';
 import { InlinePresetStoreExtension } from '@blocksuite/affine-inline-preset/store';
 import { ReferenceStoreExtension } from '@blocksuite/affine-inline-reference/store';

+import { MigratingStoreExtension } from './migrating-store';
+
 export function getInternalStoreExtensions() {
  return [
    FoundationStoreExtension,
@@ -44,7 +44,6 @@ export function getInternalStoreExtensions() {
    DividerStoreExtension,
    EdgelessTextStoreExtension,
    EmbedStoreExtension,
-    EmbedDocStoreExtension,
    FrameStoreExtension,
    ImageStoreExtension,
    LatexStoreExtension,
@@ -54,7 +53,6 @@ export function getInternalStoreExtensions() {
    SurfaceRefStoreExtension,
    TableStoreExtension,
    SurfaceStoreExtension,
-    RootStoreExtension,

    FootnoteStoreExtension,
    LinkStoreExtension,
@@ -68,5 +66,7 @@ export function getInternalStoreExtensions() {
    ConnectorStoreExtension,
    GroupStoreExtension,
    TextStoreExtension,
+
+    MigratingStoreExtension,
  ];
 }
@@ -7,21 +7,16 @@ import { DatabaseViewExtension } from '@blocksuite/affine-block-database/view';
 import { DividerViewExtension } from '@blocksuite/affine-block-divider/view';
 import { EdgelessTextViewExtension } from '@blocksuite/affine-block-edgeless-text/view';
 import { EmbedViewExtension } from '@blocksuite/affine-block-embed/view';
-import { EmbedDocViewExtension } from '@blocksuite/affine-block-embed-doc/view';
 import { FrameViewExtension } from '@blocksuite/affine-block-frame/view';
 import { ImageViewExtension } from '@blocksuite/affine-block-image/view';
 import { LatexViewExtension } from '@blocksuite/affine-block-latex/view';
 import { ListViewExtension } from '@blocksuite/affine-block-list/view';
 import { NoteViewExtension } from '@blocksuite/affine-block-note/view';
 import { ParagraphViewExtension } from '@blocksuite/affine-block-paragraph/view';
-import { RootViewExtension } from '@blocksuite/affine-block-root/view';
 import { SurfaceViewExtension } from '@blocksuite/affine-block-surface/view';
 import { SurfaceRefViewExtension } from '@blocksuite/affine-block-surface-ref/view';
 import { TableViewExtension } from '@blocksuite/affine-block-table/view';
 import { FoundationViewExtension } from '@blocksuite/affine-foundation/view';
-import { DocTitleViewExtension } from '@blocksuite/affine-fragment-doc-title/view';
-import { FramePanelViewExtension } from '@blocksuite/affine-fragment-frame-panel/view';
-import { OutlineViewExtension } from '@blocksuite/affine-fragment-outline/view';
 import { BrushViewExtension } from '@blocksuite/affine-gfx-brush/view';
 import { ConnectorViewExtension } from '@blocksuite/affine-gfx-connector/view';
 import { GroupViewExtension } from '@blocksuite/affine-gfx-group/view';
@@ -52,6 +47,8 @@ import { SlashMenuViewExtension } from '@blocksuite/affine-widget-slash-menu/vie
 import { ToolbarViewExtension } from '@blocksuite/affine-widget-toolbar/view';
 import { ViewportOverlayViewExtension } from '@blocksuite/affine-widget-viewport-overlay/view';

+import { MigratingViewExtension } from './migrating-view';
+
 export function getInternalViewExtensions() {
  return [
    FoundationViewExtension,
@@ -78,7 +75,6 @@ export function getInternalViewExtensions() {
    DividerViewExtension,
    EdgelessTextViewExtension,
    EmbedViewExtension,
-    EmbedDocViewExtension,
    FrameViewExtension,
    ImageViewExtension,
    LatexViewExtension,
@@ -88,7 +84,6 @@ export function getInternalViewExtensions() {
    SurfaceRefViewExtension,
    TableViewExtension,
    SurfaceViewExtension,
-    RootViewExtension,

    // Inline
    FootnoteViewExtension,
@@ -102,6 +97,7 @@ export function getInternalViewExtensions() {
    DragHandleViewExtension,
    EdgelessAutoConnectViewExtension,
    EdgelessToolbarViewExtension,
+    MigratingViewExtension,
    FrameTitleViewExtension,
    KeyboardToolbarViewExtension,
    LinkedDocViewExtension,
@@ -112,10 +108,5 @@ export function getInternalViewExtensions() {
    ViewportOverlayViewExtension,
    EdgelessZoomToolbarViewExtension,
    PageDraggingAreaViewExtension,
-
-    // Fragment
-    DocTitleViewExtension,
-    FramePanelViewExtension,
-    OutlineViewExtension,
  ];
 }
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-foundation/store';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-foundation/view';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-fragment-doc-title/view';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-fragment-frame-panel/view';
@@ -1 +0,0 @@
-export * from '@blocksuite/affine-fragment-outline/view';
@@ -16,7 +16,6 @@
    { "path": "../blocks/divider" },
    { "path": "../blocks/edgeless-text" },
    { "path": "../blocks/embed" },
-    { "path": "../blocks/embed-doc" },
    { "path": "../blocks/frame" },
    { "path": "../blocks/image" },
    { "path": "../blocks/latex" },
@@ -10,6 +10,7 @@
  "author": "toeverything",
  "license": "MIT",
  "dependencies": {
+    "@blocksuite/affine-block-embed": "workspace:*",
    "@blocksuite/affine-block-surface": "workspace:*",
    "@blocksuite/affine-components": "workspace:*",
    "@blocksuite/affine-ext-loader": "workspace:*",
@@ -23,7 +24,7 @@
    "@floating-ui/dom": "^1.6.13",
    "@lit/context": "^1.1.2",
    "@preact/signals-core": "^1.8.0",
-    "@toeverything/theme": "^1.1.14",
+    "@toeverything/theme": "^1.1.12",
    "file-type": "^20.0.0",
    "lit": "^3.2.0",
    "minimatch": "^10.0.1",
@@ -1,16 +1,10 @@
+import { getEmbedCardIcons } from '@blocksuite/affine-block-embed';
 import {
  CaptionedBlockComponent,
  SelectedStyle,
 } from '@blocksuite/affine-components/caption';
-import {
-  getAttachmentFileIcon,
-  getLoadingIconWith,
-} from '@blocksuite/affine-components/icons';
+import { getAttachmentFileIcon } from '@blocksuite/affine-components/icons';
 import { Peekable } from '@blocksuite/affine-components/peek';
-import {
-  type ResolvedStateInfo,
-  ResourceController,
-} from '@blocksuite/affine-components/resource';
 import { toast } from '@blocksuite/affine-components/toast';
 import {
  type AttachmentBlockModel,
@@ -28,26 +22,23 @@ import {
  WarningIcon,
 } from '@blocksuite/icons/lit';
 import { BlockSelection } from '@blocksuite/std';
-import { nanoid, Slice } from '@blocksuite/store';
-import { computed, signal } from '@preact/signals-core';
+import { Slice } from '@blocksuite/store';
+import { type BlobState } from '@blocksuite/sync';
+import { effect, signal } from '@preact/signals-core';
 import { html, type TemplateResult } from 'lit';
+import { property } from 'lit/decorators.js';
 import { choose } from 'lit/directives/choose.js';
 import { type ClassInfo, classMap } from 'lit/directives/class-map.js';
-import { guard } from 'lit/directives/guard.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { when } from 'lit/directives/when.js';

 import { AttachmentEmbedProvider } from './embed';
 import { styles } from './styles';
 import { downloadAttachmentBlob, refreshData } from './utils';
-
-type AttachmentResolvedStateInfo = ResolvedStateInfo & {
-  kind?: TemplateResult;
-};
-
+type State = 'loading' | 'uploading' | 'warning' | 'oversize' | 'none';
@Peekable({
  enableOn: ({ model }: AttachmentBlockComponent) => {
-    return !model.store.readonly && model.props.type.endsWith('pdf');
+    return !model.doc.readonly && model.props.type.endsWith('pdf');
  },
 })
 export class AttachmentBlockComponent extends CaptionedBlockComponent<AttachmentBlockModel> {
@@ -55,13 +46,7 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment

  blockDraggable = true;

-  resourceController = new ResourceController(
-    computed(() => this.model.props.sourceId$.value)
-  );
-
-  get blobUrl() {
-    return this.resourceController.blobUrl$.value;
-  }
+  blobState$ = signal<Partial<BlobState>>({});

  protected containerStyleMap = styleMap({
    position: 'relative',
@@ -84,7 +69,7 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
  };

  copy = () => {
-    const slice = Slice.fromModels(this.store, [this.model]);
+    const slice = Slice.fromModels(this.doc, [this.model]);
    this.std.clipboard.copySlice(slice).catch(console.error);
    toast(this.host, 'Copied to clipboard');
  };
@@ -108,23 +93,33 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
    window.open(blobUrl, '_blank');
  };

-  // Refreshes data.
  refreshData = () => {
-    refreshData(this).catch(console.error);
+    refreshData(this.std, this).catch(console.error);
  };

-  private readonly _refreshKey$ = signal<string | null>(null);
+  updateBlobState(state: Partial<BlobState>) {
+    this.blobState$.value = { ...this.blobState$.value, ...state };
+  }

-  // Refreshes the embed component.
-  reload = () => {
-    if (this.model.props.embed) {
-      this._refreshKey$.value = nanoid();
-      return;
-    }
-
-    this.refreshData();
+  determineState = (
+    loading: boolean,
+    uploading: boolean,
+    overSize: boolean,
+    error: boolean
+  ): State => {
+    if (overSize) return 'oversize';
+    if (error) return 'warning';
+    if (uploading) return 'uploading';
+    if (loading) return 'loading';
+    return 'none';
  };

+  protected get embedView() {
+    return this.std
+      .get(AttachmentEmbedProvider)
+      .render(this.model, this.blobUrl ?? undefined, this._maxFileSize);
+  }
+
  private _selectBlock() {
    const selectionManager = this.host.selection;
    const blockSelection = selectionManager.create(BlockSelection, {
@@ -138,22 +133,46 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment

    this.contentEditable = 'false';

-    this.resourceController.setEngine(this.std.store.blobSync);
-
-    this.disposables.add(this.resourceController.subscribe());
-    this.disposables.add(this.resourceController);
-
    this.refreshData();

-    if (!this.model.props.style && !this.store.readonly) {
-      this.store.withoutTransact(() => {
-        this.store.updateBlock(this.model, {
+    this.disposables.add(
+      effect(() => {
+        const blobId = this.model.props.sourceId$.value;
+        if (!blobId) return;
+
+        const blobState$ = this.std.store.blobSync.blobState$(blobId);
+        if (!blobState$) return;
+
+        const subscription = blobState$.subscribe(state => {
+          if (state.overSize || state.errorMessage) {
+            state.uploading = false;
+            state.downloading = false;
+          }
+
+          this.updateBlobState(state);
+        });
+
+        return () => subscription.unsubscribe();
+      })
+    );
+
+    if (!this.model.props.style && !this.doc.readonly) {
+      this.doc.withoutTransact(() => {
+        this.doc.updateBlock(this.model, {
          style: AttachmentBlockStyles[1],
        });
      });
    }
  }

+  override disconnectedCallback() {
+    const blobUrl = this.blobUrl;
+    if (blobUrl) {
+      URL.revokeObjectURL(blobUrl);
+    }
+    super.disconnectedCallback();
+  }
+
  override firstUpdated() {
    // lazy bindings
    this.disposables.addFromEvent(this, 'click', this.onClick);
@@ -207,135 +226,128 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment

  protected renderWithHorizontal(
    classInfo: ClassInfo,
-    { icon, title, description, kind, state }: AttachmentResolvedStateInfo
+    icon: TemplateResult,
+    title: string,
+    description: string,
+    kind: TemplateResult,
+    state: State
  ) {
-    return html`
-      <div class=${classMap(classInfo)}>
-        <div class="affine-attachment-content">
-          <div class="affine-attachment-content-title">
-            <div class="affine-attachment-content-title-icon">${icon}</div>
-            <div class="affine-attachment-content-title-text truncate">
-              ${title}
-            </div>
-          </div>
+    return html`<div class=${classMap(classInfo)}>
+      <div class="affine-attachment-content">
+        <div class="affine-attachment-content-title">
+          <div class="affine-attachment-content-title-icon">${icon}</div>

-          <div class="affine-attachment-content-description">
-            <div class="affine-attachment-content-info truncate">
-              ${description}
-            </div>
-            ${choose(state, [
-              ['error', this.renderReloadButton],
-              ['error:oversize', this.renderUpgradeButton],
-            ])}
+          <div class="affine-attachment-content-title-text truncate">
+            ${title}
          </div>
        </div>

-        <div class="affine-attachment-banner">${kind}</div>
+        <div class="affine-attachment-content-description">
+          <div class="affine-attachment-content-info truncate">
+            ${description}
+          </div>
+          ${choose(state, [
+            ['oversize', this.renderUpgradeButton],
+            ['warning', this.renderReloadButton],
+          ])}
+        </div>
      </div>
-    `;
+
+      <div class="affine-attachment-banner">${kind}</div>
+    </div>`;
  }

  protected renderWithVertical(
    classInfo: ClassInfo,
-    { icon, title, description, kind, state }: AttachmentResolvedStateInfo
+    icon: TemplateResult,
+    title: string,
+    description: string,
+    kind: TemplateResult,
+    state?: State
  ) {
-    return html`
-      <div class=${classMap(classInfo)}>
-        <div class="affine-attachment-content">
-          <div class="affine-attachment-content-title">
-            <div class="affine-attachment-content-title-icon">${icon}</div>
-            <div class="affine-attachment-content-title-text truncate">
-              ${title}
-            </div>
-          </div>
+    return html`<div class=${classMap(classInfo)}>
+      <div class="affine-attachment-content">
+        <div class="affine-attachment-content-title">
+          <div class="affine-attachment-content-title-icon">${icon}</div>

-          <div class="affine-attachment-content-info truncate">
-            ${description}
+          <div class="affine-attachment-content-title-text truncate">
+            ${title}
          </div>
        </div>

-        <div class="affine-attachment-banner">
-          ${kind}
-          ${choose(state, [
-            ['error', this.renderReloadButton],
-            ['error:oversize', this.renderUpgradeButton],
-          ])}
+        <div class="affine-attachment-content-info truncate">
+          ${description}
        </div>
      </div>
-    `;
+
+      <div class="affine-attachment-banner">
+        ${kind}
+        ${choose(state, [
+          ['oversize', this.renderUpgradeButton],
+          ['warning', this.renderReloadButton],
+        ])}
+      </div>
+    </div>`;
  }

-  protected resolvedState$ = computed<AttachmentResolvedStateInfo>(() => {
+  protected renderCard = () => {
+    const { name, size, style } = this.model.props;
+    const cardStyle = style ?? AttachmentBlockStyles[1];
+
    const theme = this.std.get(ThemeProvider).theme$.value;
-    const loadingIcon = getLoadingIconWith(theme);
+    const { LoadingIcon } = getEmbedCardIcons(theme);

-    const size = this.model.props.size;
-    const name = this.model.props.name$.value;
-    const kind = getAttachmentFileIcon(name.split('.').pop() ?? '');
-
-    const resolvedState = this.resourceController.resolveStateWith({
-      loadingIcon,
-      errorIcon: WarningIcon(),
-      icon: AttachmentIcon(),
-      title: name,
-      description: humanFileSize(size),
-    });
-
-    return { ...resolvedState, kind };
-  });
-
-  protected renderCardView = () => {
-    const resolvedState = this.resolvedState$.value;
-    const cardStyle = this.model.props.style$.value ?? AttachmentBlockStyles[1];
+    const blobState = this.blobState$.value;
+    const {
+      uploading = false,
+      downloading = false,
+      overSize = false,
+      errorMessage,
+    } = blobState;
+    const warning = !overSize && Boolean(errorMessage);
+    const error = overSize || warning;
+    const loading = !error && downloading;
+    const state = this.determineState(loading, uploading, overSize, error);

    const classInfo = {
      'affine-attachment-card': true,
      [cardStyle]: true,
-      loading: resolvedState.loading,
-      error: resolvedState.error,
+      error,
+      loading,
    };

+    const icon = loading
+      ? LoadingIcon
+      : error
+        ? WarningIcon()
+        : AttachmentIcon();
+    const title = uploading ? 'Uploading...' : loading ? 'Loading...' : name;
+    const description = errorMessage || humanFileSize(size);
+    const kind = getAttachmentFileIcon(name.split('.').pop() ?? '');
+
    return when(
      cardStyle === 'cubeThick',
-      () => this.renderWithVertical(classInfo, resolvedState),
-      () => this.renderWithHorizontal(classInfo, resolvedState)
+      () =>
+        this.renderWithVertical(
+          classInfo,
+          icon,
+          title,
+          description,
+          kind,
+          state
+        ),
+      () =>
+        this.renderWithHorizontal(
+          classInfo,
+          icon,
+          title,
+          description,
+          kind,
+          state
+        )
    );
  };

-  protected renderEmbedView = () => {
-    const { model, blobUrl } = this;
-    if (!model.props.embed || !blobUrl) return null;
-
-    const { std, _maxFileSize } = this;
-    const provider = std.get(AttachmentEmbedProvider);
-
-    const render = provider.getRender(model, _maxFileSize);
-    if (!render) return null;
-
-    const enabled = provider.shouldShowStatus(model);
-
-    return html`
-      <div class="affine-attachment-embed-container">
-        ${guard([this._refreshKey$.value], () => render(model, blobUrl))}
-      </div>
-      ${when(enabled, () => {
-        const resolvedState = this.resolvedState$.value;
-        if (resolvedState.state !== 'error') return null;
-        // It should be an error messge.
-        const message = resolvedState.description;
-        if (!message) return null;
-
-        return html`
-          <affine-resource-status
-            class="affine-attachment-embed-status"
-            .message=${message}
-            .reload=${() => this.reload()}
-          ></affine-resource-status>
-        `;
-      })}
-    `;
-  };
-
  private readonly _renderCitation = () => {
    const { name, footnoteIdentifier } = this.model.props;
    const fileType = name.split('.').pop() ?? '';
@@ -360,12 +372,23 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
        ${when(
          this.isCitation,
          () => this._renderCitation(),
-          () => this.renderEmbedView() ?? this.renderCardView()
+          () =>
+            when(
+              this.embedView,
+              () =>
+                html`<div class="affine-attachment-embed-container">
+                  ${this.embedView}
+                </div>`,
+              this.renderCard
+            )
        )}
      </div>
    `;
  }

+  @property({ attribute: false })
+  accessor blobUrl: string | null = null;
+
  override accessor selectedStyle = SelectedStyle.Border;

  override accessor useCaptionEditor = true;
@@ -1,14 +1,10 @@
 import { EdgelessLegacySlotIdentifier } from '@blocksuite/affine-block-surface';
-import {
-  AttachmentBlockSchema,
-  AttachmentBlockStyles,
-} from '@blocksuite/affine-model';
+import { AttachmentBlockStyles } from '@blocksuite/affine-model';
 import {
  EMBED_CARD_HEIGHT,
  EMBED_CARD_WIDTH,
 } from '@blocksuite/affine-shared/consts';
 import { toGfxBlockComponent } from '@blocksuite/std';
-import { GfxViewInteractionExtension } from '@blocksuite/std/gfx';
 import { styleMap } from 'lit/directives/style-map.js';

 import { AttachmentBlockComponent } from './attachment-block.js';
@@ -52,21 +48,3 @@ declare global {
    'affine-edgeless-attachment': AttachmentEdgelessBlockComponent;
  }
 }
-
-export const AttachmentBlockInteraction = GfxViewInteractionExtension(
-  AttachmentBlockSchema.model.flavour,
-  {
-    resizeConstraint: {
-      lockRatio: true,
-    },
-    handleRotate: () => {
-      return {
-        beforeRotate: context => {
-          context.set({
-            rotatable: false,
-          });
-        },
-      };
-    },
-  }
-);
@@ -5,7 +5,6 @@ import type { ExtensionType } from '@blocksuite/store';
 import { literal } from 'lit/static-html.js';

 import { AttachmentBlockAdapterExtensions } from './adapters/extension.js';
-import { AttachmentBlockInteraction } from './attachment-edgeless-block.js';
 import { AttachmentDropOption } from './attachment-service.js';
 import { attachmentSlashMenuConfig } from './configs/slash-menu.js';
 import { createBuiltinToolbarConfigExtension } from './configs/toolbar';
@@ -27,7 +26,6 @@ export const AttachmentBlockSpec: ExtensionType[] = [
  AttachmentEmbedConfigExtension(),
  AttachmentEmbedService,
  AttachmentBlockAdapterExtensions,
-  AttachmentBlockInteraction,
  createBuiltinToolbarConfigExtension(flavour),
  SlashMenuConfigExtension(flavour, attachmentSlashMenuConfig),
 ].flat();
@@ -41,7 +41,7 @@ export const RenameModal = ({
      toast(editorHost, 'File name cannot be empty');
      return;
    }
-    model.store.updateBlock(model, {
+    model.doc.updateBlock(model, {
      name: newFileName,
    });
    abort();
@@ -18,7 +18,7 @@ export const attachmentSlashMenuConfig: SlashMenuConfig = {
      searchAlias: ['file'],
      group: '4_Content & Media@3',
      when: ({ model }) =>
-        model.store.schema.flavourSchemaMap.has('affine:attachment'),
+        model.doc.schema.flavourSchemaMap.has('affine:attachment'),
      action: ({ std, model }) => {
        (async () => {
          const file = await openFileOrFiles();
@@ -41,7 +41,7 @@ export const attachmentSlashMenuConfig: SlashMenuConfig = {
      },
      group: '4_Content & Media@4',
      when: ({ model }) =>
-        model.store.schema.flavourSchemaMap.has('affine:attachment'),
+        model.doc.schema.flavourSchemaMap.has('affine:attachment'),
      action: ({ std, model }) => {
        (async () => {
          const file = await openFileOrFiles();
@@ -77,19 +77,13 @@ export const attachmentViewDropdownMenu = {
        const model = ctx.getCurrentModelByType(AttachmentBlockModel);
        if (!model) return;

-        const provider = ctx.std.get(AttachmentEmbedProvider);
-
-        // TODO(@fundon): should auto focus image block.
-        if (
-          provider.shouldBeConverted(model) &&
-          !ctx.hasSelectedSurfaceModels
-        ) {
+        if (!ctx.hasSelectedSurfaceModels) {
          // Clears
          ctx.reset();
          ctx.select('note');
        }

-        provider.convertTo(model);
+        ctx.std.get(AttachmentEmbedProvider).convertTo(model);

        ctx.track('SelectedView', {
          ...trackBaseProps,
@@ -100,32 +94,18 @@ export const attachmentViewDropdownMenu = {
    },
  ],
  content(ctx) {
-    const block = ctx.getCurrentBlockByType(AttachmentBlockComponent);
-    if (!block) return null;
+    const model = ctx.getCurrentModelByType(AttachmentBlockModel);
+    if (!model) return null;

-    const model = block.model;
    const embedProvider = ctx.std.get(AttachmentEmbedProvider);
-    const actions = computed(() => {
-      const [cardAction, embedAction] = this.actions.map(action => ({
-        ...action,
-      }));
-
-      const ok = block.resourceController.resolvedState$.value.state === 'none';
-      const sourceId = Boolean(model.props.sourceId$.value);
+    const actions = this.actions.map(action => ({ ...action }));
+    const viewType$ = computed(() => {
+      const [cardAction, embedAction] = actions;
      const embed = model.props.embed$.value ?? false;
-      // 1. Check whether `sourceId` exists.
-      // 2. Check if `embedded` is allowed.
-      // 3. Check `blobState$`
-      const allowed = ok && sourceId && embedProvider.embedded(model) && !embed;

      cardAction.disabled = !embed;
-      embedAction.disabled = !allowed;
+      embedAction.disabled = embed && embedProvider.embedded(model);

-      return [cardAction, embedAction];
-    });
-    const viewType$ = computed(() => {
-      const [cardAction, embedAction] = actions.value;
-      const embed = model.props.embed$.value ?? false;
      return embed ? embedAction.label : cardAction.label;
    });
    const onToggle = (e: CustomEvent<boolean>) => {
@@ -143,7 +123,7 @@ export const attachmentViewDropdownMenu = {
      model,
      html`<affine-view-dropdown-menu
        @toggle=${onToggle}
-        .actions=${actions.value}
+        .actions=${actions}
        .context=${ctx}
        .viewType$=${viewType$}
      ></affine-view-dropdown-menu>`
@@ -263,7 +243,7 @@ const builtinToolbarConfig = {
      icon: ResetIcon(),
      run(ctx) {
        const block = ctx.getCurrentBlockByType(AttachmentBlockComponent);
-        block?.reload();
+        block?.refreshData();
      },
    },
    {
@@ -3,10 +3,6 @@ import {
  type ImageBlockProps,
  MAX_IMAGE_WIDTH,
 } from '@blocksuite/affine-model';
-import {
-  EMBED_CARD_HEIGHT,
-  EMBED_CARD_WIDTH,
-} from '@blocksuite/affine-shared/consts';
 import { FileSizeLimitProvider } from '@blocksuite/affine-shared/services';
 import {
  readImageSize,
@@ -21,7 +17,6 @@ import type { ExtensionType } from '@blocksuite/store';
 import { Extension } from '@blocksuite/store';
 import type { TemplateResult } from 'lit';
 import { html } from 'lit';
-import { styleMap } from 'lit/directives/style-map.js';

 import { getAttachmentBlob } from './utils';

@@ -39,22 +34,9 @@ export type AttachmentEmbedConfig = {
    std: BlockStdScope
  ) => Promise<void> | void;
  /**
-   * Renders the embed view.
+   * The template will be used to render the embed view.
   */
-  render?: (
-    model: AttachmentBlockModel,
-    blobUrl: string
-  ) => TemplateResult | null;
-
-  /**
-   * Should show status when turned on.
-   */
-  shouldShowStatus?: boolean;
-
-  /**
-   * Should block type conversion be required.
-   */
-  shouldBeConverted?: boolean;
+  template?: (model: AttachmentBlockModel, blobUrl: string) => TemplateResult;
 };

 // Single embed config.
@@ -115,53 +97,39 @@ export class AttachmentEmbedService extends Extension {
  // Converts to embed view.
  convertTo(model: AttachmentBlockModel, maxFileSize = this._maxFileSize) {
    const config = this.values.find(config => config.check(model, maxFileSize));
-
-    if (config?.action) {
-      config.action(model, this.std)?.catch(console.error);
+    if (!config?.action) {
+      model.doc.updateBlock(model, { embed: true });
      return;
    }
-
-    model.store.updateBlock(model, { embed: true });
+    config.action(model, this.std)?.catch(console.error);
  }

  embedded(model: AttachmentBlockModel, maxFileSize = this._maxFileSize) {
    return this.values.some(config => config.check(model, maxFileSize));
  }

-  getRender(model: AttachmentBlockModel, maxFileSize = this._maxFileSize) {
-    return (
-      this.values.find(config => config.check(model, maxFileSize))?.render ??
-      null
-    );
-  }
-
-  shouldShowStatus(
+  render(
    model: AttachmentBlockModel,
+    blobUrl?: string,
    maxFileSize = this._maxFileSize
  ) {
-    return (
-      this.values.find(config => config.check(model, maxFileSize))
-        ?.shouldShowStatus ?? false
-    );
-  }
+    if (!model.props.embed || !blobUrl) return;

-  shouldBeConverted(
-    model: AttachmentBlockModel,
-    maxFileSize = this._maxFileSize
-  ) {
-    return (
-      this.values.find(config => config.check(model, maxFileSize))
-        ?.shouldBeConverted ?? false
-    );
+    const config = this.values.find(config => config.check(model, maxFileSize));
+    if (!config || !config.template) {
+      console.error('No embed view template found!', model, model.props.type);
+      return;
+    }
+
+    return config.template(model, blobUrl);
  }
 }

 const embedConfig: AttachmentEmbedConfig[] = [
  {
    name: 'image',
-    shouldBeConverted: true,
    check: model =>
-      model.store.schema.flavourSchemaMap.has('affine:image') &&
+      model.doc.schema.flavourSchemaMap.has('affine:image') &&
      model.props.type.startsWith('image/'),
    async action(model, std) {
      const component = std.view.getBlock(model.id);
@@ -172,30 +140,16 @@ const embedConfig: AttachmentEmbedConfig[] = [
  },
  {
    name: 'pdf',
-    shouldShowStatus: true,
    check: (model, maxFileSize) =>
      model.props.type === 'application/pdf' && model.props.size <= maxFileSize,
-    action: model => {
-      const bound = Bound.deserialize(model.props.xywh);
-      bound.w = EMBED_CARD_WIDTH.pdf;
-      bound.h = EMBED_CARD_HEIGHT.pdf;
-      model.store.updateBlock(model, {
-        embed: true,
-        style: 'pdf',
-        xywh: bound.serialize(),
-      });
-    },
-    render: (_, blobUrl) => {
+    template: (_, blobUrl) => {
      // More options: https://tinytip.co/tips/html-pdf-params/
      // https://chromium.googlesource.com/chromium/src/+/refs/tags/121.0.6153.1/chrome/browser/resources/pdf/open_pdf_params_parser.ts
      const parameters = '#toolbar=0';
      return html`
        <iframe
-          style=${styleMap({
-            width: '100%',
-            minHeight: '480px',
-            colorScheme: 'auto',
-          })}
+          style="width: 100%; color-scheme: auto;"
+          height="480"
          src=${blobUrl + parameters}
          loading="lazy"
          scrolling="no"
@@ -203,7 +157,6 @@ const embedConfig: AttachmentEmbedConfig[] = [
          allowTransparency
          allowfullscreen
          type="application/pdf"
-          credentialless
        ></iframe>
        <div class="affine-attachment-embed-event-mask"></div>
      `;
@@ -211,44 +164,23 @@ const embedConfig: AttachmentEmbedConfig[] = [
  },
  {
    name: 'video',
-    shouldShowStatus: true,
    check: (model, maxFileSize) =>
      model.props.type.startsWith('video/') && model.props.size <= maxFileSize,
-    action: model => {
-      const bound = Bound.deserialize(model.props.xywh);
-      bound.w = EMBED_CARD_WIDTH.video;
-      bound.h = EMBED_CARD_HEIGHT.video;
-      model.store.updateBlock(model, {
-        embed: true,
-        style: 'video',
-        xywh: bound.serialize(),
-      });
-    },
-    render: (_, blobUrl) =>
+    template: (_, blobUrl) =>
      html`<video
-        style=${styleMap({
-          display: 'flex',
-          objectFit: 'cover',
-          backgroundSize: 'cover',
-          width: '100%',
-          height: '100%',
-        })}
-        src=${blobUrl}
-        width="100%"
-        height="100%"
+        style="max-height: max-content;"
+        width="100%;"
+        height="480"
        controls
+        src=${blobUrl}
      ></video>`,
  },
  {
    name: 'audio',
    check: (model, maxFileSize) =>
      model.props.type.startsWith('audio/') && model.props.size <= maxFileSize,
-    render: (_, blobUrl) =>
-      html`<audio
-        style=${styleMap({ margin: '4px' })}
-        src=${blobUrl}
-        controls
-      ></audio>`,
+    template: (_, blobUrl) =>
+      html`<audio controls src=${blobUrl} style="margin: 4px;"></audio>`,
  },
 ];

@@ -256,7 +188,7 @@ const embedConfig: AttachmentEmbedConfig[] = [
 * Turn the attachment block into an image block.
 */
 async function turnIntoImageBlock(model: AttachmentBlockModel) {
-  if (!model.store.schema.flavourSchemaMap.has('affine:image')) {
+  if (!model.doc.schema.flavourSchemaMap.has('affine:image')) {
    console.error('The image flavour is not supported!');
    return;
  }
@@ -6,9 +6,9 @@ export const styles = css`
    border-radius: 8px;
    box-sizing: border-box;
    user-select: none;
-    overflow: hidden;
    border: 1px solid ${unsafeCSSVarV2('layer/background/tertiary')};
    background: ${unsafeCSSVarV2('layer/background/primary')};
+    overflow: hidden;

    &.focused {
      border-color: ${unsafeCSSVarV2('layer/insideBorder/primaryBorder')};
@@ -30,13 +30,6 @@ export const styles = css`
    min-width: 0;
  }

-  .truncate {
-    align-self: stretch;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-  }
-
  .affine-attachment-content-title {
    display: flex;
    flex-direction: row;
@@ -54,6 +47,13 @@ export const styles = css`
    color: var(--affine-text-primary-color);
  }

+  .truncate {
+    align-self: stretch;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+
  .affine-attachment-content-title-text {
    color: var(--affine-text-primary-color);
    font-family: var(--affine-font-family);
@@ -117,11 +117,6 @@ export const styles = css`
    }
  }

-  .affine-attachment-card.loading,
-  .affine-attachment-card.error {
-    background: ${unsafeCSSVarV2('layer/background/secondary')};
-  }
-
  .affine-attachment-card.cubeThick {
    flex-direction: column-reverse;

@@ -143,12 +138,6 @@ export const styles = css`
    height: 100%;
  }

-  .affine-attachment-embed-status {
-    position: absolute;
-    left: 14px;
-    bottom: 64px;
-  }
-
  .affine-attachment-embed-event-mask {
    position: absolute;
    inset: 0;
@@ -22,13 +22,15 @@ import type { BlockModel } from '@blocksuite/store';
 import type { AttachmentBlockComponent } from './attachment-block';

 export async function getAttachmentBlob(model: AttachmentBlockModel) {
-  const { sourceId$, type$ } = model.props;
-  const sourceId = sourceId$.peek();
-  const type = type$.peek();
+  const {
+    sourceId$: { value: sourceId },
+    type$: { value: type },
+  } = model.props;
  if (!sourceId) return null;

-  const doc = model.store;
-  const blob = await doc.blobSync.get(sourceId);
+  const doc = model.doc;
+  let blob = await doc.blobSync.get(sourceId);
+
  if (!blob) return null;

  return new Blob([blob], { type });
@@ -39,9 +41,9 @@ export async function getAttachmentBlob(model: AttachmentBlockModel) {
 * the download process may take a long time!
 */
 export function downloadAttachmentBlob(block: AttachmentBlockComponent) {
-  const { host, model, blobUrl, resourceController } = block;
+  const { host, model, blobUrl, blobState$ } = block;

-  if (resourceController.state$.peek().downloading) {
+  if (blobState$.peek().downloading) {
    toast(host, 'Download in progress...');
    return;
  }
@@ -54,7 +56,7 @@ export function downloadAttachmentBlob(block: AttachmentBlockComponent) {
    return;
  }

-  resourceController.updateState({ downloading: true });
+  block.updateBlobState({ downloading: true });

  toast(host, `Downloading ${shortName}`);

@@ -65,14 +67,34 @@ export function downloadAttachmentBlob(block: AttachmentBlockComponent) {
  tmpLink.dispatchEvent(event);
  tmpLink.remove();

-  resourceController.updateState({ downloading: false });
+  block.updateBlobState({ downloading: false });
 }

-export async function refreshData(block: AttachmentBlockComponent) {
+export async function refreshData(
+  std: BlockStdScope,
+  block: AttachmentBlockComponent
+) {
  const model = block.model;
+  const sourceId = model.props.sourceId$.peek();
+  if (!sourceId) return;
+
+  const blobUrl = block.blobUrl;
+  if (blobUrl) {
+    URL.revokeObjectURL(blobUrl);
+    block.blobUrl = null;
+  }
+
+  let blob = await std.store.blobSync.get(sourceId);
+  if (!blob) {
+    block.updateBlobState({ errorMessage: 'File not found' });
+    return;
+  }
+
  const type = model.props.type$.peek();

-  await block.resourceController.refreshUrlWith(type);
+  blob = new Blob([blob], { type });
+
+  block.blobUrl = URL.createObjectURL(blob);
 }

 export async function getFileType(file: File) {
@@ -82,7 +104,7 @@ export async function getFileType(file: File) {
  const buffer = await file.arrayBuffer();
  const FileType = await import('file-type');
  const fileType = await FileType.fileTypeFromBuffer(buffer);
-  return fileType?.mime ?? '';
+  return fileType ? fileType.mime : '';
 }

 function hasExceeded(
@@ -7,7 +7,6 @@ import { SlashMenuConfigExtension } from '@blocksuite/affine-widget-slash-menu';
 import { BlockViewExtension, FlavourExtension } from '@blocksuite/std';
 import { literal } from 'lit/static-html.js';

-import { AttachmentBlockInteraction } from './attachment-edgeless-block.js';
 import { AttachmentDropOption } from './attachment-service.js';
 import { attachmentSlashMenuConfig } from './configs/slash-menu.js';
 import { createBuiltinToolbarConfigExtension } from './configs/toolbar';
@@ -45,7 +44,6 @@ export class AttachmentViewExtension extends ViewExtensionProvider {
    ]);
    if (this.isEdgeless(context.scope)) {
      context.register(EdgelessClipboardAttachmentConfig);
-      context.register(AttachmentBlockInteraction);
    }
  }
 }
@@ -7,6 +7,7 @@
  },
  "include": ["./src"],
  "references": [
+    { "path": "../embed" },
    { "path": "../surface" },
    { "path": "../../components" },
    { "path": "../../ext-loader" },
@@ -11,7 +11,6 @@
  "license": "MIT",
  "dependencies": {
    "@blocksuite/affine-block-embed": "workspace:*",
-    "@blocksuite/affine-block-embed-doc": "workspace:*",
    "@blocksuite/affine-block-surface": "workspace:*",
    "@blocksuite/affine-components": "workspace:*",
    "@blocksuite/affine-ext-loader": "workspace:*",
@@ -24,7 +23,7 @@
    "@blocksuite/store": "workspace:*",
    "@lit/context": "^1.1.2",
    "@preact/signals-core": "^1.8.0",
-    "@toeverything/theme": "^1.1.14",
+    "@toeverything/theme": "^1.1.12",
    "lit": "^3.2.0",
    "minimatch": "^10.0.1",
    "rxjs": "^7.8.1",
@@ -32,7 +31,7 @@
    "zod": "^3.23.8"
  },
  "devDependencies": {
-    "vitest": "3.1.3"
+    "vitest": "3.1.1"
  },
  "exports": {
    ".": "./src/index.ts",
@@ -140,16 +140,4 @@ Some text in between
    `.trim();
    expect(footnoteUrlPreprocessor(input)).toBe(expected);
  });
-
-  it('should encode partial encoded URLs in footnote definitions', () => {
-    const input = `
-[^ref]: {"type":"url","url":"https://zh.wikipedia.org/zh-hans/%E5%B0%8F%E7%B1%B3SU7"}
-[^ref2]: {"type":"url","url":"https://www.dw.com/zh/%E5%B0%8F%E7%B1%B3%E9%A6%96%E6%AC%BE%E6%B1%BD%E8%BD%A6%E5%8F%91%E5%B8%83-su7%E8%B5%B7%E4%BB%B72159%E4%B8%87%E5%85%83/a-68693432"}
-  `.trim();
-    const expected = `
-[^ref]: {"type":"url","url":"https%3A%2F%2Fzh.wikipedia.org%2Fzh-hans%2F%25E5%25B0%258F%25E7%25B1%25B3SU7"}
-[^ref2]: {"type":"url","url":"https%3A%2F%2Fwww.dw.com%2Fzh%2F%25E5%25B0%258F%25E7%25B1%25B3%25E9%25A6%2596%25E6%25AC%25BE%25E6%25B1%25BD%25E8%25BD%25A6%25E5%258F%2591%25E5%25B8%2583-su7%25E8%25B5%25B7%25E4%25BB%25B72159%25E4%25B8%2587%25E5%2585%2583%2Fa-68693432"}
-    `.trim();
-    expect(footnoteUrlPreprocessor(input)).toBe(expected);
-  });
 });
@@ -23,17 +23,12 @@ type FootnoteDefinition = {
  content: FootNoteReferenceParams;
 };

-/**
- * Check if a URL is already encoded with encodeURIComponent to avoid markdown link parsing
- * @example
- * https://example.com/path%20with%20spaces should return false
- * https://example.com/ should return false
- * https%3A%2F%2Fexample.com%2F should return true
- */
-function isFullyEncoded(uri: string): boolean {
+// Check if a URL is already encoded with encodeURIComponent
+function isEncoded(uri: string): boolean {
  try {
-    // Should check if the components of the URI are fully encoded
-    return uri === encodeURIComponent(decodeURIComponent(uri));
+    // If decoding produces a different result than the original,
+    // then the URI contains encoded characters
+    return uri !== decodeURIComponent(uri);
  } catch {
    // If decoding fails, the URI contains invalid percent-encoding
    return true;
@@ -199,10 +194,10 @@ class FootnoteParser {
  // Process URLs in footnote content
  private processUrls(footnote: FootnoteDefinition): FootnoteDefinition {
    const content = footnote.content;
-    if (content.url && !isFullyEncoded(content.url)) {
+    if (content.url && !isEncoded(content.url)) {
      content.url = encodeURIComponent(content.url);
    }
-    if (content.favicon && !isFullyEncoded(content.favicon)) {
+    if (content.favicon && !isEncoded(content.favicon)) {
      content.favicon = encodeURIComponent(content.favicon);
    }
    return footnote;
@@ -2,17 +2,10 @@ import {
  CaptionedBlockComponent,
  SelectedStyle,
 } from '@blocksuite/affine-components/caption';
-import type {
-  BookmarkBlockModel,
-  LinkPreviewData,
-} from '@blocksuite/affine-model';
-import { ImageProxyService } from '@blocksuite/affine-shared/adapters';
-import {
-  DocModeProvider,
-  LinkPreviewServiceIdentifier,
-} from '@blocksuite/affine-shared/services';
+import type { BookmarkBlockModel } from '@blocksuite/affine-model';
+import { DocModeProvider } from '@blocksuite/affine-shared/services';
 import { BlockSelection } from '@blocksuite/std';
-import { computed, type ReadonlySignal, signal } from '@preact/signals-core';
+import { computed, type ReadonlySignal } from '@preact/signals-core';
 import { html } from 'lit';
 import { property, query } from 'lit/decorators.js';
 import { type ClassInfo, classMap } from 'lit/directives/class-map.js';
@@ -35,62 +28,6 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc

  protected containerStyleMap!: ReturnType<typeof styleMap>;

-  /**
-   * @description Local link preview data
-   * When the doc is in readonly mode, and the link preview data are not provided (stored in the block model),
-   * We will use the local link preview data fetched from the link previewer service to render the block.
-   */
-  private readonly _localLinkPreview$ = signal<LinkPreviewData>({
-    icon: null,
-    title: null,
-    description: null,
-    image: null,
-  });
-
-  /**
-   * @description Link preview data for actual rendering
-   * When the doc is not in readonly mode, and the link preview data are provided (stored in the block model),
-   * We will use the model props to render the block.
-   * Otherwise, we will use the local link preview data to render the block.
-   */
-  linkPreview$ = computed(() => {
-    const modelProps = this.model.props;
-    const local = this._localLinkPreview$.value;
-    return {
-      icon: modelProps.icon$.value ?? local.icon ?? null,
-      title: modelProps.title$.value ?? local.title ?? null,
-      description: modelProps.description$.value ?? local.description ?? null,
-      image: modelProps.image$.value ?? local.image ?? null,
-    };
-  });
-
-  private readonly _updateLocalLinkPreview = () => {
-    // cancel any inflight request
-    this._fetchAbortController?.abort();
-    this._fetchAbortController = new AbortController();
-
-    this.loading = true;
-    this.error = false;
-
-    this.std
-      .get(LinkPreviewServiceIdentifier)
-      .query(this.model.props.url, this._fetchAbortController.signal)
-      .then(data => {
-        this._localLinkPreview$.value = {
-          icon: data.icon ?? null,
-          title: data.title ?? null,
-          description: data.description ?? null,
-          image: data.image ?? null,
-        };
-      })
-      .catch(() => {
-        this.error = true;
-      })
-      .finally(() => {
-        this.loading = false;
-      });
-  };
-
  selectBlock = () => {
    const selectionManager = this.std.selection;
    const blockSelection = selectionManager.create(BlockSelection, {
@@ -120,38 +57,17 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc
    );
  }

-  get imageProxyService() {
-    return this.std.get(ImageProxyService);
-  }
-
-  handleClick = (event: MouseEvent) => {
-    event.stopPropagation();
-
-    if (
-      this.model.parent?.flavour !== 'affine:surface' &&
-      !this.store.readonly
-    ) {
-      this.selectBlock();
-    }
-  };
-
-  handleDoubleClick = (event: MouseEvent) => {
-    event.stopPropagation();
-    this.open();
-  };
-
  private readonly _renderCitationView = () => {
-    const { url, footnoteIdentifier } = this.model.props;
-    const { icon, title, description } = this.linkPreview$.value;
-    const iconSrc = icon ? this.imageProxyService.buildUrl(icon) : undefined;
+    const { title, description, url, icon, footnoteIdentifier } =
+      this.model.props;
    return html`
      <affine-citation-card
-        .icon=${iconSrc}
+        .icon=${icon}
        .citationTitle=${title || url}
        .citationContent=${description}
        .citationIdentifier=${footnoteIdentifier}
-        .onClickCallback=${this.handleClick}
-        .onDoubleClickCallback=${this.handleDoubleClick}
+        .onClickCallback=${this.selectBlock}
+        .onDoubleClickCallback=${this.open}
        .active=${this.selected$.value}
      ></affine-citation-card>
    `;
@@ -181,17 +97,10 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc

    this.contentEditable = 'false';

-    if (
-      (!this.model.props.description && !this.model.props.title) ||
-      (!this.model.props.image && this.model.props.style === 'vertical')
-    ) {
-      // 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.store.readonly) {
-        this._updateLocalLinkPreview();
+    if (!this.model.props.description && !this.model.props.title) {
+      if (this.doc.readonly) {
        return;
      }
-      // Otherwise, we should refresh the data to the model props
      this.refreshData();
    }

@@ -1,10 +1,8 @@
-import { BookmarkBlockSchema } from '@blocksuite/affine-model';
 import {
  EMBED_CARD_HEIGHT,
  EMBED_CARD_WIDTH,
 } from '@blocksuite/affine-shared/consts';
 import { toGfxBlockComponent } from '@blocksuite/std';
-import { GfxViewInteractionExtension } from '@blocksuite/std/gfx';
 import { type StyleInfo, styleMap } from 'lit/directives/style-map.js';

 import { BookmarkBlockComponent } from './bookmark-block.js';
@@ -52,24 +50,6 @@ export class BookmarkEdgelessBlockComponent extends toGfxBlockComponent(
  };
 }

-export const BookmarkBlockInteraction = GfxViewInteractionExtension(
-  BookmarkBlockSchema.model.flavour,
-  {
-    resizeConstraint: {
-      lockRatio: true,
-    },
-    handleRotate: () => {
-      return {
-        beforeRotate(context) {
-          context.set({
-            rotatable: false,
-          });
-        },
-      };
-    },
-  }
-);
-
 declare global {
  interface HTMLElementTagNameMap {
    'affine-edgeless-bookmark': BookmarkEdgelessBlockComponent;
@@ -4,7 +4,6 @@ import type { ExtensionType } from '@blocksuite/store';
 import { literal } from 'lit/static-html.js';

 import { BookmarkBlockAdapterExtensions } from './adapters/extension';
-import { BookmarkBlockInteraction } from './bookmark-edgeless-block';
 import { BookmarkSlashMenuConfigExtension } from './configs/slash-menu';
 import { createBuiltinToolbarConfigExtension } from './configs/toolbar';

@@ -17,7 +16,6 @@ export const BookmarkBlockSpec: ExtensionType[] = [
      ? literal`affine-edgeless-bookmark`
      : literal`affine-bookmark`;
  }),
-  BookmarkBlockInteraction,
  BookmarkBlockAdapterExtensions,
  createBuiltinToolbarConfigExtension(flavour),
  BookmarkSlashMenuConfigExtension,
@@ -1,15 +1,10 @@
-import { insertEmbedIframeWithUrlCommand } from '@blocksuite/affine-block-embed';
 import {
  type InsertedLinkType,
+  insertEmbedIframeWithUrlCommand,
  insertEmbedLinkedDocCommand,
-  insertEmbedSyncedDocCommand,
  type LinkableFlavour,
-} from '@blocksuite/affine-block-embed-doc';
-import {
-  DocModeProvider,
-  EditorSettingProvider,
-  QuickSearchProvider,
-} from '@blocksuite/affine-shared/services';
+} from '@blocksuite/affine-block-embed';
+import { QuickSearchProvider } from '@blocksuite/affine-shared/services';
 import type { Command } from '@blocksuite/std';

 import { insertBookmarkCommand } from './insert-bookmark';
@@ -31,26 +26,12 @@ export const insertLinkByQuickSearchCommand: Command<

      // add linked doc
      if ('docId' in result) {
-        const editorMode = std.get(DocModeProvider).getEditorMode();
-        const editorSettings = std.get(EditorSettingProvider);
-        let flavour: LinkableFlavour = 'affine:embed-linked-doc';
-        if (editorMode === 'edgeless') {
-          flavour =
-            editorSettings.setting$.value.docCanvasPreferView ?? flavour;
-        }
-
-        const insertCommand =
-          flavour === 'affine:embed-linked-doc'
-            ? insertEmbedLinkedDocCommand
-            : insertEmbedSyncedDocCommand;
-
-        std.command.exec(insertCommand, {
+        std.command.exec(insertEmbedLinkedDocCommand, {
          docId: result.docId,
          params: result.params,
        });
-
        return {
-          flavour,
+          flavour: 'affine:embed-linked-doc',
        };
      }

@@ -18,6 +18,20 @@ export class BookmarkCard extends SignalWatcher(
 ) {
  static override styles = styles;

+  private _handleClick(event: MouseEvent) {
+    event.stopPropagation();
+    const model = this.bookmark.model;
+
+    if (model.parent?.flavour !== 'affine:surface') {
+      this.bookmark.selectBlock();
+    }
+  }
+
+  private _handleDoubleClick(event: MouseEvent) {
+    event.stopPropagation();
+    this.bookmark.open();
+  }
+
  override connectedCallback(): void {
    super.connectedCallback();

@@ -35,9 +49,8 @@ export class BookmarkCard extends SignalWatcher(
  }

  override render() {
-    const { url, style } = this.bookmark.model.props;
-    const { icon, title, description, image } =
-      this.bookmark.linkPreview$.value;
+    const { icon, title, url, description, image, style } =
+      this.bookmark.model.props;

    const cardClassMap = classMap({
      loading: this.loading,
@@ -61,7 +74,7 @@ export class BookmarkCard extends SignalWatcher(

    const theme = this.bookmark.std.get(ThemeProvider).theme;
    const { LoadingIcon, EmbedCardBannerIcon } = getEmbedCardIcons(theme);
-    const imageProxyService = this.bookmark.store.get(ImageProxyService);
+    const imageProxyService = this.bookmark.doc.get(ImageProxyService);

    const titleIcon = this.loading
      ? LoadingIcon
@@ -85,8 +98,8 @@ export class BookmarkCard extends SignalWatcher(
    return html`
      <div
        class="affine-bookmark-card ${cardClassMap}"
-        @click=${this.bookmark.handleClick}
-        @dblclick=${this.bookmark.handleDoubleClick}
+        @click=${this._handleClick}
+        @dblclick=${this._handleDoubleClick}
      >
        <div class="affine-bookmark-content">
          <div class="affine-bookmark-content-title">
@@ -1,4 +1,3 @@
-import { DefaultTool } from '@blocksuite/affine-block-surface';
 import { toggleEmbedCardCreateModal } from '@blocksuite/affine-components/embed-card-modal';
 import { BookmarkBlockSchema } from '@blocksuite/affine-model';
 import {
@@ -6,7 +5,6 @@ import {
  SlashMenuConfigIdentifier,
 } from '@blocksuite/affine-widget-slash-menu';
 import { LinkIcon } from '@blocksuite/icons/lit';
-import { GfxControllerIdentifier } from '@blocksuite/std/gfx';
 import type { ExtensionType } from '@blocksuite/store';

 import { LinkTooltip } from './tooltips';
@@ -23,10 +21,10 @@ const bookmarkSlashMenuConfig: SlashMenuConfig = {
      },
      group: '4_Content & Media@2',
      when: ({ model }) =>
-        model.store.schema.flavourSchemaMap.has('affine:bookmark'),
+        model.doc.schema.flavourSchemaMap.has('affine:bookmark'),
      action: ({ std, model }) => {
        const { host } = std;
-        const parentModel = host.store.getParent(model);
+        const parentModel = host.doc.getParent(model);
        if (!parentModel) {
          return;
        }
@@ -35,17 +33,11 @@ const bookmarkSlashMenuConfig: SlashMenuConfig = {
          host,
          'Links',
          'The added link will be displayed as a card view.',
-          { mode: 'page', parentModel, index },
-          ({ mode }) => {
-            if (mode === 'edgeless') {
-              const gfx = std.get(GfxControllerIdentifier);
-              gfx.tool.setTool(DefaultTool);
-            }
-          }
+          { mode: 'page', parentModel, index }
        )
          .then(() => {
            if (model.text?.length === 0) {
-              model.store.deleteBlock(model);
+              model.doc.deleteBlock(model);
            }
          })
          .catch(console.error);
@@ -1,4 +1,4 @@
-import { LinkPreviewServiceIdentifier } from '@blocksuite/affine-shared/services';
+import { LinkPreviewerService } from '@blocksuite/affine-shared/services';
 import { isAbortError } from '@blocksuite/affine-shared/utils';

 import type { BookmarkBlockComponent } from './bookmark-block.js';
@@ -15,7 +15,7 @@ export async function refreshBookmarkUrlData(
  try {
    bookmarkElement.loading = true;

-    const linkPreviewer = bookmarkElement.std.get(LinkPreviewServiceIdentifier);
+    const linkPreviewer = bookmarkElement.doc.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.store.updateBlock(bookmarkElement.model, {
+    bookmarkElement.doc.updateBlock(bookmarkElement.model, {
      title,
      description,
      icon,
@@ -6,7 +6,6 @@ import { BookmarkBlockSchema } from '@blocksuite/affine-model';
 import { BlockViewExtension, FlavourExtension } from '@blocksuite/std';
 import { literal } from 'lit/static-html.js';

-import { BookmarkBlockInteraction } from './bookmark-edgeless-block';
 import { BookmarkSlashMenuConfigExtension } from './configs/slash-menu';
 import { createBuiltinToolbarConfigExtension } from './configs/toolbar';
 import { EdgelessClipboardBookmarkConfig } from './edgeless-clipboard-config';
@@ -37,7 +36,6 @@ export class BookmarkViewExtension extends ViewExtensionProvider {
    const isEdgeless = this.isEdgeless(context.scope);
    if (isEdgeless) {
      context.register(EdgelessClipboardBookmarkConfig);
-      context.register(BookmarkBlockInteraction);
    }
  }
 }
@@ -8,7 +8,6 @@
  "include": ["./src"],
  "references": [
    { "path": "../embed" },
-    { "path": "../embed-doc" },
    { "path": "../surface" },
    { "path": "../../components" },
    { "path": "../../ext-loader" },
@@ -25,7 +25,7 @@
    "@floating-ui/dom": "^1.6.10",
    "@lit/context": "^1.1.2",
    "@preact/signals-core": "^1.8.0",
-    "@toeverything/theme": "^1.1.14",
+    "@toeverything/theme": "^1.1.12",
    "@types/mdast": "^4.0.4",
    "emoji-mart": "^5.6.0",
    "lit": "^3.2.0",
@@ -1,88 +0,0 @@
-import { CalloutBlockSchema } from '@blocksuite/affine-model';
-import {
-  BlockMarkdownAdapterExtension,
-  type BlockMarkdownAdapterMatcher,
-  getCalloutEmoji,
-  isCalloutNode,
-} from '@blocksuite/affine-shared/adapters';
-import { nanoid } from '@blocksuite/store';
-
-// Currently, the callout block children can only be paragraph block or list block
-// In mdast, the node types are `paragraph`, `list`, `heading`, `blockquote`
-const CALLOUT_BLOCK_CHILDREN_TYPES = new Set([
-  'paragraph',
-  'list',
-  'heading',
-  'blockquote',
-]);
-
-export const calloutBlockMarkdownAdapterMatcher: BlockMarkdownAdapterMatcher = {
-  flavour: CalloutBlockSchema.model.flavour,
-  toMatch: o => isCalloutNode(o.node),
-  fromMatch: o => o.node.flavour === CalloutBlockSchema.model.flavour,
-  toBlockSnapshot: {
-    enter: (o, context) => {
-      if (!o.node.data || !isCalloutNode(o.node)) {
-        return;
-      }
-
-      // Currently, the callout block children can only be a paragraph or a list
-      // So we should filter out the other children
-      o.node.children = o.node.children.filter(child =>
-        CALLOUT_BLOCK_CHILDREN_TYPES.has(child.type)
-      );
-
-      const { walkerContext } = context;
-      const calloutEmoji = getCalloutEmoji(o.node);
-      walkerContext.openNode(
-        {
-          type: 'block',
-          id: nanoid(),
-          flavour: CalloutBlockSchema.model.flavour,
-          props: {
-            emoji: calloutEmoji,
-          },
-          children: [],
-        },
-        'children'
-      );
-    },
-    leave: (o, context) => {
-      const { walkerContext } = context;
-      if (isCalloutNode(o.node)) {
-        walkerContext.closeNode();
-      }
-    },
-  },
-  fromBlockSnapshot: {
-    enter: (o, context) => {
-      const emoji = o.node.props.emoji as string;
-      const { walkerContext } = context;
-      walkerContext
-        .openNode(
-          {
-            type: 'blockquote',
-            children: [],
-          },
-          'children'
-        )
-        .openNode({
-          type: 'paragraph',
-          children: [
-            {
-              type: 'text',
-              value: `[!${emoji}]`,
-            },
-          ],
-        })
-        .closeNode();
-    },
-    leave: (_, context) => {
-      const { walkerContext } = context;
-      walkerContext.closeNode();
-    },
-  },
-};
-
-export const CalloutBlockMarkdownAdapterExtension =
-  BlockMarkdownAdapterExtension(calloutBlockMarkdownAdapterMatcher);
@@ -3,7 +3,6 @@ import { BlockViewExtension, FlavourExtension } from '@blocksuite/std';
 import type { ExtensionType } from '@blocksuite/store';
 import { literal } from 'lit/static-html.js';

-import { CalloutBlockMarkdownAdapterExtension } from './adapters/markdown';
 import { CalloutKeymapExtension } from './callout-keymap';
 import { calloutSlashMenuConfig } from './configs/slash-menu';

@@ -12,5 +11,4 @@ export const CalloutBlockSpec: ExtensionType[] = [
  BlockViewExtension('affine:callout', literal`affine-callout`),
  CalloutKeymapExtension,
  SlashMenuConfigExtension('affine:callout', calloutSlashMenuConfig),
-  CalloutBlockMarkdownAdapterExtension,
 ];
@@ -33,24 +33,19 @@ export const calloutSlashMenuConfig: SlashMenuConfig = {
      when: ({ std, model }) => {
        return (
          std.get(FeatureFlagService).getFlag('enable_callout') &&
-          !isInsideBlockByFlavour(model.store, model, 'affine:edgeless-text')
+          !isInsideBlockByFlavour(model.doc, model, 'affine:edgeless-text')
        );
      },
      action: ({ model, std }) => {
-        const { store } = model;
-        const parent = store.getParent(model);
+        const { doc } = model;
+        const parent = doc.getParent(model);
        if (!parent) return;

        const index = parent.children.indexOf(model);
        if (index === -1) return;
-        const calloutId = store.addBlock(
-          'affine:callout',
-          {},
-          parent,
-          index + 1
-        );
+        const calloutId = doc.addBlock('affine:callout', {}, parent, index + 1);
        if (!calloutId) return;
-        const paragraphId = store.addBlock('affine:paragraph', {}, calloutId);
+        const paragraphId = doc.addBlock('affine:paragraph', {}, calloutId);
        if (!paragraphId) return;
        std.host.updateComplete
          .then(() => {
@@ -4,14 +4,11 @@ import {
 } from '@blocksuite/affine-ext-loader';
 import { CalloutBlockSchemaExtension } from '@blocksuite/affine-model';

-import { CalloutBlockMarkdownAdapterExtension } from './adapters/markdown';
-
 export class CalloutStoreExtension extends StoreExtensionProvider {
  override name = 'affine-callout-block';

  override setup(context: StoreExtensionContext) {
    super.setup(context);
    context.register(CalloutBlockSchemaExtension);
-    context.register(CalloutBlockMarkdownAdapterExtension);
  }
 }
@@ -27,7 +27,7 @@
    "@floating-ui/dom": "^1.6.13",
    "@lit/context": "^1.1.2",
    "@preact/signals-core": "^1.8.0",
-    "@toeverything/theme": "^1.1.14",
+    "@toeverything/theme": "^1.1.12",
    "@types/mdast": "^4.0.4",
    "lit": "^3.2.0",
    "minimatch": "^10.0.1",
@@ -26,13 +26,11 @@ import { computed, effect, type Signal, signal } from '@preact/signals-core';
 import { html, nothing, type TemplateResult } from 'lit';
 import { query } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
-import { styleMap } from 'lit/directives/style-map.js';
 import { bundledLanguagesInfo, type ThemedToken } from 'shiki';

 import { CodeBlockConfigExtension } from './code-block-config.js';
 import { CodeBlockInlineManagerExtension } from './code-block-inline.js';
 import { CodeBlockHighlighter } from './code-block-service.js';
-import { CodeBlockPreviewIdentifier } from './code-preview-extension.js';
 import { codeBlockStyles } from './styles.js';

 export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel> {
@@ -68,7 +66,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
  }

  get readonly() {
-    return this.store.readonly;
+    return this.doc.readonly;
  }

  get langs() {
@@ -226,7 +224,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
        return;
      },
      Tab: ctx => {
-        if (this.store.readonly) return;
+        if (this.doc.readonly) return;
        const state = ctx.get('keyboardState');
        const event = state.raw;
        const inlineEditor = this.inlineEditor;
@@ -334,10 +332,10 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
        return true;
      },
      Delete: () => {
-        return;
+        return true;
      },
      Enter: () => {
-        this.store.captureSync();
+        this.doc.captureSync();
        return true;
      },
      'Mod-Enter': () => {
@@ -348,16 +346,11 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
        if (!inlineRange || !inlineEditor) return;
        const isEnd = model.props.text.length === inlineRange.index;
        if (!isEnd) return;
-        const parent = this.store.getParent(model);
+        const parent = this.doc.getParent(model);
        if (!parent) return;
        const index = parent.children.indexOf(model);
        if (index === -1) return;
-        const id = this.store.addBlock(
-          'affine:paragraph',
-          {},
-          parent,
-          index + 1
-        );
+        const id = this.doc.addBlock('affine:paragraph', {}, parent, index + 1);
        focusTextModel(std, id);
        return true;
      },
@@ -368,7 +361,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>

  copyCode() {
    const model = this.model;
-    const slice = Slice.fromModels(model.store, [model]);
+    const slice = Slice.fromModels(model.doc, [model]);
    this.std.clipboard
      .copySlice(slice)
      .then(() => {
@@ -391,12 +384,6 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
      this.std.getOptional(CodeBlockConfigExtension.identifier)
        ?.showLineNumbers ?? true;

-    const preview = !!this.model.props.preview;
-    const previewContext = this.std.getOptional(
-      CodeBlockPreviewIdentifier(this.model.props.language ?? '')
-    );
-    const shouldRenderPreview = preview && previewContext;
-
    return html`
      <div
        class=${classMap({
@@ -406,15 +393,12 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
        })}
      >
        <rich-text
-          style=${styleMap({
-            display: shouldRenderPreview ? 'none' : undefined,
-          })}
          .yText=${this.model.props.text.yText}
          .inlineEventSource=${this.topContenteditableElement ?? nothing}
-          .undoManager=${this.store.history.undoManager}
+          .undoManager=${this.doc.history}
          .attributesSchema=${this.inlineManager.getSchema()}
          .attributeRenderer=${this.inlineManager.getRenderer()}
-          .readonly=${this.store.readonly}
+          .readonly=${this.doc.readonly}
          .inlineRangeProvider=${this._inlineRangeProvider}
          .enableClipboard=${false}
          .enableUndoRedo=${false}
@@ -432,22 +416,14 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
            : undefined}
        >
        </rich-text>
-        <div
-          style=${styleMap({
-            display: shouldRenderPreview ? undefined : 'none',
-          })}
-          contenteditable="false"
-          class="affine-code-block-preview"
-        >
-          ${previewContext?.renderer(this.model)}
-        </div>
+
        ${this.renderChildren(this.model)} ${Object.values(this.widgets)}
      </div>
    `;
  }

  setWrap(wrap: boolean) {
-    this.store.updateBlock(this.model, { wrap });
+    this.doc.updateBlock(this.model, { wrap });
  }

  @query('rich-text')
@@ -1,27 +0,0 @@
-import type { CodeBlockModel } from '@blocksuite/affine-model';
-import { createIdentifier } from '@blocksuite/global/di';
-import type { ExtensionType } from '@blocksuite/store';
-import type { HTMLTemplateResult } from 'lit';
-
-export type CodeBlockPreviewRenderer = (
-  model: CodeBlockModel
-) => HTMLTemplateResult | null;
-
-export type CodeBlockPreviewContext = {
-  renderer: CodeBlockPreviewRenderer;
-  lang: string;
-};
-
-export const CodeBlockPreviewIdentifier =
-  createIdentifier<CodeBlockPreviewContext>('CodeBlockPreview');
-
-export function CodeBlockPreviewExtension(
-  lang: string,
-  renderer: CodeBlockPreviewRenderer
-): ExtensionType {
-  return {
-    setup: di => {
-      di.addImpl(CodeBlockPreviewIdentifier(lang), { renderer, lang });
-    },
-  };
-}
@@ -30,6 +30,7 @@ export class AffineCodeToolbar extends WithDisposable(LitElement) {
      padding: 4px;
      margin: 0;
      display: flex;
+      justify-content: flex-end;
    }

    .code-toolbar-button {
@@ -38,10 +39,6 @@ export class AffineCodeToolbar extends WithDisposable(LitElement) {
      box-shadow: var(--affine-shadow-1);
      border-radius: 4px;
    }
-
-    .copy-code {
-      margin-left: auto;
-    }
  `;

  private _currentOpenMenu: AbortController | null = null;
@@ -18,6 +18,10 @@ export class LanguageListButton extends WithDisposable(
  SignalWatcher(LitElement)
 ) {
  static override styles = css`
+    :host {
+      margin-right: auto;
+    }
+
    .lang-button {
      background-color: var(--affine-background-primary-color);
      box-shadow: var(--affine-shadow-1);
@@ -49,7 +53,7 @@ export class LanguageListButton extends WithDisposable(
  private _abortController?: AbortController;

  private readonly _clickLangBtn = () => {
-    if (this.blockComponent.store.readonly) return;
+    if (this.blockComponent.doc.readonly) return;
    if (this._abortController) {
      // Close the language list if it's already opened.
      this._abortController.abort();
@@ -71,7 +75,7 @@ export class LanguageListButton extends WithDisposable(
          sortedBundledLanguages.splice(index, 1);
          sortedBundledLanguages.unshift(item);
        }
-        this.blockComponent.store.transact(() => {
+        this.blockComponent.doc.transact(() => {
          this.blockComponent.model.props.language$.value = item.name;
        });
      },
@@ -134,10 +138,10 @@ export class LanguageListButton extends WithDisposable(
      </div>`}
      height="24px"
      @click=${this._clickLangBtn}
-      ?disabled=${this.blockComponent.store.readonly}
+      ?disabled=${this.blockComponent.doc.readonly}
    >
      <span class="lang-button-icon" slot="suffix">
-        ${!this.blockComponent.store.readonly ? ArrowDownIcon : nothing}
+        ${!this.blockComponent.doc.readonly ? ArrowDownIcon : nothing}
      </span>
    </icon-button> `;
  }
@@ -1,97 +0,0 @@
-import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
-import { SignalWatcher, WithDisposable } from '@blocksuite/global/lit';
-import { css, html, LitElement, nothing } from 'lit';
-import { property } from 'lit/decorators.js';
-import { classMap } from 'lit/directives/class-map.js';
-
-import type { CodeBlockComponent } from '../../code-block';
-import { CodeBlockPreviewIdentifier } from '../../code-preview-extension';
-
-export class PreviewButton extends WithDisposable(SignalWatcher(LitElement)) {
-  static override styles = css`
-    .preview-toggle-container {
-      display: flex;
-      padding: 2px;
-      align-items: flex-start;
-      gap: 4px;
-      border-radius: 4px;
-      background: ${unsafeCSSVarV2('segment/background')};
-    }
-
-    .toggle-button {
-      display: flex;
-      padding: 0px 4px;
-      justify-content: center;
-      align-items: center;
-      gap: 4px;
-      border-radius: 4px;
-      color: ${unsafeCSSVarV2('text/primary')};
-      font-family: Inter;
-      font-size: 12px;
-      font-style: normal;
-      font-weight: 500;
-      line-height: 20px;
-    }
-
-    .toggle-button:hover {
-      background: ${unsafeCSSVarV2('layer/background/hoverOverlay')};
-    }
-
-    .toggle-button.active {
-      background: ${unsafeCSSVarV2('segment/button')};
-      box-shadow:
-        var(--Shadow-buttonShadow-1-x, 0px) var(--Shadow-buttonShadow-1-y, 0px)
-          var(--Shadow-buttonShadow-1-blur, 1px) 0px
-          var(--Shadow-buttonShadow-1-color, rgba(0, 0, 0, 0.12)),
-        var(--Shadow-buttonShadow-2-x, 0px) var(--Shadow-buttonShadow-2-y, 1px)
-          var(--Shadow-buttonShadow-2-blur, 5px) 0px
-          var(--Shadow-buttonShadow-2-color, rgba(0, 0, 0, 0.12));
-    }
-  `;
-
-  private readonly _toggle = (value: boolean) => {
-    if (this.blockComponent.store.readonly) return;
-
-    this.blockComponent.store.updateBlock(this.blockComponent.model, {
-      preview: value,
-    });
-  };
-
-  get preview() {
-    return !!this.blockComponent.model.props.preview$.value;
-  }
-
-  override render() {
-    const lang = this.blockComponent.model.props.language$.value ?? '';
-    const previewContext = this.blockComponent.std.getOptional(
-      CodeBlockPreviewIdentifier(lang)
-    );
-    if (!previewContext) return nothing;
-
-    return html`
-      <div class="preview-toggle-container">
-        <div
-          class=${classMap({
-            'toggle-button': true,
-            active: !this.preview,
-          })}
-          @click=${() => this._toggle(false)}
-        >
-          Code
-        </div>
-        <div
-          class=${classMap({
-            'toggle-button': true,
-            active: this.preview,
-          })}
-          @click=${() => this._toggle(true)}
-        >
-          Preview
-        </div>
-      </div>
-    `;
-  }
-
-  @property({ attribute: false })
-  accessor blockComponent!: CodeBlockComponent;
-}
@@ -42,18 +42,6 @@ export const PRIMARY_GROUPS: MenuItemGroup<CodeBlockToolbarContext>[] = [
          };
        },
      },
-      {
-        type: 'preview',
-        generate: ({ blockComponent }) => {
-          return {
-            action: noop,
-            render: () => html`
-              <preview-button .blockComponent=${blockComponent}>
-              </preview-button>
-            `,
-          };
-        },
-      },
      {
        type: 'copy-code',
        label: 'Copy code',
@@ -8,7 +8,7 @@ export class CodeBlockToolbarContext extends MenuContext {
  };

  get doc() {
-    return this.blockComponent.store;
+    return this.blockComponent.doc;
  }

  get host() {
@@ -12,5 +12,5 @@ export const duplicateCodeBlock = (model: CodeBlockModel) => {
    ...duplicateProps,
  };

-  return model.store.addSiblingBlocks(model, [newProps])[0];
+  return model.doc.addSiblingBlocks(model, [newProps])[0];
 };
@@ -5,7 +5,6 @@ import {
 } from './code-toolbar';
 import { AffineCodeToolbar } from './code-toolbar/components/code-toolbar';
 import { LanguageListButton } from './code-toolbar/components/lang-button';
-import { PreviewButton } from './code-toolbar/components/preview-button';
 import { AffineCodeUnit } from './highlight/affine-code-unit';

 export function effects() {
@@ -14,14 +13,12 @@ export function effects() {
  customElements.define(AFFINE_CODE_TOOLBAR_WIDGET, AffineCodeToolbarWidget);
  customElements.define('affine-code-unit', AffineCodeUnit);
  customElements.define('affine-code', CodeBlockComponent);
-  customElements.define('preview-button', PreviewButton);
 }

 declare global {
  interface HTMLElementTagNameMap {
    'language-list-button': LanguageListButton;
    'affine-code-toolbar': AffineCodeToolbar;
-    'preview-button': PreviewButton;
    [AFFINE_CODE_TOOLBAR_WIDGET]: AffineCodeToolbarWidget;
  }
 }
@@ -3,7 +3,6 @@ export * from './clipboard';
 export * from './code-block';
 export * from './code-block-config';
 export * from './code-block-spec';
-export * from './code-preview-extension';
 export * from './code-toolbar';
 export * from './turbo/code-layout-handler';
 export * from './turbo/code-painter.worker';
@@ -49,8 +49,4 @@ export const codeBlockStyles = css`
    box-sizing: border-box;
    user-select: none;
  }
-
-  affine-code .affine-code-block-preview {
-    padding: 12px;
-  }
 `;
@@ -11,7 +11,6 @@ import {
 import { literal, unsafeStatic } from 'lit/static-html.js';

 import { getCodeClipboardExtensions } from './clipboard/index.js';
-import { CodeBlockConfigExtension } from './code-block-config';
 import {
  CodeBlockInlineManagerExtension,
  CodeBlockUnitSpecExtension,
@@ -22,7 +21,7 @@ import { AFFINE_CODE_TOOLBAR_WIDGET } from './code-toolbar/index.js';
 import { codeSlashMenuConfig } from './configs/slash-menu.js';
 import { effects } from './effects.js';

-const codeToolbarWidget = WidgetViewExtension(
+export const codeToolbarWidget = WidgetViewExtension(
  'affine:code',
  AFFINE_CODE_TOOLBAR_WIDGET,
  literal`${unsafeStatic(AFFINE_CODE_TOOLBAR_WIDGET)}`
@@ -42,6 +41,7 @@ export class CodeBlockViewExtension extends ViewExtensionProvider {
      FlavourExtension('affine:code'),
      CodeBlockHighlighter,
      BlockViewExtension('affine:code', literal`affine-code`),
+      codeToolbarWidget,
      SlashMenuConfigExtension('affine:code', codeSlashMenuConfig),
      CodeKeymapExtension,
      ...getCodeClipboardExtensions(),
@@ -50,14 +50,5 @@ export class CodeBlockViewExtension extends ViewExtensionProvider {
      CodeBlockInlineManagerExtension,
      CodeBlockUnitSpecExtension,
    ]);
-    if (!this.isMobile(context.scope)) {
-      context.register(codeToolbarWidget);
-    } else {
-      context.register(
-        CodeBlockConfigExtension({
-          showLineNumbers: false,
-        })
-      );
-    }
  }
 }
@@ -24,7 +24,7 @@
    "@floating-ui/dom": "^1.6.13",
    "@lit/context": "^1.1.2",
    "@preact/signals-core": "^1.8.0",
-    "@toeverything/theme": "^1.1.14",
+    "@toeverything/theme": "^1.1.12",
    "@types/mdast": "^4.0.4",
    "lit": "^3.2.0",
    "minimatch": "^10.0.1",
@@ -21,21 +21,21 @@ export const dataViewSlashMenuConfig: SlashMenuConfig = {
      },
      group: '7_Database@1',
      when: ({ model, std }) =>
-        !isInsideBlockByFlavour(model.store, model, 'affine:edgeless-text') &&
+        !isInsideBlockByFlavour(model.doc, model, 'affine:edgeless-text') &&
        !!std.get(FeatureFlagService).getFlag('enable_block_query'),

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

        const dataView = std.view.getBlock(
          dataViewModel.id
@@ -43,7 +43,7 @@ export const dataViewSlashMenuConfig: SlashMenuConfig = {
        dataView?.dataSource.viewManager.viewAdd('table');

        if (model.text?.length === 0) {
-          model.store.deleteBlock(model);
+          model.doc.deleteBlock(model);
        }
      },
    },
@@ -60,7 +60,7 @@ export class BlockQueryDataSource extends DataSourceBase {
  }

  get workspace() {
-    return this.host.store.workspace;
+    return this.host.doc.workspace;
  }

  constructor(
@@ -83,18 +83,14 @@ export class BlockQueryDataSource extends DataSourceBase {
    this.workspace.docs.forEach(doc => {
      this.listenToDoc(doc.getStore());
    });
-    this.workspace.slots.docListUpdated.subscribe(() => {
-      this.workspace.docs.forEach(doc => {
-        if (!this.docDisposeMap.has(doc.id)) {
-          this.listenToDoc(doc.getStore());
-        }
-      });
-      this.docDisposeMap.forEach((_, id) => {
-        if (!this.workspace.docs.has(id)) {
-          this.docDisposeMap.get(id)?.();
-          this.docDisposeMap.delete(id);
-        }
-      });
+    this.workspace.slots.docCreated.subscribe(id => {
+      const doc = this.workspace.getDoc(id);
+      if (doc) {
+        this.listenToDoc(doc.getStore());
+      }
+    });
+    this.workspace.slots.docRemoved.subscribe(id => {
+      this.docDisposeMap.get(id)?.();
    });
  }

@@ -173,7 +169,7 @@ export class BlockQueryDataSource extends DataSourceBase {
    insertToPosition: InsertToPosition,
    type: string | undefined
  ): string {
-    const doc = this.block.store;
+    const doc = this.block.doc;
    doc.captureSync();
    const column = DatabaseBlockDataSource.propertiesMap.value[
      type ?? propertyPresets.multiSelectPropertyConfig.type
@@ -296,7 +292,7 @@ export class BlockQueryDataSource extends DataSourceBase {
          ].config.propertyData.default(),
        cells: currentCells.map(() => undefined),
      };
-      this.block.store.captureSync();
+      this.block.doc.captureSync();
      viewColumn.type = toType;
      viewColumn.data = result.property;
      currentCells.forEach((value, i) => {
@@ -104,7 +104,7 @@ export class DataViewBlockComponent extends CaptionedBlockComponent<DataViewBloc
            prefix: CopyIcon,
            name: 'Copy',
            select: () => {
-              const slice = Slice.fromModels(this.store, [this.model]);
+              const slice = Slice.fromModels(this.doc, [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.store.deleteBlock(block);
+                    this.doc.deleteBlock(block);
                  });
-                  this.store.deleteBlock(this.model);
+                  this.doc.deleteBlock(this.model);
                },
              }),
            ],
@@ -237,7 +237,7 @@ export class DataViewBlockComponent extends CaptionedBlockComponent<DataViewBloc
  }

  private renderDatabaseOps() {
-    if (this.store.readonly) {
+    if (this.doc.readonly) {
      return nothing;
    }
    return html` <div class="database-ops" @click="${this._clickDatabaseOps}">
@@ -24,21 +24,21 @@ export class DataViewBlockModel extends BlockModel<Props> {
  }

  applyViewsUpdate() {
-    this.store.updateBlock(this, {
+    this.doc.updateBlock(this, {
      views: this.props.views,
    });
  }

  deleteView(id: string) {
-    this.store.captureSync();
-    this.store.transact(() => {
+    this.doc.captureSync();
+    this.doc.transact(() => {
      this.props.views = this.props.views.filter(v => v.id !== id);
    });
  }

  duplicateView(id: string): string {
-    const newId = this.store.workspace.idGenerator();
-    this.store.transact(() => {
+    const newId = this.doc.workspace.idGenerator();
+    this.doc.transact(() => {
      const index = this.props.views.findIndex(v => v.id === id);
      const view = this.props.views[index];
      if (view) {
@@ -53,7 +53,7 @@ export class DataViewBlockModel extends BlockModel<Props> {
  }

  moveViewTo(id: string, position: InsertToPosition) {
-    this.store.transact(() => {
+    this.doc.transact(() => {
      this.props.views = arrayMove(
        this.props.views,
        v => v.id === id,
@@ -67,7 +67,7 @@ export class DataViewBlockModel extends BlockModel<Props> {
    id: string,
    update: (data: DataViewDataType) => Partial<DataViewDataType>
  ) {
-    this.store.transact(() => {
+    this.doc.transact(() => {
      this.props.views = this.props.views.map(v => {
        if (v.id !== id) {
          return v;
@@ -24,12 +24,12 @@
    "@blocksuite/icons": "^2.2.12",
    "@blocksuite/std": "workspace:*",
    "@blocksuite/store": "workspace:*",
-    "@emotion/css": "^11.13.5",
    "@floating-ui/dom": "^1.6.13",
    "@lit/context": "^1.1.2",
    "@preact/signals-core": "^1.8.0",
-    "@toeverything/theme": "^1.1.14",
+    "@toeverything/theme": "^1.1.12",
    "@types/mdast": "^4.0.4",
+    "@vanilla-extract/css": "^1.17.0",
    "date-fns": "^4.0.0",
    "lit": "^3.2.0",
    "minimatch": "^10.0.1",
@@ -14,19 +14,7 @@ import {
 } from '@blocksuite/icons/lit';
 import type { BlockModel } from '@blocksuite/store';
 import type { TemplateResult } from 'lit';
-const icons: Record<string, TemplateResult> = {
-  text: TextIcon(),
-  quote: QuoteIcon(),
-  h1: Heading1Icon(),
-  h2: Heading2Icon(),
-  h3: Heading3Icon(),
-  h4: Heading4Icon(),
-  h5: Heading5Icon(),
-  h6: Heading6Icon(),
-  bulleted: BulletedListIcon(),
-  numbered: NumberedListIcon(),
-  todo: CheckBoxCheckLinearIcon(),
-};
+
 export const getIcon = (
  model: BlockModel & {
    props: {
@@ -36,10 +24,27 @@ export const getIcon = (
 ): TemplateResult => {
  if (model.flavour === 'affine:paragraph') {
    const type = model.props.type as ParagraphType;
-    return icons[type] ?? TextIcon();
+    return (
+      {
+        text: TextIcon(),
+        quote: QuoteIcon(),
+        h1: Heading1Icon(),
+        h2: Heading2Icon(),
+        h3: Heading3Icon(),
+        h4: Heading4Icon(),
+        h5: Heading5Icon(),
+        h6: Heading6Icon(),
+      } as Record<ParagraphType, TemplateResult>
+    )[type];
  }
  if (model.flavour === 'affine:list') {
-    return icons[model.props.type ?? 'bulleted'] ?? BulletedListIcon();
+    return (
+      {
+        bulleted: BulletedListIcon(),
+        numbered: NumberedListIcon(),
+        todo: CheckBoxCheckLinearIcon(),
+      }[model.props.type ?? 'bulleted'] ?? BulletedListIcon()
+    );
  }
  return TextIcon();
 };
@@ -1,6 +1,10 @@
+import type { MenuOptions } from '@blocksuite/affine-components/context-menu';
+import { type DatabaseBlockModel } from '@blocksuite/affine-model';
 import { ConfigExtensionFactory } from '@blocksuite/std';

-import type { DatabaseViewExtensionOptions } from './view';
+export interface DatabaseOptionsConfig {
+  configure: (model: DatabaseBlockModel, options: MenuOptions) => MenuOptions;
+}

 export const DatabaseConfigExtension =
-  ConfigExtensionFactory<DatabaseViewExtensionOptions>('affine:database');
+  ConfigExtensionFactory<DatabaseOptionsConfig>('affine:database');
@@ -25,7 +25,7 @@ export const databaseSlashMenuConfig: SlashMenuConfig = {
      },
      group: '7_Database@0',
      when: ({ model }) =>
-        !isInsideBlockByFlavour(model.store, model, 'affine:edgeless-text'),
+        !isInsideBlockByFlavour(model.doc, model, 'affine:edgeless-text'),
      action: ({ std }) => {
        std.command
          .chain()
@@ -58,7 +58,7 @@ export const databaseSlashMenuConfig: SlashMenuConfig = {
      },
      group: '7_Database@2',
      when: ({ model }) =>
-        !isInsideBlockByFlavour(model.store, model, 'affine:edgeless-text'),
+        !isInsideBlockByFlavour(model.doc, model, 'affine:edgeless-text'),
      action: ({ std }) => {
        std.command
          .chain()
@@ -1,4 +1,7 @@
-import { createIdentifier } from '@blocksuite/global/di';
+import { createContextKey } from '@blocksuite/data-view';
 import type { EditorHost } from '@blocksuite/std';

-export const EditorHostKey = createIdentifier<EditorHost>('editor-host');
+export const HostContextKey = createContextKey<EditorHost | undefined>(
+  'editor-host',
+  undefined
+);
@@ -2,7 +2,6 @@ import type {
  ColumnDataType,
  ColumnUpdater,
  DatabaseBlockModel,
-  ParagraphBlockModel,
 } from '@blocksuite/affine-model';
 import { getSelectedModelsCommand } from '@blocksuite/affine-shared/commands';
 import { FeatureFlagService } from '@blocksuite/affine-shared/services';
@@ -52,62 +51,7 @@ import {
  databaseBlockViews,
 } from './views/index.js';

-type SpacialProperty = {
-  valueSet: (rowId: string, propertyId: string, value: unknown) => void;
-  valueGet: (rowId: string, propertyId: string) => unknown;
-};
 export class DatabaseBlockDataSource extends DataSourceBase {
-  override get parentProvider() {
-    return this._model.store.provider;
-  }
-  spacialProperties: Record<string, SpacialProperty> = {
-    'created-time': {
-      valueSet: () => {},
-      valueGet: (rowId: string) => {
-        const model = this.getModelById(rowId) as ParagraphBlockModel;
-        if (!model) {
-          return null;
-        }
-        return model.props['meta:createdAt'];
-      },
-    },
-    'created-by': {
-      valueSet: () => {},
-      valueGet: (rowId: string) => {
-        const model = this.getModelById(rowId) as
-          | ParagraphBlockModel
-          | undefined;
-        return model ? model.props['meta:createdBy'] : null;
-      },
-    },
-    type: {
-      valueSet: () => {},
-      valueGet: (rowId: string) => {
-        const model = this.getModelById(rowId);
-        if (!model) {
-          return;
-        }
-        return getIcon(model);
-      },
-    },
-    title: {
-      valueSet: () => {},
-      valueGet: (rowId: string) => {
-        const model = this.getModelById(rowId);
-        if (!model) {
-          return;
-        }
-        return model.text;
-      },
-    },
-  };
-  isSpacialProperty(propertyId: string): boolean {
-    return this.spacialProperties[propertyId] !== undefined;
-  }
-  spacialValueGet(rowId: string, propertyId: string): unknown {
-    return this.spacialProperties[propertyId]?.valueGet(rowId, propertyId);
-  }
-
  static externalProperties = signal<PropertyMetaConfig[]>([]);
  static propertiesList = computed(() => {
    return [
@@ -127,15 +71,11 @@ export class DatabaseBlockDataSource extends DataSourceBase {

  override featureFlags$: ReadonlySignal<DatabaseFlags> = computed(() => {
    const featureFlagService = this.doc.get(FeatureFlagService);
-    const enableNumberFormat = featureFlagService.getFlag(
+    const flag = featureFlagService.getFlag(
      'enable_database_number_formatting'
    );
-    const enableTableVirtualScroll = featureFlagService.getFlag(
-      'enable_table_virtual_scroll'
-    );
    return {
-      enable_number_formatting: enableNumberFormat ?? false,
-      enable_table_virtual_scroll: enableTableVirtualScroll ?? false,
+      enable_number_formatting: flag ?? false,
    };
  });

@@ -155,7 +95,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {

  readonly$: ReadonlySignal<boolean> = computed(() => {
    return (
-      this._model.store.readonly ||
+      this._model.doc.readonly ||
      // TODO(@L-Sun): use block level readonly
      IS_MOBILE
    );
@@ -176,7 +116,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
  viewMetas = databaseBlockViews;

  get doc() {
-    return this._model.store;
+    return this._model.doc;
  }

  allPropertyMetas$ = computed<PropertyMetaConfig<any, any, any, any>[]>(() => {
@@ -189,13 +129,9 @@ export class DatabaseBlockDataSource extends DataSourceBase {
    );
  });

-  constructor(
-    model: DatabaseBlockModel,
-    init?: (dataSource: DatabaseBlockDataSource) => void
-  ) {
+  constructor(model: DatabaseBlockModel) {
    super();
-    this._model = model; // ensure invariants first
-    init?.(this); // then allow external initialisation
+    this._model = model;
  }

  private _runCapture() {
@@ -256,15 +192,20 @@ export class DatabaseBlockDataSource extends DataSourceBase {
  }

  cellValueGet(rowId: string, propertyId: string): unknown {
-    if (this.isSpacialProperty(propertyId)) {
-      return this.spacialValueGet(rowId, propertyId);
+    if (propertyId === 'type') {
+      const model = this.getModelById(rowId);
+      if (!model) {
+        return;
+      }
+      return getIcon(model);
    }
    const type = this.propertyTypeGet(propertyId);
    if (!type) {
      return;
    }
    if (type === 'title') {
-      return this.spacialValueGet(rowId, 'title');
+      const model = this.getModelById(rowId);
+      return model?.text;
    }
    const meta = this.propertyMetaGet(type);
    if (!meta) {
@@ -357,7 +298,7 @@ export class DatabaseBlockDataSource extends DataSourceBase {
      return;
    }
    const { column: prevColumn, index } = result;
-    this._model.store.transact(() => {
+    this._model.doc.transact(() => {
      if (index >= 0) {
        const result = updater(prevColumn);
        this._model.props.columns[index] = { ...prevColumn, ...result };
@@ -555,15 +496,15 @@ export class DatabaseBlockDataSource extends DataSourceBase {
  }

  viewDataAdd(viewData: DataViewDataType): string {
-    this._model.store.captureSync();
-    this._model.store.transact(() => {
+    this._model.doc.captureSync();
+    this._model.doc.transact(() => {
      this._model.props.views = [...this._model.props.views, viewData];
    });
    return viewData.id;
  }

  viewDataDelete(viewId: string): void {
-    this._model.store.captureSync();
+    this._model.doc.captureSync();
    deleteView(this._model, viewId);
  }

@@ -623,20 +564,20 @@ export const convertToDatabase = (host: EditorHost, viewType: string) => {
  const firstModel = selectedModels?.[0];
  if (!firstModel) return;

-  host.store.captureSync();
+  host.doc.captureSync();

-  const parentModel = host.store.getParent(firstModel);
+  const parentModel = host.doc.getParent(firstModel);
  if (!parentModel) {
    return;
  }

-  const id = host.store.addBlock(
+  const id = host.doc.addBlock(
    'affine:database',
    {},
    parentModel,
    parentModel.children.indexOf(firstModel)
  );
-  const databaseModel = host.store.getBlock(id)?.model as
+  const databaseModel = host.doc.getBlock(id)?.model as
    | DatabaseBlockModel
    | undefined;
  if (!databaseModel) {
@@ -644,7 +585,7 @@ export const convertToDatabase = (host: EditorHost, viewType: string) => {
  }
  const datasource = new DatabaseBlockDataSource(databaseModel);
  datasource.viewManager.viewAdd(viewType);
-  host.store.moveBlocks(selectedModels, databaseModel);
+  host.doc.moveBlocks(selectedModels, databaseModel);

  const selectionManager = host.selection;
  selectionManager.clear();
@@ -27,7 +27,6 @@ import {
  type DataViewWidget,
  type DataViewWidgetProps,
  defineUniComponent,
-  ExternalGroupByConfigProvider,
  renderUniLit,
  type SingleView,
  uniMap,
@@ -47,15 +46,17 @@ import { computed, signal } from '@preact/signals-core';
 import { css, html, nothing, unsafeCSS } from 'lit';

 import { popSideDetail } from './components/layout.js';
-import { DatabaseConfigExtension } from './config.js';
-import { EditorHostKey } from './context/host-context.js';
+import {
+  DatabaseConfigExtension,
+  type DatabaseOptionsConfig,
+} from './config.js';
+import { HostContextKey } from './context/host-context.js';
 import { DatabaseBlockDataSource } from './data-source.js';
 import { BlockRenderer } from './detail-panel/block-renderer.js';
 import { NoteRenderer } from './detail-panel/note-renderer.js';
 import { DatabaseSelection } from './selection.js';
 import { currentViewStorage } from './utils/current-view.js';
 import { getSingleDocIdFromText } from './utils/title-doc.js';
-import type { DatabaseViewExtensionOptions } from './view';

 export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBlockModel> {
  static override styles = css`
@@ -121,7 +122,7 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
          prefix: CopyIcon(),
          name: 'Copy',
          select: () => {
-            const slice = Slice.fromModels(this.store, [this.model]);
+            const slice = Slice.fromModels(this.doc, [this.model]);
            this.std.clipboard
              .copySlice(slice)
              .then(() => {
@@ -140,9 +141,9 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
              name: 'Delete Database',
              select: () => {
                this.model.children.slice().forEach(block => {
-                  this.store.deleteBlock(block);
+                  this.doc.deleteBlock(block);
                });
-                this.store.deleteBlock(this.model);
+                this.doc.deleteBlock(this.model);
              },
            }),
          ],
@@ -259,18 +260,18 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
      );
      return () => {
        this.indicator.remove();
-        const model = this.store.getBlock(id)?.model;
+        const model = this.doc.getBlock(id)?.model;
        const target = result.modelState.model;
-        let parent = this.store.getParent(target.id);
+        let parent = this.doc.getParent(target.id);
        const shouldInsertIn = result.placement === 'in';
        if (shouldInsertIn) {
          parent = target;
        }
        if (model && target && parent) {
          if (shouldInsertIn) {
-            this.store.moveBlocks([model], parent);
+            this.doc.moveBlocks([model], parent);
          } else {
-            this.store.moveBlocks(
+            this.doc.moveBlocks(
              [model],
              parent,
              target,
@@ -334,17 +335,8 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc

  get dataSource(): DatabaseBlockDataSource {
    if (!this._dataSource) {
-      this._dataSource = new DatabaseBlockDataSource(this.model, dataSource => {
-        dataSource.serviceSet(EditorHostKey, this.host);
-        this.std.provider
-          .getAll(ExternalGroupByConfigProvider)
-          .forEach(config => {
-            dataSource.serviceSet(
-              ExternalGroupByConfigProvider(config.name),
-              config
-            );
-          });
-      });
+      this._dataSource = new DatabaseBlockDataSource(this.model);
+      this._dataSource.contextSet(HostContextKey, this.host);
      const id = currentViewStorage.getCurrentView(this.model.id);
      if (id && this.dataSource.viewManager.viewGet(id)) {
        this.dataSource.viewManager.setCurrentView(id);
@@ -353,7 +345,7 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
    return this._dataSource;
  }

-  get optionsConfig(): DatabaseViewExtensionOptions {
+  get optionsConfig(): DatabaseOptionsConfig {
    return {
      configure: (_model, options) => options,
      ...this.std.getOptional(DatabaseConfigExtension.identifier),
@@ -444,13 +436,13 @@ export class DatabaseBlockComponent extends CaptionedBlockComponent<DatabaseBloc
                  return peekViewService.peek({
                    docId,
                    databaseId: this.blockId,
-                    databaseDocId: this.model.store.id,
+                    databaseDocId: this.model.doc.id,
                    databaseRowId: data.rowId,
                    target: this,
                  });
                };
                const doc = getSingleDocIdFromText(
-                  this.model.store.getBlock(data.rowId)?.model?.text
+                  this.model.doc.getBlock(data.rowId)?.model?.text
                );
                if (doc) {
                  return openDoc(doc);
@@ -0,0 +1,14 @@
+import { SlashMenuConfigExtension } from '@blocksuite/affine-widget-slash-menu';
+import { BlockViewExtension, FlavourExtension } from '@blocksuite/std';
+import type { ExtensionType } from '@blocksuite/store';
+import { literal } from 'lit/static-html.js';
+
+import { DatabaseBlockAdapterExtensions } from './adapters/extension.js';
+import { databaseSlashMenuConfig } from './configs/slash-menu.js';
+
+export const DatabaseBlockSpec: ExtensionType[] = [
+  FlavourExtension('affine:database'),
+  BlockViewExtension('affine:database', literal`affine-database`),
+  DatabaseBlockAdapterExtensions,
+  SlashMenuConfigExtension('affine:database', databaseSlashMenuConfig),
+].flat();
@@ -74,7 +74,7 @@ export class BlockRenderer
  }

  get model() {
-    return this.host?.store.getBlock(this.rowId)?.model;
+    return this.host?.doc.getBlock(this.rowId)?.model;
  }

  override connectedCallback() {
@@ -140,7 +140,7 @@ export class BlockRenderer
      return;
    }
    return html` <div class="database-block-detail-header-icon">
-      ${this.view.cellGetOrCreate(this.rowId, iconColumn).value$.value}
+      ${this.view.cellValueGet(this.rowId, iconColumn)}
    </div>`;
  }

@@ -36,7 +36,7 @@ export class NoteRenderer
  accessor rowId!: string;

  rowText$ = computed(() => {
-    return this.databaseBlock.store.getBlock(this.rowId)?.model?.text;
+    return this.databaseBlock.doc.getBlock(this.rowId)?.model?.text;
  });

  allowCreateDoc$ = computed(() => {
@@ -4,7 +4,6 @@ import { DatabaseBlockComponent } from './database-block';
 import { DatabaseDndPreviewBlockComponent } from './database-dnd-preview-block';
 import { BlockRenderer } from './detail-panel/block-renderer';
 import { NoteRenderer } from './detail-panel/note-renderer';
-import { CreatedTimeCell } from './properties/created-time/cell-renderer';
 import { LinkCell } from './properties/link/cell-renderer';
 import { RichTextCell } from './properties/rich-text/cell-renderer';
 import { IconCell } from './properties/title/icon';
@@ -16,7 +15,6 @@ export function effects() {
  customElements.define('affine-database-link-cell', LinkCell);
  customElements.define('data-view-header-area-text', HeaderAreaTextCell);
  customElements.define('affine-database-rich-text-cell', RichTextCell);
-  customElements.define('affine-database-created-time-cell', CreatedTimeCell);
  customElements.define('center-peek', CenterPeek);
  customElements.define('database-datasource-note-renderer', NoteRenderer);
  customElements.define('database-datasource-block-renderer', BlockRenderer);
@@ -4,6 +4,7 @@ export * from './config';
 export * from './context';
 export * from './data-source';
 export * from './database-block';
+export * from './database-spec';
 export * from './detail-panel/block-renderer';
 export * from './detail-panel/note-renderer';
 export * from './properties';
@@ -1,55 +0,0 @@
-import {
-  BaseCellRenderer,
-  createFromBaseCellRenderer,
-  createIcon,
-} from '@blocksuite/data-view';
-import { css } from '@emotion/css';
-import { format } from 'date-fns/format';
-import { html } from 'lit';
-
-import { createdTimePropertyModelConfig } from './define.js';
-const createdTimeCellStyle = css({
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'center',
-  width: '100%',
-  height: '100%',
-});
-
-const textStyle = css({
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'center',
-  width: '100%',
-  height: '100%',
-});
-
-export class CreatedTimeCell extends BaseCellRenderer<number, number> {
-  renderContent() {
-    const formattedDate = this.value
-      ? format(this.value, 'yyyy-MM-dd HH:mm:ss')
-      : '';
-    return html`<div class="${textStyle}">${formattedDate}</div>`;
-  }
-
-  override connectedCallback(): void {
-    super.connectedCallback();
-    this.classList.add(createdTimeCellStyle);
-  }
-
-  override beforeEnterEditMode() {
-    return false;
-  }
-
-  override render() {
-    return html`<div class="date-container">${this.renderContent()}</div>`;
-  }
-}
-
-export const createdTimeColumnConfig =
-  createdTimePropertyModelConfig.createPropertyMeta({
-    icon: createIcon('DateTimeIcon'),
-    cellRenderer: {
-      view: createFromBaseCellRenderer(CreatedTimeCell),
-    },
-  });
@@ -1,35 +0,0 @@
-import { propertyType, t } from '@blocksuite/data-view';
-import { format } from 'date-fns/format';
-import zod from 'zod';
-
-export const createdTimeColumnType = propertyType('created-time');
-export const createdTimePropertyModelConfig = createdTimeColumnType.modelConfig(
-  {
-    name: 'Created Time',
-    propertyData: {
-      schema: zod.object({}),
-      default: () => ({}),
-    },
-    jsonValue: {
-      schema: zod.number().nullable(),
-      isEmpty: () => false,
-      type: () => t.date.instance(),
-    },
-    rawValue: {
-      schema: zod.number().nullable(),
-      default: () => null,
-      toString: ({ value }) =>
-        value != null ? format(value, 'yyyy-MM-dd HH:mm:ss') : '',
-      fromString: () => {
-        return { value: null };
-      },
-      toJson: ({ value }) => value,
-      fromJson: ({ value }) => value,
-    },
-    fixed: {
-      defaultData: {},
-      defaultShow: false,
-      defaultOrder: 'end',
-    },
-  }
-);
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
UNIDY	914e4baf82	fix: according to graphite-app's suggestions	2025-04-29 17:32:46 +08:00
UNIDY	bd268044b4	feat: implement textAlign property for paragraph blocks, image blocks, list blocks, and table blocks	2025-04-29 17:32:46 +08:00
				`@@ -1 +0,0 @@`
				`export * from '@blocksuite/affine-block-embed-doc';`
				`@@ -1 +0,0 @@`
				`export * from '@blocksuite/affine-components/citation';`
				`@@ -1 +0,0 @@`
				`export * from '@blocksuite/affine-foundation/store';`
				`@@ -1 +0,0 @@`
				`export * from '@blocksuite/affine-fragment-doc-title/view';`