@xiwebdesign/xicms-core 4.17.1

package/dist/admin/lib/slugify.js

@@ -0,0 +1,7 @@
+function slugify(s) {
+  return s.toLowerCase().normalize("NFD").replace(/[̀-ͯ]/g, "").replace(/[^a-z0-9]+/g, "-").replace(/(^-|-$)/g, "");
+}
+export {
+  slugify
+};
+//# sourceMappingURL=slugify.js.map

package/dist/admin/lib/slugify.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/lib/slugify.ts"],"sourcesContent":["/** Maakt een URL-veilige slug van een titel (gedeeld door de pagina- en nieuws-editor). */\nexport function slugify(s: string): string {\n  return s\n    .toLowerCase()\n    .normalize(\"NFD\")\n    .replace(/[̀-ͯ]/g, \"\")\n    .replace(/[^a-z0-9]+/g, \"-\")\n    .replace(/(^-|-$)/g, \"\");\n}\n"],"mappings":"AACO,SAAS,QAAQ,GAAmB;AACzC,SAAO,EACJ,YAAY,EACZ,UAAU,KAAK,EACf,QAAQ,UAAU,EAAE,EACpB,QAAQ,eAAe,GAAG,EAC1B,QAAQ,YAAY,EAAE;AAC3B;","names":[]}

package/dist/admin/lib/upload.d.ts

@@ -0,0 +1,13 @@
+/** Maximale bestandsgrootte vóór compressie (foolproof: voorkomt vastlopen op enorme bestanden). */
+export declare const MAX_UPLOAD_BYTES: number;
+/**
+ * Comprimeert een afbeelding (client-side, webp + resize) en uploadt 'm naar
+ * `sites/{siteId}/media/...`. Registreert het media-doc (status "processing" — de sharp-Cloud-
+ * Function vult srcset-varianten + zet "ready") en geeft de download-URL + media-id terug.
+ * Door vóór upload te comprimeren bewaren we nooit het grote origineel → flinke storagebesparing.
+ */
+export declare function uploadImage(siteId: string, file: File): Promise<{
+    url: string;
+    mediaId: string;
+    path: string;
+}>;

package/dist/admin/lib/upload.js

@@ -0,0 +1,40 @@
+"use client";
+import { ref as storageRef, uploadBytes, getDownloadURL } from "firebase/storage";
+import { addDoc, collection, serverTimestamp } from "firebase/firestore";
+import { getBucket, getDb } from "../../firebase/client";
+import { compressImage } from "./compressImage";
+const MAX_UPLOAD_BYTES = 15 * 1024 * 1024;
+async function uploadImage(siteId, file) {
+  const bucket = getBucket();
+  const db = getDb();
+  if (!bucket) throw new Error("Firebase Storage is niet geconfigureerd.");
+  if (!file.type.startsWith("image/")) throw new Error("Alleen afbeeldingen zijn toegestaan.");
+  if (file.size > MAX_UPLOAD_BYTES) {
+    throw new Error(`Bestand te groot (max ${Math.round(MAX_UPLOAD_BYTES / 1024 / 1024)} MB).`);
+  }
+  const optimized = await compressImage(file);
+  const path = `sites/${siteId}/media/${Date.now()}-${optimized.name.replace(/[^\w.-]+/g, "_")}`;
+  const sref = storageRef(bucket, path);
+  await uploadBytes(sref, optimized);
+  const url = await getDownloadURL(sref);
+  let mediaId = "";
+  if (db) {
+    const docRef = await addDoc(collection(db, "sites", siteId, "media"), {
+      url,
+      path,
+      name: optimized.name,
+      contentType: optimized.type,
+      size: optimized.size,
+      alt: "",
+      status: "processing",
+      createdAt: serverTimestamp()
+    });
+    mediaId = docRef.id;
+  }
+  return { url, mediaId, path };
+}
+export {
+  MAX_UPLOAD_BYTES,
+  uploadImage
+};
+//# sourceMappingURL=upload.js.map

