@rigel-cms/rigel 0.1.4-beta.1 → 1.0.0-rc.1

package/src/editor/lib/icons.ts

@@ -1,4 +1,14 @@
 export const ICONS = {
+  file: { viewBox: "0 0 256 256", d: "M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Z" },
+  fileAudio: { viewBox: "0 0 256 256", d: "M99.06,128.61a8,8,0,0,0-8.72,1.73L68.69,152H48a8,8,0,0,0-8,8v40a8,8,0,0,0,8,8H68.69l21.65,21.66A8,8,0,0,0,104,224V136A8,8,0,0,0,99.06,128.61ZM88,204.69,77.66,194.34A8,8,0,0,0,72,192H56V168H72a8,8,0,0,0,5.66-2.34L88,155.31ZM152,180a40.55,40.55,0,0,1-20,34.91A8,8,0,0,1,124,201.09a24.49,24.49,0,0,0,0-42.18A8,8,0,0,1,132,145.09,40.55,40.55,0,0,1,152,180Zm61.66-97.66-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40v80a8,8,0,0,0,16,0V40h88V88a8,8,0,0,0,8,8h48V216H168a8,8,0,0,0,0,16h32a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160Z" },
+  fileDoc: { viewBox: "0 0 256 256", d: "M52,144H36a8,8,0,0,0-8,8v56a8,8,0,0,0,8,8H52a36,36,0,0,0,0-72Zm0,56H44V160h8a20,20,0,0,1,0,40Zm169.53-4.91a8,8,0,0,1,.25,11.31A30.06,30.06,0,0,1,200,216c-17.65,0-32-16.15-32-36s14.35-36,32-36a30.06,30.06,0,0,1,21.78,9.6,8,8,0,0,1-11.56,11.06A14.24,14.24,0,0,0,200,160c-8.82,0-16,9-16,20s7.18,20,16,20a14.24,14.24,0,0,0,10.22-4.66A8,8,0,0,1,221.53,195.09ZM128,144c-17.65,0-32,16.15-32,36s14.35,36,32,36,32-16.15,32-36S145.65,144,128,144Zm0,56c-8.82,0-16-9-16-20s7.18-20,16-20,16,9,16,20S136.82,200,128,200ZM48,120a8,8,0,0,0,8-8V40h88V88a8,8,0,0,0,8,8h48v16a8,8,0,0,0,16,0V88a8,8,0,0,0-2.34-5.66l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40v72A8,8,0,0,0,48,120ZM160,51.31,188.69,80H160Z" },
+  filePdf: { viewBox: "0 0 256 256", d: "M224,152a8,8,0,0,1-8,8H192v16h16a8,8,0,0,1,0,16H192v16a8,8,0,0,1-16,0V152a8,8,0,0,1,8-8h32A8,8,0,0,1,224,152ZM92,172a28,28,0,0,1-28,28H56v8a8,8,0,0,1-16,0V152a8,8,0,0,1,8-8H64A28,28,0,0,1,92,172Zm-16,0a12,12,0,0,0-12-12H56v24h8A12,12,0,0,0,76,172Zm88,8a36,36,0,0,1-36,36H112a8,8,0,0,1-8-8V152a8,8,0,0,1,8-8h16A36,36,0,0,1,164,180Zm-16,0a20,20,0,0,0-20-20h-8v40h8A20,20,0,0,0,148,180ZM40,112V40A16,16,0,0,1,56,24h96a8,8,0,0,1,5.66,2.34l56,56A8,8,0,0,1,216,88v24a8,8,0,0,1-16,0V96H152a8,8,0,0,1-8-8V40H56v72a8,8,0,0,1-16,0ZM160,80h28.69L160,51.31Z" },
+  filePpt: { viewBox: "0 0 256 256", d: "M224,152a8,8,0,0,1-8,8H204v48a8,8,0,0,1-16,0V160H176a8,8,0,0,1,0-16h40A8,8,0,0,1,224,152ZM92,172a28,28,0,0,1-28,28H56v8a8,8,0,0,1-16,0V152a8,8,0,0,1,8-8H64A28,28,0,0,1,92,172Zm-16,0a12,12,0,0,0-12-12H56v24h8A12,12,0,0,0,76,172Zm84,0a28,28,0,0,1-28,28h-8v8a8,8,0,0,1-16,0V152a8,8,0,0,1,8-8h16A28,28,0,0,1,160,172Zm-16,0a12,12,0,0,0-12-12h-8v24h8A12,12,0,0,0,144,172ZM40,112V40A16,16,0,0,1,56,24h96a8,8,0,0,1,5.66,2.34l56,56A8,8,0,0,1,216,88v24a8,8,0,0,1-16,0V96H152a8,8,0,0,1-8-8V40H56v72a8,8,0,0,1-16,0ZM160,80h28.69L160,51.31Z" },
+  fileText: { viewBox: "0 0 256 256", d: "M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Zm-32-80a8,8,0,0,1-8,8H96a8,8,0,0,1,0-16h64A8,8,0,0,1,168,136Zm0,32a8,8,0,0,1-8,8H96a8,8,0,0,1,0-16h64A8,8,0,0,1,168,168Z" },
+  fileTxt: { viewBox: "0 0 256 256", d: "M48,120a8,8,0,0,0,8-8V40h88V88a8,8,0,0,0,8,8h48v16a8,8,0,0,0,16,0V88a8,8,0,0,0-2.34-5.66l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40v72A8,8,0,0,0,48,120ZM160,51.31,188.69,80H160Zm-5.49,105.34L137.83,180l16.68,23.35a8,8,0,0,1-13,9.3L128,193.76l-13.49,18.89a8,8,0,1,1-13-9.3L118.17,180l-16.68-23.35a8,8,0,1,1,13-9.3L128,166.24l13.49-18.89a8,8,0,0,1,13,9.3ZM92,152a8,8,0,0,1-8,8H72v48a8,8,0,0,1-16,0V160H44a8,8,0,0,1,0-16H84A8,8,0,0,1,92,152Zm128,0a8,8,0,0,1-8,8H200v48a8,8,0,0,1-16,0V160H172a8,8,0,0,1,0-16h40A8,8,0,0,1,220,152Z" },
+  fileVideo: { viewBox: "0 0 256 256", d: "M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40v72a8,8,0,0,0,16,0V40h88V88a8,8,0,0,0,8,8h48V216h-8a8,8,0,0,0,0,16h8a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM155.88,145a8,8,0,0,0-8.12.22l-19.95,12.46A16,16,0,0,0,112,144H48a16,16,0,0,0-16,16v48a16,16,0,0,0,16,16h64a16,16,0,0,0,15.81-13.68l19.95,12.46A8,8,0,0,0,160,216V152A8,8,0,0,0,155.88,145ZM112,208H48V160h64v48Zm32-6.43-16-10V176.43l16-10Z" },
+  fileXls: { viewBox: "0 0 256 256", d: "M156,208a8,8,0,0,1-8,8H120a8,8,0,0,1-8-8V152a8,8,0,0,1,16,0v48h20A8,8,0,0,1,156,208ZM92.65,145.49a8,8,0,0,0-11.16,1.86L68,166.24,54.51,147.35a8,8,0,1,0-13,9.3L58.17,180,41.49,203.35a8,8,0,0,0,13,9.3L68,193.76l13.49,18.89a8,8,0,0,0,13-9.3L77.83,180l16.68-23.35A8,8,0,0,0,92.65,145.49Zm98.94,25.82c-4-1.16-8.14-2.35-10.45-3.84-1.25-.82-1.23-1-1.12-1.9a4.54,4.54,0,0,1,2-3.67c4.6-3.12,15.34-1.72,19.82-.56a8,8,0,0,0,4.07-15.48c-2.11-.55-21-5.22-32.83,2.76a20.58,20.58,0,0,0-8.95,14.95c-2,15.88,13.65,20.41,23,23.11,12.06,3.49,13.12,4.92,12.78,7.59-.31,2.41-1.26,3.33-2.15,3.93-4.6,3.06-15.16,1.55-19.54.35A8,8,0,0,0,173.93,214a60.63,60.63,0,0,0,15.19,2c5.82,0,12.3-1,17.49-4.46a20.81,20.81,0,0,0,9.18-15.23C218,179,201.48,174.17,191.59,171.31ZM40,112V40A16,16,0,0,1,56,24h96a8,8,0,0,1,5.66,2.34l56,56A8,8,0,0,1,216,88v24a8,8,0,1,1-16,0V96H152a8,8,0,0,1-8-8V40H56v72a8,8,0,0,1-16,0ZM160,80h28.68L160,51.31Z" },
+  fileZip: { viewBox: "0 0 256 256", d: "M184,144H168a8,8,0,0,0-8,8v56a8,8,0,0,0,16,0v-8h8a28,28,0,0,0,0-56Zm0,40h-8V160h8a12,12,0,0,1,0,24Zm-48-32v56a8,8,0,0,1-16,0V152a8,8,0,0,1,16,0ZM96,208a8,8,0,0,1-8,8H56a8,8,0,0,1-7-12l25.16-44H56a8,8,0,0,1,0-16H88a8,8,0,0,1,7,12L69.79,200H88A8,8,0,0,1,96,208ZM213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40v72a8,8,0,0,0,16,0V40h88V88a8,8,0,0,0,8,8h48v16a8,8,0,0,0,16,0V88A8,8,0,0,0,213.66,82.34ZM160,80V51.31L188.69,80Z" },
   calendar: { viewBox: "0 0 256 256", d: "M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-96-88v64a8,8,0,0,1-16,0V132.94l-4.42,2.22a8,8,0,0,1-7.16-14.32l16-8A8,8,0,0,1,112,120Zm59.16,30.45L152,176h16a8,8,0,0,1,0,16H136a8,8,0,0,1-6.4-12.8l28.78-38.37A8,8,0,1,0,145.07,132a8,8,0,1,1-13.85-8A24,24,0,0,1,176,136,23.76,23.76,0,0,1,171.16,150.45Z" },
   textUnderline: { viewBox: "0 0 256 256", d: "M200,224a8,8,0,0,1-8,8H64a8,8,0,0,1,0-16H192A8,8,0,0,1,200,224Zm-72-24a64.07,64.07,0,0,0,64-64V56a8,8,0,0,0-16,0v80a48,48,0,0,1-96,0V56a8,8,0,0,0-16,0v80A64.07,64.07,0,0,0,128,200Z" },
   highlighter: { viewBox: "0 0 256 256", d: "M253.66,106.34a8,8,0,0,0-11.32,0L192,156.69,107.31,72l50.35-50.34a8,8,0,1,0-11.32-11.32L96,60.69A16,16,0,0,0,93.18,79.5L72,100.69a16,16,0,0,0,0,22.62L76.69,128,18.34,186.34a8,8,0,0,0,3.13,13.25l72,24A7.88,7.88,0,0,0,96,224a8,8,0,0,0,5.66-2.34L136,187.31l4.69,4.69a16,16,0,0,0,22.62,0l21.19-21.18A16,16,0,0,0,203.31,168l50.35-50.34A8,8,0,0,0,253.66,106.34ZM93.84,206.85l-55-18.35L88,139.31,124.69,176ZM152,180.69,83.31,112,104,91.31,172.69,160Z" },
@@ -100,6 +110,9 @@ export const ICONS = {
     viewBox: "0 0 256 256",
     d: "M226.76,69a8,8,0,0,0-12.84-2.88l-40.3,37.19-17.23-3.7-3.7-17.23,37.19-40.3A8,8,0,0,0,187,29.24,72,72,0,0,0,88,96,72.34,72.34,0,0,0,94,124.94L33.79,177c-.15.12-.29.26-.43.39a32,32,0,0,0,45.26,45.26c.13-.13.27-.28.39-.42L131.06,162A72,72,0,0,0,232,96,71.56,71.56,0,0,0,226.76,69ZM160,152a56.14,56.14,0,0,1-27.07-7,8,8,0,0,0-9.92,1.77L67.11,211.51a16,16,0,0,1-22.62-22.62L109.18,133a8,8,0,0,0,1.77-9.93,56,56,0,0,1,58.36-82.31l-31.2,33.81a8,8,0,0,0-1.94,7.1L141.83,108a8,8,0,0,0,6.14,6.14l26.35,5.66a8,8,0,0,0,7.1-1.94l33.81-31.2A56.06,56.06,0,0,1,160,152Z",
   },
+  filmStrip: { viewBox: "0 0 256 256", d: "M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40ZM40,88h80v80H40Zm96-16V56h32V72Zm-16,0H88V56h32Zm0,112v16H88V184Zm16,0h32v16H136Zm0-16V88h80v80Zm80-96H184V56h32ZM72,56V72H40V56ZM40,184H72v16H40Zm176,16H184V184h32v16Z" },
+  youtubeLogo: { viewBox: "0 0 256 256", d: "M164.44,121.34l-48-32A8,8,0,0,0,104,96v64a8,8,0,0,0,12.44,6.66l48-32a8,8,0,0,0,0-13.32ZM120,145.05V111l25.58,17ZM234.33,69.52a24,24,0,0,0-14.49-16.4C185.56,39.88,131,40,128,40s-57.56-.12-91.84,13.12a24,24,0,0,0-14.49,16.4C19.08,79.5,16,97.74,16,128s3.08,48.5,5.67,58.48a24,24,0,0,0,14.49,16.41C69,215.56,120.4,216,127.34,216h1.32c6.94,0,58.37-.44,91.18-13.11a24,24,0,0,0,14.49-16.41c2.59-10,5.67-28.22,5.67-58.48S236.92,79.5,234.33,69.52Zm-15.49,113a8,8,0,0,1-4.77,5.49c-31.65,12.22-85.48,12-86,12H128c-.54,0-54.33.2-86-12a8,8,0,0,1-4.77-5.49C34.8,173.39,32,156.57,32,128s2.8-45.39,5.16-54.47A8,8,0,0,1,41.93,68c30.52-11.79,81.66-12,85.85-12h.27c.54,0,54.38-.18,86,12a8,8,0,0,1,4.77,5.49C221.2,82.61,224,99.43,224,128S221.2,173.39,218.84,182.47Z" },
+  playCircle: { viewBox: "0 0 256 256", d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm48.24-94.78-64-40A8,8,0,0,0,100,88v80a8,8,0,0,0,12.24,6.78l64-40a8,8,0,0,0,0-13.56ZM116,153.57V102.43L156.91,128Z" },
   image: {
     viewBox: "0 0 256 256",
     d: "M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm0,16V158.75l-26.07-26.06a16,16,0,0,0-22.63,0l-20,20-44-44a16,16,0,0,0-22.62,0L40,149.37V56ZM40,172l52-52,80,80H40Zm176,28H194.63l-36-36,20-20L216,181.38V200ZM144,100a12,12,0,1,1,12,12A12,12,0,0,1,144,100Z",

package/src/editor/lib/images.ts

@@ -1,5 +1,6 @@
 import { getSettings, setSettings } from "./settings";
-import { mediaMetadata, safeMediaName } from "../../media-types";
+import { DEFAULT_MAX_FILE_SIZE, mediaMetadata, safeMediaName, storedMediaFile } from "../../media-types";
+import config from "virtual:rigel-config";
 export function getKeys(): StockKeys { return getSettings().apiKeys; }
 export function setKeys(keys: StockKeys) { setSettings({ apiKeys: keys }); }
 
@@ -19,6 +20,9 @@ export interface StockResult {
   thumb: string;
   credit: string;
   creditURL?: string;
+  title?: string;
+  description?: string;
+  alt?: string;
 }
 
 export function picsum(query: string): StockResult[] {
@@ -64,6 +68,9 @@ export async function pexels(query: string, key: string): Promise<StockResult[]>
     thumb: p.src?.medium,
     credit: `${p.photographer ?? "?"} / Pexels`,
     creditURL: p.url,
+    title: typeof p.alt === "string" ? p.alt : "",
+    description: typeof p.alt === "string" ? p.alt : "",
+    alt: typeof p.alt === "string" ? p.alt : "",
   }));
 }
 
