nuxt-media-library 0.0.56 → 0.0.58

package/README.md

@@ -237,9 +237,11 @@ merges the layers, so every widget on the site can use any backend by name.
 export default defineNuxtConfig({
   modules: ['nuxt-media-library'],
   mediaLibrary: {
-    serviceUploads: {
-      backends: { videos: { start: '/api/videos/uploads' } },
-      // refresh defaults to `${start}/:sessionId/grant`
+    backends: {
+      videos: {
+        upload: { start: '/api/videos/uploads' }, // refresh defaults to `${start}/:sessionId/grant`
+        claim: '/api/videos/uploads/:sessionId/attach', // py_client on_attach
+      },
     },
   },
 })
@@ -257,17 +259,26 @@ export default defineNuxtConfig({
 ```vue
 <MLMediaGallery
   v-model="lesson.mediaIds"
-  service="videos"
+  backend="videos"
   profile="lesson-video"
   :service-body="{ context: { lessonId } }"
   @uploaded="(assetId, role, sessionId) => attach(assetId, sessionId)"
 />
 ```
 
-- `service` on `MLMediaGallery`, `MLMediaField` and the file picker (and
-  `useMLMediaUpload`): a backend name, or `{ start }` for a one-off. Without
-  it, widgets upload through Nuxt's own route as before; an unknown name
-  fails that upload with a message naming the missing backend.
+- `backend` on `MLMediaGallery`, `MLMediaField` and the file picker (and
+  `useMLMediaUpload`): a name in `mediaLibrary.backends`. `service` is its
+  older name and still takes `{ start }` for a one-off; `backend` wins.
+  Without either, widgets upload through Nuxt's own route as before; an
+  unknown name fails that upload with a message naming the missing backend.
+- Each backend has a `kind`: `media-library` (the default) or `media-kit`.
+  This version uploads only to `media-library` backends; a `media-kit` one
+  fails the upload with a clear message.
+- With `claim`, the upload queue attaches files whose page was left before
+  the widget attached them (`POST { assetId, profile }`; 409 counts as
+  attached). The tray shows a refusal with "Add again".
+- `mediaLibrary.serviceUploads.backends` still works: each entry becomes a
+  `media-library` backend with that `upload` and no `claim`.
 - The start request carries the file (`mimeType`, `sizeBytes`, `filename`),
   `profile` (each role's, in a gallery with roles) and `service-body`. The
   service's profile decides kind, visibility and processing, so

package/dist/module.d.mts

@@ -1,5 +1,6 @@
 import * as _nuxt_schema from '@nuxt/schema';
 import { ServiceUploadBackend } from '../dist/runtime/utils/uploader/serviceBackends.js';
+import { MediaBackends } from '../dist/runtime/utils/backends.js';
 export * from '../dist/runtime/types/resourcePolicy.js';
 export * from '../dist/runtime/types/uploader.js';
 export * from '../dist/runtime/types/preview.js';
@@ -43,9 +44,8 @@ interface ModuleOptions {
      * public API root with `/v1`, or a proxy route); with `proxy` it defaults
      * to the pass-through route.
      *
-     * `backends` names the services that start uploads, so widgets can use
-     * `service="videos"`. Each service's Nuxt layer registers its own; Nuxt
-     * merges them across layers. Paths only: each layer serves its routes.
+     * `backends`: older form of `mediaLibrary.backends` (start/refresh only).
+     * Each entry becomes a `media-library` backend with that `upload`.
      */
     serviceUploads?: {
         proxy?: boolean;
@@ -62,6 +62,16 @@ interface ModuleOptions {
      * pass-through are still registered.
      */
     manageProxy?: boolean;
+    /**
+     * The backend registry: named places widgets upload to and read from
+     * (`<MLMediaGallery backend="videos" />`). Each entry has a `kind`
+     * (`media-library`, the default, or `media-kit`) and its routes: `upload`
+     * (`{ start, refresh? }`, py_client `create_upload_router`), `claim`
+     * (attach a finished upload, `/…/:sessionId/attach`). Each service's Nuxt
+     * layer registers its own; Nuxt merges them. Paths only: each layer serves
+     * its routes.
+     */
+    backends?: MediaBackends;
 }
 declare const SERVICE_UPLOADS_ROUTE = "/api/media-library/service-uploads";
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;

package/dist/module.d.ts

@@ -1,5 +1,6 @@
 import * as _nuxt_schema from '@nuxt/schema';
 import { ServiceUploadBackend } from '../dist/runtime/utils/uploader/serviceBackends.js';
+import { MediaBackends } from '../dist/runtime/utils/backends.js';
 export * from '../dist/runtime/types/resourcePolicy.js';
 export * from '../dist/runtime/types/uploader.js';
 export * from '../dist/runtime/types/preview.js';
@@ -43,9 +44,8 @@ interface ModuleOptions {
      * public API root with `/v1`, or a proxy route); with `proxy` it defaults
      * to the pass-through route.
      *
-     * `backends` names the services that start uploads, so widgets can use
-     * `service="videos"`. Each service's Nuxt layer registers its own; Nuxt
-     * merges them across layers. Paths only: each layer serves its routes.
+     * `backends`: older form of `mediaLibrary.backends` (start/refresh only).
+     * Each entry becomes a `media-library` backend with that `upload`.
      */
     serviceUploads?: {
         proxy?: boolean;
@@ -62,6 +62,16 @@ interface ModuleOptions {
      * pass-through are still registered.
      */
     manageProxy?: boolean;
+    /**
+     * The backend registry: named places widgets upload to and read from
+     * (`<MLMediaGallery backend="videos" />`). Each entry has a `kind`
+     * (`media-library`, the default, or `media-kit`) and its routes: `upload`
+     * (`{ start, refresh? }`, py_client `create_upload_router`), `claim`
+     * (attach a finished upload, `/…/:sessionId/attach`). Each service's Nuxt
+     * layer registers its own; Nuxt merges them. Paths only: each layer serves
+     * its routes.
+     */
+    backends?: MediaBackends;
 }
 declare const SERVICE_UPLOADS_ROUTE = "/api/media-library/service-uploads";
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "media-library",
   "configKey": "mediaLibrary",
-  "version": "0.0.56",
+  "version": "0.0.58",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,6 +1,7 @@
 import { existsSync, readdirSync } from 'node:fs';
 import { join } from 'node:path';
 import { defineNuxtModule, createResolver, addImportsDir, addComponentsDir, addServerHandler, useLogger, addPlugin } from '@nuxt/kit';
+import { normalizeBackends } from '../dist/runtime/utils/backends.js';
 export * from '../dist/runtime/types/resourcePolicy.js';
 export * from '../dist/runtime/types/uploader.js';
 export * from '../dist/runtime/types/preview.js';
@@ -22,23 +23,6 @@ function browserBaseURL(existingPublic, publicBaseURL) {
 }
 
 const SERVICE_UPLOADS_ROUTE = "/api/media-library/service-uploads";
-function serviceBackends(backends, logger) {
-  const out = {};
-  for (const [name, backend] of Object.entries(backends ?? {})) {
-    if (!backend || typeof backend.start !== "string" || !backend.start) {
-      logger.warn(`mediaLibrary.serviceUploads.backends.${name} has no start path; ignored.`);
-      continue;
-    }
-    if (backend.refresh && !backend.refresh.includes(":sessionId")) {
-      logger.warn(`mediaLibrary.serviceUploads.backends.${name}.refresh needs a :sessionId placeholder; using the default.`);
-    }
-    out[name] = {
-      start: backend.start,
-      ...backend.refresh?.includes(":sessionId") ? { refresh: backend.refresh } : {}
-    };
-  }
-  return out;
-}
 function appCatchAlls(layers) {
   const found = [];
   for (const { config } of layers) {
@@ -171,6 +155,10 @@ const module$1 = defineNuxtModule({
     if (existingPublic.proxyUploads === false && !existingPublic.baseURL && !options.publicBaseURL) {
       logger.warn("proxyUploads is false but no public media library address is set: set mediaLibrary.publicBaseURL. baseURL is server-side only.");
     }
+    const backends = {
+      ...normalizeBackends(options.backends, options.serviceUploads?.backends, (m) => logger.warn(m)),
+      ...normalizeBackends(existingPublic.backends, existingPublic.serviceUploadBackends, (m) => logger.warn(m))
+    };
     nuxt.options.runtimeConfig.public.mediaLibrary = {
       ...existingPublic,
       baseURL: browserBaseURL(existingPublic.baseURL, options.publicBaseURL),
@@ -186,8 +174,12 @@ const module$1 = defineNuxtModule({
       headers: publicHeaders.headers,
       // Where useMLServiceUpload sends parts (NUXT_PUBLIC_MEDIA_LIBRARY_SERVICE_UPLOAD_BASE_URL).
       serviceUploadBaseURL: existingPublic.serviceUploadBaseURL || options.serviceUploads?.baseURL || (options.serviceUploads?.proxy ? SERVICE_UPLOADS_ROUTE : ""),
-      // Names widgets can pass as `service` (NUXT_PUBLIC_MEDIA_LIBRARY_SERVICE_UPLOAD_BACKENDS).
-      serviceUploadBackends: { ...serviceBackends(options.serviceUploads?.backends, logger), ...existingPublic.serviceUploadBackends }
+      // The backend registry (NUXT_PUBLIC_MEDIA_LIBRARY_BACKENDS): names widgets pass as `backend`.
+      backends,
+      // Older form, kept for code that reads it: each backend's upload routes.
+      serviceUploadBackends: Object.fromEntries(
+        Object.entries(backends).flatMap(([name, b]) => b.upload ? [[name, b.upload]] : [])
+      )
     };
     addPlugin({
       src: resolver.resolve("./runtime/plugins/config")

package/dist/runtime/components/MLMedia/Field.d.vue.ts

@@ -18,10 +18,12 @@ type __VLS_Props = {
     /** Upload profile name for new files. */
     profile?: string | null;
     /**
-     * Start uploads at a backend service instead of Nuxt's own route: a name
-     * registered under `mediaLibrary.serviceUploads.backends` (e.g. "videos"),
-     * or `{ start }`. See useMLMediaUpload.
+     * The backend registered under `mediaLibrary.backends` that uploads go to
+     * (e.g. "videos"). Its `claim` route attaches files whose page was left
+     * before they finished. Wins over `service`.
      */
+    backend?: string | null;
+    /** Older name for `backend`; also takes an inline `{ start }`. See useMLMediaUpload. */
     service?: MediaUploadOptions['service'];
     /** Extra fields for the service's start request, e.g. `{ context: { lessonId } }`. */
     serviceBody?: Record<string, unknown> | null;
@@ -65,6 +67,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     };
     collectionName: string | null;
     profile: string | null;
+    backend: string | null;
     service: string | import("../../index.js").MediaServiceUpload | null;
     serviceBody: Record<string, unknown> | null;
     hint: string;

package/dist/runtime/components/MLMedia/Field.vue

@@ -16,6 +16,7 @@ const props = defineProps({
   processingConfig: { type: Object, required: false, default: void 0 },
   collectionName: { type: [String, null], required: false, default: null },
   profile: { type: [String, null], required: false, default: null },
+  backend: { type: [String, null], required: false, default: null },
   service: { type: null, required: false, default: void 0 },
   serviceBody: { type: [Object, null], required: false, default: null },
   picker: { type: Boolean, required: false, default: true },
@@ -34,8 +35,10 @@ const field = useMLMediaField(model, {
   processingConfig: props.processingConfig,
   collectionName: props.collectionName,
   profile: props.profile,
+  backend: props.backend,
   service: props.service,
   serviceBody: props.serviceBody,
+  label: props.label || void 0,
   onUploaded: (id, sessionId) => emit("uploaded", id, sessionId)
 });
 const { state, asset, upload, message } = field;
@@ -76,6 +79,7 @@ const uploadOptions = computed(() => ({
   processingConfig: props.processingConfig,
   collectionName: props.collectionName,
   profile: props.profile,
+  backend: props.backend,
   service: props.service,
   serviceBody: props.serviceBody
 }));

package/dist/runtime/components/MLMedia/Field.vue.d.ts

@@ -18,10 +18,12 @@ type __VLS_Props = {
     /** Upload profile name for new files. */
     profile?: string | null;
     /**
-     * Start uploads at a backend service instead of Nuxt's own route: a name
-     * registered under `mediaLibrary.serviceUploads.backends` (e.g. "videos"),
-     * or `{ start }`. See useMLMediaUpload.
+     * The backend registered under `mediaLibrary.backends` that uploads go to
+     * (e.g. "videos"). Its `claim` route attaches files whose page was left
+     * before they finished. Wins over `service`.
      */
+    backend?: string | null;
+    /** Older name for `backend`; also takes an inline `{ start }`. See useMLMediaUpload. */
     service?: MediaUploadOptions['service'];
     /** Extra fields for the service's start request, e.g. `{ context: { lessonId } }`. */
     serviceBody?: Record<string, unknown> | null;
@@ -65,6 +67,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     };
     collectionName: string | null;
     profile: string | null;
+    backend: string | null;
     service: string | import("../../index.js").MediaServiceUpload | null;
     serviceBody: Record<string, unknown> | null;
     hint: string;

package/dist/runtime/components/MLMedia/FilePickerPanel.vue

@@ -72,6 +72,7 @@ function onFiles(files) {
     const u = uploader.start(file);
     void u.created.then((id) => {
       if (!id) return;
+      u.attached = true;
       props.onUploaded?.(id, u.sessionId);
       if (!isChosen(id)) choose(id);
     });

package/dist/runtime/components/MLMedia/Gallery.d.vue.ts

@@ -15,7 +15,11 @@ export type MediaGalleryProfiles = Record<string, MediaGalleryRole>;
 type __VLS_Props = {
     /** Roles of this usage. Omit for a single list driven by v-model. */
     profiles?: MediaGalleryProfiles | null;
-    /** Role new uploads and picked files go to. Defaults to the first role that holds more than one file. */
+    /**
+     * Role tried first for new uploads and picked files, when it takes their
+     * kind. Defaults to the first role that holds more than one file. Files of
+     * other kinds go to the first role that takes them.
+     */
     defaultRole?: string;
     accept?: readonly string[] | string;
     max?: number | null;
@@ -31,10 +35,12 @@ type __VLS_Props = {
     /** Upload profile for the single list (with `profiles`, each role has its own). */
     profile?: string | null;
     /**
-     * Start uploads at a backend service instead of Nuxt's own route: a name
-     * registered under `mediaLibrary.serviceUploads.backends` (e.g. "videos"),
-     * or `{ start }`. Each role's profile is sent with the start request.
+     * The backend registered under `mediaLibrary.backends` that uploads go to
+     * (e.g. "videos"). Its `claim` route attaches files whose page was left
+     * before they finished. Each role's profile is sent with the start request. Wins over `service`.
      */
+    backend?: string | null;
+    /** Older name for `backend`; also takes an inline `{ start }`. */
     service?: MediaUploadOptions['service'];
     /** Extra fields for the service's start request, e.g. `{ context: { lessonId } }`. */
     serviceBody?: Record<string, unknown> | null;
@@ -72,6 +78,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     };
     collectionName: string | null;
     profile: string | null;
+    backend: string | null;
     service: string | import("../../index.js").MediaServiceUpload | null;
     serviceBody: Record<string, unknown> | null;
     hint: string;

package/dist/runtime/components/MLMedia/Gallery.vue

@@ -1,5 +1,7 @@
 <script setup>
 import { computed, ref, watch } from "vue";
+import { $fetch } from "ofetch";
+import { kindForFile } from "../../utils/fileAccept";
 import { GALLERY_TILE_TYPE } from "../../utils/galleryDrag";
 import GallerySection from "./GallerySection.vue";
 const props = defineProps({
@@ -17,6 +19,7 @@ const props = defineProps({
   processingConfig: { type: Object, required: false, default: void 0 },
   collectionName: { type: [String, null], required: false, default: null },
   profile: { type: [String, null], required: false, default: null },
+  backend: { type: [String, null], required: false, default: null },
   service: { type: null, required: false, default: void 0 },
   serviceBody: { type: [Object, null], required: false, default: null },
   picker: { type: Boolean, required: false, default: true },
@@ -78,16 +81,108 @@ function setRole(id, key, on) {
 }
 const pendingRole = /* @__PURE__ */ new Map();
 const uploadedRole = /* @__PURE__ */ new Map();
+const roleAccept = (r) => r.accept ?? props.accept;
+const anyAccept = computed(() => {
+  const kinds = /* @__PURE__ */ new Set();
+  for (const r of roles.value) {
+    const a = roleAccept(r);
+    const list = (typeof a === "string" ? a.split(",") : [...a ?? []]).map((k) => k.trim().toLowerCase()).filter(Boolean);
+    if (!list.length) return "";
+    list.forEach((k) => kinds.add(k));
+  }
+  return [...kinds];
+});
+const anyMaxSize = computed(() => {
+  let max = 0;
+  for (const r of roles.value) {
+    const m = r.maxSize ?? props.maxSize;
+    if (m == null) return null;
+    max = Math.max(max, m);
+  }
+  return max || null;
+});
+const kindMatters = computed(() => {
+  const seen = new Set(roles.value.map((r) => JSON.stringify(roleAccept(r) ?? "")));
+  return seen.size > 1;
+});
+function roleForKind(kind, taken = /* @__PURE__ */ new Set()) {
+  const ordered = [...roles.value.filter((r) => r.key === defaultKey.value), ...roles.value.filter((r) => r.key !== defaultKey.value)];
+  const takes = ordered.filter((r) => kindAllowed(kind, roleAccept(r)));
+  const room = takes.find((r) => single(r) ? !taken.has(r.key) && !sel(r.key).length : r.max == null || sel(r.key).length < r.max);
+  return (room ?? takes[0])?.key ?? null;
+}
+const profileFor = (file) => {
+  const key = roleForKind(kindForFile(file));
+  return key ? props.profiles?.[key]?.profile ?? null : null;
+};
+function routeFiles(files) {
+  notice.value = null;
+  const taken = /* @__PURE__ */ new Set();
+  const groups = /* @__PURE__ */ new Map();
+  const left = [];
+  for (const file of files) {
+    const key = roleForKind(kindForFile(file), taken);
+    if (!key) {
+      left.push(file);
+      continue;
+    }
+    taken.add(key);
+    groups.set(key, [...groups.get(key) ?? [], file]);
+  }
+  for (const [key, list] of groups) {
+    const role = props.profiles[key];
+    grid.value?.uploadFiles(list, {
+      profile: role.profile ?? null,
+      tag: key,
+      accept: roleAccept(role),
+      maxSize: role.maxSize ?? props.maxSize,
+      maxFiles: single(role) ? 1 : role.max != null ? Math.max(0, role.max - sel(key).length) : void 0
+    });
+  }
+  if (left.length) notice.value = `${left[0].name}${left.length > 1 ? ` and ${left.length - 1} more` : ""} can't be used in any role here.`;
+}
+async function placeByKind(ids) {
+  let kinds = /* @__PURE__ */ new Map();
+  try {
+    const res = await $fetch(
+      "/api/media-library/manage/assets/resolve",
+      { method: "POST", body: { assetIds: ids } }
+    );
+    kinds = new Map(res.items.map((it, i) => [it.asset?.id ?? it.assetId ?? ids[i], it.asset?.kind?.toLowerCase() ?? null]));
+  } catch {
+  }
+  const taken = /* @__PURE__ */ new Set();
+  const changes = {};
+  for (const id of ids) {
+    const key = roleForKind(kinds.get(id) ?? null, taken) ?? defaultKey.value;
+    taken.add(key);
+    const placed = withFile(key, id, changes[key] ?? sel(key));
+    if (placed) changes[key] = placed;
+    const session = pendingEmit.get(id);
+    if (session !== void 0) {
+      pendingEmit.delete(id);
+      emit("uploaded", id, key, session);
+    }
+  }
+  if (Object.keys(changes).length) commit(changes);
+}
+const pendingEmit = /* @__PURE__ */ new Map();
 function onUnionUpdate(next) {
   notice.value = null;
   const keep = new Set(next);
   const before = new Set(union.value);
   const changes = {};
   for (const r of roles.value) changes[r.key] = sel(r.key).filter((id) => keep.has(id));
+  const unplaced = [];
   for (const id of next) {
     if (before.has(id)) continue;
-    const key = pendingRole.get(id) ?? defaultKey.value;
+    const tagged = pendingRole.get(id);
     pendingRole.delete(id);
+    if (!tagged && kindMatters.value) {
+      unplaced.push(id);
+      continue;
+    }
+    const key = tagged ?? defaultKey.value;
     const placed = withFile(key, id, changes[key]);
     if (placed) changes[key] = placed;
   }
@@ -96,6 +191,7 @@ function onUnionUpdate(next) {
     if (!single(r)) changes[r.key] = [...changes[r.key]].sort((a, b) => (pos.get(a) ?? 0) - (pos.get(b) ?? 0));
   }
   commit(changes);
+  if (unplaced.length) void placeByKind(unplaced);
 }
 function onAdd(id, tag) {
   const key = tag ?? defaultKey.value;
@@ -104,8 +200,13 @@ function onAdd(id, tag) {
   else pendingRole.set(id, key);
 }
 function onUploaded(id, sessionId) {
-  emit("uploaded", id, uploadedRole.get(id) ?? defaultKey.value, sessionId);
+  const key = uploadedRole.get(id);
   uploadedRole.delete(id);
+  if (!key && kindMatters.value && !union.value.includes(id)) {
+    pendingEmit.set(id, sessionId);
+    return;
+  }
+  emit("uploaded", id, key ?? defaultKey.value, sessionId);
 }
 const badges = (id) => roles.value.filter((r) => sel(r.key).includes(id)).map((r) => r.label);
 function tileMenu(id, kind) {
@@ -170,9 +271,12 @@ function chipCount(key, max) {
     :model-value="union"
     :title="title"
     :hint="hint"
-    :accept="defaultRole?.accept ?? accept"
-    :max-size="defaultRole?.maxSize ?? maxSize"
+    :accept="anyAccept"
+    :max-size="anyMaxSize"
     :profile="defaultRole?.profile ?? null"
+    :profile-for="profileFor"
+    :on-route-files="routeFiles"
+    :backend="backend"
     :service="service"
     :service-body="serviceBody"
     :disabled="disabled"
@@ -251,6 +355,7 @@ function chipCount(key, max) {
     :processing-config="processingConfig"
     :collection-name="collectionName"
     :profile="profile"
+    :backend="backend"
     :service="service"
     :service-body="serviceBody"
     :picker="picker"

package/dist/runtime/components/MLMedia/Gallery.vue.d.ts

@@ -15,7 +15,11 @@ export type MediaGalleryProfiles = Record<string, MediaGalleryRole>;
 type __VLS_Props = {
     /** Roles of this usage. Omit for a single list driven by v-model. */
     profiles?: MediaGalleryProfiles | null;
-    /** Role new uploads and picked files go to. Defaults to the first role that holds more than one file. */
+    /**
+     * Role tried first for new uploads and picked files, when it takes their
+     * kind. Defaults to the first role that holds more than one file. Files of
+     * other kinds go to the first role that takes them.
+     */
     defaultRole?: string;
     accept?: readonly string[] | string;
     max?: number | null;
@@ -31,10 +35,12 @@ type __VLS_Props = {
     /** Upload profile for the single list (with `profiles`, each role has its own). */
     profile?: string | null;
     /**
-     * Start uploads at a backend service instead of Nuxt's own route: a name
-     * registered under `mediaLibrary.serviceUploads.backends` (e.g. "videos"),
-     * or `{ start }`. Each role's profile is sent with the start request.
+     * The backend registered under `mediaLibrary.backends` that uploads go to
+     * (e.g. "videos"). Its `claim` route attaches files whose page was left
+     * before they finished. Each role's profile is sent with the start request. Wins over `service`.
      */
+    backend?: string | null;
+    /** Older name for `backend`; also takes an inline `{ start }`. */
     service?: MediaUploadOptions['service'];
     /** Extra fields for the service's start request, e.g. `{ context: { lessonId } }`. */
     serviceBody?: Record<string, unknown> | null;
@@ -72,6 +78,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     };
     collectionName: string | null;
     profile: string | null;
+    backend: string | null;
     service: string | import("../../index.js").MediaServiceUpload | null;
     serviceBody: Record<string, unknown> | null;
     hint: string;

package/dist/runtime/components/MLMedia/GallerySection.d.vue.ts

@@ -26,7 +26,9 @@ type __VLS_Props = {
     onOpen?: (assetId: string) => void;
     /** Upload profile name for new files in this list. */
     profile?: string | null;
-    /** Start uploads at a backend service (name or `{ start }`). See useMLMediaUpload. */
+    /** Registered backend uploads go to (`mediaLibrary.backends`). Wins over `service`. */
+    backend?: string | null;
+    /** Older name for `backend`; also takes an inline `{ start }`. See useMLMediaUpload. */
     service?: MediaUploadOptions['service'];
     /** Extra fields for the service's start request, e.g. `{ context: { lessonId } }`. */
     serviceBody?: Record<string, unknown> | null;
@@ -40,6 +42,10 @@ type __VLS_Props = {
     highlight?: ReadonlySet<string> | null;
     /** See useMLMediaGallery's onAdd. */
     onAdd?: (assetId: string, tag: string | undefined) => void;
+    /** Take new files instead of uploading them here (a gallery with roles routes them by kind). */
+    onRouteFiles?: (files: File[]) => void;
+    /** Upload profile per file, for uploads inside the picker. */
+    profileFor?: (file: File) => string | null | undefined;
 };
 /** Upload files with another profile than the list's own, e.g. from a role chip. */
 declare function uploadFiles(files: File[], opts?: {
@@ -85,8 +91,10 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
     };
     collectionName: string | null;
     profile: string | null;
+    backend: string | null;
     service: string | import("../../index.js").MediaServiceUpload | null;
     serviceBody: Record<string, unknown> | null;
+    profileFor: (file: File) => string | null | undefined;
     onAdd: (assetId: string, tag: string | undefined) => void;
     hint: string;
     picker: boolean;
@@ -97,6 +105,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
     recordName: string;
     badges: (assetId: string) => string[];
     tileMenu: (assetId: string, kind: string | null) => DropdownMenuItem[][];
+    onRouteFiles: (files: File[]) => void;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/MLMedia/GallerySection.vue

@@ -24,13 +24,16 @@ const props = defineProps({
   editor: { type: Boolean, required: false, default: true },
   onOpen: { type: Function, required: false, default: void 0 },
   profile: { type: [String, null], required: false, default: null },
+  backend: { type: [String, null], required: false, default: null },
   service: { type: null, required: false, default: void 0 },
   serviceBody: { type: [Object, null], required: false, default: null },
   removeLabel: { type: String, required: false, default: void 0 },
   badges: { type: Function, required: false, default: void 0 },
   tileMenu: { type: Function, required: false, default: void 0 },
   highlight: { type: [Set, null], required: false, default: null },
-  onAdd: { type: Function, required: false, default: void 0 }
+  onAdd: { type: Function, required: false, default: void 0 },
+  onRouteFiles: { type: Function, required: false, default: void 0 },
+  profileFor: { type: Function, required: false, default: void 0 }
 });
 const model = defineModel({ type: Array, ...{ default: () => [] } });
 const alt = defineModel("alt", { type: null, ...{ default: void 0 } });
@@ -43,8 +46,10 @@ const gallery = useMLMediaGallery(model, {
   processingConfig: props.processingConfig,
   collectionName: props.collectionName,
   profile: props.profile,
+  backend: props.backend,
   service: props.service,
   serviceBody: props.serviceBody,
+  label: props.recordName ? `${props.title} of ${props.recordName}` : props.title,
   onUploaded: (id, sessionId) => emit("uploaded", id, sessionId),
   onAdd: (id, tag) => props.onAdd?.(id, tag)
 });
@@ -126,6 +131,8 @@ async function pickExisting() {
       processingConfig: props.processingConfig,
       collectionName: props.collectionName,
       profile: props.profile,
+      profileFor: props.profileFor,
+      backend: props.backend,
       service: props.service,
       serviceBody: props.serviceBody
     },
@@ -199,6 +206,10 @@ function uploadFiles(files, opts = {}) {
   if (rejected.length) gallery.onRejected(rejected);
   if (accepted.length) gallery.onFiles(accepted, { profile: opts.profile, tag: opts.tag });
 }
+function onDropFiles(files) {
+  if (props.onRouteFiles) props.onRouteFiles(files);
+  else gallery.onFiles(files);
+}
 defineExpose({ uploadFiles });
 function moveAndAnnounce(from, to) {
   const id = model.value[from];
@@ -279,7 +290,7 @@ async function onTileKey(e, index) {
       :disabled="disabled || full"
       title="Drop to add"
       class="rounded-lg"
-      @files="gallery.onFiles"
+      @files="onDropFiles"
       @rejected="gallery.onRejected"
     >
       <template #default="{ open }">

package/dist/runtime/components/MLMedia/GallerySection.vue.d.ts

@@ -26,7 +26,9 @@ type __VLS_Props = {
     onOpen?: (assetId: string) => void;
     /** Upload profile name for new files in this list. */
     profile?: string | null;
-    /** Start uploads at a backend service (name or `{ start }`). See useMLMediaUpload. */
+    /** Registered backend uploads go to (`mediaLibrary.backends`). Wins over `service`. */
+    backend?: string | null;
+    /** Older name for `backend`; also takes an inline `{ start }`. See useMLMediaUpload. */
     service?: MediaUploadOptions['service'];
     /** Extra fields for the service's start request, e.g. `{ context: { lessonId } }`. */
     serviceBody?: Record<string, unknown> | null;
@@ -40,6 +42,10 @@ type __VLS_Props = {
     highlight?: ReadonlySet<string> | null;
     /** See useMLMediaGallery's onAdd. */
     onAdd?: (assetId: string, tag: string | undefined) => void;
+    /** Take new files instead of uploading them here (a gallery with roles routes them by kind). */
+    onRouteFiles?: (files: File[]) => void;
+    /** Upload profile per file, for uploads inside the picker. */
+    profileFor?: (file: File) => string | null | undefined;
 };
 /** Upload files with another profile than the list's own, e.g. from a role chip. */
 declare function uploadFiles(files: File[], opts?: {
@@ -85,8 +91,10 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
     };
     collectionName: string | null;
     profile: string | null;
+    backend: string | null;
     service: string | import("../../index.js").MediaServiceUpload | null;
     serviceBody: Record<string, unknown> | null;
+    profileFor: (file: File) => string | null | undefined;
     onAdd: (assetId: string, tag: string | undefined) => void;
     hint: string;
     picker: boolean;
@@ -97,6 +105,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
     recordName: string;
     badges: (assetId: string) => string[];
     tileMenu: (assetId: string, kind: string | null) => DropdownMenuItem[][];
+    onRouteFiles: (files: File[]) => void;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;