package/dist/admin/lib/upload.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/lib/upload.ts"],"sourcesContent":["\"use client\";\n\nimport { ref as storageRef, uploadBytes, getDownloadURL } from \"firebase/storage\";\nimport { addDoc, collection, serverTimestamp } from \"firebase/firestore\";\nimport { getBucket, getDb } from \"../../firebase/client\";\nimport { compressImage } from \"./compressImage\";\n\n/** Maximale bestandsgrootte vóór compressie (foolproof: voorkomt vastlopen op enorme bestanden). */\nexport const MAX_UPLOAD_BYTES = 15 * 1024 * 1024; // 15 MB\n\n/**\n * Comprimeert een afbeelding (client-side, webp + resize) en uploadt 'm naar\n * `sites/{siteId}/media/...`. Registreert het media-doc (status \"processing\" — de sharp-Cloud-\n * Function vult srcset-varianten + zet \"ready\") en geeft de download-URL + media-id terug.\n * Door vóór upload te comprimeren bewaren we nooit het grote origineel → flinke storagebesparing.\n */\nexport async function uploadImage(\n  siteId: string,\n  file: File,\n): Promise<{ url: string; mediaId: string; path: string }> {\n  const bucket = getBucket();\n  const db = getDb();\n  if (!bucket) throw new Error(\"Firebase Storage is niet geconfigureerd.\");\n  if (!file.type.startsWith(\"image/\")) throw new Error(\"Alleen afbeeldingen zijn toegestaan.\");\n  if (file.size > MAX_UPLOAD_BYTES) {\n    throw new Error(`Bestand te groot (max ${Math.round(MAX_UPLOAD_BYTES / 1024 / 1024)} MB).`);\n  }\n\n  const optimized = await compressImage(file);\n  const path = `sites/${siteId}/media/${Date.now()}-${optimized.name.replace(/[^\\w.-]+/g, \"_\")}`;\n  const sref = storageRef(bucket, path);\n  await uploadBytes(sref, optimized);\n  const url = await getDownloadURL(sref);\n  let mediaId = \"\";\n  if (db) {\n    const docRef = await addDoc(collection(db, \"sites\", siteId, \"media\"), {\n      url,\n      path,\n      name: optimized.name,\n      contentType: optimized.type,\n      size: optimized.size,\n      alt: \"\",\n      status: \"processing\",\n      createdAt: serverTimestamp(),\n    });\n    mediaId = docRef.id;\n  }\n  return { url, mediaId, path };\n}\n"],"mappings":";AAEA,SAAS,OAAO,YAAY,aAAa,sBAAsB;AAC/D,SAAS,QAAQ,YAAY,uBAAuB;AACpD,SAAS,WAAW,aAAa;AACjC,SAAS,qBAAqB;AAGvB,MAAM,mBAAmB,KAAK,OAAO;AAQ5C,eAAsB,YACpB,QACA,MACyD;AACzD,QAAM,SAAS,UAAU;AACzB,QAAM,KAAK,MAAM;AACjB,MAAI,CAAC,OAAQ,OAAM,IAAI,MAAM,0CAA0C;AACvE,MAAI,CAAC,KAAK,KAAK,WAAW,QAAQ,EAAG,OAAM,IAAI,MAAM,sCAAsC;AAC3F,MAAI,KAAK,OAAO,kBAAkB;AAChC,UAAM,IAAI,MAAM,yBAAyB,KAAK,MAAM,mBAAmB,OAAO,IAAI,CAAC,OAAO;AAAA,EAC5F;AAEA,QAAM,YAAY,MAAM,cAAc,IAAI;AAC1C,QAAM,OAAO,SAAS,MAAM,UAAU,KAAK,IAAI,CAAC,IAAI,UAAU,KAAK,QAAQ,aAAa,GAAG,CAAC;AAC5F,QAAM,OAAO,WAAW,QAAQ,IAAI;AACpC,QAAM,YAAY,MAAM,SAAS;AACjC,QAAM,MAAM,MAAM,eAAe,IAAI;AACrC,MAAI,UAAU;AACd,MAAI,IAAI;AACN,UAAM,SAAS,MAAM,OAAO,WAAW,IAAI,SAAS,QAAQ,OAAO,GAAG;AAAA,MACpE;AAAA,MACA;AAAA,MACA,MAAM,UAAU;AAAA,MAChB,aAAa,UAAU;AAAA,MACvB,MAAM,UAAU;AAAA,MAChB,KAAK;AAAA,MACL,QAAQ;AAAA,MACR,WAAW,gBAAgB;AAAA,IAC7B,CAAC;AACD,cAAU,OAAO;AAAA,EACnB;AACA,SAAO,EAAE,KAAK,SAAS,KAAK;AAC9B;","names":[]}

package/dist/admin/lib/zodFields.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Zod-introspectie voor automatisch gegenereerde formulieren. Gedeeld door:
+ * - de `GenericEditor` (fallback-editor voor blokken zonder eigen `Editor`), en
+ * - het `ModuleSettingsForm` (instellingen van een module in /beheer).
+ *
+ * Een veld krijgt zijn label uit `.describe("…")` op het schema; zonder beschrijving valt het
+ * terug op de veldsleutel. Puur (geen React) — apart testbaar.
+ */
+import type { ZodTypeAny } from "zod";
+export interface SchemaField {
+    key: string;
+    kind: "number" | "boolean" | "string" | "enum" | "json";
+    /** Leesbaar label: `.describe()` van het schema, anders de veldsleutel. */
+    label: string;
+    options?: string[];
+    /** Max-lengte van een string (bepaalt Input vs Textarea in de UI). */
+    maxLength?: number;
+    /** Het volledige veld-schema — voor validatie van json-velden vóór commit. */
+    schema: ZodTypeAny;
+}
+/**
+ * Leidt een formulier-beschrijving af uit een Zod-objectschema. Interne velden (`_key`/`_type`/
+ * `_style`) worden overgeslagen — die beheren de editor-chrome en de StyleEditor. Complexe velden
+ * (array/object/record) worden als `json` teruggegeven zodat een fallback-editor ze tóch kan
+ * aanbieden; een aanroeper die alleen simpele velden wil, filtert op `kind !== "json"`.
+ */
+export declare function introspectObjectSchema(schema: ZodTypeAny): SchemaField[];

