@xiwebdesign/xicms-core 7.30.0 → 8.15.0

package/dist/blocks/builtins/lib/bookingUrl.d.ts

@@ -4,5 +4,5 @@
  * volledige embed-URL. Puur en getest — de provider-keuze in de editor doet hiermee écht iets
  * (voorheen was hij alleen een hint).
  */
-export type BookingProvider = "custom" | "calendly" | "cal" | "formitable" | "resengo" | "thefork" | "treatwell" | "salonized" | "tablebooker" | "bookingkit";
-export declare function buildBookingUrl(provider: BookingProvider, input: string): string;
+export type BookingProvider = "custom" | "calendly" | "cal" | "formitable" | "resengo" | "thefork" | "treatwell" | "salonized" | "tablebooker" | "bookingkit" | "lodgify" | "bookingexperts" | "tommy" | "bookingmotor";
+export declare function buildBookingUrl(provider: BookingProvider, input: string | undefined): string;

package/dist/blocks/builtins/lib/bookingUrl.js

@@ -1,5 +1,5 @@
 function buildBookingUrl(provider, input) {
-  const raw = input.trim();
+  const raw = (input ?? "").trim();
   if (!raw) return "";
   const isUrl = /^https?:\/\//i.test(raw);
   switch (provider) {

package/dist/blocks/builtins/lib/bookingUrl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/blocks/builtins/lib/bookingUrl.ts"],"sourcesContent":["/**\n * Bouwt de embed-URL voor een reserveersysteem uit wat de klant plakt: een volledige URL wordt\n * genormaliseerd naar de embed-variant van de provider; een kale slug/id wordt aangevuld tot de\n * volledige embed-URL. Puur en getest — de provider-keuze in de editor doet hiermee écht iets\n * (voorheen was hij alleen een hint).\n */\nexport type BookingProvider =\n  | \"custom\"\n  | \"calendly\"\n  | \"cal\"\n  | \"formitable\"\n  | \"resengo\"\n  | \"thefork\"\n  | \"treatwell\"\n  | \"salonized\"\n  | \"tablebooker\"\n  | \"bookingkit\";\n\nexport function buildBookingUrl(provider: BookingProvider, input: string): string {\n  const raw = input.trim();\n  if (!raw) return \"\";\n  const isUrl = /^https?:\\/\\//i.test(raw);\n\n  switch (provider) {\n    case \"calendly\": {\n      // Volledige link werkt direct als embed; een slug (\"naam/intake\") vullen we aan.\n      if (isUrl) return raw;\n      return `https://calendly.com/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"cal\": {\n      if (isUrl) return raw;\n      return `https://cal.com/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"formitable\": {\n      // Embed-vorm: https://widget.formitable.com/<restaurant-id>\n      if (isUrl) return raw;\n      return `https://widget.formitable.com/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"resengo\": {\n      if (isUrl) return raw;\n      return `https://www.resengo.com/widget/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"thefork\": {\n      if (isUrl) return raw;\n      return `https://module.lafourchette.com/nl_NL/module/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"treatwell\": {\n      if (isUrl) return raw;\n      return `https://widget.treatwell.nl/salon/${raw.replace(/^\\/+/, \"\")}/`;\n    }\n    case \"salonized\": {\n      // Salonized-bookingwidget: https://widget.salonized.com/widget_bookings/new?company=<id>\n      if (isUrl) return raw;\n      return `https://widget.salonized.com/widget_bookings/new?company=${encodeURIComponent(raw)}`;\n    }\n    case \"tablebooker\": {\n      if (isUrl) return raw;\n      return `https://book.tablebooker.com/widget/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"bookingkit\": {\n      if (isUrl) return raw;\n      return `https://widget.bookingkit.net/bkembed/?cw=${encodeURIComponent(raw)}`;\n    }\n    case \"custom\":\n    default:\n      return isUrl ? raw : \"\";\n  }\n}\n"],"mappings":"AAkBO,SAAS,gBAAgB,UAA2B,OAAuB;AAChF,QAAM,MAAM,MAAM,KAAK;AACvB,MAAI,CAAC,IAAK,QAAO;AACjB,QAAM,QAAQ,gBAAgB,KAAK,GAAG;AAEtC,UAAQ,UAAU;AAAA,IAChB,KAAK,YAAY;AAEf,UAAI,MAAO,QAAO;AAClB,aAAO,wBAAwB,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACxD;AAAA,IACA,KAAK,OAAO;AACV,UAAI,MAAO,QAAO;AAClB,aAAO,mBAAmB,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACnD;AAAA,IACA,KAAK,cAAc;AAEjB,UAAI,MAAO,QAAO;AAClB,aAAO,iCAAiC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACjE;AAAA,IACA,KAAK,WAAW;AACd,UAAI,MAAO,QAAO;AAClB,aAAO,kCAAkC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IAClE;AAAA,IACA,KAAK,WAAW;AACd,UAAI,MAAO,QAAO;AAClB,aAAO,gDAAgD,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IAChF;AAAA,IACA,KAAK,aAAa;AAChB,UAAI,MAAO,QAAO;AAClB,aAAO,qCAAqC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACrE;AAAA,IACA,KAAK,aAAa;AAEhB,UAAI,MAAO,QAAO;AAClB,aAAO,4DAA4D,mBAAmB,GAAG,CAAC;AAAA,IAC5F;AAAA,IACA,KAAK,eAAe;AAClB,UAAI,MAAO,QAAO;AAClB,aAAO,uCAAuC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACvE;AAAA,IACA,KAAK,cAAc;AACjB,UAAI,MAAO,QAAO;AAClB,aAAO,6CAA6C,mBAAmB,GAAG,CAAC;AAAA,IAC7E;AAAA,IACA,KAAK;AAAA,IACL;AACE,aAAO,QAAQ,MAAM;AAAA,EACzB;AACF;","names":[]}
+{"version":3,"sources":["../../../../src/blocks/builtins/lib/bookingUrl.ts"],"sourcesContent":["/**\n * Bouwt de embed-URL voor een reserveersysteem uit wat de klant plakt: een volledige URL wordt\n * genormaliseerd naar de embed-variant van de provider; een kale slug/id wordt aangevuld tot de\n * volledige embed-URL. Puur en getest — de provider-keuze in de editor doet hiermee écht iets\n * (voorheen was hij alleen een hint).\n */\nexport type BookingProvider =\n  | \"custom\"\n  | \"calendly\"\n  | \"cal\"\n  | \"formitable\"\n  | \"resengo\"\n  | \"thefork\"\n  | \"treatwell\"\n  | \"salonized\"\n  | \"tablebooker\"\n  | \"bookingkit\"\n  | \"lodgify\"\n  | \"bookingexperts\"\n  | \"tommy\"\n  | \"bookingmotor\";\n\nexport function buildBookingUrl(provider: BookingProvider, input: string | undefined): string {\n  const raw = (input ?? \"\").trim();\n  if (!raw) return \"\";\n  const isUrl = /^https?:\\/\\//i.test(raw);\n\n  switch (provider) {\n    case \"calendly\": {\n      // Volledige link werkt direct als embed; een slug (\"naam/intake\") vullen we aan.\n      if (isUrl) return raw;\n      return `https://calendly.com/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"cal\": {\n      if (isUrl) return raw;\n      return `https://cal.com/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"formitable\": {\n      // Embed-vorm: https://widget.formitable.com/<restaurant-id>\n      if (isUrl) return raw;\n      return `https://widget.formitable.com/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"resengo\": {\n      if (isUrl) return raw;\n      return `https://www.resengo.com/widget/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"thefork\": {\n      if (isUrl) return raw;\n      return `https://module.lafourchette.com/nl_NL/module/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"treatwell\": {\n      if (isUrl) return raw;\n      return `https://widget.treatwell.nl/salon/${raw.replace(/^\\/+/, \"\")}/`;\n    }\n    case \"salonized\": {\n      // Salonized-bookingwidget: https://widget.salonized.com/widget_bookings/new?company=<id>\n      if (isUrl) return raw;\n      return `https://widget.salonized.com/widget_bookings/new?company=${encodeURIComponent(raw)}`;\n    }\n    case \"tablebooker\": {\n      if (isUrl) return raw;\n      return `https://book.tablebooker.com/widget/${raw.replace(/^\\/+/, \"\")}`;\n    }\n    case \"bookingkit\": {\n      if (isUrl) return raw;\n      return `https://widget.bookingkit.net/bkembed/?cw=${encodeURIComponent(raw)}`;\n    }\n    case \"custom\":\n    default:\n      return isUrl ? raw : \"\";\n  }\n}\n"],"mappings":"AAsBO,SAAS,gBAAgB,UAA2B,OAAmC;AAC5F,QAAM,OAAO,SAAS,IAAI,KAAK;AAC/B,MAAI,CAAC,IAAK,QAAO;AACjB,QAAM,QAAQ,gBAAgB,KAAK,GAAG;AAEtC,UAAQ,UAAU;AAAA,IAChB,KAAK,YAAY;AAEf,UAAI,MAAO,QAAO;AAClB,aAAO,wBAAwB,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACxD;AAAA,IACA,KAAK,OAAO;AACV,UAAI,MAAO,QAAO;AAClB,aAAO,mBAAmB,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACnD;AAAA,IACA,KAAK,cAAc;AAEjB,UAAI,MAAO,QAAO;AAClB,aAAO,iCAAiC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACjE;AAAA,IACA,KAAK,WAAW;AACd,UAAI,MAAO,QAAO;AAClB,aAAO,kCAAkC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IAClE;AAAA,IACA,KAAK,WAAW;AACd,UAAI,MAAO,QAAO;AAClB,aAAO,gDAAgD,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IAChF;AAAA,IACA,KAAK,aAAa;AAChB,UAAI,MAAO,QAAO;AAClB,aAAO,qCAAqC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACrE;AAAA,IACA,KAAK,aAAa;AAEhB,UAAI,MAAO,QAAO;AAClB,aAAO,4DAA4D,mBAAmB,GAAG,CAAC;AAAA,IAC5F;AAAA,IACA,KAAK,eAAe;AAClB,UAAI,MAAO,QAAO;AAClB,aAAO,uCAAuC,IAAI,QAAQ,QAAQ,EAAE,CAAC;AAAA,IACvE;AAAA,IACA,KAAK,cAAc;AACjB,UAAI,MAAO,QAAO;AAClB,aAAO,6CAA6C,mBAAmB,GAAG,CAAC;AAAA,IAC7E;AAAA,IACA,KAAK;AAAA,IACL;AACE,aAAO,QAAQ,MAAM;AAAA,EACzB;AACF;","names":[]}

package/dist/blocks/builtins/lib/ical.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Bezette dagen uit een iCal-agenda (8.15), voor de beschikbaarheidskalender.
+ *
+ * Airbnb, Booking.com, Vrbo, availcalendar en de meeste verhuursystemen exporteren hun boekingen
+ * als iCal-link (`.ics`). Elke VEVENT is een bezette periode: DTSTART tot (exclusief) DTEND —
+ * precies zoals een overnachting werkt: aankomst op de 1e, vertrek op de 8e = de nachten 1 t/m 7
+ * zijn bezet, en op de 8e kan een nieuwe gast aankomen. Puur en getest; de server haalt de agenda op.
+ */
+export interface Bezet {
+    /** Eerste bezette dag, "2026-07-01". */
+    van: string;
+    /** Eerste VRIJE dag erna (vertrekdag), "2026-07-08". */
+    tot: string;
+}
+/** Alle bezette periodes uit de tekst van een .ics-bestand, gesorteerd en samengevoegd. */
+export declare function parseIcalBezet(tekst: string): Bezet[];
+/** Is deze nacht (aankomstdag) bezet? */
+export declare function isBezet(dag: string, bezet: Bezet[]): boolean;
+/** Zit er een bezette nacht tussen aankomst (incl.) en vertrek (excl.)? */
+export declare function periodeVrij(van: string, tot: string, bezet: Bezet[]): boolean;
+/** De weken van een maand, maandag eerst; `null` = dag buiten de maand. */
+export declare function maandRaster(jaar: number, maand: number): (string | null)[][];
+/** Mag de server deze link ophalen? Alleen https naar een gewone hostnaam (geen IP, geen intern adres). */
+export declare function veiligeIcalUrl(url: string): boolean;

package/dist/blocks/builtins/lib/ical.js

