refactor(editor): extract note block (#9310)

blocksuite/affine/block-note/src/adapters/html.ts

@@ -0,0 +1,44 @@
+import { NoteBlockSchema, NoteDisplayMode } from '@blocksuite/affine-model';
+import {
+  BlockHtmlAdapterExtension,
+  type BlockHtmlAdapterMatcher,
+} from '@blocksuite/affine-shared/adapters';
+
+/**
+ * Create a html adapter matcher for note block.
+ *
+ * @param displayModeToSkip - The note with specific display mode to skip.
+ * For example, the note with display mode `EdgelessOnly` should not be converted to html when current editor mode is `Doc(Page)`.
+ * @returns The html adapter matcher.
+ */
+const createNoteBlockHtmlAdapterMatcher = (
+  displayModeToSkip: NoteDisplayMode
+): BlockHtmlAdapterMatcher => ({
+  flavour: NoteBlockSchema.model.flavour,
+  toMatch: () => false,
+  fromMatch: o => o.node.flavour === NoteBlockSchema.model.flavour,
+  toBlockSnapshot: {},
+  fromBlockSnapshot: {
+    enter: (o, context) => {
+      const node = o.node;
+      if (node.props.displayMode === displayModeToSkip) {
+        context.walkerContext.skipAllChildren();
+      }
+    },
+  },
+});
+
+export const docNoteBlockHtmlAdapterMatcher = createNoteBlockHtmlAdapterMatcher(
+  NoteDisplayMode.EdgelessOnly
+);
+
+export const edgelessNoteBlockHtmlAdapterMatcher =
+  createNoteBlockHtmlAdapterMatcher(NoteDisplayMode.DocOnly);
+
+export const DocNoteBlockHtmlAdapterExtension = BlockHtmlAdapterExtension(
+  docNoteBlockHtmlAdapterMatcher
+);
+
+export const EdgelessNoteBlockHtmlAdapterExtension = BlockHtmlAdapterExtension(
+  edgelessNoteBlockHtmlAdapterMatcher
+);

blocksuite/affine/block-note/src/adapters/index.ts

@@ -0,0 +1,26 @@
+import type { ExtensionType } from '@blocksuite/block-std';
+
+import {
+  DocNoteBlockHtmlAdapterExtension,
+  EdgelessNoteBlockHtmlAdapterExtension,
+} from './html.js';
+import {
+  DocNoteBlockMarkdownAdapterExtension,
+  EdgelessNoteBlockMarkdownAdapterExtension,
+} from './markdown.js';
+import {
+  DocNoteBlockPlainTextAdapterExtension,
+  EdgelessNoteBlockPlainTextAdapterExtension,
+} from './plain-text.js';
+
+export const DocNoteBlockAdapterExtensions: ExtensionType[] = [
+  DocNoteBlockMarkdownAdapterExtension,
+  DocNoteBlockHtmlAdapterExtension,
+  DocNoteBlockPlainTextAdapterExtension,
+];
+
+export const EdgelessNoteBlockAdapterExtensions: ExtensionType[] = [
+  EdgelessNoteBlockMarkdownAdapterExtension,
+  EdgelessNoteBlockHtmlAdapterExtension,
+  EdgelessNoteBlockPlainTextAdapterExtension,
+];

blocksuite/affine/block-note/src/adapters/markdown.ts

@@ -0,0 +1,41 @@
+import { NoteBlockSchema, NoteDisplayMode } from '@blocksuite/affine-model';
+import {
+  BlockMarkdownAdapterExtension,
+  type BlockMarkdownAdapterMatcher,
+} from '@blocksuite/affine-shared/adapters';
+
+/**
+ * Create a markdown adapter matcher for note block.
+ *
+ * @param displayModeToSkip - The note with specific display mode to skip.
+ * For example, the note with display mode `EdgelessOnly` should not be converted to markdown when current editor mode is `Doc`.
+ * @returns The markdown adapter matcher.
+ */
+const createNoteBlockMarkdownAdapterMatcher = (
+  displayModeToSkip: NoteDisplayMode
+): BlockMarkdownAdapterMatcher => ({
+  flavour: NoteBlockSchema.model.flavour,
+  toMatch: () => false,
+  fromMatch: o => o.node.flavour === NoteBlockSchema.model.flavour,
+  toBlockSnapshot: {},
+  fromBlockSnapshot: {
+    enter: (o, context) => {
+      const node = o.node;
+      if (node.props.displayMode === displayModeToSkip) {
+        context.walkerContext.skipAllChildren();
+      }
+    },
+  },
+});
+
+export const docNoteBlockMarkdownAdapterMatcher =
+  createNoteBlockMarkdownAdapterMatcher(NoteDisplayMode.EdgelessOnly);
+
+export const edgelessNoteBlockMarkdownAdapterMatcher =
+  createNoteBlockMarkdownAdapterMatcher(NoteDisplayMode.DocOnly);
+
+export const DocNoteBlockMarkdownAdapterExtension =
+  BlockMarkdownAdapterExtension(docNoteBlockMarkdownAdapterMatcher);
+
+export const EdgelessNoteBlockMarkdownAdapterExtension =
+  BlockMarkdownAdapterExtension(edgelessNoteBlockMarkdownAdapterMatcher);

blocksuite/affine/block-note/src/adapters/plain-text.ts

@@ -0,0 +1,41 @@
+import { NoteBlockSchema, NoteDisplayMode } from '@blocksuite/affine-model';
+import {
+  BlockPlainTextAdapterExtension,
+  type BlockPlainTextAdapterMatcher,
+} from '@blocksuite/affine-shared/adapters';
+
+/**
+ * Create a plain text adapter matcher for note block.
+ *
+ * @param displayModeToSkip - The note with specific display mode to skip.
+ * For example, the note with display mode `EdgelessOnly` should not be converted to plain text when current editor mode is `Doc(Page)`.
+ * @returns The plain text adapter matcher.
+ */
+const createNoteBlockPlainTextAdapterMatcher = (
+  displayModeToSkip: NoteDisplayMode
+): BlockPlainTextAdapterMatcher => ({
+  flavour: NoteBlockSchema.model.flavour,
+  toMatch: () => false,
+  fromMatch: o => o.node.flavour === NoteBlockSchema.model.flavour,
+  toBlockSnapshot: {},
+  fromBlockSnapshot: {
+    enter: (o, context) => {
+      const node = o.node;
+      if (node.props.displayMode === displayModeToSkip) {
+        context.walkerContext.skipAllChildren();
+      }
+    },
+  },
+});
+
+export const docNoteBlockPlainTextAdapterMatcher =
+  createNoteBlockPlainTextAdapterMatcher(NoteDisplayMode.EdgelessOnly);
+
+export const edgelessNoteBlockPlainTextAdapterMatcher =
+  createNoteBlockPlainTextAdapterMatcher(NoteDisplayMode.DocOnly);
+
+export const DocNoteBlockPlainTextAdapterExtension =
+  BlockPlainTextAdapterExtension(docNoteBlockPlainTextAdapterMatcher);
+
+export const EdgelessNoteBlockPlainTextAdapterExtension =
+  BlockPlainTextAdapterExtension(edgelessNoteBlockPlainTextAdapterMatcher);