@xiwebdesign/xicms-core 4.17.1

package/dist/blocks/builtins/Cards.js

@@ -0,0 +1,94 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CardsBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { VStack, Grid, Card, Heading, Text } from "../ui";
+import { useLinkComponent } from "@astryxdesign/core/Link";
+import { Img } from "../../media/ImageContext";
+function CardsRender({ block }) {
+  const LinkC = useLinkComponent();
+  const items = (block.items ?? []).filter((c) => c.title || c.text || c.imageUrl);
+  if (items.length === 0 && !block.heading) return null;
+  return /* @__PURE__ */ jsxs(VStack, { gap: 4, as: "section", className: "xicms-cards", children: [
+    (block.heading || block.intro) && /* @__PURE__ */ jsxs(VStack, { gap: 1, hAlign: "center", style: { textAlign: "center" }, children: [
+      block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+      block.intro && /* @__PURE__ */ jsx(Text, { type: "large", color: "secondary", children: block.intro })
+    ] }),
+    /* @__PURE__ */ jsx(Grid, { columns: { minWidth: 240, max: block.columns }, gap: 4, children: items.map((c, i) => {
+      const cover = block.imageStyle === "cover" && Boolean(c.imageUrl);
+      const body = /* @__PURE__ */ jsxs(VStack, { gap: 2, style: cover ? { padding: "1.1rem 1.25rem 1.25rem" } : void 0, children: [
+        c.title && /* @__PURE__ */ jsx(Heading, { level: 3, className: "xicms-cards__title", "data-xicms-edit": `items.${i}.title`, children: c.title }),
+        c.text && /* @__PURE__ */ jsx(Text, { color: "secondary", className: "xicms-cards__text", "data-xicms-edit": `items.${i}.text`, children: c.text }),
+        c.href && c.linkLabel && /* @__PURE__ */ jsxs(Text, { type: "label", style: { color: "var(--color-accent)" }, children: [
+          c.linkLabel,
+          " \u2192"
+        ] })
+      ] });
+      const inner = cover ? /* @__PURE__ */ jsxs(VStack, { gap: 0, style: { height: "100%" }, children: [
+        /* @__PURE__ */ jsx(
+          Img,
+          {
+            src: c.imageUrl,
+            alt: c.title ?? "",
+            width: 600,
+            height: 360,
+            sizes: "(max-width: 720px) 100vw, 33vw",
+            editField: `items.${i}.imageUrl`,
+            style: { width: "100%", aspectRatio: "16 / 10", objectFit: "cover", display: "block" }
+          }
+        ),
+        body
+      ] }) : /* @__PURE__ */ jsxs(VStack, { gap: 2, children: [
+        c.imageUrl ? /* @__PURE__ */ jsx(
+          Img,
+          {
+            src: c.imageUrl,
+            alt: c.title ?? "",
+            width: 480,
+            height: 300,
+            sizes: "(max-width: 720px) 100vw, 33vw",
+            editField: `items.${i}.imageUrl`,
+            style: { width: "100%", height: 160, objectFit: "cover", borderRadius: "var(--radius-element)" }
+          }
+        ) : c.icon ? /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { fontSize: "2rem", lineHeight: 1 }, children: c.icon }) : null,
+        c.title && /* @__PURE__ */ jsx(Heading, { level: 3, className: "xicms-cards__title", "data-xicms-edit": `items.${i}.title`, children: c.title }),
+        c.text && /* @__PURE__ */ jsx(Text, { color: "secondary", className: "xicms-cards__text", "data-xicms-edit": `items.${i}.text`, children: c.text }),
+        c.href && c.linkLabel && /* @__PURE__ */ jsxs(Text, { type: "label", style: { color: "var(--color-accent)" }, children: [
+          c.linkLabel,
+          " \u2192"
+        ] })
+      ] });
+      const card = /* @__PURE__ */ jsx(
+        Card,
+        {
+          padding: cover ? 0 : 4,
+          height: "100%",
+          className: `xicms-cards__card${c.featured ? " xicms-cards__card--featured" : ""}`,
+          style: cover ? { overflow: "hidden" } : void 0,
+          children: inner
+        }
+      );
+      return c.href ? /* @__PURE__ */ jsx(LinkC, { href: c.href, style: { textDecoration: "none", color: "inherit", display: "block" }, children: card }, i) : /* @__PURE__ */ jsx("div", { children: card }, i);
+    }) })
+  ] });
+}
+const cardsBlock = defineBlock({
+  type: "cards",
+  schema: CardsBlockSchema,
+  Render: CardsRender,
+  label: "Diensten / kaarten",
+  icon: "\u{1F9E9}",
+  defaults: () => ({
+    heading: "Onze diensten",
+    columns: 3,
+    items: [
+      { icon: "\u2B50", title: "Dienst \xE9\xE9n", text: "Korte omschrijving van wat je biedt." },
+      { icon: "\u26A1", title: "Dienst twee", text: "Korte omschrijving van wat je biedt." },
+      { icon: "\u{1F4AC}", title: "Dienst drie", text: "Korte omschrijving van wat je biedt." }
+    ]
+  })
+});
+export {
+  cardsBlock
+};
+//# sourceMappingURL=Cards.js.map

package/dist/blocks/builtins/Cards.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Cards.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { CardsBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { VStack, Grid, Card, Heading, Text } from \"../ui\";\nimport { useLinkComponent } from \"@astryxdesign/core/Link\";\nimport { Img } from \"../../media/ImageContext\";\n\ntype Cards = z.infer<typeof CardsBlockSchema>;\n\n/** Diensten/uitgelichte kaarten in een responsive grid (Astryx). */\nfunction CardsRender({ block }: BlockRenderProps<Cards>) {\n  const LinkC = useLinkComponent();\n  const items = (block.items ?? []).filter((c) => c.title || c.text || c.imageUrl);\n  if (items.length === 0 && !block.heading) return null;\n  return (\n    <VStack gap={4} as=\"section\" className=\"xicms-cards\">\n      {(block.heading || block.intro) && (\n        <VStack gap={1} hAlign=\"center\" style={{ textAlign: \"center\" }}>\n          {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n          {block.intro && <Text type=\"large\" color=\"secondary\">{block.intro}</Text>}\n        </VStack>\n      )}\n      <Grid columns={{ minWidth: 240, max: block.columns }} gap={4}>\n        {items.map((c, i) => {\n          const cover = block.imageStyle === \"cover\" && Boolean(c.imageUrl);\n          const body = (\n            <VStack gap={2} style={cover ? { padding: \"1.1rem 1.25rem 1.25rem\" } : undefined}>\n              {c.title && <Heading level={3} className=\"xicms-cards__title\" data-xicms-edit={`items.${i}.title`}>{c.title}</Heading>}\n              {c.text && <Text color=\"secondary\" className=\"xicms-cards__text\" data-xicms-edit={`items.${i}.text`}>{c.text}</Text>}\n              {c.href && c.linkLabel && (\n                <Text type=\"label\" style={{ color: \"var(--color-accent)\" }}>{c.linkLabel} →</Text>\n              )}\n            </VStack>\n          );\n          const inner = cover ? (\n            <VStack gap={0} style={{ height: \"100%\" }}>\n              {/* Beeld edge-to-edge bovenaan (postkaart-stijl); tekst hieronder gepad. */}\n              <Img src={c.imageUrl as string} alt={c.title ?? \"\"} width={600} height={360}\n                sizes=\"(max-width: 720px) 100vw, 33vw\" editField={`items.${i}.imageUrl`}\n                style={{ width: \"100%\", aspectRatio: \"16 / 10\", objectFit: \"cover\", display: \"block\" }} />\n              {body}\n            </VStack>\n          ) : (\n            <VStack gap={2}>\n              {c.imageUrl ? (\n                <Img src={c.imageUrl} alt={c.title ?? \"\"} width={480} height={300}\n                  sizes=\"(max-width: 720px) 100vw, 33vw\" editField={`items.${i}.imageUrl`}\n                  style={{ width: \"100%\", height: 160, objectFit: \"cover\", borderRadius: \"var(--radius-element)\" }} />\n              ) : c.icon ? (\n                <div aria-hidden=\"true\" style={{ fontSize: \"2rem\", lineHeight: 1 }}>{c.icon}</div>\n              ) : null}\n              {c.title && <Heading level={3} className=\"xicms-cards__title\" data-xicms-edit={`items.${i}.title`}>{c.title}</Heading>}\n              {c.text && <Text color=\"secondary\" className=\"xicms-cards__text\" data-xicms-edit={`items.${i}.text`}>{c.text}</Text>}\n              {c.href && c.linkLabel && (\n                <Text type=\"label\" style={{ color: \"var(--color-accent)\" }}>{c.linkLabel} →</Text>\n              )}\n            </VStack>\n          );\n          const card = (\n            <Card\n              padding={cover ? 0 : 4}\n              height=\"100%\"\n              className={`xicms-cards__card${c.featured ? \" xicms-cards__card--featured\" : \"\"}`}\n              style={cover ? { overflow: \"hidden\" } : undefined}\n            >\n              {inner}\n            </Card>\n          );\n          return c.href ? (\n            <LinkC key={i} href={c.href} style={{ textDecoration: \"none\", color: \"inherit\", display: \"block\" }}>\n              {card}\n            </LinkC>\n          ) : (\n            <div key={i}>{card}</div>\n          );\n        })}\n      </Grid>\n    </VStack>\n  );\n}\n\nexport const cardsBlock = defineBlock({\n  type: \"cards\",\n  schema: CardsBlockSchema,\n  Render: CardsRender,\n  label: \"Diensten / kaarten\",\n  icon: \"🧩\",\n  defaults: () => ({\n    heading: \"Onze diensten\",\n    columns: 3,\n    items: [\n      { icon: \"⭐\", title: \"Dienst één\", text: \"Korte omschrijving van wat je biedt.\" },\n      { icon: \"⚡\", title: \"Dienst twee\", text: \"Korte omschrijving van wat je biedt.\" },\n      { icon: \"💬\", title: \"Dienst drie\", text: \"Korte omschrijving van wat je biedt.\" },\n    ],\n  }),\n});\n"],"mappings":"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","names":[]}

