@xiwebdesign/xicms-core 7.31.0 → 8.16.0

package/dist/admin/blockEditors/GenericEditor.js

@@ -7,7 +7,11 @@ import { Select } from "../ui/select.js";
 import { Switch } from "../ui/switch.js";
 import { ArrayEditor } from "../ui/ArrayEditor.js";
 import { RichTextEditor } from "../editors/RichTextEditor.js";
-import { MediaPickerButton } from "../media/MediaPicker.js";
+import { ImageField } from "../ui/ImageField.js";
+import { LinkVeld } from "../ui/LinkVeld.js";
+import { lengteAdvies } from "../lib/lengteAdvies.js";
+import { TECHNISCHE_VELDEN, vertaalVelden } from "../lib/veldTaal.js";
+import { useIsSuperadmin } from "../lib/useIsSuperadmin.js";
 import { useRegistry } from "../../blocks/context.js";
 import { subscribePages } from "../lib/pagesClient.js";
 import { introspectToFields, introspectObjectSchema } from "../lib/zodFields.js";
@@ -19,7 +23,8 @@ function FieldsForm({
   siteId,
   jsonSchemas
 }) {
-  return /* @__PURE__ */ jsx("div", { className: "grid gap-3", children: fields.filter((f) => isFieldVisible(f, values)).map((f) => /* @__PURE__ */ jsx(FieldWidget, { f, values, onChange, siteId, jsonSchema: jsonSchemas?.[f.key] }, f.key)) });
+  const superadmin = useIsSuperadmin();
+  return /* @__PURE__ */ jsx("div", { className: "grid gap-3", children: fields.filter((f) => isFieldVisible(f, values) && (superadmin || !TECHNISCHE_VELDEN.has(f.key))).map((f) => /* @__PURE__ */ jsx(FieldWidget, { f, values, onChange, siteId, jsonSchema: jsonSchemas?.[f.key] }, f.key)) });
 }
 function FieldWidget({
   f,
@@ -39,6 +44,22 @@ function FieldWidget({
     case "select":
       return /* @__PURE__ */ jsx(SelectField, { f, v, set });
     case "number":
+      if (f.min !== void 0 && f.max !== void 0 && Number.isInteger(f.min) && Number.isInteger(f.max) && f.max - f.min <= 5) {
+        const opties = Array.from({ length: f.max - f.min + 1 }, (_, i) => f.min + i);
+        const huidig = typeof v === "number" ? v : void 0;
+        return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx("div", { role: "radiogroup", "aria-label": f.label, className: "inline-flex flex-wrap gap-1", children: opties.map((n) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            role: "radio",
+            "aria-checked": huidig === n,
+            onClick: () => set(n),
+            className: "xicms-admin-btn h-9 min-w-9 rounded-md border border-slate-200 px-2 text-sm font-medium text-slate-700 hover:bg-slate-100 aria-[checked=true]:border-slate-900 aria-[checked=true]:bg-slate-900 aria-[checked=true]:text-white",
+            children: f.key === "rating" ? "\u2605".repeat(n) : n
+          },
+          n
+        )) }) });
+      }
       return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx(
         Input,
         {
@@ -70,19 +91,16 @@ function FieldWidget({
     case "richtext":
       return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx(RichTextEditor, { siteId, value: String(v ?? ""), onChange: set }) });
     case "image":
-      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx(Input, { value: String(v ?? ""), onChange: (e) => set(e.target.value), placeholder: "URL of kies \u2192" }),
-        /* @__PURE__ */ jsx(MediaPickerButton, { siteId, onSelect: (m) => set(m.url) })
-      ] }) });
+      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx(ImageField, { siteId, value: v ? String(v) : void 0, onChange: (url) => set(url ?? "") }) });
     case "url":
