@xleddyl/nuxt-cms 0.1.58 → 0.1.60

package/README.md

@@ -8,7 +8,7 @@ nuxt-cms is a Nuxt module that leverages the Nitro server to ship a lightweight
 
 - **Zero extra infrastructure**: the CMS runs inside your app's Nitro server; you deploy one thing.
 - **Content types in code**: a `cms.config.ts` with `defineCmsConfig()` declares collections, single documents, relations, blocks and translatable fields; database schema, migrations and TypeScript types are generated from it.
-- **Admin panel at `/cms`**: entry editing with validation, drafts, media library (S3-compatible storage, or a local mode backed directly by your `public/` folder), single-admin auth from env credentials.
+- **Admin panel at `/cms`**: entry editing with validation, drafts, media library (S3-compatible storage, a directory on the server's disk, or a local mode backed directly by your `public/` folder), single-admin auth from env credentials.
 - **Public GraphQL API**: read-only, typed end-to-end via gql.tada, with filtering, sorting and pagination; fields marked `private` stay out of it.
 - **SQLite, Postgres, libSQL/Turso or Cloudflare D1**: a local file database by default, one config line to switch (including remote SQLite over the network).
 - **Runs on serverless too**: migrations are baked into the server bundle, uploads are presigned straight to your bucket, sessions are sealed cookies. Nothing on the request path needs a local disk or sticky instances.
@@ -89,6 +89,7 @@ Every secret maps to runtime config, so it can be set as an env var instead of i
 | `NUXT_CMS_MEDIA_ACCESS_KEY_ID` | for media | S3 access key id |
 | `NUXT_CMS_MEDIA_SECRET_ACCESS_KEY` | for media | S3 secret access key |
 | `NUXT_PUBLIC_CMS_MEDIA_BASE_URL` | for media | public base URL for uploaded files |
+| `NUXT_CMS_MEDIA_DIR` | for filesystem media | directory for uploaded files (default `data/media`) |
 
 ## Documentation
 
@@ -100,7 +101,7 @@ Full documentation lives in [`docs/`](docs/README.md):
 - [Schema](docs/schema.md) — `defineCmsConfig`, entries, pages, field types, relations, blocks, i18n.
 - [Querying content](docs/querying.md) — GraphQL API, `useCmsSingle` / `useCmsCollection` / `useCmsPage` / `useCms` / `$cmsQuery`, filters, sorting, pagination.
 - [Admin panel & security](docs/admin.md) — pages, authentication, sessions, admin REST API.
-- [Media](docs/media.md) — S3-compatible storage or local mode backed by your `public/` folder, upload flow, allowed file types.
+- [Media](docs/media.md) — S3-compatible storage, filesystem storage on the server's disk, or local mode backed by your `public/` folder, upload flow, allowed file types.
 - [Deployment](docs/deployment.md) — host/driver matrix, migrations on serverless, horizontal scaling, Cloudflare Workers.
 
 ## LLM guide

package/dist/module.d.mts

@@ -30,6 +30,11 @@ type ModuleOptionsMedia = {
 } | {
     storage: 'local';
     publicBaseUrl: string;
+} | {
+    storage: 'filesystem';
+    dir?: string;
+    publicBaseUrl?: string;
+    maxFileSize?: number;
 };
 interface ModuleOptions {
     enabled?: boolean;

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@xleddyl/nuxt-cms",
   "configKey": "cms",
-  "version": "0.1.58",
+  "version": "0.1.60",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -11,7 +11,7 @@ import { minifyIntrospection, outputIntrospectionFile } from 'gql.tada/internal'
 import { createJiti } from 'jiti';
 import { typeName, blockTypeName, blocksFieldTypeName, renderGraphqlSdl } from '../dist/runtime/shared/graphql-sdl.js';
 import { migrationsDirFor } from '../dist/runtime/shared/migrations-dir.js';
-import { pageColumnFields, isTranslatableField, isTranslatableMediaField, isMultiSelect, pageAllFields, PAGE_PATH_FIELD, pageRoutes, fieldConditions, pageFieldsTableName, pageMediaTableName, isRequiredField, pageFields, isPrivateField, entryFieldsFor, mediaTypeFilter, DEFAULT_MEDIA_MAX_FILE_SIZE } from '../dist/runtime/shared/index.js';
+import { pageColumnFields, isTranslatableField, isTranslatableMediaField, isMultiSelect, pageAllFields, PAGE_PATH_FIELD, pageRoutes, mobileMediaKey, fieldConditions, pageFieldsTableName, pageMediaTableName, isRequiredField, pageFields, isPrivateField, entryFieldsFor, mediaTypeFilter, DEFAULT_MEDIA_MAX_FILE_SIZE, expandMobileMedia } from '../dist/runtime/shared/index.js';
 import { scanMediaDirectory, readMediaFileMeta } from '../dist/runtime/server/utils/media-sync.js';
 import { createHash } from 'node:crypto';
 import { readFile } from 'node:fs/promises';
@@ -245,6 +245,13 @@ function validateConfig(config, i18n) {
         if (!locales.length)
           errors.push(`${fat}: translatable requires cms.i18n.locales in nuxt.config`);
       }
+      if (field.mobile) {
+        const mobileKey = mobileMediaKey(key);
+        if (field.type !== "media")
+          errors.push(`${fat}: mobile is only supported on media fields`);
+        else if (allFields[mobileKey] && allFields[mobileKey].mobileOf !== key)
+          errors.push(`${fat}: mobile needs the key '${mobileKey}', which is already declared`);
+      }
       if (field.type === "select") {
         if (!field.options?.length)
           errors.push(`${fat}: select requires a non-empty options array`);
@@ -337,6 +344,8 @@ function validateConfig(config, i18n) {
               errors.push(`${bfat}: private fields are not supported inside blocks`);
             if (blockField.showIf)
               errors.push(`${bfat}: showIf is not supported inside blocks`);
+            if (blockField.mobile)
+              errors.push(`${bfat}: mobile is not supported inside blocks`);
             if (blockField.type === "select" && !blockField.options?.length) {
               errors.push(`${bfat}: select requires a non-empty options array`);
             }
@@ -885,6 +894,8 @@ function resolveDatabaseOptions(database) {
   }
   return { ...shared, driver: "sqlite", path: database?.path ?? "data/cms.db" };
 }
+const DEFAULT_FILESYSTEM_MEDIA_DIR = "data/media";
+const DEFAULT_FILESYSTEM_MEDIA_BASE_URL = "/media";
 function resolveMediaOptions(media) {
   if (media?.storage === "local") {
     return {
@@ -896,7 +907,22 @@ function resolveMediaOptions(media) {
       secretAccessKey: "",
       presignExpiry: 600,
       maxFileSize: DEFAULT_MEDIA_MAX_FILE_SIZE,
-      publicBaseUrl: media.publicBaseUrl
+      publicBaseUrl: media.publicBaseUrl,
+      dir: ""
+    };
+  }
+  if (media?.storage === "filesystem") {
+    return {
+      storage: "filesystem",
+      endpoint: "",
+      region: "auto",
+      bucket: "",
+      accessKeyId: "",
+      secretAccessKey: "",
+      presignExpiry: 600,
+      maxFileSize: media.maxFileSize ?? DEFAULT_MEDIA_MAX_FILE_SIZE,
+      publicBaseUrl: media.publicBaseUrl || DEFAULT_FILESYSTEM_MEDIA_BASE_URL,
+      dir: media.dir || DEFAULT_FILESYSTEM_MEDIA_DIR
     };
   }
   return {
@@ -908,7 +934,8 @@ function resolveMediaOptions(media) {
     secretAccessKey: media?.secretAccessKey ?? "",
     presignExpiry: media?.presignExpiry ?? 600,
     maxFileSize: media?.maxFileSize ?? DEFAULT_MEDIA_MAX_FILE_SIZE,
-    publicBaseUrl: media?.publicBaseUrl ?? ""
+    publicBaseUrl: media?.publicBaseUrl ?? "",
+    dir: ""
   };
 }
 function resolveModuleOptions(options) {
@@ -948,7 +975,7 @@ async function loadCmsConfig(nuxt, resolver, configPathOption, i18n, logger) {
       moduleCache: false,
       alias: { "#nuxt-cms": resolver.resolve("./runtime/shared/index") }
     });
-    cmsConfig = await jiti.import(configPath, { default: true });
+    cmsConfig = expandMobileMedia(await jiti.import(configPath, { default: true }));
   } else {
     logger.warn(
       `[nuxt-cms] Config file not found: ${configPath}. Using an empty registry \u2014 create a ${configPathOption}.ts with defineCmsConfig().`
@@ -966,27 +993,28 @@ async function loadCmsConfig(nuxt, resolver, configPathOption, i18n, logger) {
     entry.pages = resolvePageRoutes(entry, discoveredRoutes);
     routesByEntry[name] = entry.pages;
   }
-  if (Object.keys(routesByEntry).length) {
-    const source = (nuxt.options.alias["#cms-config"] ?? "").replace(/\\/g, "/").replace(/\.[cm]?[jt]s$/, "");
-    const wrapper = addTemplate({
-      filename: "cms/config.ts",
-      write: true,
-      getContents: () => [
-        `import config from '${source}'`,
-        ``,
-        `const pageRoutes = ${JSON.stringify(routesByEntry, null, 3)}`,
-        ``,
-        `for (const [name, routes] of Object.entries(pageRoutes)) {`,
-        `   const entry = Object(config)[name]`,
-        `   if (entry) entry.pages = routes`,
-        `}`,
-        ``,
-        `export default config`,
-        ``
-      ].join("\n")
-    });
-    nuxt.options.alias["#cms-config"] = wrapper.dst;
-  }
+  const source = (nuxt.options.alias["#cms-config"] ?? "").replace(/\\/g, "/").replace(/\.[cm]?[jt]s$/, "");
+  const wrapper = addTemplate({
+    filename: "cms/config.ts",
+    write: true,
+    getContents: () => [
+      `import { expandMobileMedia } from '#nuxt-cms'`,
+      `import config from '${source}'`,
+      ``,
+      `const pageRoutes = ${JSON.stringify(routesByEntry, null, 3)}`,
+      ``,
+      `expandMobileMedia(config)`,
+      ``,
+      `for (const [name, routes] of Object.entries(pageRoutes)) {`,
+      `   const entry = Object(config)[name]`,
+      `   if (entry) entry.pages = routes`,
+      `}`,
+      ``,
+      `export default config`,
+      ``
+    ].join("\n")
+  });
+  nuxt.options.alias["#cms-config"] = wrapper.dst;
   const configErrors = validateConfig(cmsConfig, i18n);
   if (configErrors.length) {
     for (const error of configErrors) logger.error(error);
@@ -1297,6 +1325,18 @@ const module$1 = defineNuxtModule({
           logger.error(`[nuxt-cms] drizzle-kit generate failed (exit code ${code})`);
       });
     }
+    const mediaFilesystemBase = resolved.media.storage === "filesystem" ? `/${resolved.media.publicBaseUrl.split("/").filter(Boolean).join("/")}` : "";
+    if (resolved.media.storage === "filesystem" && !resolved.media.publicBaseUrl.startsWith("/")) {
+      throw new Error(
+        `[nuxt-cms] media.storage is 'filesystem' but media.publicBaseUrl (${resolved.media.publicBaseUrl || "empty"}) is not a root-relative path. Set it to something like '/media': the module serves the uploaded files there.`
+      );
+    }
+    if (mediaFilesystemBase === "/" || mediaFilesystemBase.startsWith("/api/")) {
+      throw new Error(
+        `[nuxt-cms] media.publicBaseUrl (${resolved.media.publicBaseUrl}) cannot serve the uploaded files: pick a dedicated path such as '/media'.`
+      );
+    }
+    const mediaDir = resolved.media.storage === "filesystem" ? isAbsolute(resolved.media.dir) ? resolved.media.dir : resolve(nuxt.options.rootDir, resolved.media.dir) : "";
     const existingConfig = nuxt.options.runtimeConfig.cms ?? {};
     nuxt.options.runtimeConfig.cms = {
       adminEmail: resolved.admin.email,
@@ -1324,6 +1364,7 @@ const module$1 = defineNuxtModule({
         accessKeyId: resolved.media.accessKeyId,
         secretAccessKey: resolved.media.secretAccessKey,
         localRoot: mediaLocalRoot,
+        dir: mediaDir,
         ...existingConfig.media ?? {}
       }
     };
@@ -1454,6 +1495,17 @@ const module$1 = defineNuxtModule({
       method: "delete",
       handler: resolver.resolve("./runtime/server/api/media-folder.delete")
     });
+    if (mediaFilesystemBase) {
+      addServerHandler({
+        route: "/api/cms/admin/media/upload",
+        method: "put",
+        handler: resolver.resolve("./runtime/server/api/media-upload.put")
+      });
+      addServerHandler({
+        route: `${mediaFilesystemBase}/**`,
+        handler: resolver.resolve("./runtime/server/routes/media-file")
+      });
+    }
     const api = "/api/cms/admin/:collection";
     addServerHandler({
       route: api,

package/dist/runtime/server/api/media-folder.delete.js

@@ -4,7 +4,7 @@ import { z } from "zod";
 import { useDb } from "#cms-db";
 import { cms_media } from "#cms-tables";
 import { isMediaFolderMarker, normalizeMediaFolder } from "../../shared/index.js";
-import { encodeKey, useMediaStorage } from "../utils/media.js";
+import { useMediaStorage } from "../utils/media.js";
 import { requireAdmin } from "../utils/require-admin.js";
 const querySchema = z.object({
   name: z.string().min(1).max(255),
@@ -12,7 +12,7 @@ const querySchema = z.object({
 });
 export default defineEventHandler(async (event) => {
   await requireAdmin(event);
-  const { client, bucketUrl } = useMediaStorage(event);
+  const { store } = useMediaStorage(event);
   const { name, recursive } = await getValidatedQuery(event, querySchema.parse);
   const folder = normalizeMediaFolder(name);
   if (!folder) {
@@ -28,13 +28,7 @@ export default defineEventHandler(async (event) => {
     });
   }
   for (const row of rows) {
-    const res = await client.fetch(`${bucketUrl}/${encodeKey(row.key)}`, { method: "DELETE" });
-    if (!res.ok && res.status !== 404) {
-      throw createError({
-        statusCode: 502,
-        statusMessage: `Bucket delete failed (${res.status})`
-      });
-    }
+    await store.remove(row.key);
   }
   if (rows.length) {
     await db.delete(cms_media).where(

package/dist/runtime/server/api/media-folder.post.js

@@ -3,26 +3,19 @@ import { z } from "zod";
 import { useDb } from "#cms-db";
 import { cms_media } from "#cms-tables";
 import { mediaFolderMarkerKey, normalizeMediaFolder } from "../../shared/index.js";
-import { encodeKey, useMediaStorage } from "../utils/media.js";
+import { useMediaStorage } from "../utils/media.js";
 import { requireAdmin } from "../utils/require-admin.js";
 const bodySchema = z.object({ name: z.string().min(1).max(255) });
 export default defineEventHandler(async (event) => {
   await requireAdmin(event);
-  const { client, bucketUrl } = useMediaStorage(event);
+  const { store } = useMediaStorage(event);
   const { name } = await readValidatedBody(event, bodySchema.parse);
   const folder = normalizeMediaFolder(name);
   if (!folder) {
     throw createError({ statusCode: 400, statusMessage: "Invalid folder name" });
   }
   const key = mediaFolderMarkerKey(folder);
-  const res = await client.fetch(`${bucketUrl}/${encodeKey(key)}`, {
-    method: "PUT",
-    body: new Uint8Array(),
-    headers: { "content-type": "application/x-empty", "content-length": "0" }
-  });
-  if (!res.ok) {
-    throw createError({ statusCode: 502, statusMessage: `Bucket write failed (${res.status})` });
-  }
+  await store.write(key, new Uint8Array(), "application/x-empty");
   const values = {
     key,
     mime: "application/x-empty",

package/dist/runtime/server/api/media-presign.post.d.ts

@@ -3,9 +3,7 @@ declare const _default: import("h3").EventHandler<import("h3").EventHandlerReque
     folder: string | null;
     uploadUrl: string;
     method: string;
-    headers: {
-        'content-type': string;
-    };
+    headers: Record<string, string>;
     publicUrl: string | null;
     expiresIn: number;
 }>>;

package/dist/runtime/server/api/media-presign.post.js

@@ -20,7 +20,7 @@ function slugifyFilename(filename) {
 }
 export default defineEventHandler(async (event) => {
   await requireAdmin(event);
-  const { media, client, bucketUrl, publicUrl } = useMediaStorage(event);
+  const { media, store, publicUrl } = useMediaStorage(event);
   const { filename, contentType, size, folder } = await readValidatedBody(event, bodySchema.parse);
   assertUploadContentType(contentType);
   assertUploadSize(size, media.maxFileSize);
@@ -28,21 +28,13 @@ export default defineEventHandler(async (event) => {
   const normalizedFolder = normalizeMediaFolder(folder);
   const prefix = normalizedFolder ?? `${now.getUTCFullYear()}/${String(now.getUTCMonth() + 1).padStart(2, "0")}`;
   const key = `${prefix}/${randomUUID()}-${slugifyFilename(filename)}`;
-  const url = new URL(`${bucketUrl}/${key}`);
-  url.searchParams.set("X-Amz-Expires", String(media.presignExpiry));
-  const signed = await client.sign(
-    new Request(url, {
-      method: "PUT",
-      headers: { "content-type": contentType, "content-length": String(size) }
-    }),
-    { aws: { signQuery: true, allHeaders: true } }
-  );
+  const target = await store.uploadTarget(key, contentType, size);
   return {
     key,
     folder: normalizedFolder,
-    uploadUrl: signed.url,
+    uploadUrl: target.url,
     method: "PUT",
-    headers: { "content-type": contentType },
+    headers: target.headers,
     publicUrl: publicUrl(key),
     expiresIn: media.presignExpiry
   };

package/dist/runtime/server/api/media-upload.put.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<void>>;
+export default _default;

package/dist/runtime/server/api/media-upload.put.js

@@ -0,0 +1,42 @@
+import { existsSync } from "node:fs";
+import {
+  createError,
+  defineEventHandler,
+  getRequestHeader,
+  getRequestWebStream,
+  getValidatedQuery,
+  sendNoContent
+} from "h3";
+import { z } from "zod";
+import { isMediaFolderMarker } from "../../shared/index.js";
+import { objectKeySchema } from "../../shared/validation.js";
+import { requireMediaFilePath, writeMediaFile } from "../utils/media-fs.js";
+import { assertUploadContentType, assertUploadSize, useMediaStorage } from "../utils/media.js";
+import { requireAdmin } from "../utils/require-admin.js";
+const querySchema = z.object({ key: objectKeySchema });
+export default defineEventHandler(async (event) => {
+  await requireAdmin(event);
+  const { media } = useMediaStorage(event);
+  if (media.storage !== "filesystem") {
+    throw createError({
+      statusCode: 501,
+      statusMessage: "Direct uploads are only available with filesystem media storage"
+    });
+  }
+  const { key } = await getValidatedQuery(event, querySchema.parse);
+  if (isMediaFolderMarker(key)) {
+    throw createError({ statusCode: 400, statusMessage: "Invalid object key" });
+  }
+  assertUploadContentType(getRequestHeader(event, "content-type") ?? "");
+  const declaredSize = Number(getRequestHeader(event, "content-length"));
+  if (Number.isFinite(declaredSize)) assertUploadSize(declaredSize, media.maxFileSize);
+  if (existsSync(requireMediaFilePath(media.dir, key))) {
+    throw createError({ statusCode: 409, statusMessage: "A file with this key already exists" });
+  }
+  const body = getRequestWebStream(event);
+  if (!body) {
+    throw createError({ statusCode: 400, statusMessage: "Empty upload" });
+  }
+  await writeMediaFile(media.dir, key, body, media.maxFileSize);
+  return sendNoContent(event, 201);
+});

package/dist/runtime/server/api/media.delete.js

@@ -4,22 +4,19 @@ import { z } from "zod";
 import { useDb } from "#cms-db";
 import { cms_media } from "#cms-tables";
 import { objectKeySchema } from "../../shared/validation.js";
-import { encodeKey, useMediaStorage } from "../utils/media.js";
+import { useMediaStorage } from "../utils/media.js";
 import { requireAdmin } from "../utils/require-admin.js";
 const querySchema = z.object({ key: objectKeySchema });
 export default defineEventHandler(async (event) => {
   await requireAdmin(event);
-  const { client, bucketUrl } = useMediaStorage(event);
+  const { store } = useMediaStorage(event);
   const { key } = await getValidatedQuery(event, querySchema.parse);
   const db = useDb();
   const [row] = await db.select().from(cms_media).where(eq(cms_media.key, key)).limit(1);
   if (!row) {
     throw createError({ statusCode: 404, statusMessage: "Media not found" });
   }
-  const res = await client.fetch(`${bucketUrl}/${encodeKey(key)}`, { method: "DELETE" });
-  if (!res.ok && res.status !== 404) {
-    throw createError({ statusCode: 502, statusMessage: `Bucket delete failed (${res.status})` });
-  }
+  await store.remove(key);
   await db.delete(cms_media).where(eq(cms_media.key, key));
   return { ok: true };
 });

package/dist/runtime/server/api/media.post.js

@@ -1,9 +1,11 @@
-import { defineEventHandler, readValidatedBody } from "h3";
+import { existsSync } from "node:fs";
+import { createError, defineEventHandler, readValidatedBody } from "h3";
 import { z } from "zod";
 import { useDb } from "#cms-db";
 import { cms_media } from "#cms-tables";
 import { normalizeMediaFolder } from "../../shared/index.js";
 import { objectKeySchema } from "../../shared/validation.js";
+import { requireMediaFilePath } from "../utils/media-fs.js";
 import {
   assertMediaWritable,
   assertUploadContentType,
@@ -26,6 +28,9 @@ export default defineEventHandler(async (event) => {
   assertMediaWritable(media);
   const body = await readValidatedBody(event, bodySchema.parse);
   if (body.mime) assertUploadContentType(body.mime);
+  if (media.storage === "filesystem" && !existsSync(requireMediaFilePath(media.dir, body.key))) {
+    throw createError({ statusCode: 400, statusMessage: "The uploaded file was not found" });
+  }
   const values = {
     key: body.key,
     mime: body.mime ?? null,

package/dist/runtime/server/routes/media-file.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<void | null>>;
+export default _default;

package/dist/runtime/server/routes/media-file.js

@@ -0,0 +1,81 @@
+import { createReadStream } from "node:fs";
+import { stat } from "node:fs/promises";
+import { eq } from "drizzle-orm";
+import {
+  createError,
+  defineEventHandler,
+  getRequestHeader,
+  getRouterParam,
+  sendStream,
+  setResponseHeaders,
+  setResponseStatus
+} from "h3";
+import { useDb } from "#cms-db";
+import { cms_media } from "#cms-tables";
+import { useRuntimeConfig } from "#imports";
+import { isMediaFolderMarker } from "../../shared/index.js";
+import { mediaFilePath, parseByteRange } from "../utils/media-fs.js";
+import { isAllowedUploadType } from "../utils/media.js";
+import { mediaMimeForKey } from "../utils/media-sync.js";
+const IMMUTABLE = "public, max-age=31536000, immutable";
+function notFound() {
+  throw createError({ statusCode: 404, statusMessage: "Not found" });
+}
+function endWithoutBody(event) {
+  event.node.res.end();
+}
+async function mimeFor(key) {
+  const [row] = await useDb().select({ mime: cms_media.mime }).from(cms_media).where(eq(cms_media.key, key)).limit(1);
+  const mime = row?.mime || mediaMimeForKey(key);
+  return mime && isAllowedUploadType(mime) ? mime : null;
+}
+export default defineEventHandler(async (event) => {
+  if (event.method !== "GET" && event.method !== "HEAD") {
+    throw createError({ statusCode: 405, statusMessage: "Method not allowed" });
+  }
+  const { dir } = useRuntimeConfig(event).cms.media;
+  const raw = getRouterParam(event, "_") ?? "";
+  let key;
+  try {
+    key = decodeURIComponent(raw);
+  } catch {
+    notFound();
+  }
+  if (isMediaFolderMarker(key)) notFound();
+  const path = mediaFilePath(dir, key);
+  if (!path) notFound();
+  const info = await stat(path).catch(() => null);
+  if (!info?.isFile()) notFound();
+  const mime = await mimeFor(key);
+  const etag = `"${info.size.toString(16)}-${Math.floor(info.mtimeMs).toString(16)}"`;
+  setResponseHeaders(event, {
+    "content-type": mime ?? "application/octet-stream",
+    ...mime ? {} : { "content-disposition": "attachment" },
+    "cache-control": IMMUTABLE,
+    "last-modified": info.mtime.toUTCString(),
+    etag,
+    "accept-ranges": "bytes",
+    "x-content-type-options": "nosniff"
+  });
+  if (getRequestHeader(event, "if-none-match") === etag) {
+    setResponseStatus(event, 304);
+    return null;
+  }
+  const range = parseByteRange(getRequestHeader(event, "range"), info.size);
+  if (range === "unsatisfiable") {
+    setResponseHeaders(event, { "content-range": `bytes */${info.size}` });
+    throw createError({ statusCode: 416, statusMessage: "Range not satisfiable" });
+  }
+  if (range) {
+    setResponseStatus(event, 206);
+    setResponseHeaders(event, {
+      "content-range": `bytes ${range.start}-${range.end}/${info.size}`,
+      "content-length": range.end - range.start + 1
+    });
+    if (event.method === "HEAD") return endWithoutBody(event);
+    return sendStream(event, createReadStream(path, { start: range.start, end: range.end }));
+  }
+  setResponseHeaders(event, { "content-length": info.size });
+  if (event.method === "HEAD") return endWithoutBody(event);
+  return sendStream(event, createReadStream(path));
+});

package/dist/runtime/server/utils/media-fs.d.ts

@@ -0,0 +1,9 @@
+export declare function mediaFilePath(dir: string, key: string): string | null;
+export declare function requireMediaFilePath(dir: string, key: string): string;
+export type ByteRange = {
+    start: number;
+    end: number;
+} | 'unsatisfiable' | null;
+export declare function parseByteRange(header: string | undefined, size: number): ByteRange;
+export declare function writeMediaFile(dir: string, key: string, body: ReadableStream<Uint8Array> | Uint8Array, maxBytes: number): Promise<void>;
+export declare function removeMediaFile(dir: string, key: string): Promise<void>;

package/dist/runtime/server/utils/media-fs.js

@@ -0,0 +1,89 @@
+import { randomUUID } from "node:crypto";
+import { createWriteStream } from "node:fs";
+import { mkdir, rename, rm, rmdir, unlink } from "node:fs/promises";
+import { dirname, isAbsolute, relative, resolve, sep } from "node:path";
+import { Readable, Transform } from "node:stream";
+import { pipeline } from "node:stream/promises";
+import { createError } from "h3";
+import { formatFileSize } from "../../shared/index.js";
+export function mediaFilePath(dir, key) {
+  if (!dir || !key || key.startsWith("/") || /[\0\\]/.test(key)) return null;
+  const root = resolve(dir);
+  const target = resolve(root, ...key.split("/"));
+  const rel = relative(root, target);
+  if (!rel || rel.startsWith("..") || isAbsolute(rel)) return null;
+  return target;
+}
+export function requireMediaFilePath(dir, key) {
+  const path = mediaFilePath(dir, key);
+  if (!path) {
+    throw createError({ statusCode: 400, statusMessage: "Invalid object key" });
+  }
+  return path;
+}
+export function parseByteRange(header, size) {
+  if (!header) return null;
+  const match = /^bytes=(\d*)-(\d*)$/.exec(header.trim());
+  if (!match || !match[1] && !match[2]) return null;
+  if (size === 0) return "unsatisfiable";
+  if (!match[1]) {
+    const suffix = Number(match[2]);
+    if (suffix === 0) return "unsatisfiable";
+    return { start: Math.max(0, size - suffix), end: size - 1 };
+  }
+  const start = Number(match[1]);
+  const end = match[2] ? Math.min(Number(match[2]), size - 1) : size - 1;
+  if (start >= size || end < start) return "unsatisfiable";
+  return { start, end };
+}
+function sizeLimit(maxBytes) {
+  let received = 0;
+  return new Transform({
+    transform(chunk, _encoding, callback) {
+      received += chunk.length;
+      if (received > maxBytes) {
+        callback(
+          createError({
+            statusCode: 413,
+            statusMessage: `File exceeds the maximum size of ${formatFileSize(maxBytes)}`
+          })
+        );
+        return;
+      }
+      callback(null, chunk);
+    }
+  });
+}
+export async function writeMediaFile(dir, key, body, maxBytes) {
+  const target = requireMediaFilePath(dir, key);
+  await mkdir(dirname(target), { recursive: true });
+  const temp = `${target}.${randomUUID()}.upload`;
+  const source = body instanceof Uint8Array ? Readable.from([Buffer.from(body)]) : Readable.fromWeb(body);
+  try {
+    await pipeline(source, sizeLimit(maxBytes), createWriteStream(temp, { flags: "wx" }));
+    await rename(temp, target);
+  } catch (error) {
+    await rm(temp, { force: true });
+    throw error;
+  }
+}
+export async function removeMediaFile(dir, key) {
+  const target = requireMediaFilePath(dir, key);
+  try {
+    await unlink(target);
+  } catch (error) {
+    if (error.code !== "ENOENT") throw error;
+  }
+  await pruneEmptyDirectories(resolve(dir), dirname(target));
+}
+async function pruneEmptyDirectories(root, from) {
+  let current = from;
+  while (current !== root && current.startsWith(`${root}${sep}`)) {
+    try {
+      await rmdir(current);
+    } catch {
+      return;
+    }
+    current = dirname(current);
+  }
+}

package/dist/runtime/server/utils/media.d.ts

@@ -1,5 +1,4 @@
 import type { H3Event } from 'h3';
-import { AwsClient } from 'aws4fetch';
 import type { MediaItem, MediaStorageMode } from '../../shared/index.js';
 interface MediaConfig {
     storage: MediaStorageMode;
@@ -10,7 +9,18 @@ interface MediaConfig {
     maxFileSize: number;
     accessKeyId: string;
     secretAccessKey: string;
+    dir?: string;
 }
+export interface MediaUploadTarget {
+    url: string;
+    headers: Record<string, string>;
+}
+export interface MediaStore {
+    uploadTarget: (key: string, contentType: string, size: number) => Promise<MediaUploadTarget>;
+    write: (key: string, body: Uint8Array<ArrayBuffer>, contentType: string) => Promise<void>;
+    remove: (key: string) => Promise<void>;
+}
+export declare function isAllowedUploadType(contentType: string): boolean;
 export declare function assertUploadContentType(contentType: string): void;
 export declare function assertUploadSize(size: number, maxFileSize: number): void;
 export declare function encodeKey(key: string): string;
@@ -20,10 +30,10 @@ export declare function useMediaConfig(event: H3Event): {
     media: MediaConfig;
     publicUrl: (key: string) => string | null;
 };
+export declare function mediaUploadPath(key: string): string;
 export declare function useMediaStorage(event: H3Event): {
     media: MediaConfig;
-    client: AwsClient;
-    bucketUrl: string;
+    store: MediaStore;
     publicUrl: (key: string) => string | null;
 };
 export declare function toMediaItem(row: Omit<MediaItem, 'type' | 'url'>, publicUrl: (key: string) => string | null): MediaItem;

package/dist/runtime/server/utils/media.js

@@ -2,6 +2,7 @@ import { AwsClient } from "aws4fetch";
 import { createError } from "h3";
 import { useRuntimeConfig } from "#imports";
 import { formatFileSize, mediaPublicUrl, mediaTypeFor } from "../../shared/index.js";
+import { removeMediaFile, writeMediaFile } from "./media-fs.js";
 const UPLOAD_TYPE_PREFIXES = ["image/", "video/", "audio/", "font/"];
 const UPLOAD_TYPE_BLOCKLIST = /* @__PURE__ */ new Set(["image/svg+xml"]);
 const UPLOAD_TYPES = /* @__PURE__ */ new Set([
@@ -19,10 +20,12 @@ const UPLOAD_TYPES = /* @__PURE__ */ new Set([
   "application/vnd.ms-powerpoint",
   "application/vnd.openxmlformats-officedocument.presentationml.presentation"
 ]);
-export function assertUploadContentType(contentType) {
+export function isAllowedUploadType(contentType) {
   const type = contentType.toLowerCase();
-  const allowed = !UPLOAD_TYPE_BLOCKLIST.has(type) && (UPLOAD_TYPES.has(type) || UPLOAD_TYPE_PREFIXES.some((prefix) => type.startsWith(prefix)));
-  if (!allowed) {
+  return !UPLOAD_TYPE_BLOCKLIST.has(type) && (UPLOAD_TYPES.has(type) || UPLOAD_TYPE_PREFIXES.some((prefix) => type.startsWith(prefix)));
+}
+export function assertUploadContentType(contentType) {
+  if (!isAllowedUploadType(contentType)) {
     throw createError({
       statusCode: 415,
       statusMessage: `Unsupported content type: ${contentType}`
@@ -41,6 +44,15 @@ export function encodeKey(key) {
   return key.split("/").map(encodeURIComponent).join("/");
 }
 export function assertMediaConfigured(media) {
+  if (media.storage === "filesystem") {
+    if (!media.dir) {
+      throw createError({
+        statusCode: 501,
+        statusMessage: "Media storage is not configured (cms.media.dir in nuxt.config)"
+      });
+    }
+    return;
+  }
   if (media.storage !== "s3") return;
   if (!media.endpoint || !media.bucket || !media.accessKeyId || !media.secretAccessKey) {
     throw createError({
@@ -65,9 +77,20 @@ export function useMediaConfig(event) {
   const publicUrl = (key) => mediaPublicUrl(mediaBaseUrl, key);
   return { media, publicUrl };
 }
-export function useMediaStorage(event) {
-  const { media, publicUrl } = useMediaConfig(event);
-  assertMediaWritable(media);
+export function mediaUploadPath(key) {
+  return `/api/cms/admin/media/upload?key=${encodeURIComponent(key)}`;
+}
+function filesystemStore(dir) {
+  return {
+    uploadTarget: async (key, contentType) => ({
+      url: mediaUploadPath(key),
+      headers: { "content-type": contentType }
+    }),
+    write: (key, body) => writeMediaFile(dir, key, body, Math.max(body.byteLength, 1)),
+    remove: (key) => removeMediaFile(dir, key)
+  };
+}
+function s3Store(media) {
   const client = new AwsClient({
     accessKeyId: media.accessKeyId,
     secretAccessKey: media.secretAccessKey,
@@ -75,7 +98,48 @@ export function useMediaStorage(event) {
     service: "s3"
   });
   const bucketUrl = `${media.endpoint.replace(/\/+$/, "")}/${media.bucket}`;
-  return { media, client, bucketUrl, publicUrl };
+  return {
+    async uploadTarget(key, contentType, size) {
+      const url = new URL(`${bucketUrl}/${key}`);
+      url.searchParams.set("X-Amz-Expires", String(media.presignExpiry));
+      const signed = await client.sign(
+        new Request(url, {
+          method: "PUT",
+          headers: { "content-type": contentType, "content-length": String(size) }
+        }),
+        { aws: { signQuery: true, allHeaders: true } }
+      );
+      return { url: signed.url, headers: { "content-type": contentType } };
+    },
+    async write(key, body, contentType) {
+      const res = await client.fetch(`${bucketUrl}/${encodeKey(key)}`, {
+        method: "PUT",
+        body,
+        headers: { "content-type": contentType, "content-length": String(body.byteLength) }
+      });
+      if (!res.ok) {
+        throw createError({
+          statusCode: 502,
+          statusMessage: `Bucket write failed (${res.status})`
+        });
+      }
+    },
+    async remove(key) {
+      const res = await client.fetch(`${bucketUrl}/${encodeKey(key)}`, { method: "DELETE" });
+      if (!res.ok && res.status !== 404) {
+        throw createError({
+          statusCode: 502,
+          statusMessage: `Bucket delete failed (${res.status})`
+        });
+      }
+    }
+  };
+}
+export function useMediaStorage(event) {
+  const { media, publicUrl } = useMediaConfig(event);
+  assertMediaWritable(media);
+  const store = media.storage === "filesystem" ? filesystemStore(media.dir) : s3Store(media);
+  return { media, store, publicUrl };
 }
 export function toMediaItem(row, publicUrl) {
   return {

package/dist/runtime/shared/index.d.ts

@@ -6,7 +6,7 @@ export interface CmsI18n {
     locales: string[];
     defaultLocale: string;
 }
-export type MediaStorageMode = 's3' | 'local';
+export type MediaStorageMode = 's3' | 'local' | 'filesystem';
 export declare const MEDIA_TYPES: readonly ["image", "video", "file"];
 export type MediaType = (typeof MEDIA_TYPES)[number];
 export declare function mediaTypeForKey(key: string): MediaType;
@@ -72,6 +72,8 @@ export interface FieldConfig {
     blocks?: Record<string, BlockConfig>;
     mediaType?: MediaType | MediaType[];
     accept?: string[];
+    mobile?: boolean;
+    mobileOf?: string;
     to?: string;
     cardinality?: 'many-to-one' | 'one-to-one' | 'many-to-many';
     onDelete?: 'set null' | 'cascade' | 'restrict';
@@ -121,6 +123,9 @@ export interface CmsEntry {
     tabs?: CmsTab[];
     table?: CmsTable;
 }
+export declare const MOBILE_MEDIA_SUFFIX = "Mobile";
+export declare function mobileMediaKey(key: string): string;
+export declare function expandMobileMedia<T extends Record<string, unknown>>(config: T): T;
 export declare function entryTabs(entry: Pick<CmsEntry, 'tabs'>): CmsTab[];
 export declare function fieldTab(field: FieldConfig, tabs: CmsTab[]): string | undefined;
 export declare function fieldsByTab(fields: Record<string, FieldConfig>, tabs: CmsTab[]): Record<string, Record<string, FieldConfig>>;
@@ -191,6 +196,7 @@ export interface MediaFieldInput extends FieldInputBase {
     mediaType?: MediaType | MediaType[];
     accept?: string[];
     translatable?: boolean;
+    mobile?: boolean;
 }
 export interface RelationFieldInput extends FieldInputBase {
     type: 'relation';
@@ -199,7 +205,7 @@ export interface RelationFieldInput extends FieldInputBase {
     onDelete?: 'set null' | 'cascade' | 'restrict';
 }
 type BlockField<T> = Omit<T, 'private' | 'showIf' | 'tab'>;
-export type BlockFieldInput = BlockField<TextFieldInput> | BlockField<RichtextFieldInput> | BlockField<NumberFieldInput> | BlockField<BooleanFieldInput> | BlockField<DateFieldInput> | BlockField<EmailFieldInput> | BlockField<SelectFieldInput> | BlockField<JsonFieldInput> | BlockField<MediaFieldInput>;
+export type BlockFieldInput = BlockField<TextFieldInput> | BlockField<RichtextFieldInput> | BlockField<NumberFieldInput> | BlockField<BooleanFieldInput> | BlockField<DateFieldInput> | BlockField<EmailFieldInput> | BlockField<SelectFieldInput> | BlockField<JsonFieldInput> | Omit<BlockField<MediaFieldInput>, 'mobile'>;
 export interface BlockInput {
     label: string;
     fields: Record<string, BlockFieldInput>;

package/dist/runtime/shared/index.js

@@ -192,6 +192,58 @@ export function localizeBlocks(field, value, locale, defaultLocale) {
   return value.map((item) => localizeBlock(field, item, locale, defaultLocale));
 }
 export const CMS_GRAPHQL_BATCH_LIMIT = 20;
+export const MOBILE_MEDIA_SUFFIX = "Mobile";
+export function mobileMediaKey(key) {
+  return `${key}${MOBILE_MEDIA_SUFFIX}`;
+}
+function mobileMediaField(key, field) {
+  const { mobile: _mobile, required: _required, ...rest } = field;
+  return {
+    ...rest,
+    label: `${field.label} (mobile)`,
+    mobileOf: key
+  };
+}
+function withMobileMedia(fields, removed = () => false) {
+  const expanded = {};
+  for (const [key, field] of Object.entries(fields)) {
+    if (field?.mobileOf && Object.hasOwn(fields, field.mobileOf)) continue;
+    expanded[key] = field;
+    const mobileKey = mobileMediaKey(key);
+    if (field?.mobile && field.type === "media" && !Object.hasOwn(fields, mobileKey)) {
+      expanded[mobileKey] = mobileMediaField(key, field);
+    } else if (field?.mobile && fields[mobileKey]?.mobileOf === key) {
+      expanded[mobileKey] = fields[mobileKey];
+    } else if (!field && removed(key) && !Object.hasOwn(fields, mobileKey)) {
+      expanded[mobileKey] = null;
+    }
+  }
+  return expanded;
+}
+export function expandMobileMedia(config) {
+  for (const entry of Object.values(config)) {
+    if (!entry?.fields) continue;
+    const shared = entry.fields;
+    const hasMobile = (key) => !!shared[key]?.mobile && shared[key]?.type === "media";
+    entry.fields = withMobileMedia(shared);
+    if (entry.overrides) {
+      entry.overrides = Object.fromEntries(
+        Object.entries(entry.overrides).map(([path, override]) => [
+          path,
+          withMobileMedia(override, hasMobile)
+        ])
+      );
+    }
+    if (entry.columns) {
+      entry.columns = [
+        ...new Set(
+          entry.columns.flatMap((key) => hasMobile(key) ? [key, mobileMediaKey(key)] : [key])
+        )
+      ];
+    }
+  }
+  return config;
+}
 export function entryTabs(entry) {
   return entry.tabs?.length ? entry.tabs : [];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xleddyl/nuxt-cms",
-  "version": "0.1.58",
+  "version": "0.1.60",
   "description": "Lightweight CMS that ships with your Nuxt app: runs on the Nitro server, content types defined in code, /cms admin panel, GraphQL API, SQLite or Postgres. No external CMS needed!",
   "license": "MIT",
   "author": "Edoardo Alberti (https://github.com/xleddyl)",
@@ -121,6 +121,7 @@
     "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxt prepare playground",
     "db:studio": "drizzle-kit studio --config=playground/.nuxt/cms/drizzle.config.ts",
     "test": "vitest run",
+    "test:docker": "vitest run --config test/docker/vitest.config.ts",
     "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit",
     "format": "prettier --write \"**/*.{ts,tsx,js,jsx,md,html,json,sql,vue}\" --log-level error",
     "release": "sh -c 'changelogen --release --no-github ${1:+--$1} && git push origin main --follow-tags' --"