@@ -80,6 +87,9 @@ export async function pixabay(query: string, key: string): Promise<StockResult[]
     thumb: p.webformatURL,
     credit: `${p.user ?? "?"} / Pixabay`,
     creditURL: p.pageURL,
+    title: typeof p.tags === "string" ? p.tags : "",
+    description: typeof p.tags === "string" ? p.tags : "",
+    alt: typeof p.tags === "string" ? p.tags : "",
   }));
 }
 
@@ -134,8 +144,8 @@ export async function importImageUrl(value: string): Promise<string> {
   try { response = await fetch(value, { credentials: "omit", referrerPolicy: "no-referrer" }); }
   catch { throw new Error("Image download failed. The source must allow browser downloads (CORS); alternatively upload the image file."); }
   if (!response.ok) throw new Error(`Photo download failed (${response.status})`);
-  const limit = 10 * 1024 * 1024;
-  if (Number(response.headers.get("Content-Length")) > limit) throw new Error("Photo exceeds the 10 MB import limit");
+  const limit = config.maxFileSize ?? DEFAULT_MAX_FILE_SIZE;
+  if (Number(response.headers.get("Content-Length")) > limit) throw new Error(`Photo exceeds the ${limit / 1024 / 1024} MB import limit`);
   const type = response.headers.get("Content-Type")?.split(";")[0].trim().toLowerCase();
   if (!["image/jpeg", "image/png", "image/webp"].includes(type ?? "")) throw new Error("Choose a JPEG, PNG or WebP image.");
   if (!response.body) throw new Error("Empty image download");
@@ -147,7 +157,7 @@ export async function importImageUrl(value: string): Promise<string> {
       const { done, value: chunk } = await reader.read();
       if (done) break;
       size += chunk.byteLength;
-      if (size > limit) { await reader.cancel(); throw new Error("Photo exceeds the 10 MB import limit"); }
+      if (size > limit) { await reader.cancel(); throw new Error(`Photo exceeds the ${limit / 1024 / 1024} MB import limit`); }
       chunks.push(new Uint8Array(chunk));
     }
   } finally { reader.releaseLock(); }