@@ -0,0 +1,82 @@
+function datumUit(waarde) {
+  const m = /^(\d{4})(\d{2})(\d{2})/.exec(waarde.trim());
+  return m ? `${m[1]}-${m[2]}-${m[3]}` : null;
+}
+function volgendeDag(iso) {
+  const [j, m, d] = iso.split("-").map(Number);
+  const dt = new Date(Date.UTC(j, m - 1, d + 1));
+  return dt.toISOString().slice(0, 10);
+}
+function parseIcalBezet(tekst) {
+  const regels = tekst.replace(/\r?\n[ \t]/g, "").split(/\r?\n/);
+  const uit = [];
+  let inEvent = false;
+  let start = null;
+  let eind = null;
+  let geannuleerd = false;
+  for (const regel of regels) {
+    if (regel === "BEGIN:VEVENT") {
+      inEvent = true;
+      start = eind = null;
+      geannuleerd = false;
+    } else if (regel === "END:VEVENT") {
+      if (start && !geannuleerd) {
+        const tot = eind && eind > start ? eind : volgendeDag(start);
+        uit.push({ van: start, tot });
+      }
+      inEvent = false;
+    } else if (inEvent) {
+      const [sleutel, ...rest] = regel.split(":");
+      const waarde = rest.join(":");
+      const naam = sleutel.split(";")[0].toUpperCase();
+      if (naam === "DTSTART") start = datumUit(waarde);
+      else if (naam === "DTEND") eind = datumUit(waarde);
+      else if (naam === "STATUS" && /CANCELLED/i.test(waarde)) geannuleerd = true;
+    }
+  }
+  uit.sort((a, b) => a.van.localeCompare(b.van));
+  const samen = [];
+  for (const b of uit) {
+    const laatste = samen[samen.length - 1];
+    if (laatste && b.van <= laatste.tot) laatste.tot = b.tot > laatste.tot ? b.tot : laatste.tot;
+    else samen.push({ ...b });
+  }
+  return samen;
+}
+function isBezet(dag, bezet) {
+  return bezet.some((b) => b.van <= dag && dag < b.tot);
+}
+function periodeVrij(van, tot, bezet) {
+  return tot > van && !bezet.some((b) => b.van < tot && van < b.tot);
+}
+function maandRaster(jaar, maand) {
+  const eerste = new Date(Date.UTC(jaar, maand, 1));
+  const dagen = new Date(Date.UTC(jaar, maand + 1, 0)).getUTCDate();
+  const offset = (eerste.getUTCDay() + 6) % 7;
+  const cellen = Array.from({ length: offset }, () => null);
+  for (let d = 1; d <= dagen; d++) cellen.push(`${jaar}-${String(maand + 1).padStart(2, "0")}-${String(d).padStart(2, "0")}`);
+  while (cellen.length % 7) cellen.push(null);
+  const weken = [];
+  for (let i = 0; i < cellen.length; i += 7) weken.push(cellen.slice(i, i + 7));
+  return weken;
+}
+function veiligeIcalUrl(url) {
+  try {
+    const u = new URL(url.replace(/^webcal:\/\//i, "https://"));
+    if (u.protocol !== "https:") return false;
+    const h = u.hostname.toLowerCase();
+    if (h === "localhost" || h.endsWith(".local") || h.endsWith(".internal")) return false;
+    if (/^\d+\.\d+\.\d+\.\d+$/.test(h) || h.includes(":") || h.startsWith("[")) return false;
+    return h.includes(".");
+  } catch {
+    return false;
+  }
+}
+export {
+  isBezet,
+  maandRaster,
+  parseIcalBezet,
+  periodeVrij,
+  veiligeIcalUrl
+};
+//# sourceMappingURL=ical.js.map

package/dist/blocks/builtins/lib/ical.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/blocks/builtins/lib/ical.ts"],"sourcesContent":["/**\n * Bezette dagen uit een iCal-agenda (8.15), voor de beschikbaarheidskalender.\n *\n * Airbnb, Booking.com, Vrbo, availcalendar en de meeste verhuursystemen exporteren hun boekingen\n * als iCal-link (`.ics`). Elke VEVENT is een bezette periode: DTSTART tot (exclusief) DTEND —\n * precies zoals een overnachting werkt: aankomst op de 1e, vertrek op de 8e = de nachten 1 t/m 7\n * zijn bezet, en op de 8e kan een nieuwe gast aankomen. Puur en getest; de server haalt de agenda op.\n */\nexport interface Bezet {\n  /** Eerste bezette dag, \"2026-07-01\". */\n  van: string;\n  /** Eerste VRIJE dag erna (vertrekdag), \"2026-07-08\". */\n  tot: string;\n}\n\nfunction datumUit(waarde: string): string | null {\n  // \"20260701\", \"20260701T150000Z\", \"20260701T150000\"\n  const m = /^(\\d{4})(\\d{2})(\\d{2})/.exec(waarde.trim());\n  return m ? `${m[1]}-${m[2]}-${m[3]}` : null;\n}\n\nfunction volgendeDag(iso: string): string {\n  const [j, m, d] = iso.split(\"-\").map(Number);\n  const dt = new Date(Date.UTC(j, m - 1, d + 1));\n  return dt.toISOString().slice(0, 10);\n}\n\n/** Alle bezette periodes uit de tekst van een .ics-bestand, gesorteerd en samengevoegd. */\nexport function parseIcalBezet(tekst: string): Bezet[] {\n  // Regels die met een spatie beginnen zijn een vervolg van de vorige (RFC 5545 \"folding\").\n  const regels = tekst.replace(/\\r?\\n[ \\t]/g, \"\").split(/\\r?\\n/);\n  const uit: Bezet[] = [];\n  let inEvent = false;\n  let start: string | null = null;\n  let eind: string | null = null;\n  let geannuleerd = false;\n  for (const regel of regels) {\n    if (regel === \"BEGIN:VEVENT\") {\n      inEvent = true;\n      start = eind = null;\n      geannuleerd = false;\n    } else if (regel === \"END:VEVENT\") {\n      if (start && !geannuleerd) {\n        const tot = eind && eind > start ? eind : volgendeDag(start);\n        uit.push({ van: start, tot });\n      }\n      inEvent = false;\n    } else if (inEvent) {\n      const [sleutel, ...rest] = regel.split(\":\");\n      const waarde = rest.join(\":\");\n      const naam = sleutel.split(\";\")[0].toUpperCase();\n      if (naam === \"DTSTART\") start = datumUit(waarde);\n      else if (naam === \"DTEND\") eind = datumUit(waarde);\n      else if (naam === \"STATUS\" && /CANCELLED/i.test(waarde)) geannuleerd = true;\n    }\n  }\n  // Samenvoegen van aansluitende of overlappende periodes.\n  uit.sort((a, b) => a.van.localeCompare(b.van));\n  const samen: Bezet[] = [];\n  for (const b of uit) {\n    const laatste = samen[samen.length - 1];\n    if (laatste && b.van <= laatste.tot) laatste.tot = b.tot > laatste.tot ? b.tot : laatste.tot;\n    else samen.push({ ...b });\n  }\n  return samen;\n}\n\n/** Is deze nacht (aankomstdag) bezet? */\nexport function isBezet(dag: string, bezet: Bezet[]): boolean {\n  return bezet.some((b) => b.van <= dag && dag < b.tot);\n}\n\n/** Zit er een bezette nacht tussen aankomst (incl.) en vertrek (excl.)? */\nexport function periodeVrij(van: string, tot: string, bezet: Bezet[]): boolean {\n  return tot > van && !bezet.some((b) => b.van < tot && van < b.tot);\n}\n\n/** De weken van een maand, maandag eerst; `null` = dag buiten de maand. */\nexport function maandRaster(jaar: number, maand: number): (string | null)[][] {\n  const eerste = new Date(Date.UTC(jaar, maand, 1));\n  const dagen = new Date(Date.UTC(jaar, maand + 1, 0)).getUTCDate();\n  const offset = (eerste.getUTCDay() + 6) % 7; // maandag = 0\n  const cellen: (string | null)[] = Array.from({ length: offset }, () => null);\n  for (let d = 1; d <= dagen; d++) cellen.push(`${jaar}-${String(maand + 1).padStart(2, \"0\")}-${String(d).padStart(2, \"0\")}`);\n  while (cellen.length % 7) cellen.push(null);\n  const weken: (string | null)[][] = [];\n  for (let i = 0; i < cellen.length; i += 7) weken.push(cellen.slice(i, i + 7));\n  return weken;\n}\n\n/** Mag de server deze link ophalen? Alleen https naar een gewone hostnaam (geen IP, geen intern adres). */\nexport function veiligeIcalUrl(url: string): boolean {\n  try {\n    const u = new URL(url.replace(/^webcal:\\/\\//i, \"https://\"));\n    if (u.protocol !== \"https:\") return false;\n    const h = u.hostname.toLowerCase();\n    if (h === \"localhost\" || h.endsWith(\".local\") || h.endsWith(\".internal\")) return false;\n    if (/^\\d+\\.\\d+\\.\\d+\\.\\d+$/.test(h) || h.includes(\":\") || h.startsWith(\"[\")) return false;\n    return h.includes(\".\");\n  } catch {\n    return false;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/blocks/builtins/lib/vandaag.d.ts

@@ -0,0 +1,8 @@
+/**
+ * "Vandaag" zonder hydratie-mismatch (8.1). Een datumfilter in de render (verlopen agenda-items,
+ * ingepland nieuws) gaf op de server een ander resultaat dan in de browser zodra de HTML uit de
+ * cache een dag oud was — React gooide dan de hele server-render weg en bouwde alles opnieuw.
+ * Tijdens server-render én hydratie is dit `null` (= niet op datum filteren, identiek aan de
+ * server); direct daarna de echte datum van de bezoeker.
+ */
+export declare function useVandaag(): Date | null;

package/dist/blocks/builtins/lib/vandaag.js

@@ -0,0 +1,22 @@
+"use client";
+import { useSyncExternalStore } from "react";
+const geenAbonnement = () => () => {
+};
+function useVandaag() {
+  return useSyncExternalStore(geenAbonnement, vandaagSnapshot, () => null);
+}
+let cache = null;
+function vandaagSnapshot() {
+  const nu = /* @__PURE__ */ new Date();
+  const dag = nu.toDateString();
+  if (!cache || cache.dag !== dag) {
+    const d = new Date(nu);
+    d.setHours(0, 0, 0, 0);
+    cache = { dag, datum: d };
+  }
+  return cache.datum;
+}
+export {
+  useVandaag
+};
+//# sourceMappingURL=vandaag.js.map

package/dist/blocks/builtins/lib/vandaag.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/blocks/builtins/lib/vandaag.ts"],"sourcesContent":["\"use client\";\n\nimport { useSyncExternalStore } from \"react\";\n\nconst geenAbonnement = () => () => {};\n\n/**\n * \"Vandaag\" zonder hydratie-mismatch (8.1). Een datumfilter in de render (verlopen agenda-items,\n * ingepland nieuws) gaf op de server een ander resultaat dan in de browser zodra de HTML uit de\n * cache een dag oud was — React gooide dan de hele server-render weg en bouwde alles opnieuw.\n * Tijdens server-render én hydratie is dit `null` (= niet op datum filteren, identiek aan de\n * server); direct daarna de echte datum van de bezoeker.\n */\nexport function useVandaag(): Date | null {\n  return useSyncExternalStore(geenAbonnement, vandaagSnapshot, () => null);\n}\n\nlet cache: { dag: string; datum: Date } | null = null;\nfunction vandaagSnapshot(): Date {\n  // Stabiele referentie per dag: useSyncExternalStore eist dat opeenvolgende snapshots gelijk zijn.\n  const nu = new Date();\n  const dag = nu.toDateString();\n  if (!cache || cache.dag !== dag) {\n    const d = new Date(nu);\n    d.setHours(0, 0, 0, 0);\n    cache = { dag, datum: d };\n  }\n  return cache.datum;\n}\n"],"mappings":";AAEA,SAAS,4BAA4B;AAErC,MAAM,iBAAiB,MAAM,MAAM;AAAC;AAS7B,SAAS,aAA0B;AACxC,SAAO,qBAAqB,gBAAgB,iBAAiB,MAAM,IAAI;AACzE;AAEA,IAAI,QAA6C;AACjD,SAAS,kBAAwB;AAE/B,QAAM,KAAK,oBAAI,KAAK;AACpB,QAAM,MAAM,GAAG,aAAa;AAC5B,MAAI,CAAC,SAAS,MAAM,QAAQ,KAAK;AAC/B,UAAM,IAAI,IAAI,KAAK,EAAE;AACrB,MAAE,SAAS,GAAG,GAAG,GAAG,CAAC;AACrB,YAAQ,EAAE,KAAK,OAAO,EAAE;AAAA,EAC1B;AACA,SAAO,MAAM;AACf;","names":[]}

package/dist/blocks/registry.d.ts

@@ -57,6 +57,12 @@ export interface BlockDefinition<S extends $ZodType = $ZodType> {
      * Zie `introspectToFields` (admin/lib/zodFields.ts) en `schema/fields.ts`.
      */
     fields?: FieldHints;
+    /**
+     * 8.10: een blok waar de werking van de site op leunt (winkelwagen, afrekenen, formulier).
+     * Verwijderen in de editor vraagt dan eerst om bevestiging met deze uitleg; gewone blokken gaan
+     * met één klik weg (er is ongedaan maken). De tekst zegt wat er stuk gaat, in klanttaal.
+     */
+    essentieel?: string;
 }
 /**
  * Registreert een block-type.

package/dist/blocks/registry.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/blocks/registry.ts"],"sourcesContent":["/**\n * Block-registry: koppelt een `_type` aan zijn Zod-schema, een (server-safe) Render-component\n * en een optionele (client/admin) Editor. Klant-blokken worden hier ingebracht via `defineBlock`\n * — zo blijft de core klant-onafhankelijk: de klant levert de render-component, core de structuur.\n *\n * Pure logica + types (geen \"use client\"): bruikbaar op server en client.\n */\nimport type { ComponentType } from \"react\";\nimport type { $ZodType } from \"zod/v4/core\";\nimport type { BlockBase } from \"../schema/blocks\";\nimport type { FieldHints } from \"../schema/fields\";\n\n/**\n * Het uitvoertype van een blok-schema, onafhankelijk van de Zod-façade.\n *\n * Core draait op `zod/mini` (zie schema/) omdat de classic-façade niet tree-shaket en ~300 KB aan\n * de publieke bundel toevoegde. De grens hieronder is daarom `$ZodType` uit `zod/v4/core` — de\n * gedeelde bovengrens van BEIDE smaken. Gevolg: een klantrepo mag zijn eigen blok-schema's zowel\n * met `zod` als met `zod/mini` schrijven; `defineBlock` accepteert allebei.\n */\ntype InferBlock<S extends $ZodType> = S[\"_zod\"][\"output\"];\n\nexport interface BlockRenderProps<T = unknown> {\n  block: T;\n  siteId: string;\n  /** \"view\" = publiek; \"preview\" = draft-weergave in de editor. */\n  mode?: \"view\" | \"preview\";\n}\n\nexport interface BlockEditorProps<T = unknown> {\n  block: T;\n  siteId: string;\n  onChange: (next: T) => void;\n}\n\n/**\n * Indeling van een block in het toevoeg-menu:\n * - `content` (default): een gewoon blok dat je op de pagina plaatst.\n * - `widget`: een compacte variant die je naast een blok (in een zijbalk/kolom) zet — haalt z'n\n *   gegevens uit dezelfde module als de volwaardige versie (bv. \"laatste nieuws\", \"komende agenda\").\n * - `layout`: een indelingsblok dat andere blokken bevat (kolommen, zijbalk, tabs).\n */\nexport type BlockCategory = \"content\" | \"widget\" | \"layout\";\n\nexport interface BlockDefinition<S extends $ZodType = $ZodType> {\n  type: string;\n  /**\n   * Zod-schema van het blok. Voor de INGEBOUWDE blokken is dit veld leeg en wordt het schema\n   * lazy geregistreerd via `blocks/builtinSchemas` (7.13): de schema's zijn editor-kennis, en\n   * mét dit veld reisden álle schema's plus de zod-runtime (±73 KB gzip) mee naar elke publieke\n   * bezoeker die nooit iets bewerkt. Klant-blokken (defineBlock in een klantrepo) mogen hun\n   * schema gewoon hier blijven meegeven — dat is klein en houdt de API eenvoudig.\n   */\n  schema?: S;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- registry-grens: het blok\n  // typeert zijn eigen props; hier is de data per definitie \"wat de database gaf\".\n  Render: ComponentType<BlockRenderProps<any>>;\n  /**\n   * Admin-editor (lazy/client). Optioneel; ontbreekt = automatische schema-editor (GenericEditor):\n   * die genereert een formulier uit het Zod-schema, dus een blok zonder eigen editor blijft bewerkbaar.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- zie Render.\n  Editor?: ComponentType<BlockEditorProps<any>>;\n  label: string;\n  icon?: string;\n  /** Groep in het toevoeg-menu (content/widget/layout). Standaard \"content\". */\n  category?: BlockCategory;\n  /** Defaultwaarden voor een nieuw block (zonder _key/_type). */\n  defaults?: () => Record<string, unknown>;\n  /**\n   * Optionele hints voor het automatisch gegenereerde formulier (GenericEditor 2.0, 5.0):\n   * per (dotted) veldsleutel een verfijning van de uit het Zod-schema afgeleide Field-IR —\n   * bv. `{ \"items.date\": { type: \"date\" }, cta: { showIf: { field: \"showCta\" } } }`.\n   * Zie `introspectToFields` (admin/lib/zodFields.ts) en `schema/fields.ts`.\n   */\n  fields?: FieldHints;\n}\n\n/**\n * Registreert een block-type.\n *\n * UPDATE-VEILIGHEID: voeg in een nieuwe versie nooit een VERPLICHT veld toe aan een bestaand\n * block-schema zonder `.default()` of `.optional()`. Anders faalt validatie op al opgeslagen\n * content en wordt die overgeslagen. Met defaults/optioneel blijft oude content gewoon werken.\n */\nexport function defineBlock<S extends $ZodType>(def: BlockDefinition<S>): BlockDefinition {\n  // Type-erased return: het schema-type wordt alleen gebruikt om Render/Editor-props te\n  // inferreren bij definitie. Daarna behandelen we blokken generiek in de registry.\n  return def as unknown as BlockDefinition;\n}\n\nexport type BlockRegistry = Map<string, BlockDefinition>;\n\n/**\n * Bouwt de opties voor het \"blok toevoegen\"-menu, gegroepeerd op categorie: eerst gewone blokken,\n * dan indeling (kolommen/zijbalk/tabs), dan widgets. Widgets/indeling krijgen een suffix zodat de\n * groep duidelijk is in een platte keuzelijst.\n */\nexport function buildBlockAddOptions(defs: Iterable<BlockDefinition>): { value: string; label: string }[] {\n  const order: Record<BlockCategory, number> = { content: 0, layout: 1, widget: 2 };\n  const suffix: Record<BlockCategory, string> = { content: \"\", layout: \"  · indeling\", widget: \"  · widget\" };\n  return [...defs]\n    .map((d) => ({ def: d, cat: d.category ?? \"content\" }))\n    .sort((a, b) => order[a.cat] - order[b.cat])\n    .map(({ def, cat }) => ({ value: def.type, label: `${def.icon ?? \"▫\"}  ${def.label}${suffix[cat]}` }));\n}\n\nexport function createRegistry(defs: BlockDefinition[]): BlockRegistry {\n  const m: BlockRegistry = new Map();\n  for (const d of defs) m.set(d.type, d);\n  return m;\n}\n\nexport function mergeRegistry(base: BlockRegistry, extra: BlockDefinition[]): BlockRegistry {\n  const m: BlockRegistry = new Map(base);\n  for (const d of extra) m.set(d.type, d);\n  return m;\n}\n\n/**\n * Strikte per-type validatie van een blocks-array tegen de registry. Onbekende types en\n * blocks die hun schema niet halen worden weggelaten (defensief — nooit half-rendered content).\n * Gebruikt bij publiceren (server) en vóór renderen.\n *\n * Recursief: geneste blokken in de indelingsblokken (kolommen, \"Met zijbalk\", tabs) worden óók\n * per-type gevalideerd. Hun schema's valideren kinderen bewust alleen als `BlockBaseSchema`\n * (passthrough) zodat klant-blokken erin mogen; de strikte controle gebeurt hier.\n */\n/**\n * De zod-parser wordt hier INGEPLUGD in plaats van geïmporteerd: een statische `safeParse`-import\n * zou de zod-runtime alsnog in elke publieke bundel trekken, ook nu de schema's zelf lazy zijn.\n * `blocks/builtinSchemas` (geladen door de admin/editor-chunks) zet hem; klant-blokken die hun\n * schema meegeven krijgen daarmee ook pas volledige client-validatie zodra de editor laadt —\n * publiek geldt voor hen dezelfde lichte vormcheck als voor de ingebouwde blokken.\n */\ntype SchemaParser = (schema: $ZodType, raw: unknown) => { success: boolean; data?: unknown; issues?: unknown };\nlet schemaParser: SchemaParser | null = null;\nexport function setSchemaParser(fn: SchemaParser): void {\n  schemaParser = fn;\n}\n\nexport function validateBlocks(blocks: unknown[] | undefined, registry: BlockRegistry): BlockBase[] {\n  const out: BlockBase[] = [];\n  for (const raw of blocks ?? []) {\n    const type = (raw as { _type?: unknown } | null)?._type;\n    const def = typeof type === \"string\" ? registry.get(type) : undefined;\n    if (!def) {\n      warn(`onbekend block-type \"${String(type)}\" overgeslagen (geen registratie).`);\n      continue;\n    }\n    /**\n     * Twee niveaus van controle, afhankelijk van wat er geladen is:\n     *  - Schema + parser aanwezig (editor/admin, of een klant-blok dat zijn schema meedraagt):\n     *    volledige zod-validatie, zoals altijd.\n     *  - Geen schema (publieke render van ingebouwde blokken): een lichte vormcheck volstaat —\n     *    de inhoudelijke garantie is dan al geleverd door de publiceer-pijplijn (functions\n     *    saniteert en valideert bij publishPage). Zo blijft zod uit de bezoekersbundel.\n     */\n    const parser = def.schema ? schemaParser : null;\n    if (def.schema && parser) {\n      const res = parser(def.schema, raw);\n      if (res.success) out.push(validateNestedBlocks(res.data as BlockBase, registry));\n      else warn(`block \"${type}\" voldoet niet aan zijn schema en is overgeslagen.`, res.issues);\n    } else if (raw && typeof raw === \"object\" && typeof (raw as { _type?: unknown })._type === \"string\") {\n      out.push(validateNestedBlocks(raw as BlockBase, registry));\n    } else {\n      warn(`block \"${String(type)}\" heeft geen geldige vorm en is overgeslagen.`);\n    }\n  }\n  return out;\n}\n\n/** Valideert de geneste blok-lijsten van de bekende indelingsvormen (immutable). */\nfunction validateNestedBlocks(block: BlockBase, registry: BlockRegistry): BlockBase {\n  const b = block as BlockBase & Record<string, unknown>;\n  if (b._type === \"columns\" && Array.isArray(b.columns)) {\n    return {\n      ...b,\n      columns: b.columns.map((col) =>\n        col && typeof col === \"object\" && Array.isArray((col as { blocks?: unknown }).blocks)\n          ? { ...col, blocks: validateBlocks((col as { blocks: unknown[] }).blocks, registry) }\n          : col,\n      ),\n    };\n  }\n  if (b._type === \"withSidebar\" && (Array.isArray(b.main) || Array.isArray(b.aside))) {\n    return {\n      ...b,\n      main: Array.isArray(b.main) ? validateBlocks(b.main, registry) : b.main,\n      aside: Array.isArray(b.aside) ? validateBlocks(b.aside, registry) : b.aside,\n    };\n  }\n  if (b._type === \"tabs\" && Array.isArray(b.tabs)) {\n    return {\n      ...b,\n      tabs: b.tabs.map((tab) =>\n        tab && typeof tab === \"object\" && Array.isArray((tab as { blocks?: unknown }).blocks)\n          ? { ...tab, blocks: validateBlocks((tab as { blocks: unknown[] }).blocks, registry) }\n          : tab,\n      ),\n    };\n  }\n  return block;\n}\n\nfunction warn(msg: string, detail?: unknown): void {\n  // Geen stil verlies: log waarom een block niet rendert (helpt bij schema-wijzigingen).\n  if (typeof console !== \"undefined\") console.warn(`[xicms] ${msg}`, detail ?? \"\");\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/blocks/registry.ts"],"sourcesContent":["/**\n * Block-registry: koppelt een `_type` aan zijn Zod-schema, een (server-safe) Render-component\n * en een optionele (client/admin) Editor. Klant-blokken worden hier ingebracht via `defineBlock`\n * — zo blijft de core klant-onafhankelijk: de klant levert de render-component, core de structuur.\n *\n * Pure logica + types (geen \"use client\"): bruikbaar op server en client.\n */\nimport type { ComponentType } from \"react\";\nimport type { $ZodType } from \"zod/v4/core\";\nimport type { BlockBase } from \"../schema/blocks\";\nimport type { FieldHints } from \"../schema/fields\";\n\n/**\n * Het uitvoertype van een blok-schema, onafhankelijk van de Zod-façade.\n *\n * Core draait op `zod/mini` (zie schema/) omdat de classic-façade niet tree-shaket en ~300 KB aan\n * de publieke bundel toevoegde. De grens hieronder is daarom `$ZodType` uit `zod/v4/core` — de\n * gedeelde bovengrens van BEIDE smaken. Gevolg: een klantrepo mag zijn eigen blok-schema's zowel\n * met `zod` als met `zod/mini` schrijven; `defineBlock` accepteert allebei.\n */\ntype InferBlock<S extends $ZodType> = S[\"_zod\"][\"output\"];\n\nexport interface BlockRenderProps<T = unknown> {\n  block: T;\n  siteId: string;\n  /** \"view\" = publiek; \"preview\" = draft-weergave in de editor. */\n  mode?: \"view\" | \"preview\";\n}\n\nexport interface BlockEditorProps<T = unknown> {\n  block: T;\n  siteId: string;\n  onChange: (next: T) => void;\n}\n\n/**\n * Indeling van een block in het toevoeg-menu:\n * - `content` (default): een gewoon blok dat je op de pagina plaatst.\n * - `widget`: een compacte variant die je naast een blok (in een zijbalk/kolom) zet — haalt z'n\n *   gegevens uit dezelfde module als de volwaardige versie (bv. \"laatste nieuws\", \"komende agenda\").\n * - `layout`: een indelingsblok dat andere blokken bevat (kolommen, zijbalk, tabs).\n */\nexport type BlockCategory = \"content\" | \"widget\" | \"layout\";\n\nexport interface BlockDefinition<S extends $ZodType = $ZodType> {\n  type: string;\n  /**\n   * Zod-schema van het blok. Voor de INGEBOUWDE blokken is dit veld leeg en wordt het schema\n   * lazy geregistreerd via `blocks/builtinSchemas` (7.13): de schema's zijn editor-kennis, en\n   * mét dit veld reisden álle schema's plus de zod-runtime (±73 KB gzip) mee naar elke publieke\n   * bezoeker die nooit iets bewerkt. Klant-blokken (defineBlock in een klantrepo) mogen hun\n   * schema gewoon hier blijven meegeven — dat is klein en houdt de API eenvoudig.\n   */\n  schema?: S;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- registry-grens: het blok\n  // typeert zijn eigen props; hier is de data per definitie \"wat de database gaf\".\n  Render: ComponentType<BlockRenderProps<any>>;\n  /**\n   * Admin-editor (lazy/client). Optioneel; ontbreekt = automatische schema-editor (GenericEditor):\n   * die genereert een formulier uit het Zod-schema, dus een blok zonder eigen editor blijft bewerkbaar.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- zie Render.\n  Editor?: ComponentType<BlockEditorProps<any>>;\n  label: string;\n  icon?: string;\n  /** Groep in het toevoeg-menu (content/widget/layout). Standaard \"content\". */\n  category?: BlockCategory;\n  /** Defaultwaarden voor een nieuw block (zonder _key/_type). */\n  defaults?: () => Record<string, unknown>;\n  /**\n   * Optionele hints voor het automatisch gegenereerde formulier (GenericEditor 2.0, 5.0):\n   * per (dotted) veldsleutel een verfijning van de uit het Zod-schema afgeleide Field-IR —\n   * bv. `{ \"items.date\": { type: \"date\" }, cta: { showIf: { field: \"showCta\" } } }`.\n   * Zie `introspectToFields` (admin/lib/zodFields.ts) en `schema/fields.ts`.\n   */\n  fields?: FieldHints;\n  /**\n   * 8.10: een blok waar de werking van de site op leunt (winkelwagen, afrekenen, formulier).\n   * Verwijderen in de editor vraagt dan eerst om bevestiging met deze uitleg; gewone blokken gaan\n   * met één klik weg (er is ongedaan maken). De tekst zegt wat er stuk gaat, in klanttaal.\n   */\n  essentieel?: string;\n}\n\n/**\n * Registreert een block-type.\n *\n * UPDATE-VEILIGHEID: voeg in een nieuwe versie nooit een VERPLICHT veld toe aan een bestaand\n * block-schema zonder `.default()` of `.optional()`. Anders faalt validatie op al opgeslagen\n * content en wordt die overgeslagen. Met defaults/optioneel blijft oude content gewoon werken.\n */\nexport function defineBlock<S extends $ZodType>(def: BlockDefinition<S>): BlockDefinition {\n  // Type-erased return: het schema-type wordt alleen gebruikt om Render/Editor-props te\n  // inferreren bij definitie. Daarna behandelen we blokken generiek in de registry.\n  return def as unknown as BlockDefinition;\n}\n\nexport type BlockRegistry = Map<string, BlockDefinition>;\n\n/**\n * Bouwt de opties voor het \"blok toevoegen\"-menu, gegroepeerd op categorie: eerst gewone blokken,\n * dan indeling (kolommen/zijbalk/tabs), dan widgets. Widgets/indeling krijgen een suffix zodat de\n * groep duidelijk is in een platte keuzelijst.\n */\nexport function buildBlockAddOptions(defs: Iterable<BlockDefinition>): { value: string; label: string }[] {\n  const order: Record<BlockCategory, number> = { content: 0, layout: 1, widget: 2 };\n  const suffix: Record<BlockCategory, string> = { content: \"\", layout: \"  · indeling\", widget: \"  · widget\" };\n  return [...defs]\n    .map((d) => ({ def: d, cat: d.category ?? \"content\" }))\n    .sort((a, b) => order[a.cat] - order[b.cat])\n    .map(({ def, cat }) => ({ value: def.type, label: `${def.icon ?? \"▫\"}  ${def.label}${suffix[cat]}` }));\n}\n\nexport function createRegistry(defs: BlockDefinition[]): BlockRegistry {\n  const m: BlockRegistry = new Map();\n  for (const d of defs) m.set(d.type, d);\n  return m;\n}\n\nexport function mergeRegistry(base: BlockRegistry, extra: BlockDefinition[]): BlockRegistry {\n  const m: BlockRegistry = new Map(base);\n  for (const d of extra) m.set(d.type, d);\n  return m;\n}\n\n/**\n * Strikte per-type validatie van een blocks-array tegen de registry. Onbekende types en\n * blocks die hun schema niet halen worden weggelaten (defensief — nooit half-rendered content).\n * Gebruikt bij publiceren (server) en vóór renderen.\n *\n * Recursief: geneste blokken in de indelingsblokken (kolommen, \"Met zijbalk\", tabs) worden óók\n * per-type gevalideerd. Hun schema's valideren kinderen bewust alleen als `BlockBaseSchema`\n * (passthrough) zodat klant-blokken erin mogen; de strikte controle gebeurt hier.\n */\n/**\n * De zod-parser wordt hier INGEPLUGD in plaats van geïmporteerd: een statische `safeParse`-import\n * zou de zod-runtime alsnog in elke publieke bundel trekken, ook nu de schema's zelf lazy zijn.\n * `blocks/builtinSchemas` (geladen door de admin/editor-chunks) zet hem; klant-blokken die hun\n * schema meegeven krijgen daarmee ook pas volledige client-validatie zodra de editor laadt —\n * publiek geldt voor hen dezelfde lichte vormcheck als voor de ingebouwde blokken.\n */\ntype SchemaParser = (schema: $ZodType, raw: unknown) => { success: boolean; data?: unknown; issues?: unknown };\nlet schemaParser: SchemaParser | null = null;\nexport function setSchemaParser(fn: SchemaParser): void {\n  schemaParser = fn;\n}\n\nexport function validateBlocks(blocks: unknown[] | undefined, registry: BlockRegistry): BlockBase[] {\n  const out: BlockBase[] = [];\n  for (const raw of blocks ?? []) {\n    const type = (raw as { _type?: unknown } | null)?._type;\n    const def = typeof type === \"string\" ? registry.get(type) : undefined;\n    if (!def) {\n      warn(`onbekend block-type \"${String(type)}\" overgeslagen (geen registratie).`);\n      continue;\n    }\n    /**\n     * Twee niveaus van controle, afhankelijk van wat er geladen is:\n     *  - Schema + parser aanwezig (editor/admin, of een klant-blok dat zijn schema meedraagt):\n     *    volledige zod-validatie, zoals altijd.\n     *  - Geen schema (publieke render van ingebouwde blokken): een lichte vormcheck volstaat —\n     *    de inhoudelijke garantie is dan al geleverd door de publiceer-pijplijn (functions\n     *    saniteert en valideert bij publishPage). Zo blijft zod uit de bezoekersbundel.\n     */\n    const parser = def.schema ? schemaParser : null;\n    if (def.schema && parser) {\n      const res = parser(def.schema, raw);\n      if (res.success) out.push(validateNestedBlocks(res.data as BlockBase, registry));\n      else warn(`block \"${type}\" voldoet niet aan zijn schema en is overgeslagen.`, res.issues);\n    } else if (raw && typeof raw === \"object\" && typeof (raw as { _type?: unknown })._type === \"string\") {\n      out.push(validateNestedBlocks(raw as BlockBase, registry));\n    } else {\n      warn(`block \"${String(type)}\" heeft geen geldige vorm en is overgeslagen.`);\n    }\n  }\n  return out;\n}\n\n/** Valideert de geneste blok-lijsten van de bekende indelingsvormen (immutable). */\nfunction validateNestedBlocks(block: BlockBase, registry: BlockRegistry): BlockBase {\n  const b = block as BlockBase & Record<string, unknown>;\n  if (b._type === \"columns\" && Array.isArray(b.columns)) {\n    return {\n      ...b,\n      columns: b.columns.map((col) =>\n        col && typeof col === \"object\" && Array.isArray((col as { blocks?: unknown }).blocks)\n          ? { ...col, blocks: validateBlocks((col as { blocks: unknown[] }).blocks, registry) }\n          : col,\n      ),\n    };\n  }\n  if (b._type === \"withSidebar\" && (Array.isArray(b.main) || Array.isArray(b.aside))) {\n    return {\n      ...b,\n      main: Array.isArray(b.main) ? validateBlocks(b.main, registry) : b.main,\n      aside: Array.isArray(b.aside) ? validateBlocks(b.aside, registry) : b.aside,\n    };\n  }\n  if (b._type === \"tabs\" && Array.isArray(b.tabs)) {\n    return {\n      ...b,\n      tabs: b.tabs.map((tab) =>\n        tab && typeof tab === \"object\" && Array.isArray((tab as { blocks?: unknown }).blocks)\n          ? { ...tab, blocks: validateBlocks((tab as { blocks: unknown[] }).blocks, registry) }\n          : tab,\n      ),\n    };\n  }\n  return block;\n}\n\nfunction warn(msg: string, detail?: unknown): void {\n  // Geen stil verlies: log waarom een block niet rendert (helpt bij schema-wijzigingen).\n  if (typeof console !== \"undefined\") console.warn(`[xicms] ${msg}`, detail ?? \"\");\n}\n"],"mappings":"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","names":[]}

