refactor: @blocksuite/editor -> @blocksuite/presets

.commitlintrc.json

@@ -4,7 +4,16 @@
     "scope-enum": [
       2,
       "always",
-      ["page", "edgeless", "database", "virgo", "store", "std", "playground"]
+      [
+        "page",
+        "edgeless",
+        "database",
+        "virgo",
+        "store",
+        "std",
+        "presets",
+        "playground"
+      ]
     ]
   }
 }

.eslintrc.cjs

@@ -3,7 +3,7 @@
 const allPackages = [
   'blocks',
   'docs',
-  'editor',
+  'presets',
   'global',
   'playground',
   'store',
@@ -60,7 +60,7 @@ module.exports = {
     'packages/store/dist/*',
     'packages/lit/dist/*',
     'packages/blocks/dist/*',
-    'packages/editor/dist/*',
+    'packages/presets/dist/*',
     'packages/global/dist/*',
     'packages/playground/dist/assets/*',
     'packages/virgo/dist/*',

.github/workflows/lint.yml

@@ -43,7 +43,7 @@ jobs:
         run: pnpm install
 
       - name: Run type check
-        run: pnpm build:editor && pnpm build:playground
+        run: pnpm build:packages && pnpm build:playground
         env:
           NODE_OPTIONS: --max-old-space-size=8192
 

README.md

@@ -12,7 +12,7 @@
 [![Checks Status](https://img.shields.io/github/checks-status/toeverything/blocksuite/master)](https://github.com/toeverything/blocksuite/actions?query=branch%3Amaster)
 [![Issues Closed](https://img.shields.io/github/issues-closed/toeverything/blocksuite?color=6880ff)](https://github.com/toeverything/blocksuite/issues?q=is%3Aissue+is%3Aclosed)
 [![NPM Latest Release](https://img.shields.io/npm/v/@blocksuite/store.svg?maxAge=300&color=6880ff)](./packages/store/package.json)
-[![NPM Nightly Release](https://img.shields.io/npm/v/@blocksuite/editor/nightly?color=6880ff)](https://github.com/toeverything/blocksuite/actions/workflows/nightly-release.yml?query=branch%3Amaster)
+[![NPM Nightly Release](https://img.shields.io/npm/v/@blocksuite/presets/nightly?color=6880ff)](https://github.com/toeverything/blocksuite/actions/workflows/nightly-release.yml?query=branch%3Amaster)
 [![Open in StackBlitz](https://img.shields.io/badge/open%20in-StackBlitz-black)](https://stackblitz.com/github/toeverything/blocksuite)
 [![Join Discord](https://img.shields.io/discord/959027316334407691)](https://discord.gg/9vwSWmYYcZ)
 
@@ -40,7 +40,7 @@ The major packages in BlockSuite include the following:
 - `@blocksuite/lit`: The default view layer for rendering blocks and widgets as [web components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components). It's built on top of [lit](https://lit.dev/) and the headless `block-std`, and could be replaced by alternative frameworks.
 - `@blocksuite/virgo`: Atomic rich text _component_ used in BlockSuite. Every editable block could hold its own virgo instances, leveraging the store to reconcile the block tree.
 - `@blocksuite/blocks`: Editable first-party blocks under the `affine` scope. The default AFFiNE editors are simply different implementations of the `affine:page` blocks.
-- `@blocksuite/editor`: The ready-to-use editors composed by blocks.
+- `@blocksuite/presets`: The ready-to-use editors composed by blocks.
 - `@blocksuite/playground`: Default editor playground with local-first data persistence and real-time collaboration support.
 
 ## Why BlockSuite?

package.json

@@ -6,7 +6,7 @@
     "packages/block-std",
     "packages/blocks",
     "packages/docs",
-    "packages/editor",
+    "packages/presets",
     "packages/global",
     "packages/lit",
     "packages/playground",
@@ -33,11 +33,11 @@
     "test:headed": "playwright test --debug",
     "test:store": "pnpm --filter @blocksuite/store test",
     "test:virgo": "pnpm --filter @blocksuite/virgo test",
-    "test:integration": "pnpm --filter @blocksuite/editor test",
+    "test:integration": "pnpm --filter @blocksuite/presets test",
     "test:node": "node --experimental-specifier-resolution=node --loader ts-node/esm ./scripts/node-import-test.ts",
     "format": "prettier --write --cache packages tests",
-    "build": "pnpm build:editor && pnpm build:playground && pnpm build:docs",
-    "build:editor": "pnpm --filter @blocksuite/editor build",
+    "build": "pnpm build:packages && pnpm build:playground",
+    "build:packages": "pnpm -r --filter=!@blocksuite/docs --filter=!@blocksuite/playground run build",
     "build:playground": "pnpm --filter @blocksuite/playground build",
     "build:docs": "pnpm --filter @blocksuite/docs build",
     "size:data": "node --loader ts-node/esm ./scripts/size-data.ts",

packages/blocks/src/_common/widgets/block-hub/components/block-hub.ts

@@ -8,28 +8,24 @@ import { classMap } from 'lit/directives/class-map.js';
 
 import { BlockHubIcon, CrossIcon } from '../../../../_common/icons/index.js';
 import {
+  asyncFocusRichText,
+  buildPath,
   calcDropTarget,
   type DroppingType,
+  type EditingState,
   getClosestBlockElementByPoint,
   getDocPage,
   getEdgelessPage,
+  getHoveringNote,
   getModelByBlockElement,
   isPageMode,
   Point,
-  uploadImageFromLocal,
-} from '../../../../_common/utils/index.js';
-import {
-  type EditingState,
   Rect,
   stopPropagation,
+  uploadImageFromLocal,
 } from '../../../../_common/utils/index.js';
+import { getServiceOrRegister } from '../../../../_legacy/service/index.js';
 import { toggleBookmarkCreateModal } from '../../../../bookmark-block/components/index.js';
-import {
-  asyncFocusRichText,
-  buildPath,
-  getHoveringNote,
-  getServiceOrRegister,
-} from '../../../../index.js';
 import { DocPageBlockComponent } from '../../../../page-block/doc/doc-page-block.js';
 import type { EdgelessPageBlockComponent } from '../../../../page-block/edgeless/edgeless-page-block.js';
 import { autoScroll } from '../../../../page-block/text-selection/utils.js';

packages/blocks/src/_presets/index.ts

@@ -19,7 +19,7 @@ import { DataViewBlockSchema } from '../data-view-block/index.js';
 import { DatabaseBlockSchema } from '../database-block/database-model.js';
 import { DatabaseService } from '../database-block/database-service.js';
 import { DividerBlockSchema } from '../divider-block/divider-model.js';
-import { embedGithubBlockSpec } from '../embed-github-block/index.js';
+import { EmbedGithubBlockSpec } from '../embed-github-block/index.js';
 import { FrameBlockSchema } from '../frame-block/index.js';
 import { ImageBlockSchema } from '../image-block/image-model.js';
 import { ImageService } from '../image-block/index.js';
@@ -190,7 +190,7 @@ export const PagePreset: BlockSpec[] = [
       },
     },
   },
-  embedGithubBlockSpec,
+  EmbedGithubBlockSpec,
 ];
 
 export const EdgelessPreset: BlockSpec[] = [
@@ -281,5 +281,5 @@ export const EdgelessPreset: BlockSpec[] = [
       component: literal`affine-surface-ref`,
     },
   },
-  embedGithubBlockSpec,
+  EmbedGithubBlockSpec,
 ];

packages/blocks/src/embed-github-block/embed-github-spec.ts

@@ -3,7 +3,7 @@ import { literal } from 'lit/static-html.js';
 import { createEmbedBlock } from '../_common/embed-block-helper/index.js';
 import { EmbedGithubBlockModel } from './embed-github-model.js';
 
-export const embedGithubBlockSpec = createEmbedBlock({
+export const EmbedGithubBlockSpec = createEmbedBlock({
   schema: {
     name: 'github',
     version: 1,

packages/blocks/src/models.ts

@@ -20,7 +20,7 @@ import type { DatabaseBlockModel } from './database-block/database-model.js';
 import { DatabaseBlockSchema } from './database-block/database-model.js';
 import type { DividerBlockModel } from './divider-block/divider-model.js';
 import { DividerBlockSchema } from './divider-block/divider-model.js';
-import { embedGithubBlockSpec } from './embed-github-block/index.js';
+import { EmbedGithubBlockSpec } from './embed-github-block/index.js';
 import type { FrameBlockModel } from './frame-block/frame-model.js';
 import { FrameBlockSchema } from './frame-block/frame-model.js';
 import type { ImageBlockModel } from './image-block/image-model.js';
@@ -73,7 +73,7 @@ export const AffineSchemas: z.infer<typeof BlockSchema>[] = [
 export const __unstableSchemas = [
   DataViewBlockSchema,
   AttachmentBlockSchema,
-  embedGithubBlockSpec.schema,
+  EmbedGithubBlockSpec.schema,
 ] satisfies z.infer<typeof BlockSchema>[];
 
 // TODO support dynamic register

packages/docs/.vitepress/config.ts

@@ -87,7 +87,10 @@ export default defineConfig({
           },
           { text: '@blocksuite/lit', link: '/api/@blocksuite/lit/index' },
           { text: '@blocksuite/virgo', link: '/api/@blocksuite/virgo/index' },
-          { text: '@blocksuite/editor', link: '/api/@blocksuite/editor/index' },
+          {
+            text: '@blocksuite/presets',
+            link: '/api/@blocksuite/presets/index',
+          },
         ],
       },
       {

packages/docs/blocksuite-overview.md

@@ -20,7 +20,7 @@ The major packages in BlockSuite include the following:
 - `@blocksuite/lit`: The default view layer for rendering blocks and widgets as [web components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components). It's built on top of [lit](https://lit.dev/) and the headless `block-std`, and could be replaced by alternative frameworks.
 - `@blocksuite/virgo`: Atomic rich text _component_ used in BlockSuite. Every editable block could hold its own virgo instances, leveraging the store to reconcile the block tree.
 - `@blocksuite/blocks`: Editable first-party blocks under the `affine` scope. The default AFFiNE editors are simply different implementations of the `affine:page` blocks.
-- `@blocksuite/editor`: The ready-to-use editors composed by blocks.
+- `@blocksuite/presets`: The ready-to-use editors composed by blocks.
 - `@blocksuite/playground`: Default editor playground with local-first data persistence and real-time collaboration support.
 
 ## Why BlockSuite?

packages/docs/components/code-sandbox.vue

@@ -18,7 +18,7 @@
         '@toeverything/theme': 'latest',
         '@blocksuite/block-std': 'nightly',
         '@blocksuite/blocks': 'nightly',
-        '@blocksuite/editor': 'nightly',
+        '@blocksuite/presets': 'nightly',
         '@blocksuite/global': 'nightly',
         '@blocksuite/lit': 'nightly',
         '@blocksuite/store': 'nightly',

packages/docs/package.json

@@ -16,15 +16,15 @@
     "vue": "^3.3.8"
   },
   "scripts": {
-    "typedoc": "pnpm -C $(git rev-parse --show-toplevel) build:editor && typedoc --options $(git rev-parse --show-toplevel)/typedoc.json",
+    "typedoc": "pnpm -C ../.. build:packages && typedoc --options ../../typedoc.json",
     "dev": "pnpm run typedoc && vitepress dev --port 5200",
     "build": "pnpm run typedoc && vitepress build",
     "build:vercel": "pnpm run typedoc && vitepress build",
     "preview": "pnpm run typedoc && vitepress preview"
   },
   "dependencies": {
     "@blocksuite/blocks": "workspace:*",
-    "@blocksuite/editor": "workspace:*",
+    "@blocksuite/presets": "workspace:*",
     "@blocksuite/store": "workspace:*",
     "markdown-it-container": "^3.0.0",
     "vitepress-plugin-sandpack": "^1.1.4"

packages/docs/quick-start.md

@@ -1,18 +1,18 @@
 # Quick Start
 
-The `@blocksuite/editor` package contains the editor built into AFFiNE. Its `nightly` versions are released daily based on the master branch, and they are always tested on CI. This means that the `nightly` versions can already be used in real-world projects like AFFiNE at any time:
+The `@blocksuite/presets` package contains the editor built into AFFiNE. Its `nightly` versions are released daily based on the master branch, and they are always tested on CI. This means that the `nightly` versions can already be used in real-world projects like AFFiNE at any time:
 
 ```sh
-pnpm i @blocksuite/editor@nightly
+pnpm i @blocksuite/presets@nightly
 ```
 
 If you want to easily reuse most of the rich-text editing features, you can use the `SimpleAffineEditor` web component directly ([code example here](https://github.com/toeverything/blocksuite/blob/master/packages/playground/examples/basic/index.html)):
 
 ::: code-sandbox {template=vanilla-ts coderHeight=180 previewHeight=500}
 
 ```ts /index.ts
-import { SimpleAffineEditor } from '@blocksuite/editor';
-import '@blocksuite/editor/themes/affine.css';
+import { SimpleAffineEditor } from '@blocksuite/presets';
+import '@blocksuite/presets/themes/affine.css';
 
 const editor = new SimpleAffineEditor();
 document.body.appendChild(editor);
@@ -26,10 +26,10 @@ Or equivalently, you can also use the declarative style:
 <body>
   <simple-affine-editor></simple-affine-editor>
   <script type="module">
-    import '@blocksuite/editor';
-    import '@blocksuite/editor/themes/affine.css';
+    import '@blocksuite/presets';
+    import '@blocksuite/presets/themes/affine.css';
   </script>
 </body>
 ```
 
-However, the `SimpleAffineEditor` here is just a [thin wrapper with dozens of lines](https://github.com/toeverything/blocksuite/blob/master/packages/editor/src/components/simple-affine-editor.ts) that doesn't enable the opt-in collaboration and [data persistence](./data-persistence) features. If you are going to support more complicated real-world use cases (e.g., with customized block models and configured data sources), this would involve the use of more packages. In the following chapters, we will continue to demonstrate their usage and the core concepts involved.
+However, the `SimpleAffineEditor` here is just a [thin wrapper with dozens of lines](https://github.com/toeverything/blocksuite/blob/master/packages/presets/src/components/simple-affine-editor.ts) that doesn't enable the opt-in collaboration and [data persistence](./data-persistence) features. If you are going to support more complicated real-world use cases (e.g., with customized block models and configured data sources), this would involve the use of more packages. In the following chapters, we will continue to demonstrate their usage and the core concepts involved.

packages/playground/apps/default/components/quick-edgeless-menu.ts

@@ -24,8 +24,8 @@ import {
 import { NOTE_WIDTH } from '@blocksuite/blocks';
 import { MarkdownAdapter } from '@blocksuite/blocks';
 import type { ContentParser } from '@blocksuite/blocks/content-parser';
-import type { EditorContainer } from '@blocksuite/editor';
 import { ShadowlessElement } from '@blocksuite/lit';
+import type { EditorContainer } from '@blocksuite/presets';
 import { Job, Utils, type Workspace } from '@blocksuite/store';
 import type { SlTab, SlTabGroup } from '@shoelace-style/shoelace';
 import { setBasePath } from '@shoelace-style/shoelace/dist/utilities/base-path.js';

packages/playground/apps/default/main.ts

@@ -1,8 +1,8 @@
 /// <reference types="../starter/env" />
 import '@blocksuite/blocks';
-import '@blocksuite/editor';
+import '@blocksuite/presets';
 // eslint-disable-next-line @typescript-eslint/no-restricted-imports
-import '@blocksuite/editor/themes/affine.css';
+import '@blocksuite/presets/themes/affine.css';
 
 import { ContentParser } from '@blocksuite/blocks/content-parser';
 import { AffineSchemas } from '@blocksuite/blocks/models';

packages/playground/apps/default/utils.ts

@@ -1,5 +1,5 @@
 import { __unstableSchemas, AffineSchemas } from '@blocksuite/blocks/models';
-import { EditorContainer } from '@blocksuite/editor';
+import { EditorContainer } from '@blocksuite/presets';
 import type { BlobStorage, Page, Workspace } from '@blocksuite/store';
 import {
   createIndexeddbStorage,

packages/playground/apps/starter/components/copilot/custom-copilot-panel.ts

@@ -2,9 +2,9 @@
 import '@shoelace-style/shoelace/dist/components/button-group/button-group.js';
 import '@shoelace-style/shoelace/dist/components/button/button.js';
 
-import type { EditorContainer } from '@blocksuite/editor';
 import type { BlockSuiteRoot } from '@blocksuite/lit';
 import { WithDisposable } from '@blocksuite/lit';
+import type { EditorContainer } from '@blocksuite/presets';
 import type { SlPopup } from '@shoelace-style/shoelace';
 import { css, html, LitElement, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';

packages/playground/apps/starter/components/copilot/utils/mind-map-utils.ts

@@ -7,8 +7,8 @@ import {
   type ShapeType,
   StrokeStyle,
 } from '@blocksuite/blocks';
-import type { EditorContainer } from '@blocksuite/editor';
 import { assertExists } from '@blocksuite/global/utils';
+import type { EditorContainer } from '@blocksuite/presets';
 import { Workspace } from '@blocksuite/store';
 
 interface Position {

packages/playground/apps/starter/components/custom-navigation-panel.ts

@@ -1,6 +1,6 @@
 import { registerTOCComponents } from '@blocksuite/blocks';
-import type { EditorContainer } from '@blocksuite/editor';
 import { WithDisposable } from '@blocksuite/lit';
+import type { EditorContainer } from '@blocksuite/presets';
 import type { Page } from '@blocksuite/store';
 import { css, html, LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';

packages/playground/apps/starter/components/debug-menu.ts

@@ -26,8 +26,8 @@ import {
   ZipTransformer,
 } from '@blocksuite/blocks';
 import type { ContentParser } from '@blocksuite/blocks/content-parser';
-import { EditorContainer } from '@blocksuite/editor';
 import { ShadowlessElement } from '@blocksuite/lit';
+import { EditorContainer } from '@blocksuite/presets';
 import { Utils, type Workspace } from '@blocksuite/store';
 import type { SlDropdown } from '@shoelace-style/shoelace';
 import { setBasePath } from '@shoelace-style/shoelace/dist/utilities/base-path.js';

packages/playground/apps/starter/data/multiple-editor.ts

@@ -1,4 +1,4 @@
-import { EditorContainer } from '@blocksuite/editor';
+import { EditorContainer } from '@blocksuite/presets';
 import { Text, type Workspace } from '@blocksuite/store';
 
 import { createEditor } from '../utils';

packages/playground/apps/starter/env.d.ts

@@ -1,6 +1,6 @@
 import type { TestUtils } from '@blocksuite/blocks';
 import type { ContentParser } from '@blocksuite/blocks/content-parser';
-import type { EditorContainer } from '@blocksuite/editor';
+import type { EditorContainer } from '@blocksuite/presets';
 import type {
   BlockSchema,
   DocProvider,

packages/playground/apps/starter/main.ts

@@ -1,9 +1,9 @@
 /// <reference types="./env.d.ts" />
 import '@blocksuite/blocks';
-import '@blocksuite/editor';
+import '@blocksuite/presets';
 import './components/start-panel';
 // eslint-disable-next-line @typescript-eslint/no-restricted-imports
-import '@blocksuite/editor/themes/affine.css';
+import '@blocksuite/presets/themes/affine.css';
 
 import { TestUtils } from '@blocksuite/blocks';
 import { ContentParser } from '@blocksuite/blocks/content-parser';

packages/playground/apps/starter/utils.ts

@@ -1,9 +1,9 @@
 import * as blocks from '@blocksuite/blocks';
 import { __unstableSchemas, AffineSchemas } from '@blocksuite/blocks/models';
-import * as editor from '@blocksuite/editor';
-import { EditorContainer } from '@blocksuite/editor';
 import * as globalUtils from '@blocksuite/global/utils';
 import { assertExists } from '@blocksuite/global/utils';
+import * as editor from '@blocksuite/presets';
+import { EditorContainer } from '@blocksuite/presets';
 import type {
   BlobStorage,
   DocProviderCreator,

packages/playground/examples/basic/index.html

@@ -9,8 +9,8 @@
   <body>
     <simple-affine-editor></simple-affine-editor>
     <script type="module">
-      import '@blocksuite/editor';
-      import '@blocksuite/editor/themes/affine.css';
+      import '@blocksuite/presets';
+      import '@blocksuite/presets/themes/affine.css';
     </script>
   </body>
 </html>

packages/playground/package.json

@@ -13,7 +13,7 @@
   },
   "dependencies": {
     "@blocksuite/blocks": "workspace:*",
-    "@blocksuite/editor": "workspace:*",
+    "@blocksuite/presets": "workspace:*",
     "@blocksuite/global": "workspace:*",
     "@blocksuite/lit": "workspace:*",
     "@blocksuite/store": "workspace:*",

packages/playground/tsconfig.json

@@ -17,7 +17,7 @@
     "composite": false,
     "paths": {
       // Why? See https://github.com/DimensionDev/Maskbook/blob/2a042633c5bde18dd97a21d34e4943c8c4efa514/tsconfig.json#L33-L67
-      "@blocksuite/editor": ["../editor/src"],
+      "@blocksuite/presets": ["../presets/src"],
       "@blocksuite/blocks": ["../blocks/src"],
       "@blocksuite/blocks/*": ["../blocks/src/*"],
       "@blocksuite/global/*": ["../global/src/*"],

packages/editor/README.md → packages/presets/README.md

@@ -1,4 +1,4 @@
-# `@blocksuite/editor`
+# `@blocksuite/presets`
 
 Default BlockSuite-based editor built for [AFFiNE](https://affine.pro).