package/dist/blocks/builtins/Columns.d.ts

@@ -0,0 +1,2 @@
+import type { z } from "zod";
+export declare const columnsBlock: import("..").BlockDefinition<z.ZodTypeAny>;

package/dist/blocks/builtins/Columns.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { ColumnsBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { BlockRenderer } from "../BlockRenderer";
+import { useRegistry } from "../context";
+function ColumnsRender({ block, siteId, mode }) {
+  const registry = useRegistry();
+  return /* @__PURE__ */ jsx("div", { className: "xicms-columns", style: { gridTemplateColumns: `repeat(${block.columns.length}, 1fr)` }, children: block.columns.map((col, idx) => /* @__PURE__ */ jsx("div", { className: "xicms-column", children: /* @__PURE__ */ jsx(BlockRenderer, { blocks: col.blocks, registry, siteId, mode }) }, idx)) });
+}
+const columnsBlock = defineBlock({
+  type: "columns",
+  schema: ColumnsBlockSchema,
+  Render: ColumnsRender,
+  label: "Kolommen",
+  icon: "\u25A5",
+  defaults: () => ({ columns: [{ blocks: [] }, { blocks: [] }] })
+});
+export {
+  columnsBlock
+};
+//# sourceMappingURL=Columns.js.map

package/dist/blocks/builtins/Columns.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Columns.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { ColumnsBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { BlockRenderer } from \"../BlockRenderer\";\nimport { useRegistry } from \"../context\";\n\ntype Columns = z.infer<typeof ColumnsBlockSchema>;\n\nfunction ColumnsRender({ block, siteId, mode }: BlockRenderProps<Columns>) {\n  const registry = useRegistry();\n  return (\n    <div className=\"xicms-columns\" style={{ gridTemplateColumns: `repeat(${block.columns.length}, 1fr)` }}>\n      {block.columns.map((col, idx) => (\n        <div key={idx} className=\"xicms-column\">\n          <BlockRenderer blocks={col.blocks} registry={registry} siteId={siteId} mode={mode} />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport const columnsBlock = defineBlock({\n  type: \"columns\",\n  schema: ColumnsBlockSchema,\n  Render: ColumnsRender,\n  label: \"Kolommen\",\n  icon: \"▥\",\n  defaults: () => ({ columns: [{ blocks: [] }, { blocks: [] }] }),\n});\n"],"mappings":";AAgBU;AAbV,SAAS,0BAA0B;AACnC,SAAS,mBAA0C;AACnD,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAI5B,SAAS,cAAc,EAAE,OAAO,QAAQ,KAAK,GAA8B;AACzE,QAAM,WAAW,YAAY;AAC7B,SACE,oBAAC,SAAI,WAAU,iBAAgB,OAAO,EAAE,qBAAqB,UAAU,MAAM,QAAQ,MAAM,SAAS,GACjG,gBAAM,QAAQ,IAAI,CAAC,KAAK,QACvB,oBAAC,SAAc,WAAU,gBACvB,8BAAC,iBAAc,QAAQ,IAAI,QAAQ,UAAoB,QAAgB,MAAY,KAD3E,GAEV,CACD,GACH;AAEJ;AAEO,MAAM,eAAe,YAAY;AAAA,EACtC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,SAAS,CAAC,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,CAAC,EAAE;AAC/D,CAAC;","names":[]}

package/dist/blocks/builtins/Contact.d.ts

@@ -0,0 +1,7 @@
+import type { z } from "zod";
+import { ContactBlockSchema } from "../../schema/blocks";
+type Contact = z.infer<typeof ContactBlockSchema>;
+export declare function contactJsonLd(b: Contact): Record<string, unknown>;
+export declare const contactBlock: import("..").BlockDefinition<z.ZodTypeAny>;
+export declare const socialBlock: import("..").BlockDefinition<z.ZodTypeAny>;
+export {};

package/dist/blocks/builtins/Contact.js