@@ -174,21 +184,23 @@ export function currentAuthor(): string {
 
 export async function uploadMedia(file: File): Promise<string> {
   const metadata = mediaMetadata(file.name);
-  if (!safeMediaName(file.name) || !metadata || file.size > 10 * 1024 * 1024) throw new Error("Choose a supported file up to 10 MB with a safe filename.");
+  const limit = config.maxFileSize ?? DEFAULT_MAX_FILE_SIZE;
+  if (!safeMediaName(file.name) || !metadata || file.size > limit) throw new Error(`Choose a supported file up to ${limit / 1024 / 1024} MB with a safe filename.`);
   const response = await fetch("/rigel/api/local/media", { method: "POST", headers: { "Content-Type": metadata.type, "X-Rigel-Filename": file.name, "X-Rigel-Author": currentAuthor() }, body: file });
   if (!response.ok) throw new Error(`Upload failed (${response.status}): ${await response.text()}`);
   const result = await response.json();
-  if (typeof result.url !== "string" || !safeImageUrl(result.url) || !result.url.startsWith("/") || !/\/[a-f0-9]{64}\.[a-z0-9]+$/.test(result.url) || !mediaMetadata(result.url)) throw new Error("Invalid uploaded asset URL");
+  if (typeof result.url !== "string" || !safeImageUrl(result.url) || !result.url.startsWith("/") || !storedMediaFile.test(result.url.split("/").pop() ?? "") || !mediaMetadata(result.url)) throw new Error("Invalid uploaded asset URL");
   return result.url;
 }
 
 export async function uploadImage(blob: Blob): Promise<string> {
-  if (blob.size > 10 * 1024 * 1024) throw new Error("Photo exceeds the 10 MB import limit");
+  const limit = config.maxFileSize ?? DEFAULT_MAX_FILE_SIZE;
+  if (blob.size > limit) throw new Error(`Photo exceeds the ${limit / 1024 / 1024} MB import limit`);
   const saved = await fetch("/rigel/api/local/media", { method: "POST", body: blob });
   if (saved.status === 404) throw new Error("Photo import requires the local dev server");
   if (!saved.ok) throw new Error(`Photo import failed (${saved.status})`);
   const result = await saved.json();
-  if (typeof result.url !== "string" || !safeImageUrl(result.url) || !result.url.startsWith("/") || !/\/[a-f0-9]{64}\.(jpg|png|webp)$/.test(result.url)) {
+  if (typeof result.url !== "string" || !safeImageUrl(result.url) || !result.url.startsWith("/") || !storedMediaFile.test(result.url.split("/").pop() ?? "") || !/\.(jpg|png|webp)$/.test(result.url)) {
     throw new Error("Invalid imported photo URL");
   }
   return result.url;

package/src/editor/lib/media-library.ts

@@ -1,4 +1,14 @@
 import { mediaMetadata } from "../../media-types";
+import type { ICONS } from "./icons";
+
+const FILE_ICONS: Record<string, keyof typeof ICONS> = {
+  pdf: "filePdf", txt: "fileTxt", doc: "fileDoc", docx: "fileDoc", ppt: "filePpt", pptx: "filePpt",
+  Documents: "fileText", Spreadsheets: "fileXls", Archives: "fileZip", Audio: "fileAudio", Video: "fileVideo",
+};
+export function mediaIcon(file: string): keyof typeof ICONS {
+  const extension = file.split(".").pop()?.toLowerCase() ?? "";
+  return FILE_ICONS[extension] ?? FILE_ICONS[mediaMetadata(file)?.category ?? ""] ?? "file";
+}
 
 export interface MediaAsset {
   url: string;
@@ -27,7 +37,7 @@ export function filterMedia(assets: MediaAsset[], search: string, type: string,
     && (!type || asset.type === type || assetCategory(asset) === type) && (!month || modifiedMonth(asset.modified) === month));
 }
 function assetCategory(asset: MediaAsset): string {
-  const category = mediaMetadata(asset.name)?.category ?? '';
+  const category = mediaMetadata(assetFile(asset.url))?.category ?? '';
   if (!category) return 'Other';
   return CURATED.has(category) ? category : 'Other';
 }

package/src/editor/lib/settings.ts

@@ -26,7 +26,7 @@ const prefs = (theme: "system" | "light" | "dark" = "system", language: "en" | "
 const DEFAULTS: RigelSettings = {
   ...prefs(),
   apiKeys: {},
-  userPref: { previewSplit: 0.5, mediaView: "grid", sidebarCollapsed: false, editorExperience: "sidebar" },
+  userPref: { previewSplit: 0.5, mediaView: "grid", sidebarCollapsed: false, editorExperience: "inline" },
 };
 
 const PROVIDERS = ["pexels", "pixabay", "unsplash"] as const;
@@ -46,7 +46,7 @@ export function getSettings(): RigelSettings {
       apiKeys: mergedKeys,
       userPref: {
         sidebarCollapsed: saved?.userPref?.sidebarCollapsed === true,
-        editorExperience: saved?.userPref?.editorExperience === "inline" ? "inline" : "sidebar",
+        editorExperience: saved?.userPref?.editorExperience === "sidebar" ? "sidebar" : DEFAULTS.userPref.editorExperience,
         previewSplit: typeof saved?.userPref?.previewSplit === "number" && Number.isFinite(saved.userPref.previewSplit) && saved.userPref.previewSplit >= 0.2 && saved.userPref.previewSplit <= 0.8
           ? saved.userPref.previewSplit
           : typeof saved?.previewSplit === "number" && Number.isFinite(saved.previewSplit) && saved.previewSplit >= 0.2 && saved.previewSplit <= 0.8

package/src/editor/lib/slugify.ts

@@ -1,15 +1 @@
-export function slugify(input: string, existingSlugs: Iterable<string> = []): string {
-  const base = input
-    .normalize("NFKD")
-    .replace(/[̀-ͯ]/g, "") // combining marks → strip (é→e)
-    .toLowerCase()
-    .trim()
-    .replace(/[^a-z0-9]+/g, "-")
-    .replace(/^-+|-+$/g, "")
-    .replace(/-{2,}/g, "-");
-  if (!base) return "";
-  const existing = new Set(existingSlugs);
-  let slug = base;
-  for (let suffix = 2; existing.has(slug); suffix++) slug = `${base}-${suffix}`;
-  return slug;
-}
+export { slugify } from "../../slugs";

package/src/editor/lib/tooltip.ts

@@ -1,7 +1,23 @@
-export function tooltipPosition(rect: Pick<DOMRect, "left" | "right" | "top" | "bottom">, width: number, height: number, viewportWidth: number, viewportHeight: number) {
+export type TooltipSide = "top" | "bottom" | "left" | "right";
+export type TooltipAlign = "start" | "center" | "end";
+
+export function tooltipPosition(rect: Pick<DOMRect, "left" | "right" | "top" | "bottom">, width: number, height: number, viewportWidth: number, viewportHeight: number, position: TooltipSide = "top", align: TooltipAlign = "center") {
+  const sides: TooltipSide[] = ["top", "bottom", "left", "right"];
+  const preferred = sides.includes(position) ? position : "top";
+  const opposite: Record<TooltipSide, TooltipSide> = { top: "bottom", bottom: "top", left: "right", right: "left" };
+  const candidates = [preferred, opposite[preferred], ...sides.filter(side => side !== preferred && side !== opposite[preferred])];
+  const space = { top: rect.top - 8, bottom: viewportHeight - rect.bottom - 8, left: rect.left - 8, right: viewportWidth - rect.right - 8 };
+  const needed = { top: height + 8, bottom: height + 8, left: width + 8, right: width + 8 };
+  const side = candidates.find(side => space[side] >= needed[side]) ?? candidates.reduce((best, side) => space[side] / needed[side] > space[best] / needed[best] ? side : best);
+  const vertical = side === "top" || side === "bottom";
+  const start = vertical ? rect.left : rect.top, end = vertical ? rect.right : rect.bottom, size = vertical ? width : height;
+  const cross = align === "start" ? start : align === "end" ? end - size : (start + end - size) / 2;
+  const left = vertical ? cross : side === "left" ? rect.left - width - 8 : rect.right + 8;
+  const top = !vertical ? cross : side === "top" ? rect.top - height - 8 : rect.bottom + 8;
   return {
-    left: Math.max(8, Math.min((rect.left + rect.right - width) / 2, viewportWidth - width - 8)),
-    top: Math.max(8, Math.min(rect.top >= height + 14 ? rect.top - height - 6 : rect.bottom + 6, viewportHeight - height - 8)),
+    left: Math.max(8, Math.min(left, viewportWidth - width - 8)),
+    top: Math.max(8, Math.min(top, viewportHeight - height - 8)),
+    side,
   };
 }
 
@@ -41,7 +57,10 @@ function createTooltips() {
     if (!anchor || !tip || !view) return;
     if (!anchor.isConnected || !anchor.checkVisibility() || !anchor.dataset.tooltip) { hide(); return; }
     if (tip.textContent !== anchor.dataset.tooltip) tip.textContent = anchor.dataset.tooltip;
-    const position = tooltipPosition(anchor.getBoundingClientRect(), tip.offsetWidth, tip.offsetHeight, view.innerWidth, view.innerHeight);
+    const preferred = anchor.closest<HTMLElement>("[data-tooltip-position]")?.dataset.tooltipPosition as TooltipSide | undefined;
+    const align = anchor.closest<HTMLElement>("[data-tooltip-align]")?.dataset.tooltipAlign as TooltipAlign | undefined;
+    const position = tooltipPosition(anchor.getBoundingClientRect(), tip.offsetWidth, tip.offsetHeight, view.innerWidth, view.innerHeight, preferred ?? (anchor.closest(".body-toolbar, .visual-toolbar") ? "bottom" : "top"), align);
+    tip.dataset.side = position.side;
     tip.style.left = `${position.left}px`;
     tip.style.top = `${position.top}px`;
     frame = view.requestAnimationFrame(update);

package/src/editor/styles.css

@@ -1,7 +1,7 @@
 .rigel, .rigel *, .rigel *::before, .rigel *::after { box-sizing: border-box; }
-.rigel .rigel-tooltip { position: fixed; pointer-events: auto; inset: auto; margin: 0; padding: 0.375rem 0.625rem; max-width: min(20rem, calc(100vw - 16px)); max-height: calc(100dvh - 16px); overflow: auto; border: 1px solid var(--border-control); border-radius: var(--radius); background: var(--text); color: var(--panel); box-shadow: var(--shadow-md); font: 500 0.75rem/1.5 -apple-system, BlinkMacSystemFont, system-ui, sans-serif; overflow-wrap: anywhere; text-align: start; white-space: normal; }
+.rigel .rigel-tooltip { position: fixed; pointer-events: auto; inset: auto; margin: 0; padding: 4px 10px; max-width: min(17.5rem, calc(100vw - 16px)); max-height: calc(100dvh - 16px); overflow: auto; border: 0; border-radius: 0; background: var(--text); color: var(--panel); box-shadow: 0 2px 8px rgb(0 0 0 / 0.15); font: 500 11px/1.4 -apple-system, BlinkMacSystemFont, system-ui, sans-serif; overflow-wrap: anywhere; text-align: start; white-space: normal; }
 .rigel .rigel-tooltip::backdrop { background: transparent; pointer-events: none; }
-@media (forced-colors: active) { .rigel .rigel-tooltip { background: Canvas; color: CanvasText; border-color: CanvasText; } }
+@media (forced-colors: active) { .rigel .rigel-tooltip { background: Canvas; color: CanvasText; border: 1px solid CanvasText; } }
 .rigel {
   --rigel-50: #EFFBFF;
   --rigel-100: #D9F4FF;
@@ -175,6 +175,8 @@
 .rigel .rail-scroll > button:hover { background: var(--surface-raised); color: var(--text); }
 .rigel .sidebar-asset-icon { display: inline-block; width: 18px; height: 18px; flex-shrink: 0; background-color: currentColor; mask-image: var(--sidebar-icon); mask-position: center; mask-size: contain; mask-repeat: no-repeat; }
 .rigel .rail-scroll > button { gap: 0.625rem; }
+.rigel aside > button.sidebar-publish { gap: 0.625rem; width: calc(100% - 1.5rem); min-height: 44px; margin: 0 0.75rem 0.5rem; padding: 0.625rem; border: 1px solid var(--border-control); color: var(--text); }
+.rigel aside > button.sidebar-publish:disabled { opacity: 0.5; cursor: not-allowed; }
 .rigel aside > button.sidebar-toggle { gap: 0.625rem; width: calc(100% - 1.5rem); margin: 0 0.75rem 0.5rem; padding: 0.625rem; font-size: 0.75rem; }
 @media (min-width: 768px) {
   .rigel.sidebar-collapsed { --sidebar-w: 64px; }
@@ -186,6 +188,7 @@
   .rigel.sidebar-collapsed .user-btn > .user-menu-icon { display: none; }
   .rigel.sidebar-collapsed .rail-scroll > button,
   .rigel.sidebar-collapsed .search-trigger,
+  .rigel.sidebar-collapsed .sidebar-publish,
   .rigel.sidebar-collapsed .sidebar-toggle { justify-content: center; }
   .rigel.sidebar-collapsed .sidebar-heading { height: 1px; font-size: 0; padding: 0; margin: 0.75rem 0.625rem; border-top: 1px solid var(--border-subtle); }
   .rigel.sidebar-collapsed .aside-foot { padding: 0.75rem 0.5rem; }
@@ -365,7 +368,18 @@
 .rigel .preview-heading span, .rigel .site-preview small { color: var(--text-muted); font-size: 0.75rem; }
 .rigel .site-preview p { overflow-wrap: anywhere; font-size: 0.8125rem; }
 .rigel .site-preview .preview-error { color: var(--danger); }
-.rigel .site-preview iframe { flex: 1; width: 100%; min-height: 300px; border: 1px solid var(--border); background: white; }
+.rigel .preview-frame { position: relative; display: flex; flex-direction: column; flex: 1; min-height: 0; min-width: 0; background: var(--panel); }
+.rigel .preview-frame iframe { opacity: 0; visibility: hidden; transition: none; }
+.rigel .preview-frame iframe.revealed { opacity: 1; visibility: visible; transition: opacity 200ms ease-out; }
+.rigel .preview-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 0.625rem; color: var(--text); background: var(--panel); font-size: 0.8125rem; }
+.rigel .preview-spinner { width: 1rem; height: 1rem; border: 2px solid var(--border); border-top-color: currentColor; border-radius: 50%; animation: preview-spin 800ms linear infinite; }
+@keyframes preview-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) {
+  .rigel .preview-spinner { animation: none; }
+  .rigel .preview-frame iframe.revealed { transition: none; }
+}
+.rigel .site-preview .preview-frame { min-height: 300px; border: 1px solid var(--border); }
+.rigel .site-preview iframe { flex: 1; width: 100%; min-height: 0; border: 0; background: white; }
 .rigel .site-preview small { padding-top: 0.75rem; }
 .rigel .preview-retry { align-self: start; }
 @media (max-width: 1050px) {
@@ -826,9 +840,9 @@
 .rigel .outlined:hover:not(:disabled), .rigel .image-picker input::file-selector-button:hover { background: var(--surface-raised); }
 .rigel .outlined:disabled, .rigel .image-picker .tabs button:disabled, .rigel .image-picker .thumb:disabled { opacity: 0.5; cursor: default; }
 .rigel .image-picker input::file-selector-button { margin-right: 0.75rem; }
-.rigel.image-dialog { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 1rem; border: none; }
-.rigel.image-dialog:not([open]) { display: none; }
-.rigel.image-dialog::backdrop { background: transparent; }
+.rigel:is(.image-dialog, .media-insert) { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 1rem; border: none; }
+.rigel:is(.image-dialog, .media-insert):not([open]) { display: none; }
+.rigel:is(.image-dialog, .media-insert)::backdrop { background: transparent; }
 .rigel .image-picker { width: min(760px, 100%); }
 .rigel .media-head, .rigel .media-tools, .rigel .media-actions { display: flex; align-items: center; gap: 0.75rem; }
 .rigel .media-head { justify-content: space-between; margin: calc(1rem * -1) calc(1.25rem * -1) 0; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); }
@@ -846,8 +860,10 @@
 .rigel .media-table :is(th, td) { padding: 0.625rem; overflow-wrap: anywhere; }
 .rigel .media-table th:first-child { width: 48%; }
 .rigel .media-file { display: flex; align-items: center; gap: 0.625rem; text-align: left; width: 100%; }
-.rigel .media-file img { width: 48px; height: 40px; object-fit: cover; flex-shrink: 0; }
+.rigel .media-file .media-thumbnail { display: flex; align-items: center; justify-content: center; width: 48px; height: 40px; flex: 0 0 auto; overflow: hidden; background: var(--surface-raised); color: var(--text-muted); border: 1px solid var(--border-subtle); }
+.rigel .media-thumbnail img { width: 100%; height: 100%; object-fit: cover; display: block; }
 .rigel .media-file-icon { display: flex; min-height: 120px; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; padding: 1rem; color: var(--text-muted); overflow-wrap: anywhere; }
+.rigel .thumb .media-file-icon { height: 100%; min-height: 0; background: var(--surface-raised); }
 .rigel .media-file span { min-width: 0; overflow-wrap: anywhere; }
 .rigel .media-file[aria-pressed=true] { color: var(--on-accent-soft); background: var(--accent-soft); }
 .rigel :is(.image-picker, .media-library) .thumb[aria-pressed=true] { border-color: var(--accent); }
@@ -857,12 +873,16 @@
   .rigel .media-table th:first-child { width: 40%; }
   .rigel .media-file { flex-direction: column; align-items: flex-start; }
 }
+.rigel .media-feedback { position: absolute; right: 0; bottom: calc(100% + 0.25rem); max-width: 100%; margin: 0; color: var(--success); font-size: 0.8125rem; text-align: right; }
 .rigel .media-actions {
+  position: relative;
   justify-content: flex-end; gap: 0.75rem;
   margin-top: 1rem; padding-top: 0.75rem; border-top: 1px solid var(--border);
 }
 .rigel .media-selection { margin-top: 1rem; }
-.rigel .media-preview > img { display: block; max-width: 100%; max-height: 300px; margin: 0 auto 1rem; }
+.rigel .media-preview > :is(img, video) { display: block; max-width: 100%; max-height: 300px; margin: 0 auto 1rem; }
+.rigel .media-preview > video { width: 100%; object-fit: contain; background: #000; }
+.rigel .media-preview > iframe { display: block; width: 100%; height: min(60dvh, 36rem); border: 1px solid var(--border-subtle); }
 .rigel .media-button-actions { display: flex; align-items: center; gap: 0.75rem; margin-left: auto; flex-shrink: 0; }
 .rigel .media-actions.with-media-path { flex-wrap: wrap; }
 .rigel .media-download { flex-shrink: 0; white-space: nowrap; text-decoration: none; }
@@ -872,16 +892,19 @@
 .rigel .media-meta { border-top: 1px solid var(--border-subtle); padding-top: 0.5rem; }
 .rigel .media-meta label { margin-top: 0.75rem; }
 .rigel .media-details { min-width: 0; }
+.rigel .media-details .hint { overflow-wrap: anywhere; }
 .rigel .image-picker:has(.media-editing) { width: min(1040px, 100%); }
 .rigel .media-selection.media-editing { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.5rem; }
 .rigel .media-editing .media-preview { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
-.rigel .media-editing .media-preview > img { max-height: 60dvh; }
+.rigel .media-editing .media-preview > :is(img, video) { max-height: 60dvh; }
 .rigel .media-editing .media-meta { border-top: 0; padding-top: 0; }
 .rigel .media-editing .media-meta label:first-child { margin-top: 0; }
 .rigel .media-editing > .media-actions { grid-column: 1 / -1; margin-top: 0; }
 @media (max-width: 700px) {
   .rigel .media-selection.media-editing { grid-template-columns: minmax(0, 1fr); }
-  .rigel .media-editing .media-preview > img { max-height: 35dvh; }
+  .rigel .media-editing .media-preview > :is(img, video) { max-height: 35dvh; }
+  .rigel .media-editing .media-preview > iframe { height: 35dvh; }
+  .rigel .with-media-path .media-path { flex-basis: 100%; }
   .rigel .with-media-path .media-button-actions { flex-basis: 100%; justify-content: flex-end; }
 }
 .rigel .image-picker input[type=file] { width: 100%; color: var(--text); }
@@ -913,12 +936,15 @@
   display: grid; grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); gap: 1rem; margin-top: 1rem;
 }
 .rigel :is(.image-picker, .media-library) .thumb {
+  position: relative;
   border: 2px solid transparent; border-radius: 0; overflow: hidden;
   padding: 0; cursor: pointer; background: none; aspect-ratio: 3 / 2;
   transition: border-color 0.1s, transform 0.1s;
 }
 .rigel :is(.image-picker, .media-library) .thumb:hover { border-color: var(--accent); transform: translateY(-1px); }
-.rigel :is(.image-picker, .media-library) .thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
+.rigel :is(.image-picker, .media-library) .thumb :is(img, video) { width: 100%; height: 100%; object-fit: cover; display: block; }
+.rigel :is(.image-picker, .media-library) .thumb video { pointer-events: none; }
+.rigel .media-extension { position: absolute; top: 0.25rem; right: 0.25rem; padding: 0.0625rem 0.25rem; border: 1px solid var(--border-control); background: var(--panel); color: var(--text); font-size: 0.625rem; font-weight: 600; line-height: 1.2; pointer-events: none; }
 .rigel :is(.image-picker, .media-library) .grid figure { margin: 0; min-width: 0; }
 .rigel :is(.image-picker, .media-library) .grid .thumb { width: 100%; }
 .rigel :is(.image-picker, .media-library) .grid figcaption { font-size: 0.75rem; color: var(--text-2); overflow-wrap: anywhere; }
@@ -1140,7 +1166,7 @@
 .rigel.rigel-inline { display: block; position: fixed; top: 0; left: 0; width: 100%; min-height: 0; height: 0; padding: 0; background: transparent; pointer-events: none; z-index: 120; }
 .rigel.rigel-inline .block-editor { margin: 0; border: 0; }
 .rigel.rigel-inline .block-editor > [role="alert"] { position: fixed; inset: 8px 8px auto; padding: 0.75rem; background: var(--danger-soft); color: var(--danger); pointer-events: auto; }
-.rigel.rigel-inline :is(.body-toolbar, .block-handle, .block-insert, .block-menu, .block-slash, .markdown-link, .block-markdown-view) { pointer-events: auto; }
+.rigel.rigel-inline :is(.body-toolbar, .block-handle, .block-insert, .block-menu, .block-slash, .markdown-link, .block-markdown-view, .media-insert, .image-dialog) { pointer-events: auto; }
 .rigel.rigel-inline .block-editor .body-toolbar, .rigel .block-editor .body-toolbar.image-toolbar { position: fixed; inset: auto; width: max-content; max-width: calc(100vw - 16px); margin: 0; padding: 0.25rem; gap: 0.25rem; border: 1px solid var(--border-control); box-shadow: var(--shadow-lg); z-index: 120; }
 .rigel.rigel-inline :where(.block-editor .body-toolbar) > button { width: 32px; height: 32px; padding: 0; background: transparent; color: var(--text); border: 0; }
 .rigel.rigel-inline .block-handle { position: fixed; width: 24px; height: 28px; }
@@ -1195,7 +1221,7 @@
 .rigel .block-table-controls button:hover:not(:disabled) { background: var(--accent-soft); color: var(--on-accent-soft); }
 .rigel .block-table-controls button:disabled { opacity: 0.35; cursor: default; }
 .rigel .block-table-controls label.inline { display: flex; align-items: center; gap: 0.5rem; margin: 0.25rem 0 0; padding: 0.5rem; border-top: 1px solid var(--border-subtle); font-size: 0.8125rem; }
-.rigel .block-table-controls label.inline input.switch { flex-shrink: 0; margin-left: auto; }
+
 .rigel .block-content > p:has(> br:only-child)::before { content: "Type / to choose a block"; position: absolute; color: var(--text-2); pointer-events: none; }
 .rigel .block-handle { position: absolute; left: 2px; width: 28px; height: 32px; padding: 0; display: flex; align-items: center; justify-content: center; background: var(--panel); border: 1px solid var(--border-control); color: var(--text); cursor: grab; touch-action: none; }
 .rigel .block-insert { position: fixed; z-index: 119; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; background: var(--panel); border: 1px solid var(--border-control); color: var(--text); cursor: pointer; }
@@ -1289,3 +1315,8 @@
   .rigel main.visual-pane { padding: 0.75rem; }
   .rigel .visual-editor.with-panel { grid-template-rows: minmax(0, 1fr) 50%; }
 }
+
+.rigel .media-menu > button { display: flex; align-items: center; gap: 0.5rem; }
+.rigel .media-insert .media-button-actions { justify-content: space-between; margin: 1rem 0 0; }
+
+.rigel .block-content figure.media-video video, .rigel .block-content figure.media-embed iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; }

package/src/env.d.ts

@@ -17,6 +17,6 @@ declare module "virtual:rigel-content" {
 
 declare module "virtual:rigel-config" {
   import type { RigelConfig } from "@rigel-cms/rigel";
-  const config: Pick<RigelConfig, "copyDir" | "backend" | "demo" | "collections" | "menus" | "mediaDir" | "schema"> & { publicDir?: string; root?: string };
+  const config: Pick<RigelConfig, "copyDir" | "backend" | "jsonOutput" | "demo" | "collections" | "menus" | "mediaDir" | "maxFileSize" | "schema" | "preview"> & { publicDir?: string; root?: string };
   export default config;
 }

package/src/index.ts

@@ -2,7 +2,7 @@ import type { AstroIntegration } from "astro";
 import { fileURLToPath } from "node:url";
 import path from "node:path";
 import { lstat, readFile } from "node:fs/promises";
-import { mediaMetadata, safeMediaName } from "./media-types";
+import { mediaHeaders, safeMediaName, storedMediaFile } from "./media-types";
 import { mediaDirectory } from "./routes/media-files";
 import { parseConfig, type RigelConfig } from "./config";
 import { rigelManifestPlugin } from "./vite/manifest-plugin";
@@ -48,10 +48,7 @@ export function rigel(options: Partial<RigelConfig> = {}): AstroIntegration {
                     }
                     const file = path.join(directory, filename), info = await lstat(file);
                     if (!info.isFile() || info.isSymbolicLink()) throw new Error();
-                    const metadata = mediaMetadata(filename)!;
-                    response.setHeader("Content-Type", metadata.type);
-                    response.setHeader("X-Content-Type-Options", "nosniff");
-                    response.setHeader("Content-Disposition", `${metadata.category === "Images" ? "inline" : "attachment"}; filename="${filename}"`);
+                    for (const [name, value] of Object.entries(mediaHeaders(filename, new URL(request.url ?? "/", "http://localhost").searchParams.get("preview") === "1"))) response.setHeader(name, value);
                     response.end(request.method === "HEAD" ? undefined : await readFile(file));
                   } catch { response.statusCode = 404; response.end("Not found"); }
                 });
@@ -60,7 +57,7 @@ export function rigel(options: Partial<RigelConfig> = {}): AstroIntegration {
             ...(cfg.backend === "local" && command === "dev" ? {
               server: { watch: { ignored: [(file: string) =>
                 path.dirname(file) === path.resolve(fileURLToPath(config.publicDir), cfg.mediaDir ?? "rigel-media")
-                && /^[a-f0-9]{64}\.[a-z0-9]+$/.test(path.basename(file))
+                && storedMediaFile.test(path.basename(file))
               ] } },
             } : {}),
           },
@@ -119,6 +116,7 @@ export type { MenuItem, MenuDocument } from "./manifest/menu";
 export { defineCopy } from "./manifest/types";
 export type { CopyField, CopyGroup, CopyPage, Manifest, CollectionField } from "./manifest/types";
 export type { RigelConfig, CollectionConfig } from "./config";
+export type { JsonOutput } from "./json-output";
 export type { ReferenceOption } from "./manifest/references";
 export type { SidebarEntry, SidebarTarget, SidebarIconName } from "./manifest/navigation";
 export { defineSchema, defineDocument, defineObject, defineField } from "./schema/types";

package/src/json-output.ts

@@ -0,0 +1,5 @@
+export type JsonOutput = "pretty" | "minified";
+
+export function serializeContentJson(value: unknown, output: JsonOutput = "pretty"): string {
+  return JSON.stringify(value, null, output === "minified" ? undefined : 2) + "\n";
+}

package/src/manifest/types.ts

@@ -30,6 +30,7 @@ export interface GitHubBackendConfig {
   authOrigin: string;
   appSlug: string;
   copyDir: string;
+  jsonOutput?: import("../json-output").JsonOutput;
   collections: { name: string; folder: string }[];
   menus?: { folder: string; maxDepth: number };
 }

package/src/media-types.ts

@@ -3,11 +3,24 @@ for (const [category, entries] of Object.entries({
   Images: { jpg: 'image/jpeg', jpeg: 'image/jpeg', png: 'image/png', webp: 'image/webp', gif: 'image/gif', avif: 'image/avif' },
   Audio: { mp3: 'audio/mpeg', wav: 'audio/wav', ogg: 'audio/ogg', m4a: 'audio/mp4' },
   Video: { mp4: 'video/mp4', webm: 'video/webm', mov: 'video/quicktime' },
-  Documents: { pdf: 'application/pdf', doc: 'application/msword', docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', rtf: 'application/rtf', odt: 'application/vnd.oasis.opendocument.text', ppt: 'application/vnd.ms-powerpoint', pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' },
+  Documents: { txt: 'text/plain', pdf: 'application/pdf', doc: 'application/msword', docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', rtf: 'application/rtf', odt: 'application/vnd.oasis.opendocument.text', ppt: 'application/vnd.ms-powerpoint', pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' },
   Spreadsheets: { xls: 'application/vnd.ms-excel', xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet', csv: 'text/csv', ods: 'application/vnd.oasis.opendocument.spreadsheet' },
   Archives: { zip: 'application/zip', gz: 'application/gzip', tar: 'application/x-tar', '7z': 'application/x-7z-compressed', rar: 'application/vnd.rar' },
 })) for (const [extension, type] of Object.entries(entries)) MEDIA_TYPES[extension] = { type, category };
 
+export function mediaHeaders(filename: string, preview = false) {
+  const metadata = mediaMetadata(filename)!;
+  const inline = ['Images', 'Video'].includes(metadata.category) || (preview && ['pdf', 'txt'].includes(metadata.extension));
+  return {
+    'Content-Type': metadata.type === 'text/plain' ? 'text/plain; charset=utf-8' : metadata.type,
+    'Content-Disposition': `${inline ? 'inline' : 'attachment'}; filename="${filename}"`,
+    'X-Content-Type-Options': 'nosniff',
+  };
+}
+
+export const storedMediaFile = /^(?:[a-f0-9]{64}|[a-f0-9]{8}-[a-f0-9]{4}-4[a-f0-9]{3}-[89ab][a-f0-9]{3}-[a-f0-9]{12})\.[a-z0-9]+$/;
+
+export const DEFAULT_MAX_FILE_SIZE = 2 * 1024 * 1024;
 export const MEDIA_CATEGORIES = ['Images', 'Audio', 'Video', 'Documents', 'Spreadsheets', 'Archives', 'Other'];
 export function mediaMetadata(name: string) {
   const extension = name.split('.').pop()?.toLowerCase() ?? '';

package/src/preview.ts

@@ -1,7 +1,9 @@
 import MarkdownIt from "markdown-it";
 import DOMPurify from "dompurify";
 import { pageRoute } from "./schema/paths";
+import { slugify } from "./slugs";
 import { renderArticle } from "./article-render";
+import { createEmbedPreview } from "./editor/lib/embed-preview";
 import { safePreviewUrl, previewBaseUrl } from "./preview-urls";
 export { safePreviewUrl } from "./preview-urls";
 
@@ -20,6 +22,7 @@ export interface PreviewConfig {
 export interface PreviewTarget {
   kind: "page" | "post" | "menu" | "document";
   slug: string;
+  urlSlug?: string;
   collection?: string;
   type?: string;
 }
@@ -31,6 +34,11 @@ export function previewPath(config: PreviewConfig, target: PreviewTarget, isNew
 }
 
 export function previewUrl(config: PreviewConfig, target: PreviewTarget, mode: "live" | "draft" | "website" = "draft", isNew = false): string | null {
+  if (mode !== "draft" && target.kind !== "page" && target.urlSlug !== undefined) {
+    const slug = slugify(target.urlSlug);
+    if (!slug) return null;
+    target = { ...target, slug };
+  }
   const path = previewPath(config, target, mode === "draft" && (target.kind === "post" || isNew));
   const base = mode === "live" ? config.liveUrl : config.draftUrl;
   if (!path || base === undefined) return path;
@@ -151,11 +159,14 @@ export function patchPreview(doc: Document, values: Record<string, unknown>, bod
     const source = blocks ? JSON.stringify(result.value) : typeof result.value === "string" ? result.value : "";
     if (rendered.get(el) === source) continue;
     rendered.set(el, source);
-    const fragment = DOMPurify.sanitize(blocks ? (result.value ? renderArticle(result.value as import("./article-body").ArticleBody) : "") : markdown.render(source), {
+    const fragment = DOMPurify.sanitize(blocks ? (result.value ? renderArticle(result.value as import("./article-body").ArticleBody, { preview: true }) : "") : markdown.render(source), {
       RETURN_DOM_FRAGMENT: true,
-      ALLOWED_TAGS: ["p", "h1", "h2", "h3", "h4", "h5", "h6", "ul", "ol", "li", "blockquote", "aside", "figure", "figcaption", "pre", "code", "strong", "em", "s", "u", "mark", "sub", "sup", "a", "img", "br", "hr", "table", "thead", "tbody", "tr", "th", "td"],
-      ALLOWED_ATTR: ["href", "src", "alt", "title", "start", "scope"],
+      ALLOWED_TAGS: ["p", "h1", "h2", "h3", "h4", "h5", "h6", "ul", "ol", "li", "blockquote", "aside", "figure", "figcaption", "pre", "code", "strong", "em", "s", "u", "mark", "sub", "sup", "a", "img", "br", "hr", "table", "thead", "tbody", "tr", "th", "td", ...(blocks ? ["video"] : [])],
+      ALLOWED_ATTR: ["href", "src", "alt", "title", "start", "scope", ...(blocks ? ["controls", "muted", "preload", "playsinline", "poster", "class"] : [])],
     });
+    if (blocks) for (const marker of fragment.querySelectorAll<HTMLElement>("[data-rigel-embed]")) {
+      marker.replaceWith(createEmbedPreview({ provider: marker.dataset.rigelEmbed, id: marker.dataset.rigelVideoId, title: marker.dataset.rigelVideoTitle }, doc));
+    }
     for (const link of fragment.querySelectorAll("[href], [src]")) {
       for (const attr of ["href", "src"]) if (link.hasAttribute(attr) && !safePreviewUrl(link.getAttribute(attr)!, attr === "src")) link.removeAttribute(attr);
     }

package/src/routes/local-documents.ts

@@ -46,7 +46,7 @@ export const GET: APIRoute = async ({ params }) => {
   const target = validateDocumentId(guarded.schema, id);
   if (!target) return new Response("Unknown document", { status: 404 });
   try {
-    const documents = await readDocuments(guarded.schema, guarded.root);
+    const documents = await readDocuments(guarded.schema, guarded.root, config.preview);
     const document = documents.find((entry) => entry.id === id);
     if (!document) return new Response("Unknown document", { status: 404 });
     return Response.json(document);
@@ -66,10 +66,10 @@ const handle: APIRoute = async ({ request, params }) => {
   if (!target) return new Response("Unknown document type or slug", { status: 400 });
   try {
     const data = await readBody(request);
-    const documents = await readDocuments(guarded.schema, guarded.root);
-    const next = { ...data, _id: id, _type: target.type.name, slug: target.slug };
+    const documents = await readDocuments(guarded.schema, guarded.root, config.preview);
+    const next = { ...data, _id: id, _type: target.type.name };
     validateDocument(guarded.schema, target.type.name, target.slug, next, documents);
-    await writeDocument(guarded.schema, guarded.root, target.type.name, target.slug, next, request.method === "POST" ? "create" : "update");
+    await writeDocument(guarded.schema, guarded.root, target.type.name, target.slug, next, request.method === "POST" ? "create" : "update", config.preview, config.jsonOutput);
     return new Response(null, { status: 204 });
   } catch (error) {
     if (error instanceof DocumentStoreError) return new Response(error.message, { status: error.status });