@commonpub/layer 0.7.6 → 0.7.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commonpub/layer",
-  "version": "0.7.6",
+  "version": "0.7.7",
   "type": "module",
   "main": "./nuxt.config.ts",
   "files": [
@@ -51,15 +51,15 @@
     "vue-router": "^4.3.0",
     "zod": "^4.3.6",
     "@commonpub/auth": "0.5.0",
-    "@commonpub/config": "0.9.0",
-    "@commonpub/docs": "0.6.2",
     "@commonpub/editor": "0.7.0",
+    "@commonpub/config": "0.9.0",
     "@commonpub/explainer": "0.7.4",
+    "@commonpub/docs": "0.6.2",
     "@commonpub/learning": "0.5.0",
-    "@commonpub/schema": "0.9.4",
     "@commonpub/protocol": "0.9.7",
-    "@commonpub/ui": "0.8.5",
-    "@commonpub/server": "2.27.5"
+    "@commonpub/schema": "0.9.4",
+    "@commonpub/server": "2.27.6",
+    "@commonpub/ui": "0.8.5"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",

package/pages/docs/[siteSlug]/edit.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
+import { provide } from 'vue';
 import type { BlockTuple } from '@commonpub/editor';
-import { BlockCanvas, EditorShell, useBlockEditor, type BlockTypeGroup } from '@commonpub/editor/vue';
+import { BlockCanvas, EditorShell, useBlockEditor, UPLOAD_HANDLER_KEY, type BlockTypeGroup } from '@commonpub/editor/vue';
 import type { PageTreeItem } from '../../../components/editors/DocsPageTree.vue';
 
 definePageMeta({ layout: false, middleware: 'auth' });
@@ -9,6 +10,15 @@ const route = useRoute();
 const siteSlug = computed(() => route.params.siteSlug as string);
 const { show: toast } = useToast();
 
+// Provide upload handler to block components (ImageBlock, GalleryBlock)
+provide(UPLOAD_HANDLER_KEY, async (file: File) => {
+  const formData = new FormData();
+  formData.append('file', file);
+  formData.append('purpose', 'content');
+  const res = await $fetch<{ url: string; width?: number | null; height?: number | null }>('/api/files/upload', { method: 'POST', body: formData });
+  return { url: res.url, width: res.width ?? null, height: res.height ?? null };
+});
+
 // ═══ DATA FETCHING ═══
 const { data: site, refresh: refreshSite } = await useFetch<{ id: string; name: string; slug: string; description: string; ownerId: string; versions?: Array<{ id: string; version: string; isDefault: boolean }> }>(() => `/api/docs/${siteSlug.value}`);
 

package/pages/u/[username]/[type]/[slug]/edit.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import type { Component } from 'vue';
+import { provide } from 'vue';
 import type { BlockTuple } from '@commonpub/editor';
-import { BlockCanvas, useBlockEditor } from '@commonpub/editor/vue';
+import { BlockCanvas, useBlockEditor, UPLOAD_HANDLER_KEY, SEARCH_PRODUCTS_KEY } from '@commonpub/editor/vue';
 import { isExplainerDocument, createEmptyDocument } from '@commonpub/explainer';
 import type { ExplainerDocument } from '@commonpub/explainer';
 import { ExplainerSectionEditor } from '@commonpub/explainer/vue';
@@ -93,6 +94,20 @@ const { errors: publishErrors, showErrors: showPublishErrors, validate, dismiss:
   getBlockTuples: getContentForSave as () => BlockTuple[],
 });
 
+// --- Provide upload + search handlers to block components via inject ---
+provide(UPLOAD_HANDLER_KEY, async (file: File) => {
+  const formData = new FormData();
+  formData.append('file', file);
+  formData.append('purpose', 'content');
+  const res = await $fetch<{ url: string; width?: number | null; height?: number | null }>('/api/files/upload', { method: 'POST', body: formData });
+  return { url: res.url, width: res.width ?? null, height: res.height ?? null };
+});
+
+provide(SEARCH_PRODUCTS_KEY, async (query: string) => {
+  const res = await $fetch<{ items: Array<{ id: string; name: string; slug: string; description: string | null; category: string | null; imageUrl: string | null; purchaseUrl: string | null }> }>(`/api/products?q=${encodeURIComponent(query)}&limit=10`);
+  return res.items ?? [];
+});
+
 // --- Specialized editor component map ---
 const editorMap: Record<string, Component> = {
   article: resolveComponent('EditorsArticleEditor') as Component,