@@ -0,0 +1,121 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ContactBlockSchema, SocialBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Heading } from "../ui";
+function contactJsonLd(b) {
+  return {
+    "@context": "https://schema.org",
+    "@type": "LocalBusiness",
+    // Gedeeld relatief @id: contact-, openingstijden- en layout-JSON-LD beschrijven hetzelfde
+    // bedrijf; zonder @id ziet Google drie conflicterende LocalBusiness-entiteiten per pagina.
+    "@id": "#business",
+    ...b.heading ? { name: b.heading } : {},
+    ...b.address ? { address: b.address } : {},
+    ...b.phone ? { telephone: b.phone } : {},
+    ...b.email ? { email: b.email } : {},
+    ...b.geo ? { geo: { "@type": "GeoCoordinates", latitude: b.geo.lat, longitude: b.geo.lng } } : {}
+  };
+}
+function ContactRender({ block }) {
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-contact", children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+    /* @__PURE__ */ jsxs("dl", { className: "xicms-contact__list", children: [
+      block.address && /* @__PURE__ */ jsxs("div", { className: "xicms-contact__row", children: [
+        /* @__PURE__ */ jsx("dt", { children: "Adres" }),
+        /* @__PURE__ */ jsx("dd", { "data-xicms-edit": "address", children: block.address })
+      ] }),
+      block.phone && /* @__PURE__ */ jsxs("div", { className: "xicms-contact__row", children: [
+        /* @__PURE__ */ jsx("dt", { children: "Telefoon" }),
+        /* @__PURE__ */ jsx("dd", { children: /* @__PURE__ */ jsx("a", { href: `tel:${block.phone.replace(/\s+/g, "")}`, children: block.phone }) })
+      ] }),
+      block.email && /* @__PURE__ */ jsxs("div", { className: "xicms-contact__row", children: [
+        /* @__PURE__ */ jsx("dt", { children: "E-mail" }),
+        /* @__PURE__ */ jsx("dd", { children: /* @__PURE__ */ jsx("a", { href: `mailto:${block.email}`, children: block.email }) })
+      ] }),
+      block.hours && /* @__PURE__ */ jsxs("div", { className: "xicms-contact__row", children: [
+        /* @__PURE__ */ jsx("dt", { children: "Openingstijden" }),
+        /* @__PURE__ */ jsx("dd", { "data-xicms-edit": "hours", children: block.hours })
+      ] })
+    ] }),
+    block.jsonLd && /* @__PURE__ */ jsx(
+      "script",
+      {
+        type: "application/ld+json",
+        dangerouslySetInnerHTML: { __html: JSON.stringify(contactJsonLd(block)) }
+      }
+    )
+  ] });
+}
+const contactBlock = defineBlock({
+  type: "contact",
+  schema: ContactBlockSchema,
+  Render: ContactRender,
+  label: "Contactgegevens",
+  icon: "\u{1F4C7}",
+  defaults: () => ({ heading: "Contact", jsonLd: true })
+});
+function SocialIcon({ platform }) {
+  const p = platform.toLowerCase();
+  const common = { width: 22, height: 22, viewBox: "0 0 24 24", "aria-hidden": true };
+  if (p.includes("instagram")) {
+    return /* @__PURE__ */ jsxs("svg", { ...common, fill: "none", stroke: "currentColor", strokeWidth: "1.8", children: [
+      /* @__PURE__ */ jsx("rect", { x: "4", y: "4", width: "16", height: "16", rx: "4.5" }),
+      /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3.6" }),
+      /* @__PURE__ */ jsx("circle", { cx: "16.7", cy: "7.3", r: "1.1", fill: "currentColor", stroke: "none" })
+    ] });
+  }
+  if (p.includes("facebook")) {
+    return /* @__PURE__ */ jsx("svg", { ...common, fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M13.5 20v-6.2h2.1l.4-2.6h-2.5V9.6c0-.8.3-1.3 1.3-1.3h1.3V6c-.3 0-1-.1-1.9-.1-2 0-3.3 1.2-3.3 3.4v1.9H8.7v2.6h2.2V20h2.6z" }) });
+  }
+  if (p.includes("linkedin")) {
+    return /* @__PURE__ */ jsxs("svg", { ...common, fill: "currentColor", children: [
+      /* @__PURE__ */ jsx("circle", { cx: "6", cy: "6.4", r: "1.8" }),
+      /* @__PURE__ */ jsx("rect", { x: "4.6", y: "9.6", width: "2.8", height: "9.9" }),
+      /* @__PURE__ */ jsx("path", { d: "M10.4 9.6h2.7v1.4c.5-.9 1.6-1.7 3.1-1.7 2.4 0 3.7 1.5 3.7 4.3v5.9h-2.8v-5.4c0-1.5-.6-2.3-1.7-2.3-1.2 0-2.2.8-2.2 2.4v5.3h-2.8V9.6z" })
+    ] });
+  }
+  if (p.includes("twitter") || p === "x" || p.startsWith("x ") || p.includes("(x)")) {
+    return /* @__PURE__ */ jsx("svg", { ...common, fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M4.5 4.5h3.6l4.1 5.6 4.7-5.6h2.6l-6.1 7.2 6.4 8.4h-3.6l-4.4-6-5 6H4.2l6.5-7.7-6.2-7.9z" }) });
+  }
+  if (p.includes("youtube")) {
+    return /* @__PURE__ */ jsxs("svg", { ...common, fill: "currentColor", children: [
+      /* @__PURE__ */ jsx("rect", { x: "3.2", y: "6.2", width: "17.6", height: "11.6", rx: "3.2" }),
+      /* @__PURE__ */ jsx("path", { d: "M10.4 9.4v5.2l4.8-2.6z", fill: "var(--xicms-surface, #fff)" })
+    ] });
+  }
+  if (p.includes("whatsapp")) {
+    return /* @__PURE__ */ jsxs("svg", { ...common, fill: "none", stroke: "currentColor", strokeWidth: "1.8", children: [
+      /* @__PURE__ */ jsx("path", { d: "M12 4.2a7.8 7.8 0 0 0-6.7 11.8L4.4 19.6l3.7-.9A7.8 7.8 0 1 0 12 4.2z" }),
+      /* @__PURE__ */ jsx("path", { d: "M9.3 8.9c.7 2.4 2.6 4.4 5 5l1-1.2 2 1.2", strokeLinecap: "round", strokeLinejoin: "round" })
+    ] });
+  }
+  if (p.includes("tiktok")) {
+    return /* @__PURE__ */ jsx("svg", { ...common, fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M14.5 4h2.6c.2 1.7 1.3 3 3 3.3v2.6a6.6 6.6 0 0 1-3.2-1v5.7a5.4 5.4 0 1 1-5.4-5.4c.2 0 .5 0 .7.1v2.8a2.6 2.6 0 1 0 2.3 2.6V4z" }) });
+  }
+  return null;
+}
+function SocialRender({ block }) {
+  const items = (block.items ?? []).filter((i) => i.href && i.platform);
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-social", children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+    /* @__PURE__ */ jsx("ul", { className: "xicms-social__list", children: items.map((it, i) => {
+      const icon = SocialIcon({ platform: it.platform });
+      return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: it.href, rel: "noopener noreferrer", target: "_blank", "aria-label": it.platform, title: it.platform, className: icon ? "xicms-social__iconlink" : void 0, children: icon ?? it.platform }) }, i);
+    }) })
+  ] });
+}
+const socialBlock = defineBlock({
+  type: "social",
+  schema: SocialBlockSchema,
+  Render: SocialRender,
+  label: "Social-links",
+  icon: "\u{1F517}",
+  defaults: () => ({ items: [{ platform: "Instagram", href: "" }] })
+});
+export {
+  contactBlock,
+  contactJsonLd,
+  socialBlock
+};
+//# sourceMappingURL=Contact.js.map