-      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx(Input, { value: String(v ?? ""), onChange: (e) => set(e.target.value), placeholder: "https://\u2026 of /pagina" }) });
+      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /href$/i.test(f.key) || f.key === "link" ? /* @__PURE__ */ jsx(LinkVeld, { siteId, value: String(v ?? ""), onChange: set }) : /* @__PURE__ */ jsx(Input, { value: String(v ?? ""), onChange: (e) => set(e.target.value), placeholder: "https://\u2026" }) });
     case "icon":
       return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint ?? "Emoji, bv. \u2702\uFE0F", children: /* @__PURE__ */ jsx(Input, { value: String(v ?? ""), maxLength: 16, onChange: (e) => set(e.target.value), className: "w-24" }) });
     case "link": {
       const link = v ?? {};
-      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
-        /* @__PURE__ */ jsx(Input, { value: link.label ?? "", placeholder: "Tekst", onChange: (e) => set({ ...link, label: e.target.value }) }),
-        /* @__PURE__ */ jsx(Input, { value: link.href ?? "", placeholder: "/pagina of https://\u2026", onChange: (e) => set({ ...link, href: e.target.value }) })
+      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx(Input, { value: link.label ?? "", placeholder: "Tekst op de knop", onChange: (e) => set({ ...link, label: e.target.value }) }),
+        /* @__PURE__ */ jsx(LinkVeld, { siteId, value: link.href ?? "", onChange: (href) => set({ ...link, href }) })
       ] }) });
     }
     case "group": {
@@ -115,14 +133,17 @@ function FieldWidget({
       return /* @__PURE__ */ jsx(JsonField, { label: f.label, value: v, onCommit: set, schema: jsonSchema });
     case "text":
     default:
-      return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx(Input, { value: String(v ?? ""), placeholder: f.type === "text" ? f.placeholder : void 0, onChange: (e) => set(e.target.value) }) });
+      return /* @__PURE__ */ jsxs(FieldRow, { label: f.label, hint: f.hint, children: [
+        /* @__PURE__ */ jsx(Input, { value: String(v ?? ""), placeholder: f.type === "text" ? f.placeholder : void 0, onChange: (e) => set(e.target.value) }),
+        lengteAdvies(f.key, typeof v === "string" ? v : "") && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-amber-700", children: lengteAdvies(f.key, String(v)) })
+      ] });
   }
 }
 function PageRefPicker({ siteId, value, onChange }) {
   const [pages, setPages] = useState([]);
   useEffect(() => subscribePages(siteId, setPages), [siteId]);
   const options = useMemo(() => {
-    const opts = pages.slice().sort((a, b) => a.path < b.path ? -1 : 1).map((p) => ({ value: p.path, label: `${p.title || p.path} (${p.path})` }));
+    const opts = pages.filter((p) => !p.trashed).sort((a, b) => a.path < b.path ? -1 : 1).map((p) => ({ value: p.path, label: `${p.title || p.path} (${p.path})${p.published ? "" : " \u2014 nog niet live"}` }));
     if (value && !opts.some((o) => o.value === value)) opts.unshift({ value, label: value });
     return [{ value: "", label: "\u2014 geen \u2014" }, ...opts];
   }, [pages, value]);
@@ -155,7 +176,7 @@ function JsonField({
       if (!opts.silent) setError("Geen geldige JSON.");
     }
   };
-  return /* @__PURE__ */ jsxs(FieldRow, { label: `${label} (JSON)`, hint: "Geavanceerd veld \u2014 wordt gecontroleerd v\xF3\xF3r opslaan.", children: [
+  return /* @__PURE__ */ jsxs(FieldRow, { label: `${label} (geavanceerd)`, hint: "Technisch veld \u2014 vraag bij twijfel Xi Webdesign. Wordt gecontroleerd v\xF3\xF3r opslaan.", children: [
     /* @__PURE__ */ jsx(
       Textarea,
       {
@@ -179,7 +200,7 @@ function GenericEditor({ block, siteId, onChange }) {
   const fields = useMemo(() => {
     if (!def) return [];
     const custom = def.customFields;
-    return custom ?? introspectToFields(def.schema, def.fields);
+    return vertaalVelden(custom ?? introspectToFields(def.schema, def.fields), def.type);
   }, [def]);
   const jsonSchemas = useMemo(() => {
     if (!def) return {};
@@ -206,13 +227,10 @@ function SelectField({
   v,
   set
 }) {
-  useEffect(() => {
-    if (v == null && f.options[0] !== void 0) set(f.options[0].value);
-  }, []);
   return /* @__PURE__ */ jsx(FieldRow, { label: f.label, hint: f.hint, children: /* @__PURE__ */ jsx(
     Select,
     {
-      value: String(v ?? f.options[0]?.value ?? ""),
+      value: String(v ?? f.standaard ?? f.options[0]?.value ?? ""),
       onValueChange: set,
       options: f.options.map((o) => ({ value: o.value, label: o.label || o.value }))
     }

package/dist/admin/blockEditors/GenericEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/blockEditors/GenericEditor.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * GenericEditor 2.0 (5.0) — het automatisch gegenereerde formulier voor blokken zonder eigen\n * editor, aangedreven door de Field-IR (schema/fields.ts, primo-port):\n *\n * - **repeaters** en **groepen** zijn echte UI (ArrayEditor met toevoegen/verwijderen/↑↓ en een\n *   omkaderde subgroep) i.p.v. een JSON-textarea;\n * - **showIf** verbergt velden conditioneel;\n * - date/slider/link/icoon/pagina-verwijzing hebben eigen widgets;\n * - de JSON-textarea bestaat alleen nog als laatste redmiddel (records/scalar-arrays), met\n *   schema-validatie vóór commit.\n *\n * `FieldsForm` is los herbruikbaar: custom blocks (Fase B) renderen er hun opgeslagen Field-IR mee.\n */\nimport { safeParse } from \"zod/v4/core\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport type { $ZodType as ZodTypeAny } from \"zod/v4/core\";\nimport { Field as FieldRow, Input, Textarea } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { Switch } from \"../ui/switch\";\nimport { ArrayEditor } from \"../ui/ArrayEditor\";\nimport { RichTextEditor } from \"../editors/RichTextEditor\";\nimport { MediaPickerButton } from \"../media/MediaPicker\";\nimport { useRegistry } from \"../../blocks/context\";\nimport { subscribePages, type DraftPage } from \"../lib/pagesClient\";\nimport { introspectToFields, introspectObjectSchema } from \"../lib/zodFields\";\nimport { fieldsDefaults, isFieldVisible, type Field } from \"../../schema/fields\";\n\nexport interface GenericEditorProps {\n  block: Record<string, unknown>;\n  siteId: string;\n  onChange: (next: Record<string, unknown>) => void;\n}\n\n/** Formulier voor een Field-IR over een waarden-object. Recursief (groepen/repeaters). */\nexport function FieldsForm({\n  fields,\n  values,\n  onChange,\n  siteId,\n  jsonSchemas,\n}: {\n  fields: Field[];\n  values: Record<string, unknown>;\n  onChange: (patch: Record<string, unknown>) => void;\n  siteId: string;\n  /** Optioneel: sub-schema per json-veldsleutel voor validatie vóór commit. */\n  jsonSchemas?: Record<string, ZodTypeAny>;\n}) {\n  return (\n    <div className=\"grid gap-3\">\n      {fields.filter((f) => isFieldVisible(f, values)).map((f) => (\n        <FieldWidget key={f.key} f={f} values={values} onChange={onChange} siteId={siteId} jsonSchema={jsonSchemas?.[f.key]} />\n      ))}\n    </div>\n  );\n}\n\nfunction FieldWidget({\n  f,\n  values,\n  onChange,\n  siteId,\n  jsonSchema,\n}: {\n  f: Field;\n  values: Record<string, unknown>;\n  onChange: (patch: Record<string, unknown>) => void;\n  siteId: string;\n  jsonSchema?: ZodTypeAny;\n}) {\n  const v = values[f.key];\n  const set = (val: unknown) => onChange({ [f.key]: val });\n\n  switch (f.type) {\n    case \"switch\":\n      return (\n        <label className=\"flex items-center gap-2 text-sm\">\n          <Switch checked={Boolean(v)} onCheckedChange={set} />\n          {f.label}\n        </label>\n      );\n    case \"select\":\n      return <SelectField f={f} v={v} set={set} />;\n    case \"number\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input\n            type=\"number\"\n            min={f.min}\n            max={f.max}\n            step={f.step}\n            value={v == null ? \"\" : String(v)}\n            onChange={(e) => set(e.target.value === \"\" ? undefined : Number(e.target.value))}\n          />\n        </FieldRow>\n      );\n    case \"slider\": {\n      const val = typeof v === \"number\" ? v : f.min;\n      return (\n        <FieldRow label={`${f.label} (${val})`} hint={f.hint}>\n          <input\n            type=\"range\"\n            min={f.min}\n            max={f.max}\n            step={f.step ?? 1}\n            value={val}\n            onChange={(e) => set(Number(e.target.value))}\n            className=\"w-full\"\n          />\n        </FieldRow>\n      );\n    }\n    case \"date\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input type=\"date\" value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} />\n        </FieldRow>\n      );\n    case \"richtext\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <RichTextEditor siteId={siteId} value={String(v ?? \"\")} onChange={set} />\n        </FieldRow>\n      );\n    case \"image\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <div className=\"flex items-center gap-2\">\n            <Input value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} placeholder=\"URL of kies →\" />\n            <MediaPickerButton siteId={siteId} onSelect={(m) => set(m.url)} />\n          </div>\n        </FieldRow>\n      );\n    case \"url\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} placeholder=\"https://… of /pagina\" />\n        </FieldRow>\n      );\n    case \"icon\":\n      return (\n        <FieldRow label={f.label} hint={f.hint ?? \"Emoji, bv. ✂️\"}>\n          <Input value={String(v ?? \"\")} maxLength={16} onChange={(e) => set(e.target.value)} className=\"w-24\" />\n        </FieldRow>\n      );\n    case \"link\": {\n      const link = (v as { label?: string; href?: string } | undefined) ?? {};\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <div className=\"grid grid-cols-2 gap-2\">\n            <Input value={link.label ?? \"\"} placeholder=\"Tekst\" onChange={(e) => set({ ...link, label: e.target.value })} />\n            <Input value={link.href ?? \"\"} placeholder=\"/pagina of https://…\" onChange={(e) => set({ ...link, href: e.target.value })} />\n          </div>\n        </FieldRow>\n      );\n    }\n    case \"group\": {\n      const group = (v as Record<string, unknown> | undefined) ?? {};\n      return (\n        <fieldset className=\"grid gap-2 rounded-lg border border-slate-200 p-3\">\n          <legend className=\"px-1 text-xs font-semibold text-slate-500\">{f.label}</legend>\n          <FieldsForm fields={f.fields} values={group} onChange={(p) => set({ ...group, ...p })} siteId={siteId} />\n        </fieldset>\n      );\n    }\n    case \"repeater\": {\n      const items = (Array.isArray(v) ? v : []) as Record<string, unknown>[];\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <ArrayEditor<Record<string, unknown>>\n            items={items}\n            onChange={set}\n            newItem={() => fieldsDefaults(f.fields)}\n            addLabel={`+ ${f.itemLabel ?? \"Item\"}`}\n            renderRow={(item, update) => (\n              <FieldsForm fields={f.fields} values={item} onChange={(p) => update(p)} siteId={siteId} />\n            )}\n          />\n        </FieldRow>\n      );\n    }\n    case \"pageRef\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <PageRefPicker siteId={siteId} value={String(v ?? \"\")} onChange={set} />\n        </FieldRow>\n      );\n    case \"info\":\n      return <p className=\"text-xs text-slate-500\">{f.text}</p>;\n    case \"textarea\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Textarea rows={f.rows ?? 4} value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} />\n        </FieldRow>\n      );\n    case \"json\":\n      return <JsonField label={f.label} value={v} onCommit={set} schema={jsonSchema} />;\n    case \"text\":\n    default:\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input value={String(v ?? \"\")} placeholder={f.type === \"text\" ? f.placeholder : undefined} onChange={(e) => set(e.target.value)} />\n        </FieldRow>\n      );\n  }\n}\n\n/** Pagina-verwijzing: kies uit de bestaande pagina's van de site (live lijst). */\nfunction PageRefPicker({ siteId, value, onChange }: { siteId: string; value: string; onChange: (v: string) => void }) {\n  const [pages, setPages] = useState<DraftPage[]>([]);\n  useEffect(() => subscribePages(siteId, setPages), [siteId]);\n  const options = useMemo(() => {\n    const opts = pages\n      .slice()\n      .sort((a, b) => (a.path < b.path ? -1 : 1))\n      .map((p) => ({ value: p.path, label: `${p.title || p.path} (${p.path})` }));\n    // Bewaar een waarde die (nog) niet in de lijst staat, zodat niets stilletjes wegvalt.\n    if (value && !opts.some((o) => o.value === value)) opts.unshift({ value, label: value });\n    return [{ value: \"\", label: \"— geen —\" }, ...opts];\n  }, [pages, value]);\n  return <Select value={value} onValueChange={onChange} options={options} />;\n}\n\n/** Laatste redmiddel voor complexe velden: JSON met schema-validatie vóór commit. */\nfunction JsonField({\n  label,\n  value,\n  onCommit,\n  schema,\n}: {\n  label: string;\n  value: unknown;\n  onCommit: (v: unknown) => void;\n  schema?: ZodTypeAny;\n}) {\n  const [text, setText] = useState(() => JSON.stringify(value ?? null, null, 2));\n  const [error, setError] = useState<string | null>(null);\n  // Committeert de gegeven tekst (niet de state — die is bij een net getypte toets nog niet\n  // bijgewerkt). `silent`: tijdens het typen geen foutmelding tonen voor onvolledige JSON (bv.\n  // een net geopende `[` of `{`) — pas bij blur laten we die zien. VEILIGHEIDSNET: committeert bij\n  // élke wijziging i.p.v. uitsluitend op blur, want blur bleek op mobiel Safari niet altijd te\n  // vuren vóór een externe \"Opslaan\"-klik (race), waardoor een bewerking hier stil verloren ging.\n  const commit = (raw: string, opts: { silent: boolean }) => {\n    try {\n      const parsed = JSON.parse(raw) as unknown;\n      if (schema) {\n        const res = safeParse(schema, parsed);\n        if (!res.success) {\n          if (!opts.silent) setError(\"Voldoet niet aan het verwachte formaat van dit veld.\");\n          return;\n        }\n        setError(null);\n        onCommit(res.data);\n        return;\n      }\n      setError(null);\n      onCommit(parsed);\n    } catch {\n      if (!opts.silent) setError(\"Geen geldige JSON.\");\n    }\n  };\n  return (\n    <FieldRow label={`${label} (JSON)`} hint=\"Geavanceerd veld — wordt gecontroleerd vóór opslaan.\">\n      <Textarea\n        rows={6}\n        value={text}\n        onChange={(e) => {\n          setText(e.target.value);\n          commit(e.target.value, { silent: true });\n        }}\n        onBlur={() => commit(text, { silent: false })}\n        spellCheck={false}\n        className=\"font-mono text-xs\"\n      />\n      {error && <p className=\"text-xs text-red-600\">{error}</p>}\n    </FieldRow>\n  );\n}\n\n/**\n * De blok-editor-fallback: leidt de Field-IR af uit het Zod-schema van het blok (+ optionele\n * `fields`-hints van `defineBlock`) en rendert het formulier. Zo is een blok zonder maatwerk-\n * editor nooit een doodlopend pad voor de klant.\n */\nexport function GenericEditor({ block, siteId, onChange }: GenericEditorProps) {\n  const registry = useRegistry();\n  const def = registry.get(String(block._type ?? \"\"));\n  const fields = useMemo(() => {\n    if (!def) return [];\n    // Custom blocks (5.0) dragen hun opgeslagen Field-IR mee — rijker dan introspectie\n    // (showIf/date/slider-metadata gaat door fieldsToZod heen verloren).\n    const custom = (def as { customFields?: Field[] }).customFields;\n    return custom ?? introspectToFields(def.schema, def.fields);\n  }, [def]);\n  // Sub-schema's voor json-velden (validatie vóór commit), uit de platte introspectie.\n  const jsonSchemas = useMemo(() => {\n    if (!def) return {};\n    const out: Record<string, ZodTypeAny> = {};\n    for (const f of introspectObjectSchema(def.schema)) if (f.kind === \"json\") out[f.key] = f.schema;\n    return out;\n  }, [def]);\n  if (fields.length === 0) {\n    return <p className=\"text-sm text-slate-500\">Voor dit bloktype is geen editor beschikbaar.</p>;\n  }\n  return (\n    <FieldsForm\n      fields={fields}\n      values={block}\n      onChange={(p) => onChange({ ...block, ...p })}\n      siteId={siteId}\n      jsonSchemas={jsonSchemas}\n    />\n  );\n}\n\n/**\n * Select als eigen component: commit de default-optie bij mount wanneer er nog geen waarde is.\n * De dropdown TOONDE optie 1 maar sloeg 'm niet op (weergave ≠ opslag) — een verplichte enum kon\n * zo leeg gepubliceerd worden tenzij het Zod-schema toevallig een default had.\n */\nfunction SelectField({\n  f,\n  v,\n  set,\n}: {\n  f: Extract<Field, { type: \"select\" }>;\n  v: unknown;\n  set: (val: unknown) => void;\n}) {\n  useEffect(() => {\n    if (v == null && f.options[0] !== undefined) set(f.options[0].value);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n  return (\n    <FieldRow label={f.label} hint={f.hint}>\n      <Select\n        value={String(v ?? f.options[0]?.value ?? \"\")}\n        onValueChange={set}\n        options={f.options.map((o) => ({ value: o.value, label: o.label || o.value }))}\n      />\n    </FieldRow>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/admin/blockEditors/GenericEditor.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * GenericEditor 2.0 (5.0) — het automatisch gegenereerde formulier voor blokken zonder eigen\n * editor, aangedreven door de Field-IR (schema/fields.ts, primo-port):\n *\n * - **repeaters** en **groepen** zijn echte UI (ArrayEditor met toevoegen/verwijderen/↑↓ en een\n *   omkaderde subgroep) i.p.v. een JSON-textarea;\n * - **showIf** verbergt velden conditioneel;\n * - date/slider/link/icoon/pagina-verwijzing hebben eigen widgets;\n * - de JSON-textarea bestaat alleen nog als laatste redmiddel (records/scalar-arrays), met\n *   schema-validatie vóór commit.\n *\n * `FieldsForm` is los herbruikbaar: custom blocks (Fase B) renderen er hun opgeslagen Field-IR mee.\n */\nimport { safeParse } from \"zod/v4/core\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport type { $ZodType as ZodTypeAny } from \"zod/v4/core\";\nimport { Field as FieldRow, Input, Textarea } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { Switch } from \"../ui/switch\";\nimport { ArrayEditor } from \"../ui/ArrayEditor\";\nimport { RichTextEditor } from \"../editors/RichTextEditor\";\nimport { ImageField } from \"../ui/ImageField\";\nimport { LinkVeld } from \"../ui/LinkVeld\";\nimport { lengteAdvies } from \"../lib/lengteAdvies\";\nimport { TECHNISCHE_VELDEN, vertaalVelden } from \"../lib/veldTaal\";\nimport { useIsSuperadmin } from \"../lib/useIsSuperadmin\";\nimport { useRegistry } from \"../../blocks/context\";\nimport { subscribePages, type DraftPage } from \"../lib/pagesClient\";\nimport { introspectToFields, introspectObjectSchema } from \"../lib/zodFields\";\nimport { fieldsDefaults, isFieldVisible, type Field } from \"../../schema/fields\";\n\nexport interface GenericEditorProps {\n  block: Record<string, unknown>;\n  siteId: string;\n  onChange: (next: Record<string, unknown>) => void;\n}\n\n/** Formulier voor een Field-IR over een waarden-object. Recursief (groepen/repeaters). */\nexport function FieldsForm({\n  fields,\n  values,\n  onChange,\n  siteId,\n  jsonSchemas,\n}: {\n  fields: Field[];\n  values: Record<string, unknown>;\n  onChange: (patch: Record<string, unknown>) => void;\n  siteId: string;\n  /** Optioneel: sub-schema per json-veldsleutel voor validatie vóór commit. */\n  jsonSchemas?: Record<string, ZodTypeAny>;\n}) {\n  const superadmin = useIsSuperadmin();\n  return (\n    <div className=\"grid gap-3\">\n      {fields.filter((f) => isFieldVisible(f, values) && (superadmin || !TECHNISCHE_VELDEN.has(f.key))).map((f) => (\n        <FieldWidget key={f.key} f={f} values={values} onChange={onChange} siteId={siteId} jsonSchema={jsonSchemas?.[f.key]} />\n      ))}\n    </div>\n  );\n}\n\nfunction FieldWidget({\n  f,\n  values,\n  onChange,\n  siteId,\n  jsonSchema,\n}: {\n  f: Field;\n  values: Record<string, unknown>;\n  onChange: (patch: Record<string, unknown>) => void;\n  siteId: string;\n  jsonSchema?: ZodTypeAny;\n}) {\n  const v = values[f.key];\n  const set = (val: unknown) => onChange({ [f.key]: val });\n\n  switch (f.type) {\n    case \"switch\":\n      return (\n        <label className=\"flex items-center gap-2 text-sm\">\n          <Switch checked={Boolean(v)} onCheckedChange={set} />\n          {f.label}\n        </label>\n      );\n    case \"select\":\n      return <SelectField f={f} v={v} set={set} />;\n    case \"number\":\n      // 8.11: een klein bereik (kolommen 1–4, sterren 1–5) als knoppenrij — een vrij getalveld liet\n      // \"17 kolommen\" toe en vroeg de klant te raden wat er mag.\n      if (f.min !== undefined && f.max !== undefined && Number.isInteger(f.min) && Number.isInteger(f.max) && f.max - f.min <= 5) {\n        const opties = Array.from({ length: f.max - f.min + 1 }, (_, i) => f.min! + i);\n        const huidig = typeof v === \"number\" ? v : undefined;\n        return (\n          <FieldRow label={f.label} hint={f.hint}>\n            <div role=\"radiogroup\" aria-label={f.label} className=\"inline-flex flex-wrap gap-1\">\n              {opties.map((n) => (\n                <button\n                  key={n}\n                  type=\"button\"\n                  role=\"radio\"\n                  aria-checked={huidig === n}\n                  onClick={() => set(n)}\n                  className=\"xicms-admin-btn h-9 min-w-9 rounded-md border border-slate-200 px-2 text-sm font-medium text-slate-700 hover:bg-slate-100 aria-[checked=true]:border-slate-900 aria-[checked=true]:bg-slate-900 aria-[checked=true]:text-white\"\n                >\n                  {f.key === \"rating\" ? \"★\".repeat(n) : n}\n                </button>\n              ))}\n            </div>\n          </FieldRow>\n        );\n      }\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input\n            type=\"number\"\n            min={f.min}\n            max={f.max}\n            step={f.step}\n            value={v == null ? \"\" : String(v)}\n            onChange={(e) => set(e.target.value === \"\" ? undefined : Number(e.target.value))}\n          />\n        </FieldRow>\n      );\n    case \"slider\": {\n      const val = typeof v === \"number\" ? v : f.min;\n      return (\n        <FieldRow label={`${f.label} (${val})`} hint={f.hint}>\n          <input\n            type=\"range\"\n            min={f.min}\n            max={f.max}\n            step={f.step ?? 1}\n            value={val}\n            onChange={(e) => set(Number(e.target.value))}\n            className=\"w-full\"\n          />\n        </FieldRow>\n      );\n    }\n    case \"date\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input type=\"date\" value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} />\n        </FieldRow>\n      );\n    case \"richtext\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <RichTextEditor siteId={siteId} value={String(v ?? \"\")} onChange={set} />\n        </FieldRow>\n      );\n    case \"image\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <ImageField siteId={siteId} value={v ? String(v) : undefined} onChange={(url) => set(url ?? \"\")} />\n        </FieldRow>\n      );\n    case \"url\":\n      // 8.10: een link (href) via het linkvenster met de pagina's van de site; een technische URL\n      // (embed, video, bestand) blijft een tekstveld.\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          {/href$/i.test(f.key) || f.key === \"link\" ? (\n            <LinkVeld siteId={siteId} value={String(v ?? \"\")} onChange={set} />\n          ) : (\n            <Input value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} placeholder=\"https://…\" />\n          )}\n        </FieldRow>\n      );\n    case \"icon\":\n      return (\n        <FieldRow label={f.label} hint={f.hint ?? \"Emoji, bv. ✂️\"}>\n          <Input value={String(v ?? \"\")} maxLength={16} onChange={(e) => set(e.target.value)} className=\"w-24\" />\n        </FieldRow>\n      );\n    case \"link\": {\n      const link = (v as { label?: string; href?: string } | undefined) ?? {};\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <div className=\"grid gap-2\">\n            <Input value={link.label ?? \"\"} placeholder=\"Tekst op de knop\" onChange={(e) => set({ ...link, label: e.target.value })} />\n            <LinkVeld siteId={siteId} value={link.href ?? \"\"} onChange={(href) => set({ ...link, href })} />\n          </div>\n        </FieldRow>\n      );\n    }\n    case \"group\": {\n      const group = (v as Record<string, unknown> | undefined) ?? {};\n      return (\n        <fieldset className=\"grid gap-2 rounded-lg border border-slate-200 p-3\">\n          <legend className=\"px-1 text-xs font-semibold text-slate-500\">{f.label}</legend>\n          <FieldsForm fields={f.fields} values={group} onChange={(p) => set({ ...group, ...p })} siteId={siteId} />\n        </fieldset>\n      );\n    }\n    case \"repeater\": {\n      const items = (Array.isArray(v) ? v : []) as Record<string, unknown>[];\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <ArrayEditor<Record<string, unknown>>\n            items={items}\n            onChange={set}\n            newItem={() => fieldsDefaults(f.fields)}\n            addLabel={`+ ${f.itemLabel ?? \"Item\"}`}\n            renderRow={(item, update) => (\n              <FieldsForm fields={f.fields} values={item} onChange={(p) => update(p)} siteId={siteId} />\n            )}\n          />\n        </FieldRow>\n      );\n    }\n    case \"pageRef\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <PageRefPicker siteId={siteId} value={String(v ?? \"\")} onChange={set} />\n        </FieldRow>\n      );\n    case \"info\":\n      return <p className=\"text-xs text-slate-500\">{f.text}</p>;\n    case \"textarea\":\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Textarea rows={f.rows ?? 4} value={String(v ?? \"\")} onChange={(e) => set(e.target.value)} />\n        </FieldRow>\n      );\n    case \"json\":\n      return <JsonField label={f.label} value={v} onCommit={set} schema={jsonSchema} />;\n    case \"text\":\n    default:\n      return (\n        <FieldRow label={f.label} hint={f.hint}>\n          <Input value={String(v ?? \"\")} placeholder={f.type === \"text\" ? f.placeholder : undefined} onChange={(e) => set(e.target.value)} />\n          {lengteAdvies(f.key, typeof v === \"string\" ? v : \"\") && <p className=\"mt-1 text-xs text-amber-700\">{lengteAdvies(f.key, String(v))}</p>}\n        </FieldRow>\n      );\n  }\n}\n\n/** Pagina-verwijzing: kies uit de bestaande pagina's van de site (live lijst). */\nfunction PageRefPicker({ siteId, value, onChange }: { siteId: string; value: string; onChange: (v: string) => void }) {\n  const [pages, setPages] = useState<DraftPage[]>([]);\n  useEffect(() => subscribePages(siteId, setPages), [siteId]);\n  const options = useMemo(() => {\n    const opts = pages\n      .filter((p) => !p.trashed)\n      .sort((a, b) => (a.path < b.path ? -1 : 1))\n      .map((p) => ({ value: p.path, label: `${p.title || p.path} (${p.path})${p.published ? \"\" : \" — nog niet live\"}` }));\n    // Bewaar een waarde die (nog) niet in de lijst staat, zodat niets stilletjes wegvalt.\n    if (value && !opts.some((o) => o.value === value)) opts.unshift({ value, label: value });\n    return [{ value: \"\", label: \"— geen —\" }, ...opts];\n  }, [pages, value]);\n  return <Select value={value} onValueChange={onChange} options={options} />;\n}\n\n/** Laatste redmiddel voor complexe velden: JSON met schema-validatie vóór commit. */\nfunction JsonField({\n  label,\n  value,\n  onCommit,\n  schema,\n}: {\n  label: string;\n  value: unknown;\n  onCommit: (v: unknown) => void;\n  schema?: ZodTypeAny;\n}) {\n  const [text, setText] = useState(() => JSON.stringify(value ?? null, null, 2));\n  const [error, setError] = useState<string | null>(null);\n  // Committeert de gegeven tekst (niet de state — die is bij een net getypte toets nog niet\n  // bijgewerkt). `silent`: tijdens het typen geen foutmelding tonen voor onvolledige JSON (bv.\n  // een net geopende `[` of `{`) — pas bij blur laten we die zien. VEILIGHEIDSNET: committeert bij\n  // élke wijziging i.p.v. uitsluitend op blur, want blur bleek op mobiel Safari niet altijd te\n  // vuren vóór een externe \"Opslaan\"-klik (race), waardoor een bewerking hier stil verloren ging.\n  const commit = (raw: string, opts: { silent: boolean }) => {\n    try {\n      const parsed = JSON.parse(raw) as unknown;\n      if (schema) {\n        const res = safeParse(schema, parsed);\n        if (!res.success) {\n          if (!opts.silent) setError(\"Voldoet niet aan het verwachte formaat van dit veld.\");\n          return;\n        }\n        setError(null);\n        onCommit(res.data);\n        return;\n      }\n      setError(null);\n      onCommit(parsed);\n    } catch {\n      if (!opts.silent) setError(\"Geen geldige JSON.\");\n    }\n  };\n  return (\n    <FieldRow label={`${label} (geavanceerd)`} hint=\"Technisch veld — vraag bij twijfel Xi Webdesign. Wordt gecontroleerd vóór opslaan.\">\n      <Textarea\n        rows={6}\n        value={text}\n        onChange={(e) => {\n          setText(e.target.value);\n          commit(e.target.value, { silent: true });\n        }}\n        onBlur={() => commit(text, { silent: false })}\n        spellCheck={false}\n        className=\"font-mono text-xs\"\n      />\n      {error && <p className=\"text-xs text-red-600\">{error}</p>}\n    </FieldRow>\n  );\n}\n\n/**\n * De blok-editor-fallback: leidt de Field-IR af uit het Zod-schema van het blok (+ optionele\n * `fields`-hints van `defineBlock`) en rendert het formulier. Zo is een blok zonder maatwerk-\n * editor nooit een doodlopend pad voor de klant.\n */\nexport function GenericEditor({ block, siteId, onChange }: GenericEditorProps) {\n  const registry = useRegistry();\n  const def = registry.get(String(block._type ?? \"\"));\n  const fields = useMemo(() => {\n    if (!def) return [];\n    // Custom blocks (5.0) dragen hun opgeslagen Field-IR mee — rijker dan introspectie\n    // (showIf/date/slider-metadata gaat door fieldsToZod heen verloren).\n    const custom = (def as { customFields?: Field[] }).customFields;\n    // 8.11: Nederlandse labels, keuzes en passende widgets (zie lib/veldTaal).\n    return vertaalVelden(custom ?? introspectToFields(def.schema, def.fields), def.type);\n  }, [def]);\n  // Sub-schema's voor json-velden (validatie vóór commit), uit de platte introspectie.\n  const jsonSchemas = useMemo(() => {\n    if (!def) return {};\n    const out: Record<string, ZodTypeAny> = {};\n    for (const f of introspectObjectSchema(def.schema)) if (f.kind === \"json\") out[f.key] = f.schema;\n    return out;\n  }, [def]);\n  if (fields.length === 0) {\n    return <p className=\"text-sm text-slate-500\">Voor dit bloktype is geen editor beschikbaar.</p>;\n  }\n  return (\n    <FieldsForm\n      fields={fields}\n      values={block}\n      onChange={(p) => onChange({ ...block, ...p })}\n      siteId={siteId}\n      jsonSchemas={jsonSchemas}\n    />\n  );\n}\n\n/**\n * Keuzelijst. Toont de waarde, anders de schema-default, anders optie 1 — dat is wat de site\n * rendert (elk keuzeveld heeft een default: de ingebouwde schema's zelf, maatwerkvelden via\n * `fieldsToZod`). Tot 8.10 schreef dit bij openen optie 1 weg \"zodat weergave = opslag\"; gevolg:\n * alleen het tandwiel aanklikken gaf al \"1 wijziging\" en een publiceerknop die iets te doen had.\n */\nfunction SelectField({\n  f,\n  v,\n  set,\n}: {\n  f: Extract<Field, { type: \"select\" }>;\n  v: unknown;\n  set: (val: unknown) => void;\n}) {\n  return (\n    <FieldRow label={f.label} hint={f.hint}>\n      <Select\n        value={String(v ?? f.standaard ?? f.options[0]?.value ?? \"\")}\n        onValueChange={set}\n        options={f.options.map((o) => ({ value: o.value, label: o.label || o.value }))}\n      />\n    </FieldRow>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/blockEditors/StyleEditor.js

@@ -2,11 +2,23 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Field, Input } from "../ui/primitives.js";
 import { Select } from "../ui/select.js";
+import { KleurVeld } from "../ui/KleurVeld.js";
+import { slugify } from "../lib/slugify.js";
+import { useMergedSiteConfig } from "../../settings/useSiteSettings.js";
 function StyleEditor({
   value = {},
   onChange
 }) {
   const update = (part) => onChange({ ...value, ...part });
+  const theme = useMergedSiteConfig().theme ?? {};
+  const stalen = [
+    { label: "Merkkleur", kleur: theme.primary ?? "" },
+    { label: "Accentkleur", kleur: theme.accent ?? "" },
+    { label: "Achtergrond", kleur: theme.background ?? "" },
+    { label: "Tekstkleur", kleur: theme.foreground ?? "" },
+    { label: "Lichtgrijs", kleur: "#f5f5f4" },
+    { label: "Wit", kleur: "#ffffff" }
+  ];
   return /* @__PURE__ */ jsxs("details", { className: "rounded-lg border border-slate-200 p-3", children: [
     /* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium text-slate-700", children: "Blokstijl" }),
     /* @__PURE__ */ jsxs("div", { className: "mt-3 grid gap-3", children: [
@@ -34,7 +46,7 @@ function StyleEditor({
             options: [
               { value: "", label: "Standaard" },
               { value: "narrow", label: "Smal" },
-              { value: "container", label: "Container" },
+              { value: "container", label: "Normale breedte" },
               { value: "full", label: "Volle breedte" }
             ]
           }
@@ -52,10 +64,32 @@ function StyleEditor({
             ]
           }
         ) }),
-        /* @__PURE__ */ jsx(Field, { label: "Achtergrond (kleur)", children: /* @__PURE__ */ jsx(Input, { value: value.background ?? "", onChange: (e) => update({ background: e.target.value || void 0 }), placeholder: "#f8fafc" }) })
+        /* @__PURE__ */ jsx(
+          KleurVeld,
+          {
+            label: "Achtergrondkleur",
+            hint: "De tekstkleur past zich vanzelf aan, zodat het leesbaar blijft.",
+            value: value.background ?? "",
+            placeholder: "geen",
+            onChange: (v) => update({ background: v || void 0 }),
+            stalen,
+            wisbaar: true
+          }
+        )
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3", children: [
-        /* @__PURE__ */ jsx(Field, { label: "Anker-id (voor #deeplinks)", children: /* @__PURE__ */ jsx(Input, { value: value.anchorId ?? "", onChange: (e) => update({ anchorId: e.target.value || void 0 }), placeholder: "bv. contact" }) }),
+        /* @__PURE__ */ jsx(Field, { label: "Sprongnaam (optioneel)", hint: "Hiermee kun je naar dit blok linken, bv. /pagina#contact", children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            value: value.anchorId ?? "",
+            onChange: (e) => update({ anchorId: e.target.value || void 0 }),
+            onBlur: () => {
+              const schoon = slugify(value.anchorId ?? "");
+              if ((value.anchorId ?? "") !== schoon) update({ anchorId: schoon || void 0 });
+            },
+            placeholder: "bv. contact"
+          }
+        ) }),
         /* @__PURE__ */ jsx(Field, { label: "Animatie (bij scrollen)", children: /* @__PURE__ */ jsx(
           Select,
           {

package/dist/admin/blockEditors/StyleEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/blockEditors/StyleEditor.tsx"],"sourcesContent":["\"use client\";\n\nimport type { BlockStyle } from \"../../schema/blocks\";\nimport { Field, Input } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\n\n/**\n * Inklapbare \"Blokstijl\"-sectie die voor ELK block beschikbaar is (gedeelde `_style`): verticale\n * ruimte, achtergrond, breedte, uitlijning en een anker-id. Wordt generiek aan de block-editors\n * toegevoegd, dus elk block krijgt deze opties zonder zijn editor te wijzigen.\n */\nexport function StyleEditor({\n  value = {},\n  onChange,\n}: {\n  value?: BlockStyle;\n  onChange: (style: BlockStyle) => void;\n}) {\n  const update = (part: Partial<BlockStyle>) => onChange({ ...value, ...part });\n  return (\n    <details className=\"rounded-lg border border-slate-200 p-3\">\n      <summary className=\"cursor-pointer text-sm font-medium text-slate-700\">Blokstijl</summary>\n      <div className=\"mt-3 grid gap-3\">\n        <div className=\"grid grid-cols-2 gap-3\">\n          <Field label=\"Ruimte boven/onder\">\n            <Select\n              value={value.paddingY ?? \"\"}\n              onValueChange={(v) => update({ paddingY: (v || undefined) as BlockStyle[\"paddingY\"] })}\n              options={[\n                { value: \"\", label: \"Standaard\" },\n                { value: \"none\", label: \"Geen\" },\n                { value: \"sm\", label: \"Klein\" },\n                { value: \"md\", label: \"Normaal\" },\n                { value: \"lg\", label: \"Groot\" },\n                { value: \"xl\", label: \"Extra groot\" },\n              ]}\n            />\n          </Field>\n          <Field label=\"Breedte\">\n            <Select\n              value={value.width ?? \"\"}\n              onValueChange={(v) => update({ width: (v || undefined) as BlockStyle[\"width\"] })}\n              options={[\n                { value: \"\", label: \"Standaard\" },\n                { value: \"narrow\", label: \"Smal\" },\n                { value: \"container\", label: \"Container\" },\n                { value: \"full\", label: \"Volle breedte\" },\n              ]}\n            />\n          </Field>\n          <Field label=\"Uitlijning\">\n            <Select\n              value={value.align ?? \"\"}\n              onValueChange={(v) => update({ align: (v || undefined) as BlockStyle[\"align\"] })}\n              options={[\n                { value: \"\", label: \"Standaard\" },\n                { value: \"left\", label: \"Links\" },\n                { value: \"center\", label: \"Midden\" },\n                { value: \"right\", label: \"Rechts\" },\n              ]}\n            />\n          </Field>\n          <Field label=\"Achtergrond (kleur)\">\n            <Input value={value.background ?? \"\"} onChange={(e) => update({ background: e.target.value || undefined })} placeholder=\"#f8fafc\" />\n          </Field>\n        </div>\n        <div className=\"grid grid-cols-2 gap-3\">\n          <Field label=\"Anker-id (voor #deeplinks)\">\n            <Input value={value.anchorId ?? \"\"} onChange={(e) => update({ anchorId: e.target.value || undefined })} placeholder=\"bv. contact\" />\n          </Field>\n          <Field label=\"Animatie (bij scrollen)\">\n            <Select\n              value={value.animate ?? \"\"}\n              onValueChange={(v) => update({ animate: (v || undefined) as BlockStyle[\"animate\"] })}\n              options={[\n                { value: \"\", label: \"Geen\" },\n                { value: \"fade\", label: \"Vervagen\" },\n                { value: \"up\", label: \"Omhoog schuiven\" },\n              ]}\n            />\n          </Field>\n        </div>\n      </div>\n    </details>\n  );\n}\n"],"mappings":";AAqBM,cAEE,YAFF;AAlBN,SAAS,OAAO,aAAa;AAC7B,SAAS,cAAc;AAOhB,SAAS,YAAY;AAAA,EAC1B,QAAQ,CAAC;AAAA,EACT;AACF,GAGG;AACD,QAAM,SAAS,CAAC,SAA8B,SAAS,EAAE,GAAG,OAAO,GAAG,KAAK,CAAC;AAC5E,SACE,qBAAC,aAAQ,WAAU,0CACjB;AAAA,wBAAC,aAAQ,WAAU,qDAAoD,uBAAS;AAAA,IAChF,qBAAC,SAAI,WAAU,mBACb;AAAA,2BAAC,SAAI,WAAU,0BACb;AAAA,4BAAC,SAAM,OAAM,sBACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,YAAY;AAAA,YACzB,eAAe,CAAC,MAAM,OAAO,EAAE,UAAW,KAAK,OAAqC,CAAC;AAAA,YACrF,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,YAAY;AAAA,cAChC,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,cAC/B,EAAE,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC9B,EAAE,OAAO,MAAM,OAAO,UAAU;AAAA,cAChC,EAAE,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC9B,EAAE,OAAO,MAAM,OAAO,cAAc;AAAA,YACtC;AAAA;AAAA,QACF,GACF;AAAA,QACA,oBAAC,SAAM,OAAM,WACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,SAAS;AAAA,YACtB,eAAe,CAAC,MAAM,OAAO,EAAE,OAAQ,KAAK,OAAkC,CAAC;AAAA,YAC/E,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,YAAY;AAAA,cAChC,EAAE,OAAO,UAAU,OAAO,OAAO;AAAA,cACjC,EAAE,OAAO,aAAa,OAAO,YAAY;AAAA,cACzC,EAAE,OAAO,QAAQ,OAAO,gBAAgB;AAAA,YAC1C;AAAA;AAAA,QACF,GACF;AAAA,QACA,oBAAC,SAAM,OAAM,cACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,SAAS;AAAA,YACtB,eAAe,CAAC,MAAM,OAAO,EAAE,OAAQ,KAAK,OAAkC,CAAC;AAAA,YAC/E,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,YAAY;AAAA,cAChC,EAAE,OAAO,QAAQ,OAAO,QAAQ;AAAA,cAChC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,cACnC,EAAE,OAAO,SAAS,OAAO,SAAS;AAAA,YACpC;AAAA;AAAA,QACF,GACF;AAAA,QACA,oBAAC,SAAM,OAAM,uBACX,8BAAC,SAAM,OAAO,MAAM,cAAc,IAAI,UAAU,CAAC,MAAM,OAAO,EAAE,YAAY,EAAE,OAAO,SAAS,OAAU,CAAC,GAAG,aAAY,WAAU,GACpI;AAAA,SACF;AAAA,MACA,qBAAC,SAAI,WAAU,0BACb;AAAA,4BAAC,SAAM,OAAM,8BACX,8BAAC,SAAM,OAAO,MAAM,YAAY,IAAI,UAAU,CAAC,MAAM,OAAO,EAAE,UAAU,EAAE,OAAO,SAAS,OAAU,CAAC,GAAG,aAAY,eAAc,GACpI;AAAA,QACA,oBAAC,SAAM,OAAM,2BACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,WAAW;AAAA,YACxB,eAAe,CAAC,MAAM,OAAO,EAAE,SAAU,KAAK,OAAoC,CAAC;AAAA,YACnF,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,OAAO;AAAA,cAC3B,EAAE,OAAO,QAAQ,OAAO,WAAW;AAAA,cACnC,EAAE,OAAO,MAAM,OAAO,kBAAkB;AAAA,YAC1C;AAAA;AAAA,QACF,GACF;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/admin/blockEditors/StyleEditor.tsx"],"sourcesContent":["\"use client\";\n\nimport type { BlockStyle } from \"../../schema/blocks\";\nimport { Field, Input } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { KleurVeld } from \"../ui/KleurVeld\";\nimport { slugify } from \"../lib/slugify\";\nimport { useMergedSiteConfig } from \"../../settings/useSiteSettings\";\n\n/**\n * Inklapbare \"Blokstijl\"-sectie die voor ELK block beschikbaar is (gedeelde `_style`): verticale\n * ruimte, achtergrond, breedte, uitlijning en een anker-id. Wordt generiek aan de block-editors\n * toegevoegd, dus elk block krijgt deze opties zonder zijn editor te wijzigen.\n */\nexport function StyleEditor({\n  value = {},\n  onChange,\n}: {\n  value?: BlockStyle;\n  onChange: (style: BlockStyle) => void;\n}) {\n  const update = (part: Partial<BlockStyle>) => onChange({ ...value, ...part });\n  // Huisstijlkleuren als stalen (8.2): een blokachtergrond in een eigen merkkleur is één klik.\n  const theme = useMergedSiteConfig().theme ?? {};\n  const stalen = [\n    { label: \"Merkkleur\", kleur: theme.primary ?? \"\" },\n    { label: \"Accentkleur\", kleur: theme.accent ?? \"\" },\n    { label: \"Achtergrond\", kleur: theme.background ?? \"\" },\n    { label: \"Tekstkleur\", kleur: theme.foreground ?? \"\" },\n    { label: \"Lichtgrijs\", kleur: \"#f5f5f4\" },\n    { label: \"Wit\", kleur: \"#ffffff\" },\n  ];\n  return (\n    <details className=\"rounded-lg border border-slate-200 p-3\">\n      <summary className=\"cursor-pointer text-sm font-medium text-slate-700\">Blokstijl</summary>\n      <div className=\"mt-3 grid gap-3\">\n        <div className=\"grid grid-cols-2 gap-3\">\n          <Field label=\"Ruimte boven/onder\">\n            <Select\n              value={value.paddingY ?? \"\"}\n              onValueChange={(v) => update({ paddingY: (v || undefined) as BlockStyle[\"paddingY\"] })}\n              options={[\n                { value: \"\", label: \"Standaard\" },\n                { value: \"none\", label: \"Geen\" },\n                { value: \"sm\", label: \"Klein\" },\n                { value: \"md\", label: \"Normaal\" },\n                { value: \"lg\", label: \"Groot\" },\n                { value: \"xl\", label: \"Extra groot\" },\n              ]}\n            />\n          </Field>\n          <Field label=\"Breedte\">\n            <Select\n              value={value.width ?? \"\"}\n              onValueChange={(v) => update({ width: (v || undefined) as BlockStyle[\"width\"] })}\n              options={[\n                { value: \"\", label: \"Standaard\" },\n                { value: \"narrow\", label: \"Smal\" },\n                { value: \"container\", label: \"Normale breedte\" },\n                { value: \"full\", label: \"Volle breedte\" },\n              ]}\n            />\n          </Field>\n          <Field label=\"Uitlijning\">\n            <Select\n              value={value.align ?? \"\"}\n              onValueChange={(v) => update({ align: (v || undefined) as BlockStyle[\"align\"] })}\n              options={[\n                { value: \"\", label: \"Standaard\" },\n                { value: \"left\", label: \"Links\" },\n                { value: \"center\", label: \"Midden\" },\n                { value: \"right\", label: \"Rechts\" },\n              ]}\n            />\n          </Field>\n          <KleurVeld\n            label=\"Achtergrondkleur\"\n            hint=\"De tekstkleur past zich vanzelf aan, zodat het leesbaar blijft.\"\n            value={value.background ?? \"\"}\n            placeholder=\"geen\"\n            onChange={(v) => update({ background: v || undefined })}\n            stalen={stalen}\n            wisbaar\n          />\n        </div>\n        <div className=\"grid grid-cols-2 gap-3\">\n          <Field label=\"Sprongnaam (optioneel)\" hint=\"Hiermee kun je naar dit blok linken, bv. /pagina#contact\">\n            <Input\n              value={value.anchorId ?? \"\"}\n              onChange={(e) => update({ anchorId: e.target.value || undefined })}\n              // 8.10: spaties en hoofdletters maken een sprongnaam onbruikbaar in een link.\n              onBlur={() => {\n                const schoon = slugify(value.anchorId ?? \"\");\n                if ((value.anchorId ?? \"\") !== schoon) update({ anchorId: schoon || undefined });\n              }}\n              placeholder=\"bv. contact\"\n            />\n          </Field>\n          <Field label=\"Animatie (bij scrollen)\">\n            <Select\n              value={value.animate ?? \"\"}\n              onValueChange={(v) => update({ animate: (v || undefined) as BlockStyle[\"animate\"] })}\n              options={[\n                { value: \"\", label: \"Geen\" },\n                { value: \"fade\", label: \"Vervagen\" },\n                { value: \"up\", label: \"Omhoog schuiven\" },\n              ]}\n            />\n          </Field>\n        </div>\n      </div>\n    </details>\n  );\n}\n"],"mappings":";AAkCM,cAEE,YAFF;AA/BN,SAAS,OAAO,aAAa;AAC7B,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AACxB,SAAS,2BAA2B;AAO7B,SAAS,YAAY;AAAA,EAC1B,QAAQ,CAAC;AAAA,EACT;AACF,GAGG;AACD,QAAM,SAAS,CAAC,SAA8B,SAAS,EAAE,GAAG,OAAO,GAAG,KAAK,CAAC;AAE5E,QAAM,QAAQ,oBAAoB,EAAE,SAAS,CAAC;AAC9C,QAAM,SAAS;AAAA,IACb,EAAE,OAAO,aAAa,OAAO,MAAM,WAAW,GAAG;AAAA,IACjD,EAAE,OAAO,eAAe,OAAO,MAAM,UAAU,GAAG;AAAA,IAClD,EAAE,OAAO,eAAe,OAAO,MAAM,cAAc,GAAG;AAAA,IACtD,EAAE,OAAO,cAAc,OAAO,MAAM,cAAc,GAAG;AAAA,IACrD,EAAE,OAAO,cAAc,OAAO,UAAU;AAAA,IACxC,EAAE,OAAO,OAAO,OAAO,UAAU;AAAA,EACnC;AACA,SACE,qBAAC,aAAQ,WAAU,0CACjB;AAAA,wBAAC,aAAQ,WAAU,qDAAoD,uBAAS;AAAA,IAChF,qBAAC,SAAI,WAAU,mBACb;AAAA,2BAAC,SAAI,WAAU,0BACb;AAAA,4BAAC,SAAM,OAAM,sBACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,YAAY;AAAA,YACzB,eAAe,CAAC,MAAM,OAAO,EAAE,UAAW,KAAK,OAAqC,CAAC;AAAA,YACrF,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,YAAY;AAAA,cAChC,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,cAC/B,EAAE,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC9B,EAAE,OAAO,MAAM,OAAO,UAAU;AAAA,cAChC,EAAE,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC9B,EAAE,OAAO,MAAM,OAAO,cAAc;AAAA,YACtC;AAAA;AAAA,QACF,GACF;AAAA,QACA,oBAAC,SAAM,OAAM,WACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,SAAS;AAAA,YACtB,eAAe,CAAC,MAAM,OAAO,EAAE,OAAQ,KAAK,OAAkC,CAAC;AAAA,YAC/E,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,YAAY;AAAA,cAChC,EAAE,OAAO,UAAU,OAAO,OAAO;AAAA,cACjC,EAAE,OAAO,aAAa,OAAO,kBAAkB;AAAA,cAC/C,EAAE,OAAO,QAAQ,OAAO,gBAAgB;AAAA,YAC1C;AAAA;AAAA,QACF,GACF;AAAA,QACA,oBAAC,SAAM,OAAM,cACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,SAAS;AAAA,YACtB,eAAe,CAAC,MAAM,OAAO,EAAE,OAAQ,KAAK,OAAkC,CAAC;AAAA,YAC/E,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,YAAY;AAAA,cAChC,EAAE,OAAO,QAAQ,OAAO,QAAQ;AAAA,cAChC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,cACnC,EAAE,OAAO,SAAS,OAAO,SAAS;AAAA,YACpC;AAAA;AAAA,QACF,GACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,MAAK;AAAA,YACL,OAAO,MAAM,cAAc;AAAA,YAC3B,aAAY;AAAA,YACZ,UAAU,CAAC,MAAM,OAAO,EAAE,YAAY,KAAK,OAAU,CAAC;AAAA,YACtD;AAAA,YACA,SAAO;AAAA;AAAA,QACT;AAAA,SACF;AAAA,MACA,qBAAC,SAAI,WAAU,0BACb;AAAA,4BAAC,SAAM,OAAM,0BAAyB,MAAK,4DACzC;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,YAAY;AAAA,YACzB,UAAU,CAAC,MAAM,OAAO,EAAE,UAAU,EAAE,OAAO,SAAS,OAAU,CAAC;AAAA,YAEjE,QAAQ,MAAM;AACZ,oBAAM,SAAS,QAAQ,MAAM,YAAY,EAAE;AAC3C,mBAAK,MAAM,YAAY,QAAQ,OAAQ,QAAO,EAAE,UAAU,UAAU,OAAU,CAAC;AAAA,YACjF;AAAA,YACA,aAAY;AAAA;AAAA,QACd,GACF;AAAA,QACA,oBAAC,SAAM,OAAM,2BACX;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,WAAW;AAAA,YACxB,eAAe,CAAC,MAAM,OAAO,EAAE,SAAU,KAAK,OAAoC,CAAC;AAAA,YACnF,SAAS;AAAA,cACP,EAAE,OAAO,IAAI,OAAO,OAAO;AAAA,cAC3B,EAAE,OAAO,QAAQ,OAAO,WAAW;AAAA,cACnC,EAAE,OAAO,MAAM,OAAO,kBAAkB;AAAA,YAC1C;AAAA;AAAA,QACF,GACF;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/blockEditors/SymbolRefEditor.js

@@ -4,16 +4,38 @@ import { useEffect, useMemo, useState } from "react";
 import { Button, Field, Input } from "../ui/primitives.js";
 import { Select } from "../ui/select.js";
 import { useToast } from "../ui/toast.js";
-import { subscribeSymbols, saveSymbol } from "../lib/symbolsClient.js";
+import { subscribeSymbols, saveSymbol, subscribeSymbolVersions } from "../lib/symbolsClient.js";
+import { useConfirm } from "../ui/ConfirmDialog.js";
 import { NestedBlocksEditor } from "./index.js";
 function SymbolRefEditor({ block, siteId, onChange }) {
   const { toast } = useToast();
+  const confirm = useConfirm();
+  const [versies, setVersies] = useState([]);
   const [symbols, setSymbols] = useState([]);
   const [newName, setNewName] = useState("");
   const [draftBlocks, setDraftBlocks] = useState(null);
   const [saving, setSaving] = useState(false);
   const symbolId = String(block.symbolId ?? "");
   useEffect(() => subscribeSymbols(siteId, setSymbols), [siteId]);
+  useEffect(() => subscribeSymbolVersions(siteId, symbolId, setVersies), [siteId, symbolId]);
+  async function zetVersieTerug(v) {
+    const ok = await confirm({
+      title: "Deze versie terugzetten?",
+      description: "Hij komt meteen op elke pagina die dit symbool gebruikt. Wat er nu staat, blijft als versie bewaard.",
+      confirmLabel: "Terugzetten"
+    });
+    if (!ok || !current) return;
+    setSaving(true);
+    try {
+      await saveSymbol({ siteId, symbolId: current.id, name: v.name || current.name, blocks: v.blocks ?? [], translations: v.translations });
+      setDraftBlocks(v.blocks ?? []);
+      toast({ title: "Versie teruggezet", description: "Alle pagina's met dit symbool zijn bijgewerkt.", tone: "success" });
+    } catch (e) {
+      toast({ title: "Terugzetten mislukt", description: e.message, tone: "error" });
+    } finally {
+      setSaving(false);
+    }
+  }
   const current = useMemo(() => symbols.find((s) => s.id === symbolId), [symbols, symbolId]);
   useEffect(() => {
     setDraftBlocks(current ? current.blocks : null);
@@ -45,7 +67,27 @@ function SymbolRefEditor({ block, siteId, onChange }) {
     ] }) }),
     current && draftBlocks && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(Field, { label: `Inhoud van "${current.name}"`, children: /* @__PURE__ */ jsx(NestedBlocksEditor, { blocks: draftBlocks, siteId, onChange: setDraftBlocks, addLabel: "+ Blok in symbool\u2026" }) }),
-      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "primary", size: "sm", disabled: saving, onClick: () => persist(current.name, draftBlocks, current.id), children: saving ? "Opslaan\u2026" : "Symbool opslaan (overal bijwerken)" }) })
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { loading: saving, type: "button", variant: "primary", size: "sm", disabled: saving, onClick: () => persist(current.name, draftBlocks, current.id), children: "Symbool opslaan (overal bijwerken)" }) }),
+      versies.length > 0 && /* @__PURE__ */ jsxs("details", { className: "rounded-lg border border-slate-200 p-3 text-sm", children: [
+        /* @__PURE__ */ jsxs("summary", { className: "cursor-pointer font-medium text-slate-700", children: [
+          "Eerdere versies (",
+          versies.length,
+          ")"
+        ] }),
+        /* @__PURE__ */ jsx("ul", { className: "mt-2 grid gap-1", children: versies.map((v) => {
+          const d = v.savedAt && typeof v.savedAt.toDate === "function" ? v.savedAt.toDate() : null;
+          return /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-slate-600", children: [
+              d ? `Tot ${d.toLocaleString("nl-NL", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" })}` : "Eerdere versie",
+              " \xB7 ",
+              (v.blocks ?? []).length,
+              " ",
+              (v.blocks ?? []).length === 1 ? "blok" : "blokken"
+            ] }),
+            /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", variant: "ghost", disabled: saving, onClick: () => void zetVersieTerug(v), children: "Terugzetten" })
+          ] }, v.id);
+        }) })
+      ] })
     ] })
   ] });
 }