package/dist/admin/lib/zodFields.js

@@ -0,0 +1,48 @@
+function unwrap(schema) {
+  let s = schema;
+  let description = s?._def?.description;
+  while (s?._def?.typeName === "ZodDefault" || s?._def?.typeName === "ZodOptional" || s?._def?.typeName === "ZodNullable") {
+    s = s._def.innerType;
+    description = description ?? s?._def?.description;
+  }
+  return { def: s?._def, description };
+}
+function introspectObjectSchema(schema) {
+  const def = schema._def;
+  if (def?.typeName !== "ZodObject" || typeof def.shape !== "function") return [];
+  const out = [];
+  for (const [key, field] of Object.entries(def.shape())) {
+    if (key.startsWith("_")) continue;
+    const { def: inner, description } = unwrap(field);
+    const label = description ?? key;
+    const fieldSchema = field;
+    switch (inner?.typeName) {
+      case "ZodNumber":
+        out.push({ key, kind: "number", label, schema: fieldSchema });
+        break;
+      case "ZodBoolean":
+        out.push({ key, kind: "boolean", label, schema: fieldSchema });
+        break;
+      case "ZodEnum":
+        out.push({ key, kind: "enum", label, options: inner.values, schema: fieldSchema });
+        break;
+      case "ZodString": {
+        const max = inner.checks?.find((c) => c.kind === "max")?.value;
+        out.push({ key, kind: "string", label, maxLength: max, schema: fieldSchema });
+        break;
+      }
+      case "ZodArray":
+      case "ZodObject":
+      case "ZodRecord":
+        out.push({ key, kind: "json", label, schema: fieldSchema });
+        break;
+      default:
+        break;
+    }
+  }
+  return out;
+}
+export {
+  introspectObjectSchema
+};
+//# sourceMappingURL=zodFields.js.map