package/dist/blocks/ui/index.js

@@ -29,6 +29,7 @@ function Btn({ label, href, variant = "primary", size = "lg", type, target, onCl
       rel: target === "_blank" ? "noopener noreferrer" : void 0,
       type: href ? void 0 : type ?? "button",
       clickAction: onClick,
+      className: variant === "outline" ? "xicms-btn-omlijnd" : void 0,
       children: editField ? /* @__PURE__ */ jsx("span", { "data-xicms-edit": editField, children: label }) : void 0
     }
   );

package/dist/blocks/ui/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/blocks/ui/index.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Gedeelde presentatie-primitieven voor de runtime-blokken — een dunne laag bovenop het Astryx\n * design system (Meta, StyleX). Blokken bouwen hierop i.p.v. losse `xicms-*`-classNames, zodat het\n * uiterlijk consistent is en we de onderlaag centraal kunnen wijzigen.\n *\n * De merk-look per site komt via de Astryx-token-mapping op `.xicms-root` (zie XiCMSProvider):\n * `--color-accent`, `--font-family-*`, `--radius-*` volgen de XiCMS-thema-tokens.\n */\n\nimport { type ReactNode } from \"react\";\nimport { Button, type ButtonVariant } from \"@astryxdesign/core/Button\";\n\nexport { VStack } from \"@astryxdesign/core/VStack\";\nexport { HStack } from \"@astryxdesign/core/HStack\";\nexport { Stack } from \"@astryxdesign/core/Stack\";\nexport { Grid } from \"@astryxdesign/core/Grid\";\nexport { Card } from \"@astryxdesign/core/Card\";\nexport { Heading } from \"@astryxdesign/core/Heading\";\nexport { Text } from \"@astryxdesign/core/Text\";\nexport { Divider } from \"@astryxdesign/core/Divider\";\nexport { Badge } from \"@astryxdesign/core/Badge\";\nexport { Avatar } from \"@astryxdesign/core/Avatar\";\n\n/** XiCMS-knopvarianten → Astryx-varianten (Astryx kent geen \"outline\" → ghost). */\nconst VARIANT_MAP: Record<string, ButtonVariant> = {\n  primary: \"primary\",\n  secondary: \"secondary\",\n  outline: \"ghost\",\n  ghost: \"ghost\",\n};\n\nexport interface BtnProps {\n  label: string;\n  href?: string;\n  variant?: string;\n  /** Marketing-knoppen zijn standaard wat groter dan de app-default. */\n  size?: \"sm\" | \"md\" | \"lg\";\n  type?: \"button\" | \"submit\" | \"reset\";\n  target?: string;\n  onClick?: () => void;\n  children?: ReactNode;\n  /**\n   * Veldpad voor inline bewerken, bv. `\"buttonLabel\"` of `` `items.${i}.ctaLabel` ``. Het label\n   * gaat dan door een eigen `<span>` met de `data-xicms-edit`-haak, zodat de knoptekst op het\n   * canvas te bewerken is i.p.v. alleen via het zijpaneel. Astryx houdt `label` als toegankelijke\n   * naam aan (het zet zelf `aria-label` zodra children afwijken), dus dit kost geen a11y.\n   */\n  editField?: string;\n}\n\n/**\n * Knop/CTA-helper bovenop Astryx `Button`. Rendert als link wanneer `href` gezet is. Houdt de\n * bestaande XiCMS-varianten (primary/secondary/outline) werkend via de mapping hierboven.\n */\nexport function Btn({ label, href, variant = \"primary\", size = \"lg\", type, target, onClick, editField }: BtnProps) {\n  return (\n    <Button\n      label={label}\n      variant={VARIANT_MAP[variant] ?? \"primary\"}\n      size={size}\n      href={href}\n      target={href && target ? target : undefined}\n      rel={target === \"_blank\" ? \"noopener noreferrer\" : undefined}\n      type={href ? undefined : (type ?? \"button\")}\n      clickAction={onClick}\n    >\n      {/* `undefined` laat Astryx op `label` terugvallen — alleen mét haak komt er een span omheen. */}\n      {editField ? <span data-xicms-edit={editField}>{label}</span> : undefined}\n    </Button>\n  );\n}\n"],"mappings":";AAqEmB;AAzDnB,SAAS,cAAkC;AAE3C,SAAS,cAAc;AACvB,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,cAAc;AAGvB,MAAM,cAA6C;AAAA,EACjD,SAAS;AAAA,EACT,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AACT;AAyBO,SAAS,IAAI,EAAE,OAAO,MAAM,UAAU,WAAW,OAAO,MAAM,MAAM,QAAQ,SAAS,UAAU,GAAa;AACjH,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAS,YAAY,OAAO,KAAK;AAAA,MACjC;AAAA,MACA;AAAA,MACA,QAAQ,QAAQ,SAAS,SAAS;AAAA,MAClC,KAAK,WAAW,WAAW,wBAAwB;AAAA,MACnD,MAAM,OAAO,SAAa,QAAQ;AAAA,MAClC,aAAa;AAAA,MAGZ,sBAAY,oBAAC,UAAK,mBAAiB,WAAY,iBAAM,IAAU;AAAA;AAAA,EAClE;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/blocks/ui/index.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Gedeelde presentatie-primitieven voor de runtime-blokken — een dunne laag bovenop het Astryx\n * design system (Meta, StyleX). Blokken bouwen hierop i.p.v. losse `xicms-*`-classNames, zodat het\n * uiterlijk consistent is en we de onderlaag centraal kunnen wijzigen.\n *\n * De merk-look per site komt via de Astryx-token-mapping op `.xicms-root` (zie XiCMSProvider):\n * `--color-accent`, `--font-family-*`, `--radius-*` volgen de XiCMS-thema-tokens.\n */\n\nimport { type ReactNode } from \"react\";\nimport { Button, type ButtonVariant } from \"@astryxdesign/core/Button\";\n\nexport { VStack } from \"@astryxdesign/core/VStack\";\nexport { HStack } from \"@astryxdesign/core/HStack\";\nexport { Stack } from \"@astryxdesign/core/Stack\";\nexport { Grid } from \"@astryxdesign/core/Grid\";\nexport { Card } from \"@astryxdesign/core/Card\";\nexport { Heading } from \"@astryxdesign/core/Heading\";\nexport { Text } from \"@astryxdesign/core/Text\";\nexport { Divider } from \"@astryxdesign/core/Divider\";\nexport { Badge } from \"@astryxdesign/core/Badge\";\nexport { Avatar } from \"@astryxdesign/core/Avatar\";\n\n/** XiCMS-knopvarianten → Astryx-varianten (Astryx kent geen \"outline\" → ghost). */\nconst VARIANT_MAP: Record<string, ButtonVariant> = {\n  primary: \"primary\",\n  secondary: \"secondary\",\n  outline: \"ghost\",\n  ghost: \"ghost\",\n};\n\nexport interface BtnProps {\n  label: string;\n  href?: string;\n  variant?: string;\n  /** Marketing-knoppen zijn standaard wat groter dan de app-default. */\n  size?: \"sm\" | \"md\" | \"lg\";\n  type?: \"button\" | \"submit\" | \"reset\";\n  target?: string;\n  onClick?: () => void;\n  children?: ReactNode;\n  /**\n   * Veldpad voor inline bewerken, bv. `\"buttonLabel\"` of `` `items.${i}.ctaLabel` ``. Het label\n   * gaat dan door een eigen `<span>` met de `data-xicms-edit`-haak, zodat de knoptekst op het\n   * canvas te bewerken is i.p.v. alleen via het zijpaneel. Astryx houdt `label` als toegankelijke\n   * naam aan (het zet zelf `aria-label` zodra children afwijken), dus dit kost geen a11y.\n   */\n  editField?: string;\n}\n\n/**\n * Knop/CTA-helper bovenop Astryx `Button`. Rendert als link wanneer `href` gezet is. Houdt de\n * bestaande XiCMS-varianten (primary/secondary/outline) werkend via de mapping hierboven.\n */\nexport function Btn({ label, href, variant = \"primary\", size = \"lg\", type, target, onClick, editField }: BtnProps) {\n  return (\n    <Button\n      label={label}\n      variant={VARIANT_MAP[variant] ?? \"primary\"}\n      size={size}\n      href={href}\n      target={href && target ? target : undefined}\n      rel={target === \"_blank\" ? \"noopener noreferrer\" : undefined}\n      type={href ? undefined : (type ?? \"button\")}\n      clickAction={onClick}\n      // 8.12: \"Omlijnd\" was een kale ghost-knop — losse tekst zonder rand, die naast een primaire\n      // knop niet als knop las. Nu een echte omlijning (zie .xicms-btn-omlijnd).\n      className={variant === \"outline\" ? \"xicms-btn-omlijnd\" : undefined}\n    >\n      {/* `undefined` laat Astryx op `label` terugvallen — alleen mét haak komt er een span omheen. */}\n      {editField ? <span data-xicms-edit={editField}>{label}</span> : undefined}\n    </Button>\n  );\n}\n"],"mappings":";AAwEmB;AA5DnB,SAAS,cAAkC;AAE3C,SAAS,cAAc;AACvB,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,cAAc;AAGvB,MAAM,cAA6C;AAAA,EACjD,SAAS;AAAA,EACT,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AACT;AAyBO,SAAS,IAAI,EAAE,OAAO,MAAM,UAAU,WAAW,OAAO,MAAM,MAAM,QAAQ,SAAS,UAAU,GAAa;AACjH,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAS,YAAY,OAAO,KAAK;AAAA,MACjC;AAAA,MACA;AAAA,MACA,QAAQ,QAAQ,SAAS,SAAS;AAAA,MAClC,KAAK,WAAW,WAAW,wBAAwB;AAAA,MACnD,MAAM,OAAO,SAAa,QAAQ;AAAA,MAClC,aAAa;AAAA,MAGb,WAAW,YAAY,YAAY,sBAAsB;AAAA,MAGxD,sBAAY,oBAAC,UAAK,mBAAiB,WAAY,iBAAM,IAAU;AAAA;AAAA,EAClE;AAEJ;","names":[]}