package/dist/blocks/builtins/Contact.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Contact.tsx"],"sourcesContent":["import type { z } from \"zod\";\nimport { ContactBlockSchema, SocialBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Heading } from \"../ui\";\n\n/* ── Contact ─────────────────────────────────────────────────────────────── */\ntype Contact = z.infer<typeof ContactBlockSchema>;\nexport function contactJsonLd(b: Contact): Record<string, unknown> {\n  return {\n    \"@context\": \"https://schema.org\",\n    \"@type\": \"LocalBusiness\",\n    // Gedeeld relatief @id: contact-, openingstijden- en layout-JSON-LD beschrijven hetzelfde\n    // bedrijf; zonder @id ziet Google drie conflicterende LocalBusiness-entiteiten per pagina.\n    \"@id\": \"#business\",\n    ...(b.heading ? { name: b.heading } : {}),\n    ...(b.address ? { address: b.address } : {}),\n    ...(b.phone ? { telephone: b.phone } : {}),\n    ...(b.email ? { email: b.email } : {}),\n    ...(b.geo ? { geo: { \"@type\": \"GeoCoordinates\", latitude: b.geo.lat, longitude: b.geo.lng } } : {}),\n  };\n}\nfunction ContactRender({ block }: BlockRenderProps<Contact>) {\n  return (\n    <section className=\"xicms-contact\">\n      {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n      <dl className=\"xicms-contact__list\">\n        {block.address && (\n          <div className=\"xicms-contact__row\">\n            <dt>Adres</dt>\n            <dd data-xicms-edit=\"address\">{block.address}</dd>\n          </div>\n        )}\n        {block.phone && (\n          <div className=\"xicms-contact__row\">\n            <dt>Telefoon</dt>\n            <dd><a href={`tel:${block.phone.replace(/\\s+/g, \"\")}`}>{block.phone}</a></dd>\n          </div>\n        )}\n        {block.email && (\n          <div className=\"xicms-contact__row\">\n            <dt>E-mail</dt>\n            <dd><a href={`mailto:${block.email}`}>{block.email}</a></dd>\n          </div>\n        )}\n        {block.hours && (\n          <div className=\"xicms-contact__row\">\n            <dt>Openingstijden</dt>\n            <dd data-xicms-edit=\"hours\">{block.hours}</dd>\n          </div>\n        )}\n      </dl>\n      {block.jsonLd && (\n        <script\n          type=\"application/ld+json\"\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{ __html: JSON.stringify(contactJsonLd(block)) }}\n        />\n      )}\n    </section>\n  );\n}\nexport const contactBlock = defineBlock({\n  type: \"contact\",\n  schema: ContactBlockSchema,\n  Render: ContactRender,\n  label: \"Contactgegevens\",\n  icon: \"📇\",\n  defaults: () => ({ heading: \"Contact\", jsonLd: true }),\n});\n\n/* ── Social ──────────────────────────────────────────────────────────────── */\ntype Social = z.infer<typeof SocialBlockSchema>;\n\n/**\n * Minimalistische, monochrome merk-iconen (currentColor) — geen icon-dependency nodig.\n * Onbekende platformen vallen terug op de tekstweergave, dus niets breekt.\n */\nfunction SocialIcon({ platform }: { platform: string }) {\n  const p = platform.toLowerCase();\n  const common = { width: 22, height: 22, viewBox: \"0 0 24 24\", \"aria-hidden\": true } as const;\n  if (p.includes(\"instagram\")) {\n    return (\n      <svg {...common} fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\">\n        <rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"4.5\" />\n        <circle cx=\"12\" cy=\"12\" r=\"3.6\" />\n        <circle cx=\"16.7\" cy=\"7.3\" r=\"1.1\" fill=\"currentColor\" stroke=\"none\" />\n      </svg>\n    );\n  }\n  if (p.includes(\"facebook\")) {\n    return (\n      <svg {...common} fill=\"currentColor\">\n        <path d=\"M13.5 20v-6.2h2.1l.4-2.6h-2.5V9.6c0-.8.3-1.3 1.3-1.3h1.3V6c-.3 0-1-.1-1.9-.1-2 0-3.3 1.2-3.3 3.4v1.9H8.7v2.6h2.2V20h2.6z\" />\n      </svg>\n    );\n  }\n  if (p.includes(\"linkedin\")) {\n    return (\n      <svg {...common} fill=\"currentColor\">\n        <circle cx=\"6\" cy=\"6.4\" r=\"1.8\" />\n        <rect x=\"4.6\" y=\"9.6\" width=\"2.8\" height=\"9.9\" />\n        <path d=\"M10.4 9.6h2.7v1.4c.5-.9 1.6-1.7 3.1-1.7 2.4 0 3.7 1.5 3.7 4.3v5.9h-2.8v-5.4c0-1.5-.6-2.3-1.7-2.3-1.2 0-2.2.8-2.2 2.4v5.3h-2.8V9.6z\" />\n      </svg>\n    );\n  }\n  if (p.includes(\"twitter\") || p === \"x\" || p.startsWith(\"x \") || p.includes(\"(x)\")) {\n    return (\n      <svg {...common} fill=\"currentColor\">\n        <path d=\"M4.5 4.5h3.6l4.1 5.6 4.7-5.6h2.6l-6.1 7.2 6.4 8.4h-3.6l-4.4-6-5 6H4.2l6.5-7.7-6.2-7.9z\" />\n      </svg>\n    );\n  }\n  if (p.includes(\"youtube\")) {\n    return (\n      <svg {...common} fill=\"currentColor\">\n        <rect x=\"3.2\" y=\"6.2\" width=\"17.6\" height=\"11.6\" rx=\"3.2\" />\n        <path d=\"M10.4 9.4v5.2l4.8-2.6z\" fill=\"var(--xicms-surface, #fff)\" />\n      </svg>\n    );\n  }\n  if (p.includes(\"whatsapp\")) {\n    return (\n      <svg {...common} fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\">\n        <path d=\"M12 4.2a7.8 7.8 0 0 0-6.7 11.8L4.4 19.6l3.7-.9A7.8 7.8 0 1 0 12 4.2z\" />\n        <path d=\"M9.3 8.9c.7 2.4 2.6 4.4 5 5l1-1.2 2 1.2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n      </svg>\n    );\n  }\n  if (p.includes(\"tiktok\")) {\n    return (\n      <svg {...common} fill=\"currentColor\">\n        <path d=\"M14.5 4h2.6c.2 1.7 1.3 3 3 3.3v2.6a6.6 6.6 0 0 1-3.2-1v5.7a5.4 5.4 0 1 1-5.4-5.4c.2 0 .5 0 .7.1v2.8a2.6 2.6 0 1 0 2.3 2.6V4z\" />\n      </svg>\n    );\n  }\n  return null;\n}\n\nfunction SocialRender({ block }: BlockRenderProps<Social>) {\n  const items = (block.items ?? []).filter((i) => i.href && i.platform);\n  if (items.length === 0) return null;\n  return (\n    <section className=\"xicms-social\">\n      {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n      <ul className=\"xicms-social__list\">\n        {items.map((it, i) => {\n          // Als functie aangeroepen (geen hooks) zodat `null` echt null is — een JSX-element\n          // zou altijd truthy zijn en de tekst-fallback nooit tonen.\n          const icon = SocialIcon({ platform: it.platform });\n          return (\n            <li key={i}>\n              <a href={it.href} rel=\"noopener noreferrer\" target=\"_blank\" aria-label={it.platform} title={it.platform} className={icon ? \"xicms-social__iconlink\" : undefined}>\n                {icon ?? it.platform}\n              </a>\n            </li>\n          );\n        })}\n      </ul>\n    </section>\n  );\n}\nexport const socialBlock = defineBlock({\n  type: \"social\",\n  schema: SocialBlockSchema,\n  Render: SocialRender,\n  label: \"Social-links\",\n  icon: \"🔗\",\n  defaults: () => ({ items: [{ platform: \"Instagram\", href: \"\" }] }),\n});\n"],"mappings":"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","names":[]}

package/dist/blocks/builtins/Countdown.d.ts

@@ -0,0 +1,18 @@
+import type { z } from "zod";
+export interface Remaining {
+    days: number;
+    hours: number;
+    minutes: number;
+    seconds: number;
+    done: boolean;
+}
+/**
+ * Tikkende afteltimer naar `target`. Client-only (start `null` om hydration-mismatch te voorkomen).
+ * Gedeeld door het volwaardige Countdown-blok en de compacte widget.
+ */
+export declare function useCountdown(target: string): Remaining | null;
+export declare function CountdownDigits({ r, showLabels }: {
+    r: Remaining;
+    showLabels?: boolean;
+}): import("react").JSX.Element;
+export declare const countdownBlock: import("..").BlockDefinition<z.ZodTypeAny>;

package/dist/blocks/builtins/Countdown.js

@@ -0,0 +1,65 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { CountdownBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Heading } from "../ui";
+function compute(target) {
+  const t = new Date(target).getTime();
+  if (Number.isNaN(t)) return null;
+  const diff = t - Date.now();
+  if (diff <= 0) return { days: 0, hours: 0, minutes: 0, seconds: 0, done: true };
+  const s = Math.floor(diff / 1e3);
+  return {
+    days: Math.floor(s / 86400),
+    hours: Math.floor(s % 86400 / 3600),
+    minutes: Math.floor(s % 3600 / 60),
+    seconds: s % 60,
+    done: false
+  };
+}
+function useCountdown(target) {
+  const [r, setR] = useState(null);
+  useEffect(() => {
+    if (!target) return;
+    setR(compute(target));
+    const id = setInterval(() => setR(compute(target)), 1e3);
+    return () => clearInterval(id);
+  }, [target]);
+  return r;
+}
+const UNITS = [
+  { key: "days", label: "dagen" },
+  { key: "hours", label: "uur" },
+  { key: "minutes", label: "min" },
+  { key: "seconds", label: "sec" }
+];
+function CountdownDigits({ r, showLabels = true }) {
+  return /* @__PURE__ */ jsx("div", { className: "xicms-countdown__digits", role: "timer", "aria-live": "off", children: UNITS.map((u) => /* @__PURE__ */ jsxs("div", { className: "xicms-countdown__unit", children: [
+    /* @__PURE__ */ jsx("span", { className: "xicms-countdown__value", children: String(r[u.key]).padStart(2, "0") }),
+    showLabels && /* @__PURE__ */ jsx("span", { className: "xicms-countdown__label", children: u.label })
+  ] }, u.key)) });
+}
+function CountdownRender({ block, mode }) {
+  const r = useCountdown(block.target);
+  if (!block.target) return null;
+  if (r?.done && block.onExpire === "hide" && mode !== "preview") return null;
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-countdown", children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, className: "xicms-countdown__heading", "data-xicms-edit": "heading", children: block.heading }),
+    r === null ? /* @__PURE__ */ jsx("p", { className: "xicms-countdown__loading", "aria-hidden": "true", children: "\u2026" }) : r.done ? /* @__PURE__ */ jsx("p", { className: "xicms-countdown__expired", children: block.expiredText }) : /* @__PURE__ */ jsx(CountdownDigits, { r, showLabels: block.showLabels })
+  ] });
+}
+const countdownBlock = defineBlock({
+  type: "countdown",
+  schema: CountdownBlockSchema,
+  Render: CountdownRender,
+  label: "Aftelteller",
+  icon: "\u23F3",
+  defaults: () => ({ heading: "Nog even tot de start", target: "", expiredText: "Het is zover!", showLabels: true })
+});
+export {
+  CountdownDigits,
+  countdownBlock,
+  useCountdown
+};
+//# sourceMappingURL=Countdown.js.map