package/dist/admin/lib/zodFields.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/lib/zodFields.ts"],"sourcesContent":["/**\n * Zod-introspectie voor automatisch gegenereerde formulieren. Gedeeld door:\n * - de `GenericEditor` (fallback-editor voor blokken zonder eigen `Editor`), en\n * - het `ModuleSettingsForm` (instellingen van een module in /beheer).\n *\n * Een veld krijgt zijn label uit `.describe(\"…\")` op het schema; zonder beschrijving valt het\n * terug op de veldsleutel. Puur (geen React) — apart testbaar.\n */\nimport type { ZodTypeAny } from \"zod\";\n\nexport interface SchemaField {\n  key: string;\n  kind: \"number\" | \"boolean\" | \"string\" | \"enum\" | \"json\";\n  /** Leesbaar label: `.describe()` van het schema, anders de veldsleutel. */\n  label: string;\n  options?: string[];\n  /** Max-lengte van een string (bepaalt Input vs Textarea in de UI). */\n  maxLength?: number;\n  /** Het volledige veld-schema — voor validatie van json-velden vóór commit. */\n  schema: ZodTypeAny;\n}\n\ninterface AnyDef {\n  typeName?: string;\n  innerType?: unknown;\n  values?: string[];\n  description?: string;\n  checks?: { kind: string; value?: number }[];\n  shape?: () => Record<string, unknown>;\n}\n\n/** Pakt het binnenste type uit ZodDefault/ZodOptional/ZodNullable; bewaart de buitenste beschrijving. */\nfunction unwrap(schema: unknown): { def?: AnyDef; description?: string } {\n  let s = schema as { _def?: AnyDef };\n  let description = s?._def?.description;\n  while (\n    s?._def?.typeName === \"ZodDefault\" ||\n    s?._def?.typeName === \"ZodOptional\" ||\n    s?._def?.typeName === \"ZodNullable\"\n  ) {\n    s = s._def.innerType as typeof s;\n    description = description ?? s?._def?.description;\n  }\n  return { def: s?._def, description };\n}\n\n/**\n * Leidt een formulier-beschrijving af uit een Zod-objectschema. Interne velden (`_key`/`_type`/\n * `_style`) worden overgeslagen — die beheren de editor-chrome en de StyleEditor. Complexe velden\n * (array/object/record) worden als `json` teruggegeven zodat een fallback-editor ze tóch kan\n * aanbieden; een aanroeper die alleen simpele velden wil, filtert op `kind !== \"json\"`.\n */\nexport function introspectObjectSchema(schema: ZodTypeAny): SchemaField[] {\n  const def = (schema as { _def?: AnyDef })._def;\n  if (def?.typeName !== \"ZodObject\" || typeof def.shape !== \"function\") return [];\n  const out: SchemaField[] = [];\n  for (const [key, field] of Object.entries(def.shape())) {\n    if (key.startsWith(\"_\")) continue;\n    const { def: inner, description } = unwrap(field);\n    const label = description ?? key;\n    const fieldSchema = field as ZodTypeAny;\n    switch (inner?.typeName) {\n      case \"ZodNumber\":\n        out.push({ key, kind: \"number\", label, schema: fieldSchema });\n        break;\n      case \"ZodBoolean\":\n        out.push({ key, kind: \"boolean\", label, schema: fieldSchema });\n        break;\n      case \"ZodEnum\":\n        out.push({ key, kind: \"enum\", label, options: inner.values, schema: fieldSchema });\n        break;\n      case \"ZodString\": {\n        const max = inner.checks?.find((c) => c.kind === \"max\")?.value;\n        out.push({ key, kind: \"string\", label, maxLength: max, schema: fieldSchema });\n        break;\n      }\n      case \"ZodArray\":\n      case \"ZodObject\":\n      case \"ZodRecord\":\n        out.push({ key, kind: \"json\", label, schema: fieldSchema });\n        break;\n      default:\n        // ZodLiteral (bv. _type), unions e.d.: geen zinvol generiek veld.\n        break;\n    }\n  }\n  return out;\n}\n"],"mappings":"AAgCA,SAAS,OAAO,QAAyD;AACvE,MAAI,IAAI;AACR,MAAI,cAAc,GAAG,MAAM;AAC3B,SACE,GAAG,MAAM,aAAa,gBACtB,GAAG,MAAM,aAAa,iBACtB,GAAG,MAAM,aAAa,eACtB;AACA,QAAI,EAAE,KAAK;AACX,kBAAc,eAAe,GAAG,MAAM;AAAA,EACxC;AACA,SAAO,EAAE,KAAK,GAAG,MAAM,YAAY;AACrC;AAQO,SAAS,uBAAuB,QAAmC;AACxE,QAAM,MAAO,OAA6B;AAC1C,MAAI,KAAK,aAAa,eAAe,OAAO,IAAI,UAAU,WAAY,QAAO,CAAC;AAC9E,QAAM,MAAqB,CAAC;AAC5B,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,IAAI,MAAM,CAAC,GAAG;AACtD,QAAI,IAAI,WAAW,GAAG,EAAG;AACzB,UAAM,EAAE,KAAK,OAAO,YAAY,IAAI,OAAO,KAAK;AAChD,UAAM,QAAQ,eAAe;AAC7B,UAAM,cAAc;AACpB,YAAQ,OAAO,UAAU;AAAA,MACvB,KAAK;AACH,YAAI,KAAK,EAAE,KAAK,MAAM,UAAU,OAAO,QAAQ,YAAY,CAAC;AAC5D;AAAA,MACF,KAAK;AACH,YAAI,KAAK,EAAE,KAAK,MAAM,WAAW,OAAO,QAAQ,YAAY,CAAC;AAC7D;AAAA,MACF,KAAK;AACH,YAAI,KAAK,EAAE,KAAK,MAAM,QAAQ,OAAO,SAAS,MAAM,QAAQ,QAAQ,YAAY,CAAC;AACjF;AAAA,MACF,KAAK,aAAa;AAChB,cAAM,MAAM,MAAM,QAAQ,KAAK,CAAC,MAAM,EAAE,SAAS,KAAK,GAAG;AACzD,YAAI,KAAK,EAAE,KAAK,MAAM,UAAU,OAAO,WAAW,KAAK,QAAQ,YAAY,CAAC;AAC5E;AAAA,MACF;AAAA,MACA,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AACH,YAAI,KAAK,EAAE,KAAK,MAAM,QAAQ,OAAO,QAAQ,YAAY,CAAC;AAC1D;AAAA,MACF;AAEE;AAAA,IACJ;AAAA,EACF;AACA,SAAO;AACT;","names":[]}

package/dist/admin/media/MediaManager.d.ts

@@ -0,0 +1,3 @@
+export declare function MediaManager({ siteId }: {
+    siteId: string;
+}): import("react").JSX.Element;

package/dist/admin/media/MediaManager.js