package/dist/components/EditBar.js

@@ -8,11 +8,9 @@ import { useEditor } from "../editor/EditorProvider.js";
 function EditBar() {
   const { user, role } = useAuth();
   const { open } = useEditor();
+  const siteId = useSiteConfig().siteId;
   if (!canEdit(role) || !user || open) return null;
-  return /* @__PURE__ */ jsx(EditBarVoorEditor, { siteId: useSiteConfigSiteId() });
-}
-function useSiteConfigSiteId() {
-  return useSiteConfig().siteId;
+  return /* @__PURE__ */ jsx(EditBarVoorEditor, { siteId });
 }
 function EditBarVoorEditor({ siteId }) {
   const nietLive = useNietLive(siteId);

package/dist/components/EditBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/EditBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useAuth } from \"../auth/AuthProvider\";\nimport { useSiteConfig } from \"../config\";\nimport { canEdit } from \"../auth/roles\";\nimport { useEditor, type Bewerkmodus } from \"../editor/EditorProvider\";\n\n/**\n * Zwevende werkbalk voor ingelogde beheerders/editors.\n *\n * Bewust met EIGEN klassen en eigen kleuren, niet met `.xicms-btn`. Die knop leest de\n * `--xicms-*`-tokens van de klantsite, en dit balkje zweeft over die site heen: het nam daardoor\n * half de huisstijl over (en op plekken waar de tokens niet in scope zijn, viel het terug op een\n * indigo die bij niets hoorde). Gereedschap hoort er als gereedschap uit te zien — hetzelfde op\n * elke site, herkenbaar los van de pagina eronder.\n *\n * ── VIER OPTIES, ALTIJD DEZELFDE (7.8) ────────────────────────────────────────────────────\n *\n * De balk had één hoofdactie (\"Pagina bewerken\") en verdween zodra je die indrukte: de editor\n * bracht zijn eigen balk mee, met andere knoppen op andere plekken. Je verloor dus je houvast op\n * het moment dat je het het hardst nodig had, en er was geen weg terug naar de live site zonder\n * de editor te sluiten.\n *\n * Nu staan er vier vaste opties — Live site · Bewerken · Beheren · Uitloggen — en die staan er in\n * béide toestanden, op dezelfde plek. `AdminModes` hieronder is letterlijk hetzelfde component in\n * de balk van de editor, zodat het overschakelen geen wisseling van balk is maar alleen een andere\n * knop die oplicht.\n */\nexport function EditBar() {\n  // Bewust via useAuth (niet via het deprecated ContentProvider-pad): de EditBar hoort bij het\n  // block-model en mag niet aan het legacy inline-systeem hangen.\n  const { user, role } = useAuth();\n  const { open } = useEditor();\n  // Geen useBalkOffset meer: het pilletje zweeft óver de site (7.16), er wordt niets meer\n  // omlaag geduwd — dus valt er ook niets meer onder een balk vandaan te schuiven.\n\n  // In de bewerkmodus tekent de editor de balk (met dezelfde vier opties plus zijn gereedschap);\n  // twee balken onder elkaar zou de site twee keer zo ver omlaag duwen.\n  if (!canEdit(role) || !user || open) return null;\n\n  return <EditBarVoorEditor siteId={useSiteConfigSiteId()} />;\n}\n\nfunction useSiteConfigSiteId(): string {\n  return useSiteConfig().siteId;\n}\n\n/**\n * Apart component zodat de draft-lezing hieronder ALLEEN draait voor een ingelogde editor — het\n * bovenliggende EditBar rendert voor elke bezoeker en mag geen Firestore aanraken.\n */\nfunction EditBarVoorEditor({ siteId }: { siteId: string }) {\n  const nietLive = useNietLive(siteId);\n  return (\n    <div className=\"xicms-editbar\" role=\"toolbar\" aria-label=\"Beheer\" data-xicms-tooling=\"\">\n      <EditbarBrand label=\"XiCMS\" />\n      <AdminModes actief=\"live\" nietLive={nietLive} />\n    </div>\n  );\n}\n\n/**\n * Klein merkicoontje + naam (7.26) — gedeeld door de balk hierboven en die van de visuele editor\n * (VisualEditor.tsx), zodat \"hetzelfde gereedschap, ongeacht waar\" ook geldt voor het merkje zelf.\n * Puur decoratief: het icoon is `aria-hidden`, de naam draagt de eigenlijke betekenis.\n */\nexport function EditbarBrand({ label }: { label: string }) {\n  return (\n    <span className=\"xicms-editbar__brand\">\n      {/* Bewust een sterretje, geen kruis: twee kruisende lijnen op deze schaal las als een\n          sluitknopje naast de merknaam — precies de handeling die je hier niet wilt suggereren. */}\n      <svg className=\"xicms-editbar__mark\" viewBox=\"0 0 16 16\" width=\"13\" height=\"13\" aria-hidden=\"true\">\n        <rect width=\"16\" height=\"16\" rx=\"4.5\" fill=\"currentColor\" opacity=\"0.22\" />\n        <path d=\"M8 3c.28 1.95 1.17 2.84 3.1 3.1-1.93.26-2.82 1.15-3.1 3.1-.28-1.95-1.17-2.84-3.1-3.1 1.93-.26 2.82-1.15 3.1-3.1z\" fill=\"currentColor\" />\n      </svg>\n      {label}\n    </span>\n  );\n}\n\n/**\n * Staat er op DEZE pagina een werkversie die afwijkt van wat live staat? (7.24)\n *\n * Eén lezing van de draft bij het laden (geen listener): dit is een signaal bij binnenkomst, geen\n * monitor. De vergelijking is dezelfde als in /beheer → Pagina's (`heeftOngepubliceerdeWijzigingen`).\n * Faalt stil — een hik mag de balk niet raken, en zonder signaal is er hoogstens geen stipje.\n */\nfunction useNietLive(siteId: string): boolean {\n  const [nietLive, setNietLive] = useState(false);\n  useEffect(() => {\n    let actief = true;\n    const raw = window.location.pathname || \"/\";\n    const path = raw === \"/\" ? \"/\" : raw.replace(/\\/$/, \"\");\n    void import(\"../admin/lib/pagesClient\")\n      .then(async ({ getDraftByPath, heeftOngepubliceerdeWijzigingen }) => {\n        const d = await getDraftByPath(siteId, path);\n        if (actief && d) setNietLive(heeftOngepubliceerdeWijzigingen(d));\n      })\n      .catch(() => undefined);\n    return () => {\n      actief = false;\n    };\n  }, [siteId]);\n  return nietLive;\n}\n\n/**\n * De vier opties zelf, los zodat de editor ze kan hergebruiken.\n *\n * `actief` zegt welke toestand je nú bekijkt, niet wat de knop doet: \"Live site\" is ingedrukt\n * zolang je de pagina ziet zoals een bezoeker hem ziet. Zonder die markering is er geen verschil\n * te zien tussen \"ik kijk naar de live site\" en \"ik bewerk maar heb nog niets veranderd\", en dat\n * verschil is precies waar deze balk over gaat.\n */\nexport function AdminModes({\n  actief,\n  voorSwitch,\n  nietLive = false,\n}: {\n  actief: Bewerkmodus;\n  /** 7.24: toon een stipje op \"Bewerken\" — er ligt een werkversie die niemand ziet. */\n  nietLive?: boolean;\n  /**\n   * Kans voor de editor om iets te zeggen vóór je weggaat — bijvoorbeeld dat er nog wijzigingen\n   * klaarstaan die niet live staan. Bewust niet blokkerend: sluiten bewaart je werk, dus een\n   * bevestigingsvraag zou alleen maar in de weg zitten. Melden is genoeg, tegenhouden is te veel.\n   */\n  voorSwitch?: (modus: Bewerkmodus) => void;\n}) {\n  const { demo, signOut } = useAuth();\n  const { zetModus } = useEditor();\n\n  const knop = (modus: Bewerkmodus, label: string, titel: string) => (\n    <button\n      type=\"button\"\n      className={`xicms-editbar__btn${actief === modus ? \" is-actief\" : \"\"}${modus === \"bewerken\" && nietLive ? \" heeft-wijzigingen\" : \"\"}`}\n      aria-pressed={actief === modus}\n      title={titel}\n      onClick={() => {\n        if (modus !== actief) voorSwitch?.(modus);\n        zetModus(modus);\n      }}\n    >\n      {label}\n    </button>\n  );\n\n  return (\n    <>\n      {knop(\"live\", \"Live site\", \"De pagina precies zoals een bezoeker hem ziet\")}\n      {knop(\"bewerken\", \"Bewerken\", nietLive ? \"Er staan wijzigingen klaar die nog niet live zijn\" : \"Dezelfde pagina, met de werkversie en potlood/tandwiel per blok\")}\n      <span className=\"xicms-editbar__sep\" aria-hidden=\"true\" />\n      {/* In de demo bestaat er geen /beheer-route; daar bewerk je alleen op de pagina. */}\n      {!demo && (\n        <a href=\"/beheer\" className=\"xicms-editbar__btn\" title=\"Pagina's, media, instellingen, webwinkel\">\n          Beheren\n        </a>\n      )}\n      <button type=\"button\" className=\"xicms-editbar__btn\" onClick={() => void signOut()}>\n        Uitloggen\n      </button>\n    </>\n  );\n}\n"],"mappings":";AAyCS,SA4GL,UA5GK,KAcL,YAdK;AAvCT,SAAS,WAAW,gBAAgB;AACpC,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAC9B,SAAS,eAAe;AACxB,SAAS,iBAAmC;AAuBrC,SAAS,UAAU;AAGxB,QAAM,EAAE,MAAM,KAAK,IAAI,QAAQ;AAC/B,QAAM,EAAE,KAAK,IAAI,UAAU;AAM3B,MAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,KAAM,QAAO;AAE5C,SAAO,oBAAC,qBAAkB,QAAQ,oBAAoB,GAAG;AAC3D;AAEA,SAAS,sBAA8B;AACrC,SAAO,cAAc,EAAE;AACzB;AAMA,SAAS,kBAAkB,EAAE,OAAO,GAAuB;AACzD,QAAM,WAAW,YAAY,MAAM;AACnC,SACE,qBAAC,SAAI,WAAU,iBAAgB,MAAK,WAAU,cAAW,UAAS,sBAAmB,IACnF;AAAA,wBAAC,gBAAa,OAAM,SAAQ;AAAA,IAC5B,oBAAC,cAAW,QAAO,QAAO,UAAoB;AAAA,KAChD;AAEJ;AAOO,SAAS,aAAa,EAAE,MAAM,GAAsB;AACzD,SACE,qBAAC,UAAK,WAAU,wBAGd;AAAA,yBAAC,SAAI,WAAU,uBAAsB,SAAQ,aAAY,OAAM,MAAK,QAAO,MAAK,eAAY,QAC1F;AAAA,0BAAC,UAAK,OAAM,MAAK,QAAO,MAAK,IAAG,OAAM,MAAK,gBAAe,SAAQ,QAAO;AAAA,MACzE,oBAAC,UAAK,GAAE,oHAAmH,MAAK,gBAAe;AAAA,OACjJ;AAAA,IACC;AAAA,KACH;AAEJ;AASA,SAAS,YAAY,QAAyB;AAC5C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,YAAU,MAAM;AACd,QAAI,SAAS;AACb,UAAM,MAAM,OAAO,SAAS,YAAY;AACxC,UAAM,OAAO,QAAQ,MAAM,MAAM,IAAI,QAAQ,OAAO,EAAE;AACtD,SAAK,OAAO,0BAA0B,EACnC,KAAK,OAAO,EAAE,gBAAgB,gCAAgC,MAAM;AACnE,YAAM,IAAI,MAAM,eAAe,QAAQ,IAAI;AAC3C,UAAI,UAAU,EAAG,aAAY,gCAAgC,CAAC,CAAC;AAAA,IACjE,CAAC,EACA,MAAM,MAAM,MAAS;AACxB,WAAO,MAAM;AACX,eAAS;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,CAAC;AACX,SAAO;AACT;AAUO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA,WAAW;AACb,GAUG;AACD,QAAM,EAAE,MAAM,QAAQ,IAAI,QAAQ;AAClC,QAAM,EAAE,SAAS,IAAI,UAAU;AAE/B,QAAM,OAAO,CAAC,OAAoB,OAAe,UAC/C;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,qBAAqB,WAAW,QAAQ,eAAe,EAAE,GAAG,UAAU,cAAc,WAAW,uBAAuB,EAAE;AAAA,MACnI,gBAAc,WAAW;AAAA,MACzB,OAAO;AAAA,MACP,SAAS,MAAM;AACb,YAAI,UAAU,OAAQ,cAAa,KAAK;AACxC,iBAAS,KAAK;AAAA,MAChB;AAAA,MAEC;AAAA;AAAA,EACH;AAGF,SACE,iCACG;AAAA,SAAK,QAAQ,aAAa,+CAA+C;AAAA,IACzE,KAAK,YAAY,YAAY,WAAW,sDAAsD,iEAAiE;AAAA,IAChK,oBAAC,UAAK,WAAU,sBAAqB,eAAY,QAAO;AAAA,IAEvD,CAAC,QACA,oBAAC,OAAE,MAAK,WAAU,WAAU,sBAAqB,OAAM,4CAA2C,qBAElG;AAAA,IAEF,oBAAC,YAAO,MAAK,UAAS,WAAU,sBAAqB,SAAS,MAAM,KAAK,QAAQ,GAAG,uBAEpF;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/EditBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useAuth } from \"../auth/AuthProvider\";\nimport { useSiteConfig } from \"../config\";\nimport { canEdit } from \"../auth/roles\";\nimport { useEditor, type Bewerkmodus } from \"../editor/EditorProvider\";\n\n/**\n * Zwevende werkbalk voor ingelogde beheerders/editors.\n *\n * Bewust met EIGEN klassen en eigen kleuren, niet met `.xicms-btn`. Die knop leest de\n * `--xicms-*`-tokens van de klantsite, en dit balkje zweeft over die site heen: het nam daardoor\n * half de huisstijl over (en op plekken waar de tokens niet in scope zijn, viel het terug op een\n * indigo die bij niets hoorde). Gereedschap hoort er als gereedschap uit te zien — hetzelfde op\n * elke site, herkenbaar los van de pagina eronder.\n *\n * ── VIER OPTIES, ALTIJD DEZELFDE (7.8) ────────────────────────────────────────────────────\n *\n * De balk had één hoofdactie (\"Pagina bewerken\") en verdween zodra je die indrukte: de editor\n * bracht zijn eigen balk mee, met andere knoppen op andere plekken. Je verloor dus je houvast op\n * het moment dat je het het hardst nodig had, en er was geen weg terug naar de live site zonder\n * de editor te sluiten.\n *\n * Nu staan er vier vaste opties — Live site · Bewerken · Beheren · Uitloggen — en die staan er in\n * béide toestanden, op dezelfde plek. `AdminModes` hieronder is letterlijk hetzelfde component in\n * de balk van de editor, zodat het overschakelen geen wisseling van balk is maar alleen een andere\n * knop die oplicht.\n */\nexport function EditBar() {\n  // Bewust via useAuth (niet via het deprecated ContentProvider-pad): de EditBar hoort bij het\n  // block-model en mag niet aan het legacy inline-systeem hangen.\n  const { user, role } = useAuth();\n  const { open } = useEditor();\n  // Vóór de vroege return: een hook ná `return null` wisselde van volgorde zodra de editor\n  // dichtging (React-waarschuwing \"change in the order of Hooks\").\n  const siteId = useSiteConfig().siteId;\n  // Geen useBalkOffset meer: het pilletje zweeft óver de site (7.16), er wordt niets meer\n  // omlaag geduwd — dus valt er ook niets meer onder een balk vandaan te schuiven.\n\n  // In de bewerkmodus tekent de editor de balk (met dezelfde vier opties plus zijn gereedschap);\n  // twee balken onder elkaar zou de site twee keer zo ver omlaag duwen.\n  if (!canEdit(role) || !user || open) return null;\n\n  return <EditBarVoorEditor siteId={siteId} />;\n}\n\n/**\n * Apart component zodat de draft-lezing hieronder ALLEEN draait voor een ingelogde editor — het\n * bovenliggende EditBar rendert voor elke bezoeker en mag geen Firestore aanraken.\n */\nfunction EditBarVoorEditor({ siteId }: { siteId: string }) {\n  const nietLive = useNietLive(siteId);\n  return (\n    <div className=\"xicms-editbar\" role=\"toolbar\" aria-label=\"Beheer\" data-xicms-tooling=\"\">\n      <EditbarBrand label=\"XiCMS\" />\n      <AdminModes actief=\"live\" nietLive={nietLive} />\n    </div>\n  );\n}\n\n/**\n * Klein merkicoontje + naam (7.26) — gedeeld door de balk hierboven en die van de visuele editor\n * (VisualEditor.tsx), zodat \"hetzelfde gereedschap, ongeacht waar\" ook geldt voor het merkje zelf.\n * Puur decoratief: het icoon is `aria-hidden`, de naam draagt de eigenlijke betekenis.\n */\nexport function EditbarBrand({ label }: { label: string }) {\n  return (\n    <span className=\"xicms-editbar__brand\">\n      {/* Bewust een sterretje, geen kruis: twee kruisende lijnen op deze schaal las als een\n          sluitknopje naast de merknaam — precies de handeling die je hier niet wilt suggereren. */}\n      <svg className=\"xicms-editbar__mark\" viewBox=\"0 0 16 16\" width=\"13\" height=\"13\" aria-hidden=\"true\">\n        <rect width=\"16\" height=\"16\" rx=\"4.5\" fill=\"currentColor\" opacity=\"0.22\" />\n        <path d=\"M8 3c.28 1.95 1.17 2.84 3.1 3.1-1.93.26-2.82 1.15-3.1 3.1-.28-1.95-1.17-2.84-3.1-3.1 1.93-.26 2.82-1.15 3.1-3.1z\" fill=\"currentColor\" />\n      </svg>\n      {label}\n    </span>\n  );\n}\n\n/**\n * Staat er op DEZE pagina een werkversie die afwijkt van wat live staat? (7.24)\n *\n * Eén lezing van de draft bij het laden (geen listener): dit is een signaal bij binnenkomst, geen\n * monitor. De vergelijking is dezelfde als in /beheer → Pagina's (`heeftOngepubliceerdeWijzigingen`).\n * Faalt stil — een hik mag de balk niet raken, en zonder signaal is er hoogstens geen stipje.\n */\nfunction useNietLive(siteId: string): boolean {\n  const [nietLive, setNietLive] = useState(false);\n  useEffect(() => {\n    let actief = true;\n    const raw = window.location.pathname || \"/\";\n    const path = raw === \"/\" ? \"/\" : raw.replace(/\\/$/, \"\");\n    void import(\"../admin/lib/pagesClient\")\n      .then(async ({ getDraftByPath, heeftOngepubliceerdeWijzigingen }) => {\n        const d = await getDraftByPath(siteId, path);\n        if (actief && d) setNietLive(heeftOngepubliceerdeWijzigingen(d));\n      })\n      .catch(() => undefined);\n    return () => {\n      actief = false;\n    };\n  }, [siteId]);\n  return nietLive;\n}\n\n/**\n * De vier opties zelf, los zodat de editor ze kan hergebruiken.\n *\n * `actief` zegt welke toestand je nú bekijkt, niet wat de knop doet: \"Live site\" is ingedrukt\n * zolang je de pagina ziet zoals een bezoeker hem ziet. Zonder die markering is er geen verschil\n * te zien tussen \"ik kijk naar de live site\" en \"ik bewerk maar heb nog niets veranderd\", en dat\n * verschil is precies waar deze balk over gaat.\n */\nexport function AdminModes({\n  actief,\n  voorSwitch,\n  nietLive = false,\n}: {\n  actief: Bewerkmodus;\n  /** 7.24: toon een stipje op \"Bewerken\" — er ligt een werkversie die niemand ziet. */\n  nietLive?: boolean;\n  /**\n   * Kans voor de editor om iets te zeggen vóór je weggaat — bijvoorbeeld dat er nog wijzigingen\n   * klaarstaan die niet live staan. Bewust niet blokkerend: sluiten bewaart je werk, dus een\n   * bevestigingsvraag zou alleen maar in de weg zitten. Melden is genoeg, tegenhouden is te veel.\n   */\n  voorSwitch?: (modus: Bewerkmodus) => void;\n}) {\n  const { demo, signOut } = useAuth();\n  const { zetModus } = useEditor();\n\n  const knop = (modus: Bewerkmodus, label: string, titel: string) => (\n    <button\n      type=\"button\"\n      className={`xicms-editbar__btn${actief === modus ? \" is-actief\" : \"\"}${modus === \"bewerken\" && nietLive ? \" heeft-wijzigingen\" : \"\"}`}\n      aria-pressed={actief === modus}\n      title={titel}\n      onClick={() => {\n        if (modus !== actief) voorSwitch?.(modus);\n        zetModus(modus);\n      }}\n    >\n      {label}\n    </button>\n  );\n\n  return (\n    <>\n      {knop(\"live\", \"Live site\", \"De pagina precies zoals een bezoeker hem ziet\")}\n      {knop(\"bewerken\", \"Bewerken\", nietLive ? \"Er staan wijzigingen klaar die nog niet live zijn\" : \"Dezelfde pagina, met de werkversie en potlood/tandwiel per blok\")}\n      <span className=\"xicms-editbar__sep\" aria-hidden=\"true\" />\n      {/* In de demo bestaat er geen /beheer-route; daar bewerk je alleen op de pagina. */}\n      {!demo && (\n        <a href=\"/beheer\" className=\"xicms-editbar__btn\" title=\"Pagina's, media, instellingen, webwinkel\">\n          Beheren\n        </a>\n      )}\n      <button type=\"button\" className=\"xicms-editbar__btn\" onClick={() => void signOut()}>\n        Uitloggen\n      </button>\n    </>\n  );\n}\n"],"mappings":";AA4CS,SAwGL,UAxGK,KAUL,YAVK;AA1CT,SAAS,WAAW,gBAAgB;AACpC,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAC9B,SAAS,eAAe;AACxB,SAAS,iBAAmC;AAuBrC,SAAS,UAAU;AAGxB,QAAM,EAAE,MAAM,KAAK,IAAI,QAAQ;AAC/B,QAAM,EAAE,KAAK,IAAI,UAAU;AAG3B,QAAM,SAAS,cAAc,EAAE;AAM/B,MAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,KAAM,QAAO;AAE5C,SAAO,oBAAC,qBAAkB,QAAgB;AAC5C;AAMA,SAAS,kBAAkB,EAAE,OAAO,GAAuB;AACzD,QAAM,WAAW,YAAY,MAAM;AACnC,SACE,qBAAC,SAAI,WAAU,iBAAgB,MAAK,WAAU,cAAW,UAAS,sBAAmB,IACnF;AAAA,wBAAC,gBAAa,OAAM,SAAQ;AAAA,IAC5B,oBAAC,cAAW,QAAO,QAAO,UAAoB;AAAA,KAChD;AAEJ;AAOO,SAAS,aAAa,EAAE,MAAM,GAAsB;AACzD,SACE,qBAAC,UAAK,WAAU,wBAGd;AAAA,yBAAC,SAAI,WAAU,uBAAsB,SAAQ,aAAY,OAAM,MAAK,QAAO,MAAK,eAAY,QAC1F;AAAA,0BAAC,UAAK,OAAM,MAAK,QAAO,MAAK,IAAG,OAAM,MAAK,gBAAe,SAAQ,QAAO;AAAA,MACzE,oBAAC,UAAK,GAAE,oHAAmH,MAAK,gBAAe;AAAA,OACjJ;AAAA,IACC;AAAA,KACH;AAEJ;AASA,SAAS,YAAY,QAAyB;AAC5C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,YAAU,MAAM;AACd,QAAI,SAAS;AACb,UAAM,MAAM,OAAO,SAAS,YAAY;AACxC,UAAM,OAAO,QAAQ,MAAM,MAAM,IAAI,QAAQ,OAAO,EAAE;AACtD,SAAK,OAAO,0BAA0B,EACnC,KAAK,OAAO,EAAE,gBAAgB,gCAAgC,MAAM;AACnE,YAAM,IAAI,MAAM,eAAe,QAAQ,IAAI;AAC3C,UAAI,UAAU,EAAG,aAAY,gCAAgC,CAAC,CAAC;AAAA,IACjE,CAAC,EACA,MAAM,MAAM,MAAS;AACxB,WAAO,MAAM;AACX,eAAS;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,CAAC;AACX,SAAO;AACT;AAUO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA,WAAW;AACb,GAUG;AACD,QAAM,EAAE,MAAM,QAAQ,IAAI,QAAQ;AAClC,QAAM,EAAE,SAAS,IAAI,UAAU;AAE/B,QAAM,OAAO,CAAC,OAAoB,OAAe,UAC/C;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,qBAAqB,WAAW,QAAQ,eAAe,EAAE,GAAG,UAAU,cAAc,WAAW,uBAAuB,EAAE;AAAA,MACnI,gBAAc,WAAW;AAAA,MACzB,OAAO;AAAA,MACP,SAAS,MAAM;AACb,YAAI,UAAU,OAAQ,cAAa,KAAK;AACxC,iBAAS,KAAK;AAAA,MAChB;AAAA,MAEC;AAAA;AAAA,EACH;AAGF,SACE,iCACG;AAAA,SAAK,QAAQ,aAAa,+CAA+C;AAAA,IACzE,KAAK,YAAY,YAAY,WAAW,sDAAsD,iEAAiE;AAAA,IAChK,oBAAC,UAAK,WAAU,sBAAqB,eAAY,QAAO;AAAA,IAEvD,CAAC,QACA,oBAAC,OAAE,MAAK,WAAU,WAAU,sBAAqB,OAAM,4CAA2C,qBAElG;AAAA,IAEF,oBAAC,YAAO,MAAK,UAAS,WAAU,sBAAqB,SAAS,MAAM,KAAK,QAAQ,GAAG,uBAEpF;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/News.js