package/dist/blocks/builtins/Countdown.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Countdown.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport type { z } from \"zod\";\nimport { CountdownBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Heading } from \"../ui\";\n\nexport interface Remaining {\n  days: number;\n  hours: number;\n  minutes: number;\n  seconds: number;\n  done: boolean;\n}\n\nfunction compute(target: string): Remaining | null {\n  const t = new Date(target).getTime();\n  if (Number.isNaN(t)) return null;\n  const diff = t - Date.now();\n  if (diff <= 0) return { days: 0, hours: 0, minutes: 0, seconds: 0, done: true };\n  const s = Math.floor(diff / 1000);\n  return {\n    days: Math.floor(s / 86400),\n    hours: Math.floor((s % 86400) / 3600),\n    minutes: Math.floor((s % 3600) / 60),\n    seconds: s % 60,\n    done: false,\n  };\n}\n\n/**\n * Tikkende afteltimer naar `target`. Client-only (start `null` om hydration-mismatch te voorkomen).\n * Gedeeld door het volwaardige Countdown-blok en de compacte widget.\n */\nexport function useCountdown(target: string): Remaining | null {\n  const [r, setR] = useState<Remaining | null>(null);\n  useEffect(() => {\n    if (!target) return;\n    setR(compute(target));\n    const id = setInterval(() => setR(compute(target)), 1000);\n    return () => clearInterval(id);\n  }, [target]);\n  return r;\n}\n\nconst UNITS: { key: keyof Remaining; label: string }[] = [\n  { key: \"days\", label: \"dagen\" },\n  { key: \"hours\", label: \"uur\" },\n  { key: \"minutes\", label: \"min\" },\n  { key: \"seconds\", label: \"sec\" },\n];\n\nexport function CountdownDigits({ r, showLabels = true }: { r: Remaining; showLabels?: boolean }) {\n  return (\n    <div className=\"xicms-countdown__digits\" role=\"timer\" aria-live=\"off\">\n      {UNITS.map((u) => (\n        <div key={u.key} className=\"xicms-countdown__unit\">\n          <span className=\"xicms-countdown__value\">{String(r[u.key] as number).padStart(2, \"0\")}</span>\n          {showLabels && <span className=\"xicms-countdown__label\">{u.label}</span>}\n        </div>\n      ))}\n    </div>\n  );\n}\n\ntype Countdown = z.infer<typeof CountdownBlockSchema>;\n\nfunction CountdownRender({ block, mode }: BlockRenderProps<Countdown>) {\n  const r = useCountdown(block.target);\n  if (!block.target) return null;\n  // Na afloop optioneel het hele blok verbergen (bv. een verlopen actie-aankondiging) —\n  // behalve in de editor-preview, anders kan de editor het blok niet meer terugvinden.\n  if (r?.done && block.onExpire === \"hide\" && mode !== \"preview\") return null;\n  return (\n    <section className=\"xicms-countdown\">\n      {block.heading && <Heading level={2} className=\"xicms-countdown__heading\" data-xicms-edit=\"heading\">{block.heading}</Heading>}\n      {r === null ? (\n        <p className=\"xicms-countdown__loading\" aria-hidden=\"true\">…</p>\n      ) : r.done ? (\n        <p className=\"xicms-countdown__expired\">{block.expiredText}</p>\n      ) : (\n        <CountdownDigits r={r} showLabels={block.showLabels} />\n      )}\n    </section>\n  );\n}\n\nexport const countdownBlock = defineBlock({\n  type: \"countdown\",\n  schema: CountdownBlockSchema,\n  Render: CountdownRender,\n  label: \"Aftelteller\",\n  icon: \"⏳\",\n  defaults: () => ({ heading: \"Nog even tot de start\", target: \"\", expiredText: \"Het is zover!\", showLabels: true }),\n});\n"],"mappings":";AAyDQ,SACE,KADF;AAvDR,SAAS,WAAW,gBAAgB;AAEpC,SAAS,4BAA4B;AACrC,SAAS,mBAA0C;AACnD,SAAS,eAAe;AAUxB,SAAS,QAAQ,QAAkC;AACjD,QAAM,IAAI,IAAI,KAAK,MAAM,EAAE,QAAQ;AACnC,MAAI,OAAO,MAAM,CAAC,EAAG,QAAO;AAC5B,QAAM,OAAO,IAAI,KAAK,IAAI;AAC1B,MAAI,QAAQ,EAAG,QAAO,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,KAAK;AAC9E,QAAM,IAAI,KAAK,MAAM,OAAO,GAAI;AAChC,SAAO;AAAA,IACL,MAAM,KAAK,MAAM,IAAI,KAAK;AAAA,IAC1B,OAAO,KAAK,MAAO,IAAI,QAAS,IAAI;AAAA,IACpC,SAAS,KAAK,MAAO,IAAI,OAAQ,EAAE;AAAA,IACnC,SAAS,IAAI;AAAA,IACb,MAAM;AAAA,EACR;AACF;AAMO,SAAS,aAAa,QAAkC;AAC7D,QAAM,CAAC,GAAG,IAAI,IAAI,SAA2B,IAAI;AACjD,YAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,SAAK,QAAQ,MAAM,CAAC;AACpB,UAAM,KAAK,YAAY,MAAM,KAAK,QAAQ,MAAM,CAAC,GAAG,GAAI;AACxD,WAAO,MAAM,cAAc,EAAE;AAAA,EAC/B,GAAG,CAAC,MAAM,CAAC;AACX,SAAO;AACT;AAEA,MAAM,QAAmD;AAAA,EACvD,EAAE,KAAK,QAAQ,OAAO,QAAQ;AAAA,EAC9B,EAAE,KAAK,SAAS,OAAO,MAAM;AAAA,EAC7B,EAAE,KAAK,WAAW,OAAO,MAAM;AAAA,EAC/B,EAAE,KAAK,WAAW,OAAO,MAAM;AACjC;AAEO,SAAS,gBAAgB,EAAE,GAAG,aAAa,KAAK,GAA2C;AAChG,SACE,oBAAC,SAAI,WAAU,2BAA0B,MAAK,SAAQ,aAAU,OAC7D,gBAAM,IAAI,CAAC,MACV,qBAAC,SAAgB,WAAU,yBACzB;AAAA,wBAAC,UAAK,WAAU,0BAA0B,iBAAO,EAAE,EAAE,GAAG,CAAW,EAAE,SAAS,GAAG,GAAG,GAAE;AAAA,IACrF,cAAc,oBAAC,UAAK,WAAU,0BAA0B,YAAE,OAAM;AAAA,OAFzD,EAAE,GAGZ,CACD,GACH;AAEJ;AAIA,SAAS,gBAAgB,EAAE,OAAO,KAAK,GAAgC;AACrE,QAAM,IAAI,aAAa,MAAM,MAAM;AACnC,MAAI,CAAC,MAAM,OAAQ,QAAO;AAG1B,MAAI,GAAG,QAAQ,MAAM,aAAa,UAAU,SAAS,UAAW,QAAO;AACvE,SACE,qBAAC,aAAQ,WAAU,mBAChB;AAAA,UAAM,WAAW,oBAAC,WAAQ,OAAO,GAAG,WAAU,4BAA2B,mBAAgB,WAAW,gBAAM,SAAQ;AAAA,IAClH,MAAM,OACL,oBAAC,OAAE,WAAU,4BAA2B,eAAY,QAAO,oBAAC,IAC1D,EAAE,OACJ,oBAAC,OAAE,WAAU,4BAA4B,gBAAM,aAAY,IAE3D,oBAAC,mBAAgB,GAAM,YAAY,MAAM,YAAY;AAAA,KAEzD;AAEJ;AAEO,MAAM,iBAAiB,YAAY;AAAA,EACxC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,SAAS,yBAAyB,QAAQ,IAAI,aAAa,iBAAiB,YAAY,KAAK;AAClH,CAAC;","names":[]}

package/dist/blocks/builtins/Cta.d.ts

@@ -0,0 +1,2 @@
+import type { z } from "zod";
+export declare const ctaBlock: import("..").BlockDefinition<z.ZodTypeAny>;