@@ -0,0 +1,132 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import {
+  collection,
+  deleteDoc,
+  doc,
+  onSnapshot,
+  orderBy,
+  query,
+  updateDoc
+} from "firebase/firestore";
+import { deleteObject, ref as storageRef } from "firebase/storage";
+import { getBucket, getDb } from "../../firebase/client";
+import { Button, Card, Badge, Input } from "../ui/primitives";
+import { useToast } from "../ui/toast";
+import { useConfirm } from "../ui/ConfirmDialog";
+import { uploadImage } from "../lib/upload";
+import { findMediaUsage } from "../lib/mediaUsage";
+function MediaManager({ siteId }) {
+  const { toast } = useToast();
+  const confirm = useConfirm();
+  const [items, setItems] = useState([]);
+  const [busy, setBusy] = useState(false);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    const db = getDb();
+    if (!db) return;
+    const q = query(collection(db, "sites", siteId, "media"), orderBy("createdAt", "desc"));
+    return onSnapshot(
+      q,
+      (snap) => setItems(snap.docs.map((d) => ({ id: d.id, ...d.data() })))
+    );
+  }, [siteId]);
+  async function onFiles(files) {
+    setBusy(true);
+    let ok = 0;
+    const errors = [];
+    for (const file of Array.from(files)) {
+      try {
+        await uploadImage(siteId, file);
+        ok++;
+      } catch (e) {
+        errors.push(`${file.name}: ${e.message}`);
+      }
+    }
+    if (ok > 0) toast({ title: `${ok} foto('s) ge\xFCpload`, description: "Automatisch verkleind; varianten worden op de achtergrond gemaakt.", tone: "success" });
+    if (errors.length) toast({ title: "Sommige uploads mislukten", description: errors.join(" \xB7 "), tone: "error" });
+    setBusy(false);
+  }
+  async function saveAlt(item, alt) {
+    const db = getDb();
+    if (!db) return;
+    await updateDoc(doc(db, "sites", siteId, "media", item.id), { alt });
+  }
+  async function remove(item) {
+    const db = getDb();
+    const bucket = getBucket();
+    if (!db) return;
+    const usedOn = await findMediaUsage(siteId, item);
+    const ok = await confirm({
+      title: "Afbeelding verwijderen?",
+      description: usedOn.length > 0 ? `Let op: deze afbeelding wordt gebruikt op ${usedOn.length} gepubliceerde pagina('s) (${usedOn.join(", ")}). Daar verschijnt dan een gebroken afbeelding.` : "De afbeelding wordt definitief verwijderd.",
+      confirmLabel: "Verwijderen",
+      tone: "danger"
+    });
+    if (!ok) return;
+    await deleteDoc(doc(db, "sites", siteId, "media", item.id));
+    if (bucket && item.path) {
+      try {
+        await deleteObject(storageRef(bucket, item.path));
+      } catch {
+      }
+    }
+    toast({ title: "Verwijderd" });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "grid gap-4", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(Button, { disabled: busy, onClick: () => inputRef.current?.click(), children: busy ? "Uploaden\u2026" : "Foto's uploaden" }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-slate-500", children: "Je kunt meerdere foto's tegelijk kiezen. Ze worden automatisch verkleind en geoptimaliseerd (webp) \u2014 dat houdt je site snel en bespaart opslag. Max. 15 MB per bestand." }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: inputRef,
+          type: "file",
+          accept: "image/*",
+          multiple: true,
+          hidden: true,
+          onChange: (e) => {
+            if (e.target.files?.length) void onFiles(e.target.files);
+            e.target.value = "";
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4", children: [
+      items.map((m) => /* @__PURE__ */ jsxs(Card, { className: "p-3", children: [
+        /* @__PURE__ */ jsx("img", { src: m.url, alt: m.alt ?? m.name, className: "mb-2 h-28 w-full rounded-md object-cover" }),
+        /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between gap-1", children: [
+          /* @__PURE__ */ jsxs("span", { className: "truncate text-xs text-slate-500", children: [
+            m.name,
+            m.width && /* @__PURE__ */ jsxs("span", { className: "text-slate-400", children: [
+              " \xB7 ",
+              m.width,
+              "\xD7",
+              m.height
+            ] })
+          ] }),
+          m.status === "processing" ? /* @__PURE__ */ jsx(Badge, { tone: "amber", children: "verwerken" }) : /* @__PURE__ */ jsx(Badge, { tone: "green", children: "klaar" })
+        ] }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            defaultValue: m.alt ?? "",
+            placeholder: "Alt-tekst",
+            className: "mb-2 h-8 text-xs",
+            onBlur: (e) => void saveAlt(m, e.target.value)
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", className: "text-xs", onClick: () => void navigator.clipboard?.writeText(m.url), children: "Kopieer URL" }),
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", className: "text-xs", onClick: () => void remove(m), children: "Verwijder" })
+        ] })
+      ] }, m.id)),
+      items.length === 0 && /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-500", children: "Nog geen media." })
+    ] })
+  ] });
+}
+export {
+  MediaManager
+};
+//# sourceMappingURL=MediaManager.js.map