package/dist/admin/blockEditors/SymbolRefEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/blockEditors/SymbolRefEditor.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Editor voor het symbolRef-blok (5.0): kies een gedeeld symbool, of maak er een nieuwe aan,\n * en bewerk de INHOUD van het symbool direct in het zijpaneel (NestedBlocksEditor — dezelfde\n * geneste blok-editor als kolommen/zijbalk). Opslaan gaat via de saveSymbol-callable en\n * propageert naar élke pagina die het symbool gebruikt; de melding maakt dat expliciet.\n * Loskoppelen (kloon i.p.v. referentie) zit als actie op het blok in de VisualEditor.\n */\nimport { useEffect, useMemo, useState } from \"react\";\nimport { Button, Field, Input } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { useToast } from \"../ui/toast\";\nimport { subscribeSymbols, saveSymbol } from \"../lib/symbolsClient\";\nimport type { StoredSymbol } from \"../../schema/symbols\";\nimport type { BlockEditorProps } from \"./index\";\nimport { NestedBlocksEditor } from \"./index\";\n\nexport function SymbolRefEditor({ block, siteId, onChange }: BlockEditorProps) {\n  const { toast } = useToast();\n  const [symbols, setSymbols] = useState<StoredSymbol[]>([]);\n  const [newName, setNewName] = useState(\"\");\n  const [draftBlocks, setDraftBlocks] = useState<Record<string, unknown>[] | null>(null);\n  const [saving, setSaving] = useState(false);\n  const symbolId = String(block.symbolId ?? \"\");\n\n  useEffect(() => subscribeSymbols(siteId, setSymbols), [siteId]);\n  const current = useMemo(() => symbols.find((s) => s.id === symbolId), [symbols, symbolId]);\n\n  // Bewerk-buffer volgt het gekozen symbool (verse kopie bij wissel).\n  useEffect(() => {\n    setDraftBlocks(current ? (current.blocks as Record<string, unknown>[]) : null);\n  }, [current?.id]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  async function persist(name: string, blocks: Record<string, unknown>[], id?: string) {\n    setSaving(true);\n    try {\n      const res = await saveSymbol({ siteId, symbolId: id, name, blocks });\n      if (!id) onChange({ ...block, symbolId: res.id });\n      toast({ title: \"Symbool opgeslagen\", description: \"Alle pagina's met dit symbool zijn bijgewerkt.\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Opslaan mislukt\", description: (e as Error).message, tone: \"error\" });\n    } finally {\n      setSaving(false);\n    }\n  }\n\n  return (\n    <div className=\"grid gap-3\">\n      <Field label=\"Symbool\" hint=\"Een gedeelde sectie: wijzigingen gelden op élke pagina die dit symbool gebruikt.\">\n        <Select\n          value={symbolId}\n          onValueChange={(v) => onChange({ ...block, symbolId: v })}\n          options={[{ value: \"\", label: \"— kies een symbool —\" }, ...symbols.map((s) => ({ value: s.id, label: s.name }))]}\n        />\n      </Field>\n\n      {!symbolId && (\n        <Field label=\"Of maak een nieuw symbool\" hint=\"Begint leeg; voeg daarna blokken toe.\">\n          <div className=\"flex items-center gap-2\">\n            <Input value={newName} placeholder=\"Naam (bv. Afspraak-CTA)\" onChange={(e) => setNewName(e.target.value)} />\n            <Button type=\"button\" variant=\"secondary\" size=\"sm\" disabled={!newName.trim() || saving} onClick={() => persist(newName.trim(), [])}>\n              Maak\n            </Button>\n          </div>\n        </Field>\n      )}\n\n      {current && draftBlocks && (\n        <>\n          <Field label={`Inhoud van \"${current.name}\"`}>\n            <NestedBlocksEditor blocks={draftBlocks} siteId={siteId} onChange={setDraftBlocks} addLabel=\"+ Blok in symbool…\" />\n          </Field>\n          <div>\n            <Button type=\"button\" variant=\"primary\" size=\"sm\" disabled={saving} onClick={() => persist(current.name, draftBlocks, current.id)}>\n              {saving ? \"Opslaan…\" : \"Symbool opslaan (overal bijwerken)\"}\n            </Button>\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAkDQ,SAmBA,UAnBA,KASE,YATF;AAzCR,SAAS,WAAW,SAAS,gBAAgB;AAC7C,SAAS,QAAQ,OAAO,aAAa;AACrC,SAAS,cAAc;AACvB,SAAS,gBAAgB;AACzB,SAAS,kBAAkB,kBAAkB;AAG7C,SAAS,0BAA0B;AAE5B,SAAS,gBAAgB,EAAE,OAAO,QAAQ,SAAS,GAAqB;AAC7E,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,CAAC,SAAS,UAAU,IAAI,SAAyB,CAAC,CAAC;AACzD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,EAAE;AACzC,QAAM,CAAC,aAAa,cAAc,IAAI,SAA2C,IAAI;AACrF,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,WAAW,OAAO,MAAM,YAAY,EAAE;AAE5C,YAAU,MAAM,iBAAiB,QAAQ,UAAU,GAAG,CAAC,MAAM,CAAC;AAC9D,QAAM,UAAU,QAAQ,MAAM,QAAQ,KAAK,CAAC,MAAM,EAAE,OAAO,QAAQ,GAAG,CAAC,SAAS,QAAQ,CAAC;AAGzF,YAAU,MAAM;AACd,mBAAe,UAAW,QAAQ,SAAuC,IAAI;AAAA,EAC/E,GAAG,CAAC,SAAS,EAAE,CAAC;AAEhB,iBAAe,QAAQ,MAAc,QAAmC,IAAa;AACnF,cAAU,IAAI;AACd,QAAI;AACF,YAAM,MAAM,MAAM,WAAW,EAAE,QAAQ,UAAU,IAAI,MAAM,OAAO,CAAC;AACnE,UAAI,CAAC,GAAI,UAAS,EAAE,GAAG,OAAO,UAAU,IAAI,GAAG,CAAC;AAChD,YAAM,EAAE,OAAO,sBAAsB,aAAa,kDAAkD,MAAM,UAAU,CAAC;AAAA,IACvH,SAAS,GAAG;AACV,YAAM,EAAE,OAAO,mBAAmB,aAAc,EAAY,SAAS,MAAM,QAAQ,CAAC;AAAA,IACtF,UAAE;AACA,gBAAU,KAAK;AAAA,IACjB;AAAA,EACF;AAEA,SACE,qBAAC,SAAI,WAAU,cACb;AAAA,wBAAC,SAAM,OAAM,WAAU,MAAK,uFAC1B;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,eAAe,CAAC,MAAM,SAAS,EAAE,GAAG,OAAO,UAAU,EAAE,CAAC;AAAA,QACxD,SAAS,CAAC,EAAE,OAAO,IAAI,OAAO,iCAAuB,GAAG,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,EAAE,CAAC;AAAA;AAAA,IACjH,GACF;AAAA,IAEC,CAAC,YACA,oBAAC,SAAM,OAAM,6BAA4B,MAAK,yCAC5C,+BAAC,SAAI,WAAU,2BACb;AAAA,0BAAC,SAAM,OAAO,SAAS,aAAY,2BAA0B,UAAU,CAAC,MAAM,WAAW,EAAE,OAAO,KAAK,GAAG;AAAA,MAC1G,oBAAC,UAAO,MAAK,UAAS,SAAQ,aAAY,MAAK,MAAK,UAAU,CAAC,QAAQ,KAAK,KAAK,QAAQ,SAAS,MAAM,QAAQ,QAAQ,KAAK,GAAG,CAAC,CAAC,GAAG,kBAErI;AAAA,OACF,GACF;AAAA,IAGD,WAAW,eACV,iCACE;AAAA,0BAAC,SAAM,OAAO,eAAe,QAAQ,IAAI,KACvC,8BAAC,sBAAmB,QAAQ,aAAa,QAAgB,UAAU,gBAAgB,UAAS,2BAAqB,GACnH;AAAA,MACA,oBAAC,SACC,8BAAC,UAAO,MAAK,UAAS,SAAQ,WAAU,MAAK,MAAK,UAAU,QAAQ,SAAS,MAAM,QAAQ,QAAQ,MAAM,aAAa,QAAQ,EAAE,GAC7H,mBAAS,kBAAa,sCACzB,GACF;AAAA,OACF;AAAA,KAEJ;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/admin/blockEditors/SymbolRefEditor.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Editor voor het symbolRef-blok (5.0): kies een gedeeld symbool, of maak er een nieuwe aan,\n * en bewerk de INHOUD van het symbool direct in het zijpaneel (NestedBlocksEditor — dezelfde\n * geneste blok-editor als kolommen/zijbalk). Opslaan gaat via de saveSymbol-callable en\n * propageert naar élke pagina die het symbool gebruikt; de melding maakt dat expliciet.\n * Loskoppelen (kloon i.p.v. referentie) zit als actie op het blok in de VisualEditor.\n */\nimport { useEffect, useMemo, useState } from \"react\";\nimport { Button, Field, Input } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { useToast } from \"../ui/toast\";\nimport { subscribeSymbols, saveSymbol, subscribeSymbolVersions, type SymboolVersie } from \"../lib/symbolsClient\";\nimport { useConfirm } from \"../ui/ConfirmDialog\";\nimport type { StoredSymbol } from \"../../schema/symbols\";\nimport type { BlockEditorProps } from \"./index\";\nimport { NestedBlocksEditor } from \"./index\";\n\nexport function SymbolRefEditor({ block, siteId, onChange }: BlockEditorProps) {\n  const { toast } = useToast();\n  const confirm = useConfirm();\n  const [versies, setVersies] = useState<SymboolVersie[]>([]);\n  const [symbols, setSymbols] = useState<StoredSymbol[]>([]);\n  const [newName, setNewName] = useState(\"\");\n  const [draftBlocks, setDraftBlocks] = useState<Record<string, unknown>[] | null>(null);\n  const [saving, setSaving] = useState(false);\n  const symbolId = String(block.symbolId ?? \"\");\n\n  useEffect(() => subscribeSymbols(siteId, setSymbols), [siteId]);\n  useEffect(() => subscribeSymbolVersions(siteId, symbolId, setVersies), [siteId, symbolId]);\n\n  /** Een eerdere versie terugzetten (8.10) = die versie opnieuw opslaan; de huidige wordt zelf een versie. */\n  async function zetVersieTerug(v: SymboolVersie) {\n    const ok = await confirm({\n      title: \"Deze versie terugzetten?\",\n      description: \"Hij komt meteen op elke pagina die dit symbool gebruikt. Wat er nu staat, blijft als versie bewaard.\",\n      confirmLabel: \"Terugzetten\",\n    });\n    if (!ok || !current) return;\n    setSaving(true);\n    try {\n      await saveSymbol({ siteId, symbolId: current.id, name: v.name || current.name, blocks: v.blocks ?? [], translations: v.translations });\n      setDraftBlocks(v.blocks ?? []);\n      toast({ title: \"Versie teruggezet\", description: \"Alle pagina's met dit symbool zijn bijgewerkt.\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Terugzetten mislukt\", description: (e as Error).message, tone: \"error\" });\n    } finally {\n      setSaving(false);\n    }\n  }\n  const current = useMemo(() => symbols.find((s) => s.id === symbolId), [symbols, symbolId]);\n\n  // Bewerk-buffer volgt het gekozen symbool (verse kopie bij wissel).\n  useEffect(() => {\n    setDraftBlocks(current ? (current.blocks as Record<string, unknown>[]) : null);\n  }, [current?.id]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  async function persist(name: string, blocks: Record<string, unknown>[], id?: string) {\n    setSaving(true);\n    try {\n      const res = await saveSymbol({ siteId, symbolId: id, name, blocks });\n      if (!id) onChange({ ...block, symbolId: res.id });\n      toast({ title: \"Symbool opgeslagen\", description: \"Alle pagina's met dit symbool zijn bijgewerkt.\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Opslaan mislukt\", description: (e as Error).message, tone: \"error\" });\n    } finally {\n      setSaving(false);\n    }\n  }\n\n  return (\n    <div className=\"grid gap-3\">\n      <Field label=\"Symbool\" hint=\"Een gedeelde sectie: wijzigingen gelden op élke pagina die dit symbool gebruikt.\">\n        <Select\n          value={symbolId}\n          onValueChange={(v) => onChange({ ...block, symbolId: v })}\n          options={[{ value: \"\", label: \"— kies een symbool —\" }, ...symbols.map((s) => ({ value: s.id, label: s.name }))]}\n        />\n      </Field>\n\n      {!symbolId && (\n        <Field label=\"Of maak een nieuw symbool\" hint=\"Begint leeg; voeg daarna blokken toe.\">\n          <div className=\"flex items-center gap-2\">\n            <Input value={newName} placeholder=\"Naam (bv. Afspraak-CTA)\" onChange={(e) => setNewName(e.target.value)} />\n            <Button type=\"button\" variant=\"secondary\" size=\"sm\" disabled={!newName.trim() || saving} onClick={() => persist(newName.trim(), [])}>\n              Maak\n            </Button>\n          </div>\n        </Field>\n      )}\n\n      {current && draftBlocks && (\n        <>\n          <Field label={`Inhoud van \"${current.name}\"`}>\n            <NestedBlocksEditor blocks={draftBlocks} siteId={siteId} onChange={setDraftBlocks} addLabel=\"+ Blok in symbool…\" />\n          </Field>\n          <div>\n            <Button loading={saving} type=\"button\" variant=\"primary\" size=\"sm\" disabled={saving} onClick={() => persist(current.name, draftBlocks, current.id)}>\n              {\"Symbool opslaan (overal bijwerken)\"}\n            </Button>\n          </div>\n          {versies.length > 0 && (\n            <details className=\"rounded-lg border border-slate-200 p-3 text-sm\">\n              <summary className=\"cursor-pointer font-medium text-slate-700\">Eerdere versies ({versies.length})</summary>\n              <ul className=\"mt-2 grid gap-1\">\n                {versies.map((v) => {\n                  const d = v.savedAt && typeof (v.savedAt as { toDate?: () => Date }).toDate === \"function\" ? (v.savedAt as { toDate: () => Date }).toDate() : null;\n                  return (\n                    <li key={v.id} className=\"flex items-center justify-between gap-2\">\n                      <span className=\"text-slate-600\">\n                        {d ? `Tot ${d.toLocaleString(\"nl-NL\", { day: \"numeric\", month: \"short\", hour: \"2-digit\", minute: \"2-digit\" })}` : \"Eerdere versie\"}\n                        {\" · \"}{(v.blocks ?? []).length} {(v.blocks ?? []).length === 1 ? \"blok\" : \"blokken\"}\n                      </span>\n                      <Button type=\"button\" size=\"sm\" variant=\"ghost\" disabled={saving} onClick={() => void zetVersieTerug(v)}>Terugzetten</Button>\n                    </li>\n                  );\n                })}\n              </ul>\n            </details>\n          )}\n        </>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}