package/dist/blocks/builtins/Cta.js

@@ -0,0 +1,52 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CtaBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { VStack, HStack, Card, Heading, Text, Btn } from "../ui";
+function CtaRender({ block }) {
+  if (block.sticky) {
+    return /* @__PURE__ */ jsxs(
+      HStack,
+      {
+        gap: 3,
+        vAlign: "center",
+        hAlign: "between",
+        role: "region",
+        "aria-label": block.title || "Call-to-action",
+        style: { position: "sticky", bottom: 0, zIndex: 30, padding: "0.75rem 1rem", background: "var(--color-background-card)", borderTop: "1px solid var(--color-border)", flexWrap: "wrap" },
+        children: [
+          /* @__PURE__ */ jsx(Text, { weight: "bold", children: block.title || block.text }),
+          /* @__PURE__ */ jsx(Btn, { label: block.buttonLabel, href: block.buttonHref, variant: block.buttonVariant, size: "md" })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    Card,
+    {
+      padding: 6,
+      variant: block.backgroundColor ? "default" : "muted",
+      style: block.backgroundColor ? { background: block.backgroundColor } : void 0,
+      children: /* @__PURE__ */ jsxs(VStack, { gap: 3, hAlign: "center", style: { textAlign: "center" }, children: [
+        block.title && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "title", children: block.title }),
+        block.text && /* @__PURE__ */ jsx(Text, { type: "large", color: "secondary", "data-xicms-edit": "text", children: block.text }),
+        /* @__PURE__ */ jsxs(HStack, { gap: 2, hAlign: "center", style: { flexWrap: "wrap" }, children: [
+          /* @__PURE__ */ jsx(Btn, { label: block.buttonLabel, href: block.buttonHref, variant: block.buttonVariant }),
+          block.button2Label && /* @__PURE__ */ jsx(Btn, { label: block.button2Label, href: block.button2Href ?? "#", variant: "outline" })
+        ] })
+      ] })
+    }
+  );
+}
+const ctaBlock = defineBlock({
+  type: "cta",
+  schema: CtaBlockSchema,
+  Render: CtaRender,
+  label: "Call-to-action",
+  icon: "\u{1F4E3}",
+  defaults: () => ({ title: "Klaar om te starten?", buttonLabel: "Neem contact op", buttonHref: "#contact", buttonVariant: "primary" })
+});
+export {
+  ctaBlock
+};
+//# sourceMappingURL=Cta.js.map

package/dist/blocks/builtins/Cta.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Cta.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { CtaBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { VStack, HStack, Card, Heading, Text, Btn } from \"../ui\";\n\ntype Cta = z.infer<typeof CtaBlockSchema>;\n\nfunction CtaRender({ block }: BlockRenderProps<Cta>) {\n  if (block.sticky) {\n    return (\n      <HStack\n        gap={3}\n        vAlign=\"center\"\n        hAlign=\"between\"\n        role=\"region\"\n        aria-label={block.title || \"Call-to-action\"}\n        style={{ position: \"sticky\", bottom: 0, zIndex: 30, padding: \"0.75rem 1rem\", background: \"var(--color-background-card)\", borderTop: \"1px solid var(--color-border)\", flexWrap: \"wrap\" }}\n      >\n        <Text weight=\"bold\">{block.title || block.text}</Text>\n        <Btn label={block.buttonLabel} href={block.buttonHref} variant={block.buttonVariant} size=\"md\" />\n      </HStack>\n    );\n  }\n  return (\n    <Card\n      padding={6}\n      variant={block.backgroundColor ? \"default\" : \"muted\"}\n      style={block.backgroundColor ? { background: block.backgroundColor } : undefined}\n    >\n      <VStack gap={3} hAlign=\"center\" style={{ textAlign: \"center\" }}>\n        {block.title && <Heading level={2} data-xicms-edit=\"title\">{block.title}</Heading>}\n        {block.text && <Text type=\"large\" color=\"secondary\" data-xicms-edit=\"text\">{block.text}</Text>}\n        <HStack gap={2} hAlign=\"center\" style={{ flexWrap: \"wrap\" }}>\n          <Btn label={block.buttonLabel} href={block.buttonHref} variant={block.buttonVariant} />\n          {block.button2Label && (\n            <Btn label={block.button2Label} href={block.button2Href ?? \"#\"} variant=\"outline\" />\n          )}\n        </HStack>\n      </VStack>\n    </Card>\n  );\n}\n\nexport const ctaBlock = defineBlock({\n  type: \"cta\",\n  schema: CtaBlockSchema,\n  Render: CtaRender,\n  label: \"Call-to-action\",\n  icon: \"📣\",\n  defaults: () => ({ title: \"Klaar om te starten?\", buttonLabel: \"Neem contact op\", buttonHref: \"#contact\", buttonVariant: \"primary\" }),\n});\n"],"mappings":";AAYM,SAQE,KARF;AATN,SAAS,sBAAsB;AAC/B,SAAS,mBAA0C;AACnD,SAAS,QAAQ,QAAQ,MAAM,SAAS,MAAM,WAAW;AAIzD,SAAS,UAAU,EAAE,MAAM,GAA0B;AACnD,MAAI,MAAM,QAAQ;AAChB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,QAAO;AAAA,QACP,QAAO;AAAA,QACP,MAAK;AAAA,QACL,cAAY,MAAM,SAAS;AAAA,QAC3B,OAAO,EAAE,UAAU,UAAU,QAAQ,GAAG,QAAQ,IAAI,SAAS,gBAAgB,YAAY,gCAAgC,WAAW,iCAAiC,UAAU,OAAO;AAAA,QAEtL;AAAA,8BAAC,QAAK,QAAO,QAAQ,gBAAM,SAAS,MAAM,MAAK;AAAA,UAC/C,oBAAC,OAAI,OAAO,MAAM,aAAa,MAAM,MAAM,YAAY,SAAS,MAAM,eAAe,MAAK,MAAK;AAAA;AAAA;AAAA,IACjG;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,SAAS,MAAM,kBAAkB,YAAY;AAAA,MAC7C,OAAO,MAAM,kBAAkB,EAAE,YAAY,MAAM,gBAAgB,IAAI;AAAA,MAEvE,+BAAC,UAAO,KAAK,GAAG,QAAO,UAAS,OAAO,EAAE,WAAW,SAAS,GAC1D;AAAA,cAAM,SAAS,oBAAC,WAAQ,OAAO,GAAG,mBAAgB,SAAS,gBAAM,OAAM;AAAA,QACvE,MAAM,QAAQ,oBAAC,QAAK,MAAK,SAAQ,OAAM,aAAY,mBAAgB,QAAQ,gBAAM,MAAK;AAAA,QACvF,qBAAC,UAAO,KAAK,GAAG,QAAO,UAAS,OAAO,EAAE,UAAU,OAAO,GACxD;AAAA,8BAAC,OAAI,OAAO,MAAM,aAAa,MAAM,MAAM,YAAY,SAAS,MAAM,eAAe;AAAA,UACpF,MAAM,gBACL,oBAAC,OAAI,OAAO,MAAM,cAAc,MAAM,MAAM,eAAe,KAAK,SAAQ,WAAU;AAAA,WAEtF;AAAA,SACF;AAAA;AAAA,EACF;AAEJ;AAEO,MAAM,WAAW,YAAY;AAAA,EAClC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,OAAO,wBAAwB,aAAa,mBAAmB,YAAY,YAAY,eAAe,UAAU;AACrI,CAAC;","names":[]}

package/dist/blocks/builtins/Downloads.d.ts

@@ -0,0 +1,2 @@
+import type { z } from "zod";
+export declare const downloadsBlock: import("..").BlockDefinition<z.ZodTypeAny>;

package/dist/blocks/builtins/Downloads.js