package/dist/admin/media/MediaManager.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/media/MediaManager.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport {\n  collection,\n  deleteDoc,\n  doc,\n  onSnapshot,\n  orderBy,\n  query,\n  updateDoc,\n} from \"firebase/firestore\";\nimport { deleteObject, ref as storageRef } from \"firebase/storage\";\nimport { getBucket, getDb } from \"../../firebase/client\";\nimport type { MediaItem } from \"../../content/types\";\nimport { Button, Card, Badge, Input } from \"../ui/primitives\";\nimport { useToast } from \"../ui/toast\";\nimport { useConfirm } from \"../ui/ConfirmDialog\";\nimport { uploadImage } from \"../lib/upload\";\nimport { findMediaUsage } from \"../lib/mediaUsage\";\n\nexport function MediaManager({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const confirm = useConfirm();\n  const [items, setItems] = useState<MediaItem[]>([]);\n  const [busy, setBusy] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) return;\n    const q = query(collection(db, \"sites\", siteId, \"media\"), orderBy(\"createdAt\", \"desc\"));\n    return onSnapshot(q, (snap) =>\n      setItems(snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<MediaItem, \"id\">) }))),\n    );\n  }, [siteId]);\n\n  async function onFiles(files: FileList) {\n    setBusy(true);\n    let ok = 0;\n    const errors: string[] = [];\n    for (const file of Array.from(files)) {\n      try {\n        await uploadImage(siteId, file);\n        ok++;\n      } catch (e) {\n        errors.push(`${file.name}: ${(e as Error).message}`);\n      }\n    }\n    if (ok > 0) toast({ title: `${ok} foto('s) geüpload`, description: \"Automatisch verkleind; varianten worden op de achtergrond gemaakt.\", tone: \"success\" });\n    if (errors.length) toast({ title: \"Sommige uploads mislukten\", description: errors.join(\" · \"), tone: \"error\" });\n    setBusy(false);\n  }\n\n  async function saveAlt(item: MediaItem, alt: string) {\n    const db = getDb();\n    if (!db) return;\n    await updateDoc(doc(db, \"sites\", siteId, \"media\", item.id), { alt });\n  }\n\n  async function remove(item: MediaItem) {\n    const db = getDb();\n    const bucket = getBucket();\n    if (!db) return;\n    const usedOn = await findMediaUsage(siteId, item);\n    const ok = await confirm({\n      title: \"Afbeelding verwijderen?\",\n      description:\n        usedOn.length > 0\n          ? `Let op: deze afbeelding wordt gebruikt op ${usedOn.length} gepubliceerde pagina('s) (${usedOn.join(\", \")}). Daar verschijnt dan een gebroken afbeelding.`\n          : \"De afbeelding wordt definitief verwijderd.\",\n      confirmLabel: \"Verwijderen\",\n      tone: \"danger\",\n    });\n    if (!ok) return;\n    await deleteDoc(doc(db, \"sites\", siteId, \"media\", item.id));\n    if (bucket && item.path) {\n      try {\n        await deleteObject(storageRef(bucket, item.path));\n      } catch {\n        /* al weg — negeren */\n      }\n    }\n    toast({ title: \"Verwijderd\" });\n  }\n\n  return (\n    <div className=\"grid gap-4\">\n      <div>\n        <Button disabled={busy} onClick={() => inputRef.current?.click()}>\n          {busy ? \"Uploaden…\" : \"Foto's uploaden\"}\n        </Button>\n        <p className=\"mt-1 text-xs text-slate-500\">\n          Je kunt meerdere foto&apos;s tegelijk kiezen. Ze worden automatisch verkleind en geoptimaliseerd\n          (webp) — dat houdt je site snel en bespaart opslag. Max. 15 MB per bestand.\n        </p>\n        <input\n          ref={inputRef}\n          type=\"file\"\n          accept=\"image/*\"\n          multiple\n          hidden\n          onChange={(e) => {\n            if (e.target.files?.length) void onFiles(e.target.files);\n            e.target.value = \"\";\n          }}\n        />\n      </div>\n      <div className=\"grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4\">\n        {items.map((m) => (\n          <Card key={m.id} className=\"p-3\">\n            {/* eslint-disable-next-line @next/next/no-img-element */}\n            <img src={m.url} alt={m.alt ?? m.name} className=\"mb-2 h-28 w-full rounded-md object-cover\" />\n            <div className=\"mb-2 flex items-center justify-between gap-1\">\n              <span className=\"truncate text-xs text-slate-500\">\n                {m.name}\n                {(m as { width?: number; height?: number }).width && (\n                  <span className=\"text-slate-400\"> · {(m as { width?: number }).width}×{(m as { height?: number }).height}</span>\n                )}\n              </span>\n              {m.status === \"processing\" ? <Badge tone=\"amber\">verwerken</Badge> : <Badge tone=\"green\">klaar</Badge>}\n            </div>\n            <Input\n              defaultValue={m.alt ?? \"\"}\n              placeholder=\"Alt-tekst\"\n              className=\"mb-2 h-8 text-xs\"\n              onBlur={(e) => void saveAlt(m, e.target.value)}\n            />\n            <div className=\"flex gap-1\">\n              <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => void navigator.clipboard?.writeText(m.url)}>\n                Kopieer URL\n              </Button>\n              <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => void remove(m)}>\n                Verwijder\n              </Button>\n            </div>\n          </Card>\n        ))}\n        {items.length === 0 && <p className=\"text-sm text-slate-500\">Nog geen media.</p>}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/media/MediaPicker.d.ts

