feat(editor): support edgeless code block

blocksuite/affine/blocks/code/src/code-edgeless-block.ts

@@ -0,0 +1,13 @@
+import { toGfxBlockComponent } from '@blocksuite/std';
+
+import { CodeBlockComponent } from './code-block.js';
+
+export class CodeEdgelessBlockComponent extends toGfxBlockComponent(
+  CodeBlockComponent
+) {}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'affine-edgeless-code': CodeEdgelessBlockComponent;
+  }
+}

blocksuite/affine/blocks/code/src/effects.ts

@@ -1,4 +1,5 @@
 import { CodeBlockComponent } from './code-block';
+import { CodeEdgelessBlockComponent } from './code-edgeless-block';
 import {
   AFFINE_CODE_TOOLBAR_WIDGET,
   AffineCodeToolbarWidget,
@@ -14,6 +15,7 @@ export function effects() {
   customElements.define(AFFINE_CODE_TOOLBAR_WIDGET, AffineCodeToolbarWidget);
   customElements.define('affine-code-unit', AffineCodeUnit);
   customElements.define('affine-code', CodeBlockComponent);
+  customElements.define('affine-edgeless-code', CodeEdgelessBlockComponent);
   customElements.define('preview-button', PreviewButton);
 }
 

blocksuite/affine/blocks/code/src/view.ts

@@ -41,7 +41,11 @@ export class CodeBlockViewExtension extends ViewExtensionProvider {
     context.register([
       FlavourExtension('affine:code'),
       CodeBlockHighlighter,
-      BlockViewExtension('affine:code', literal`affine-code`),
+      BlockViewExtension('affine:code', model => {
+        return model.parent?.flavour === 'affine:surface'
+          ? literal`affine-edgeless-code`
+          : literal`affine-code`;
+      }),
       SlashMenuConfigExtension('affine:code', codeSlashMenuConfig),
       CodeKeymapExtension,
       ...getCodeClipboardExtensions(),