@@ -0,0 +1,32 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { DownloadsBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { Heading } from "../ui";
+import { fileIcon } from "./lib/fileIcon";
+function DownloadsRender({ block }) {
+  const items = (block.items ?? []).filter((d) => d.label && d.href);
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ jsxs("section", { className: "xicms-downloads", children: [
+    block.heading && /* @__PURE__ */ jsx(Heading, { level: 2, "data-xicms-edit": "heading", children: block.heading }),
+    /* @__PURE__ */ jsx("ul", { className: "xicms-downloads__list", children: items.map((d, i) => /* @__PURE__ */ jsx("li", { className: "xicms-downloads__item", children: /* @__PURE__ */ jsxs("a", { className: "xicms-downloads__link", href: d.href, download: true, children: [
+      /* @__PURE__ */ jsx("span", { className: "xicms-downloads__icon", "aria-hidden": "true", children: fileIcon(d.href) }),
+      /* @__PURE__ */ jsx("span", { className: "xicms-downloads__label", children: d.label }),
+      d.meta && /* @__PURE__ */ jsx("span", { className: "xicms-downloads__meta", children: d.meta })
+    ] }) }, i)) })
+  ] });
+}
+const downloadsBlock = defineBlock({
+  type: "downloads",
+  schema: DownloadsBlockSchema,
+  Render: DownloadsRender,
+  label: "Downloads",
+  icon: "\u{1F4E5}",
+  defaults: () => ({
+    heading: "Downloads",
+    items: [{ label: "Brochure (PDF)", href: "", meta: "PDF" }]
+  })
+});
+export {
+  downloadsBlock
+};
+//# sourceMappingURL=Downloads.js.map

package/dist/blocks/builtins/Downloads.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Downloads.tsx"],"sourcesContent":["import type { z } from \"zod\";\nimport { DownloadsBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { Heading } from \"../ui\";\nimport { fileIcon } from \"./lib/fileIcon\";\n\ntype Downloads = z.infer<typeof DownloadsBlockSchema>;\n\n/** Downloadbare documenten (brochures, prijslijsten, voorwaarden). Server-safe. */\nfunction DownloadsRender({ block }: BlockRenderProps<Downloads>) {\n  const items = (block.items ?? []).filter((d) => d.label && d.href);\n  if (items.length === 0) return null;\n  return (\n    <section className=\"xicms-downloads\">\n      {/* Alleen de kop: items worden gefilterd (label && href), dus indexen verschuiven. */}\n      {block.heading && <Heading level={2} data-xicms-edit=\"heading\">{block.heading}</Heading>}\n      <ul className=\"xicms-downloads__list\">\n        {items.map((d, i) => (\n          <li key={i} className=\"xicms-downloads__item\">\n            <a className=\"xicms-downloads__link\" href={d.href} download>\n              <span className=\"xicms-downloads__icon\" aria-hidden=\"true\">{fileIcon(d.href)}</span>\n              <span className=\"xicms-downloads__label\">{d.label}</span>\n              {d.meta && <span className=\"xicms-downloads__meta\">{d.meta}</span>}\n            </a>\n          </li>\n        ))}\n      </ul>\n    </section>\n  );\n}\n\nexport const downloadsBlock = defineBlock({\n  type: \"downloads\",\n  schema: DownloadsBlockSchema,\n  Render: DownloadsRender,\n  label: \"Downloads\",\n  icon: \"📥\",\n  defaults: () => ({\n    heading: \"Downloads\",\n    items: [{ label: \"Brochure (PDF)\", href: \"\", meta: \"PDF\" }],\n  }),\n});\n"],"mappings":"AAewB,cAIZ,YAJY;AAdxB,SAAS,4BAA4B;AACrC,SAAS,mBAA0C;AACnD,SAAS,eAAe;AACxB,SAAS,gBAAgB;AAKzB,SAAS,gBAAgB,EAAE,MAAM,GAAgC;AAC/D,QAAM,SAAS,MAAM,SAAS,CAAC,GAAG,OAAO,CAAC,MAAM,EAAE,SAAS,EAAE,IAAI;AACjE,MAAI,MAAM,WAAW,EAAG,QAAO;AAC/B,SACE,qBAAC,aAAQ,WAAU,mBAEhB;AAAA,UAAM,WAAW,oBAAC,WAAQ,OAAO,GAAG,mBAAgB,WAAW,gBAAM,SAAQ;AAAA,IAC9E,oBAAC,QAAG,WAAU,yBACX,gBAAM,IAAI,CAAC,GAAG,MACb,oBAAC,QAAW,WAAU,yBACpB,+BAAC,OAAE,WAAU,yBAAwB,MAAM,EAAE,MAAM,UAAQ,MACzD;AAAA,0BAAC,UAAK,WAAU,yBAAwB,eAAY,QAAQ,mBAAS,EAAE,IAAI,GAAE;AAAA,MAC7E,oBAAC,UAAK,WAAU,0BAA0B,YAAE,OAAM;AAAA,MACjD,EAAE,QAAQ,oBAAC,UAAK,WAAU,yBAAyB,YAAE,MAAK;AAAA,OAC7D,KALO,CAMT,CACD,GACH;AAAA,KACF;AAEJ;AAEO,MAAM,iBAAiB,YAAY;AAAA,EACxC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO;AAAA,IACf,SAAS;AAAA,IACT,OAAO,CAAC,EAAE,OAAO,kBAAkB,MAAM,IAAI,MAAM,MAAM,CAAC;AAAA,EAC5D;AACF,CAAC;","names":[]}

package/dist/blocks/builtins/Elements.d.ts

@@ -0,0 +1,4 @@
+import type { z } from "zod";
+export declare const buttonsBlock: import("..").BlockDefinition<z.ZodTypeAny>;
+export declare const quoteBlock: import("..").BlockDefinition<z.ZodTypeAny>;
+export declare const dividerBlock: import("..").BlockDefinition<z.ZodTypeAny>;

package/dist/blocks/builtins/Elements.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ButtonsBlockSchema, QuoteBlockSchema, DividerBlockSchema } from "../../schema/blocks";
+import { defineBlock } from "../registry";
+import { HStack, VStack, Card, Text, Btn, Divider } from "../ui";
+function ButtonsRender({ block }) {
+  const items = (block.items ?? []).filter((b) => b.label);
+  if (items.length === 0) return null;
+  const hAlign = block.align === "center" ? "center" : block.align === "right" ? "end" : "start";
+  return /* @__PURE__ */ jsx(HStack, { gap: 2, hAlign, style: { flexWrap: "wrap" }, children: items.map((b, i) => /* @__PURE__ */ jsx(Btn, { label: b.label, href: b.href, variant: b.variant }, i)) });
+}
+const buttonsBlock = defineBlock({
+  type: "buttons",
+  schema: ButtonsBlockSchema,
+  Render: ButtonsRender,
+  label: "Knoppen",
+  icon: "\u{1F518}",
+  defaults: () => ({ align: "left", items: [{ label: "Knop", href: "#", variant: "primary" }] })
+});
+function QuoteRender({ block }) {
+  if (!block.text) return null;
+  return /* @__PURE__ */ jsx(Card, { padding: 5, variant: "muted", children: /* @__PURE__ */ jsxs(VStack, { gap: 2, as: "figure", style: { margin: 0 }, children: [
+    /* @__PURE__ */ jsxs(Text, { type: "large", as: "p", style: { fontStyle: "italic" }, children: [
+      "\u201C",
+      /* @__PURE__ */ jsx("span", { "data-xicms-edit": "text", children: block.text }),
+      "\u201D"
+    ] }),
+    (block.author || block.role) && /* @__PURE__ */ jsxs(Text, { as: "label", color: "secondary", children: [
+      "\u2014 ",
+      block.author,
+      block.role ? ` \xB7 ${block.role}` : ""
+    ] })
+  ] }) });
+}
+const quoteBlock = defineBlock({
+  type: "quote",
+  schema: QuoteBlockSchema,
+  Render: QuoteRender,
+  label: "Uitspraak",
+  icon: "\u275D",
+  defaults: () => ({ text: "Een krachtige uitspraak.", author: "" })
+});
+function DividerRender({ block }) {
+  const pad = block.spacing === "sm" ? "0.75rem" : block.spacing === "lg" ? "3rem" : "1.5rem";
+  if (block.variant === "space") return /* @__PURE__ */ jsx("div", { style: { height: pad }, "aria-hidden": "true" });
+  if (block.variant === "dots") {
+    return /* @__PURE__ */ jsx("div", { style: { textAlign: "center", padding: `${pad} 0`, color: "var(--color-text-secondary)", letterSpacing: "0.5em" }, "aria-hidden": "true", children: "\u2022 \u2022 \u2022" });
+  }
+  return /* @__PURE__ */ jsx("div", { style: { padding: `${pad} 0` }, children: /* @__PURE__ */ jsx(Divider, { variant: "subtle" }) });
+}
+const dividerBlock = defineBlock({
+  type: "divider",
+  schema: DividerBlockSchema,
+  Render: DividerRender,
+  label: "Scheiding",
+  icon: "\u2796",
+  defaults: () => ({ variant: "line", spacing: "md" })
+});
+export {
+  buttonsBlock,
+  dividerBlock,
+  quoteBlock
+};
+//# sourceMappingURL=Elements.js.map