@@ -0,0 +1,24 @@
+export interface PickedMedia {
+    url: string;
+    mediaId: string;
+    alt?: string;
+}
+/** Gecontroleerde mediabibliotheek-kiezer (open/onOpenChange extern) — zoek + klik om te kiezen, of
+ *  upload direct. Gebruikt door de knop hieronder én door de inline beeld-vervangen in de editor. */
+export declare function MediaPickerDialog({ siteId, open, onOpenChange, onSelect, }: {
+    siteId: string;
+    open: boolean;
+    onOpenChange: (v: boolean) => void;
+    onSelect: (m: PickedMedia) => void;
+}): import("react").JSX.Element;
+/**
+ * Knop die de mediabibliotheek-kiezer opent: zoek + klik om een bestaande afbeelding te kiezen, of
+ * upload er direct een nieuwe in. Vervangt het plakken van losse URL's.
+ */
+export declare function MediaPickerButton({ siteId, onSelect, label, size, variant, }: {
+    siteId: string;
+    onSelect: (m: PickedMedia) => void;
+    label?: string;
+    size?: "sm" | "md";
+    variant?: "primary" | "secondary" | "ghost";
+}): import("react").JSX.Element;

package/dist/admin/media/MediaPicker.js

@@ -0,0 +1,93 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { collection, onSnapshot, orderBy, query } from "firebase/firestore";
+import { getDb } from "../../firebase/client";
+import { Button, Input } from "../ui/primitives";
+import { Dialog, DialogContent } from "../ui/dialog";
+import { useToast } from "../ui/toast";
+import { uploadImage } from "../lib/upload";
+function MediaPickerDialog({
+  siteId,
+  open,
+  onOpenChange,
+  onSelect
+}) {
+  const { toast } = useToast();
+  const [items, setItems] = useState([]);
+  const [q, setQ] = useState("");
+  const [busy, setBusy] = useState(false);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (!open) return;
+    const db = getDb();
+    if (!db) return;
+    const qy = query(collection(db, "sites", siteId, "media"), orderBy("createdAt", "desc"));
+    return onSnapshot(
+      qy,
+      (snap) => setItems(snap.docs.map((d) => ({ id: d.id, ...d.data() })))
+    );
+  }, [open, siteId]);
+  const filtered = useMemo(() => {
+    const term = q.trim().toLowerCase();
+    if (!term) return items;
+    return items.filter((m) => `${m.name ?? ""} ${m.alt ?? ""}`.toLowerCase().includes(term));
+  }, [items, q]);
+  function pick(m) {
+    onSelect({ url: m.url, mediaId: m.id, alt: m.alt });
+    onOpenChange(false);
+  }
+  async function onUpload(files) {
+    const f = files?.[0];
+    if (!f) return;
+    setBusy(true);
+    try {
+      const { url, mediaId } = await uploadImage(siteId, f);
+      onSelect({ url, mediaId, alt: "" });
+      onOpenChange(false);
+    } catch (err) {
+      toast({ title: "Upload mislukt", description: err.message, tone: "error" });
+    } finally {
+      setBusy(false);
+    }
+  }
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { title: "Afbeelding kiezen", className: "max-w-2xl", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(Input, { value: q, onChange: (e) => setQ(e.target.value), placeholder: "Zoek in bibliotheek\u2026", className: "h-9" }),
+      /* @__PURE__ */ jsx(Button, { type: "button", disabled: busy, onClick: () => inputRef.current?.click(), children: busy ? "Uploaden\u2026" : "Upload nieuwe" }),
+      /* @__PURE__ */ jsx("input", { ref: inputRef, type: "file", accept: "image/*", hidden: true, onChange: (e) => {
+        void onUpload(e.target.files);
+        e.target.value = "";
+      } })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "max-h-[55vh] overflow-y-auto", children: filtered.length === 0 ? /* @__PURE__ */ jsx("p", { className: "py-8 text-center text-sm text-slate-500", children: items.length === 0 ? "Nog geen afbeeldingen \u2014 upload er een." : "Geen resultaten." }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-2 sm:grid-cols-4", children: filtered.map((m) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => pick(m),
+        title: m.alt || m.name,
+        className: "group relative overflow-hidden rounded-md border border-slate-200 focus:outline-none focus:ring-2 focus:ring-indigo-500",
+        children: /* @__PURE__ */ jsx("img", { src: m.url, alt: m.alt ?? m.name, className: "aspect-square w-full object-cover transition group-hover:opacity-80" })
+      },
+      m.id
+    )) }) })
+  ] }) });
+}
+function MediaPickerButton({
+  siteId,
+  onSelect,
+  label = "Kies / upload",
+  size = "sm",
+  variant = "secondary"
+}) {
+  const [open, setOpen] = useState(false);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Button, { type: "button", variant, size, onClick: () => setOpen(true), children: label }),
+    /* @__PURE__ */ jsx(MediaPickerDialog, { siteId, open, onOpenChange: setOpen, onSelect })
+  ] });
+}
+export {
+  MediaPickerButton,
+  MediaPickerDialog
+};
+//# sourceMappingURL=MediaPicker.js.map

