feat(editor): frame and image extensions (#11849)

Closes: BS-3196
Closes: BS-3197

blocksuite/affine/blocks/image/package.json

@@ -13,6 +13,7 @@
     "@blocksuite/affine-block-note": "workspace:*",
     "@blocksuite/affine-block-surface": "workspace:*",
     "@blocksuite/affine-components": "workspace:*",
+    "@blocksuite/affine-ext-loader": "workspace:*",
     "@blocksuite/affine-gfx-turbo-renderer": "workspace:*",
     "@blocksuite/affine-model": "workspace:*",
     "@blocksuite/affine-shared": "workspace:*",
@@ -34,7 +35,9 @@
   "exports": {
     ".": "./src/index.ts",
     "./effects": "./src/effects.ts",
-    "./turbo-painter": "./src/turbo/image-painter.worker.ts"
+    "./turbo-painter": "./src/turbo/image-painter.worker.ts",
+    "./store": "./src/store.ts",
+    "./view": "./src/view.ts"
   },
   "files": [
     "src",

blocksuite/affine/blocks/image/src/image-proxy-service.ts

@@ -3,6 +3,7 @@ import { StoreExtension } from '@blocksuite/store';
 
 import { setImageProxyMiddlewareURL } from './adapters/middleware';
 
+// TODO(@mirone): this should be configured when setup instead of runtime
 export class ImageProxyService extends StoreExtension {
   static override key = 'image-proxy';
 

blocksuite/affine/blocks/image/src/store.ts

@@ -0,0 +1,31 @@
+import {
+  type StoreExtensionContext,
+  StoreExtensionProvider,
+} from '@blocksuite/affine-ext-loader';
+import { ImageBlockSchemaExtension } from '@blocksuite/affine-model';
+import { ImageSelectionExtension } from '@blocksuite/affine-shared/selection';
+import { z } from 'zod';
+
+import { ImageBlockAdapterExtensions } from './adapters/extension';
+import { ImageProxyService } from './image-proxy-service';
+
+const ImageStoreExtensionOptionsSchema = z.object({
+  imageProxyURL: z.string().optional(),
+});
+
+export class ImageStoreExtension extends StoreExtensionProvider {
+  override name = 'affine-image';
+
+  override schema = ImageStoreExtensionOptionsSchema;
+
+  override setup(context: StoreExtensionContext) {
+    super.setup(context);
+    context.register([
+      ImageBlockSchemaExtension,
+      ImageProxyService,
+      ImageSelectionExtension,
+    ]);
+    context.register(ImageBlockAdapterExtensions);
+    // TODO(@mirone): set image proxy url
+  }
+}

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

@@ -0,0 +1,21 @@
+import {
+  type ViewExtensionContext,
+  ViewExtensionProvider,
+} from '@blocksuite/affine-ext-loader';
+
+import { effects } from './effects';
+import { ImageBlockSpec } from './image-spec';
+
+export class ImageViewExtension extends ViewExtensionProvider {
+  override name = 'affine-image';
+
+  override effect() {
+    super.effect();
+    effects();
+  }
+
+  override setup(context: ViewExtensionContext) {
+    super.setup(context);
+    context.register(ImageBlockSpec);
+  }
+}

blocksuite/affine/blocks/image/tsconfig.json

@@ -10,6 +10,7 @@
     { "path": "../note" },
     { "path": "../surface" },
     { "path": "../../components" },
+    { "path": "../../ext-loader" },
     { "path": "../../gfx/turbo-renderer" },
     { "path": "../../model" },
     { "path": "../../shared" },