package/dist/blocks/builtins/Elements.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/blocks/builtins/Elements.tsx"],"sourcesContent":["\"use client\";\n\nimport type { z } from \"zod\";\nimport { ButtonsBlockSchema, QuoteBlockSchema, DividerBlockSchema } from \"../../schema/blocks\";\nimport { defineBlock, type BlockRenderProps } from \"../registry\";\nimport { HStack, VStack, Card, Text, Btn, Divider } from \"../ui\";\n\n/* ── Buttons (knopgroep) ─────────────────────────────────────────────────── */\ntype Buttons = z.infer<typeof ButtonsBlockSchema>;\nfunction ButtonsRender({ block }: BlockRenderProps<Buttons>) {\n  const items = (block.items ?? []).filter((b) => b.label);\n  if (items.length === 0) return null;\n  const hAlign = block.align === \"center\" ? \"center\" : block.align === \"right\" ? \"end\" : \"start\";\n  return (\n    <HStack gap={2} hAlign={hAlign} style={{ flexWrap: \"wrap\" }}>\n      {items.map((b, i) => (\n        <Btn key={i} label={b.label} href={b.href} variant={b.variant} />\n      ))}\n    </HStack>\n  );\n}\nexport const buttonsBlock = defineBlock({\n  type: \"buttons\",\n  schema: ButtonsBlockSchema,\n  Render: ButtonsRender,\n  label: \"Knoppen\",\n  icon: \"🔘\",\n  defaults: () => ({ align: \"left\", items: [{ label: \"Knop\", href: \"#\", variant: \"primary\" }] }),\n});\n\n/* ── Quote (uitspraak) ───────────────────────────────────────────────────── */\ntype Quote = z.infer<typeof QuoteBlockSchema>;\nfunction QuoteRender({ block }: BlockRenderProps<Quote>) {\n  if (!block.text) return null;\n  return (\n    <Card padding={5} variant=\"muted\">\n      <VStack gap={2} as=\"figure\" style={{ margin: 0 }}>\n        <Text type=\"large\" as=\"p\" style={{ fontStyle: \"italic\" }}>“<span data-xicms-edit=\"text\">{block.text}</span>”</Text>\n        {(block.author || block.role) && (\n          <Text as=\"label\" color=\"secondary\">\n            — {block.author}\n            {block.role ? ` · ${block.role}` : \"\"}\n          </Text>\n        )}\n      </VStack>\n    </Card>\n  );\n}\nexport const quoteBlock = defineBlock({\n  type: \"quote\",\n  schema: QuoteBlockSchema,\n  Render: QuoteRender,\n  label: \"Uitspraak\",\n  icon: \"❝\",\n  defaults: () => ({ text: \"Een krachtige uitspraak.\", author: \"\" }),\n});\n\n/* ── Divider (scheiding) ─────────────────────────────────────────────────── */\ntype DividerBlk = z.infer<typeof DividerBlockSchema>;\nfunction DividerRender({ block }: BlockRenderProps<DividerBlk>) {\n  const pad = block.spacing === \"sm\" ? \"0.75rem\" : block.spacing === \"lg\" ? \"3rem\" : \"1.5rem\";\n  if (block.variant === \"space\") return <div style={{ height: pad }} aria-hidden=\"true\" />;\n  if (block.variant === \"dots\") {\n    return (\n      <div style={{ textAlign: \"center\", padding: `${pad} 0`, color: \"var(--color-text-secondary)\", letterSpacing: \"0.5em\" }} aria-hidden=\"true\">\n        • • •\n      </div>\n    );\n  }\n  return <div style={{ padding: `${pad} 0` }}><Divider variant=\"subtle\" /></div>;\n}\nexport const dividerBlock = defineBlock({\n  type: \"divider\",\n  schema: DividerBlockSchema,\n  Render: DividerRender,\n  label: \"Scheiding\",\n  icon: \"➖\",\n  defaults: () => ({ variant: \"line\", spacing: \"md\" }),\n});\n"],"mappings":";AAgBQ,cAqBA,YArBA;AAbR,SAAS,oBAAoB,kBAAkB,0BAA0B;AACzE,SAAS,mBAA0C;AACnD,SAAS,QAAQ,QAAQ,MAAM,MAAM,KAAK,eAAe;AAIzD,SAAS,cAAc,EAAE,MAAM,GAA8B;AAC3D,QAAM,SAAS,MAAM,SAAS,CAAC,GAAG,OAAO,CAAC,MAAM,EAAE,KAAK;AACvD,MAAI,MAAM,WAAW,EAAG,QAAO;AAC/B,QAAM,SAAS,MAAM,UAAU,WAAW,WAAW,MAAM,UAAU,UAAU,QAAQ;AACvF,SACE,oBAAC,UAAO,KAAK,GAAG,QAAgB,OAAO,EAAE,UAAU,OAAO,GACvD,gBAAM,IAAI,CAAC,GAAG,MACb,oBAAC,OAAY,OAAO,EAAE,OAAO,MAAM,EAAE,MAAM,SAAS,EAAE,WAA5C,CAAqD,CAChE,GACH;AAEJ;AACO,MAAM,eAAe,YAAY;AAAA,EACtC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,OAAO,QAAQ,OAAO,CAAC,EAAE,OAAO,QAAQ,MAAM,KAAK,SAAS,UAAU,CAAC,EAAE;AAC9F,CAAC;AAID,SAAS,YAAY,EAAE,MAAM,GAA4B;AACvD,MAAI,CAAC,MAAM,KAAM,QAAO;AACxB,SACE,oBAAC,QAAK,SAAS,GAAG,SAAQ,SACxB,+BAAC,UAAO,KAAK,GAAG,IAAG,UAAS,OAAO,EAAE,QAAQ,EAAE,GAC7C;AAAA,yBAAC,QAAK,MAAK,SAAQ,IAAG,KAAI,OAAO,EAAE,WAAW,SAAS,GAAG;AAAA;AAAA,MAAC,oBAAC,UAAK,mBAAgB,QAAQ,gBAAM,MAAK;AAAA,MAAO;AAAA,OAAC;AAAA,KAC1G,MAAM,UAAU,MAAM,SACtB,qBAAC,QAAK,IAAG,SAAQ,OAAM,aAAY;AAAA;AAAA,MAC9B,MAAM;AAAA,MACR,MAAM,OAAO,SAAM,MAAM,IAAI,KAAK;AAAA,OACrC;AAAA,KAEJ,GACF;AAEJ;AACO,MAAM,aAAa,YAAY;AAAA,EACpC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,MAAM,4BAA4B,QAAQ,GAAG;AAClE,CAAC;AAID,SAAS,cAAc,EAAE,MAAM,GAAiC;AAC9D,QAAM,MAAM,MAAM,YAAY,OAAO,YAAY,MAAM,YAAY,OAAO,SAAS;AACnF,MAAI,MAAM,YAAY,QAAS,QAAO,oBAAC,SAAI,OAAO,EAAE,QAAQ,IAAI,GAAG,eAAY,QAAO;AACtF,MAAI,MAAM,YAAY,QAAQ;AAC5B,WACE,oBAAC,SAAI,OAAO,EAAE,WAAW,UAAU,SAAS,GAAG,GAAG,MAAM,OAAO,+BAA+B,eAAe,QAAQ,GAAG,eAAY,QAAO,kCAE3I;AAAA,EAEJ;AACA,SAAO,oBAAC,SAAI,OAAO,EAAE,SAAS,GAAG,GAAG,KAAK,GAAG,8BAAC,WAAQ,SAAQ,UAAS,GAAE;AAC1E;AACO,MAAM,eAAe,YAAY;AAAA,EACtC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,OAAO,EAAE,SAAS,QAAQ,SAAS,KAAK;AACpD,CAAC;","names":[]}

package/dist/blocks/builtins/Embed.d.ts

@@ -0,0 +1,2 @@
+import type { z } from "zod";
+export declare const embedBlock: import("..").BlockDefinition<z.ZodTypeAny>;