package/dist/admin/media/MediaPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/media/MediaPicker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { collection, onSnapshot, orderBy, query } from \"firebase/firestore\";\nimport { getDb } from \"../../firebase/client\";\nimport type { MediaItem } from \"../../content/types\";\nimport { Button, Input } from \"../ui/primitives\";\nimport { Dialog, DialogContent } from \"../ui/dialog\";\nimport { useToast } from \"../ui/toast\";\nimport { uploadImage } from \"../lib/upload\";\n\nexport interface PickedMedia {\n  url: string;\n  mediaId: string;\n  alt?: string;\n}\n\n/** Gecontroleerde mediabibliotheek-kiezer (open/onOpenChange extern) — zoek + klik om te kiezen, of\n *  upload direct. Gebruikt door de knop hieronder én door de inline beeld-vervangen in de editor. */\nexport function MediaPickerDialog({\n  siteId,\n  open,\n  onOpenChange,\n  onSelect,\n}: {\n  siteId: string;\n  open: boolean;\n  onOpenChange: (v: boolean) => void;\n  onSelect: (m: PickedMedia) => void;\n}) {\n  const { toast } = useToast();\n  const [items, setItems] = useState<MediaItem[]>([]);\n  const [q, setQ] = useState(\"\");\n  const [busy, setBusy] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (!open) return;\n    const db = getDb();\n    if (!db) return;\n    const qy = query(collection(db, \"sites\", siteId, \"media\"), orderBy(\"createdAt\", \"desc\"));\n    return onSnapshot(qy, (snap) =>\n      setItems(snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<MediaItem, \"id\">) }))),\n    );\n  }, [open, siteId]);\n\n  const filtered = useMemo(() => {\n    const term = q.trim().toLowerCase();\n    if (!term) return items;\n    return items.filter((m) => `${m.name ?? \"\"} ${m.alt ?? \"\"}`.toLowerCase().includes(term));\n  }, [items, q]);\n\n  function pick(m: MediaItem) {\n    onSelect({ url: m.url, mediaId: m.id, alt: m.alt });\n    onOpenChange(false);\n  }\n\n  async function onUpload(files: FileList | null) {\n    const f = files?.[0];\n    if (!f) return;\n    setBusy(true);\n    try {\n      const { url, mediaId } = await uploadImage(siteId, f);\n      onSelect({ url, mediaId, alt: \"\" });\n      onOpenChange(false);\n    } catch (err) {\n      toast({ title: \"Upload mislukt\", description: (err as Error).message, tone: \"error\" });\n    } finally {\n      setBusy(false);\n    }\n  }\n\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent title=\"Afbeelding kiezen\" className=\"max-w-2xl\">\n        <div className=\"mb-3 flex items-center gap-2\">\n          <Input value={q} onChange={(e) => setQ(e.target.value)} placeholder=\"Zoek in bibliotheek…\" className=\"h-9\" />\n          <Button type=\"button\" disabled={busy} onClick={() => inputRef.current?.click()}>\n            {busy ? \"Uploaden…\" : \"Upload nieuwe\"}\n          </Button>\n          <input ref={inputRef} type=\"file\" accept=\"image/*\" hidden onChange={(e) => { void onUpload(e.target.files); e.target.value = \"\"; }} />\n        </div>\n        <div className=\"max-h-[55vh] overflow-y-auto\">\n          {filtered.length === 0 ? (\n            <p className=\"py-8 text-center text-sm text-slate-500\">\n              {items.length === 0 ? \"Nog geen afbeeldingen — upload er een.\" : \"Geen resultaten.\"}\n            </p>\n          ) : (\n            <div className=\"grid grid-cols-3 gap-2 sm:grid-cols-4\">\n              {filtered.map((m) => (\n                <button\n                  key={m.id}\n                  type=\"button\"\n                  onClick={() => pick(m)}\n                  title={m.alt || m.name}\n                  className=\"group relative overflow-hidden rounded-md border border-slate-200 focus:outline-none focus:ring-2 focus:ring-indigo-500\"\n                >\n                  {/* eslint-disable-next-line @next/next/no-img-element */}\n                  <img src={m.url} alt={m.alt ?? m.name} className=\"aspect-square w-full object-cover transition group-hover:opacity-80\" />\n                </button>\n              ))}\n            </div>\n          )}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n\n/**\n * Knop die de mediabibliotheek-kiezer opent: zoek + klik om een bestaande afbeelding te kiezen, of\n * upload er direct een nieuwe in. Vervangt het plakken van losse URL's.\n */\nexport function MediaPickerButton({\n  siteId,\n  onSelect,\n  label = \"Kies / upload\",\n  size = \"sm\",\n  variant = \"secondary\",\n}: {\n  siteId: string;\n  onSelect: (m: PickedMedia) => void;\n  label?: string;\n  size?: \"sm\" | \"md\";\n  variant?: \"primary\" | \"secondary\" | \"ghost\";\n}) {\n  const [open, setOpen] = useState(false);\n  return (\n    <>\n      <Button type=\"button\" variant={variant} size={size} onClick={() => setOpen(true)}>{label}</Button>\n      <MediaPickerDialog siteId={siteId} open={open} onOpenChange={setOpen} onSelect={onSelect} />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/pages/PageEditor.d.ts

@@ -0,0 +1,5 @@
+import { type DraftPage } from "../lib/pagesClient";
+export declare function PageEditor({ siteId, page }: {
+    siteId: string;
+    page: DraftPage;
+}): import("react").JSX.Element;