feat(editor): support text highlight html adapter (#9632)

[BS-2061](https://linear.app/affine-design/issue/BS-2061/html-adapter-支持-text-highlight-样式)

blocksuite/affine/block-embed/src/common/adapters/utils.ts

@@ -1,13 +0,0 @@
-import type { ReferenceParams } from '@blocksuite/affine-model';
-import { TextUtils } from '@blocksuite/affine-shared/adapters';
-
-export function generateDocUrl(
-  docBaseUrl: string,
-  pageId: string,
-  params: ReferenceParams
-) {
-  const search = TextUtils.toURLSearchParams(params);
-  const query = search?.size ? `?${search.toString()}` : '';
-  const url = docBaseUrl ? `${docBaseUrl}/${pageId}${query}` : '';
-  return url;
-}

blocksuite/affine/block-embed/src/embed-linked-doc-block/adapters/html.ts

@@ -2,10 +2,9 @@ import { EmbedLinkedDocBlockSchema } from '@blocksuite/affine-model';
 import {
   BlockHtmlAdapterExtension,
   type BlockHtmlAdapterMatcher,
+  TextUtils,
 } from '@blocksuite/affine-shared/adapters';
 
-import { generateDocUrl } from '../../common/adapters/utils.js';
-
 export const embedLinkedDocBlockHtmlAdapterMatcher: BlockHtmlAdapterMatcher = {
   flavour: EmbedLinkedDocBlockSchema.model.flavour,
   toMatch: () => false,
@@ -19,7 +18,7 @@ export const embedLinkedDocBlockHtmlAdapterMatcher: BlockHtmlAdapterMatcher = {
         return;
       }
       const title = configs.get('title:' + o.node.props.pageId) ?? 'untitled';
-      const url = generateDocUrl(
+      const url = TextUtils.generateDocUrl(
         configs.get('docLinkBaseUrl') ?? '',
         String(o.node.props.pageId),
         o.node.props.params ?? Object.create(null)

blocksuite/affine/block-embed/src/embed-linked-doc-block/adapters/markdown.ts

@@ -2,10 +2,9 @@ import { EmbedLinkedDocBlockSchema } from '@blocksuite/affine-model';
 import {
   BlockMarkdownAdapterExtension,
   type BlockMarkdownAdapterMatcher,
+  TextUtils,
 } from '@blocksuite/affine-shared/adapters';
 
-import { generateDocUrl } from '../../common/adapters/utils.js';
-
 export const embedLinkedDocBlockMarkdownAdapterMatcher: BlockMarkdownAdapterMatcher =
   {
     flavour: EmbedLinkedDocBlockSchema.model.flavour,
@@ -20,7 +19,7 @@ export const embedLinkedDocBlockMarkdownAdapterMatcher: BlockMarkdownAdapterMatc
           return;
         }
         const title = configs.get('title:' + o.node.props.pageId) ?? 'untitled';
-        const url = generateDocUrl(
+        const url = TextUtils.generateDocUrl(
           configs.get('docLinkBaseUrl') ?? '',
           String(o.node.props.pageId),
           o.node.props.params ?? Object.create(null)

blocksuite/affine/block-embed/src/embed-linked-doc-block/adapters/plain-text.ts

@@ -2,10 +2,9 @@ import { EmbedLinkedDocBlockSchema } from '@blocksuite/affine-model';
 import {
   BlockPlainTextAdapterExtension,
   type BlockPlainTextAdapterMatcher,
+  TextUtils,
 } from '@blocksuite/affine-shared/adapters';
 
-import { generateDocUrl } from '../../common/adapters/utils.js';
-
 export const embedLinkedDocBlockPlainTextAdapterMatcher: BlockPlainTextAdapterMatcher =
   {
     flavour: EmbedLinkedDocBlockSchema.model.flavour,
@@ -20,7 +19,7 @@ export const embedLinkedDocBlockPlainTextAdapterMatcher: BlockPlainTextAdapterMa
           return;
         }
         const title = configs.get('title:' + o.node.props.pageId) ?? 'untitled';
-        const url = generateDocUrl(
+        const url = TextUtils.generateDocUrl(
           configs.get('docLinkBaseUrl') ?? '',
           String(o.node.props.pageId),
           o.node.props.params ?? Object.create(null)

blocksuite/affine/block-embed/src/index.ts

@@ -21,7 +21,6 @@ export const EmbedExtensions: ExtensionType[] = [
 export { createEmbedBlockHtmlAdapterMatcher } from './common/adapters/html';
 export { createEmbedBlockMarkdownAdapterMatcher } from './common/adapters/markdown';
 export { createEmbedBlockPlainTextAdapterMatcher } from './common/adapters/plain-text';
-export { generateDocUrl } from './common/adapters/utils';
 export { EmbedBlockComponent } from './common/embed-block-element';
 export { insertEmbedCard } from './common/insert-embed-card.js';
 export {

blocksuite/affine/components/package.json

@@ -25,11 +25,15 @@
     "@lottiefiles/dotlottie-wc": "^0.4.0",
     "@preact/signals-core": "^1.8.0",
     "@toeverything/theme": "^1.1.3",
+    "@types/hast": "^3.0.4",
+    "@types/mdast": "^4.0.4",
+    "collapse-white-space": "^2.1.0",
     "date-fns": "^4.0.0",
     "katex": "^0.16.11",
     "lit": "^3.2.0",
     "lit-html": "^3.2.1",
     "lodash.clonedeep": "^4.5.0",
+    "remark-math": "^6.0.0",
     "shiki": "^1.12.0",
     "yjs": "^13.6.21",
     "zod": "^3.23.8"

blocksuite/affine/components/src/rich-text/all-extensions.ts

@@ -6,6 +6,7 @@ import {
   BoldInlineSpecExtension,
   CodeInlineSpecExtension,
   ColorInlineSpecExtension,
+  InlineAdapterExtensions,
   InlineSpecExtensions,
   ItalicInlineSpecExtension,
   LatexInlineSpecExtension,
@@ -38,4 +39,5 @@ export const RichTextExtensions: ExtensionType[] = [
   MarkdownExtensions,
   LatexEditorInlineManagerExtension,
   DefaultInlineManagerExtension,
+  InlineAdapterExtensions,
 ].flat();

blocksuite/affine/components/src/rich-text/inline/adapters/extensions.ts

@@ -0,0 +1,17 @@
+import type { ExtensionType } from '@blocksuite/store';
+
+import { HtmlInlineToDeltaAdapterExtensions } from './html/html-inline';
+import { InlineDeltaToHtmlAdapterExtensions } from './html/inline-delta';
+import { InlineDeltaToMarkdownAdapterExtensions } from './markdown/inline-delta';
+import { MarkdownInlineToDeltaAdapterExtensions } from './markdown/markdown-inline';
+import { NotionHtmlInlineToDeltaAdapterExtensions } from './notion-html/html-inline';
+import { InlineDeltaToPlainTextAdapterExtensions } from './plain-text/inline-delta';
+
+export const InlineAdapterExtensions: ExtensionType[] = [
+  HtmlInlineToDeltaAdapterExtensions,
+  InlineDeltaToHtmlAdapterExtensions,
+  InlineDeltaToPlainTextAdapterExtensions,
+  NotionHtmlInlineToDeltaAdapterExtensions,
+  InlineDeltaToMarkdownAdapterExtensions,
+  MarkdownInlineToDeltaAdapterExtensions,
+].flat();

blocksuite/affine/components/src/rich-text/inline/adapters/html/html-inline.ts

@@ -221,7 +221,7 @@ export const htmlBrElementToDeltaMatcher = HtmlASTToDeltaExtension({
   },
 });
 
-export const htmlInlineToDeltaMatchers = [
+export const HtmlInlineToDeltaAdapterExtensions = [
   htmlTextToDeltaMatcher,
   htmlTextLikeElementToDeltaMatcher,
   htmlStrongElementToDeltaMatcher,

blocksuite/affine/components/src/rich-text/inline/adapters/html/inline-delta.ts

@@ -1,6 +1,9 @@
-import { generateDocUrl } from '@blocksuite/affine-block-embed';
 import type { InlineHtmlAST } from '@blocksuite/affine-shared/adapters';
-import { InlineDeltaToHtmlAdapterExtension } from '@blocksuite/affine-shared/adapters';
+import {
+  InlineDeltaToHtmlAdapterExtension,
+  TextUtils,
+} from '@blocksuite/affine-shared/adapters';
+import { ThemeProvider } from '@blocksuite/affine-shared/services';
 
 export const boldDeltaToHtmlAdapterMatcher = InlineDeltaToHtmlAdapterExtension({
   name: 'bold',
@@ -43,7 +46,7 @@ export const strikeDeltaToHtmlAdapterMatcher =
     },
   });
 
-export const inlineCodeDeltaToMarkdownAdapterMatcher =
+export const inlineCodeDeltaToHtmlAdapterMatcher =
   InlineDeltaToHtmlAdapterExtension({
     name: 'inlineCode',
     match: delta => !!delta.attributes?.code,
@@ -87,7 +90,7 @@ export const referenceDeltaToHtmlAdapterMatcher =
 
       const { configs } = context;
       const title = configs.get(`title:${reference.pageId}`);
-      const url = generateDocUrl(
+      const url = TextUtils.generateDocUrl(
         configs.get('docLinkBaseUrl') ?? '',
         String(reference.pageId),
         reference.params ?? Object.create(null)
@@ -131,12 +134,86 @@ export const linkDeltaToHtmlAdapterMatcher = InlineDeltaToHtmlAdapterExtension({
   },
 });
 
-export const inlineDeltaToHtmlAdapterMatchers = [
+export const highlightBackgroundDeltaToHtmlAdapterMatcher =
+  InlineDeltaToHtmlAdapterExtension({
+    name: 'highlight-background',
+    match: delta => !!delta.attributes?.background,
+    toAST: (delta, context, provider) => {
+      const hast: InlineHtmlAST = {
+        type: 'element',
+        tagName: 'span',
+        properties: {},
+        children: [context.current],
+      };
+      if (!provider || !delta.attributes?.background) {
+        return hast;
+      }
+
+      const theme = provider.getOptional(ThemeProvider);
+      if (!theme) {
+        return hast;
+      }
+
+      const backgroundVar = delta.attributes?.background.substring(
+        'var('.length,
+        delta.attributes?.background.indexOf(')')
+      );
+      const background = theme.getCssVariableColor(backgroundVar);
+      return {
+        type: 'element',
+        tagName: 'mark',
+        properties: {
+          style: `background-color: ${background};`,
+        },
+        children: [context.current],
+      };
+    },
+  });
+
+export const highlightColorDeltaToHtmlAdapterMatcher =
+  InlineDeltaToHtmlAdapterExtension({
+    name: 'highlight-color',
+    match: delta => !!delta.attributes?.color,
+    toAST: (delta, context, provider) => {
+      const hast: InlineHtmlAST = {
+        type: 'element',
+        tagName: 'span',
+        properties: {},
+        children: [context.current],
+      };
+      if (!provider || !delta.attributes?.color) {
+        return hast;
+      }
+
+      const theme = provider.getOptional(ThemeProvider);
+      if (!theme) {
+        return hast;
+      }
+
+      const colorVar = delta.attributes?.color.substring(
+        'var('.length,
+        delta.attributes?.color.indexOf(')')
+      );
+      const color = theme.getCssVariableColor(colorVar);
+      return {
+        type: 'element',
+        tagName: 'mark',
+        properties: {
+          style: `color: ${color};background-color: transparent`,
+        },
+        children: [context.current],
+      };
+    },
+  });
+
+export const InlineDeltaToHtmlAdapterExtensions = [
   boldDeltaToHtmlAdapterMatcher,
   italicDeltaToHtmlAdapterMatcher,
   strikeDeltaToHtmlAdapterMatcher,
   underlineDeltaToHtmlAdapterMatcher,
-  inlineCodeDeltaToMarkdownAdapterMatcher,
+  highlightBackgroundDeltaToHtmlAdapterMatcher,
+  highlightColorDeltaToHtmlAdapterMatcher,
+  inlineCodeDeltaToHtmlAdapterMatcher,
   referenceDeltaToHtmlAdapterMatcher,
   linkDeltaToHtmlAdapterMatcher,
 ];

blocksuite/affine/components/src/rich-text/inline/adapters/markdown/inline-delta.ts

@@ -1,5 +1,7 @@
-import { generateDocUrl } from '@blocksuite/affine-block-embed';
+import {
-import { InlineDeltaToMarkdownAdapterExtension } from '@blocksuite/affine-shared/adapters';
+  InlineDeltaToMarkdownAdapterExtension,
+  TextUtils,
+} from '@blocksuite/affine-shared/adapters';
 import type { PhrasingContent } from 'mdast';
 import type RemarkMath from 'remark-math';
 
@@ -71,7 +73,7 @@ export const referenceDeltaToMarkdownAdapterMatcher =
       const { configs } = context;
       const title = configs.get(`title:${reference.pageId}`);
       const params = reference.params ?? {};
-      const url = generateDocUrl(
+      const url = TextUtils.generateDocUrl(
         configs.get('docLinkBaseUrl') ?? '',
         String(reference.pageId),
         params
@@ -144,7 +146,7 @@ export const latexDeltaToMarkdownAdapterMatcher =
     },
   });
 
-export const inlineDeltaToMarkdownAdapterMatchers = [
+export const InlineDeltaToMarkdownAdapterExtensions = [
   referenceDeltaToMarkdownAdapterMatcher,
   linkDeltaToMarkdownAdapterMatcher,
   inlineCodeDeltaToMarkdownAdapterMatcher,

blocksuite/affine/components/src/rich-text/inline/adapters/markdown/markdown-inline.ts

@@ -138,7 +138,7 @@ export const markdownInlineMathToDeltaMatcher = MarkdownASTToDeltaExtension({
   },
 });
 
-export const markdownInlineToDeltaMatchers = [
+export const MarkdownInlineToDeltaAdapterExtensions = [
   markdownTextToDeltaMatcher,
   markdownInlineCodeToDeltaMatcher,
   markdownStrongToDeltaMatcher,

blocksuite/affine/components/src/rich-text/inline/adapters/notion-html/html-inline.ts

@@ -283,7 +283,7 @@ export const notionHtmlStyleElementToDeltaMatcher =
     },
   });
 
-export const notionHtmlInlineToDeltaMatchers: ExtensionType[] = [
+export const NotionHtmlInlineToDeltaAdapterExtensions: ExtensionType[] = [
   notionHtmlTextToDeltaMatcher,
   notionHtmlSpanElementToDeltaMatcher,
   notionHtmlStrongElementToDeltaMatcher,

blocksuite/affine/components/src/rich-text/inline/adapters/plain-text/inline-delta.ts

@@ -1,7 +1,7 @@
-import { generateDocUrl } from '@blocksuite/affine-block-embed';
 import {
   InlineDeltaToPlainTextAdapterExtension,
   type TextBuffer,
+  TextUtils,
 } from '@blocksuite/affine-shared/adapters';
 import type { ExtensionType } from '@blocksuite/store';
 
@@ -20,7 +20,7 @@ export const referenceDeltaMarkdownAdapterMatch =
 
       const { configs } = context;
       const title = configs.get(`title:${reference.pageId}`) ?? '';
-      const url = generateDocUrl(
+      const url = TextUtils.generateDocUrl(
         configs.get('docLinkBaseUrl') ?? '',
         String(reference.pageId),
         reference.params ?? Object.create(null)
@@ -71,7 +71,7 @@ export const latexDeltaMarkdownAdapterMatch =
     },
   });
 
-export const inlineDeltaToPlainTextAdapterMatchers: ExtensionType[] = [
+export const InlineDeltaToPlainTextAdapterExtensions: ExtensionType[] = [
   referenceDeltaMarkdownAdapterMatch,
   linkDeltaMarkdownAdapterMatch,
   latexDeltaMarkdownAdapterMatch,

blocksuite/affine/components/src/rich-text/inline/index.ts

@@ -1,3 +1,10 @@
-export * from './presets/affine-inline-specs.js';
+export * from './adapters/extensions';
-export * from './presets/markdown.js';
+export * from './adapters/html/html-inline';
-export * from './presets/nodes/index.js';
+export * from './adapters/html/inline-delta';
+export * from './adapters/markdown/inline-delta';
+export * from './adapters/markdown/markdown-inline';
+export * from './adapters/notion-html/html-inline';
+export * from './adapters/plain-text/inline-delta';
+export * from './presets/affine-inline-specs';
+export * from './presets/markdown';
+export * from './presets/nodes/index';

blocksuite/affine/shared/src/adapters/html/delta-converter.ts

@@ -1,6 +1,7 @@
 import {
   createIdentifier,
   type ServiceIdentifier,
+  type ServiceProvider,
 } from '@blocksuite/global/di';
 import type { DeltaInsert } from '@blocksuite/inline';
 import type { ExtensionType } from '@blocksuite/store';
@@ -62,7 +63,8 @@ export class HtmlDeltaConverter extends DeltaASTConverter<
   constructor(
     readonly configs: Map<string, string>,
     readonly inlineDeltaMatchers: InlineDeltaToHtmlAdapterMatcher[],
-    readonly htmlASTToDeltaMatchers: HtmlASTToDeltaMatcher[]
+    readonly htmlASTToDeltaMatchers: HtmlASTToDeltaMatcher[],
+    readonly provider: ServiceProvider
   ) {
     super();
   }
@@ -84,7 +86,7 @@ export class HtmlDeltaConverter extends DeltaASTConverter<
     };
     for (const matcher of this.inlineDeltaMatchers) {
       if (matcher.match(delta)) {
-        hast = matcher.toAST(delta, context);
+        hast = matcher.toAST(delta, context, this.provider);
         context.current = hast;
       }
     }

blocksuite/affine/shared/src/adapters/html/html.ts

@@ -132,6 +132,7 @@ export class HtmlAdapter extends BaseAdapter<Html> {
             configs: this.configs,
             job: this.job,
             deltaConverter: this.deltaConverter,
+            provider: this.provider,
             textBuffer: { content: '' },
             assets,
             updateAssetIds: (assetsId: string) => {
@@ -155,6 +156,7 @@ export class HtmlAdapter extends BaseAdapter<Html> {
             configs: this.configs,
             job: this.job,
             deltaConverter: this.deltaConverter,
+            provider: this.provider,
             textBuffer: { content: '' },
             assets,
           };
@@ -172,7 +174,10 @@ export class HtmlAdapter extends BaseAdapter<Html> {
 
   readonly blockMatchers: BlockHtmlAdapterMatcher[];
 
-  constructor(job: Transformer, provider: ServiceProvider) {
+  constructor(
+    job: Transformer,
+    readonly provider: ServiceProvider
+  ) {
     super(job);
     const blockMatchers = Array.from(
       provider.getAll(BlockHtmlAdapterMatcherIdentifier).values()
@@ -187,7 +192,8 @@ export class HtmlAdapter extends BaseAdapter<Html> {
     this.deltaConverter = new HtmlDeltaConverter(
       job.adapterConfigs,
       inlineDeltaToHtmlAdapterMatchers,
-      htmlInlineToDeltaMatchers
+      htmlInlineToDeltaMatchers,
+      provider
     );
   }
 

blocksuite/affine/shared/src/adapters/types/adapter.ts

@@ -152,7 +152,8 @@ export type InlineDeltaMatcher<TNode extends object = never> = {
     context: {
       configs: Map<string, string>;
       current: TNode;
-    }
+    },
+    provider?: ServiceProvider
   ) => TNode;
 };
 

blocksuite/affine/shared/src/adapters/utils/text.ts

@@ -1,3 +1,4 @@
+import type { ReferenceParams } from '@blocksuite/affine-model';
 import { isEqual } from '@blocksuite/global/utils';
 import type { DeltaInsert } from '@blocksuite/inline';
 
@@ -74,10 +75,22 @@ function toURLSearchParams(
   );
 }
 
+function generateDocUrl(
+  docBaseUrl: string,
+  pageId: string,
+  params: ReferenceParams
+) {
+  const search = toURLSearchParams(params);
+  const query = search?.size ? `?${search.toString()}` : '';
+  const url = docBaseUrl ? `${docBaseUrl}/${pageId}${query}` : '';
+  return url;
+}
+
 export const TextUtils = {
   mergeDeltas,
   isNullish,
   createText,
   isText,
   toURLSearchParams,
+  generateDocUrl,
 };

blocksuite/blocks/package.json

@@ -47,9 +47,6 @@
     "@lit/context": "^1.1.2",
     "@preact/signals-core": "^1.8.0",
     "@toeverything/theme": "^1.1.3",
-    "@types/hast": "^3.0.4",
-    "@types/mdast": "^4.0.4",
-    "collapse-white-space": "^2.1.0",
     "date-fns": "^4.0.0",
     "dompurify": "^3.1.6",
     "fflate": "^0.8.2",
@@ -60,26 +57,11 @@
     "lit": "^3.2.0",
     "lodash.isequal": "^4.5.0",
     "lz-string": "^1.5.0",
-    "mdast-util-gfm-autolink-literal": "^2.0.1",
-    "mdast-util-gfm-strikethrough": "^2.0.0",
-    "mdast-util-gfm-table": "^2.0.0",
-    "mdast-util-gfm-task-list-item": "^2.0.0",
-    "micromark-extension-gfm-autolink-literal": "^2.1.0",
-    "micromark-extension-gfm-strikethrough": "^2.1.0",
-    "micromark-extension-gfm-table": "^2.1.0",
-    "micromark-extension-gfm-task-list-item": "^2.1.0",
-    "micromark-util-combine-extensions": "^2.0.0",
     "minimatch": "^10.0.1",
     "nanoid": "^5.0.7",
     "pdf-lib": "^1.17.1",
-    "rehype-parse": "^9.0.0",
-    "rehype-stringify": "^10.0.0",
-    "remark-math": "^6.0.0",
-    "remark-parse": "^11.0.0",
-    "remark-stringify": "^11.0.0",
     "shiki": "^1.14.1",
     "simple-xml-to-json": "^1.2.2",
-    "unified": "^11.0.5",
     "yjs": "^13.6.21",
     "zod": "^3.23.8"
   },

blocksuite/blocks/src/__tests__/adapters/html.unit.spec.ts

@@ -1,3 +1,7 @@
+import {
+  HtmlInlineToDeltaAdapterExtensions,
+  InlineDeltaToHtmlAdapterExtensions,
+} from '@blocksuite/affine-components/rich-text';
 import { DefaultTheme, NoteDisplayMode } from '@blocksuite/affine-model';
 import { HtmlAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
@@ -10,17 +14,15 @@ import { AssetsManager, MemoryBlobCRUD } from '@blocksuite/store';
 import { describe, expect, test } from 'vitest';
 
 import { defaultBlockHtmlAdapterMatchers } from '../../_common/adapters/html/block-matcher.js';
-import { htmlInlineToDeltaMatchers } from '../../_common/adapters/html/delta-converter/html-inline.js';
-import { inlineDeltaToHtmlAdapterMatchers } from '../../_common/adapters/html/delta-converter/inline-delta.js';
 import { nanoidReplacement } from '../../_common/test-utils/test-utils.js';
 import { embedSyncedDocMiddleware } from '../../_common/transformers/middlewares.js';
 import { createJob } from '../utils/create-job.js';
 
 const container = new Container();
 [
-  ...htmlInlineToDeltaMatchers,
+  ...HtmlInlineToDeltaAdapterExtensions,
   ...defaultBlockHtmlAdapterMatchers,
-  ...inlineDeltaToHtmlAdapterMatchers,
+  ...InlineDeltaToHtmlAdapterExtensions,
 ].forEach(ext => {
   ext.setup(container);
 });

blocksuite/blocks/src/__tests__/adapters/markdown.unit.spec.ts

@@ -1,3 +1,7 @@
+import {
+  InlineDeltaToMarkdownAdapterExtensions,
+  MarkdownInlineToDeltaAdapterExtensions,
+} from '@blocksuite/affine-components/rich-text';
 import { DefaultTheme, NoteDisplayMode } from '@blocksuite/affine-model';
 import { MarkdownAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
@@ -10,18 +14,16 @@ import type {
 import { AssetsManager, MemoryBlobCRUD } from '@blocksuite/store';
 import { describe, expect, test } from 'vitest';
 
-import { inlineDeltaToMarkdownAdapterMatchers } from '../../_common/adapters/markdown/delta-converter/inline-delta.js';
+import { defaultBlockMarkdownAdapterMatchers } from '../../_common/adapters/markdown/block-matcher.js';
-import { markdownInlineToDeltaMatchers } from '../../_common/adapters/markdown/delta-converter/markdown-inline.js';
-import { defaultBlockMarkdownAdapterMatchers } from '../../_common/adapters/markdown/index.js';
 import { nanoidReplacement } from '../../_common/test-utils/test-utils.js';
 import { embedSyncedDocMiddleware } from '../../_common/transformers/middlewares.js';
 import { createJob } from '../utils/create-job.js';
 
 const container = new Container();
 [
-  ...markdownInlineToDeltaMatchers,
+  ...MarkdownInlineToDeltaAdapterExtensions,
   ...defaultBlockMarkdownAdapterMatchers,
-  ...inlineDeltaToMarkdownAdapterMatchers,
+  ...InlineDeltaToMarkdownAdapterExtensions,
 ].forEach(ext => {
   ext.setup(container);
 });

blocksuite/blocks/src/__tests__/adapters/notion-html.unit.spec.ts

@@ -1,3 +1,4 @@
+import { NotionHtmlInlineToDeltaAdapterExtensions } from '@blocksuite/affine-components/rich-text';
 import { DefaultTheme, NoteDisplayMode } from '@blocksuite/affine-model';
 import { NotionHtmlAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
@@ -9,13 +10,12 @@ import {
 import { describe, expect, test } from 'vitest';
 
 import { defaultBlockNotionHtmlAdapterMatchers } from '../../_common/adapters/notion-html/block-matcher.js';
-import { notionHtmlInlineToDeltaMatchers } from '../../_common/adapters/notion-html/delta-converter/html-inline.js';
 import { nanoidReplacement } from '../../_common/test-utils/test-utils.js';
 import { createJob } from '../utils/create-job.js';
 
 const container = new Container();
 [
-  ...notionHtmlInlineToDeltaMatchers,
+  ...NotionHtmlInlineToDeltaAdapterExtensions,
   ...defaultBlockNotionHtmlAdapterMatchers,
 ].forEach(ext => {
   ext.setup(container);

blocksuite/blocks/src/__tests__/adapters/plain-text.unit.spec.ts

@@ -1,3 +1,4 @@
+import { InlineDeltaToPlainTextAdapterExtensions } from '@blocksuite/affine-components/rich-text';
 import { DefaultTheme, NoteDisplayMode } from '@blocksuite/affine-model';
 import { PlainTextAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
@@ -9,14 +10,13 @@ import type {
 import { describe, expect, test } from 'vitest';
 
 import { defaultBlockPlainTextAdapterMatchers } from '../../_common/adapters/plain-text/block-matcher.js';
-import { inlineDeltaToPlainTextAdapterMatchers } from '../../_common/adapters/plain-text/delta-converter/inline-delta.js';
 import { embedSyncedDocMiddleware } from '../../_common/transformers/middlewares.js';
 import { createJob } from '../utils/create-job.js';
 
 const container = new Container();
 [
   ...defaultBlockPlainTextAdapterMatchers,
-  ...inlineDeltaToPlainTextAdapterMatchers,
+  ...InlineDeltaToPlainTextAdapterExtensions,
 ].forEach(ext => {
   ext.setup(container);
 });

blocksuite/blocks/src/_common/adapters/extension.ts

@@ -10,20 +10,7 @@ import {
 } from '@blocksuite/affine-shared/adapters';
 import type { ExtensionType } from '@blocksuite/store';
 
-import { htmlInlineToDeltaMatchers } from './html/delta-converter/html-inline.js';
-import { inlineDeltaToHtmlAdapterMatchers } from './html/delta-converter/inline-delta.js';
-import { inlineDeltaToMarkdownAdapterMatchers } from './markdown/delta-converter/inline-delta.js';
-import { markdownInlineToDeltaMatchers } from './markdown/delta-converter/markdown-inline.js';
-import { notionHtmlInlineToDeltaMatchers } from './notion-html/delta-converter/html-inline.js';
-import { inlineDeltaToPlainTextAdapterMatchers } from './plain-text/delta-converter/inline-delta.js';
-
 export const AdapterFactoryExtensions: ExtensionType[] = [
-  ...htmlInlineToDeltaMatchers,
-  ...inlineDeltaToHtmlAdapterMatchers,
-  ...notionHtmlInlineToDeltaMatchers,
-  ...inlineDeltaToPlainTextAdapterMatchers,
-  ...markdownInlineToDeltaMatchers,
-  ...inlineDeltaToMarkdownAdapterMatchers,
   AttachmentAdapterFactoryExtension,
   ImageAdapterFactoryExtension,
   MarkdownAdapterFactoryExtension,

blocksuite/blocks/src/_common/adapters/html/index.ts

@@ -1 +0,0 @@
-export { defaultBlockHtmlAdapterMatchers } from './block-matcher.js';

blocksuite/blocks/src/_common/adapters/index.ts

@@ -1,3 +1,5 @@
 export * from './extension.js';
-export * from './markdown/index.js';
+export * from './html/block-matcher.js';
-export * from './notion-html/index.js';
+export * from './markdown/block-matcher.js';
+export * from './notion-html/block-matcher.js';
+export * from './plain-text/block-matcher.js';

blocksuite/blocks/src/_common/adapters/markdown/index.ts

@@ -1,3 +0,0 @@
-export { defaultBlockMarkdownAdapterMatchers } from './block-matcher.js';
-export { inlineDeltaToMarkdownAdapterMatchers } from './delta-converter/inline-delta.js';
-export { markdownInlineToDeltaMatchers } from './delta-converter/markdown-inline.js';

blocksuite/blocks/src/_common/adapters/notion-html/index.ts

@@ -1,2 +0,0 @@
-export { defaultBlockNotionHtmlAdapterMatchers } from './block-matcher.js';
-export { notionHtmlInlineToDeltaMatchers } from './delta-converter/html-inline.js';

blocksuite/blocks/src/_common/transformers/html.ts

@@ -1,3 +1,7 @@
+import {
+  HtmlInlineToDeltaAdapterExtensions,
+  InlineDeltaToHtmlAdapterExtensions,
+} from '@blocksuite/affine-components/rich-text';
 import { HtmlAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
 import { sha } from '@blocksuite/global/utils';
@@ -5,8 +9,6 @@ import type { Store, Workspace } from '@blocksuite/store';
 import { extMimeMap, Transformer } from '@blocksuite/store';
 
 import { defaultBlockHtmlAdapterMatchers } from '../adapters/html/block-matcher.js';
-import { htmlInlineToDeltaMatchers } from '../adapters/html/delta-converter/html-inline.js';
-import { inlineDeltaToHtmlAdapterMatchers } from '../adapters/html/delta-converter/inline-delta.js';
 import {
   defaultImageProxyMiddleware,
   docLinkBaseURLMiddleware,
@@ -28,9 +30,9 @@ type ImportHTMLZipOptions = {
 
 const container = new Container();
 [
-  ...htmlInlineToDeltaMatchers,
+  ...HtmlInlineToDeltaAdapterExtensions,
   ...defaultBlockHtmlAdapterMatchers,
-  ...inlineDeltaToHtmlAdapterMatchers,
+  ...InlineDeltaToHtmlAdapterExtensions,
 ].forEach(ext => {
   ext.setup(container);
 });

blocksuite/blocks/src/_common/transformers/markdown.ts

@@ -1,3 +1,7 @@
+import {
+  InlineDeltaToMarkdownAdapterExtensions,
+  MarkdownInlineToDeltaAdapterExtensions,
+} from '@blocksuite/affine-components/rich-text';
 import { MarkdownAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
 import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
@@ -6,8 +10,6 @@ import type { Store, Workspace } from '@blocksuite/store';
 import { extMimeMap, Transformer } from '@blocksuite/store';
 
 import { defaultBlockMarkdownAdapterMatchers } from '../adapters/index.js';
-import { inlineDeltaToMarkdownAdapterMatchers } from '../adapters/markdown/delta-converter/inline-delta.js';
-import { markdownInlineToDeltaMatchers } from '../adapters/markdown/delta-converter/markdown-inline.js';
 import {
   defaultImageProxyMiddleware,
   docLinkBaseURLMiddleware,
@@ -18,9 +20,9 @@ import { createAssetsArchive, download, Unzip } from './utils.js';
 
 const container = new Container();
 [
-  ...markdownInlineToDeltaMatchers,
+  ...MarkdownInlineToDeltaAdapterExtensions,
   ...defaultBlockMarkdownAdapterMatchers,
-  ...inlineDeltaToMarkdownAdapterMatchers,
+  ...InlineDeltaToMarkdownAdapterExtensions,
 ].forEach(ext => {
   ext.setup(container);
 });

blocksuite/blocks/src/_common/transformers/notion-html.ts

@@ -1,10 +1,10 @@
+import { NotionHtmlInlineToDeltaAdapterExtensions } from '@blocksuite/affine-components/rich-text';
 import { NotionHtmlAdapter } from '@blocksuite/affine-shared/adapters';
 import { Container } from '@blocksuite/global/di';
 import { sha } from '@blocksuite/global/utils';
 import { extMimeMap, Transformer, type Workspace } from '@blocksuite/store';
 
 import { defaultBlockNotionHtmlAdapterMatchers } from '../adapters/notion-html/block-matcher.js';
-import { notionHtmlInlineToDeltaMatchers } from '../adapters/notion-html/delta-converter/html-inline.js';
 import { defaultImageProxyMiddleware } from './middlewares.js';
 import { Unzip } from './utils.js';
 
@@ -15,7 +15,7 @@ type ImportNotionZipOptions = {
 
 const container = new Container();
 [
-  ...notionHtmlInlineToDeltaMatchers,
+  ...NotionHtmlInlineToDeltaAdapterExtensions,
   ...defaultBlockNotionHtmlAdapterMatchers,
 ].forEach(ext => {
   ext.setup(container);

blocksuite/blocks/src/index.ts

@@ -7,7 +7,6 @@ import { splitElements } from './root-block/edgeless/utils/clipboard-utils.js';
 import { isCanvasElement } from './root-block/edgeless/utils/query.js';
 
 export * from './_common/adapters/index.js';
-export * from './_common/adapters/markdown';
 export { type NavigatorMode } from './_common/edgeless/frame/consts.js';
 export {
   ExportManager,

packages/frontend/apps/ios/src/app.tsx

@@ -32,9 +32,9 @@ import { I18n } from '@affine/i18n';
 import {
   defaultBlockMarkdownAdapterMatchers,
   docLinkBaseURLMiddleware,
-  inlineDeltaToMarkdownAdapterMatchers,
+  InlineDeltaToMarkdownAdapterExtensions,
   MarkdownAdapter,
-  markdownInlineToDeltaMatchers,
+  MarkdownInlineToDeltaAdapterExtensions,
   titleMiddleware,
 } from '@blocksuite/affine/blocks';
 import { Container } from '@blocksuite/affine/global/di';
@@ -198,9 +198,9 @@ const frameworkProvider = framework.provider();
 
     const container = new Container();
     [
-      ...markdownInlineToDeltaMatchers,
+      ...MarkdownInlineToDeltaAdapterExtensions,
       ...defaultBlockMarkdownAdapterMatchers,
-      ...inlineDeltaToMarkdownAdapterMatchers,
+      ...InlineDeltaToMarkdownAdapterExtensions,
     ].forEach(ext => {
       ext.setup(container);
     });

packages/frontend/core/src/blocksuite/presets/_common/components/text-renderer.ts

@@ -11,9 +11,9 @@ import {
   CodeBlockComponent,
   defaultBlockMarkdownAdapterMatchers,
   DividerBlockComponent,
-  inlineDeltaToMarkdownAdapterMatchers,
+  InlineDeltaToMarkdownAdapterExtensions,
   ListBlockComponent,
-  markdownInlineToDeltaMatchers,
+  MarkdownInlineToDeltaAdapterExtensions,
   ParagraphBlockComponent,
 } from '@blocksuite/affine/blocks';
 import { Container, type ServiceProvider } from '@blocksuite/affine/global/di';
@@ -201,9 +201,9 @@ export class TextRenderer extends WithDisposable(ShadowlessElement) {
       } else {
         const container = new Container();
         [
-          ...markdownInlineToDeltaMatchers,
+          ...MarkdownInlineToDeltaAdapterExtensions,
           ...defaultBlockMarkdownAdapterMatchers,
-          ...inlineDeltaToMarkdownAdapterMatchers,
+          ...InlineDeltaToMarkdownAdapterExtensions,
         ].forEach(ext => {
           ext.setup(container);
         });

packages/frontend/core/src/blocksuite/presets/ai/mini-mindmap/__tests__/mindmap-preview.unit.spec.ts

@@ -1,7 +1,7 @@
 import {
   defaultBlockMarkdownAdapterMatchers,
-  inlineDeltaToMarkdownAdapterMatchers,
+  InlineDeltaToMarkdownAdapterExtensions,
-  markdownInlineToDeltaMatchers,
+  MarkdownInlineToDeltaAdapterExtensions,
 } from '@blocksuite/affine/blocks';
 import { Container } from '@blocksuite/affine/global/di';
 import { Schema } from '@blocksuite/store';
@@ -12,9 +12,9 @@ import { markdownToMindmap } from '../mindmap-preview.js';
 
 const container = new Container();
 [
-  ...markdownInlineToDeltaMatchers,
+  ...MarkdownInlineToDeltaAdapterExtensions,
   ...defaultBlockMarkdownAdapterMatchers,
-  ...inlineDeltaToMarkdownAdapterMatchers,
+  ...InlineDeltaToMarkdownAdapterExtensions,
 ].forEach(ext => {
   ext.setup(container);
 });

packages/frontend/core/src/modules/docs-search/worker/in-worker.ts

@@ -7,9 +7,9 @@ import type {
 } from '@blocksuite/affine/blocks';
 import {
   defaultBlockMarkdownAdapterMatchers,
-  inlineDeltaToMarkdownAdapterMatchers,
+  InlineDeltaToMarkdownAdapterExtensions,
   MarkdownAdapter,
-  markdownInlineToDeltaMatchers,
+  MarkdownInlineToDeltaAdapterExtensions,
 } from '@blocksuite/affine/blocks';
 import { Container } from '@blocksuite/affine/global/di';
 import {
@@ -184,9 +184,9 @@ function generateMarkdownPreviewBuilder(
 
   const container = new Container();
   [
-    ...markdownInlineToDeltaMatchers,
+    ...MarkdownInlineToDeltaAdapterExtensions,
     ...defaultBlockMarkdownAdapterMatchers,
-    ...inlineDeltaToMarkdownAdapterMatchers,
+    ...InlineDeltaToMarkdownAdapterExtensions,
   ].forEach(ext => {
     ext.setup(container);
   });

yarn.lock

@@ -3649,13 +3649,17 @@ __metadata:
     "@lottiefiles/dotlottie-wc": "npm:^0.4.0"
     "@preact/signals-core": "npm:^1.8.0"
     "@toeverything/theme": "npm:^1.1.3"
+    "@types/hast": "npm:^3.0.4"
     "@types/katex": "npm:^0.16.7"
     "@types/lodash.clonedeep": "npm:^4.5.9"
+    "@types/mdast": "npm:^4.0.4"
+    collapse-white-space: "npm:^2.1.0"
     date-fns: "npm:^4.0.0"
     katex: "npm:^0.16.11"
     lit: "npm:^3.2.0"
     lit-html: "npm:^3.2.1"
     lodash.clonedeep: "npm:^4.5.0"
+    remark-math: "npm:^6.0.0"
     shiki: "npm:^1.12.0"
     yjs: "npm:^13.6.21"
     zod: "npm:^3.23.8"
@@ -3861,11 +3865,8 @@ __metadata:
     "@lit/context": "npm:^1.1.2"
     "@preact/signals-core": "npm:^1.8.0"
     "@toeverything/theme": "npm:^1.1.3"
-    "@types/hast": "npm:^3.0.4"
     "@types/katex": "npm:^0.16.7"
     "@types/lodash.isequal": "npm:^4.5.8"
-    "@types/mdast": "npm:^4.0.4"
-    collapse-white-space: "npm:^2.1.0"
     date-fns: "npm:^4.0.0"
     dompurify: "npm:^3.1.6"
     fflate: "npm:^0.8.2"
@@ -3876,26 +3877,11 @@ __metadata:
     lit: "npm:^3.2.0"
     lodash.isequal: "npm:^4.5.0"
     lz-string: "npm:^1.5.0"
-    mdast-util-gfm-autolink-literal: "npm:^2.0.1"
-    mdast-util-gfm-strikethrough: "npm:^2.0.0"
-    mdast-util-gfm-table: "npm:^2.0.0"
-    mdast-util-gfm-task-list-item: "npm:^2.0.0"
-    micromark-extension-gfm-autolink-literal: "npm:^2.1.0"
-    micromark-extension-gfm-strikethrough: "npm:^2.1.0"
-    micromark-extension-gfm-table: "npm:^2.1.0"
-    micromark-extension-gfm-task-list-item: "npm:^2.1.0"
-    micromark-util-combine-extensions: "npm:^2.0.0"
     minimatch: "npm:^10.0.1"
     nanoid: "npm:^5.0.7"
     pdf-lib: "npm:^1.17.1"
-    rehype-parse: "npm:^9.0.0"
-    rehype-stringify: "npm:^10.0.0"
-    remark-math: "npm:^6.0.0"
-    remark-parse: "npm:^11.0.0"
-    remark-stringify: "npm:^11.0.0"
     shiki: "npm:^1.14.1"
     simple-xml-to-json: "npm:^1.2.2"
-    unified: "npm:^11.0.5"
     yjs: "npm:^13.6.21"
     zod: "npm:^3.23.8"
   languageName: unknown