From e0eecffb2f9677495b3d53020517c996a14c9ce6 Mon Sep 17 00:00:00 2001
From: Peng Xiao <pengxiao@outlook.com>
Date: Mon, 3 Apr 2023 03:01:22 +0800
Subject: [PATCH] feat: optimize electron macos header style (#1774)

Co-authored-by: himself65 <himself65@outlook.com>
---
 .../layers/main/src/app-state/index.ts        |  17 +-
 apps/electron/layers/main/src/main-window.ts  |  27 +-
 apps/electron/layers/main/tsconfig.json       |   2 +-
 apps/electron/layers/preload/preload.d.ts     |  16 +
 apps/electron/layers/preload/src/index.ts     |  23 +-
 apps/electron/layers/preload/src/sha256sum.ts |   6 -
 apps/electron/layers/utils.ts                 |   3 +
 apps/electron/scripts/dev.mjs                 |   2 +-
 apps/electron/yarn.lock                       | 600 +++++++++++++++---
 .../src/components/affine/pivots/styles.ts    |   1 +
 .../affine/workspace-setting-detail/style.ts  |   6 +-
 .../block-suite-page-list/page-list/Empty.tsx |   2 +-
 .../block-suite-page-list/page-list/styles.ts |   2 +-
 .../theme-mode-switch/style.ts                |   2 +-
 .../components/blocksuite/header/styles.ts    |  31 +-
 .../web/src/components/page-detail-editor.tsx |   2 +-
 .../pure/workspace-avatar/index.tsx           |   1 +
 .../WorkspaceSelector/styles.ts               |   2 +
 .../pure/workspace-slider-bar/index.tsx       |   5 +-
 .../workspace-slider-bar/shared-styles.ts     |   2 +
 .../pure/workspace-slider-bar/style.ts        |  15 +-
 apps/web/src/layouts/styles.ts                |   2 +-
 .../[workspaceId]/[pageId].tsx                |   2 +-
 apps/web/src/providers/ThemeProvider.tsx      |   1 +
 apps/web/src/shared/index.ts                  |   6 -
 apps/web/src/styles/globals.css               |   2 +-
 apps/web/src/types/types.d.ts                 |   5 +
 .../src/components/contact-modal/style.ts     |   2 +-
 packages/env/env.d.ts                         |   1 +
 packages/env/src/index.ts                     |  14 +-
 packages/env/tsconfig.json                    |   2 +-
 31 files changed, 635 insertions(+), 169 deletions(-)
 create mode 100644 apps/electron/layers/preload/preload.d.ts
 delete mode 100644 apps/electron/layers/preload/src/sha256sum.ts
 create mode 100644 apps/electron/layers/utils.ts
 create mode 100644 packages/env/env.d.ts

diff --git a/apps/electron/layers/main/src/app-state/index.ts b/apps/electron/layers/main/src/app-state/index.ts
index c2228cb7ef..4fda185f6a 100644
--- a/apps/electron/layers/main/src/app-state/index.ts
+++ b/apps/electron/layers/main/src/app-state/index.ts
@@ -2,7 +2,7 @@ import * as os from 'node:os';
 import path from 'node:path';
 
 import { Storage } from '@affine/octobase-node';
-import { ipcMain } from 'electron';
+import { BrowserWindow, ipcMain, nativeTheme } from 'electron';
 import fs from 'fs-extra';
 
 const AFFINE_ROOT = path.join(os.homedir(), '.affine');
@@ -15,7 +15,20 @@ export const appState = {
 };
 
 export const registerHandlers = () => {
-  ipcMain.handle('workspaceSync', async (_, id) => {
+  ipcMain.handle('octo:workspace-sync', async (_, id) => {
     return appState.storage.sync(id, '');
   });
+
+  ipcMain.handle('ui:theme-change', async (_, theme) => {
+    nativeTheme.themeSource = theme;
+  });
+
+  ipcMain.handle('ui:sidebar-visibility-change', async (_, visible) => {
+    // todo
+    const windows = BrowserWindow.getAllWindows();
+    windows.forEach(w => {
+      // hide window buttons when sidebar is not visible
+      w.setWindowButtonVisibility(visible);
+    });
+  });
 };
diff --git a/apps/electron/layers/main/src/main-window.ts b/apps/electron/layers/main/src/main-window.ts
index 114df53404..0155f21b22 100644
--- a/apps/electron/layers/main/src/main-window.ts
+++ b/apps/electron/layers/main/src/main-window.ts
@@ -1,7 +1,9 @@
-import { BrowserWindow } from 'electron';
+import { BrowserWindow, nativeTheme } from 'electron';
 import electronWindowState from 'electron-window-state';
 import { join } from 'path';
 
+import { isMacOS } from '../../utils';
+
 const IS_DEV = process.env.NODE_ENV === 'development';
 
 async function createWindow() {
@@ -11,12 +13,18 @@ async function createWindow() {
   });
 
   const browserWindow = new BrowserWindow({
+    titleBarStyle: isMacOS() ? 'hiddenInset' : 'default',
+    trafficLightPosition: { x: 20, y: 18 },
     x: mainWindowState.x,
     y: mainWindowState.y,
     width: mainWindowState.width,
+    transparent: true,
+    visualEffectState: 'active',
+    vibrancy: 'under-window',
     height: mainWindowState.height,
     show: false, // Use 'ready-to-show' event to show window
     webPreferences: {
+      webgl: true,
       contextIsolation: true,
       sandbox: false,
       webviewTag: false, // The webview tag is not recommended. Consider alternatives like iframe or Electron's BrowserView. https://www.electronjs.org/docs/latest/api/webview-tag#warning
@@ -25,6 +33,8 @@ async function createWindow() {
     },
   });
 
+  nativeTheme.themeSource = 'light';
+
   mainWindowState.manage(browserWindow);
 
   /**
@@ -60,19 +70,22 @@ async function createWindow() {
   return browserWindow;
 }
 
+// singleton
+let browserWindow: Electron.BrowserWindow | undefined;
 /**
  * Restore existing BrowserWindow or Create new BrowserWindow
  */
 export async function restoreOrCreateWindow() {
-  let window = BrowserWindow.getAllWindows().find(w => !w.isDestroyed());
+  browserWindow = BrowserWindow.getAllWindows().find(w => !w.isDestroyed());
 
-  if (window === undefined) {
-    window = await createWindow();
+  if (browserWindow === undefined) {
+    browserWindow = await createWindow();
   }
 
-  if (window.isMinimized()) {
-    window.restore();
+  if (browserWindow.isMinimized()) {
+    browserWindow.restore();
   }
 
-  window.focus();
+  browserWindow.focus();
+  return browserWindow;
 }
diff --git a/apps/electron/layers/main/tsconfig.json b/apps/electron/layers/main/tsconfig.json
index 319012adc7..cf93d810ce 100644
--- a/apps/electron/layers/main/tsconfig.json
+++ b/apps/electron/layers/main/tsconfig.json
@@ -11,5 +11,5 @@
 
     "types": ["node"]
   },
-  "include": ["src/**/*.ts", "../../types/**/*.d.ts", "index.ts"]
+  "include": ["src/**/*.ts", "../../types/**/*.d.ts", "index.ts", "../utils.ts"]
 }
diff --git a/apps/electron/layers/preload/preload.d.ts b/apps/electron/layers/preload/preload.d.ts
new file mode 100644
index 0000000000..e9d3cd6c0b
--- /dev/null
+++ b/apps/electron/layers/preload/preload.d.ts
@@ -0,0 +1,16 @@
+interface Window {
+  /**
+   * After analyzing the `exposeInMainWorld` calls,
+   * `packages/preload/exposedInMainWorld.d.ts` file will be generated.
+   * It contains all interfaces.
+   * `packages/preload/exposedInMainWorld.d.ts` file is required for TS is `renderer`
+   *
+   * @see https://github.com/cawa-93/dts-for-context-bridge
+   */
+  readonly apis: {
+    workspaceSync: (id: string) => Promise<any>;
+    onThemeChange: (theme: string) => Promise<any>;
+    onSidebarVisibilityChange: (visible: boolean) => Promise<any>;
+  };
+  readonly appInfo: { electron: boolean; isMacOS: boolean };
+}
diff --git a/apps/electron/layers/preload/src/index.ts b/apps/electron/layers/preload/src/index.ts
index cda2c3915d..db47d29eec 100644
--- a/apps/electron/layers/preload/src/index.ts
+++ b/apps/electron/layers/preload/src/index.ts
@@ -4,10 +4,7 @@
 
 import { contextBridge, ipcRenderer } from 'electron';
 
-import { sha256sum } from './sha256sum';
-
-// Expose version number to renderer
-contextBridge.exposeInMainWorld('yerba', { version: 0.1 });
+import { isMacOS } from '../../utils';
 
 /**
  * The "Main World" is the JavaScript context that your main renderer code runs in.
@@ -25,17 +22,17 @@ contextBridge.exposeInMainWorld('yerba', { version: 0.1 });
  * @see https://github.com/cawa-93/dts-for-context-bridge
  */
 
-/**
- * Safe expose node.js API
- * @example
- * window.nodeCrypto('data')
- */
-contextBridge.exposeInMainWorld('nodeCrypto', { sha256sum });
-
 contextBridge.exposeInMainWorld('apis', {
-  workspaceSync: (id: string) => ipcRenderer.invoke('workspaceSync', id),
+  workspaceSync: (id: string) => ipcRenderer.invoke('octo:workspace-sync', id),
+  // ui
+  onThemeChange: (theme: string) =>
+    ipcRenderer.invoke('ui:theme-change', theme),
+
+  onSidebarVisibilityChange: (visible: boolean) =>
+    ipcRenderer.invoke('ui:sidebar-visibility-change', visible),
 });
 
 contextBridge.exposeInMainWorld('appInfo', {
-  electron: 1,
+  electron: true,
+  isMacOS: isMacOS(),
 });
diff --git a/apps/electron/layers/preload/src/sha256sum.ts b/apps/electron/layers/preload/src/sha256sum.ts
deleted file mode 100644
index 32b6560606..0000000000
--- a/apps/electron/layers/preload/src/sha256sum.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import type { BinaryLike } from 'crypto';
-import { createHash } from 'crypto';
-
-export function sha256sum(data: BinaryLike) {
-  return createHash('sha256').update(data).digest('hex');
-}
diff --git a/apps/electron/layers/utils.ts b/apps/electron/layers/utils.ts
new file mode 100644
index 0000000000..156eaadaa9
--- /dev/null
+++ b/apps/electron/layers/utils.ts
@@ -0,0 +1,3 @@
+export const isMacOS = () => {
+  return process.platform === 'darwin';
+};
diff --git a/apps/electron/scripts/dev.mjs b/apps/electron/scripts/dev.mjs
index 0885d8e682..34602218ef 100644
--- a/apps/electron/scripts/dev.mjs
+++ b/apps/electron/scripts/dev.mjs
@@ -62,7 +62,7 @@ async function main() {
             build.onEnd(() => {
               generateAsync({
                 input: 'layers/preload/src/**/*.ts',
-                output: 'layers/preload/preload.autogen.d.ts',
+                output: 'layers/preload/preload.d.ts',
               });
               if (initialBuild) {
                 console.log(`[preload] has changed`);
diff --git a/apps/electron/yarn.lock b/apps/electron/yarn.lock
index bc143a9f56..a760d11c32 100644
--- a/apps/electron/yarn.lock
+++ b/apps/electron/yarn.lock
@@ -37,11 +37,11 @@ __metadata:
     "@affine/debug": "workspace:*"
     "@affine/i18n": "workspace:*"
     "@affine/jotai": "workspace:*"
-    "@blocksuite/blocks": 0.5.0-alpha.1
-    "@blocksuite/editor": 0.5.0-alpha.1
-    "@blocksuite/global": 0.5.0-alpha.2
+    "@blocksuite/blocks": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/editor": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
     "@blocksuite/icons": 2.1.2
-    "@blocksuite/store": 0.5.0-alpha.1
+    "@blocksuite/store": 0.5.0-20230326033652-70ca43c
     "@emotion/cache": ^11.10.5
     "@emotion/react": ^11.10.6
     "@emotion/server": ^11.10.0
@@ -116,7 +116,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@affine/env@workspace:../../packages/env"
   dependencies:
-    "@blocksuite/global": 0.5.0-alpha.2
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
     lit: ^2.7.0
     next: =13.2.3
     react: ^18.2.0
@@ -175,8 +175,9 @@ __metadata:
     "@affine/component": "workspace:*"
     "@affine/debug": "workspace:*"
     "@affine/env": "workspace:*"
-    "@blocksuite/blocks": 0.5.0-alpha.1
-    "@blocksuite/store": 0.5.0-alpha.1
+    "@blocksuite/blocks": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/store": 0.5.0-20230326033652-70ca43c
+    "@toeverything/y-indexeddb": "workspace:*"
     "@types/ws": ^8.5.4
     firebase: ^9.19.1
     jotai: ^2.0.3
@@ -186,6 +187,7 @@ __metadata:
     react: ^18.2.0
     react-dom: ^18.2.0
     ws: ^8.13.0
+    y-indexeddb: ^9.0.10
     y-protocols: ^1.0.5
     yjs: ^13.5.51
     zod: ^3.21.4
@@ -539,7 +541,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.13.16, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.20.7, @babel/parser@npm:^7.21.4, @babel/parser@npm:~7.21.2":
+"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.13.16, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.20.15, @babel/parser@npm:^7.20.7, @babel/parser@npm:^7.21.4, @babel/parser@npm:~7.21.2":
   version: 7.21.4
   resolution: "@babel/parser@npm:7.21.4"
   bin:
@@ -1771,58 +1773,64 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@blocksuite/blocks@npm:0.5.0-alpha.1":
-  version: 0.5.0-alpha.1
-  resolution: "@blocksuite/blocks@npm:0.5.0-alpha.1"
+"@blocksuite/blocks@npm:0.5.0-20230324040005-14417c2":
+  version: 0.5.0-20230324040005-14417c2
+  resolution: "@blocksuite/blocks@npm:0.5.0-20230324040005-14417c2"
   dependencies:
-    "@blocksuite/global": 0.5.0-alpha.1
-    "@blocksuite/phasor": 0.5.0-alpha.1
-    "@blocksuite/virgo": 0.5.0-alpha.1
+    "@blocksuite/global": 0.5.0-20230324040005-14417c2
+    "@blocksuite/phasor": 0.5.0-20230324040005-14417c2
+    "@blocksuite/virgo": 0.5.0-20230324040005-14417c2
     "@popperjs/core": ^2.11.6
-    highlight.js: ^11.7.0
     hotkeys-js: ^3.10.1
     lit: ^2.6.1
+    marked: ^4.2.12
     shiki: ^0.14.1
-    zod: ^3.20.6
+    turndown: ^7.1.1
+    zod: ^3.21.4
   peerDependencies:
-    "@blocksuite/store": 0.5.0-alpha.1
-  checksum: f82e8a106b4ae13f4f1570f31ab03c9a739d6836e16cd21df3f47e2b61487bbbbe502605d5a86027606c6c7c63eedbcce9c978e80825f46f0c3a4d6666a09122
+    "@blocksuite/store": 0.5.0-20230324040005-14417c2
+  checksum: f339b15fd060f9756420c5a47390b746610503486aedd62d6850d4626e6757b9a4e34e07a6f7738e96beb0381d086cf12f434b4aca44f89b02aa24db5e220bcc
   languageName: node
   linkType: hard
 
-"@blocksuite/editor@npm:0.5.0-alpha.1":
-  version: 0.5.0-alpha.1
-  resolution: "@blocksuite/editor@npm:0.5.0-alpha.1"
+"@blocksuite/blocks@npm:0.5.0-20230326033652-70ca43c":
+  version: 0.5.0-20230326033652-70ca43c
+  resolution: "@blocksuite/blocks@npm:0.5.0-20230326033652-70ca43c"
   dependencies:
-    "@blocksuite/global": 0.5.0-alpha.1
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/phasor": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/virgo": 0.5.0-20230326033652-70ca43c
+    "@popperjs/core": ^2.11.6
+    hotkeys-js: ^3.10.1
+    lit: ^2.6.1
+    marked: ^4.2.12
+    shiki: ^0.14.1
+    turndown: ^7.1.1
+    zod: ^3.21.4
+  peerDependencies:
+    "@blocksuite/store": 0.5.0-20230326033652-70ca43c
+  checksum: 3c1696af5ce17ff17570d586926dbd6f6f4df3d639e321108b7df1a476a7cd4465e0457cc077a244a37662f8f2c9191f5503a928cb4647ba97b8dd22f3d7fc94
+  languageName: node
+  linkType: hard
+
+"@blocksuite/editor@npm:0.5.0-20230326033652-70ca43c":
+  version: 0.5.0-20230326033652-70ca43c
+  resolution: "@blocksuite/editor@npm:0.5.0-20230326033652-70ca43c"
+  dependencies:
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
     lit: ^2.6.1
     marked: ^4.2.12
     turndown: ^7.1.1
   peerDependencies:
-    "@blocksuite/blocks": 0.5.0-alpha.1
-    "@blocksuite/store": 0.5.0-alpha.1
-  checksum: bd6052aa87439b3de6c8108f8c5480185740dc2b8286079f737e3f46e8c5fd76d152aea0b641e2397893c4a81cc3ef862886f6cc59d663e5a50b6770a4fc423b
+    "@blocksuite/blocks": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/store": 0.5.0-20230326033652-70ca43c
+  checksum: 28721b20ef15448aa7abd3552dae39dd9284b1d2ddd661d5fe7d8de32157376986ed4388ea4d23645aef842dcc71e163747ea8772b6a3fea973bda5146647148
   languageName: node
   linkType: hard
 
-"@blocksuite/global@npm:0.5.0-alpha.1":
-  version: 0.5.0-alpha.1
-  resolution: "@blocksuite/global@npm:0.5.0-alpha.1"
-  dependencies:
-    ansi-colors: ^4.1.3
-    zod: ^3.20.6
-  peerDependencies:
-    lit: ^2.6
-  peerDependenciesMeta:
-    lit:
-      optional: true
-  checksum: 98c4f14fd6cdb88ecaa8834f2a5297b5f017969ea20572d656fbb8759fc47edd6b2b45e33a511d2b330542ae8f811d8ff29ee099a39699ad7c4c161c06c03a31
-  languageName: node
-  linkType: hard
-
-"@blocksuite/global@npm:0.5.0-alpha.2":
-  version: 0.5.0-alpha.2
-  resolution: "@blocksuite/global@npm:0.5.0-alpha.2"
+"@blocksuite/global@npm:0.5.0-20230324040005-14417c2":
+  version: 0.5.0-20230324040005-14417c2
+  resolution: "@blocksuite/global@npm:0.5.0-20230324040005-14417c2"
   dependencies:
     ansi-colors: ^4.1.3
     zod: ^3.21.4
@@ -1831,7 +1839,22 @@ __metadata:
   peerDependenciesMeta:
     lit:
       optional: true
-  checksum: efd30a94e5642e190c1da514f1e953317d86cdba176dbd2237aeb9b11f23953b36236ea1594c4cba668b96a1b6ddcdf9f80578c13fe9e6174590070931324aee
+  checksum: 9fab3db0843d5040739a0dade33beccb272e51202801619ea6e218c87d983163652cf1233dad57de88f57d41919ddb363922ac9cf15bb14a625227e3f886122b
+  languageName: node
+  linkType: hard
+
+"@blocksuite/global@npm:0.5.0-20230326033652-70ca43c":
+  version: 0.5.0-20230326033652-70ca43c
+  resolution: "@blocksuite/global@npm:0.5.0-20230326033652-70ca43c"
+  dependencies:
+    ansi-colors: ^4.1.3
+    zod: ^3.21.4
+  peerDependencies:
+    lit: ^2.6
+  peerDependenciesMeta:
+    lit:
+      optional: true
+  checksum: d5757b2a77ad1b71bfa7c61764ed5659bff9f974190fd60a4bf2a3bfaa5d2fab9fe1682fc609fd87ccb895d9a402d8f8e679e4a6d2d3693f12f9687fb4d6a2eb
   languageName: node
   linkType: hard
 
@@ -1845,53 +1868,103 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@blocksuite/phasor@npm:0.5.0-alpha.1":
-  version: 0.5.0-alpha.1
-  resolution: "@blocksuite/phasor@npm:0.5.0-alpha.1"
+"@blocksuite/phasor@npm:0.5.0-20230324040005-14417c2":
+  version: 0.5.0-20230324040005-14417c2
+  resolution: "@blocksuite/phasor@npm:0.5.0-20230324040005-14417c2"
   dependencies:
-    "@blocksuite/global": 0.5.0-alpha.1
+    "@blocksuite/global": 0.5.0-20230324040005-14417c2
     fractional-indexing: ^3.2.0
-    nanoid: ^4.0.1
     perfect-freehand: ^1.2.0
   peerDependencies:
+    nanoid: ^4
     yjs: ^13
-  checksum: 1a38f957f0eec55640ee357e59111b213eb238d349c0a23a0154b3cca00dfa95440a35b855d0043073d892b33c2f374e2ff5dbec9ce131f14f2c706b83bc575b
+  checksum: 464e62c9da3f63f22a4d426964c1a522f46c8b4f3fe552256c6a0a06517e0bf8a34c14548e54f94fc5f72b40d9d47ae0ba1cbeeacc24d924cdad5be15caec711
   languageName: node
   linkType: hard
 
-"@blocksuite/store@npm:0.5.0-alpha.1":
-  version: 0.5.0-alpha.1
-  resolution: "@blocksuite/store@npm:0.5.0-alpha.1"
+"@blocksuite/phasor@npm:0.5.0-20230326033652-70ca43c":
+  version: 0.5.0-20230326033652-70ca43c
+  resolution: "@blocksuite/phasor@npm:0.5.0-20230326033652-70ca43c"
   dependencies:
-    "@blocksuite/global": 0.5.0-alpha.1
-    "@blocksuite/virgo": 0.5.0-alpha.1
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
+    fractional-indexing: ^3.2.0
+    perfect-freehand: ^1.2.0
+  peerDependencies:
+    nanoid: ^4
+    yjs: ^13
+  checksum: 2938c6fbf4230da1c13ad81fc84123ce44009cddf2d8c8729573112d73ca9eb0c0287b0dc0b9b8eb635dbe17c5406d0c395ece2a8ed90704fc639ffedfac096c
+  languageName: node
+  linkType: hard
+
+"@blocksuite/store@npm:0.5.0-20230324040005-14417c2":
+  version: 0.5.0-20230324040005-14417c2
+  resolution: "@blocksuite/store@npm:0.5.0-20230324040005-14417c2"
+  dependencies:
+    "@blocksuite/global": 0.5.0-20230324040005-14417c2
+    "@blocksuite/virgo": 0.5.0-20230324040005-14417c2
     "@types/flexsearch": ^0.7.3
     buffer: ^6.0.3
     flexsearch: 0.7.21
     idb-keyval: ^6.2.0
-    ky: ^0.33.2
-    lib0: ^0.2.63
+    ky: ^0.33.3
+    lib0: ^0.2.68
     merge: ^2.1.1
     nanoid: ^4.0.1
     y-protocols: ^1.0.5
-    y-webrtc: ^10.2.4
-    zod: ^3.20.6
+    y-webrtc: ^10.2.5
+    zod: ^3.21.4
   peerDependencies:
     yjs: ^13
-  checksum: 66768ee1d122c2857eeb4b2ad96b76e62ee81368c268c27109a7333eb4131cafddbb481ece65a1506dafdd0a01d854f896d12cbdae95cb7906a98833bf38b072
+  checksum: 8c483db2df8b5a3528c538191d3ba26793bc85c529d9911a29f29748af29a93d7c6cd6494e9a23869bbb4414b6f3dd041abcc0c5298a46da103c3e46b8419bfa
   languageName: node
   linkType: hard
 
-"@blocksuite/virgo@npm:0.5.0-alpha.1":
-  version: 0.5.0-alpha.1
-  resolution: "@blocksuite/virgo@npm:0.5.0-alpha.1"
+"@blocksuite/store@npm:0.5.0-20230326033652-70ca43c":
+  version: 0.5.0-20230326033652-70ca43c
+  resolution: "@blocksuite/store@npm:0.5.0-20230326033652-70ca43c"
   dependencies:
-    "@blocksuite/global": 0.5.0-alpha.1
-    zod: ^3.20.6
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
+    "@blocksuite/virgo": 0.5.0-20230326033652-70ca43c
+    "@types/flexsearch": ^0.7.3
+    buffer: ^6.0.3
+    flexsearch: 0.7.21
+    idb-keyval: ^6.2.0
+    ky: ^0.33.3
+    lib0: ^0.2.68
+    merge: ^2.1.1
+    nanoid: ^4.0.1
+    y-protocols: ^1.0.5
+    y-webrtc: ^10.2.5
+    zod: ^3.21.4
+  peerDependencies:
+    yjs: ^13
+  checksum: 92b7e498a85cf9e15933bfca9a148d76092db911418dcebaa20cb422d2cd01003fe57afcbfa53db0e3de00c064f9b5f39f631c340af1cb00fb3cd621e660f578
+  languageName: node
+  linkType: hard
+
+"@blocksuite/virgo@npm:0.5.0-20230324040005-14417c2":
+  version: 0.5.0-20230324040005-14417c2
+  resolution: "@blocksuite/virgo@npm:0.5.0-20230324040005-14417c2"
+  dependencies:
+    "@blocksuite/global": 0.5.0-20230324040005-14417c2
+    zod: ^3.21.4
   peerDependencies:
     lit: ^2
     yjs: ^13
-  checksum: 7ba2e46af622252679e3f984e0fcadfdc901a7288ab7af436b85f734d39fbcdfe43d4baf8be5edf38438cad9bf10720953722400f8194752a8127b1241945fda
+  checksum: 318abaa9c44feeb0d9be98317ccf7aac3c5d884d31325799d23aae072b11b0e4dfbd51b0a52056f6c0b87f5bc822eaabdb38c3936b3597040f3a9de9c36a76c7
+  languageName: node
+  linkType: hard
+
+"@blocksuite/virgo@npm:0.5.0-20230326033652-70ca43c":
+  version: 0.5.0-20230326033652-70ca43c
+  resolution: "@blocksuite/virgo@npm:0.5.0-20230326033652-70ca43c"
+  dependencies:
+    "@blocksuite/global": 0.5.0-20230326033652-70ca43c
+    zod: ^3.21.4
+  peerDependencies:
+    lit: ^2
+    yjs: ^13
+  checksum: 21f6b70ecb3d2a47edb3b7bd5a4426aabd3f871cd380320b495b53229f587ec67e355828f1ed5aa2ae279868edf23b8de1832d613bb38e8b3b1620c7b92f18ba
   languageName: node
   linkType: hard
 
@@ -3626,6 +3699,58 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@microsoft/api-extractor-model@npm:7.26.4":
+  version: 7.26.4
+  resolution: "@microsoft/api-extractor-model@npm:7.26.4"
+  dependencies:
+    "@microsoft/tsdoc": 0.14.2
+    "@microsoft/tsdoc-config": ~0.16.1
+    "@rushstack/node-core-library": 3.55.2
+  checksum: 0b27f9b248396422f3044f2472d86c111a6a4d34b4fd2c67d9995e96e5b144ec41ac35dbf2a005f144766814b824518bc42b424d93e3075d3dc1b17c2f8791d6
+  languageName: node
+  linkType: hard
+
+"@microsoft/api-extractor@npm:^7.33.5":
+  version: 7.34.4
+  resolution: "@microsoft/api-extractor@npm:7.34.4"
+  dependencies:
+    "@microsoft/api-extractor-model": 7.26.4
+    "@microsoft/tsdoc": 0.14.2
+    "@microsoft/tsdoc-config": ~0.16.1
+    "@rushstack/node-core-library": 3.55.2
+    "@rushstack/rig-package": 0.3.18
+    "@rushstack/ts-command-line": 4.13.2
+    colors: ~1.2.1
+    lodash: ~4.17.15
+    resolve: ~1.22.1
+    semver: ~7.3.0
+    source-map: ~0.6.1
+    typescript: ~4.8.4
+  bin:
+    api-extractor: bin/api-extractor
+  checksum: 855a04237e30f425553aab661b77bc0cbeb493510d769691d713e5bfdf02439fa7bc2076750271d154237f8c9d4451b209f30724c9ee2a2c4ea307c5db093d42
+  languageName: node
+  linkType: hard
+
+"@microsoft/tsdoc-config@npm:~0.16.1":
+  version: 0.16.2
+  resolution: "@microsoft/tsdoc-config@npm:0.16.2"
+  dependencies:
+    "@microsoft/tsdoc": 0.14.2
+    ajv: ~6.12.6
+    jju: ~1.4.0
+    resolve: ~1.19.0
+  checksum: 12b0d703154076bcaac75ca42e804e4fc292672396441e54346d7eadd0d6b57f90980eda2b1bab89b224af86da34a2389f9054002e282011e795ca5919a4386f
+  languageName: node
+  linkType: hard
+
+"@microsoft/tsdoc@npm:0.14.2":
+  version: 0.14.2
+  resolution: "@microsoft/tsdoc@npm:0.14.2"
+  checksum: b167c89e916ba73ee20b9c9d5dba6aa3a0de25ed3d50050e8a344dca7cd43cb2e1059bd515c820369b6e708901dd3fda476a42bc643ca74a35671ce77f724a3a
+  languageName: node
+  linkType: hard
+
 "@mui/base@npm:5.0.0-alpha.123":
   version: 5.0.0-alpha.123
   resolution: "@mui/base@npm:5.0.0-alpha.123"
@@ -4074,6 +4199,64 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/pluginutils@npm:^5.0.2":
+  version: 5.0.2
+  resolution: "@rollup/pluginutils@npm:5.0.2"
+  dependencies:
+    "@types/estree": ^1.0.0
+    estree-walker: ^2.0.2
+    picomatch: ^2.3.1
+  peerDependencies:
+    rollup: ^1.20.0||^2.0.0||^3.0.0
+  peerDependenciesMeta:
+    rollup:
+      optional: true
+  checksum: edea15e543bebc7dcac3b0ac8bc7b8e8e6dbd46e2864dbe5dd28072de1fbd5b0e10d545a610c0edaa178e8a7ac432e2a2a52e547ece1308471412caba47db8ce
+  languageName: node
+  linkType: hard
+
+"@rushstack/node-core-library@npm:3.55.2, @rushstack/node-core-library@npm:^3.53.2":
+  version: 3.55.2
+  resolution: "@rushstack/node-core-library@npm:3.55.2"
+  dependencies:
+    colors: ~1.2.1
+    fs-extra: ~7.0.1
+    import-lazy: ~4.0.0
+    jju: ~1.4.0
+    resolve: ~1.22.1
+    semver: ~7.3.0
+    z-schema: ~5.0.2
+  peerDependencies:
+    "@types/node": "*"
+  peerDependenciesMeta:
+    "@types/node":
+      optional: true
+  checksum: b6b289315cd6a3544471f534405479b7c80f3906b7506590d5eb83a605a0a5b65861bf678f3e6c2277c8db116b8e05f8e7b6864fdc75e0f1514c9ff224b83fe6
+  languageName: node
+  linkType: hard
+
+"@rushstack/rig-package@npm:0.3.18":
+  version: 0.3.18
+  resolution: "@rushstack/rig-package@npm:0.3.18"
+  dependencies:
+    resolve: ~1.22.1
+    strip-json-comments: ~3.1.1
+  checksum: 41e719fb14d99e0f79093523fede051dba2be5f53d63d5ae45c2ea1b8448e298e0303d8453be3f9ac5e8bb99e3dcf3ddbe4cc59d9be5eddb914286acbdd0a2f3
+  languageName: node
+  linkType: hard
+
+"@rushstack/ts-command-line@npm:4.13.2":
+  version: 4.13.2
+  resolution: "@rushstack/ts-command-line@npm:4.13.2"
+  dependencies:
+    "@types/argparse": 1.0.38
+    argparse: ~1.0.9
+    colors: ~1.2.1
+    string-argv: ~0.3.1
+  checksum: 3938e533e08d5cf4007a651d1aab658a7a60d6136a56414e2370b64434657a5d5a9eff442da4ddc260d5e6dc90f82428de64dbcfa1285e9ae176629f7fcd821d
+  languageName: node
+  linkType: hard
+
 "@sideway/address@npm:^4.1.3":
   version: 4.1.4
   resolution: "@sideway/address@npm:4.1.4"
@@ -5369,6 +5552,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@toeverything/y-indexeddb@workspace:*, @toeverything/y-indexeddb@workspace:../../packages/y-indexeddb":
+  version: 0.0.0-use.local
+  resolution: "@toeverything/y-indexeddb@workspace:../../packages/y-indexeddb"
+  dependencies:
+    "@blocksuite/blocks": 0.5.0-20230324040005-14417c2
+    "@blocksuite/store": 0.5.0-20230324040005-14417c2
+    idb: ^7.1.1
+    vite: ^4.2.1
+    vite-plugin-dts: ^2.1.0
+  peerDependencies:
+    yjs: ^13.5.51
+  languageName: unknown
+  linkType: soft
+
 "@tootallnate/once@npm:2":
   version: 2.0.0
   resolution: "@tootallnate/once@npm:2.0.0"
@@ -5388,6 +5585,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@ts-morph/common@npm:~0.18.0":
+  version: 0.18.1
+  resolution: "@ts-morph/common@npm:0.18.1"
+  dependencies:
+    fast-glob: ^3.2.12
+    minimatch: ^5.1.0
+    mkdirp: ^1.0.4
+    path-browserify: ^1.0.1
+  checksum: 848fff5f7a6428d7c2f055de20cf8df864a967aac0cc03adc558d853442085a8fd9dec70429da24d67d263794b315edb0791c46d23ad9ae513251a7702df8031
+  languageName: node
+  linkType: hard
+
 "@tsconfig/node10@npm:^1.0.7":
   version: 1.0.9
   resolution: "@tsconfig/node10@npm:1.0.9"
@@ -5416,6 +5625,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/argparse@npm:1.0.38":
+  version: 1.0.38
+  resolution: "@types/argparse@npm:1.0.38"
+  checksum: 26ed7e3f1e3595efdb883a852f5205f971b798e4c28b7e30a32c5298eee596e8b45834ce831f014d250b9730819ab05acff5b31229666d3af4ba465b4697d0eb
+  languageName: node
+  linkType: hard
+
 "@types/aria-query@npm:^5.0.1":
   version: 5.0.1
   resolution: "@types/aria-query@npm:5.0.1"
@@ -5539,6 +5755,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/estree@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "@types/estree@npm:1.0.0"
+  checksum: 910d97fb7092c6738d30a7430ae4786a38542023c6302b95d46f49420b797f21619cdde11fa92b338366268795884111c2eb10356e4bd2c8ad5b92941e9e6443
+  languageName: node
+  linkType: hard
+
 "@types/express-serve-static-core@npm:^4.17.33":
   version: 4.17.33
   resolution: "@types/express-serve-static-core@npm:4.17.33"
@@ -6145,6 +6368,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ajv@npm:~6.12.6":
+  version: 6.12.6
+  resolution: "ajv@npm:6.12.6"
+  dependencies:
+    fast-deep-equal: ^3.1.1
+    fast-json-stable-stringify: ^2.0.0
+    json-schema-traverse: ^0.4.1
+    uri-js: ^4.2.2
+  checksum: 874972efe5c4202ab0a68379481fbd3d1b5d0a7bd6d3cc21d40d3536ebff3352a2a1fabb632d4fd2cc7fe4cbdcd5ed6782084c9bbf7f32a1536d18f9da5007d4
+  languageName: node
+  linkType: hard
+
 "ansi-align@npm:^3.0.0":
   version: 3.0.1
   resolution: "ansi-align@npm:3.0.1"
@@ -6313,7 +6548,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"argparse@npm:^1.0.7":
+"argparse@npm:^1.0.7, argparse@npm:~1.0.9":
   version: 1.0.10
   resolution: "argparse@npm:1.0.10"
   dependencies:
@@ -7233,7 +7468,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"code-block-writer@npm:^11.0.0":
+"code-block-writer@npm:^11.0.0, code-block-writer@npm:^11.0.3":
   version: 11.0.3
   resolution: "code-block-writer@npm:11.0.3"
   checksum: f0a2605f19963d7087267c9b0fd0b05a6638a50e7b29b70f97aa01a514f59475b0626f8aa092188df853ee6d96745426dfa132d6a677795df462c6ce32c21639
@@ -7302,6 +7537,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"colors@npm:~1.2.1":
+  version: 1.2.5
+  resolution: "colors@npm:1.2.5"
+  checksum: b6e23de735f68b72d5cdf6fd854ca43d1b66d82dcf54bda0b788083b910164a040f2c4edf23c670d36a7a2d8f1b7d6e62e3292703e4642691e6ccaa1c62d8f74
+  languageName: node
+  linkType: hard
+
 "combined-stream@npm:^1.0.8":
   version: 1.0.8
   resolution: "combined-stream@npm:1.0.8"
@@ -7346,7 +7588,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"commander@npm:^9.0.0":
+"commander@npm:^9.0.0, commander@npm:^9.4.1":
   version: 9.5.0
   resolution: "commander@npm:9.5.0"
   checksum: c7a3e27aa59e913b54a1bafd366b88650bc41d6651f0cbe258d4ff09d43d6a7394232a4dadd0bf518b3e696fdf595db1028a0d82c785b88bd61f8a440cecfade
@@ -8522,7 +8764,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"estree-walker@npm:^2.0.1":
+"estree-walker@npm:^2.0.1, estree-walker@npm:^2.0.2":
   version: 2.0.2
   resolution: "estree-walker@npm:2.0.2"
   checksum: 6151e6f9828abe2259e57f5fd3761335bb0d2ebd76dc1a01048ccee22fabcfef3c0859300f6d83ff0d1927849368775ec5a6d265dde2f6de5a1be1721cd94efc
@@ -8725,14 +8967,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"fast-deep-equal@npm:^3.1.3":
+"fast-deep-equal@npm:^3.1.1, fast-deep-equal@npm:^3.1.3":
   version: 3.1.3
   resolution: "fast-deep-equal@npm:3.1.3"
   checksum: e21a9d8d84f53493b6aa15efc9cfd53dd5b714a1f23f67fb5dc8f574af80df889b3bce25dc081887c6d25457cce704e636395333abad896ccdec03abaf1f3f9d
   languageName: node
   linkType: hard
 
-"fast-glob@npm:^3.2.11, fast-glob@npm:^3.2.7, fast-glob@npm:^3.2.9":
+"fast-glob@npm:^3.2.11, fast-glob@npm:^3.2.12, fast-glob@npm:^3.2.7, fast-glob@npm:^3.2.9":
   version: 3.2.12
   resolution: "fast-glob@npm:3.2.12"
   dependencies:
@@ -9170,7 +9412,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"fs-extra@npm:^7.0.0, fs-extra@npm:^7.0.1":
+"fs-extra@npm:^7.0.0, fs-extra@npm:^7.0.1, fs-extra@npm:~7.0.1":
   version: 7.0.1
   resolution: "fs-extra@npm:7.0.1"
   dependencies:
@@ -9794,13 +10036,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"highlight.js@npm:^11.7.0":
-  version: 11.7.0
-  resolution: "highlight.js@npm:11.7.0"
-  checksum: 19e3fb8b56f4b361b057a8523b989dfeb6479bbd1e29cec3fac6fa5c78d09927d5fa61b7dba6631fdb57cfdca9b3084aa4da49405ceaf4a67f67beae2ed5b77d
-  languageName: node
-  linkType: hard
-
 "hoist-non-react-statics@npm:^3.3.1, hoist-non-react-statics@npm:^3.3.2":
   version: 3.3.2
   resolution: "hoist-non-react-statics@npm:3.3.2"
@@ -10012,6 +10247,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"idb@npm:^7.1.1":
+  version: 7.1.1
+  resolution: "idb@npm:7.1.1"
+  checksum: 1973c28d53c784b177bdef9f527ec89ec239ec7cf5fcbd987dae75a16c03f5b7dfcc8c6d3285716fd0309dd57739805390bd9f98ce23b1b7d8849a3b52de8d56
+  languageName: node
+  linkType: hard
+
 "ieee754@npm:^1.1.13, ieee754@npm:^1.2.1":
   version: 1.2.1
   resolution: "ieee754@npm:1.2.1"
@@ -10045,6 +10287,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"import-lazy@npm:~4.0.0":
+  version: 4.0.0
+  resolution: "import-lazy@npm:4.0.0"
+  checksum: 22f5e51702134aef78890156738454f620e5fe7044b204ebc057c614888a1dd6fdf2ede0fdcca44d5c173fd64f65c985f19a51775b06967ef58cc3d26898df07
+  languageName: node
+  linkType: hard
+
 "import-local@npm:^3.0.2":
   version: 3.1.0
   resolution: "import-local@npm:3.1.0"
@@ -10218,7 +10467,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-core-module@npm:^2.9.0":
+"is-core-module@npm:^2.1.0, is-core-module@npm:^2.9.0":
   version: 2.11.0
   resolution: "is-core-module@npm:2.11.0"
   dependencies:
@@ -11363,6 +11612,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"jju@npm:~1.4.0":
+  version: 1.4.0
+  resolution: "jju@npm:1.4.0"
+  checksum: 3790481bd2b7827dd6336e6e3dc2dcc6d425679ba7ebde7b679f61dceb4457ea0cda330972494de608571f4973c6dfb5f70fab6f3c5037dbab19ac449a60424f
+  languageName: node
+  linkType: hard
+
 "joi@npm:^17.3.0":
   version: 17.9.1
   resolution: "joi@npm:17.9.1"
@@ -11477,6 +11733,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"json-schema-traverse@npm:^0.4.1":
+  version: 0.4.1
+  resolution: "json-schema-traverse@npm:0.4.1"
+  checksum: 7486074d3ba247769fda17d5181b345c9fb7d12e0da98b22d1d71a5db9698d8b4bd900a3ec1a4ffdd60846fc2556274a5c894d0c48795f14cb03aeae7b55260b
+  languageName: node
+  linkType: hard
+
 "json-stringify-safe@npm:^5.0.1":
   version: 5.0.1
   resolution: "json-stringify-safe@npm:5.0.1"
@@ -11562,7 +11825,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ky@npm:^0.33.2, ky@npm:^0.33.3":
+"kolorist@npm:^1.6.0":
+  version: 1.7.0
+  resolution: "kolorist@npm:1.7.0"
+  checksum: 0eb64d22a204be11ddd7d2017525bf2603de38b15c571f79d6f0c5f1c869b8adfd40c3aa71c12e0cfe5496c25b2bbe891267cbc11f5b3fbc858d74ae79bac293
+  languageName: node
+  linkType: hard
+
+"ky@npm:^0.33.3":
   version: 0.33.3
   resolution: "ky@npm:0.33.3"
   checksum: d1869e1f33c0165355f621b6726fcc1a9de20a31f4a826ca0cfd5753d83b9cba8723402d554a00194e0ee3959e0dda0638f4b99d54a3a7de928b55ff870b0bcc
@@ -11597,7 +11867,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lib0@npm:^0.2.42, lib0@npm:^0.2.63, lib0@npm:^0.2.72, lib0@npm:^0.2.73":
+"lib0@npm:^0.2.35, lib0@npm:^0.2.42, lib0@npm:^0.2.68, lib0@npm:^0.2.72, lib0@npm:^0.2.73":
   version: 0.2.73
   resolution: "lib0@npm:0.2.73"
   dependencies:
@@ -11746,13 +12016,20 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lodash.get@npm:^4.0.0":
+"lodash.get@npm:^4.0.0, lodash.get@npm:^4.4.2":
   version: 4.4.2
   resolution: "lodash.get@npm:4.4.2"
   checksum: e403047ddb03181c9d0e92df9556570e2b67e0f0a930fcbbbd779370972368f5568e914f913e93f3b08f6d492abc71e14d4e9b7a18916c31fa04bd2306efe545
   languageName: node
   linkType: hard
 
+"lodash.isequal@npm:^4.5.0":
+  version: 4.5.0
+  resolution: "lodash.isequal@npm:4.5.0"
+  checksum: da27515dc5230eb1140ba65ff8de3613649620e8656b19a6270afe4866b7bd461d9ba2ac8a48dcc57f7adac4ee80e1de9f965d89d4d81a0ad52bb3eec2609644
+  languageName: node
+  linkType: hard
+
 "lodash.template@npm:^4.2.2":
   version: 4.5.0
   resolution: "lodash.template@npm:4.5.0"
@@ -11772,7 +12049,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4":
+"lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4, lodash@npm:~4.17.15":
   version: 4.17.21
   resolution: "lodash@npm:4.17.21"
   checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7
@@ -11900,6 +12177,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"magic-string@npm:^0.29.0":
+  version: 0.29.0
+  resolution: "magic-string@npm:0.29.0"
+  dependencies:
+    "@jridgewell/sourcemap-codec": ^1.4.13
+  checksum: 19e5398fcfc44804917127c72ad622c68a19a0a10cbdb8d4f9f9417584a087fe9e117140bfb2463d86743cf1ed9cf4182ae0b0ad1a7536f7fdda257ee4449ffb
+  languageName: node
+  linkType: hard
+
 "make-dir@npm:^2.0.0, make-dir@npm:^2.1.0":
   version: 2.1.0
   resolution: "make-dir@npm:2.1.0"
@@ -12177,7 +12463,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"minimatch@npm:^5.0.1":
+"minimatch@npm:^5.0.1, minimatch@npm:^5.1.0":
   version: 5.1.6
   resolution: "minimatch@npm:5.1.6"
   dependencies:
@@ -13127,7 +13413,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"path-parse@npm:^1.0.7":
+"path-parse@npm:^1.0.6, path-parse@npm:^1.0.7":
   version: 1.0.7
   resolution: "path-parse@npm:1.0.7"
   checksum: 49abf3d81115642938a8700ec580da6e830dde670be21893c62f4e10bd7dd4c3742ddc603fe24f898cba7eb0c6bc1777f8d9ac14185d34540c6d4d80cd9cae8a
@@ -13549,6 +13835,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"punycode@npm:^2.1.0":
+  version: 2.3.0
+  resolution: "punycode@npm:2.3.0"
+  checksum: 39f760e09a2a3bbfe8f5287cf733ecdad69d6af2fe6f97ca95f24b8921858b91e9ea3c9eeec6e08cede96181b3bb33f95c6ffd8c77e63986508aa2e8159fa200
+  languageName: node
+  linkType: hard
+
 "puppeteer-core@npm:^2.1.1":
   version: 2.1.1
   resolution: "puppeteer-core@npm:2.1.1"
@@ -14186,7 +14479,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"resolve@npm:^1.1.6, resolve@npm:^1.10.0, resolve@npm:^1.14.2, resolve@npm:^1.17.0, resolve@npm:^1.19.0, resolve@npm:^1.20.0, resolve@npm:^1.22.1":
+"resolve@npm:^1.1.6, resolve@npm:^1.10.0, resolve@npm:^1.14.2, resolve@npm:^1.17.0, resolve@npm:^1.19.0, resolve@npm:^1.20.0, resolve@npm:^1.22.1, resolve@npm:~1.22.1":
   version: 1.22.1
   resolution: "resolve@npm:1.22.1"
   dependencies:
@@ -14199,7 +14492,17 @@ __metadata:
   languageName: node
   linkType: hard
 
-"resolve@patch:resolve@^1.1.6#~builtin<compat/resolve>, resolve@patch:resolve@^1.10.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.14.2#~builtin<compat/resolve>, resolve@patch:resolve@^1.17.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.19.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.20.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.22.1#~builtin<compat/resolve>":
+"resolve@npm:~1.19.0":
+  version: 1.19.0
+  resolution: "resolve@npm:1.19.0"
+  dependencies:
+    is-core-module: ^2.1.0
+    path-parse: ^1.0.6
+  checksum: a05b356e47b85ad3613d9e2a39a824f3c27f4fcad9c9ff6c7cc71a2e314c5904a90ab37481ad0069d03cab9eaaac6eb68aca1bc3355fdb05f1045cd50e2aacea
+  languageName: node
+  linkType: hard
+
+"resolve@patch:resolve@^1.1.6#~builtin<compat/resolve>, resolve@patch:resolve@^1.10.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.14.2#~builtin<compat/resolve>, resolve@patch:resolve@^1.17.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.19.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.20.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.22.1#~builtin<compat/resolve>, resolve@patch:resolve@~1.22.1#~builtin<compat/resolve>":
   version: 1.22.1
   resolution: "resolve@patch:resolve@npm%3A1.22.1#~builtin<compat/resolve>::version=1.22.1&hash=c3c19d"
   dependencies:
@@ -14212,6 +14515,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"resolve@patch:resolve@~1.19.0#~builtin<compat/resolve>":
+  version: 1.19.0
+  resolution: "resolve@patch:resolve@npm%3A1.19.0#~builtin<compat/resolve>::version=1.19.0&hash=c3c19d"
+  dependencies:
+    is-core-module: ^2.1.0
+    path-parse: ^1.0.6
+  checksum: 2443b94d347e6946c87c85faf13071f605e609e0b54784829b0ed2b917d050bfc1cbaf4ecc6453f224cfa7d0c5dcd97cbb273454cd210bee68e4af15c1a5abc9
+  languageName: node
+  linkType: hard
+
 "responselike@npm:^2.0.0":
   version: 2.0.1
   resolution: "responselike@npm:2.0.1"
@@ -14409,7 +14722,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"semver@npm:^7.1.1, semver@npm:^7.1.3, semver@npm:^7.2.1, semver@npm:^7.3.2, semver@npm:^7.3.5, semver@npm:^7.3.7":
+"semver@npm:^7.1.1, semver@npm:^7.1.3, semver@npm:^7.2.1, semver@npm:^7.3.2, semver@npm:^7.3.5, semver@npm:^7.3.7, semver@npm:~7.3.0":
   version: 7.3.8
   resolution: "semver@npm:7.3.8"
   dependencies:
@@ -14915,6 +15228,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"string-argv@npm:~0.3.1":
+  version: 0.3.1
+  resolution: "string-argv@npm:0.3.1"
+  checksum: efbd0289b599bee808ce80820dfe49c9635610715429c6b7cc50750f0437e3c2f697c81e5c390208c13b5d5d12d904a1546172a88579f6ee5cbaaaa4dc9ec5cf
+  languageName: node
+  linkType: hard
+
 "string-length@npm:^4.0.1":
   version: 4.0.2
   resolution: "string-length@npm:4.0.2"
@@ -15026,7 +15346,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"strip-json-comments@npm:^3.0.1, strip-json-comments@npm:^3.1.1":
+"strip-json-comments@npm:^3.0.1, strip-json-comments@npm:^3.1.1, strip-json-comments@npm:~3.1.1":
   version: 3.1.1
   resolution: "strip-json-comments@npm:3.1.1"
   checksum: 492f73e27268f9b1c122733f28ecb0e7e8d8a531a6662efbd08e22cccb3f9475e90a1b82cab06a392f6afae6d2de636f977e231296400d0ec5304ba70f166443
@@ -15396,6 +15716,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ts-morph@npm:17.0.1":
+  version: 17.0.1
+  resolution: "ts-morph@npm:17.0.1"
+  dependencies:
+    "@ts-morph/common": ~0.18.0
+    code-block-writer: ^11.0.3
+  checksum: 4748ab45d0fb0be235f69399ea217cf1c5984ad2ef3ff9eba5a417571f73098c6f1f765fc011eaadc48179471b977f1e44f72eb993932e5c74c5031ab6c60f3a
+  languageName: node
+  linkType: hard
+
 "ts-node@npm:^10.9.1":
   version: 10.9.1
   resolution: "ts-node@npm:10.9.1"
@@ -15565,6 +15895,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"typescript@npm:~4.8.4":
+  version: 4.8.4
+  resolution: "typescript@npm:4.8.4"
+  bin:
+    tsc: bin/tsc
+    tsserver: bin/tsserver
+  checksum: 3e4f061658e0c8f36c820802fa809e0fd812b85687a9a2f5430bc3d0368e37d1c9605c3ce9b39df9a05af2ece67b1d844f9f6ea8ff42819f13bcb80f85629af0
+  languageName: node
+  linkType: hard
+
 "typescript@patch:typescript@^5.0.3#~builtin<compat/typescript>":
   version: 5.0.3
   resolution: "typescript@patch:typescript@npm%3A5.0.3#~builtin<compat/typescript>::version=5.0.3&hash=85af82"
@@ -15575,6 +15915,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"typescript@patch:typescript@~4.8.4#~builtin<compat/typescript>":
+  version: 4.8.4
+  resolution: "typescript@patch:typescript@npm%3A4.8.4#~builtin<compat/typescript>::version=4.8.4&hash=1a91c8"
+  bin:
+    tsc: bin/tsc
+    tsserver: bin/tsserver
+  checksum: c981e82b77a5acdcc4e69af9c56cdecf5b934a87a08e7b52120596701e389a878b8e3f860e73ffb287bf649cc47a8c741262ce058148f71de4cdd88bb9c75153
+  languageName: node
+  linkType: hard
+
 "uglify-js@npm:^3.1.4":
   version: 3.17.4
   resolution: "uglify-js@npm:3.17.4"
@@ -15738,6 +16088,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"uri-js@npm:^4.2.2":
+  version: 4.4.1
+  resolution: "uri-js@npm:4.4.1"
+  dependencies:
+    punycode: ^2.1.0
+  checksum: 7167432de6817fe8e9e0c9684f1d2de2bb688c94388f7569f7dbdb1587c9f4ca2a77962f134ec90be0cc4d004c939ff0d05acc9f34a0db39a3c797dada262633
+  languageName: node
+  linkType: hard
+
 "use-resize-observer@npm:^9.1.0":
   version: 9.1.0
   resolution: "use-resize-observer@npm:9.1.0"
@@ -15831,6 +16190,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"validator@npm:^13.7.0":
+  version: 13.9.0
+  resolution: "validator@npm:13.9.0"
+  checksum: e2c936f041f61faa42bafd17c6faddf939498666cd82e88d733621c286893730b008959f4cb12ab3e236148a4f3805c30b85e3dcf5e0efd8b0cbcd36c02bfc0c
+  languageName: node
+  linkType: hard
+
 "vary@npm:~1.1.2":
   version: 1.1.2
   resolution: "vary@npm:1.1.2"
@@ -15838,6 +16204,26 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vite-plugin-dts@npm:^2.1.0":
+  version: 2.1.0
+  resolution: "vite-plugin-dts@npm:2.1.0"
+  dependencies:
+    "@babel/parser": ^7.20.15
+    "@microsoft/api-extractor": ^7.33.5
+    "@rollup/pluginutils": ^5.0.2
+    "@rushstack/node-core-library": ^3.53.2
+    debug: ^4.3.4
+    fast-glob: ^3.2.12
+    fs-extra: ^10.1.0
+    kolorist: ^1.6.0
+    magic-string: ^0.29.0
+    ts-morph: 17.0.1
+  peerDependencies:
+    vite: ">=2.9.0"
+  checksum: 6c51b6de986e622a8ec271b68dcbfac55ab0ba65ca3b74e19e3088ff931913e5bb5c6d15e77525ca0bc11a6c87497f4529132cd0ad6c5970e8794f809cfa9cb8
+  languageName: node
+  linkType: hard
+
 "vite@npm:^4.2.1":
   version: 4.2.1
   resolution: "vite@npm:4.2.1"
@@ -16260,6 +16646,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"y-indexeddb@npm:^9.0.10":
+  version: 9.0.10
+  resolution: "y-indexeddb@npm:9.0.10"
+  dependencies:
+    lib0: ^0.2.35
+  peerDependencies:
+    yjs: ^13.0.0
+  checksum: 6a57825b599cdf77da7c9857b1acc0f782492fc41531618bd7392bdfbcf11c783ff1a30b82ae080b050a5ebafd54754a978de7a6ac42144ec59eb1fbdebd090b
+  languageName: node
+  linkType: hard
+
 "y-protocols@npm:^1.0.5":
   version: 1.0.5
   resolution: "y-protocols@npm:1.0.5"
@@ -16269,7 +16666,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"y-webrtc@npm:^10.2.4":
+"y-webrtc@npm:^10.2.5":
   version: 10.2.5
   resolution: "y-webrtc@npm:10.2.5"
   dependencies:
@@ -16447,7 +16844,24 @@ __metadata:
   languageName: node
   linkType: hard
 
-"zod@npm:^3.20.6, zod@npm:^3.21.4":
+"z-schema@npm:~5.0.2":
+  version: 5.0.5
+  resolution: "z-schema@npm:5.0.5"
+  dependencies:
+    commander: ^9.4.1
+    lodash.get: ^4.4.2
+    lodash.isequal: ^4.5.0
+    validator: ^13.7.0
+  dependenciesMeta:
+    commander:
+      optional: true
+  bin:
+    z-schema: bin/z-schema
+  checksum: 8a1d66817ae4384dc3f63311f0cccaadd95cc9640eaade5fd3fbf91aa80d6bb82fb95d9b9171fa82ac371a0155b32b7f5f77bbe84dabaca611b66f74c628f0b8
+  languageName: node
+  linkType: hard
+
+"zod@npm:^3.21.4":
   version: 3.21.4
   resolution: "zod@npm:3.21.4"
   checksum: f185ba87342ff16f7a06686767c2b2a7af41110c7edf7c1974095d8db7a73792696bcb4a00853de0d2edeb34a5b2ea6a55871bc864227dace682a0a28de33e1f
diff --git a/apps/web/src/components/affine/pivots/styles.ts b/apps/web/src/components/affine/pivots/styles.ts
index c824a2ac2f..c29eaca885 100644
--- a/apps/web/src/components/affine/pivots/styles.ts
+++ b/apps/web/src/components/affine/pivots/styles.ts
@@ -48,6 +48,7 @@ export const StyledPivot = styled('div')<{
     cursor: disable ? 'not-allowed' : 'pointer',
     background: isOver ? alpha(theme.colors.primaryColor, 0.06) : '',
     fontSize: theme.font.base,
+    userSelect: 'none',
     span: {
       flexGrow: '1',
       textAlign: 'left',
diff --git a/apps/web/src/components/affine/workspace-setting-detail/style.ts b/apps/web/src/components/affine/workspace-setting-detail/style.ts
index 6686908989..9eed6a4452 100644
--- a/apps/web/src/components/affine/workspace-setting-detail/style.ts
+++ b/apps/web/src/components/affine/workspace-setting-detail/style.ts
@@ -4,15 +4,15 @@ export const StyledSettingContainer = styled('div')(() => {
   return {
     display: 'flex',
     flexDirection: 'column',
-    padding: '48px 0 0 48px',
-    height: 'calc(100vh - 48px)',
+    padding: '52px 0 0 52px',
+    height: 'calc(100vh - 52px)',
   };
 });
 
 export const StyledSettingSidebar = styled('div')(() => {
   {
     return {
-      marginTop: '48px',
+      marginTop: '52px',
     };
   }
 });
diff --git a/apps/web/src/components/blocksuite/block-suite-page-list/page-list/Empty.tsx b/apps/web/src/components/blocksuite/block-suite-page-list/page-list/Empty.tsx
index a0bd359e67..64ba45a137 100644
--- a/apps/web/src/components/blocksuite/block-suite-page-list/page-list/Empty.tsx
+++ b/apps/web/src/components/blocksuite/block-suite-page-list/page-list/Empty.tsx
@@ -18,7 +18,7 @@ export const PageListEmpty = (props: { listType?: string }) => {
   };
 
   return (
-    <div style={{ height: 'calc(100% - 48px)' }}>
+    <div style={{ height: 'calc(100% - 52px)' }}>
       <Empty description={getEmptyDescription()} />
     </div>
   );
diff --git a/apps/web/src/components/blocksuite/block-suite-page-list/page-list/styles.ts b/apps/web/src/components/blocksuite/block-suite-page-list/page-list/styles.ts
index 3a7b2742dd..1948182316 100644
--- a/apps/web/src/components/blocksuite/block-suite-page-list/page-list/styles.ts
+++ b/apps/web/src/components/blocksuite/block-suite-page-list/page-list/styles.ts
@@ -3,7 +3,7 @@ import { TableRow } from '@affine/component';
 
 export const StyledTableContainer = styled('div')(({ theme }) => {
   return {
-    height: 'calc(100vh - 48px)',
+    height: 'calc(100vh - 52px)',
     padding: '78px 72px',
     overflowY: 'auto',
     [theme.breakpoints.down('sm')]: {
diff --git a/apps/web/src/components/blocksuite/header/header-right-items/theme-mode-switch/style.ts b/apps/web/src/components/blocksuite/header/header-right-items/theme-mode-switch/style.ts
index 35253beb72..21d2df1042 100644
--- a/apps/web/src/components/blocksuite/header/header-right-items/theme-mode-switch/style.ts
+++ b/apps/web/src/components/blocksuite/header/header-right-items/theme-mode-switch/style.ts
@@ -4,7 +4,7 @@ import spring, { toString } from 'css-spring';
 
 const ANIMATE_DURATION = 400;
 
-export const StyledThemeModeSwitch = styled('div')(({ theme }) => {
+export const StyledThemeModeSwitch = styled('button')(({ theme }) => {
   return {
     width: '32px',
     height: '32px',
diff --git a/apps/web/src/components/blocksuite/header/styles.ts b/apps/web/src/components/blocksuite/header/styles.ts
index d9265fc4bd..9010efe838 100644
--- a/apps/web/src/components/blocksuite/header/styles.ts
+++ b/apps/web/src/components/blocksuite/header/styles.ts
@@ -5,23 +5,27 @@ import {
   textEllipsis,
 } from '@affine/component';
 
-export const StyledHeaderContainer = styled('div')<{ hasWarning: boolean }>(
-  ({ theme, hasWarning }) => {
-    return {
-      height: hasWarning ? '96px' : '48px',
-      flexShrink: 0,
-      position: 'sticky',
-      top: 0,
-      background: theme.colors.pageBackground,
-      zIndex: 1,
-    };
-  }
-);
+export const StyledHeaderContainer = styled('div')<{
+  hasWarning: boolean;
+}>(({ theme, hasWarning }) => {
+  return {
+    height: hasWarning ? '96px' : '52px',
+    flexShrink: 0,
+    position: 'sticky',
+    top: 0,
+    background: theme.colors.pageBackground,
+    zIndex: 1,
+    WebkitAppRegion: 'drag',
+    button: {
+      WebkitAppRegion: 'no-drag',
+    },
+  };
+});
 export const StyledHeader = styled('div')<{ hasWarning: boolean }>(
   ({ theme }) => {
     return {
       flexShrink: 0,
-      height: '48px',
+      height: '52px',
       width: '100%',
       padding: '0 20px',
       ...displayFlex('space-between', 'center'),
@@ -56,6 +60,7 @@ export const StyledTitle = styled('div')(({ theme }) => {
       maxWidth: '180px',
     },
     transition: 'max-width .15s',
+    userSelect: 'none',
     ...textEllipsis(1),
   };
 });
diff --git a/apps/web/src/components/page-detail-editor.tsx b/apps/web/src/components/page-detail-editor.tsx
index 174c17184a..3e4d4aa4aa 100644
--- a/apps/web/src/components/page-detail-editor.tsx
+++ b/apps/web/src/components/page-detail-editor.tsx
@@ -68,7 +68,7 @@ export const PageDetailEditor: React.FC<PageDetailEditorProps> = ({
       </BlockSuiteEditorHeader>
       <Editor
         style={{
-          height: 'calc(100% - 48px)',
+          height: 'calc(100% - 52px)',
         }}
         key={pageId}
         blockSuiteWorkspace={blockSuiteWorkspace}
diff --git a/apps/web/src/components/pure/workspace-avatar/index.tsx b/apps/web/src/components/pure/workspace-avatar/index.tsx
index 213929d456..1e1e906192 100644
--- a/apps/web/src/components/pure/workspace-avatar/index.tsx
+++ b/apps/web/src/components/pure/workspace-avatar/index.tsx
@@ -64,6 +64,7 @@ export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
             lineHeight: '1',
             justifyContent: 'center',
             alignItems: 'center',
+            userSelect: 'none',
           }}
         >
           {(name || 'AFFiNE').substring(0, 1)}
diff --git a/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/styles.ts b/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/styles.ts
index 8ef1a68a22..2db49695ec 100644
--- a/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/styles.ts
+++ b/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/styles.ts
@@ -27,6 +27,7 @@ export const StyledWorkspaceName = styled('div')(() => {
   return {
     lineHeight: '24px',
     fontWeight: 600,
+    userSelect: 'none',
     ...textEllipsis(1),
   };
 });
@@ -37,6 +38,7 @@ export const StyledWorkspaceStatus = styled('div')(({ theme }) => {
     ...displayFlex('flex-start', 'center'),
     fontSize: theme.font.sm,
     color: theme.colors.secondaryTextColor,
+    userSelect: 'none',
     svg: {
       color: theme.colors.iconColor,
       fontSize: theme.font.base,
diff --git a/apps/web/src/components/pure/workspace-slider-bar/index.tsx b/apps/web/src/components/pure/workspace-slider-bar/index.tsx
index ce5d70e62b..b7da14955d 100644
--- a/apps/web/src/components/pure/workspace-slider-bar/index.tsx
+++ b/apps/web/src/components/pure/workspace-slider-bar/index.tsx
@@ -10,7 +10,7 @@ import {
 import type { Page, PageMeta } from '@blocksuite/store';
 import { useMediaQuery, useTheme } from '@mui/material';
 import type React from 'react';
-import { useCallback } from 'react';
+import { useCallback, useEffect } from 'react';
 
 import {
   useSidebarResizing,
@@ -112,6 +112,9 @@ export const WorkSpaceSliderBar: React.FC<WorkSpaceSliderBarProps> = ({
       { once: true }
     );
   }, [setIsResizing, setSidebarOpen, setSliderWidth]);
+  useEffect(() => {
+    window.apis?.onSidebarVisibilityChange(sidebarOpen);
+  }, [sidebarOpen]);
   return (
     <>
       <StyledSliderBarWrapper data-testid="sliderBar-root">
diff --git a/apps/web/src/components/pure/workspace-slider-bar/shared-styles.ts b/apps/web/src/components/pure/workspace-slider-bar/shared-styles.ts
index 4cd939700d..8d8838a5ef 100644
--- a/apps/web/src/components/pure/workspace-slider-bar/shared-styles.ts
+++ b/apps/web/src/components/pure/workspace-slider-bar/shared-styles.ts
@@ -12,6 +12,7 @@ export const StyledListItem = styled('div')<{
     cursor: 'pointer',
     marginBottom: '4px',
     position: 'relative',
+    userSelect: 'none',
     ...displayFlex('flex-start', 'center'),
     ...(disabled
       ? {
@@ -72,6 +73,7 @@ export const StyledCollapseItem = styled('div')<{
       : theme.colors.textColor,
     cursor: disable ? 'not-allowed' : 'pointer',
     background: isOver ? alpha(theme.colors.primaryColor, 0.06) : '',
+    userSelect: 'none',
 
     span: {
       flexGrow: '1',
diff --git a/apps/web/src/components/pure/workspace-slider-bar/style.ts b/apps/web/src/components/pure/workspace-slider-bar/style.ts
index fc3f02d5a7..ae57152564 100644
--- a/apps/web/src/components/pure/workspace-slider-bar/style.ts
+++ b/apps/web/src/components/pure/workspace-slider-bar/style.ts
@@ -1,4 +1,5 @@
 import { displayFlex, styled } from '@affine/component';
+import { getEnvironment } from '@affine/env';
 import Link from 'next/link';
 
 export const StyledSliderBarWrapper = styled('div')(() => {
@@ -6,6 +7,9 @@ export const StyledSliderBarWrapper = styled('div')(() => {
     height: '100%',
     width: 'auto',
     position: 'relative',
+    'button, a': {
+      userSelect: 'none',
+    },
   };
 });
 
@@ -14,10 +18,13 @@ export const StyledSliderBar = styled('div')<{
   show: boolean;
   floating: boolean;
 }>(({ theme, show, floating, resizing }) => {
+  const env = getEnvironment();
+  const macosElectron = env.isDesktop && env.isMacOs;
   return {
     whiteSpace: 'nowrap',
     height: '100%',
-    background: theme.colors.hubBackground,
+    background:
+      !floating && macosElectron ? 'transparent' : theme.colors.hubBackground,
     zIndex: theme.zIndex.modal,
     transition: !resizing ? 'width .15s, padding .15s' : '',
     padding: show ? '0 4px' : '0',
@@ -33,10 +40,10 @@ export const StyledSliderBar = styled('div')<{
 });
 export const StyledSidebarSwitchWrapper = styled('div')(() => {
   return {
-    height: '48px',
+    height: '52px',
     flexShrink: 0,
     padding: '0 16px',
-    ...displayFlex('flex-start', 'center'),
+    ...displayFlex('flex-end', 'center'),
   };
 });
 export const StyledSliderBarInnerWrapper = styled('div')(() => {
@@ -61,7 +68,7 @@ export const StyledLink = styled(Link)(() => {
 });
 export const StyledNewPageButton = styled('button')(({ theme }) => {
   return {
-    height: '48px',
+    height: '52px',
     ...displayFlex('flex-start', 'center'),
     borderTop: '1px solid',
     borderColor: theme.colors.borderColor,
diff --git a/apps/web/src/layouts/styles.ts b/apps/web/src/layouts/styles.ts
index 547b4f935f..56d292b953 100644
--- a/apps/web/src/layouts/styles.ts
+++ b/apps/web/src/layouts/styles.ts
@@ -5,7 +5,6 @@ export const StyledPage = styled('div')<{ resizing?: boolean }>(
     return {
       cursor: resizing ? 'col-resize' : 'default',
       height: '100vh',
-      backgroundColor: theme.colors.pageBackground,
       transition: 'background-color .5s',
       display: 'flex',
       flexGrow: '1',
@@ -32,6 +31,7 @@ export const MainContainerWrapper = styled('div')(({ theme }) => {
     position: 'relative',
     maxWidth: '100vw',
     overflow: 'auto',
+    backgroundColor: theme.colors.pageBackground,
   };
 });
 
diff --git a/apps/web/src/pages/public-workspace/[workspaceId]/[pageId].tsx b/apps/web/src/pages/public-workspace/[workspaceId]/[pageId].tsx
index 51b385759c..fda7f25b76 100644
--- a/apps/web/src/pages/public-workspace/[workspaceId]/[pageId].tsx
+++ b/apps/web/src/pages/public-workspace/[workspaceId]/[pageId].tsx
@@ -24,7 +24,7 @@ import { initPage } from '../../../utils';
 export const NavContainer = styled('div')(({ theme }) => {
   return {
     width: '100vw',
-    height: '48px',
+    height: '52px',
     ...displayFlex('space-between', 'center'),
     backgroundColor: theme.colors.pageBackground,
   };
diff --git a/apps/web/src/providers/ThemeProvider.tsx b/apps/web/src/providers/ThemeProvider.tsx
index 2526a9c3af..73b137ae7e 100644
--- a/apps/web/src/providers/ThemeProvider.tsx
+++ b/apps/web/src/providers/ThemeProvider.tsx
@@ -47,6 +47,7 @@ const ThemeProviderInner = memo<React.PropsWithChildren>(
     // SSR will always render the light theme, so we need to defer the theme if user selected dark mode
     const [deferTheme, setDeferTheme] = useState('light');
     useEffect(() => {
+      window.apis?.onThemeChange(theme === 'dark' ? 'dark' : 'light');
       setDeferTheme(theme === 'dark' ? 'dark' : 'light');
     }, [theme]);
     return (
diff --git a/apps/web/src/shared/index.ts b/apps/web/src/shared/index.ts
index 6534fdcff2..62ce1e7677 100644
--- a/apps/web/src/shared/index.ts
+++ b/apps/web/src/shared/index.ts
@@ -5,12 +5,6 @@ import type { ReactElement, ReactNode } from 'react';
 
 export { BlockSuiteWorkspace };
 
-declare global {
-  interface Window {
-    CLIENT_APP?: boolean;
-  }
-}
-
 export type AffineOfficialWorkspace = AffineWorkspace | LocalWorkspace;
 
 export type AllWorkspace = AffineOfficialWorkspace;
diff --git a/apps/web/src/styles/globals.css b/apps/web/src/styles/globals.css
index c014a7177c..d6e5984dba 100644
--- a/apps/web/src/styles/globals.css
+++ b/apps/web/src/styles/globals.css
@@ -152,7 +152,7 @@ legend {
   font-family: var(--affine-font-family);
 }
 body {
-  background: #fff;
+  background: transparent;
   overflow: hidden;
 }
 
diff --git a/apps/web/src/types/types.d.ts b/apps/web/src/types/types.d.ts
index a7eac6ca21..a459f45e71 100644
--- a/apps/web/src/types/types.d.ts
+++ b/apps/web/src/types/types.d.ts
@@ -1,4 +1,9 @@
 /// <reference types="@webpack/env"" />
+
+// not using import because it will break the declare module line below
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference
+/// <reference path='../../../electron/layers/preload/preload.d.ts' />
+
 declare module '*.md' {
   const text: string;
   export default text;
diff --git a/packages/component/src/components/contact-modal/style.ts b/packages/component/src/components/contact-modal/style.ts
index 01b7cd57f9..84e796ccff 100644
--- a/packages/component/src/components/contact-modal/style.ts
+++ b/packages/component/src/components/contact-modal/style.ts
@@ -91,7 +91,7 @@ export const StyledSubTitle = styled('div')(({ theme }) => {
     fontSize: '18px',
     fontWeight: '600',
     color: theme.colors.textColor,
-    marginTop: '48px',
+    marginTop: '52px',
     marginBottom: '8px',
     textAlign: 'center',
   };
diff --git a/packages/env/env.d.ts b/packages/env/env.d.ts
new file mode 100644
index 0000000000..1c6791acc7
--- /dev/null
+++ b/packages/env/env.d.ts
@@ -0,0 +1 @@
+import '../../apps/electron/layers/preload/preload.d.ts';
diff --git a/packages/env/src/index.ts b/packages/env/src/index.ts
index cac5111570..13bb3bd4ee 100644
--- a/packages/env/src/index.ts
+++ b/packages/env/src/index.ts
@@ -5,7 +5,7 @@ import { z } from 'zod';
 import { getUaHelper } from './ua-helper';
 
 type BrowserBase = {
-  isDesktop: false;
+  isDesktop: boolean;
   isBrowser: true;
   isServer: false;
   isDebug: boolean;
@@ -41,23 +41,17 @@ type Server = {
   isDebug: boolean;
 };
 
-type Desktop = Browser & {
+interface Desktop extends ChromeBrowser {
   isDesktop: true;
   isBrowser: true;
   isServer: false;
   isDebug: boolean;
-};
+}
 
 export type Environment = Browser | Server | Desktop;
 
 let environment: Environment | null = null;
 
-declare global {
-  interface Window {
-    CLIENT_APP?: boolean;
-  }
-}
-
 export function getEnvironment() {
   if (environment) {
     return environment;
@@ -73,7 +67,7 @@ export function getEnvironment() {
   } else {
     const uaHelper = getUaHelper();
     environment = {
-      isDesktop: window.CLIENT_APP,
+      isDesktop: window.appInfo?.electron,
       isBrowser: true,
       isServer: false,
       isDebug,
diff --git a/packages/env/tsconfig.json b/packages/env/tsconfig.json
index 7513033f03..12e70c9ab1 100644
--- a/packages/env/tsconfig.json
+++ b/packages/env/tsconfig.json
@@ -1,4 +1,4 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["./src"]
+  "include": ["./src", "env.d.ts"]
 }