@@ -18,7 +18,7 @@ function useNews(opts = {}) {
   const live = opts.live ?? editor;
   const cap = Math.min(opts.max ?? 50, 50);
   const zichtbaar = (a) => a.published && (!a.date || String(a.date).slice(0, 10) <= (/* @__PURE__ */ new Date()).toISOString().slice(0, 10));
-  const seed = serverNews ? (onlyPublished ? serverNews.filter(zichtbaar) : serverNews).slice(0, cap) : [];
+  const seed = serverNews ? (onlyPublished ? serverNews.filter((a) => a.published) : serverNews).slice(0, cap) : [];
   const [articles, setArticles] = useState(seed);
   const [loading, setLoading] = useState(!serverNews);
   useEffect(() => {
@@ -88,23 +88,31 @@ function NewsList({ basePath = "/nieuws", className, emptyLabel = "Nog geen nieu
   if (articles.length === 0) return /* @__PURE__ */ jsx("p", { children: emptyLabel });
   const all = typeof limit === "number" ? articles.slice(0, limit) : articles;
   const shown = paged ? all.slice(0, visible) : all;
-  return /* @__PURE__ */ jsxs("div", { className, style: { display: "grid", gap: "1rem" }, children: [
-    shown.map((a, i) => /* @__PURE__ */ jsxs("article", { className: "xicms-card", style: { padding: "1.25rem" }, children: [
-      a.coverUrl && // Eerste cover boven de vouw = vaak de LCP → priority (geen lazy-load-vertraging).
-      /* @__PURE__ */ jsx(Img, { src: a.coverUrl, alt: "", width: 1200, height: 700, sizes: "(max-width: 720px) 100vw, 33vw", priority: i === 0, style: { width: "100%", height: "auto", borderRadius: 8, marginBottom: "0.75rem" } }),
-      /* @__PURE__ */ jsx("p", { style: { fontSize: 12, opacity: 0.7, margin: 0 }, children: a.date }),
-      /* @__PURE__ */ jsxs("h2", { style: { margin: "0.25rem 0", fontSize: "1.35rem" }, children: [
-        /* @__PURE__ */ jsx("a", { href: `${basePath}/${a.slug ?? a.id}`, children: a.title }),
-        !a.published && /* @__PURE__ */ jsx("span", { style: { marginLeft: 8, fontSize: 12, color: "#b45309" }, children: "(concept)" })
-      ] }),
-      a.excerpt && /* @__PURE__ */ jsx("p", { style: { margin: 0, opacity: 0.85 }, children: a.excerpt })
-    ] }, a.id)),
-    paged && shown.length < all.length && /* @__PURE__ */ jsx("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ jsxs("button", { type: "button", className: "xicms-btn", onClick: () => setVisible((v) => v + pageSize), children: [
-      "Meer laden (",
-      all.length - shown.length,
-      ")"
-    ] }) })
-  ] });
+  return (
+    /* 8.12: een raster van gelijke kaarten. Tot nu toe stond elk bericht onder het vorige met zijn
+       cover op volle breedte en natuurlijke hoogte — één staande foto was een heel scherm. Nu een
+       vaste beeldverhouding, de titel in de tekstkleur (niet het blauw van een kale link) en de
+       hele kaart klikbaar. */
+    /* @__PURE__ */ jsxs("div", { className: ["xicms-nieuwslijst", className].filter(Boolean).join(" "), children: [
+      shown.map((a, i) => /* @__PURE__ */ jsxs("article", { className: "xicms-card xicms-nieuwskaart", children: [
+        a.coverUrl && // Eerste cover boven de vouw = vaak de LCP → priority (geen lazy-load-vertraging).
+        /* @__PURE__ */ jsx(Img, { src: a.coverUrl, alt: "", width: 1200, height: 750, sizes: "(max-width: 720px) 100vw, 33vw", priority: i === 0, className: "xicms-nieuwskaart__beeld" }),
+        /* @__PURE__ */ jsxs("div", { className: "xicms-nieuwskaart__tekst", children: [
+          /* @__PURE__ */ jsx("p", { className: "xicms-nieuwskaart__datum", children: a.date }),
+          /* @__PURE__ */ jsxs("h2", { className: "xicms-nieuwskaart__titel", children: [
+            /* @__PURE__ */ jsx("a", { href: `${basePath}/${a.slug ?? a.id}`, children: a.title }),
+            !a.published && /* @__PURE__ */ jsx("span", { className: "xicms-nieuwskaart__concept", children: "(concept)" })
+          ] }),
+          a.excerpt && /* @__PURE__ */ jsx("p", { className: "xicms-nieuwskaart__samenvatting", children: a.excerpt })
+        ] })
+      ] }, a.id)),
+      paged && shown.length < all.length && /* @__PURE__ */ jsx("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ jsxs("button", { type: "button", className: "xicms-btn", onClick: () => setVisible((v) => v + pageSize), children: [
+        "Meer laden (",
+        all.length - shown.length,
+        ")"
+      ] }) })
+    ] })
+  );
 }
 function articleBlogPostingJsonLd(article, opts = {}) {
   return {

package/dist/components/News.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/News.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useSiteConfig } from \"../config\";\nimport DOMPurify from \"dompurify\";\nimport { useAuth } from \"../auth/AuthProvider\";\nimport { canEdit } from \"../auth/roles\";\nimport { useBlockData } from \"../blocks/context\";\nimport { isDemoActive, getDemoNews } from \"../demo/demoStore\";\nimport { Img } from \"../media/ImageContext\";\nimport type { NewsArticle } from \"../content/types\";\nimport { jsonLdHtml } from \"../blocks/builtins/jsonld\";\n\n/**\n * Lijst van nieuwsartikelen voor de huidige site.\n * - `live: false` (standaard publiek): één keer ophalen met getDocs → geen per-bezoeker listener\n *   (scheelt Firestore-kosten op druk bezochte sites).\n * - `live: true` (admin): realtime via onSnapshot, zodat wijzigingen meteen zichtbaar zijn.\n */\nexport function useNews(opts: { onlyPublished?: boolean; live?: boolean; max?: number } = {}): {\n  articles: NewsArticle[];\n  loading: boolean;\n} {\n  const { siteId } = useSiteConfig();\n  // Via useAuth (niet via het deprecated ContentProvider-pad — News hoort niet aan legacy te hangen).\n  const { role } = useAuth();\n  const editor = canEdit(role);\n  // Server-gefetchte nieuwsdata (content-bundle 5.7): als de publieke route deze via\n  // <BlockDataProvider data={{ news }}> meegeeft, renderen we daaruit (SSR, geen browser-Firestore).\n  // Afwezig (admin/preview/dev, of geen bundle) → val terug op het Firestore-pad hieronder.\n  const serverNews = useBlockData<NewsArticle[]>(\"news\");\n  const onlyPublished = opts.onlyPublished ?? !editor;\n  const live = opts.live ?? editor; // editors zien live; publiek één keer\n  // Begrens de query: zonder cap zou een nieuws-rijke site ALLE artikelen downloaden bij elk bezoek.\n  const cap = Math.min(opts.max ?? 50, 50);\n  // Bundle-data staat al bij de EERSTE render klaar (server + hydration, identiek): de nieuwsinhoud\n  // zit zo in de SSR-HTML (SEO) i.p.v. pas na een client-effect (geen \"laden…\"-flits).\n  // 7.24: gepubliceerd én niet in de toekomst gedateerd (ingepland artikel). Editors zien alles.\n  const zichtbaar = (a: NewsArticle) => a.published && (!a.date || String(a.date).slice(0, 10) <= new Date().toISOString().slice(0, 10));\n  const seed = serverNews ? (onlyPublished ? serverNews.filter(zichtbaar) : serverNews).slice(0, cap) : [];\n  const [articles, setArticles] = useState<NewsArticle[]>(seed);\n  const [loading, setLoading] = useState(!serverNews);\n\n  useEffect(() => {\n    // Bundle-data aanwezig? Render daaruit — geen listener, geen getDocs.\n    if (serverNews) {\n      const all = onlyPublished ? serverNews.filter(zichtbaar) : serverNews;\n      setArticles(all.slice(0, cap));\n      setLoading(false);\n      return;\n    }\n    // Demo-modus: nieuws komt uit de lokale seed (geen Firebase), zodat nieuws-blokken/widgets\n    // in de demo ook gevuld zijn.\n    if (isDemoActive()) {\n      const all = getDemoNews(siteId);\n      setArticles((onlyPublished ? all.filter(zichtbaar) : all).slice(0, cap));\n      setLoading(false);\n      return;\n    }\n    // Firestore DYNAMISCH. Met bundle-data (hierboven) komen we hier niet eens; zonder bundle\n    // laadt de SDK pas wanneer er echt nieuws opgehaald moet worden. Statisch importeren zette hem\n    // in de bundel van élke publieke pagina, ook die zonder nieuws.\n    let afgebroken = false;\n    let unsub: (() => void) | undefined;\n    void (async () => {\n      const [{ getDb }, fs] = await Promise.all([\n        import(\"../firebase/client\"),\n        import(\"firebase/firestore\"),\n      ]);\n      const db = getDb();\n      if (!db || afgebroken) {\n        setLoading(false);\n        return;\n      }\n      const base = fs.collection(db, \"sites\", siteId, \"news\");\n      const q = onlyPublished\n        ? fs.query(base, fs.where(\"published\", \"==\", true), fs.orderBy(\"date\", \"desc\"), fs.limit(cap))\n        : fs.query(base, fs.orderBy(\"date\", \"desc\"), fs.limit(cap));\n      const map = (snap: { docs: { id: string; data: () => unknown }[] }) => {\n        const rijen = snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<NewsArticle, \"id\">) }));\n        setArticles(onlyPublished ? rijen.filter(zichtbaar) : rijen);\n      };\n\n      if (!live) {\n        try {\n          const snap = await fs.getDocs(q);\n          if (!afgebroken) {\n            map(snap);\n            setLoading(false);\n          }\n        } catch {\n          if (!afgebroken) setLoading(false);\n        }\n        return;\n      }\n      unsub = fs.onSnapshot(\n        q,\n        (snap) => {\n          map(snap);\n          setLoading(false);\n        },\n        () => setLoading(false),\n      );\n    })();\n    return () => {\n      afgebroken = true;\n      unsub?.();\n    };\n  }, [siteId, onlyPublished, live, cap, serverNews]);\n\n  return { articles, loading };\n}\n\ninterface NewsListProps {\n  /** Basispad voor links naar een artikel, bv. \"/nieuws\". */\n  basePath?: string;\n  className?: string;\n  emptyLabel?: string;\n  /** Maximaal aantal artikelen om te tonen. */\n  limit?: number;\n  /** Toon eerst dit aantal en laad de rest met een \"Meer laden\"-knop (0/leeg = alles ineens). */\n  pageSize?: number;\n}\n\n/** Standaardweergave van nieuwsartikelen als kaartenlijst, optioneel gepagineerd. */\nexport function NewsList({ basePath = \"/nieuws\", className, emptyLabel = \"Nog geen nieuws.\", limit, pageSize }: NewsListProps) {\n  const { articles, loading } = useNews({ max: limit });\n  const paged = typeof pageSize === \"number\" && pageSize > 0;\n  const [visible, setVisible] = useState(paged ? pageSize : Infinity);\n\n  if (loading) return <p>Nieuws laden…</p>;\n  if (articles.length === 0) return <p>{emptyLabel}</p>;\n\n  const all = typeof limit === \"number\" ? articles.slice(0, limit) : articles;\n  const shown = paged ? all.slice(0, visible) : all;\n\n  return (\n    <div className={className} style={{ display: \"grid\", gap: \"1rem\" }}>\n      {shown.map((a, i) => (\n        <article key={a.id} className=\"xicms-card\" style={{ padding: \"1.25rem\" }}>\n          {a.coverUrl && (\n            // Eerste cover boven de vouw = vaak de LCP → priority (geen lazy-load-vertraging).\n            <Img src={a.coverUrl} alt=\"\" width={1200} height={700} sizes=\"(max-width: 720px) 100vw, 33vw\" priority={i === 0} style={{ width: \"100%\", height: \"auto\", borderRadius: 8, marginBottom: \"0.75rem\" }} />\n          )}\n          <p style={{ fontSize: 12, opacity: 0.7, margin: 0 }}>{a.date}</p>\n          {/* h2: de lijst staat direct onder de pagina-h1 — h3 zou een kopniveau overslaan. */}\n          <h2 style={{ margin: \"0.25rem 0\", fontSize: \"1.35rem\" }}>\n            <a href={`${basePath}/${a.slug ?? a.id}`}>{a.title}</a>\n            {!a.published && <span style={{ marginLeft: 8, fontSize: 12, color: \"#b45309\" }}>(concept)</span>}\n          </h2>\n          {a.excerpt && <p style={{ margin: 0, opacity: 0.85 }}>{a.excerpt}</p>}\n        </article>\n      ))}\n      {paged && shown.length < all.length && (\n        <div style={{ textAlign: \"center\" }}>\n          <button type=\"button\" className=\"xicms-btn\" onClick={() => setVisible((v) => v + (pageSize as number))}>\n            Meer laden ({all.length - shown.length})\n          </button>\n        </div>\n      )}\n    </div>\n  );\n}\n\n/** BlogPosting-JSON-LD voor een artikel — puur, zodat het testbaar is. */\nexport function articleBlogPostingJsonLd(article: NewsArticle, opts: { siteName?: string; url?: string } = {}): Record<string, unknown> {\n  return {\n    \"@context\": \"https://schema.org\",\n    \"@type\": \"BlogPosting\",\n    headline: article.title,\n    datePublished: article.date,\n    ...(article.excerpt ? { description: article.excerpt } : {}),\n    ...(article.coverUrl ? { image: article.coverUrl } : {}),\n    ...(opts.url ? { url: opts.url, mainEntityOfPage: opts.url } : {}),\n    ...(opts.siteName ? { publisher: { \"@type\": \"Organization\", name: opts.siteName } } : {}),\n  };\n}\n\n/** Detailweergave van één artikel, met BlogPosting-JSON-LD voor zoekmachines. */\nexport function NewsArticleView({ article, jsonLd = true }: { article: NewsArticle; jsonLd?: boolean }) {\n  const { name } = useSiteConfig();\n  // De render is de veiligheidsgrens: rich-text gaat door DOMPurify. Die heeft echter een echte DOM\n  // nodig, dus op de server is hij geen optie — waardoor de opmaak vroeger pas ná hydratie verscheen.\n  // Een crawler zag dan alleen kale tekst, en de lezer een layoutverschuiving.\n  //\n  // Komt het artikel uit de content-bundle (server-side meegegeven via BlockDataProvider), dan is\n  // het al server-side gesaneerd in `getBundleNews` en mogen we het direct renderen — óók in de\n  // SSR-HTML. Alleen client-gefetchte artikelen (admin/preview/dev, of geen bundle) wachten nog op\n  // DOMPurify; die kunnen immers ongesaneerd uit Firestore komen.\n  const serverNews = useBlockData<NewsArticle[]>(\"news\");\n  const trusted = Boolean(\n    article.bodyHtml && serverNews?.some((a) => a.slug === article.slug && a.bodyHtml === article.bodyHtml),\n  );\n  const [html, setHtml] = useState<string | null>(trusted ? (article.bodyHtml ?? null) : null);\n  useEffect(() => {\n    // Ook voor vertrouwde HTML: opnieuw saneren is idempotent en houdt de client-grens hard.\n    setHtml(article.bodyHtml ? DOMPurify.sanitize(article.bodyHtml) : null);\n  }, [article.bodyHtml]);\n  // Fallback tot de sanitizer klaar is: kale tekst (tags gestript, gerenderd als tekstnodes — veilig).\n  const fallbackText = article.body ?? (article.bodyHtml ? article.bodyHtml.replace(/<[^>]*>/g, \" \") : \"\");\n  return (\n    <article>\n      <p style={{ fontSize: 12, opacity: 0.6 }}>{article.date}</p>\n      <h1>{article.title}</h1>\n      {article.coverUrl && (\n        <Img src={article.coverUrl} alt=\"\" width={1200} height={700} sizes=\"(max-width: 900px) 100vw, 800px\" priority style={{ width: \"100%\", height: \"auto\", borderRadius: 12, margin: \"1rem 0\" }} />\n      )}\n      {html ? (\n        // eslint-disable-next-line react/no-danger\n        <div className=\"xicms-richtext\" dangerouslySetInnerHTML={{ __html: html }} />\n      ) : (\n        fallbackText.split(/\\n{2,}/).map((p, i) => (\n          <p key={i} style={{ whiteSpace: \"pre-wrap\" }}>\n            {p}\n          </p>\n        ))\n      )}\n      {jsonLd && (\n        <script\n          type=\"application/ld+json\"\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{ __html: jsonLdHtml(articleBlogPostingJsonLd(article, { siteName: name })) }}\n        />\n      )}\n    </article>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/News.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useSiteConfig } from \"../config\";\nimport DOMPurify from \"dompurify\";\nimport { useAuth } from \"../auth/AuthProvider\";\nimport { canEdit } from \"../auth/roles\";\nimport { useBlockData } from \"../blocks/context\";\nimport { isDemoActive, getDemoNews } from \"../demo/demoStore\";\nimport { Img } from \"../media/ImageContext\";\nimport type { NewsArticle } from \"../content/types\";\nimport { jsonLdHtml } from \"../blocks/builtins/jsonld\";\n\n/**\n * Lijst van nieuwsartikelen voor de huidige site.\n * - `live: false` (standaard publiek): één keer ophalen met getDocs → geen per-bezoeker listener\n *   (scheelt Firestore-kosten op druk bezochte sites).\n * - `live: true` (admin): realtime via onSnapshot, zodat wijzigingen meteen zichtbaar zijn.\n */\nexport function useNews(opts: { onlyPublished?: boolean; live?: boolean; max?: number } = {}): {\n  articles: NewsArticle[];\n  loading: boolean;\n} {\n  const { siteId } = useSiteConfig();\n  // Via useAuth (niet via het deprecated ContentProvider-pad — News hoort niet aan legacy te hangen).\n  const { role } = useAuth();\n  const editor = canEdit(role);\n  // Server-gefetchte nieuwsdata (content-bundle 5.7): als de publieke route deze via\n  // <BlockDataProvider data={{ news }}> meegeeft, renderen we daaruit (SSR, geen browser-Firestore).\n  // Afwezig (admin/preview/dev, of geen bundle) → val terug op het Firestore-pad hieronder.\n  const serverNews = useBlockData<NewsArticle[]>(\"news\");\n  const onlyPublished = opts.onlyPublished ?? !editor;\n  const live = opts.live ?? editor; // editors zien live; publiek één keer\n  // Begrens de query: zonder cap zou een nieuws-rijke site ALLE artikelen downloaden bij elk bezoek.\n  const cap = Math.min(opts.max ?? 50, 50);\n  // Bundle-data staat al bij de EERSTE render klaar (server + hydration, identiek): de nieuwsinhoud\n  // zit zo in de SSR-HTML (SEO) i.p.v. pas na een client-effect (geen \"laden…\"-flits).\n  // 7.24: gepubliceerd én niet in de toekomst gedateerd (ingepland artikel). Editors zien alles.\n  const zichtbaar = (a: NewsArticle) => a.published && (!a.date || String(a.date).slice(0, 10) <= new Date().toISOString().slice(0, 10));\n  // Seed zonder datumfilter (8.1): de server-data is al gefilterd op het moment van ophalen, en\n  // `new Date()` hier gaf een andere uitkomst op de server (gecachete HTML) dan bij de hydratie.\n  // Het effect hieronder past het datumfilter direct daarna toe.\n  const seed = serverNews ? (onlyPublished ? serverNews.filter((a) => a.published) : serverNews).slice(0, cap) : [];\n  const [articles, setArticles] = useState<NewsArticle[]>(seed);\n  const [loading, setLoading] = useState(!serverNews);\n\n  useEffect(() => {\n    // Bundle-data aanwezig? Render daaruit — geen listener, geen getDocs.\n    if (serverNews) {\n      const all = onlyPublished ? serverNews.filter(zichtbaar) : serverNews;\n      setArticles(all.slice(0, cap));\n      setLoading(false);\n      return;\n    }\n    // Demo-modus: nieuws komt uit de lokale seed (geen Firebase), zodat nieuws-blokken/widgets\n    // in de demo ook gevuld zijn.\n    if (isDemoActive()) {\n      const all = getDemoNews(siteId);\n      setArticles((onlyPublished ? all.filter(zichtbaar) : all).slice(0, cap));\n      setLoading(false);\n      return;\n    }\n    // Firestore DYNAMISCH. Met bundle-data (hierboven) komen we hier niet eens; zonder bundle\n    // laadt de SDK pas wanneer er echt nieuws opgehaald moet worden. Statisch importeren zette hem\n    // in de bundel van élke publieke pagina, ook die zonder nieuws.\n    let afgebroken = false;\n    let unsub: (() => void) | undefined;\n    void (async () => {\n      const [{ getDb }, fs] = await Promise.all([\n        import(\"../firebase/client\"),\n        import(\"firebase/firestore\"),\n      ]);\n      const db = getDb();\n      if (!db || afgebroken) {\n        setLoading(false);\n        return;\n      }\n      const base = fs.collection(db, \"sites\", siteId, \"news\");\n      const q = onlyPublished\n        ? fs.query(base, fs.where(\"published\", \"==\", true), fs.orderBy(\"date\", \"desc\"), fs.limit(cap))\n        : fs.query(base, fs.orderBy(\"date\", \"desc\"), fs.limit(cap));\n      const map = (snap: { docs: { id: string; data: () => unknown }[] }) => {\n        const rijen = snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<NewsArticle, \"id\">) }));\n        setArticles(onlyPublished ? rijen.filter(zichtbaar) : rijen);\n      };\n\n      if (!live) {\n        try {\n          const snap = await fs.getDocs(q);\n          if (!afgebroken) {\n            map(snap);\n            setLoading(false);\n          }\n        } catch {\n          if (!afgebroken) setLoading(false);\n        }\n        return;\n      }\n      unsub = fs.onSnapshot(\n        q,\n        (snap) => {\n          map(snap);\n          setLoading(false);\n        },\n        () => setLoading(false),\n      );\n    })();\n    return () => {\n      afgebroken = true;\n      unsub?.();\n    };\n  }, [siteId, onlyPublished, live, cap, serverNews]);\n\n  return { articles, loading };\n}\n\ninterface NewsListProps {\n  /** Basispad voor links naar een artikel, bv. \"/nieuws\". */\n  basePath?: string;\n  className?: string;\n  emptyLabel?: string;\n  /** Maximaal aantal artikelen om te tonen. */\n  limit?: number;\n  /** Toon eerst dit aantal en laad de rest met een \"Meer laden\"-knop (0/leeg = alles ineens). */\n  pageSize?: number;\n}\n\n/** Standaardweergave van nieuwsartikelen als kaartenlijst, optioneel gepagineerd. */\nexport function NewsList({ basePath = \"/nieuws\", className, emptyLabel = \"Nog geen nieuws.\", limit, pageSize }: NewsListProps) {\n  const { articles, loading } = useNews({ max: limit });\n  const paged = typeof pageSize === \"number\" && pageSize > 0;\n  const [visible, setVisible] = useState(paged ? pageSize : Infinity);\n\n  if (loading) return <p>Nieuws laden…</p>;\n  if (articles.length === 0) return <p>{emptyLabel}</p>;\n\n  const all = typeof limit === \"number\" ? articles.slice(0, limit) : articles;\n  const shown = paged ? all.slice(0, visible) : all;\n\n  return (\n    /* 8.12: een raster van gelijke kaarten. Tot nu toe stond elk bericht onder het vorige met zijn\n       cover op volle breedte en natuurlijke hoogte — één staande foto was een heel scherm. Nu een\n       vaste beeldverhouding, de titel in de tekstkleur (niet het blauw van een kale link) en de\n       hele kaart klikbaar. */\n    <div className={[\"xicms-nieuwslijst\", className].filter(Boolean).join(\" \")}>\n      {shown.map((a, i) => (\n        <article key={a.id} className=\"xicms-card xicms-nieuwskaart\">\n          {a.coverUrl && (\n            // Eerste cover boven de vouw = vaak de LCP → priority (geen lazy-load-vertraging).\n            <Img src={a.coverUrl} alt=\"\" width={1200} height={750} sizes=\"(max-width: 720px) 100vw, 33vw\" priority={i === 0} className=\"xicms-nieuwskaart__beeld\" />\n          )}\n          <div className=\"xicms-nieuwskaart__tekst\">\n            <p className=\"xicms-nieuwskaart__datum\">{a.date}</p>\n            {/* h2: de lijst staat direct onder de pagina-h1 — h3 zou een kopniveau overslaan. */}\n            <h2 className=\"xicms-nieuwskaart__titel\">\n              <a href={`${basePath}/${a.slug ?? a.id}`}>{a.title}</a>\n              {!a.published && <span className=\"xicms-nieuwskaart__concept\">(concept)</span>}\n            </h2>\n            {a.excerpt && <p className=\"xicms-nieuwskaart__samenvatting\">{a.excerpt}</p>}\n          </div>\n        </article>\n      ))}\n      {paged && shown.length < all.length && (\n        <div style={{ textAlign: \"center\" }}>\n          <button type=\"button\" className=\"xicms-btn\" onClick={() => setVisible((v) => v + (pageSize as number))}>\n            Meer laden ({all.length - shown.length})\n          </button>\n        </div>\n      )}\n    </div>\n  );\n}\n\n/** BlogPosting-JSON-LD voor een artikel — puur, zodat het testbaar is. */\nexport function articleBlogPostingJsonLd(article: NewsArticle, opts: { siteName?: string; url?: string } = {}): Record<string, unknown> {\n  return {\n    \"@context\": \"https://schema.org\",\n    \"@type\": \"BlogPosting\",\n    headline: article.title,\n    datePublished: article.date,\n    ...(article.excerpt ? { description: article.excerpt } : {}),\n    ...(article.coverUrl ? { image: article.coverUrl } : {}),\n    ...(opts.url ? { url: opts.url, mainEntityOfPage: opts.url } : {}),\n    ...(opts.siteName ? { publisher: { \"@type\": \"Organization\", name: opts.siteName } } : {}),\n  };\n}\n\n/** Detailweergave van één artikel, met BlogPosting-JSON-LD voor zoekmachines. */\nexport function NewsArticleView({ article, jsonLd = true }: { article: NewsArticle; jsonLd?: boolean }) {\n  const { name } = useSiteConfig();\n  // De render is de veiligheidsgrens: rich-text gaat door DOMPurify. Die heeft echter een echte DOM\n  // nodig, dus op de server is hij geen optie — waardoor de opmaak vroeger pas ná hydratie verscheen.\n  // Een crawler zag dan alleen kale tekst, en de lezer een layoutverschuiving.\n  //\n  // Komt het artikel uit de content-bundle (server-side meegegeven via BlockDataProvider), dan is\n  // het al server-side gesaneerd in `getBundleNews` en mogen we het direct renderen — óók in de\n  // SSR-HTML. Alleen client-gefetchte artikelen (admin/preview/dev, of geen bundle) wachten nog op\n  // DOMPurify; die kunnen immers ongesaneerd uit Firestore komen.\n  const serverNews = useBlockData<NewsArticle[]>(\"news\");\n  const trusted = Boolean(\n    article.bodyHtml && serverNews?.some((a) => a.slug === article.slug && a.bodyHtml === article.bodyHtml),\n  );\n  const [html, setHtml] = useState<string | null>(trusted ? (article.bodyHtml ?? null) : null);\n  useEffect(() => {\n    // Ook voor vertrouwde HTML: opnieuw saneren is idempotent en houdt de client-grens hard.\n    setHtml(article.bodyHtml ? DOMPurify.sanitize(article.bodyHtml) : null);\n  }, [article.bodyHtml]);\n  // Fallback tot de sanitizer klaar is: kale tekst (tags gestript, gerenderd als tekstnodes — veilig).\n  const fallbackText = article.body ?? (article.bodyHtml ? article.bodyHtml.replace(/<[^>]*>/g, \" \") : \"\");\n  return (\n    <article>\n      <p style={{ fontSize: 12, opacity: 0.6 }}>{article.date}</p>\n      <h1>{article.title}</h1>\n      {article.coverUrl && (\n        <Img src={article.coverUrl} alt=\"\" width={1200} height={700} sizes=\"(max-width: 900px) 100vw, 800px\" priority style={{ width: \"100%\", height: \"auto\", borderRadius: 12, margin: \"1rem 0\" }} />\n      )}\n      {html ? (\n        // eslint-disable-next-line react/no-danger\n        <div className=\"xicms-richtext\" dangerouslySetInnerHTML={{ __html: html }} />\n      ) : (\n        fallbackText.split(/\\n{2,}/).map((p, i) => (\n          <p key={i} style={{ whiteSpace: \"pre-wrap\" }}>\n            {p}\n          </p>\n        ))\n      )}\n      {jsonLd && (\n        <script\n          type=\"application/ld+json\"\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{ __html: jsonLdHtml(articleBlogPostingJsonLd(article, { siteName: name })) }}\n        />\n      )}\n    </article>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/PageView.d.ts

@@ -10,4 +10,10 @@ export declare function PageView({ path }: {
  * Telt een gebeurtenis (7.24): "formulier" verstuurd, "uitgaand" geklikt, enz. Zelfde teller,
  * zelfde privacy-regels; fire-and-forget en nooit een fout naar de bezoeker.
  */
-export declare function trackEvent(siteId: string, event: "formulier" | "bestelling" | "uitgaand" | "telefoon" | "mail" | "whatsapp", path?: string): void;
+export declare function trackEvent(siteId: string, event: "formulier" | "bestelling" | "uitgaand" | "telefoon" | "mail" | "whatsapp" | "niet-gevonden", path?: string): void;
+/**
+ * 404-monitor (8.4): zet dit op de niet-gevonden-pagina van de site. Meldt het pad één keer per
+ * sessie; in /beheer → Statistieken verschijnen de vaakst gemiste adressen met een knop om er een
+ * doorverwijzing van te maken. Geen cookies, alleen het pad.
+ */
+export declare function NietGevondenMelder(): null;

package/dist/components/PageView.js

@@ -5,6 +5,7 @@ function PageView({ path }) {
   const { siteId } = useSiteConfig();
   useEffect(() => {
     if (typeof window === "undefined") return;
+    if (navigator.webdriver) return;
     const key = `xicms_view:${siteId}:${path}`;
     try {
       if (sessionStorage.getItem(key)) return;
@@ -45,7 +46,23 @@ function trackEvent(siteId, event, path) {
   })().catch(() => {
   });
 }
+function NietGevondenMelder() {
+  const { siteId } = useSiteConfig();
+  useEffect(() => {
+    if (typeof window === "undefined" || navigator.webdriver) return;
+    const pad = window.location.pathname;
+    const key = `xicms_404:${siteId}:${pad}`;
+    try {
+      if (sessionStorage.getItem(key)) return;
+      sessionStorage.setItem(key, "1");
+    } catch {
+    }
+    trackEvent(siteId, "niet-gevonden", pad);
+  }, [siteId]);
+  return null;
+}
 export {
+  NietGevondenMelder,
   PageView,
   trackEvent
 };